@rafal.lemieszewski/tide-ui 0.42.0 → 0.44.0

package/dist/components/index.d.ts

@@ -4,6 +4,8 @@ export { Chart, generateChartColors, createChartConfig, chartColorSchemes } from
 export type { ChartProps, ChartConfig, ChartDataPoint, ChartType, ChartColorScheme } from './ui/chart';
 export { Avatar, AvatarImage, AvatarFallback, avatarVariants, avatarFallbackVariants } from './ui/avatar';
 export type { AvatarProps, AvatarFallbackProps } from './ui/avatar';
+export { AvatarGroup } from './ui/avatar-group';
+export type { AvatarGroupProps, AvatarGroupSize } from './ui/avatar-group';
 export { Badge } from './ui/badge';
 export type { BadgeProps } from './ui/badge';
 export { Collapsible, CollapsibleTrigger, CollapsibleContent } from './ui/collapsible';
@@ -27,8 +29,10 @@ export type { FixtureStatusProps, StatusValue, StatusConfig } from './ui/fixture
 export { Switch } from './ui/switch';
 export { Textarea } from './ui/textarea';
 export type { TextareaProps } from './ui/textarea';
-export { Timeline, TimelineItem, TimelineSeparator, TimelineHeader, TimelineContent, TimelineDescription, TimelineTime, TimelineChevron, } from './ui/timeline';
-export type { TimelineProps, TimelineItemProps, TimelineSeparatorProps, TimelineHeaderProps, TimelineContentProps, TimelineDescriptionProps, TimelineTimeProps, TimelineChevronProps, } from './ui/timeline';
+export { ActivityLog, ActivityLogItem, ActivityLogSeparator, ActivityLogHeader, ActivityLogContent, ActivityLogDescription, ActivityLogTime, ActivityLogChevron, ActivityLogValue, } from './ui/activity-log';
+export type { ActivityLogProps, ActivityLogItemProps, ActivityLogSeparatorProps, ActivityLogHeaderProps, ActivityLogContentProps, ActivityLogDescriptionProps, ActivityLogTimeProps, ActivityLogChevronProps, ActivityLogValueProps, } from './ui/activity-log';
+export { AttributesList, AttributesSeparator, AttributesGroup, AttributesItem, AttributesRow, AttributesLabel, AttributesValue, AttributesContent, AttributesChevron, } from './ui/attributes-list';
+export type { AttributesListProps, AttributesSeparatorProps, AttributesGroupProps, AttributesItemProps, AttributesRowProps, AttributesLabelProps, AttributesValueProps, AttributesContentProps, AttributesChevronProps, } from './ui/attributes-list';
 export { Editable, EditablePreview, EditableInput, EditableDisplay, EditableField } from './ui/editable';
 export type { EditableProps, EditablePreviewProps, EditableInputProps } from './ui/editable';
 export { FormField, FormLabel, FormControl, FormHelperText, FormErrorMessage } from './ui/form-field';

package/dist/components/ui/activity-log.d.ts

@@ -0,0 +1,61 @@
+import { CollapsibleContent } from './collapsible';
+import * as React from "react";
+export interface ActivityLogProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Time threshold in milliseconds. If the time difference between consecutive
+     * ActivityLogItem timestamps exceeds this value, a ActivityLogSeparator will be
+     * automatically inserted between them.
+     */
+    separatorThreshold?: number;
+}
+declare const ActivityLog: React.ForwardRefExoticComponent<ActivityLogProps & React.RefAttributes<HTMLDivElement>>;
+export interface ActivityLogItemProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Whether this timeline item can be expanded/collapsed
+     */
+    collapsible?: boolean;
+    /**
+     * Default open state for uncontrolled collapsible items
+     */
+    defaultOpen?: boolean;
+    /**
+     * Controlled open state
+     */
+    open?: boolean;
+    /**
+     * Callback when open state changes
+     */
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * Timestamp for this activity log item (used for automatic separator insertion)
+     */
+    timestamp?: Date | number | string;
+}
+declare const ActivityLogItem: React.ForwardRefExoticComponent<ActivityLogItemProps & React.RefAttributes<HTMLDivElement>>;
+export interface ActivityLogSeparatorProps extends React.HTMLAttributes<HTMLDivElement> {
+}
+declare const ActivityLogSeparator: React.ForwardRefExoticComponent<ActivityLogSeparatorProps & React.RefAttributes<HTMLDivElement>>;
+export interface ActivityLogHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * If true, the header will render as a CollapsibleTrigger
+     * This is automatically set when ActivityLogItem has collapsible={true}
+     */
+    asCollapsibleTrigger?: boolean;
+}
+declare const ActivityLogHeader: React.ForwardRefExoticComponent<ActivityLogHeaderProps & React.RefAttributes<HTMLDivElement>>;
+export interface ActivityLogContentProps extends React.ComponentPropsWithoutRef<typeof CollapsibleContent> {
+}
+declare const ActivityLogContent: React.ForwardRefExoticComponent<ActivityLogContentProps & React.RefAttributes<HTMLDivElement>>;
+export interface ActivityLogDescriptionProps extends React.HTMLAttributes<HTMLDivElement> {
+}
+declare const ActivityLogDescription: React.ForwardRefExoticComponent<ActivityLogDescriptionProps & React.RefAttributes<HTMLDivElement>>;
+export interface ActivityLogTimeProps extends React.HTMLAttributes<HTMLParagraphElement> {
+}
+declare const ActivityLogTime: React.ForwardRefExoticComponent<ActivityLogTimeProps & React.RefAttributes<HTMLParagraphElement>>;
+export interface ActivityLogChevronProps extends React.HTMLAttributes<HTMLDivElement> {
+}
+declare const ActivityLogChevron: React.ForwardRefExoticComponent<ActivityLogChevronProps & React.RefAttributes<HTMLDivElement>>;
+export interface ActivityLogValueProps extends React.HTMLAttributes<HTMLDivElement> {
+}
+declare const ActivityLogValue: React.ForwardRefExoticComponent<ActivityLogValueProps & React.RefAttributes<HTMLDivElement>>;
+export { ActivityLog, ActivityLogItem, ActivityLogSeparator, ActivityLogHeader, ActivityLogContent, ActivityLogDescription, ActivityLogTime, ActivityLogChevron, ActivityLogValue, };

package/dist/components/ui/attributes-list.d.ts

@@ -0,0 +1,94 @@
+import { CollapsibleContent } from './collapsible';
+import * as React from "react";
+export interface AttributesListProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Label for the "View all" button that shows hidden items
+     * @default "More details"
+     */
+    showHiddenLabel?: string;
+    /**
+     * Label for the "View less" button that hides hidden items
+     * @default "Less details"
+     */
+    hideLabel?: string;
+    /**
+     * Default visibility state for hidden items
+     */
+    defaultShowHidden?: boolean;
+}
+declare const AttributesList: React.ForwardRefExoticComponent<AttributesListProps & React.RefAttributes<HTMLDivElement>>;
+export interface AttributesSeparatorProps extends React.HTMLAttributes<HTMLDivElement> {
+}
+declare const AttributesSeparator: React.ForwardRefExoticComponent<AttributesSeparatorProps & React.RefAttributes<HTMLDivElement>>;
+export interface AttributesGroupProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Section label/header
+     */
+    label?: string;
+    /**
+     * Label for the "View all" button that shows hidden items
+     * @default "More details"
+     */
+    showHiddenLabel?: string;
+    /**
+     * Label for the "View less" button that hides hidden items
+     * @default "Less details"
+     */
+    hideLabel?: string;
+    /**
+     * Default visibility state for hidden items
+     */
+    defaultShowHidden?: boolean;
+}
+declare const AttributesGroup: React.ForwardRefExoticComponent<AttributesGroupProps & React.RefAttributes<HTMLDivElement>>;
+export interface AttributesItemProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Whether this item can be expanded/collapsed
+     */
+    collapsible?: boolean;
+    /**
+     * Default open state for uncontrolled collapsible items
+     */
+    defaultOpen?: boolean;
+    /**
+     * Controlled open state
+     */
+    open?: boolean;
+    /**
+     * Callback when open state changes
+     */
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * Whether this item should be hidden until "View all" is clicked
+     */
+    hidden?: boolean;
+}
+declare const AttributesItem: React.ForwardRefExoticComponent<AttributesItemProps & React.RefAttributes<HTMLDivElement>>;
+export interface AttributesRowProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * If true, the row will render as a CollapsibleTrigger
+     * This is automatically set when AttributesItem has collapsible={true}
+     */
+    asCollapsibleTrigger?: boolean;
+    /**
+     * Optional external link configuration
+     */
+    externalLink?: {
+        href: string;
+        label: string;
+    };
+}
+declare const AttributesRow: React.ForwardRefExoticComponent<AttributesRowProps & React.RefAttributes<HTMLDivElement>>;
+export interface AttributesLabelProps extends React.HTMLAttributes<HTMLDivElement> {
+}
+declare const AttributesLabel: React.ForwardRefExoticComponent<AttributesLabelProps & React.RefAttributes<HTMLDivElement>>;
+export interface AttributesValueProps extends React.HTMLAttributes<HTMLDivElement> {
+}
+declare const AttributesValue: React.ForwardRefExoticComponent<AttributesValueProps & React.RefAttributes<HTMLDivElement>>;
+export interface AttributesContentProps extends React.ComponentPropsWithoutRef<typeof CollapsibleContent> {
+}
+declare const AttributesContent: React.ForwardRefExoticComponent<AttributesContentProps & React.RefAttributes<HTMLDivElement>>;
+export interface AttributesChevronProps extends React.HTMLAttributes<HTMLDivElement> {
+}
+declare const AttributesChevron: React.ForwardRefExoticComponent<AttributesChevronProps & React.RefAttributes<HTMLDivElement>>;
+export { AttributesList, AttributesSeparator, AttributesGroup, AttributesItem, AttributesRow, AttributesLabel, AttributesValue, AttributesContent, AttributesChevron, };

package/dist/components/ui/avatar-group.d.ts

@@ -0,0 +1,16 @@
+import * as React from "react";
+declare const avatarGroupOverlapClasses: {
+    readonly xxs: "-ml-[6px]";
+    readonly xs: "-ml-[var(--space-xsm)]";
+    readonly sm: "-ml-[var(--space-sm)]";
+    readonly md: "-ml-[var(--space-md)]";
+    readonly lg: "-ml-[var(--space-lg)]";
+    readonly xl: "-ml-[var(--space-lg)]";
+};
+export type AvatarGroupSize = keyof typeof avatarGroupOverlapClasses;
+export interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Size of avatars in the group (determines overlap amount) */
+    size?: AvatarGroupSize;
+}
+declare const AvatarGroup: React.ForwardRefExoticComponent<AvatarGroupProps & React.RefAttributes<HTMLDivElement>>;
+export { AvatarGroup };

package/dist/components/ui/avatar.d.ts

@@ -3,11 +3,11 @@ import * as React from "react";
 import * as AvatarPrimitive from "@radix-ui/react-avatar";
 declare const avatarVariants: (props?: ({
     size?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
-    shape?: "circle" | "rounded" | null | undefined;
+    type?: "user" | "organization" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 declare const avatarFallbackVariants: (props?: ({
     size?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
-    shape?: "circle" | "rounded" | null | undefined;
+    type?: "user" | "organization" | null | undefined;
     variant?: "success" | "warning" | "magenta" | "violet" | "information" | "error" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 interface AvatarProps extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>, VariantProps<typeof avatarVariants> {

package/dist/components/ui/badge.d.ts

@@ -1,9 +1,8 @@
 import { VariantProps } from 'class-variance-authority';
 import * as React from "react";
 declare const badgeVariants: (props?: ({
-    variant?: "default" | "destructive" | "secondary" | "outline" | null | undefined;
     intent?: "success" | "warning" | "destructive" | "magenta" | "violet" | "information" | "neutral" | "brand" | null | undefined;
-    appearance?: "solid" | "outline" | "subtle" | null | undefined;
+    appearance?: "solid" | "subtle" | "outline" | null | undefined;
     size?: "sm" | "md" | "lg" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {

package/dist/components/ui/button.d.ts

@@ -2,7 +2,7 @@ import { default as React } from 'react';
 import { VariantProps } from 'class-variance-authority';
 import { IconType } from './icon';
 declare const buttonVariants: (props?: ({
-    variant?: "default" | "success" | "destructive" | "secondary" | "primary" | "ghost" | null | undefined;
+    variant?: "default" | "success" | "destructive" | "primary" | "secondary" | "ghost" | null | undefined;
     size?: "sm" | "md" | "lg" | null | undefined;
     iconPosition?: "none" | "left" | "right" | "only" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;

package/dist/components/ui/data-table.d.ts

@@ -40,9 +40,35 @@ declare module '@tanstack/react-table' {
         align?: 'left' | 'right';
         truncate?: boolean;
     }
+    interface ColumnDefBase<TData extends unknown, TValue = unknown> {
+        /**
+         * Custom cell renderer for section header rows.
+         * Similar to aggregatedCell for grouped rows, this allows rendering
+         * custom content for rows that act as section headers.
+         *
+         * When this returns non-null content, the row is treated as a section header:
+         * - The cell spans the full table width (colSpan = all columns)
+         * - Appropriate section header styling is applied
+         * - Other cells in the row are not rendered
+         *
+         * @example
+         * {
+         *   id: 'broker',
+         *   accessorKey: 'broker',
+         *   sectionHeaderCell: ({ row }) => {
+         *     if (row.original.isSectionHeader) {
+         *       return <div>Section: {row.original.name}</div>
+         *     }
+         *     return null
+         *   }
+         * }
+         */
+        sectionHeaderCell?: (info: any) => React.ReactNode;
+    }
 }
 declare const fuzzyFilter: FilterFn<any>;
 declare const multiSelectFilter: FilterFn<any>;
+declare const groupPreservingGlobalFilter: FilterFn<any>;
 interface DataTableSkeletonProps {
     columns: number;
     rows: number;
@@ -104,6 +130,22 @@ export interface DataTableProps<TData, TValue> {
     globalSearchPlaceholder?: string;
     enableExpanding?: boolean;
     getSubRows?: (row: TData) => TData[] | undefined;
+    /**
+     * Custom color overrides for expanding rows at different depths and states.
+     * If not provided, uses smart context-aware defaults that match grouping colors.
+     *
+     * @example
+     * expandingRowColors={{
+     *   expandedParent: 'var(--blue-50)',
+     *   collapsedParent: 'var(--color-background-neutral-subtle)',
+     *   children: 'var(--blue-25)'
+     * }}
+     */
+    expandingRowColors?: {
+        expandedParent?: string;
+        collapsedParent?: string;
+        children?: string;
+    };
     enableGrouping?: boolean;
     groupedColumnMode?: 'reorder' | 'remove' | false;
     enableManualGrouping?: boolean;
@@ -219,8 +261,14 @@ export interface DataTableProps<TData, TValue> {
      * Default: applies cursor-pointer and hover background if onRowClick is provided
      */
     clickableRowClassName?: string;
+    /**
+     * When enabled with grouping, preserves entire groups during global search.
+     * If any row in a group matches, the entire group is shown and auto-expanded.
+     * Also enables highlighting of matched search terms.
+     */
+    groupPreservingSearch?: boolean;
 }
-export declare function DataTable<TData, TValue>({ columns, data, searchKey, searchPlaceholder, title, className, stickyHeader, stickyFirstColumn, stickyLeftColumns, stickyRightColumns, enableResponsiveWrapper, showScrollIndicators, isLoading, loadingRowCount, borderStyle, enableGlobalSearch, globalSearchPlaceholder, enableGlobalFaceting, enableColumnResizing, columnResizeMode, enableColumnResizePersistence, storageKey, enableExpanding, getSubRows, enableGrouping, groupedColumnMode, enableManualGrouping, groupDisplayColumn, hideChildrenForSingleItemGroups, hideExpanderForSingleItemGroups, enableRowPinning, keepPinnedRows, enableVirtualization, nestedHeaders, enableNestedHeaders, enableColumnOrdering, enableRowSelection, showHeader, showPagination, onTableReady, initialState, sorting: controlledSorting, onSortingChange: onControlledSortingChange, columnVisibility: controlledColumnVisibility, onColumnVisibilityChange: onControlledColumnVisibilityChange, grouping: controlledGrouping, onGroupingChange: onControlledGroupingChange, columnOrder: controlledColumnOrder, onColumnOrderChange: onControlledColumnOrderChange, columnSizing: controlledColumnSizing, onColumnSizingChange: onControlledColumnSizingChange, renderSectionHeaderRow, autoExpandChildren, onRowClick, isRowClickable, clickableRowClassName, }: DataTableProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
-export { DataTableColumnHeader, DataTableFilter, DataTableToolbar, DataTablePagination, DataTableSkeleton, fuzzyFilter, multiSelectFilter };
+export declare function DataTable<TData, TValue>({ columns, data, searchKey, searchPlaceholder, title, className, stickyHeader, stickyFirstColumn, stickyLeftColumns, stickyRightColumns, enableResponsiveWrapper, showScrollIndicators, isLoading, loadingRowCount, borderStyle, enableGlobalSearch, globalSearchPlaceholder, enableGlobalFaceting, enableColumnResizing, columnResizeMode, enableColumnResizePersistence, storageKey, enableExpanding, getSubRows, expandingRowColors, enableGrouping, groupedColumnMode, enableManualGrouping, groupDisplayColumn, hideChildrenForSingleItemGroups, hideExpanderForSingleItemGroups, enableRowPinning, keepPinnedRows, enableVirtualization, nestedHeaders, enableNestedHeaders, enableColumnOrdering, enableRowSelection, showHeader, showPagination, onTableReady, initialState, sorting: controlledSorting, onSortingChange: onControlledSortingChange, columnVisibility: controlledColumnVisibility, onColumnVisibilityChange: onControlledColumnVisibilityChange, grouping: controlledGrouping, onGroupingChange: onControlledGroupingChange, columnOrder: controlledColumnOrder, onColumnOrderChange: onControlledColumnOrderChange, columnSizing: controlledColumnSizing, onColumnSizingChange: onControlledColumnSizingChange, renderSectionHeaderRow, autoExpandChildren, onRowClick, isRowClickable, clickableRowClassName, groupPreservingSearch, }: DataTableProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
+export { DataTableColumnHeader, DataTableFilter, DataTableToolbar, DataTablePagination, DataTableSkeleton, fuzzyFilter, multiSelectFilter, groupPreservingGlobalFilter };
 export { useReactTable } from '@tanstack/react-table';
 export type { SortingState, ColumnFiltersState, VisibilityState, ExpandedState, GroupingState, ColumnOrderState, FilterFn, ColumnResizeMode, } from '@tanstack/react-table';

package/dist/components/ui/spinner.d.ts

@@ -2,7 +2,7 @@ import { VariantProps } from 'class-variance-authority';
 import * as React from "react";
 declare const spinnerVariants: (props?: ({
     size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | null | undefined;
-    variant?: "default" | "success" | "warning" | "error" | "secondary" | "primary" | "tertiary" | "disabled" | "inverse" | null | undefined;
+    variant?: "default" | "success" | "warning" | "error" | "primary" | "secondary" | "tertiary" | "disabled" | "inverse" | null | undefined;
     speed?: "normal" | "slow" | "fast" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export interface SpinnerProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof spinnerVariants> {