@lobehub/ui 5.61.1 → 5.62.1

package/es/base-ui/index.d.mts

@@ -211,7 +211,7 @@ import { styles as styles$10 } from "./Switch/style.mjs";
 import { SwitchIcon, SwitchRoot, SwitchThumb, useSwitchContext } from "./Switch/atoms.mjs";
 import Switch from "./Switch/Switch.mjs";
 import "./Switch/index.mjs";
-import { FilterValue, SortOrder, TableBreakpoint, TableCellAttributes, TableClassNames, TableColumn, TableColumnEllipsis, TableColumnFilterItem, TableColumnFixed, TableColumnGroupType, TableColumnSorter, TableColumnTitle, TableColumnTitleProps, TableColumnType, TableColumnsType, TableCompareFn, TableComponents, TableComponentsSemanticName, TableCurrentDataSource, TableExpandIconProps, TableExpandableConfig, TableExpandedRowRender, TableFilterDropdownPopupProps, TableFilterDropdownProps, TableFilters, TableHeaderCellAttributes, TableLegacySemanticName, TableLoadingConfig, TableLocale, TablePaginationConfig, TablePaginationPlacement, TablePaginationPosition, TableProps, TableRef, TableRenderedCell, TableRowClassName, TableRowSelectMethod, TableRowSelection, TableRowSelectionCheckboxProps, TableRowSelectionType, TableScrollToConfig, TableSelectionItem, TableSelectionPreset, TableSemanticInfo, TableSemanticName, TableSize, TableSorterResult, TableSorterTooltipProps, TableSticky, TableStyles, TableSummaryCellProps, TableSummaryProps, TableSummaryRowProps, TableVariant } from "./Table/type.mjs";
+import { FilterValue, SortOrder, TableBreakpoint, TableCellAttributes, TableClassNames, TableColumn, TableColumnEllipsis, TableColumnFilterItem, TableColumnFixed, TableColumnGroupType, TableColumnSorter, TableColumnTitle, TableColumnTitleProps, TableColumnType, TableColumnsType, TableCompareFn, TableComponents, TableComponentsSemanticName, TableCurrentDataSource, TableExpandIconProps, TableExpandableConfig, TableExpandedRowRender, TableFilterDropdownPopupProps, TableFilterDropdownProps, TableFilters, TableHeaderCellAttributes, TableLegacySemanticName, TableLoadingConfig, TableLocale, TableMultipleSorterResult, TablePaginationConfig, TablePaginationPlacement, TablePaginationPosition, TableProps, TableRef, TableRenderedCell, TableRowClassName, TableRowSelectMethod, TableRowSelection, TableRowSelectionCheckboxProps, TableRowSelectionType, TableScrollToConfig, TableSelectionItem, TableSelectionPreset, TableSemanticInfo, TableSemanticName, TableSize, TableSorterResult, TableSorterTooltipProps, TableSticky, TableStyles, TableSummaryCellProps, TableSummaryProps, TableSummaryRowProps, TableVariant } from "./Table/type.mjs";
 import { TableColumnProps } from "./Table/Column.mjs";
 import { TableColumnGroupProps } from "./Table/ColumnGroup.mjs";
 import Table from "./Table/Table.mjs";
@@ -230,4 +230,4 @@ import { TreeClassNames, TreeDataNode, TreeFlatRow, TreeProps, TreeStyles } from
 import Tree from "./Tree/Tree.mjs";
 import { conductCheck, flattenVisible, getAllKeys } from "./Tree/utils.mjs";
 import "./Tree/index.mjs";
-export { Accordion, type AccordionClassNames, AccordionHeader, type AccordionHeaderProps, type AccordionIndicatorPlacement, AccordionItem, type AccordionItemProps, type AccordionItemType, AccordionPanel, type AccordionPanelProps, type AccordionProps, AccordionRoot, type AccordionRootProps, type AccordionStyles, AccordionTrigger, type AccordionTriggerProps, type AccordionVariant, ActionIcon, type ActionIconClassNames, type ActionIconOutdent, type ActionIconProps, type ActionIconSize, type ActionIconStyles, type ActionIconVariant, Alert, type AlertClassNames, type AlertCloseConfig, type AlertProps, type AlertRef, type AlertStyles, type AlertType, type AlertVariant, Anchor, type AnchorItem, type AnchorProps, AutoComplete, type AutoCompleteOption, type AutoCompleteProps, Avatar, type AvatarClassNames, AvatarGroup, type AvatarGroupItemType, type AvatarGroupProps, type AvatarProps, type AvatarStyles, Badge, type BadgeProps, type BadgeSize, type BadgeStatus, type BaseModalProps, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Burger, type BurgerProps, Button, type ButtonIconPosition, type ButtonOutdent, type ButtonProps, type ButtonShape, type ButtonSize, type ButtonType, type CalendarMode, Carousel, type CarouselProps, type CarouselRef, _default as Checkbox, CheckboxGroup, type CheckboxGroupOption, type CheckboxGroupProps, type CheckboxProps, type CheckboxShape, Collapsible, type CollapsibleProps, ColorPicker, type ColorPickerProps, type ContextMenuCheckboxItem, ContextMenuHost, type ContextMenuInterceptor, type ContextMenuItem, ContextMenuTrigger, type ControlSize, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, type DateRangeValue, Descriptions, type DescriptionsItem, type DescriptionsProps, Divider, type DividerOrientation, type DividerProps, DraggablePanel, DraggablePanelBody, type DraggablePanelBodyProps, DraggablePanelContainer, type DraggablePanelContainerProps, DraggablePanelContent, type DraggablePanelContentProps, DraggablePanelFooter, type DraggablePanelFooterProps, DraggablePanelHandle, type DraggablePanelHandleProps, DraggablePanelHeader, type DraggablePanelHeaderProps, type DraggablePanelPlacement, type DraggablePanelProps, DraggablePanelRoot, type DraggablePanelRootProps, type DraggablePanelSize, DraggablePanelToggle, type DraggablePanelToggleProps, Drawer, DrawerBackdrop, type DrawerBackdropProps, DrawerClose, type DrawerCloseProps, DrawerContent, type DrawerContentProps, DrawerDescription, type DrawerDescriptionProps, DrawerFooter, type DrawerFooterProps, DrawerHeader, type DrawerHeaderProps, type DrawerPlacement, DrawerPopup, type DrawerPopupProps, DrawerPortal, type DrawerPortalProps, type DrawerProps, type DrawerPush, DrawerRoot, type DrawerRootProps, type DrawerSemanticNames, type DrawerSemanticStyles, DrawerTitle, type DrawerTitleProps, DrawerTrigger, type DrawerTriggerProps, type DropdownItem, DropdownMenu, type DropdownMenuCheckboxItem, DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, type DropdownMenuCheckboxItemProps, DropdownMenuFooter, type DropdownMenuFooterProps, DropdownMenuGroup, DropdownMenuGroupLabel, type DropdownMenuGroupLabelProps, DropdownMenuHeader, type DropdownMenuHeaderProps, DropdownMenuItem, DropdownMenuItemContent, type DropdownMenuItemContentProps, DropdownMenuItemDesc, type DropdownMenuItemDescProps, DropdownMenuItemExtra, type DropdownMenuItemExtraProps, DropdownMenuItemIcon, type DropdownMenuItemIconProps, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, type DropdownMenuItemLabelGroupProps, type DropdownMenuItemLabelProps, type DropdownMenuItemProps, type DropdownMenuPlacement, DropdownMenuPopup, type DropdownMenuPopupProps, DropdownMenuPortal, type DropdownMenuPortalProps, DropdownMenuPositioner, type DropdownMenuPositionerProps, type DropdownMenuProps, DropdownMenuRoot, DropdownMenuScrollViewport, type DropdownMenuScrollViewportProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuSubmenuArrow, type DropdownMenuSubmenuArrowProps, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, type DropdownMenuSubmenuTriggerProps, DropdownMenuSwitchItem, type DropdownMenuSwitchItemProps, type DropdownMenuSwitchItem$1 as DropdownMenuSwitchItemType, DropdownMenuTrigger, type DropdownMenuTriggerProps, type FilterValue, type FloatingCollisionPadding, FloatingPanel, type FloatingPanelOffset, type FloatingPanelPlacement, type FloatingPanelProps, FloatingSheet, type FloatingSheetProps, FocusScope, type FocusScopeProps, Form, type FormContextValue, FormDivider, type FormDividerProps, FormField, type FormFieldProps, FormFlatGroup, type FormFlatGroupProps, FormFooter, type FormFooterProps, FormGroup, type FormGroupItemType, type FormGroupProps, type FormLayout, type FormProps, FormSubmitFooter, type FormSubmitFooterProps, FormTitle, type FormTitleProps, type FormValues, type FormVariant, type IconSpaceMode, type ImperativeModalProps, _default$1 as Input, type InputClassNames, _default$2 as InputNumber, type InputNumberProps, InputOTP, type InputOTPProps, _default$3 as InputPassword, type InputPasswordProps, type InputProps, type InputSize, type InputStyles, type InputVariant, type ItemsType, List, type ListClickInfo, type ListDividerType, type ListItem, type ListItemType, type ListProps, type ListSemanticName, Modal, ModalBackdrop, type ModalBackdropProps, ModalClose, type ModalCloseProps, type ModalComponentProps, type ModalConfirmConfig, ModalContent, type ModalContentProps, ModalContext, type ModalContextValue, ModalDescription, type ModalDescriptionProps, ModalFooter, type ModalFooterProps, ModalHeader, type ModalHeaderProps, ModalHost, type ModalHostProps, type ModalInstance, ModalPopup, type ModalPopupProps, ModalPortal, type ModalPortalProps, ModalRoot, type ModalRootProps, type ModalSystem, ModalTitle, type ModalTitleProps, ModalTrigger, type ModalTriggerProps, ModalViewport, type ModalViewportProps, Pagination, type PaginationAlign, type PaginationItemType, type PaginationProps, type PaginationSemanticName, type PaginationSize, type PaginationSizeChangerProps, Popover, PopoverArrow, type PopoverArrowAtomProps, PopoverArrowIcon, PopoverBackdrop, type PopoverBackdropProps, type PopoverContextValue, PopoverGroup, type PopoverGroupHandle, type PopoverGroupItem, type PopoverPlacement, PopoverPopup, type PopoverPopupAtomProps, type PopoverPopupProps, PopoverPortal, type PopoverPortalAtomProps, type PopoverPortalProps, PopoverPositioner, type PopoverPositionerAtomProps, type PopoverPositionerProps, type PopoverProps, PopoverProvider, PopoverRoot, type PopoverTrigger, type PopoverTriggerComponentProps, PopoverTriggerElement, type PopoverTriggerElementProps, PopoverViewport, type PopoverViewportAtomProps, Progress, type ProgressProps, type ProgressSize, type ProgressStatus, type ProgressType, type ProgressVariant, QRCode, type QRCodeErrorLevel, type QRCodeProps, type QRCodeStatus, Radio, RadioGroup, type RadioGroupOption, type RadioGroupProps, type RadioProps, Rate, type RateProps, Result, type ResultProps, type ResultStatus, ScrollArea, ScrollAreaContent, type ScrollAreaContentProps, ScrollAreaCorner, type ScrollAreaCornerProps, type ScrollAreaProps, ScrollAreaRoot, type ScrollAreaRootProps, ScrollAreaScrollbar, type ScrollAreaScrollbarProps, ScrollAreaThumb, type ScrollAreaThumbProps, ScrollAreaViewport, type ScrollAreaViewportProps, Segmented, type SegmentedClassNames, SegmentedIndicator, type SegmentedIndicatorProps, SegmentedItem, SegmentedItemIcon, SegmentedItemLabel, type SegmentedItemProps, type SegmentedOption, type SegmentedOptions, type SegmentedOrientation, type SegmentedProps, SegmentedRoot, type SegmentedRootProps, type SegmentedSize, type SegmentedStyles, type SegmentedVariant, Select, SelectArrow, type SelectArrowProps, SelectBackdrop, type SelectBehaviorVariant, type SelectClassNames, SelectGroup, SelectGroupLabel, type SelectGroupLabelProps, type SelectGroupProps, SelectIcon, type SelectIconProps, type SelectIndicatorVariant, SelectItem, SelectItemIndicator, type SelectItemIndicatorProps, type SelectItemProps, SelectItemText, type SelectItemTextProps, SelectList, type SelectListProps, type SelectOption, type SelectOptionGroup, type SelectOptions, SelectPopup, type SelectPopupProps, SelectPortal, type SelectPortalProps, SelectPositioner, type SelectPositionerProps, type SelectProps, SelectRoot, type SelectRootChangeEventDetails, SelectScrollDownArrow, type SelectScrollDownArrowProps, SelectScrollUpArrow, type SelectScrollUpArrowProps, SelectSeparator, type SelectSize, SelectTrigger, type SelectTriggerProps, SelectValue, type SelectValueProps, type SelectVariant, Skeleton, type SkeletonAnimation, SkeletonAvatar, type SkeletonAvatarProps, type SkeletonProps, SkeletonText, type SkeletonTextProps, Slider, type SliderProps, SliderWithInput, type SliderWithInputProps, type SortOrder, Spin, type SpinProps, type SpinSize, type SpinVariant, _default$4 as SplitButton, type SplitButtonMenuProps, type SplitButtonProps, Statistic, type StatisticProps, type StepItem, type StepStatus, Steps, type StepsProps, Switch, type SwitchChangeEventHandler, type SwitchClassNames, type SwitchClickEventHandler, type SwitchContextType, SwitchIcon, type SwitchIconPosition, type SwitchIconProps, type SwitchProps, SwitchRoot, type SwitchRootProps, type SwitchSize, type SwitchStyles, SwitchThumb, type SwitchThumbProps, Table, type TableBreakpoint, type TableCellAttributes, type TableClassNames, type TableColumn, type TableColumnEllipsis, type TableColumnFilterItem, type TableColumnFixed, type TableColumnGroupProps, type TableColumnGroupType, type TableColumnProps, type TableColumnSorter, type TableColumnTitle, type TableColumnTitleProps, type TableColumnType, type TableColumnsType, type TableCompareFn, type TableComponents, type TableComponentsSemanticName, type TableCurrentDataSource, type TableExpandIconProps, type TableExpandableConfig, type TableExpandedRowRender, type TableFilterDropdownPopupProps, type TableFilterDropdownProps, type TableFilters, type TableHeaderCellAttributes, type TableLegacySemanticName, type TableLoadingConfig, type TableLocale, type TablePaginationConfig, type TablePaginationPlacement, type TablePaginationPosition, type TableProps, type TableRef, type TableRenderedCell, type TableRowClassName, type TableRowSelectMethod, type TableRowSelection, type TableRowSelectionCheckboxProps, type TableRowSelectionType, type TableScrollToConfig, type TableSelectionItem, type TableSelectionPreset, type TableSemanticInfo, type TableSemanticName, type TableSize, type TableSorterResult, type TableSorterTooltipProps, type TableSticky, type TableStyles, type TableSummaryCellProps, type TableSummaryProps, type TableSummaryRowProps, type TableVariant, Tabs, type TabsClassNames, TabsIndicator, type TabsIndicatorProps, type TabsItem, TabsList, type TabsListProps, type TabsOrientation, TabsPanel, type TabsPanelProps, type TabsProps, TabsRoot, type TabsRootProps, type TabsSize, type TabsStyles, TabsTab, type TabsTabProps, type TabsVariant, Tag, type TagClassNames, type TagProps, type TagShape, type TagSize, type TagStyles, type TagVariant, Text, _default$5 as TextArea, type TextAreaAutoSize, type TextAreaProps, type TextClassNames, type TextProps, type TextStyles, type ToastAPI, ToastHost, type ToastHostProps, type ToastInstance, type ToastOptions, type ToastPosition, type ToastPromiseOptions, type ToastProps, type ToastType, ToggleGroup, type ToggleGroupClassNames, ToggleGroupItem, ToggleGroupItemIcon, ToggleGroupItemLabel, type ToggleGroupItemProps, type ToggleGroupOption, type ToggleGroupProps, ToggleGroupRoot, type ToggleGroupRootProps, type ToggleGroupSize, type ToggleGroupStyles, type ToggleGroupVariant, Tooltip, TooltipGroup, type TooltipGroupProps, type TooltipPlacement, type TooltipPopupComponentProps, type TooltipPortalProps, type TooltipPositionerProps, type TooltipProps, type TooltipTriggerComponentProps, Tree, type TreeClassNames, type TreeDataNode, type TreeFlatRow, type TreeProps, type TreeStyles, Upload, type UploadChangeInfo, UploadDragger, type UploadProps, type UseScopeArrowNavOptions, type UseScopeSwitcherOptions, type VirtualListProps, styles as accordionStyles, styles$1 as actionIconStyles, styles$2 as alertStyles, styles$3 as autoCompleteStyles, backdropTransition, buttonPaddingInline, styles$4 as buttonStyles, styles$5 as checkboxStyles, closeContextMenu, colorsPreset, colorsPresetSystem, conductCheck, confirmModal, controlHeight, createModal, createModalSystem, drawerBackdropTransition, flattenVisible, focusScopeItem, styles$6 as focusScopeStyles, formatStatisticValue, getActiveScopeId, getAllKeys, getDrawerMotionConfig, getFloatingCollisionPadding, getLastFocusedItem, styles$7 as inputStyles, rootVariants as inputVariants, modalMotionConfig, notifyScopeItemFocus, parseTrigger, presetColors, presetSystemColors, styles$8 as radioStyles, registerScope, renderDropdownMenuItems, setActiveScope, setContextMenuInterceptor, setFloatingCollisionPadding, setLastFocusedItem, showContextMenu, styles$9 as sliderStyles, styles$10 as switchStyles, styles$11 as tabsStyles, groupStyles as textGroupStyles, styles$12 as textStyles, variants as textVariants, toast, styles$13 as toggleGroupStyles, styles$14 as treeStyles, updateContextMenuItems, useAccordionContext, useActiveScopeId, useDraggablePanelContext, useDrawerActions, useDrawerOpen, useFocusScopeActive, useFocusScopeId, useFormContext, useModalActions, useModalContext, useModalOpen, usePopoverContext, usePopoverGroupHandle, usePopoverPortalContainer, useScopeArrowNav, useScopeSwitcher, useSwitchContext, useTabsContext, useToast };
+export { Accordion, type AccordionClassNames, AccordionHeader, type AccordionHeaderProps, type AccordionIndicatorPlacement, AccordionItem, type AccordionItemProps, type AccordionItemType, AccordionPanel, type AccordionPanelProps, type AccordionProps, AccordionRoot, type AccordionRootProps, type AccordionStyles, AccordionTrigger, type AccordionTriggerProps, type AccordionVariant, ActionIcon, type ActionIconClassNames, type ActionIconOutdent, type ActionIconProps, type ActionIconSize, type ActionIconStyles, type ActionIconVariant, Alert, type AlertClassNames, type AlertCloseConfig, type AlertProps, type AlertRef, type AlertStyles, type AlertType, type AlertVariant, Anchor, type AnchorItem, type AnchorProps, AutoComplete, type AutoCompleteOption, type AutoCompleteProps, Avatar, type AvatarClassNames, AvatarGroup, type AvatarGroupItemType, type AvatarGroupProps, type AvatarProps, type AvatarStyles, Badge, type BadgeProps, type BadgeSize, type BadgeStatus, type BaseModalProps, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Burger, type BurgerProps, Button, type ButtonIconPosition, type ButtonOutdent, type ButtonProps, type ButtonShape, type ButtonSize, type ButtonType, type CalendarMode, Carousel, type CarouselProps, type CarouselRef, _default as Checkbox, CheckboxGroup, type CheckboxGroupOption, type CheckboxGroupProps, type CheckboxProps, type CheckboxShape, Collapsible, type CollapsibleProps, ColorPicker, type ColorPickerProps, type ContextMenuCheckboxItem, ContextMenuHost, type ContextMenuInterceptor, type ContextMenuItem, ContextMenuTrigger, type ControlSize, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, type DateRangeValue, Descriptions, type DescriptionsItem, type DescriptionsProps, Divider, type DividerOrientation, type DividerProps, DraggablePanel, DraggablePanelBody, type DraggablePanelBodyProps, DraggablePanelContainer, type DraggablePanelContainerProps, DraggablePanelContent, type DraggablePanelContentProps, DraggablePanelFooter, type DraggablePanelFooterProps, DraggablePanelHandle, type DraggablePanelHandleProps, DraggablePanelHeader, type DraggablePanelHeaderProps, type DraggablePanelPlacement, type DraggablePanelProps, DraggablePanelRoot, type DraggablePanelRootProps, type DraggablePanelSize, DraggablePanelToggle, type DraggablePanelToggleProps, Drawer, DrawerBackdrop, type DrawerBackdropProps, DrawerClose, type DrawerCloseProps, DrawerContent, type DrawerContentProps, DrawerDescription, type DrawerDescriptionProps, DrawerFooter, type DrawerFooterProps, DrawerHeader, type DrawerHeaderProps, type DrawerPlacement, DrawerPopup, type DrawerPopupProps, DrawerPortal, type DrawerPortalProps, type DrawerProps, type DrawerPush, DrawerRoot, type DrawerRootProps, type DrawerSemanticNames, type DrawerSemanticStyles, DrawerTitle, type DrawerTitleProps, DrawerTrigger, type DrawerTriggerProps, type DropdownItem, DropdownMenu, type DropdownMenuCheckboxItem, DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, type DropdownMenuCheckboxItemProps, DropdownMenuFooter, type DropdownMenuFooterProps, DropdownMenuGroup, DropdownMenuGroupLabel, type DropdownMenuGroupLabelProps, DropdownMenuHeader, type DropdownMenuHeaderProps, DropdownMenuItem, DropdownMenuItemContent, type DropdownMenuItemContentProps, DropdownMenuItemDesc, type DropdownMenuItemDescProps, DropdownMenuItemExtra, type DropdownMenuItemExtraProps, DropdownMenuItemIcon, type DropdownMenuItemIconProps, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, type DropdownMenuItemLabelGroupProps, type DropdownMenuItemLabelProps, type DropdownMenuItemProps, type DropdownMenuPlacement, DropdownMenuPopup, type DropdownMenuPopupProps, DropdownMenuPortal, type DropdownMenuPortalProps, DropdownMenuPositioner, type DropdownMenuPositionerProps, type DropdownMenuProps, DropdownMenuRoot, DropdownMenuScrollViewport, type DropdownMenuScrollViewportProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuSubmenuArrow, type DropdownMenuSubmenuArrowProps, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, type DropdownMenuSubmenuTriggerProps, DropdownMenuSwitchItem, type DropdownMenuSwitchItemProps, type DropdownMenuSwitchItem$1 as DropdownMenuSwitchItemType, DropdownMenuTrigger, type DropdownMenuTriggerProps, type FilterValue, type FloatingCollisionPadding, FloatingPanel, type FloatingPanelOffset, type FloatingPanelPlacement, type FloatingPanelProps, FloatingSheet, type FloatingSheetProps, FocusScope, type FocusScopeProps, Form, type FormContextValue, FormDivider, type FormDividerProps, FormField, type FormFieldProps, FormFlatGroup, type FormFlatGroupProps, FormFooter, type FormFooterProps, FormGroup, type FormGroupItemType, type FormGroupProps, type FormLayout, type FormProps, FormSubmitFooter, type FormSubmitFooterProps, FormTitle, type FormTitleProps, type FormValues, type FormVariant, type IconSpaceMode, type ImperativeModalProps, _default$1 as Input, type InputClassNames, _default$2 as InputNumber, type InputNumberProps, InputOTP, type InputOTPProps, _default$3 as InputPassword, type InputPasswordProps, type InputProps, type InputSize, type InputStyles, type InputVariant, type ItemsType, List, type ListClickInfo, type ListDividerType, type ListItem, type ListItemType, type ListProps, type ListSemanticName, Modal, ModalBackdrop, type ModalBackdropProps, ModalClose, type ModalCloseProps, type ModalComponentProps, type ModalConfirmConfig, ModalContent, type ModalContentProps, ModalContext, type ModalContextValue, ModalDescription, type ModalDescriptionProps, ModalFooter, type ModalFooterProps, ModalHeader, type ModalHeaderProps, ModalHost, type ModalHostProps, type ModalInstance, ModalPopup, type ModalPopupProps, ModalPortal, type ModalPortalProps, ModalRoot, type ModalRootProps, type ModalSystem, ModalTitle, type ModalTitleProps, ModalTrigger, type ModalTriggerProps, ModalViewport, type ModalViewportProps, Pagination, type PaginationAlign, type PaginationItemType, type PaginationProps, type PaginationSemanticName, type PaginationSize, type PaginationSizeChangerProps, Popover, PopoverArrow, type PopoverArrowAtomProps, PopoverArrowIcon, PopoverBackdrop, type PopoverBackdropProps, type PopoverContextValue, PopoverGroup, type PopoverGroupHandle, type PopoverGroupItem, type PopoverPlacement, PopoverPopup, type PopoverPopupAtomProps, type PopoverPopupProps, PopoverPortal, type PopoverPortalAtomProps, type PopoverPortalProps, PopoverPositioner, type PopoverPositionerAtomProps, type PopoverPositionerProps, type PopoverProps, PopoverProvider, PopoverRoot, type PopoverTrigger, type PopoverTriggerComponentProps, PopoverTriggerElement, type PopoverTriggerElementProps, PopoverViewport, type PopoverViewportAtomProps, Progress, type ProgressProps, type ProgressSize, type ProgressStatus, type ProgressType, type ProgressVariant, QRCode, type QRCodeErrorLevel, type QRCodeProps, type QRCodeStatus, Radio, RadioGroup, type RadioGroupOption, type RadioGroupProps, type RadioProps, Rate, type RateProps, Result, type ResultProps, type ResultStatus, ScrollArea, ScrollAreaContent, type ScrollAreaContentProps, ScrollAreaCorner, type ScrollAreaCornerProps, type ScrollAreaProps, ScrollAreaRoot, type ScrollAreaRootProps, ScrollAreaScrollbar, type ScrollAreaScrollbarProps, ScrollAreaThumb, type ScrollAreaThumbProps, ScrollAreaViewport, type ScrollAreaViewportProps, Segmented, type SegmentedClassNames, SegmentedIndicator, type SegmentedIndicatorProps, SegmentedItem, SegmentedItemIcon, SegmentedItemLabel, type SegmentedItemProps, type SegmentedOption, type SegmentedOptions, type SegmentedOrientation, type SegmentedProps, SegmentedRoot, type SegmentedRootProps, type SegmentedSize, type SegmentedStyles, type SegmentedVariant, Select, SelectArrow, type SelectArrowProps, SelectBackdrop, type SelectBehaviorVariant, type SelectClassNames, SelectGroup, SelectGroupLabel, type SelectGroupLabelProps, type SelectGroupProps, SelectIcon, type SelectIconProps, type SelectIndicatorVariant, SelectItem, SelectItemIndicator, type SelectItemIndicatorProps, type SelectItemProps, SelectItemText, type SelectItemTextProps, SelectList, type SelectListProps, type SelectOption, type SelectOptionGroup, type SelectOptions, SelectPopup, type SelectPopupProps, SelectPortal, type SelectPortalProps, SelectPositioner, type SelectPositionerProps, type SelectProps, SelectRoot, type SelectRootChangeEventDetails, SelectScrollDownArrow, type SelectScrollDownArrowProps, SelectScrollUpArrow, type SelectScrollUpArrowProps, SelectSeparator, type SelectSize, SelectTrigger, type SelectTriggerProps, SelectValue, type SelectValueProps, type SelectVariant, Skeleton, type SkeletonAnimation, SkeletonAvatar, type SkeletonAvatarProps, type SkeletonProps, SkeletonText, type SkeletonTextProps, Slider, type SliderProps, SliderWithInput, type SliderWithInputProps, type SortOrder, Spin, type SpinProps, type SpinSize, type SpinVariant, _default$4 as SplitButton, type SplitButtonMenuProps, type SplitButtonProps, Statistic, type StatisticProps, type StepItem, type StepStatus, Steps, type StepsProps, Switch, type SwitchChangeEventHandler, type SwitchClassNames, type SwitchClickEventHandler, type SwitchContextType, SwitchIcon, type SwitchIconPosition, type SwitchIconProps, type SwitchProps, SwitchRoot, type SwitchRootProps, type SwitchSize, type SwitchStyles, SwitchThumb, type SwitchThumbProps, Table, type TableBreakpoint, type TableCellAttributes, type TableClassNames, type TableColumn, type TableColumnEllipsis, type TableColumnFilterItem, type TableColumnFixed, type TableColumnGroupProps, type TableColumnGroupType, type TableColumnProps, type TableColumnSorter, type TableColumnTitle, type TableColumnTitleProps, type TableColumnType, type TableColumnsType, type TableCompareFn, type TableComponents, type TableComponentsSemanticName, type TableCurrentDataSource, type TableExpandIconProps, type TableExpandableConfig, type TableExpandedRowRender, type TableFilterDropdownPopupProps, type TableFilterDropdownProps, type TableFilters, type TableHeaderCellAttributes, type TableLegacySemanticName, type TableLoadingConfig, type TableLocale, type TableMultipleSorterResult, type TablePaginationConfig, type TablePaginationPlacement, type TablePaginationPosition, type TableProps, type TableRef, type TableRenderedCell, type TableRowClassName, type TableRowSelectMethod, type TableRowSelection, type TableRowSelectionCheckboxProps, type TableRowSelectionType, type TableScrollToConfig, type TableSelectionItem, type TableSelectionPreset, type TableSemanticInfo, type TableSemanticName, type TableSize, type TableSorterResult, type TableSorterTooltipProps, type TableSticky, type TableStyles, type TableSummaryCellProps, type TableSummaryProps, type TableSummaryRowProps, type TableVariant, Tabs, type TabsClassNames, TabsIndicator, type TabsIndicatorProps, type TabsItem, TabsList, type TabsListProps, type TabsOrientation, TabsPanel, type TabsPanelProps, type TabsProps, TabsRoot, type TabsRootProps, type TabsSize, type TabsStyles, TabsTab, type TabsTabProps, type TabsVariant, Tag, type TagClassNames, type TagProps, type TagShape, type TagSize, type TagStyles, type TagVariant, Text, _default$5 as TextArea, type TextAreaAutoSize, type TextAreaProps, type TextClassNames, type TextProps, type TextStyles, type ToastAPI, ToastHost, type ToastHostProps, type ToastInstance, type ToastOptions, type ToastPosition, type ToastPromiseOptions, type ToastProps, type ToastType, ToggleGroup, type ToggleGroupClassNames, ToggleGroupItem, ToggleGroupItemIcon, ToggleGroupItemLabel, type ToggleGroupItemProps, type ToggleGroupOption, type ToggleGroupProps, ToggleGroupRoot, type ToggleGroupRootProps, type ToggleGroupSize, type ToggleGroupStyles, type ToggleGroupVariant, Tooltip, TooltipGroup, type TooltipGroupProps, type TooltipPlacement, type TooltipPopupComponentProps, type TooltipPortalProps, type TooltipPositionerProps, type TooltipProps, type TooltipTriggerComponentProps, Tree, type TreeClassNames, type TreeDataNode, type TreeFlatRow, type TreeProps, type TreeStyles, Upload, type UploadChangeInfo, UploadDragger, type UploadProps, type UseScopeArrowNavOptions, type UseScopeSwitcherOptions, type VirtualListProps, styles as accordionStyles, styles$1 as actionIconStyles, styles$2 as alertStyles, styles$3 as autoCompleteStyles, backdropTransition, buttonPaddingInline, styles$4 as buttonStyles, styles$5 as checkboxStyles, closeContextMenu, colorsPreset, colorsPresetSystem, conductCheck, confirmModal, controlHeight, createModal, createModalSystem, drawerBackdropTransition, flattenVisible, focusScopeItem, styles$6 as focusScopeStyles, formatStatisticValue, getActiveScopeId, getAllKeys, getDrawerMotionConfig, getFloatingCollisionPadding, getLastFocusedItem, styles$7 as inputStyles, rootVariants as inputVariants, modalMotionConfig, notifyScopeItemFocus, parseTrigger, presetColors, presetSystemColors, styles$8 as radioStyles, registerScope, renderDropdownMenuItems, setActiveScope, setContextMenuInterceptor, setFloatingCollisionPadding, setLastFocusedItem, showContextMenu, styles$9 as sliderStyles, styles$10 as switchStyles, styles$11 as tabsStyles, groupStyles as textGroupStyles, styles$12 as textStyles, variants as textVariants, toast, styles$13 as toggleGroupStyles, styles$14 as treeStyles, updateContextMenuItems, useAccordionContext, useActiveScopeId, useDraggablePanelContext, useDrawerActions, useDrawerOpen, useFocusScopeActive, useFocusScopeId, useFormContext, useModalActions, useModalContext, useModalOpen, usePopoverContext, usePopoverGroupHandle, usePopoverPortalContainer, useScopeArrowNav, useScopeSwitcher, useSwitchContext, useTabsContext, useToast };

package/es/dashboard/ConsoleShell/style.mjs

@@ -214,7 +214,9 @@ const styles = createStaticStyles(({ css, cssVar, responsive }) => ({
     min-block-size: 0;
     margin-block: ${WORKSPACE_INSET}px;
     margin-inline: 0 ${WORKSPACE_INSET}px;
-    border: 1px solid ${cssVar.colorBorderSecondary};
+
+    /* A little darker than colorBorderSecondary in both modes: 30% of the way to colorBorder. */
+    border: 1px solid color-mix(in srgb, ${cssVar.colorBorderSecondary} 70%, ${cssVar.colorBorder});
     border-radius: ${cssVar.borderRadiusLG};
 
     background: ${cssVar.colorBgContainer};

package/es/dashboard/ConsoleShell/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/ConsoleShell/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nconst SIDEBAR_INLINE_SIZE = 248;\n// Twice the nav icon inset (8px nav padding + 10px item padding) plus the 18px icon, so the icons\n// land centered on the rail without moving sideways.\nconst SIDEBAR_RAIL_INLINE_SIZE = 54;\nconst WORKSPACE_INSET = 8;\n\n/**\n * `responsive.laptop`, not `responsive.tablet`. The aliases are named for\n * devices, and only `laptop` (max-width 991px) lines up with `useIsCompact`.\n */\nexport const styles = createStaticStyles(({ css, cssVar, responsive }) => ({\n  brand: css`\n    display: flex;\n    flex: none;\n    align-items: center;\n\n    block-size: 56px;\n    margin-block-start: ${WORKSPACE_INSET}px;\n    padding-inline: 15px;\n\n    color: ${cssVar.colorText};\n    white-space: nowrap;\n\n    ${responsive.laptop} {\n      margin-block-start: 0;\n    }\n  `,\n  /** Close button in the drawer's brand row: right edge, vertically centred with the brand. */\n  brandClose: css`\n    flex: none;\n    margin-inline: auto -7px;\n  `,\n  brandAnchor: css`\n    display: flex;\n    align-items: center;\n\n    inline-size: 100%;\n    min-inline-size: 0;\n\n    color: inherit;\n    text-decoration: none;\n  `,\n  brandLockup: css`\n    display: flex;\n    gap: 10px;\n    align-items: center;\n    min-inline-size: 0;\n  `,\n  brandName: css`\n    overflow: hidden;\n\n    font-size: 14px;\n    font-weight: 600;\n    line-height: 1.3;\n    color: ${cssVar.colorText};\n    text-overflow: ellipsis;\n    white-space: nowrap;\n\n    transition: opacity 120ms ease 80ms;\n\n    [data-collapsed='true'] & {\n      text-overflow: clip;\n      opacity: 0;\n      transition-delay: 0s;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      transition: none;\n    }\n  `,\n  main: css`\n    overflow: auto;\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n    gap: 20px;\n\n    min-inline-size: 0;\n    min-block-size: 0;\n    padding: 24px;\n\n    /*\n     * A page that owns a full-height split sets data-page-layout=\"flush\" and\n     * takes over padding and scrolling, so its sidebar can sit on the card edge.\n     */\n    &:has([data-page-layout='flush']) {\n      overflow: hidden;\n      gap: 0;\n      padding: 0;\n    }\n\n    ${responsive.mobile} {\n      gap: 16px;\n      padding: 16px;\n    }\n  `,\n  /**\n   * The drawer body is the scroll container. Without its default padding the scrollbar sits on\n   * the panel edge; the brand row, nav and footer keep their own insets.\n   */\n  drawerBody: css`\n    && {\n      min-block-size: 100%;\n      padding: 0;\n    }\n  `,\n  navSlot: css`\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n    min-block-size: 0;\n  `,\n  shell: css`\n    overflow: hidden;\n    display: flex;\n    flex: 1;\n\n    block-size: 100%;\n    min-block-size: 0;\n\n    background: ${cssVar.colorBgLayout};\n  `,\n  sidebar: css`\n    overflow: hidden;\n    display: flex;\n    flex: none;\n    flex-direction: column;\n\n    inline-size: ${SIDEBAR_INLINE_SIZE}px;\n    block-size: 100%;\n    min-block-size: 0;\n\n    transition: inline-size 200ms ease;\n\n    &[data-collapsed='true'] {\n      inline-size: ${SIDEBAR_RAIL_INLINE_SIZE}px;\n    }\n\n    &[data-instant='true'] {\n      transition: none;\n    }\n\n    ${responsive.laptop} {\n      display: none;\n    }\n  `,\n  sidebarBottom: css`\n    flex: none;\n    padding: 8px;\n  `,\n  skipLink: css`\n    position: fixed;\n    z-index: 2000;\n    inset-block-start: -100px;\n    inset-inline-start: 12px;\n\n    padding-block: 8px;\n    padding-inline: 12px;\n    border-radius: ${cssVar.borderRadius};\n\n    color: ${cssVar.colorText};\n\n    background: ${cssVar.colorBgElevated};\n\n    &:focus {\n      inset-block-start: 12px;\n    }\n  `,\n  topbar: css`\n    display: flex;\n    flex: none;\n    gap: 8px;\n    align-items: center;\n\n    block-size: 56px;\n    padding-inline: 12px;\n    border-block-end: 1px solid ${cssVar.colorBorderSecondary};\n  `,\n  topbarDivider: css`\n    flex: none;\n\n    inline-size: 1px;\n    block-size: 18px;\n    margin-inline: 2px;\n\n    background: ${cssVar.colorBorderSecondary};\n  `,\n  topbarMain: css`\n    display: flex;\n    flex: 1;\n    align-items: center;\n    min-inline-size: 0;\n  `,\n  tools: css`\n    display: flex;\n    flex: none;\n    gap: 6px;\n    align-items: center;\n\n    margin-inline-start: auto;\n  `,\n  /** Light only: the content area sits midway between the layout canvas and container white. */\n  workspaceLight: css`\n    && {\n      background: color-mix(in srgb, ${cssVar.colorBgLayout} 50%, ${cssVar.colorBgContainer});\n    }\n  `,\n  workspace: css`\n    overflow: hidden;\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n\n    min-inline-size: 0;\n    min-block-size: 0;\n    margin-block: ${WORKSPACE_INSET}px;\n    margin-inline: 0 ${WORKSPACE_INSET}px;\n    border: 1px solid ${cssVar.colorBorderSecondary};\n    border-radius: ${cssVar.borderRadiusLG};\n\n    background: ${cssVar.colorBgContainer};\n    box-shadow: ${cssVar.boxShadowTertiary};\n\n    ${responsive.laptop} {\n      margin: 0;\n      border: none;\n      border-radius: 0;\n      box-shadow: none;\n    }\n  `,\n}));\n"],"mappings":";;AAEA,MAAM,sBAAsB;AAG5B,MAAM,2BAA2B;AACjC,MAAM,kBAAkB;;;;;AAMxB,MAAa,SAAS,oBAAoB,EAAE,KAAK,QAAQ,kBAAkB;CACzE,OAAO,GAAG;;;;;;0BAMc,gBAAgB;;;aAG7B,OAAO,UAAU;;;MAGxB,WAAW,OAAO;;;;;CAKtB,YAAY,GAAG;;;;CAIf,aAAa,GAAG;;;;;;;;;;CAUhB,aAAa,GAAG;;;;;;CAMhB,WAAW,GAAG;;;;;;aAMH,OAAO,UAAU;;;;;;;;;;;;;;;;CAgB5B,MAAM,GAAG;;;;;;;;;;;;;;;;;;;;;MAqBL,WAAW,OAAO;;;;;;;;;CAStB,YAAY,GAAG;;;;;;CAMf,SAAS,GAAG;;;;;;CAMZ,OAAO,GAAG;;;;;;;;kBAQM,OAAO,cAAc;;CAErC,SAAS,GAAG;;;;;;mBAMK,oBAAoB;;;;;;;qBAOlB,yBAAyB;;;;;;;MAOxC,WAAW,OAAO;;;;CAItB,eAAe,GAAG;;;;CAIlB,UAAU,GAAG;;;;;;;;qBAQM,OAAO,aAAa;;aAE5B,OAAO,UAAU;;kBAEZ,OAAO,gBAAgB;;;;;;CAMvC,QAAQ,GAAG;;;;;;;;kCAQqB,OAAO,qBAAqB;;CAE5D,eAAe,GAAG;;;;;;;kBAOF,OAAO,qBAAqB;;CAE5C,YAAY,GAAG;;;;;;CAMf,OAAO,GAAG;;;;;;;;;CASV,gBAAgB,GAAG;;uCAEkB,OAAO,cAAc,QAAQ,OAAO,iBAAiB;;;CAG1F,WAAW,GAAG;;;;;;;;oBAQI,gBAAgB;uBACb,gBAAgB;wBACf,OAAO,qBAAqB;qBAC/B,OAAO,eAAe;;kBAEzB,OAAO,iBAAiB;kBACxB,OAAO,kBAAkB;;MAErC,WAAW,OAAO;;;;;;;AAOxB,EAAE"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/ConsoleShell/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nconst SIDEBAR_INLINE_SIZE = 248;\n// Twice the nav icon inset (8px nav padding + 10px item padding) plus the 18px icon, so the icons\n// land centered on the rail without moving sideways.\nconst SIDEBAR_RAIL_INLINE_SIZE = 54;\nconst WORKSPACE_INSET = 8;\n\n/**\n * `responsive.laptop`, not `responsive.tablet`. The aliases are named for\n * devices, and only `laptop` (max-width 991px) lines up with `useIsCompact`.\n */\nexport const styles = createStaticStyles(({ css, cssVar, responsive }) => ({\n  brand: css`\n    display: flex;\n    flex: none;\n    align-items: center;\n\n    block-size: 56px;\n    margin-block-start: ${WORKSPACE_INSET}px;\n    padding-inline: 15px;\n\n    color: ${cssVar.colorText};\n    white-space: nowrap;\n\n    ${responsive.laptop} {\n      margin-block-start: 0;\n    }\n  `,\n  /** Close button in the drawer's brand row: right edge, vertically centred with the brand. */\n  brandClose: css`\n    flex: none;\n    margin-inline: auto -7px;\n  `,\n  brandAnchor: css`\n    display: flex;\n    align-items: center;\n\n    inline-size: 100%;\n    min-inline-size: 0;\n\n    color: inherit;\n    text-decoration: none;\n  `,\n  brandLockup: css`\n    display: flex;\n    gap: 10px;\n    align-items: center;\n    min-inline-size: 0;\n  `,\n  brandName: css`\n    overflow: hidden;\n\n    font-size: 14px;\n    font-weight: 600;\n    line-height: 1.3;\n    color: ${cssVar.colorText};\n    text-overflow: ellipsis;\n    white-space: nowrap;\n\n    transition: opacity 120ms ease 80ms;\n\n    [data-collapsed='true'] & {\n      text-overflow: clip;\n      opacity: 0;\n      transition-delay: 0s;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      transition: none;\n    }\n  `,\n  main: css`\n    overflow: auto;\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n    gap: 20px;\n\n    min-inline-size: 0;\n    min-block-size: 0;\n    padding: 24px;\n\n    /*\n     * A page that owns a full-height split sets data-page-layout=\"flush\" and\n     * takes over padding and scrolling, so its sidebar can sit on the card edge.\n     */\n    &:has([data-page-layout='flush']) {\n      overflow: hidden;\n      gap: 0;\n      padding: 0;\n    }\n\n    ${responsive.mobile} {\n      gap: 16px;\n      padding: 16px;\n    }\n  `,\n  /**\n   * The drawer body is the scroll container. Without its default padding the scrollbar sits on\n   * the panel edge; the brand row, nav and footer keep their own insets.\n   */\n  drawerBody: css`\n    && {\n      min-block-size: 100%;\n      padding: 0;\n    }\n  `,\n  navSlot: css`\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n    min-block-size: 0;\n  `,\n  shell: css`\n    overflow: hidden;\n    display: flex;\n    flex: 1;\n\n    block-size: 100%;\n    min-block-size: 0;\n\n    background: ${cssVar.colorBgLayout};\n  `,\n  sidebar: css`\n    overflow: hidden;\n    display: flex;\n    flex: none;\n    flex-direction: column;\n\n    inline-size: ${SIDEBAR_INLINE_SIZE}px;\n    block-size: 100%;\n    min-block-size: 0;\n\n    transition: inline-size 200ms ease;\n\n    &[data-collapsed='true'] {\n      inline-size: ${SIDEBAR_RAIL_INLINE_SIZE}px;\n    }\n\n    &[data-instant='true'] {\n      transition: none;\n    }\n\n    ${responsive.laptop} {\n      display: none;\n    }\n  `,\n  sidebarBottom: css`\n    flex: none;\n    padding: 8px;\n  `,\n  skipLink: css`\n    position: fixed;\n    z-index: 2000;\n    inset-block-start: -100px;\n    inset-inline-start: 12px;\n\n    padding-block: 8px;\n    padding-inline: 12px;\n    border-radius: ${cssVar.borderRadius};\n\n    color: ${cssVar.colorText};\n\n    background: ${cssVar.colorBgElevated};\n\n    &:focus {\n      inset-block-start: 12px;\n    }\n  `,\n  topbar: css`\n    display: flex;\n    flex: none;\n    gap: 8px;\n    align-items: center;\n\n    block-size: 56px;\n    padding-inline: 12px;\n    border-block-end: 1px solid ${cssVar.colorBorderSecondary};\n  `,\n  topbarDivider: css`\n    flex: none;\n\n    inline-size: 1px;\n    block-size: 18px;\n    margin-inline: 2px;\n\n    background: ${cssVar.colorBorderSecondary};\n  `,\n  topbarMain: css`\n    display: flex;\n    flex: 1;\n    align-items: center;\n    min-inline-size: 0;\n  `,\n  tools: css`\n    display: flex;\n    flex: none;\n    gap: 6px;\n    align-items: center;\n\n    margin-inline-start: auto;\n  `,\n  /** Light only: the content area sits midway between the layout canvas and container white. */\n  workspaceLight: css`\n    && {\n      background: color-mix(in srgb, ${cssVar.colorBgLayout} 50%, ${cssVar.colorBgContainer});\n    }\n  `,\n  workspace: css`\n    overflow: hidden;\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n\n    min-inline-size: 0;\n    min-block-size: 0;\n    margin-block: ${WORKSPACE_INSET}px;\n    margin-inline: 0 ${WORKSPACE_INSET}px;\n\n    /* A little darker than colorBorderSecondary in both modes: 30% of the way to colorBorder. */\n    border: 1px solid color-mix(in srgb, ${cssVar.colorBorderSecondary} 70%, ${cssVar.colorBorder});\n    border-radius: ${cssVar.borderRadiusLG};\n\n    background: ${cssVar.colorBgContainer};\n    box-shadow: ${cssVar.boxShadowTertiary};\n\n    ${responsive.laptop} {\n      margin: 0;\n      border: none;\n      border-radius: 0;\n      box-shadow: none;\n    }\n  `,\n}));\n"],"mappings":";;AAEA,MAAM,sBAAsB;AAG5B,MAAM,2BAA2B;AACjC,MAAM,kBAAkB;;;;;AAMxB,MAAa,SAAS,oBAAoB,EAAE,KAAK,QAAQ,kBAAkB;CACzE,OAAO,GAAG;;;;;;0BAMc,gBAAgB;;;aAG7B,OAAO,UAAU;;;MAGxB,WAAW,OAAO;;;;;CAKtB,YAAY,GAAG;;;;CAIf,aAAa,GAAG;;;;;;;;;;CAUhB,aAAa,GAAG;;;;;;CAMhB,WAAW,GAAG;;;;;;aAMH,OAAO,UAAU;;;;;;;;;;;;;;;;CAgB5B,MAAM,GAAG;;;;;;;;;;;;;;;;;;;;;MAqBL,WAAW,OAAO;;;;;;;;;CAStB,YAAY,GAAG;;;;;;CAMf,SAAS,GAAG;;;;;;CAMZ,OAAO,GAAG;;;;;;;;kBAQM,OAAO,cAAc;;CAErC,SAAS,GAAG;;;;;;mBAMK,oBAAoB;;;;;;;qBAOlB,yBAAyB;;;;;;;MAOxC,WAAW,OAAO;;;;CAItB,eAAe,GAAG;;;;CAIlB,UAAU,GAAG;;;;;;;;qBAQM,OAAO,aAAa;;aAE5B,OAAO,UAAU;;kBAEZ,OAAO,gBAAgB;;;;;;CAMvC,QAAQ,GAAG;;;;;;;;kCAQqB,OAAO,qBAAqB;;CAE5D,eAAe,GAAG;;;;;;;kBAOF,OAAO,qBAAqB;;CAE5C,YAAY,GAAG;;;;;;CAMf,OAAO,GAAG;;;;;;;;;CASV,gBAAgB,GAAG;;uCAEkB,OAAO,cAAc,QAAQ,OAAO,iBAAiB;;;CAG1F,WAAW,GAAG;;;;;;;;oBAQI,gBAAgB;uBACb,gBAAgB;;;2CAGI,OAAO,qBAAqB,QAAQ,OAAO,YAAY;qBAC7E,OAAO,eAAe;;kBAEzB,OAAO,iBAAiB;kBACxB,OAAO,kBAAkB;;MAErC,WAAW,OAAO;;;;;;;AAOxB,EAAE"}

package/es/dashboard/MetricStrip/MetricCell.mjs

@@ -14,20 +14,27 @@ const deltaClass = {
 const MetricBody = ({ item, loading }) => /* @__PURE__ */ jsxs(Fragment, { children: [
 	/* @__PURE__ */ jsxs("div", {
 		className: styles.head,
-		children: [/* @__PURE__ */ jsxs("div", {
-			className: styles.headCopy,
-			children: [/* @__PURE__ */ jsx("div", {
-				className: styles.label,
-				children: item.label
-			}), item.action]
-		}), item.mark ? /* @__PURE__ */ jsx("span", {
-			"aria-hidden": true,
-			className: styles.mark,
-			children: /* @__PURE__ */ jsx(Icon, {
-				icon: item.mark,
-				size: 14
-			})
-		}) : null]
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: styles.headCopy,
+				children: /* @__PURE__ */ jsx("div", {
+					className: styles.label,
+					children: item.label
+				})
+			}),
+			item.action ? /* @__PURE__ */ jsx("div", {
+				className: styles.headAction,
+				children: item.action
+			}) : null,
+			item.mark ? /* @__PURE__ */ jsx("span", {
+				"aria-hidden": true,
+				className: styles.mark,
+				children: /* @__PURE__ */ jsx(Icon, {
+					icon: item.mark,
+					size: 14
+				})
+			}) : null
+		]
 	}),
 	loading ? /* @__PURE__ */ jsx(Skeleton, {
 		height: 28,
@@ -46,6 +53,10 @@ const MetricBody = ({ item, loading }) => /* @__PURE__ */ jsxs(Fragment, { child
 			className: styles.hint,
 			children: item.hint
 		}) : null]
+	}) : null,
+	!loading && item.chart ? /* @__PURE__ */ jsx("div", {
+		className: styles.chart,
+		children: item.chart
 	}) : null
 ] });
 /** One metric: label row, figure, delta and hint. Shared by MetricStrip and StatCard. */

package/es/dashboard/MetricStrip/MetricCell.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MetricCell.mjs","names":[],"sources":["../../../src/dashboard/MetricStrip/MetricCell.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\n\nimport Skeleton from '@/base-ui/Skeleton';\nimport Icon from '@/Icon';\n\nimport { useSurfaceLink } from '../Surface/link';\nimport type { SurfaceRenderLink } from '../Surface/type';\nimport { styles } from './style';\nimport type { MetricItem } from './type';\n\nconst deltaClass = {\n  down: styles.deltaDown,\n  flat: styles.deltaFlat,\n  up: styles.deltaUp,\n} as const;\n\nconst MetricBody = ({ item, loading }: { item: MetricItem; loading?: boolean }) => (\n  <>\n    <div className={styles.head}>\n      <div className={styles.headCopy}>\n        <div className={styles.label}>{item.label}</div>\n        {item.action}\n      </div>\n      {item.mark ? (\n        <span aria-hidden className={styles.mark}>\n          <Icon icon={item.mark} size={14} />\n        </span>\n      ) : null}\n    </div>\n    {loading ? (\n      <Skeleton height={28} radius={6} width={88} />\n    ) : (\n      <div\n        className={cx(\n          styles.value,\n          item.valueTone === 'danger' && styles.valueDanger,\n          item.valueTone === 'warning' && styles.valueWarning,\n        )}\n      >\n        {item.value}\n      </div>\n    )}\n    {!loading && (item.delta || item.hint) ? (\n      <div className={styles.foot}>\n        {item.delta ? (\n          <span className={cx(styles.delta, deltaClass[item.direction ?? 'flat'])}>\n            {item.delta}\n          </span>\n        ) : null}\n        {item.hint ? <span className={styles.hint}>{item.hint}</span> : null}\n      </div>\n    ) : null}\n  </>\n);\n\nexport interface MetricCellProps {\n  item: MetricItem;\n  loading?: boolean;\n  renderLink?: SurfaceRenderLink;\n  /** Draw the joined-strip divider on the trailing and bottom edges. */\n  seam?: boolean;\n}\n\n/** One metric: label row, figure, delta and hint. Shared by MetricStrip and StatCard. */\nconst MetricCell = ({ item, loading, renderLink, seam = false }: MetricCellProps) => {\n  const link = useSurfaceLink(renderLink);\n  const body = <MetricBody item={item} loading={item.loading ?? loading} />;\n  const cell = cx(styles.cell, seam && styles.cellSeam);\n\n  if (item.href) {\n    return (\n      <div className={styles.slot}>\n        {link({ children: body, className: cx(cell, styles.link), href: item.href })}\n      </div>\n    );\n  }\n  if (item.onClick) {\n    return (\n      <button className={cx(cell, styles.press)} type=\"button\" onClick={item.onClick}>\n        {body}\n      </button>\n    );\n  }\n  return <div className={cell}>{body}</div>;\n};\n\nexport default MetricCell;\n"],"mappings":";;;;;;;;AAYA,MAAM,aAAa;CACjB,MAAM,OAAO;CACb,MAAM,OAAO;CACb,IAAI,OAAO;AACb;AAEA,MAAM,cAAc,EAAE,MAAM,cAC1B,qBAAA,UAAA,EAAA,UAAA;CACE,qBAAC,OAAD;EAAK,WAAW,OAAO;EAAvB,UAAA,CACE,qBAAC,OAAD;GAAK,WAAW,OAAO;GAAvB,UAAA,CACE,oBAAC,OAAD;IAAK,WAAW,OAAO;IAAQ,UAAA,KAAK;GAAW,CAAA,GAC9C,KAAK,MACH;EACJ,CAAA,GAAA,KAAK,OACJ,oBAAC,QAAD;GAAM,eAAA;GAAY,WAAW,OAAO;GAClC,UAAA,oBAAC,MAAD;IAAM,MAAM,KAAK;IAAM,MAAM;GAAK,CAAA;EAC9B,CAAA,IACJ,IACD;;CACJ,UACC,oBAAC,UAAD;EAAU,QAAQ;EAAI,QAAQ;EAAG,OAAO;CAAK,CAAA,IAE7C,oBAAC,OAAD;EACE,WAAW,GACT,OAAO,OACP,KAAK,cAAc,YAAY,OAAO,aACtC,KAAK,cAAc,aAAa,OAAO,YACzC;EAEC,UAAA,KAAK;CACH,CAAA;CAEN,CAAC,YAAY,KAAK,SAAS,KAAK,QAC/B,qBAAC,OAAD;EAAK,WAAW,OAAO;EAAvB,UAAA,CACG,KAAK,QACJ,oBAAC,QAAD;GAAM,WAAW,GAAG,OAAO,OAAO,WAAW,KAAK,aAAa,OAAO;GACnE,UAAA,KAAK;EACF,CAAA,IACJ,MACH,KAAK,OAAO,oBAAC,QAAD;GAAM,WAAW,OAAO;GAAO,UAAA,KAAK;EAAW,CAAA,IAAI,IAC7D;CACH,CAAA,IAAA;AACJ,EAAA,CAAA;;AAYJ,MAAM,cAAc,EAAE,MAAM,SAAS,YAAY,OAAO,YAA6B;CACnF,MAAM,OAAO,eAAe,UAAU;CACtC,MAAM,OAAO,oBAAC,YAAD;EAAkB;EAAM,SAAS,KAAK,WAAW;CAAU,CAAA;CACxE,MAAM,OAAO,GAAG,OAAO,MAAM,QAAQ,OAAO,QAAQ;CAEpD,IAAI,KAAK,MACP,OACE,oBAAC,OAAD;EAAK,WAAW,OAAO;EACpB,UAAA,KAAK;GAAE,UAAU;GAAM,WAAW,GAAG,MAAM,OAAO,IAAI;GAAG,MAAM,KAAK;EAAK,CAAC;CACxE,CAAA;CAGT,IAAI,KAAK,SACP,OACE,oBAAC,UAAD;EAAQ,WAAW,GAAG,MAAM,OAAO,KAAK;EAAG,MAAK;EAAS,SAAS,KAAK;EACpE,UAAA;CACK,CAAA;CAGZ,OAAO,oBAAC,OAAD;EAAK,WAAW;EAAO,UAAA;CAAU,CAAA;AAC1C"}
+{"version":3,"file":"MetricCell.mjs","names":[],"sources":["../../../src/dashboard/MetricStrip/MetricCell.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\n\nimport Skeleton from '@/base-ui/Skeleton';\nimport Icon from '@/Icon';\n\nimport { useSurfaceLink } from '../Surface/link';\nimport type { SurfaceRenderLink } from '../Surface/type';\nimport { styles } from './style';\nimport type { MetricItem } from './type';\n\nconst deltaClass = {\n  down: styles.deltaDown,\n  flat: styles.deltaFlat,\n  up: styles.deltaUp,\n} as const;\n\nconst MetricBody = ({ item, loading }: { item: MetricItem; loading?: boolean }) => (\n  <>\n    <div className={styles.head}>\n      <div className={styles.headCopy}>\n        <div className={styles.label}>{item.label}</div>\n      </div>\n      {item.action ? <div className={styles.headAction}>{item.action}</div> : null}\n      {item.mark ? (\n        <span aria-hidden className={styles.mark}>\n          <Icon icon={item.mark} size={14} />\n        </span>\n      ) : null}\n    </div>\n    {loading ? (\n      <Skeleton height={28} radius={6} width={88} />\n    ) : (\n      <div\n        className={cx(\n          styles.value,\n          item.valueTone === 'danger' && styles.valueDanger,\n          item.valueTone === 'warning' && styles.valueWarning,\n        )}\n      >\n        {item.value}\n      </div>\n    )}\n    {!loading && (item.delta || item.hint) ? (\n      <div className={styles.foot}>\n        {item.delta ? (\n          <span className={cx(styles.delta, deltaClass[item.direction ?? 'flat'])}>\n            {item.delta}\n          </span>\n        ) : null}\n        {item.hint ? <span className={styles.hint}>{item.hint}</span> : null}\n      </div>\n    ) : null}\n    {!loading && item.chart ? <div className={styles.chart}>{item.chart}</div> : null}\n  </>\n);\n\nexport interface MetricCellProps {\n  item: MetricItem;\n  loading?: boolean;\n  renderLink?: SurfaceRenderLink;\n  /** Draw the joined-strip divider on the trailing and bottom edges. */\n  seam?: boolean;\n}\n\n/** One metric: label row, figure, delta and hint. Shared by MetricStrip and StatCard. */\nconst MetricCell = ({ item, loading, renderLink, seam = false }: MetricCellProps) => {\n  const link = useSurfaceLink(renderLink);\n  const body = <MetricBody item={item} loading={item.loading ?? loading} />;\n  const cell = cx(styles.cell, seam && styles.cellSeam);\n\n  if (item.href) {\n    return (\n      <div className={styles.slot}>\n        {link({ children: body, className: cx(cell, styles.link), href: item.href })}\n      </div>\n    );\n  }\n  if (item.onClick) {\n    return (\n      <button className={cx(cell, styles.press)} type=\"button\" onClick={item.onClick}>\n        {body}\n      </button>\n    );\n  }\n  return <div className={cell}>{body}</div>;\n};\n\nexport default MetricCell;\n"],"mappings":";;;;;;;;AAYA,MAAM,aAAa;CACjB,MAAM,OAAO;CACb,MAAM,OAAO;CACb,IAAI,OAAO;AACb;AAEA,MAAM,cAAc,EAAE,MAAM,cAC1B,qBAAA,UAAA,EAAA,UAAA;CACE,qBAAC,OAAD;EAAK,WAAW,OAAO;EAAvB,UAAA;GACE,oBAAC,OAAD;IAAK,WAAW,OAAO;IACrB,UAAA,oBAAC,OAAD;KAAK,WAAW,OAAO;KAAQ,UAAA,KAAK;IAAW,CAAA;GAC5C,CAAA;GACJ,KAAK,SAAS,oBAAC,OAAD;IAAK,WAAW,OAAO;IAAa,UAAA,KAAK;GAAY,CAAA,IAAI;GACvE,KAAK,OACJ,oBAAC,QAAD;IAAM,eAAA;IAAY,WAAW,OAAO;IAClC,UAAA,oBAAC,MAAD;KAAM,MAAM,KAAK;KAAM,MAAM;IAAK,CAAA;GAC9B,CAAA,IACJ;EACD;;CACJ,UACC,oBAAC,UAAD;EAAU,QAAQ;EAAI,QAAQ;EAAG,OAAO;CAAK,CAAA,IAE7C,oBAAC,OAAD;EACE,WAAW,GACT,OAAO,OACP,KAAK,cAAc,YAAY,OAAO,aACtC,KAAK,cAAc,aAAa,OAAO,YACzC;EAEC,UAAA,KAAK;CACH,CAAA;CAEN,CAAC,YAAY,KAAK,SAAS,KAAK,QAC/B,qBAAC,OAAD;EAAK,WAAW,OAAO;EAAvB,UAAA,CACG,KAAK,QACJ,oBAAC,QAAD;GAAM,WAAW,GAAG,OAAO,OAAO,WAAW,KAAK,aAAa,OAAO;GACnE,UAAA,KAAK;EACF,CAAA,IACJ,MACH,KAAK,OAAO,oBAAC,QAAD;GAAM,WAAW,OAAO;GAAO,UAAA,KAAK;EAAW,CAAA,IAAI,IAC7D;CACH,CAAA,IAAA;CACH,CAAC,WAAW,KAAK,QAAQ,oBAAC,OAAD;EAAK,WAAW,OAAO;EAAQ,UAAA,KAAK;CAAW,CAAA,IAAI;AAC7E,EAAA,CAAA;;AAYJ,MAAM,cAAc,EAAE,MAAM,SAAS,YAAY,OAAO,YAA6B;CACnF,MAAM,OAAO,eAAe,UAAU;CACtC,MAAM,OAAO,oBAAC,YAAD;EAAkB;EAAM,SAAS,KAAK,WAAW;CAAU,CAAA;CACxE,MAAM,OAAO,GAAG,OAAO,MAAM,QAAQ,OAAO,QAAQ;CAEpD,IAAI,KAAK,MACP,OACE,oBAAC,OAAD;EAAK,WAAW,OAAO;EACpB,UAAA,KAAK;GAAE,UAAU;GAAM,WAAW,GAAG,MAAM,OAAO,IAAI;GAAG,MAAM,KAAK;EAAK,CAAC;CACxE,CAAA;CAGT,IAAI,KAAK,SACP,OACE,oBAAC,UAAD;EAAQ,WAAW,GAAG,MAAM,OAAO,KAAK;EAAG,MAAK;EAAS,SAAS,KAAK;EACpE,UAAA;CACK,CAAA;CAGZ,OAAO,oBAAC,OAAD;EAAK,WAAW;EAAO,UAAA;CAAU,CAAA;AAC1C"}

package/es/dashboard/MetricStrip/style.mjs

@@ -35,9 +35,23 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
   `,
 	headCopy: css`
     display: flex;
+    flex: 1;
     gap: 6px;
     align-items: center;
+
+    min-inline-size: 0;
+  `,
+	/** Label-row control, pushed to the trailing edge. */
+	headAction: css`
+    display: flex;
+    flex: none;
+    align-items: center;
+  `,
+	/** Full-width chart slot under the delta and hint. */
+	chart: css`
+    inline-size: 100%;
     min-inline-size: 0;
+    margin-block-start: 6px;
   `,
 	mark: css`
     display: inline-flex;

package/es/dashboard/MetricStrip/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/MetricStrip/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  cell: css`\n    display: flex;\n    flex-direction: column;\n    gap: 6px;\n\n    min-inline-size: 0;\n    padding-block: 16px;\n    padding-inline: 20px;\n\n    background: transparent;\n  `,\n  /** Joined strip only: the divider on the cell's trailing and bottom edges. */\n  cellSeam: css`\n    box-shadow:\n      inset -1px 0 0 var(--metric-seam),\n      inset 0 -1px 0 var(--metric-seam);\n  `,\n  /** Split strip and StatCard: one card per item. */\n  card: css`\n    display: grid;\n    min-inline-size: 0;\n  `,\n  /* One fixed 32px row (a small Segmented or ActionIcon fits): an action or mark in the head must not push the value down, so cells with and\n     without header controls line up across a split strip or a row of StatCards. */\n  head: css`\n    display: flex;\n    gap: 8px;\n    align-items: center;\n    justify-content: space-between;\n\n    box-sizing: border-box;\n    min-inline-size: 0;\n    block-size: 32px;\n  `,\n  headCopy: css`\n    display: flex;\n    gap: 6px;\n    align-items: center;\n    min-inline-size: 0;\n  `,\n  mark: css`\n    display: inline-flex;\n    flex: none;\n    align-items: center;\n    justify-content: center;\n\n    inline-size: 24px;\n    block-size: 24px;\n    border: 1px solid ${cssVar.colorFillSecondary};\n    border-radius: ${cssVar.borderRadiusSM};\n\n    color: ${cssVar.colorTextTertiary};\n\n    background: ${cssVar.colorFillTertiary};\n  `,\n  split: css`\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n    gap: 12px;\n  `,\n  delta: css`\n    font-size: 13px;\n    font-variant-numeric: tabular-nums;\n    line-height: 1.4;\n  `,\n  deltaDown: css`\n    color: ${cssVar.colorError};\n  `,\n  deltaFlat: css`\n    color: ${cssVar.colorTextSecondary};\n  `,\n  deltaUp: css`\n    color: ${cssVar.colorSuccess};\n  `,\n  foot: css`\n    display: flex;\n    flex-wrap: wrap;\n    gap: 8px;\n    align-items: baseline;\n  `,\n  /**\n   * Clips the seam that would otherwise sit on the card's trailing and bottom\n   * edges. A short last row used to show the seam color across the empty\n   * track, which reads louder than the cells.\n   */\n  frame: css`\n    --metric-seam: ${cssVar.colorFillSecondary};\n\n    overflow: hidden;\n    border-radius: inherit;\n    background: transparent;\n  `,\n  grid: css`\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n\n    inline-size: calc(100% + 1px);\n    margin-block-end: -1px;\n\n    background: transparent;\n  `,\n  hint: css`\n    font-size: 13px;\n    line-height: 1.4;\n    color: ${cssVar.colorTextSecondary};\n  `,\n  label: css`\n    font-size: 13px;\n    font-weight: 500;\n    line-height: 1.4;\n    color: ${cssVar.colorTextSecondary};\n  `,\n  link: css`\n    color: inherit;\n    text-decoration: none;\n\n    &:hover {\n      background: ${cssVar.colorFillQuaternary};\n    }\n  `,\n  press: css`\n    cursor: pointer;\n\n    border: none;\n\n    font: inherit;\n    color: inherit;\n    text-align: start;\n\n    &:hover {\n      background: ${cssVar.colorFillQuaternary};\n    }\n  `,\n  /** Grid cell around a rendered link, so the link fills it. */\n  slot: css`\n    display: grid;\n    min-inline-size: 0;\n  `,\n  value: css`\n    overflow: hidden;\n\n    font-size: ${cssVar.fontSizeHeading3};\n    font-weight: 600;\n    font-variant-numeric: tabular-nums;\n    line-height: 1.15;\n    color: ${cssVar.colorText};\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  `,\n  valueDanger: css`\n    color: ${cssVar.colorError};\n  `,\n  valueWarning: css`\n    color: ${cssVar.colorWarning};\n  `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;;;;;;;;;;;;CAYT,UAAU,GAAG;;;;;;CAMb,MAAM,GAAG;;;;CAMT,MAAM,GAAG;;;;;;;;;;CAUT,UAAU,GAAG;;;;;;CAMb,MAAM,GAAG;;;;;;;;wBAQa,OAAO,mBAAmB;qBAC7B,OAAO,eAAe;;aAE9B,OAAO,kBAAkB;;kBAEpB,OAAO,kBAAkB;;CAEzC,OAAO,GAAG;;;;;CAKV,OAAO,GAAG;;;;;CAKV,WAAW,GAAG;aACH,OAAO,WAAW;;CAE7B,WAAW,GAAG;aACH,OAAO,mBAAmB;;CAErC,SAAS,GAAG;aACD,OAAO,aAAa;;CAE/B,MAAM,GAAG;;;;;;;;;;;CAWT,OAAO,GAAG;qBACS,OAAO,mBAAmB;;;;;;CAM7C,MAAM,GAAG;;;;;;;;;CAST,MAAM,GAAG;;;aAGE,OAAO,mBAAmB;;CAErC,OAAO,GAAG;;;;aAIC,OAAO,mBAAmB;;CAErC,MAAM,GAAG;;;;;oBAKS,OAAO,oBAAoB;;;CAG7C,OAAO,GAAG;;;;;;;;;;oBAUQ,OAAO,oBAAoB;;;;CAI7C,MAAM,GAAG;;;;CAIT,OAAO,GAAG;;;iBAGK,OAAO,iBAAiB;;;;aAI5B,OAAO,UAAU;;;;CAI5B,aAAa,GAAG;aACL,OAAO,WAAW;;CAE7B,cAAc,GAAG;aACN,OAAO,aAAa;;AAEjC,EAAE"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/MetricStrip/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  cell: css`\n    display: flex;\n    flex-direction: column;\n    gap: 6px;\n\n    min-inline-size: 0;\n    padding-block: 16px;\n    padding-inline: 20px;\n\n    background: transparent;\n  `,\n  /** Joined strip only: the divider on the cell's trailing and bottom edges. */\n  cellSeam: css`\n    box-shadow:\n      inset -1px 0 0 var(--metric-seam),\n      inset 0 -1px 0 var(--metric-seam);\n  `,\n  /** Split strip and StatCard: one card per item. */\n  card: css`\n    display: grid;\n    min-inline-size: 0;\n  `,\n  /* One fixed 32px row (a small Segmented or ActionIcon fits): an action or mark in the head must not push the value down, so cells with and\n     without header controls line up across a split strip or a row of StatCards. */\n  head: css`\n    display: flex;\n    gap: 8px;\n    align-items: center;\n    justify-content: space-between;\n\n    box-sizing: border-box;\n    min-inline-size: 0;\n    block-size: 32px;\n  `,\n  headCopy: css`\n    display: flex;\n    flex: 1;\n    gap: 6px;\n    align-items: center;\n\n    min-inline-size: 0;\n  `,\n  /** Label-row control, pushed to the trailing edge. */\n  headAction: css`\n    display: flex;\n    flex: none;\n    align-items: center;\n  `,\n  /** Full-width chart slot under the delta and hint. */\n  chart: css`\n    inline-size: 100%;\n    min-inline-size: 0;\n    margin-block-start: 6px;\n  `,\n  mark: css`\n    display: inline-flex;\n    flex: none;\n    align-items: center;\n    justify-content: center;\n\n    inline-size: 24px;\n    block-size: 24px;\n    border: 1px solid ${cssVar.colorFillSecondary};\n    border-radius: ${cssVar.borderRadiusSM};\n\n    color: ${cssVar.colorTextTertiary};\n\n    background: ${cssVar.colorFillTertiary};\n  `,\n  split: css`\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n    gap: 12px;\n  `,\n  delta: css`\n    font-size: 13px;\n    font-variant-numeric: tabular-nums;\n    line-height: 1.4;\n  `,\n  deltaDown: css`\n    color: ${cssVar.colorError};\n  `,\n  deltaFlat: css`\n    color: ${cssVar.colorTextSecondary};\n  `,\n  deltaUp: css`\n    color: ${cssVar.colorSuccess};\n  `,\n  foot: css`\n    display: flex;\n    flex-wrap: wrap;\n    gap: 8px;\n    align-items: baseline;\n  `,\n  /**\n   * Clips the seam that would otherwise sit on the card's trailing and bottom\n   * edges. A short last row used to show the seam color across the empty\n   * track, which reads louder than the cells.\n   */\n  frame: css`\n    --metric-seam: ${cssVar.colorFillSecondary};\n\n    overflow: hidden;\n    border-radius: inherit;\n    background: transparent;\n  `,\n  grid: css`\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n\n    inline-size: calc(100% + 1px);\n    margin-block-end: -1px;\n\n    background: transparent;\n  `,\n  hint: css`\n    font-size: 13px;\n    line-height: 1.4;\n    color: ${cssVar.colorTextSecondary};\n  `,\n  label: css`\n    font-size: 13px;\n    font-weight: 500;\n    line-height: 1.4;\n    color: ${cssVar.colorTextSecondary};\n  `,\n  link: css`\n    color: inherit;\n    text-decoration: none;\n\n    &:hover {\n      background: ${cssVar.colorFillQuaternary};\n    }\n  `,\n  press: css`\n    cursor: pointer;\n\n    border: none;\n\n    font: inherit;\n    color: inherit;\n    text-align: start;\n\n    &:hover {\n      background: ${cssVar.colorFillQuaternary};\n    }\n  `,\n  /** Grid cell around a rendered link, so the link fills it. */\n  slot: css`\n    display: grid;\n    min-inline-size: 0;\n  `,\n  value: css`\n    overflow: hidden;\n\n    font-size: ${cssVar.fontSizeHeading3};\n    font-weight: 600;\n    font-variant-numeric: tabular-nums;\n    line-height: 1.15;\n    color: ${cssVar.colorText};\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  `,\n  valueDanger: css`\n    color: ${cssVar.colorError};\n  `,\n  valueWarning: css`\n    color: ${cssVar.colorWarning};\n  `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;;;;;;;;;;;;CAYT,UAAU,GAAG;;;;;;CAMb,MAAM,GAAG;;;;CAMT,MAAM,GAAG;;;;;;;;;;CAUT,UAAU,GAAG;;;;;;;;;CASb,YAAY,GAAG;;;;;;CAMf,OAAO,GAAG;;;;;CAKV,MAAM,GAAG;;;;;;;;wBAQa,OAAO,mBAAmB;qBAC7B,OAAO,eAAe;;aAE9B,OAAO,kBAAkB;;kBAEpB,OAAO,kBAAkB;;CAEzC,OAAO,GAAG;;;;;CAKV,OAAO,GAAG;;;;;CAKV,WAAW,GAAG;aACH,OAAO,WAAW;;CAE7B,WAAW,GAAG;aACH,OAAO,mBAAmB;;CAErC,SAAS,GAAG;aACD,OAAO,aAAa;;CAE/B,MAAM,GAAG;;;;;;;;;;;CAWT,OAAO,GAAG;qBACS,OAAO,mBAAmB;;;;;;CAM7C,MAAM,GAAG;;;;;;;;;CAST,MAAM,GAAG;;;aAGE,OAAO,mBAAmB;;CAErC,OAAO,GAAG;;;;aAIC,OAAO,mBAAmB;;CAErC,MAAM,GAAG;;;;;oBAKS,OAAO,oBAAoB;;;CAG7C,OAAO,GAAG;;;;;;;;;;oBAUQ,OAAO,oBAAoB;;;;CAI7C,MAAM,GAAG;;;;CAIT,OAAO,GAAG;;;iBAGK,OAAO,iBAAiB;;;;aAI5B,OAAO,UAAU;;;;CAI5B,aAAa,GAAG;aACL,OAAO,WAAW;;CAE7B,cAAc,GAAG;aACN,OAAO,aAAa;;AAEjC,EAAE"}

package/es/dashboard/MetricStrip/type.d.mts

@@ -6,6 +6,8 @@ import { ReactNode } from "react";
 interface MetricItem {
   /** Control on the label row, such as a menu. */
   action?: ReactNode;
+  /** Full-width chart (sparkline, area) under the delta and hint. */
+  chart?: ReactNode;
   delta?: ReactNode;
   direction?: 'up' | 'down' | 'flat';
   hint?: ReactNode;

package/es/dashboard/StatCard/StatCard.d.mts

@@ -1,7 +1,7 @@
 import { StatCardProps } from "./type.mjs";
 //#region src/dashboard/StatCard/StatCard.d.ts
 /** One metric in its own card: the same item as a `split` MetricStrip. */
-declare function StatCard({ action, className, delta, direction, hint, href, label, loading, mark, onClick, renderLink, value, valueTone }: StatCardProps): import("react").JSX.Element;
+declare function StatCard({ action, chart, className, delta, direction, hint, href, label, loading, mark, onClick, renderLink, value, valueTone }: StatCardProps): import("react").JSX.Element;
 declare namespace StatCard {
   var displayName: string;
 }

package/es/dashboard/StatCard/StatCard.mjs

@@ -7,7 +7,7 @@ import { jsx } from "react/jsx-runtime";
 import { cx } from "antd-style";
 //#region src/dashboard/StatCard/StatCard.tsx
 /** One metric in its own card: the same item as a `split` MetricStrip. */
-function StatCard({ action, className, delta, direction = "flat", hint, href, label, loading, mark, onClick, renderLink, value, valueTone }) {
+function StatCard({ action, chart, className, delta, direction = "flat", hint, href, label, loading, mark, onClick, renderLink, value, valueTone }) {
 	const cardClassName = useSurfaceCardClassName();
 	return /* @__PURE__ */ jsx("div", {
 		className: cx(styles$1.card, cardClassName, styles.clip, className),
@@ -15,6 +15,7 @@ function StatCard({ action, className, delta, direction = "flat", hint, href, la
 			renderLink,
 			item: {
 				action,
+				chart,
 				delta,
 				direction,
 				hint,

package/es/dashboard/StatCard/StatCard.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"StatCard.mjs","names":["metricStyles","surfaceStyles"],"sources":["../../../src/dashboard/StatCard/StatCard.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\n\nimport MetricCell from '../MetricStrip/MetricCell';\nimport { styles as metricStyles } from '../MetricStrip/style';\nimport { useSurfaceCardClassName } from '../Surface/link';\nimport { styles as surfaceStyles } from '../Surface/style';\nimport type { StatCardProps } from './type';\n\n/** One metric in its own card: the same item as a `split` MetricStrip. */\nfunction StatCard({\n  action,\n  className,\n  delta,\n  direction = 'flat',\n  hint,\n  href,\n  label,\n  loading,\n  mark,\n  onClick,\n  renderLink,\n  value,\n  valueTone,\n}: StatCardProps) {\n  const cardClassName = useSurfaceCardClassName();\n\n  return (\n    <div className={cx(metricStyles.card, cardClassName, surfaceStyles.clip, className)}>\n      <MetricCell\n        renderLink={renderLink}\n        item={{\n          action,\n          delta,\n          direction,\n          hint,\n          href,\n          label,\n          loading,\n          mark,\n          onClick,\n          value,\n          valueTone,\n        }}\n      />\n    </div>\n  );\n}\n\nStatCard.displayName = 'StatCard';\n\nexport default StatCard;\n"],"mappings":";;;;;;;;;AAWA,SAAS,SAAS,EAChB,QACA,WACA,OACA,YAAY,QACZ,MACA,MACA,OACA,SACA,MACA,SACA,YACA,OACA,aACgB;CAChB,MAAM,gBAAgB,wBAAwB;CAE9C,OACE,oBAAC,OAAD;EAAK,WAAW,GAAGA,SAAa,MAAM,eAAeC,OAAc,MAAM,SAAS;EAChF,UAAA,oBAAC,YAAD;GACc;GACZ,MAAM;IACJ;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;GACF;EACD,CAAA;CACE,CAAA;AAET;AAEA,SAAS,cAAc"}
+{"version":3,"file":"StatCard.mjs","names":["metricStyles","surfaceStyles"],"sources":["../../../src/dashboard/StatCard/StatCard.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\n\nimport MetricCell from '../MetricStrip/MetricCell';\nimport { styles as metricStyles } from '../MetricStrip/style';\nimport { useSurfaceCardClassName } from '../Surface/link';\nimport { styles as surfaceStyles } from '../Surface/style';\nimport type { StatCardProps } from './type';\n\n/** One metric in its own card: the same item as a `split` MetricStrip. */\nfunction StatCard({\n  action,\n  chart,\n  className,\n  delta,\n  direction = 'flat',\n  hint,\n  href,\n  label,\n  loading,\n  mark,\n  onClick,\n  renderLink,\n  value,\n  valueTone,\n}: StatCardProps) {\n  const cardClassName = useSurfaceCardClassName();\n\n  return (\n    <div className={cx(metricStyles.card, cardClassName, surfaceStyles.clip, className)}>\n      <MetricCell\n        renderLink={renderLink}\n        item={{\n          action,\n          chart,\n          delta,\n          direction,\n          hint,\n          href,\n          label,\n          loading,\n          mark,\n          onClick,\n          value,\n          valueTone,\n        }}\n      />\n    </div>\n  );\n}\n\nStatCard.displayName = 'StatCard';\n\nexport default StatCard;\n"],"mappings":";;;;;;;;;AAWA,SAAS,SAAS,EAChB,QACA,OACA,WACA,OACA,YAAY,QACZ,MACA,MACA,OACA,SACA,MACA,SACA,YACA,OACA,aACgB;CAChB,MAAM,gBAAgB,wBAAwB;CAE9C,OACE,oBAAC,OAAD;EAAK,WAAW,GAAGA,SAAa,MAAM,eAAeC,OAAc,MAAM,SAAS;EAChF,UAAA,oBAAC,YAAD;GACc;GACZ,MAAM;IACJ;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;GACF;EACD,CAAA;CACE,CAAA;AAET;AAEA,SAAS,cAAc"}

package/es/dashboard/StatCard/type.d.mts

@@ -9,6 +9,8 @@ type StatWash = 'gray';
 interface StatCardProps {
   /** Control rendered on the label row, such as a menu. */
   action?: ReactNode;
+  /** Full-width chart (sparkline, area) under the delta and hint. */
+  chart?: ReactNode;
   className?: string;
   /** Change amount, colored by `direction`. */
   delta?: ReactNode;

package/es/dashboard/Surface/style.d.mts

@@ -7,8 +7,9 @@
  * raised step. `colorFillQuaternary` (white 2%, about #111) would barely separate from the page.
  *
  * Borders and inner dividers (table, header and cell lines, PageSkeleton) use `colorFillSecondary`
- * (white 10% / black 6%); hover and focus use the stronger `colorFill`. Painted over the dark card
- * the border lands near #2f2f2f against #1c1c1c, and in light near #f0f0f0 against #ffffff.
+ * (white 10% in dark, black 6% in light); hover and focus use the stronger `colorFill`. The light
+ * card outline itself is one step darker (`colorFill`); dark keeps `colorFillSecondary`, which over
+ * the dark card lands near #2f2f2f against #1c1c1c.
  *
  * Anything that must hide content scrolled beneath it (table header cells, pinned and sticky
  * cells, their scroll shadows) uses `--lobe-surface-bg-solid`: the same white 6% blended onto

package/es/dashboard/Surface/style.mjs

@@ -8,8 +8,9 @@ import { createStaticStyles } from "antd-style";
 * raised step. `colorFillQuaternary` (white 2%, about #111) would barely separate from the page.
 *
 * Borders and inner dividers (table, header and cell lines, PageSkeleton) use `colorFillSecondary`
-* (white 10% / black 6%); hover and focus use the stronger `colorFill`. Painted over the dark card
-* the border lands near #2f2f2f against #1c1c1c, and in light near #f0f0f0 against #ffffff.
+* (white 10% in dark, black 6% in light); hover and focus use the stronger `colorFill`. The light
+* card outline itself is one step darker (`colorFill`); dark keeps `colorFillSecondary`, which over
+* the dark card lands near #2f2f2f against #1c1c1c.
 *
 * Anything that must hide content scrolled beneath it (table header cells, pinned and sticky
 * cells, their scroll shadows) uses `--lobe-surface-bg-solid`: the same white 6% blended onto
@@ -30,7 +31,7 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
 
     &&,
     &&:hover {
-      border: 1px solid ${cssVar.colorFillSecondary};
+      border: 1px solid ${cssVar.colorFill};
       border-radius: ${cssVar.borderRadiusLG};
       background: var(--lobe-surface-bg);
       box-shadow: rgb(0 0 0 / 4%) 0 1px 2px 0;
@@ -46,6 +47,9 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
         #fff 6%,
         var(--lobe-surface-canvas, ${cssVar.colorBgContainer})
       );
+
+      /* Dark keeps the lighter border; light mode uses the slightly darker colorFill. */
+      border-color: ${cssVar.colorFillSecondary};
     }
   `,
 	cardNested: css`

package/es/dashboard/Surface/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/Surface/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\n/**\n * A content card sitting on the workspace.\n *\n * Backgrounds: light mode uses `colorBgContainer`. Dark mode uses the translucent\n * `colorFillTertiary` (white 6%): on the #0d0d0d workspace it reads as about #1c1c1c, a subtle\n * raised step. `colorFillQuaternary` (white 2%, about #111) would barely separate from the page.\n *\n * Borders and inner dividers (table, header and cell lines, PageSkeleton) use `colorFillSecondary`\n * (white 10% / black 6%); hover and focus use the stronger `colorFill`. Painted over the dark card\n * the border lands near #2f2f2f against #1c1c1c, and in light near #f0f0f0 against #ffffff.\n *\n * Anything that must hide content scrolled beneath it (table header cells, pinned and sticky\n * cells, their scroll shadows) uses `--lobe-surface-bg-solid`: the same white 6% blended onto\n * `--lobe-surface-canvas` (default `colorBgContainer`, the ConsoleShell workspace). `color-mix`\n * in srgb with an opaque base is plain alpha compositing, so it matches the translucent card.\n * Set `--lobe-surface-canvas` when a card sits on another page color.\n *\n * A Surface inside another Surface (`useSurfaceDepth() > 0`) drops its own fill so fills do not\n * stack. Row hover backgrounds keep their own mix. Layout containers (ConsoleShell, ConsoleNav,\n * FilterSidebar split divider, AuthLayout page canvas) keep their own tokens.\n *\n * Apply the card with `useSurfaceCardClassName()`; plain `surfaceStyles.card` is the light look.\n */\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  card: css`\n    --lobe-surface-bg: ${cssVar.colorBgContainer};\n    --lobe-surface-bg-solid: ${cssVar.colorBgContainer};\n\n    &&,\n    &&:hover {\n      border: 1px solid ${cssVar.colorFillSecondary};\n      border-radius: ${cssVar.borderRadiusLG};\n      background: var(--lobe-surface-bg);\n      box-shadow: rgb(0 0 0 / 4%) 0 1px 2px 0;\n    }\n  `,\n  cardDark: css`\n    &&& {\n      --lobe-surface-bg: ${cssVar.colorFillTertiary};\n\n      /* colorFillTertiary is white 6% in dark; blend the same amount onto the page. */\n      --lobe-surface-bg-solid: color-mix(\n        in srgb,\n        #fff 6%,\n        var(--lobe-surface-canvas, ${cssVar.colorBgContainer})\n      );\n    }\n  `,\n  cardNested: css`\n    &&&,\n    &&&:hover {\n      background: transparent;\n    }\n  `,\n  chart: css`\n    min-inline-size: 0;\n  `,\n  /** Rounded corners clip a bled table, header rule, or chart. Bare cards keep overflow visible. */\n  clip: css`\n    overflow: hidden;\n  `,\n  loading: css`\n    padding-block: 4px 8px;\n  `,\n  arrow: css`\n    flex: none;\n\n    margin-block-start: 8px;\n    margin-inline-start: auto;\n\n    color: ${cssVar.colorTextTertiary};\n\n    transition:\n      color 150ms ease-out,\n      transform 150ms ease-out;\n  `,\n  arrowLink: css`\n    display: flex;\n    flex: none;\n    align-items: center;\n    color: inherit;\n\n    & [data-surface-arrow] {\n      margin-block-start: 0;\n    }\n  `,\n  bleed: css`\n    && th,\n    && td {\n      padding-inline: 16px;\n    }\n\n    && th {\n      white-space: nowrap;\n    }\n  `,\n  body: css`\n    --surface-pad-inline: 16px;\n    --surface-pad-block: 16px;\n\n    padding: 16px;\n  `,\n  /** Table and header rules for the rich card. Kept off `card` so the shared class stays a plain frame. */\n  content: css`\n    min-inline-size: 0;\n\n    /* Ant Design paints its own container color on .ant-table and the cells.\n       Clear it so the card background shows through; the card owns the fill. */\n    && .ant-table,\n    && th,\n    && td {\n      background: transparent;\n    }\n\n    && .ant-table-css-var,\n    && .ant-table-wrapper {\n      --ant-table-border-color: ${cssVar.colorFillSecondary};\n      --ant-table-row-hover-bg: color-mix(\n        in srgb,\n        ${cssVar.colorText} 6%,\n        ${cssVar.colorBgElevated}\n      );\n    }\n\n    && th {\n      font-weight: 500;\n      color: ${cssVar.colorTextSecondary};\n      white-space: nowrap;\n\n      background: var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer});\n      box-shadow: inset 0 -1px 0 ${cssVar.colorFillSecondary};\n    }\n\n    /* Pinned body cells inherit the transparent body, so a scrolled cell paints\n       straight through them. Frost with the card color. Header pins stay the\n       same solid fill as the rest of the header — a translucent header reads\n       as a lighter strip in dark mode. */\n    && td.ant-table-cell-fix-start,\n    && td.ant-table-cell-fix-end {\n      background: var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer});\n      backdrop-filter: blur(12px);\n    }\n\n    && td.ant-table-cell-fix-end-shadow-show::after {\n      background: linear-gradient(\n        to left,\n        color-mix(\n          in srgb,\n          var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer}) 72%,\n          transparent\n        ),\n        transparent\n      );\n      backdrop-filter: blur(8px);\n    }\n\n    && td.ant-table-cell-fix-start-shadow-show::after {\n      background: linear-gradient(\n        to right,\n        color-mix(\n          in srgb,\n          var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer}) 72%,\n          transparent\n        ),\n        transparent\n      );\n      backdrop-filter: blur(8px);\n    }\n\n    [dir='rtl'] && td.ant-table-cell-fix-end-shadow-show::after {\n      background: linear-gradient(\n        to right,\n        color-mix(\n          in srgb,\n          var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer}) 72%,\n          transparent\n        ),\n        transparent\n      );\n    }\n\n    [dir='rtl'] && td.ant-table-cell-fix-start-shadow-show::after {\n      background: linear-gradient(\n        to left,\n        color-mix(\n          in srgb,\n          var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer}) 72%,\n          transparent\n        ),\n        transparent\n      );\n    }\n\n    && td {\n      border-block-end-color: ${cssVar.colorFillSecondary};\n    }\n\n    && tr:hover > td,\n    && .ant-table-tbody > tr.ant-table-row:hover > td {\n      background: color-mix(in srgb, ${cssVar.colorText} 6%, ${cssVar.colorBgElevated});\n    }\n\n    /* base-ui Table pins with inline position:sticky, not .ant-table-cell-fix-*.\n       The transparent body rule above would let scrolled text show through. */\n    && td[style*='sticky'] {\n      background: var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer});\n    }\n\n    && tr:hover > td[style*='sticky'] {\n      background: color-mix(in srgb, ${cssVar.colorText} 6%, ${cssVar.colorBgElevated});\n    }\n  `,\n  /** Whole card answers hover when its header drills into another page. */\n  cardLinked: css`\n    &&:hover,\n    &&:focus-within {\n      border-color: ${cssVar.colorFill};\n    }\n\n    &&:hover [data-surface-arrow] {\n      transform: translate(1px, -1px);\n      color: ${cssVar.colorText};\n    }\n  `,\n  desc: css`\n    margin-block-start: -4px;\n\n    font-size: 13px;\n    font-weight: 400;\n    line-height: 1.45;\n    color: ${cssVar.colorTextSecondary};\n  `,\n  /* One fixed control row (32px, the height of a small Segmented or a default ActionIcon), so a\n     header with controls is exactly as tall as one without, and the controls sit centered with\n     8px clear above the divider. */\n  extra: css`\n    display: flex;\n    flex: none;\n    gap: 8px;\n    align-items: center;\n\n    block-size: 32px;\n  `,\n  header: css`\n    display: flex;\n    gap: 12px;\n    align-items: flex-start;\n    justify-content: space-between;\n\n    box-sizing: border-box;\n    min-block-size: 48px;\n    padding-block: 8px;\n    padding-inline: 16px;\n    border-block-end: 1px solid ${cssVar.colorFillSecondary};\n  `,\n  heading: css`\n    min-inline-size: 0;\n  `,\n  headingLink: css`\n    display: flex;\n    flex: 1;\n    gap: 12px;\n    align-items: flex-start;\n\n    min-inline-size: 0;\n\n    color: inherit;\n    text-decoration: none;\n\n    &:hover {\n      color: inherit;\n    }\n  `,\n  /**\n   * A table inside padded card body meets the card's left, right, and bottom\n   * edges. A table that is the only body content also meets the header.\n   * Padding amounts come from `--surface-pad-*` on the same element.\n   */\n  tableBleed: css`\n    /* A table nested in a cell keeps the cell's own inset. */\n    && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])) {\n      width: calc(100% + 2 * var(--surface-pad-inline, 16px));\n      margin-inline: calc(-1 * var(--surface-pad-inline, 16px));\n    }\n\n    && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])):last-child {\n      margin-block-end: calc(-1 * var(--surface-pad-block, 16px));\n    }\n\n    && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])):first-child:last-child {\n      margin-block-start: calc(-1 * var(--surface-pad-block, 16px));\n    }\n\n    /* ProTable keeps its search and toolbar in the padding. The table itself\n       meets the card's left, right, and bottom edges. Lower-specificity\n       selectors stay above the :has(th/td) rules for stylelint. */\n    && .ant-table-css-var,\n    && .ant-table-wrapper {\n      --ant-table-cell-padding-inline: var(--surface-pad-inline, 16px);\n      --ant-table-cell-padding-inline-md: var(--surface-pad-inline, 16px);\n      --ant-table-cell-padding-inline-sm: var(--surface-pad-inline, 16px);\n      --ant-table-header-border-radius: 0;\n    }\n\n    && .ant-table-wrapper {\n      width: calc(100% + 2 * var(--surface-pad-inline, 16px));\n      max-width: none;\n      margin-inline: calc(-1 * var(--surface-pad-inline, 16px));\n    }\n\n    /* A plain table that is the card body meets the header and the bottom edge.\n       Its own corner radius would otherwise float inside the card padding. */\n    && > .lobe-flex:only-child > .ant-table-wrapper:only-child {\n      margin-block: calc(-1 * var(--surface-pad-block, 16px));\n    }\n\n    && .ant-pro-table:last-child {\n      margin-block-end: calc(-1 * var(--surface-pad-block, 16px));\n    }\n\n    && .ant-table-wrapper .ant-table,\n    && .ant-table-wrapper .ant-table-container,\n    && .ant-table-thead > tr > th,\n    && .ant-table-thead > tr > th:first-child,\n    && .ant-table-thead > tr > th:last-child {\n      border-radius: 0;\n    }\n\n    && .ant-table-wrapper .ant-table-cell {\n      padding-inline: var(--surface-pad-inline, 16px);\n    }\n\n    && .ant-table-wrapper .ant-pagination {\n      margin-block: 0;\n      padding-block: 12px;\n      padding-inline: var(--surface-pad-inline, 16px);\n    }\n\n    && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])) th,\n    && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])) td {\n      padding-inline: var(--surface-pad-inline, 16px);\n    }\n\n    /* The root's negative bottom margin includes this sibling. Without block\n       padding the pager sits on the card edge. Same inset as the ant pagination. */\n    &&\n      :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper]))\n      > :not([data-table-wrapper]) {\n      margin-block: 0;\n      padding-block: 12px;\n      padding-inline: var(--surface-pad-inline, 16px);\n    }\n  `,\n  title: css`\n    overflow: hidden;\n\n    min-inline-size: 0;\n\n    font-size: 14px;\n    font-weight: 500;\n\n    /* The title line is the 32px control row; extra and the arrow center on it, and a\n       description adds its own line below without moving them. */\n    line-height: 32px;\n    color: ${cssVar.colorText};\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  `,\n}));\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAyBA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;yBACc,OAAO,iBAAiB;+BAClB,OAAO,iBAAiB;;;;0BAI7B,OAAO,mBAAmB;uBAC7B,OAAO,eAAe;;;;;CAK3C,UAAU,GAAG;;2BAEY,OAAO,kBAAkB;;;;;;qCAMf,OAAO,iBAAiB;;;;CAI3D,YAAY,GAAG;;;;;;CAMf,OAAO,GAAG;;;;CAIV,MAAM,GAAG;;;CAGT,SAAS,GAAG;;;CAGZ,OAAO,GAAG;;;;;;aAMC,OAAO,kBAAkB;;;;;;CAMpC,WAAW,GAAG;;;;;;;;;;CAUd,OAAO,GAAG;;;;;;;;;;CAUV,MAAM,GAAG;;;;;;;CAOT,SAAS,GAAG;;;;;;;;;;;;;kCAaoB,OAAO,mBAAmB;;;UAGlD,OAAO,UAAU;UACjB,OAAO,gBAAgB;;;;;;eAMlB,OAAO,mBAAmB;;;iDAGQ,OAAO,iBAAiB;mCACtC,OAAO,mBAAmB;;;;;;;;;iDASZ,OAAO,iBAAiB;;;;;;;;;yCAShC,OAAO,iBAAiB;;;;;;;;;;;;;yCAaxB,OAAO,iBAAiB;;;;;;;;;;;;;yCAaxB,OAAO,iBAAiB;;;;;;;;;;;;yCAYxB,OAAO,iBAAiB;;;;;;;;gCAQjC,OAAO,mBAAmB;;;;;uCAKnB,OAAO,UAAU,OAAO,OAAO,gBAAgB;;;;;;iDAMrC,OAAO,iBAAiB;;;;uCAIlC,OAAO,UAAU,OAAO,OAAO,gBAAgB;;;;CAIpF,YAAY,GAAG;;;sBAGK,OAAO,UAAU;;;;;eAKxB,OAAO,UAAU;;;CAG9B,MAAM,GAAG;;;;;;aAME,OAAO,mBAAmB;;CAKrC,OAAO,GAAG;;;;;;;;CAQV,QAAQ,GAAG;;;;;;;;;;kCAUqB,OAAO,mBAAmB;;CAE1D,SAAS,GAAG;;;CAGZ,aAAa,GAAG;;;;;;;;;;;;;;;;;;;;CAoBhB,YAAY,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2Ef,OAAO,GAAG;;;;;;;;;;;aAWC,OAAO,UAAU;;;;AAI9B,EAAE"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/Surface/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\n/**\n * A content card sitting on the workspace.\n *\n * Backgrounds: light mode uses `colorBgContainer`. Dark mode uses the translucent\n * `colorFillTertiary` (white 6%): on the #0d0d0d workspace it reads as about #1c1c1c, a subtle\n * raised step. `colorFillQuaternary` (white 2%, about #111) would barely separate from the page.\n *\n * Borders and inner dividers (table, header and cell lines, PageSkeleton) use `colorFillSecondary`\n * (white 10% in dark, black 6% in light); hover and focus use the stronger `colorFill`. The light\n * card outline itself is one step darker (`colorFill`); dark keeps `colorFillSecondary`, which over\n * the dark card lands near #2f2f2f against #1c1c1c.\n *\n * Anything that must hide content scrolled beneath it (table header cells, pinned and sticky\n * cells, their scroll shadows) uses `--lobe-surface-bg-solid`: the same white 6% blended onto\n * `--lobe-surface-canvas` (default `colorBgContainer`, the ConsoleShell workspace). `color-mix`\n * in srgb with an opaque base is plain alpha compositing, so it matches the translucent card.\n * Set `--lobe-surface-canvas` when a card sits on another page color.\n *\n * A Surface inside another Surface (`useSurfaceDepth() > 0`) drops its own fill so fills do not\n * stack. Row hover backgrounds keep their own mix. Layout containers (ConsoleShell, ConsoleNav,\n * FilterSidebar split divider, AuthLayout page canvas) keep their own tokens.\n *\n * Apply the card with `useSurfaceCardClassName()`; plain `surfaceStyles.card` is the light look.\n */\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  card: css`\n    --lobe-surface-bg: ${cssVar.colorBgContainer};\n    --lobe-surface-bg-solid: ${cssVar.colorBgContainer};\n\n    &&,\n    &&:hover {\n      border: 1px solid ${cssVar.colorFill};\n      border-radius: ${cssVar.borderRadiusLG};\n      background: var(--lobe-surface-bg);\n      box-shadow: rgb(0 0 0 / 4%) 0 1px 2px 0;\n    }\n  `,\n  cardDark: css`\n    &&& {\n      --lobe-surface-bg: ${cssVar.colorFillTertiary};\n\n      /* colorFillTertiary is white 6% in dark; blend the same amount onto the page. */\n      --lobe-surface-bg-solid: color-mix(\n        in srgb,\n        #fff 6%,\n        var(--lobe-surface-canvas, ${cssVar.colorBgContainer})\n      );\n\n      /* Dark keeps the lighter border; light mode uses the slightly darker colorFill. */\n      border-color: ${cssVar.colorFillSecondary};\n    }\n  `,\n  cardNested: css`\n    &&&,\n    &&&:hover {\n      background: transparent;\n    }\n  `,\n  chart: css`\n    min-inline-size: 0;\n  `,\n  /** Rounded corners clip a bled table, header rule, or chart. Bare cards keep overflow visible. */\n  clip: css`\n    overflow: hidden;\n  `,\n  loading: css`\n    padding-block: 4px 8px;\n  `,\n  arrow: css`\n    flex: none;\n\n    margin-block-start: 8px;\n    margin-inline-start: auto;\n\n    color: ${cssVar.colorTextTertiary};\n\n    transition:\n      color 150ms ease-out,\n      transform 150ms ease-out;\n  `,\n  arrowLink: css`\n    display: flex;\n    flex: none;\n    align-items: center;\n    color: inherit;\n\n    & [data-surface-arrow] {\n      margin-block-start: 0;\n    }\n  `,\n  bleed: css`\n    && th,\n    && td {\n      padding-inline: 16px;\n    }\n\n    && th {\n      white-space: nowrap;\n    }\n  `,\n  body: css`\n    --surface-pad-inline: 16px;\n    --surface-pad-block: 16px;\n\n    padding: 16px;\n  `,\n  /** Table and header rules for the rich card. Kept off `card` so the shared class stays a plain frame. */\n  content: css`\n    min-inline-size: 0;\n\n    /* Ant Design paints its own container color on .ant-table and the cells.\n       Clear it so the card background shows through; the card owns the fill. */\n    && .ant-table,\n    && th,\n    && td {\n      background: transparent;\n    }\n\n    && .ant-table-css-var,\n    && .ant-table-wrapper {\n      --ant-table-border-color: ${cssVar.colorFillSecondary};\n      --ant-table-row-hover-bg: color-mix(\n        in srgb,\n        ${cssVar.colorText} 6%,\n        ${cssVar.colorBgElevated}\n      );\n    }\n\n    && th {\n      font-weight: 500;\n      color: ${cssVar.colorTextSecondary};\n      white-space: nowrap;\n\n      background: var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer});\n      box-shadow: inset 0 -1px 0 ${cssVar.colorFillSecondary};\n    }\n\n    /* Pinned body cells inherit the transparent body, so a scrolled cell paints\n       straight through them. Frost with the card color. Header pins stay the\n       same solid fill as the rest of the header — a translucent header reads\n       as a lighter strip in dark mode. */\n    && td.ant-table-cell-fix-start,\n    && td.ant-table-cell-fix-end {\n      background: var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer});\n      backdrop-filter: blur(12px);\n    }\n\n    && td.ant-table-cell-fix-end-shadow-show::after {\n      background: linear-gradient(\n        to left,\n        color-mix(\n          in srgb,\n          var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer}) 72%,\n          transparent\n        ),\n        transparent\n      );\n      backdrop-filter: blur(8px);\n    }\n\n    && td.ant-table-cell-fix-start-shadow-show::after {\n      background: linear-gradient(\n        to right,\n        color-mix(\n          in srgb,\n          var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer}) 72%,\n          transparent\n        ),\n        transparent\n      );\n      backdrop-filter: blur(8px);\n    }\n\n    [dir='rtl'] && td.ant-table-cell-fix-end-shadow-show::after {\n      background: linear-gradient(\n        to right,\n        color-mix(\n          in srgb,\n          var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer}) 72%,\n          transparent\n        ),\n        transparent\n      );\n    }\n\n    [dir='rtl'] && td.ant-table-cell-fix-start-shadow-show::after {\n      background: linear-gradient(\n        to left,\n        color-mix(\n          in srgb,\n          var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer}) 72%,\n          transparent\n        ),\n        transparent\n      );\n    }\n\n    && td {\n      border-block-end-color: ${cssVar.colorFillSecondary};\n    }\n\n    && tr:hover > td,\n    && .ant-table-tbody > tr.ant-table-row:hover > td {\n      background: color-mix(in srgb, ${cssVar.colorText} 6%, ${cssVar.colorBgElevated});\n    }\n\n    /* base-ui Table pins with inline position:sticky, not .ant-table-cell-fix-*.\n       The transparent body rule above would let scrolled text show through. */\n    && td[style*='sticky'] {\n      background: var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer});\n    }\n\n    && tr:hover > td[style*='sticky'] {\n      background: color-mix(in srgb, ${cssVar.colorText} 6%, ${cssVar.colorBgElevated});\n    }\n  `,\n  /** Whole card answers hover when its header drills into another page. */\n  cardLinked: css`\n    &&:hover,\n    &&:focus-within {\n      border-color: ${cssVar.colorFill};\n    }\n\n    &&:hover [data-surface-arrow] {\n      transform: translate(1px, -1px);\n      color: ${cssVar.colorText};\n    }\n  `,\n  desc: css`\n    margin-block-start: -4px;\n\n    font-size: 13px;\n    font-weight: 400;\n    line-height: 1.45;\n    color: ${cssVar.colorTextSecondary};\n  `,\n  /* One fixed control row (32px, the height of a small Segmented or a default ActionIcon), so a\n     header with controls is exactly as tall as one without, and the controls sit centered with\n     8px clear above the divider. */\n  extra: css`\n    display: flex;\n    flex: none;\n    gap: 8px;\n    align-items: center;\n\n    block-size: 32px;\n  `,\n  header: css`\n    display: flex;\n    gap: 12px;\n    align-items: flex-start;\n    justify-content: space-between;\n\n    box-sizing: border-box;\n    min-block-size: 48px;\n    padding-block: 8px;\n    padding-inline: 16px;\n    border-block-end: 1px solid ${cssVar.colorFillSecondary};\n  `,\n  heading: css`\n    min-inline-size: 0;\n  `,\n  headingLink: css`\n    display: flex;\n    flex: 1;\n    gap: 12px;\n    align-items: flex-start;\n\n    min-inline-size: 0;\n\n    color: inherit;\n    text-decoration: none;\n\n    &:hover {\n      color: inherit;\n    }\n  `,\n  /**\n   * A table inside padded card body meets the card's left, right, and bottom\n   * edges. A table that is the only body content also meets the header.\n   * Padding amounts come from `--surface-pad-*` on the same element.\n   */\n  tableBleed: css`\n    /* A table nested in a cell keeps the cell's own inset. */\n    && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])) {\n      width: calc(100% + 2 * var(--surface-pad-inline, 16px));\n      margin-inline: calc(-1 * var(--surface-pad-inline, 16px));\n    }\n\n    && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])):last-child {\n      margin-block-end: calc(-1 * var(--surface-pad-block, 16px));\n    }\n\n    && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])):first-child:last-child {\n      margin-block-start: calc(-1 * var(--surface-pad-block, 16px));\n    }\n\n    /* ProTable keeps its search and toolbar in the padding. The table itself\n       meets the card's left, right, and bottom edges. Lower-specificity\n       selectors stay above the :has(th/td) rules for stylelint. */\n    && .ant-table-css-var,\n    && .ant-table-wrapper {\n      --ant-table-cell-padding-inline: var(--surface-pad-inline, 16px);\n      --ant-table-cell-padding-inline-md: var(--surface-pad-inline, 16px);\n      --ant-table-cell-padding-inline-sm: var(--surface-pad-inline, 16px);\n      --ant-table-header-border-radius: 0;\n    }\n\n    && .ant-table-wrapper {\n      width: calc(100% + 2 * var(--surface-pad-inline, 16px));\n      max-width: none;\n      margin-inline: calc(-1 * var(--surface-pad-inline, 16px));\n    }\n\n    /* A plain table that is the card body meets the header and the bottom edge.\n       Its own corner radius would otherwise float inside the card padding. */\n    && > .lobe-flex:only-child > .ant-table-wrapper:only-child {\n      margin-block: calc(-1 * var(--surface-pad-block, 16px));\n    }\n\n    && .ant-pro-table:last-child {\n      margin-block-end: calc(-1 * var(--surface-pad-block, 16px));\n    }\n\n    && .ant-table-wrapper .ant-table,\n    && .ant-table-wrapper .ant-table-container,\n    && .ant-table-thead > tr > th,\n    && .ant-table-thead > tr > th:first-child,\n    && .ant-table-thead > tr > th:last-child {\n      border-radius: 0;\n    }\n\n    && .ant-table-wrapper .ant-table-cell {\n      padding-inline: var(--surface-pad-inline, 16px);\n    }\n\n    && .ant-table-wrapper .ant-pagination {\n      margin-block: 0;\n      padding-block: 12px;\n      padding-inline: var(--surface-pad-inline, 16px);\n    }\n\n    && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])) th,\n    && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])) td {\n      padding-inline: var(--surface-pad-inline, 16px);\n    }\n\n    /* The root's negative bottom margin includes this sibling. Without block\n       padding the pager sits on the card edge. Same inset as the ant pagination. */\n    &&\n      :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper]))\n      > :not([data-table-wrapper]) {\n      margin-block: 0;\n      padding-block: 12px;\n      padding-inline: var(--surface-pad-inline, 16px);\n    }\n  `,\n  title: css`\n    overflow: hidden;\n\n    min-inline-size: 0;\n\n    font-size: 14px;\n    font-weight: 500;\n\n    /* The title line is the 32px control row; extra and the arrow center on it, and a\n       description adds its own line below without moving them. */\n    line-height: 32px;\n    color: ${cssVar.colorText};\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  `,\n}));\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;yBACc,OAAO,iBAAiB;+BAClB,OAAO,iBAAiB;;;;0BAI7B,OAAO,UAAU;uBACpB,OAAO,eAAe;;;;;CAK3C,UAAU,GAAG;;2BAEY,OAAO,kBAAkB;;;;;;qCAMf,OAAO,iBAAiB;;;;sBAIvC,OAAO,mBAAmB;;;CAG9C,YAAY,GAAG;;;;;;CAMf,OAAO,GAAG;;;;CAIV,MAAM,GAAG;;;CAGT,SAAS,GAAG;;;CAGZ,OAAO,GAAG;;;;;;aAMC,OAAO,kBAAkB;;;;;;CAMpC,WAAW,GAAG;;;;;;;;;;CAUd,OAAO,GAAG;;;;;;;;;;CAUV,MAAM,GAAG;;;;;;;CAOT,SAAS,GAAG;;;;;;;;;;;;;kCAaoB,OAAO,mBAAmB;;;UAGlD,OAAO,UAAU;UACjB,OAAO,gBAAgB;;;;;;eAMlB,OAAO,mBAAmB;;;iDAGQ,OAAO,iBAAiB;mCACtC,OAAO,mBAAmB;;;;;;;;;iDASZ,OAAO,iBAAiB;;;;;;;;;yCAShC,OAAO,iBAAiB;;;;;;;;;;;;;yCAaxB,OAAO,iBAAiB;;;;;;;;;;;;;yCAaxB,OAAO,iBAAiB;;;;;;;;;;;;yCAYxB,OAAO,iBAAiB;;;;;;;;gCAQjC,OAAO,mBAAmB;;;;;uCAKnB,OAAO,UAAU,OAAO,OAAO,gBAAgB;;;;;;iDAMrC,OAAO,iBAAiB;;;;uCAIlC,OAAO,UAAU,OAAO,OAAO,gBAAgB;;;;CAIpF,YAAY,GAAG;;;sBAGK,OAAO,UAAU;;;;;eAKxB,OAAO,UAAU;;;CAG9B,MAAM,GAAG;;;;;;aAME,OAAO,mBAAmB;;CAKrC,OAAO,GAAG;;;;;;;;CAQV,QAAQ,GAAG;;;;;;;;;;kCAUqB,OAAO,mBAAmB;;CAE1D,SAAS,GAAG;;;CAGZ,aAAa,GAAG;;;;;;;;;;;;;;;;;;;;CAoBhB,YAAY,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2Ef,OAAO,GAAG;;;;;;;;;;;aAWC,OAAO,UAAU;;;;AAI9B,EAAE"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/ui",
-  "version": "5.61.1",
+  "version": "5.62.1",
   "description": "Lobe UI is an open-source UI component library for building AIGC web apps",
   "keywords": [
     "lobehub",
@@ -85,6 +85,10 @@
       "types": "./es/base-ui/FormKit/index.d.mts",
       "import": "./es/base-ui/FormKit/index.mjs"
     },
+    "./base-ui/pro-table": {
+      "types": "./es/base-ui/ProTable/index.d.mts",
+      "import": "./es/base-ui/ProTable/index.mjs"
+    },
     "./eslint": {
       "types": "./es/eslint/index.d.mts",
       "import": "./es/eslint/index.mjs"