@rebasepro/ui 0.0.1-canary.0 → 0.0.1-canary.09e5ec5

package/dist/components/Checkbox.d.ts

@@ -8,5 +8,6 @@ export interface CheckboxProps {
     padding?: boolean;
     size?: "smallest" | "small" | "medium" | "large";
     color?: "primary" | "secondary";
+    "aria-label"?: string;
 }
-export declare const Checkbox: React.MemoExoticComponent<({ id, checked, indeterminate, padding, disabled, size, onCheckedChange, color }: CheckboxProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const Checkbox: React.MemoExoticComponent<({ id, checked, indeterminate, padding, disabled, size, onCheckedChange, color, "aria-label": ariaLabel }: CheckboxProps) => import("react/jsx-runtime").JSX.Element>;

package/dist/components/Chip.d.ts

@@ -3,6 +3,10 @@ import { CHIP_COLORS } from "../util";
 export type ChipColorScheme = {
     color: string;
     text: string;
+    /** Background color override for dark mode */
+    darkColor?: string;
+    /** Text color override for dark mode */
+    darkText?: string;
 };
 export type ChipColorKey = keyof typeof CHIP_COLORS;
 export interface ChipProps {

package/dist/components/CircularProgressCenter.d.ts

@@ -0,0 +1,11 @@
+import { CircularProgressProps } from "./CircularProgress";
+/**
+ *
+ * @param text
+ * @param props
+
+ * @ignore
+ */
+export declare function CircularProgressCenter({ text, ...props }: CircularProgressProps & {
+    text?: string;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/ErrorBoundary.d.ts

@@ -0,0 +1,11 @@
+import React, { ErrorInfo, PropsWithChildren } from "react";
+export declare class ErrorBoundary extends React.Component<PropsWithChildren<Record<string, unknown>>, {
+    error: Error | null;
+}> {
+    constructor(props: any);
+    static getDerivedStateFromError(error: Error): {
+        error: Error;
+    };
+    componentDidCatch(error: Error, _errorInfo: ErrorInfo): void;
+    render(): string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;
+}

package/dist/components/IconButton.d.ts

@@ -7,5 +7,6 @@ export type IconButtonProps<C extends React.ElementType> = Omit<(C extends "butt
     toggled?: boolean;
     component?: C;
     onClick?: React.MouseEventHandler<any>;
+    "aria-label"?: string;
 };
 export declare const IconButton: React.ComponentType<IconButtonProps<any>>;

package/dist/components/Menubar.d.ts

@@ -4,7 +4,7 @@ export declare function Menubar({ children, onSelect, className }: {
     onSelect?: (event: React.SyntheticEvent) => void;
     className?: string;
 }): import("react/jsx-runtime").JSX.Element;
-export declare function MenubarMenu({ children, }: {
+export declare function MenubarMenu({ children }: {
     children: React.ReactNode;
 }): import("react/jsx-runtime").JSX.Element;
 export declare function MenubarTrigger({ children, onSelect, className }: {
@@ -12,7 +12,7 @@ export declare function MenubarTrigger({ children, onSelect, className }: {
     onSelect?: (event: React.SyntheticEvent) => void;
     className?: string;
 }): import("react/jsx-runtime").JSX.Element;
-export declare function MenubarPortal({ children, portalContainer, }: {
+export declare function MenubarPortal({ children, portalContainer }: {
     children: React.ReactNode;
     portalContainer?: HTMLElement | null;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/components/MultiSelect.d.ts

@@ -5,7 +5,7 @@ interface MultiSelectContextProps<T extends MultiSelectValue = string> {
     fieldValue?: T[];
     onItemClick: (v: T) => void;
 }
-export declare const MultiSelectContext: React.Context<MultiSelectContextProps<any>>;
+export declare const MultiSelectContext: React.Context<MultiSelectContextProps<MultiSelectValue>>;
 /**
  * Props for MultiSelect component
  */

package/dist/components/Paper.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-export declare function Paper({ children, style, className, }: {
+export declare function Paper({ children, style, className }: {
     children: React.ReactNode;
     style?: React.CSSProperties;
     className?: string;

package/dist/components/Popover.d.ts

@@ -18,5 +18,7 @@ export interface PopoverProps {
     modal?: boolean;
     className?: string;
     portalContainer?: HTMLElement | null;
+    onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;
+    onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;
 }
-export declare function Popover({ trigger, children, open, onOpenChange, side, sideOffset, align, alignOffset, arrowPadding, sticky, hideWhenDetached, avoidCollisions, enabled, modal, portalContainer, className }: PopoverProps): import("react/jsx-runtime").JSX.Element;
+export declare function Popover({ trigger, children, open, onOpenChange, side, sideOffset, align, alignOffset, arrowPadding, sticky, hideWhenDetached, avoidCollisions, enabled, modal, portalContainer, className, onMouseEnter, onMouseLeave }: PopoverProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ResizablePanels.d.ts

@@ -10,7 +10,9 @@ export type ResizablePanelsProps = {
     panelSizePercent: number;
     onPanelSizeChange: (sizePercent: number) => void;
     minPanelSizePx?: number;
-    orientation?: 'horizontal' | 'vertical';
+    orientation?: "horizontal" | "vertical";
+    animateLayout?: boolean;
     className?: string;
+    stacked?: boolean;
 };
-export declare function ResizablePanels({ firstPanel, secondPanel, showFirstPanel, showSecondPanel, panelSizePercent, onPanelSizeChange, minPanelSizePx, orientation, className }: ResizablePanelsProps): import("react/jsx-runtime").JSX.Element;
+export declare function ResizablePanels({ firstPanel, secondPanel, showFirstPanel, showSecondPanel, panelSizePercent, onPanelSizeChange, minPanelSizePx, orientation, animateLayout, className, stacked }: ResizablePanelsProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/SearchBar.d.ts

@@ -10,11 +10,7 @@ interface SearchBarProps {
      * - "medium": 44px height (matches TextField medium)
      * @default "medium"
      */
-    size?: "small" | "medium";
-    /**
-     * @deprecated Use size="medium" or size="small" instead. This prop will be removed in a future version.
-     */
-    large?: boolean;
+    size?: "smallest" | "small" | "medium";
     innerClassName?: string;
     className?: string;
     autoFocus?: boolean;
@@ -22,5 +18,5 @@ interface SearchBarProps {
     loading?: boolean;
     inputRef?: React.Ref<HTMLInputElement>;
 }
-export declare function SearchBar({ onClick, onTextSearch, placeholder, expandable, size, large, innerClassName, className, autoFocus, disabled, loading, inputRef }: SearchBarProps): import("react/jsx-runtime").JSX.Element;
+export declare function SearchBar({ onClick, onTextSearch, placeholder, expandable, size, innerClassName, className, autoFocus, disabled, loading, inputRef }: SearchBarProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Tabs.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-export type TabVariant = "standard" | "underline" | "invisible";
+export type TabVariant = "standard" | "boxy" | "pill";
 export type TabsProps = {
     value: string;
     children: React.ReactNode;

package/dist/components/VirtualTable/VirtualTable.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+import { VirtualTableProps } from "./VirtualTableProps";
+/**
+ * This is a Table component that allows displaying arbitrary data, not
+ * necessarily related to entities or properties. It is the component
+ * that powers the entity collections but has a generic API, so it
+ * can be reused.
+ *
+ * @group Components
+ */
+export declare const VirtualTable: React.NamedExoticComponent<VirtualTableProps<any>>;

package/dist/components/VirtualTable/VirtualTableCell.d.ts

@@ -0,0 +1,21 @@
+import React from "react";
+import { CellRendererParams, VirtualTableColumn } from "./VirtualTableProps";
+type VirtualTableCellProps<T> = {
+    dataKey: string;
+    column: VirtualTableColumn;
+    columns: VirtualTableColumn[];
+    rowData: any;
+    cellData: any;
+    rowIndex: any;
+    columnIndex: number;
+    cellRenderer: (props: CellRendererParams<T>) => React.ReactNode;
+    sortableNodeRef?: (node: HTMLElement | null) => void;
+    sortableStyle?: React.CSSProperties;
+    sortableAttributes?: Record<string, any>;
+    isDragging?: boolean;
+    isDraggable?: boolean;
+    frozen?: boolean;
+    extraData?: any;
+};
+export declare const VirtualTableCell: React.NamedExoticComponent<VirtualTableCellProps<any>>;
+export {};

package/dist/components/VirtualTable/VirtualTableHeader.d.ts

@@ -0,0 +1,29 @@
+import React from "react";
+import { VirtualTableColumn, VirtualTableSort, VirtualTableWhereFilterOp } from "./VirtualTableProps";
+export type FilterFormFieldProps<CustomProps> = {
+    id: React.Key;
+    filterValue: [VirtualTableWhereFilterOp, any] | undefined;
+    setFilterValue: (filterValue?: [VirtualTableWhereFilterOp, any]) => void;
+    column: VirtualTableColumn<CustomProps>;
+    hidden: boolean;
+    setHidden: (hidden: boolean) => void;
+};
+type VirtualTableHeaderProps<M extends Record<string, any>> = {
+    resizeHandleRef: React.Ref<HTMLDivElement>;
+    columnIndex: number;
+    isResizingIndex: number;
+    column: VirtualTableColumn<any>;
+    onColumnSort: (key: Extract<keyof M, string>) => void;
+    filter?: [VirtualTableWhereFilterOp, any];
+    sort: VirtualTableSort;
+    onFilterUpdate: (column: VirtualTableColumn, filterForProperty?: [VirtualTableWhereFilterOp, any]) => void;
+    onClickResizeColumn?: (columnIndex: number, column: VirtualTableColumn) => void;
+    createFilterField?: (props: FilterFormFieldProps<any>) => React.ReactNode;
+    AdditionalHeaderWidget?: (props: {
+        onHover: boolean;
+    }) => React.ReactNode;
+    isDragging?: boolean;
+    isDraggable?: boolean;
+};
+export declare const VirtualTableHeader: React.FunctionComponent<VirtualTableHeaderProps<any>>;
+export {};

package/dist/components/VirtualTable/VirtualTableHeaderRow.d.ts

@@ -0,0 +1,2 @@
+import { VirtualTableContextProps } from "./types";
+export declare const VirtualTableHeaderRow: ({ columns, currentSort, onColumnSort, onFilterUpdate, sortByProperty, filter, onColumnResize, onColumnResizeEnd, createFilterField, AddColumnComponent, onColumnsOrderChange, data, cellRenderer: CellRenderer, rowHeight, draggingColumnId, headerHeight }: VirtualTableContextProps<any>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/VirtualTable/VirtualTableProps.d.ts

@@ -0,0 +1,243 @@
+import React from "react";
+import { FilterFormFieldProps } from "./VirtualTableHeader";
+export type OnRowClickParams<T extends Record<string, any>> = {
+    rowData: T;
+    rowIndex: number;
+    event: React.SyntheticEvent;
+};
+/**
+ * @see Table
+ * @group Components
+ */
+export interface VirtualTableProps<T extends Record<string, any>> {
+    /**
+     * Array of arbitrary data
+     */
+    data?: T[];
+    /**
+     * Properties displayed in this collection. If this property is not set
+     * every property is displayed, you can filter
+     */
+    columns: VirtualTableColumn[];
+    /**
+     * Custom cell renderer
+     * The renderer receives props `{ cellData, columns, column, columnIndex, rowData, rowIndex, container, isScrolling }`
+     */
+    cellRenderer: (props: CellRendererParams<T>) => React.ReactNode;
+    /**
+     * Set this callback if you want to support some combinations
+     * of filter combinations only.
+     * @param filterValues
+     * @param sortBy
+     */
+    checkFilterCombination?: (filterValues: VirtualTableFilterValues<Extract<keyof T, string>>, sortBy?: [string, "asc" | "desc"]) => boolean;
+    /**
+     * A callback function when scrolling the table to near the end
+     */
+    onEndReached?: () => void;
+    /**
+     * Offset in pixels where the onEndReached callback is triggered
+     */
+    endOffset?: number;
+    /**
+     * When the pagination should be reset. E.g. the filters or sorting
+     * has been reset.
+     */
+    onResetPagination?: () => void;
+    /**
+     * Callback when a row is clicked
+     */
+    onRowClick?: (props: OnRowClickParams<T>) => void;
+    /**
+     * Callback when a column is resized
+     */
+    onColumnResize?: (params: OnVirtualTableColumnResizeParams) => void;
+    onColumnResizeEnd?: (params: OnVirtualTableColumnResizeParams) => void;
+    /**
+     * Size of the table
+     */
+    rowHeight?: number;
+    headerHeight?: number;
+    /**
+     * In case this table should have some filters set by default
+     */
+    filter?: VirtualTableFilterValues<any>;
+    /**
+     * Callback used when filters are updated
+     * @param filter
+     */
+    onFilterUpdate?: (filter?: VirtualTableFilterValues<any> | undefined) => void;
+    /**
+     * Callback when the table is scrolled
+     * @param props
+     */
+    onScroll?: (props: {
+        scrollDirection: "forward" | "backward";
+        scrollOffset: number;
+        scrollUpdateWasRequested: boolean;
+    }) => void;
+    /**
+     * Default sort applied to this collection
+     */
+    sortBy?: [string, "asc" | "desc"];
+    /**
+     * Callback used when sorting is updated
+     * @param sortBy
+     */
+    onSortByUpdate?: (sortBy?: [string, "asc" | "desc"]) => void;
+    /**
+     * If there is an error loading data you can pass it here, so it gets
+     * displayed instead of the content
+     */
+    error?: Error;
+    /**
+     * Message displayed when there is no data
+     */
+    emptyComponent?: React.ReactNode;
+    /**
+     * Is the table in a loading state
+     */
+    loading?: boolean;
+    /**
+     * Should apply a different style when hovering
+     */
+    hoverRow?: boolean;
+    /**
+     * Apply a custom class name to the row
+     * @param rowData
+     */
+    rowClassName?: (rowData: T) => string | undefined;
+    /**
+     * Callback to create a filter field, displayed in the header as a dropdown
+     * @param props
+     */
+    createFilterField?: (props: FilterFormFieldProps<any>) => React.ReactNode;
+    /**
+     * Class name applied to the table
+     */
+    className?: string;
+    /**
+     * Style applied to the table
+     */
+    style?: React.CSSProperties;
+    /**
+     * Component rendered at the end of the table, after scroll
+     */
+    endAdornment?: React.ReactNode;
+    /**
+     * If adding this callback, a button to add a new column is displayed.
+     * @param column
+     */
+    AddColumnComponent?: React.ComponentType;
+    /**
+     * Initial scroll position
+     */
+    initialScroll?: number;
+    /**
+     * Callback when columns are reordered via drag-and-drop.
+     * @param columns The new column order
+     */
+    onColumnsOrderChange?: (columns: VirtualTableColumn[]) => void;
+    /**
+     * Extra data passed to the cell renderer
+     */
+    extraData?: any;
+}
+export type CellRendererParams<T = any> = {
+    column: VirtualTableColumn;
+    columns: VirtualTableColumn[];
+    columnIndex: number;
+    rowData?: T;
+    rowIndex: number;
+    width: number;
+    isScrolling?: boolean;
+    sortableNodeRef?: (node: HTMLElement | null) => void;
+    sortableStyle?: React.CSSProperties;
+    sortableAttributes?: Record<string, any>;
+    isDragging?: boolean;
+    isDraggable?: boolean;
+    frozen?: boolean;
+    extraData?: any;
+};
+/**
+ * @see Table
+ * @group Components
+ */
+export interface VirtualTableColumn<CustomProps = any> {
+    /**
+     * Data key for the cell value, could be "a.b.c"
+     */
+    key: string;
+    /**
+     * The width of the column, gutter width is not included
+     */
+    width: number;
+    /**
+     * Label displayed in the header
+     */
+    title?: string;
+    /**
+     * This column is frozen to the left
+     */
+    frozen?: boolean;
+    /**
+     * How is the
+     */
+    headerAlign?: "left" | "center" | "right";
+    /**
+     * Icon displayed in the header
+     */
+    icon?: React.ReactNode;
+    /**
+     *
+     */
+    filter?: boolean;
+    /**
+     * Alignment of the column cell
+     */
+    align?: "left" | "right" | "center";
+    /**
+     * Whether the column is sortable, defaults to false
+     */
+    sortable?: boolean;
+    /**
+     * Can it be resized
+     */
+    resizable?: boolean;
+    /**
+     * Custom props passed to the cell renderer
+     */
+    custom?: CustomProps;
+    /**
+     * Additional children to be rendered in the header when hovering
+     */
+    AdditionalHeaderWidget?: (props: {
+        onHover: boolean;
+    }) => React.ReactNode;
+}
+/**
+ * @see Table
+ * @group Collection components
+ */
+export type OnVirtualTableColumnResizeParams = {
+    width: number;
+    key: string;
+    column: VirtualTableColumn;
+};
+/**
+ * @see Table
+ * @group Components
+ */
+export type VirtualTableSort = "asc" | "desc" | undefined;
+/**
+ * @see Table
+ * @group Components
+ */
+export type VirtualTableFilterValues<Key extends string> = Partial<Record<Key, [VirtualTableWhereFilterOp, any]>>;
+/**
+ * Filter conditions in a `Query.where()` clause are specified using the
+ * strings `<`, `<=`, `==`, `>=`, `>`, `array-contains`, `in`, and `array-contains-any`.
+ * @see Table
+ * @group Models
+ */
+export type VirtualTableWhereFilterOp = "<" | "<=" | "==" | "!=" | ">=" | ">" | "array-contains" | "in" | "not-in" | "array-contains-any";

package/dist/components/VirtualTable/VirtualTableRow.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { VirtualTableRowProps } from "./types";
+export declare const VirtualTableRow: React.NamedExoticComponent<VirtualTableRowProps<any>>;

package/dist/components/VirtualTable/index.d.ts

@@ -0,0 +1,3 @@
+export { VirtualTable } from "./VirtualTable";
+export * from "./VirtualTableProps";
+export type { FilterFormFieldProps } from "./VirtualTableHeader";

package/dist/components/VirtualTable/types.d.ts

@@ -0,0 +1,38 @@
+import React from "react";
+import { CellRendererParams, OnRowClickParams, OnVirtualTableColumnResizeParams, VirtualTableColumn, VirtualTableFilterValues, VirtualTableWhereFilterOp } from "./VirtualTableProps";
+import { FilterFormFieldProps } from "./VirtualTableHeader";
+export type VirtualTableRowProps<T> = {
+    style: any;
+    rowHeight: number;
+    rowData: T;
+    rowIndex: number;
+    onRowClick?: (props: OnRowClickParams<any>) => void;
+    children: React.ReactNode[];
+    columns: VirtualTableColumn[];
+    hoverRow?: boolean;
+    rowClassName?: (rowData: T) => string | undefined;
+};
+export type VirtualTableContextProps<T> = {
+    data?: T[];
+    rowHeight?: number;
+    headerHeight?: number;
+    columns: VirtualTableColumn[];
+    cellRenderer: React.ComponentType<CellRendererParams<T>>;
+    currentSort: "asc" | "desc" | undefined;
+    filter?: VirtualTableFilterValues<any>;
+    onRowClick?: (props: OnRowClickParams<any>) => void;
+    onColumnSort: (key: string) => any;
+    onColumnResize: (params: OnVirtualTableColumnResizeParams) => void;
+    onColumnResizeEnd: (params: OnVirtualTableColumnResizeParams) => void;
+    onFilterUpdate: (column: VirtualTableColumn, filterForProperty?: [VirtualTableWhereFilterOp, any]) => void;
+    sortByProperty?: string;
+    customView?: React.ReactNode;
+    hoverRow: boolean;
+    createFilterField?: (props: FilterFormFieldProps<any>) => React.ReactNode;
+    rowClassName?: (rowData: T) => string | undefined;
+    endAdornment?: React.ReactNode;
+    AddColumnComponent?: React.ComponentType;
+    onColumnsOrderChange?: (columns: VirtualTableColumn[]) => void;
+    draggingColumnId?: string | null;
+    extraData?: Record<string, any>;
+};

package/dist/components/index.d.ts

@@ -10,6 +10,8 @@ export * from "./CenteredView";
 export * from "./Container";
 export * from "./Collapse";
 export * from "./CircularProgress";
+export * from "./CircularProgressCenter";
+export * from "./ErrorBoundary";
 export * from "./Checkbox";
 export * from "./Chip";
 export * from "./ColorPicker";
@@ -48,3 +50,4 @@ export * from "./Badge";
 export * from "./DebouncedTextField";
 export * from "./Skeleton";
 export * from "./ToggleButtonGroup";
+export * from "./VirtualTable";

package/dist/hooks/index.d.ts

@@ -1,5 +1,6 @@
 export * from "./useInjectStyles";
 export * from "./useOutsideAlerter";
+export * from "./useDebouncedCallback";
+export * from "./useDebounceCallback";
 export * from "./useDebounceValue";
-export * from "./useIconStyles";
 export * from "./PortalContainerContext";

package/dist/hooks/useDebounceCallback.d.ts

@@ -0,0 +1 @@
+export declare function useDebounceCallback<T extends (...args: any[]) => any>(callback?: T, delay?: number): T;

package/dist/hooks/useDebouncedCallback.d.ts

@@ -0,0 +1 @@
+export declare function useDebouncedCallback<T>(value: T, callback: () => void, immediate: boolean, timeoutMs?: number): void;

package/dist/icons/Icon.d.ts

@@ -1,13 +1,20 @@
-import * as React from "react";
-import "@material-design-icons/font/filled.css";
 export type IconColor = "inherit" | "primary" | "secondary" | "disabled" | "error" | "success" | "warning";
+export type IconSize = "smallest" | "small" | "medium" | "large";
+/**
+ * Standardized icon size map in px.
+ * Use with direct Lucide imports: `<Database size={iconSize.small} />`
+ */
+export declare const iconSize: {
+    readonly smallest: 16;
+    readonly small: 20;
+    readonly medium: 24;
+    readonly large: 28;
+};
 export type IconProps = {
-    size?: "smallest" | "small" | "medium" | "large" | number;
+    size?: IconSize | number;
     color?: IconColor;
     className?: string;
     onClick?: (e: React.SyntheticEvent) => void;
     style?: React.CSSProperties;
 };
-export declare const Icon: React.ForwardRefExoticComponent<IconProps & {
-    iconKey: string;
-} & React.RefAttributes<HTMLSpanElement>>;
+export declare const colorClassesMapping: Record<IconColor, string>;