@react-fabric/data 1.0.0-beta.3 → 1.0.0-beta.30

package/dist/types/histogram/Histogram.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { type ColorType, type PaletteType } from "@react-fabric/core/dist/types/types";
+import { type ColorType, type PaletteType, type TestProps } from "@react-fabric/core/dist/types/types";
 interface HistogramItem {
     id: string;
     label: string;
@@ -7,7 +7,7 @@ interface HistogramItem {
     total?: number;
     disabled?: boolean;
 }
-export interface HistogramProps {
+export interface HistogramProps extends TestProps {
     /**
      * histogram items list
      */
@@ -37,5 +37,5 @@ export interface HistogramProps {
      */
     onClick?: (id: string, negative?: true) => void;
 }
-export declare const Histogram: ({ items, total, color, sortBy, emptyTitle, emptyMessage, onClick, }: HistogramProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Histogram: ({ items, total, color, sortBy, emptyTitle, emptyMessage, onClick, ...aria }: HistogramProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/types/hooks/useSelectableList.d.ts

@@ -0,0 +1,28 @@
+export interface SelectableProps {
+    /**
+     * list items
+     */
+    items: Array<{
+        label: string;
+    } & KeyValue>;
+    /**
+     * selected item ids
+     */
+    selected?: string[];
+    /**
+     * selected negative item ids
+     */
+    nonselected?: string[];
+    /**
+     * change callback
+     */
+    onChange?: (ids: string[], nonIds?: string[]) => void;
+    /**
+     * item click callback
+     */
+    onClick?: (id: string, isNegative: boolean) => void;
+}
+export declare const useSelectableList: ({ items, selected, nonselected, onChange, onClick, }: SelectableProps) => {
+    selection: KeyValue<number>;
+    toggleSelection: (id: string, isNegative?: boolean) => void;
+};

package/dist/types/index.d.ts

@@ -1,9 +1,10 @@
 import "./i18n";
+export { CheckList } from "./checklist/CheckList";
 export { Histogram } from "./histogram/Histogram";
 export { JsonViewer } from "./json/JsonViewer";
 export { Pagination } from "./pagination/Pagination";
 export { Table } from "./table/Table";
-export { type TableRef } from "./table/types";
+export { type TableColumn, type TableRef } from "./table/types";
 export { TreePanel } from "./tree/TreePanel";
 export { type TreeNodeType as TreeNode } from "./tree/types";
 export { VirtualGallery, type VirtualGalleryRef } from "./virtual/Gallery";

package/dist/types/table/AddColumn.d.ts

@@ -1,5 +1,5 @@
-import { type ColumnType } from "./types";
+import { type TableColumn } from "./types";
 export declare const AddColumn: ({ columns, onClick, }: {
-    columns: ColumnType[];
+    columns: TableColumn[];
     onClick: (id: string) => void;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/types/table/BodyCell.d.ts

@@ -1,5 +1,6 @@
-import { type ColumnType } from "./types";
-export declare const BodyCell: ({ column, item, }: {
-    column: ColumnType;
+import { type TableColumn } from "./types";
+export declare const BodyCell: ({ column, item, index, }: {
+    column: TableColumn;
     item: KeyValue;
+    index: number;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/types/table/BodyRow.d.ts

@@ -0,0 +1,20 @@
+import { type TableColumn } from "./types";
+export declare const BodyRow: ({ rowKey, index, data, keyProperty, measureElement, state, hideableColumns, wrapperStart, wrapperEnd, onRowClick, checkableRows, checked, toggleChecked, canExpand, expanded, toggleExpand, expandRow, }: {
+    rowKey: Key;
+    index: number;
+    data: KeyValue;
+    keyProperty?: Key;
+    measureElement: AnyObject;
+    state: KeyValue<TableColumn[]>;
+    hideableColumns?: boolean;
+    wrapperStart: string;
+    wrapperEnd: string;
+    checkableRows?: boolean;
+    checked: 0 | 1;
+    onRowClick?: AnyObject;
+    canExpand?: AnyObject;
+    expandRow?: AnyObject;
+    expanded: boolean;
+    toggleExpand: (key: Key) => void;
+    toggleChecked: (key: Key) => void;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/types/table/EmptyCell.d.ts

@@ -1,2 +1,2 @@
-import { type ColumnType } from "./types";
-export declare const EmptyCell: ({ id, width: _width, maxWidth, minWidth, }: ColumnType) => import("react/jsx-runtime").JSX.Element;
+import { type TableColumn } from "./types";
+export declare const EmptyCell: ({ id, width: _width, maxWidth, minWidth, }: TableColumn) => import("react/jsx-runtime").JSX.Element;

package/dist/types/table/HeaderCell.d.ts

@@ -1,2 +1,2 @@
-import { type ColumnType, type TableProps } from "./types";
-export declare const HeaderCell: ({ id, label, icon, iconBg, iconColor, rtlFlip, actions, locked, sortable, resizable, width: _width, maxWidth, minWidth, sort, onSort, }: ColumnType & Pick<TableProps, "sort" | "onSort">) => import("react/jsx-runtime").JSX.Element;
+import { type TableColumn, type TableProps } from "./types";
+export declare const HeaderCell: ({ id, label, icon, iconBg, iconColor, rtlFlip, actions, locked, tooltip, sortable, resizable, width: _width, maxWidth, minWidth, sort, onSort, }: TableColumn & Pick<TableProps, "sort" | "onSort">) => import("react/jsx-runtime").JSX.Element;

package/dist/types/table/Table.d.ts

@@ -1,2 +1,2 @@
 import { type TableProps } from "./types";
-export declare const Table: <T extends KeyValue<any> = KeyValue<any>>({ ref, data, columns, keyProperty, checkableRows, hideableColumns, sort, loading, onSort, onRowClick, onCheckedChanged, }: TableProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const Table: <T extends KeyValue<any> = KeyValue<any>>({ ref, data, columns, keyProperty, groupProperty, checkableRows, initialScroll, hideableColumns, sort, loading, checked, emptyDisplay, groupRenderer, canExpand, children, onSort, onScroll, onRowClick, onCheckedChanged, }: TableProps<T>) => import("react/jsx-runtime").JSX.Element;

package/dist/types/table/types.d.ts

@@ -1,15 +1,17 @@
-import { type CssProp, type IconProps, type RefProp, type TestProps } from "@react-fabric/core/dist/types/types";
+import { type CssProp, type Elements, type IconProps, type RefProp, type TestProps } from "@react-fabric/core/dist/types/types";
 import { type ReactElement } from "react";
 export declare const COL_MIN_WIDTH = "3rem";
 export declare const COL_MAX_WIDTH = "64rem";
 export declare const COL_DEFAULT_WIDTH = "12rem";
-export interface ColumnType<T = KeyValue> extends CssProp, IconProps, TestProps {
-    id: keyof T;
+export interface TableColumn<T = KeyValue> extends CssProp, IconProps, TestProps {
+    id: keyof T | string;
     label?: string;
-    actions?: ReactElement;
+    tooltip?: string;
+    actions?: ReactElement[];
     align?: "start" | "center" | "end";
     locked?: "start" | "end";
     hidden?: boolean;
+    truncate?: boolean;
     hideable?: boolean;
     resizable?: boolean;
     sortable?: boolean;
@@ -20,7 +22,8 @@ export interface ColumnType<T = KeyValue> extends CssProp, IconProps, TestProps
     maxWidth?: string | number;
     dataType?: "string" | "number" | "boolean" | "datetime" | "date" | "time" | "unknown";
     format?: string;
-    renderer?: (value: AnyObject, data: T) => void;
+    valueMap?: KeyValue;
+    renderer?: (value: AnyObject, data: T, index: number) => Elements<AnyObject>;
 }
 export interface TableRef {
     hilight: (row: number) => void;
@@ -28,14 +31,18 @@ export interface TableRef {
     scrollTo: (row: number) => void;
 }
 export interface TableProps<T = KeyValue> extends RefProp<TableRef> {
-    columns: Array<ColumnType<T>>;
+    columns: Array<TableColumn<T>>;
     data: T[];
-    keyProperty: keyof T;
+    keyProperty?: keyof T;
+    groupProperty?: keyof T;
+    groupRenderer?: (key: AnyObject) => ReactElement;
+    emptyDisplay?: ReactElement;
     /**
      * checkable rows
      */
+    checked?: AnyObject[];
     checkableRows?: boolean;
-    onCheckedChanged?: (rows: Array<keyof T>) => void;
+    onCheckedChanged?: (rows: AnyObject[]) => void;
     /**
      * sorting
      */
@@ -50,4 +57,8 @@ export interface TableProps<T = KeyValue> extends RefProp<TableRef> {
     loading?: boolean;
     hideableColumns?: boolean;
     onRowClick?: (data: T) => void;
+    initialScroll?: number;
+    onScroll?: (firstItem: number) => void;
+    canExpand?: (record: T) => boolean;
+    children?: (record: T) => Elements<AnyObject>;
 }

package/dist/types/table/useTableColumns.d.ts

@@ -1,10 +1,10 @@
-import { type ColumnType } from "./types";
-export declare const useTableColumns: (columns: ColumnType[]) => {
+import { type TableColumn } from "./types";
+export declare const useTableColumns: (columns: TableColumn[]) => {
     state: {
-        start: ColumnType<KeyValue<any>>[];
-        end: ColumnType<KeyValue<any>>[];
-        cols: ColumnType<KeyValue<any>>[];
-        columns: ColumnType[];
+        start: TableColumn<KeyValue<any>>[];
+        end: TableColumn<KeyValue<any>>[];
+        cols: TableColumn<KeyValue<any>>[];
+        columns: TableColumn[];
     };
     onHide: (id: string) => void;
 };

package/dist/types/table/useVirtualTable.d.ts

@@ -1,15 +1,30 @@
 /// <reference types="react" />
-interface DataState {
-    checked: Key[];
+interface DataState<T = KeyValue> {
+    items: T[];
+    grouped: KeyValue<T[]>;
+    groups: AnyObject[];
+    expanded: AnyObject[];
+    checked: AnyObject[];
     allChecked: 0 | 1 | 2;
 }
-export declare const useVirtualTable: (data: KeyValue[], keyProperty: Key, onCheckChanged: (checked: Key[]) => void) => {
+export declare const useVirtualTable: <T extends KeyValue<any> = KeyValue<any>>(data: T[], options: {
+    checked?: AnyObject[];
+    keyProperty: keyof T;
+    groupProperty?: keyof T;
+    onCheckChanged?: (checked: AnyObject[]) => void;
+}) => {
     scrollerRef: import("react").RefObject<HTMLDivElement>;
     items: import("@tanstack/virtual-core").VirtualItem<Element>[];
-    checkState: DataState;
-    getData: (index: number) => KeyValue<any>;
+    checkState: DataState<T>;
+    getData: (index: number) => T;
+    virtualizer: import("@tanstack/virtual-core").Virtualizer<HTMLDivElement, Element>;
+    hasActiveSticky: boolean;
+    isActiveSticky: (index: number) => boolean;
+    top: number | undefined;
     totalSize: () => number;
     measureElement: (node: Element | null | undefined) => void;
+    toggleGroupExpand: (key: Key) => void;
+    toggleExpand: (key: Key) => void;
     toggleChecked: (key: Key) => void;
     toggleAllChecked: () => void;
 };

package/dist/types/tree/TreeNode.d.ts

@@ -1,2 +1,2 @@
 import { type TreeNodeProps } from "./types";
-export declare const TreeNode: ({ node, noLines, expanders, checkable, selectable, defaultLeafIcon, defaultNodeIcon, onToggle, onSelect, onChecked, children, }: TreeNodeProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TreeNode: ({ node, noLines, expanders, checkable, selectable, defaultLeafIcon, defaultNodeIcon, onToggle, onClick, onSelect, onChecked, children, leafClassName, nodeClassName, }: TreeNodeProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/tree/TreePanel.d.ts

@@ -1,2 +1,2 @@
 import { type TreePanelProps } from "./types";
-export declare const TreePanel: <T extends KeyValue<any>>({ ref, items, selected, checked, checkable, noLines, renderer, searchable, selectable, matcher, filterPlaceholder, defaultLeafIcon, defaultNodeIcon, expander, onChecked, onLoad, onSelect, ...aria }: TreePanelProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const TreePanel: <T extends KeyValue<any>>({ ref, items, selected, checked, checkable, noLines, renderer, searchable, selectable, matcher, filterPlaceholder, defaultLeafIcon, defaultNodeIcon, expander, onChecked, onLoad, onQuery, onSelect, onClick, sorter, makeLabel, makeIcon, defaultExpanded, onExpandToggle, leafClassName, nodeClassName, ...aria }: TreePanelProps<T>) => import("react/jsx-runtime").JSX.Element;

package/dist/types/tree/types.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
 import { type BadgeType, type ChildProp, type CssProp, type Elements, type IconProps, type RefProp, type TestProps } from "@react-fabric/core/dist/types/types";
-interface TreeBaseNode<T> extends IconProps, CssProp, TestProps {
+import { type ElementType } from "react";
+interface TreeBaseNode<T> extends Omit<IconProps, "icon">, CssProp, TestProps {
     id: string;
     /**
      * display label
@@ -23,17 +23,18 @@ interface TreeBaseNode<T> extends IconProps, CssProp, TestProps {
      */
     disabled?: boolean;
     data?: T;
+    icon?: ElementType<IconProps> | string;
 }
 export type TreeNodeType<T extends KeyValue = KeyValue> = TreeBaseNode<T> & ({
     leaf: true;
     children?: never;
 } | {
-    leaf?: false;
+    leaf?: boolean;
     children?: Array<TreeNodeType<T>>;
     open?: boolean;
     iconOpen?: string;
 });
-export interface InternalNode extends IconProps, CssProp, TestProps {
+export interface InternalNode extends Omit<IconProps, "icon">, CssProp, TestProps {
     id: string;
     label: Elements<JSX.Element>;
     queryable?: string;
@@ -50,6 +51,7 @@ export interface InternalNode extends IconProps, CssProp, TestProps {
     loaded: boolean;
     parent?: string;
     empty?: boolean;
+    icon?: ElementType<IconProps> | string;
     errored?: string;
     selected?: true;
     childSelected?: true;
@@ -66,9 +68,12 @@ export interface TreeNodeProps extends ChildProp {
     noLines?: boolean;
     selectable?: true | "leafOnly";
     checkable?: true | "leafOnly";
+    leafClassName?: string;
+    nodeClassName?: string;
     onToggle: (id: string) => void;
     onSelect: (id: string) => void;
     onChecked: (id: string) => void;
+    onClick?: (id: string, node: any) => void;
 }
 export interface TreeRef {
     select: (id: string) => void;
@@ -120,10 +125,18 @@ export interface TreePanelProps<T extends KeyValue = KeyValue> extends TestProps
      * callback for lazy loading tree items
      */
     onLoad?: (id: string) => Promise<Array<TreeNodeType<T>> | undefined> | Array<TreeNodeType<T>> | undefined;
+    /**
+     * callback to load tree using search query
+     */
+    onQuery?: (query: string) => void;
+    /**
+     * callback on click of tree node
+     */
+    onClick?: (id: string, data: T) => void;
     /**
      * callback on selection of tree node
      */
-    onSelect?: (id: string) => void;
+    onSelect?: (id: string, data: T) => void;
     /**
      * callback on change of checked list
      */
@@ -136,6 +149,13 @@ export interface TreePanelProps<T extends KeyValue = KeyValue> extends TestProps
      * item filter matcher
      */
     matcher?: (data: T, query: string) => boolean;
+    sorter?: false | ((a: T, b: T) => number);
+    makeLabel?: (node: T) => string;
+    makeIcon?: (node: T) => string;
+    defaultExpanded?: string[];
+    onExpandToggle?: (id: string[]) => void;
+    leafClassName?: string;
+    nodeClassName?: string;
 }
 export declare const iconExpandAll = "M12.984 9v6h3l-3.984 3.984-3.984-3.984h3v-6h-3l3.984-3.984 3.984 3.984h-3zM3.984 2.016h16.031v1.969h-16.031v-1.969zM3.984 20.016h16.031v1.969h-16.031v-1.969z";
 export declare const iconCollapseAll = "M3.984 11.016h16.031v1.969h-16.031v-1.969zM15.984 5.016l-3.984 3.984-3.984-3.984h3v-4.031h1.969v4.031h3zM8.016 18.984l3.984-3.984 3.984 3.984h-3v4.031h-1.969v-4.031h-3z";

package/dist/types/tree/useTree.d.ts

@@ -1,12 +1,5 @@
-import { type InternalNode, type TreeNodeType } from "./types";
-export declare const useTree: <T extends KeyValue<any>>({ items, checked, selected, matcher, onSelect, onChecked, }: {
-    items?: Array<TreeNodeType<T>>;
-    selected?: string;
-    checked?: string[];
-    onSelect?: (id: string) => void;
-    onChecked?: (leafs: string[], nodes: string[]) => void;
-    matcher?: (data: T, query: string) => boolean;
-}) => {
+import { type InternalNode, type TreePanelProps } from "./types";
+export declare const useTree: <T extends KeyValue<any>>({ items, checked, selected, sorter, matcher, onLoad, onQuery, onSelect, onChecked, defaultExpanded, onExpandToggle, }: Partial<TreePanelProps<T>>) => {
     tree: InternalNode[];
     toggleExpand: (id: string) => void;
     expandAll: () => void;

package/dist/types/tree/utils.d.ts

@@ -1,5 +1,8 @@
 import { type InternalNode, type TreeNodeType } from "./types";
-export declare const refactorTree: (nodes: TreeNodeType[], options?: {
+export declare const refactorTree: (nodes: TreeNodeType[], { sorter, defaultExpanded, }: {
+    sorter?: any;
+    defaultExpanded?: string[];
+}, options?: {
     level: number;
     parent?: string;
 }) => InternalNode[];

package/dist/types/virtual/Gallery.d.ts

@@ -1,12 +1,13 @@
+import { type TestProps } from "@react-fabric/core/dist/types/types";
 import { type ReactElement, type Ref } from "react";
 export interface VirtualGalleryRef {
     scrollToItem: (index: number) => void;
     hilight: (index: number) => void;
     unhilight: () => void;
 }
-export interface VirtualGalleryProps<T> {
+export interface VirtualGalleryProps<T> extends TestProps {
     children: (props: {
-        data: T;
+        item: T;
         index: number;
         isLast: boolean;
     }) => ReactElement;
@@ -23,6 +24,12 @@ export interface VirtualGalleryProps<T> {
      * default item width
      */
     defaultWidth?: number;
+    /**
+     * full width list
+     */
+    fullWidth?: boolean;
+    maxWidth?: string | number;
+    minWidth?: string | number;
     /**
      * padding
      */
@@ -31,6 +38,7 @@ export interface VirtualGalleryProps<T> {
      * data list
      */
     items: T[];
+    total?: number;
     /**
      * loading state
      */
@@ -50,6 +58,6 @@ export interface VirtualGalleryProps<T> {
     onScroll?: (top: number) => void;
 }
 export declare const VirtualGallery: {
-    <T extends KeyValue<any>>({ items, children, columns, padding, defaultHeight: height, defaultWidth: width, hideScroller, initialScroll, loading, onLoadMore, onScroll, galleryRef, }: VirtualGalleryProps<T>): import("react/jsx-runtime").JSX.Element;
+    <T extends KeyValue<any>>({ items, children, columns, fullWidth, maxWidth, minWidth, total, padding, defaultHeight: height, defaultWidth: width, hideScroller, initialScroll, loading, onLoadMore, onScroll, galleryRef, ...aria }: VirtualGalleryProps<T>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };

package/dist/types/virtual/List.d.ts

@@ -1,12 +1,13 @@
+import { type TestProps } from "@react-fabric/core/dist/types/types";
 import { type ReactElement, type Ref } from "react";
 export interface VirtualListRef {
     scrollToItem: (index: number) => void;
     hilight: (index: number) => void;
     unhilight: () => void;
 }
-export interface VirtualListProps<T> {
+export interface VirtualListProps<T> extends TestProps {
     children: (props: {
-        data: T;
+        item: T;
         index: number;
         isLast: boolean;
     }) => ReactElement;
@@ -23,6 +24,8 @@ export interface VirtualListProps<T> {
      * full width list
      */
     fullWidth?: boolean;
+    maxWidth?: string | number;
+    minWidth?: string | number;
     /**
      * padding
      */
@@ -35,6 +38,7 @@ export interface VirtualListProps<T> {
      * data list
      */
     items: T[];
+    total?: number;
     initialScroll?: number;
     /**
      * loading state
@@ -54,6 +58,6 @@ export interface VirtualListProps<T> {
     onScroll?: (top: number) => void;
 }
 export declare const VirtualList: {
-    <T extends KeyValue<any>>({ items, children, fullWidth, padding, orientation, defaultHeight: height, defaultWidth: width, hideScroller, initialScroll, loading, onLoadMore, onScroll, listRef, }: VirtualListProps<T>): import("react/jsx-runtime").JSX.Element;
+    <T extends KeyValue<any>>({ items, total, children, fullWidth, maxWidth, minWidth, padding, orientation, defaultHeight: height, defaultWidth: width, hideScroller, initialScroll, loading, onLoadMore, onScroll, listRef, ...aria }: VirtualListProps<T>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-fabric/data",
-  "version": "1.0.0-beta.3",
+  "version": "1.0.0-beta.30",
   "description": "RUF: Data package",
   "author": "Adarsh Pastakia <adarshpastakia@outlook.com>",
   "license": "MIT",
@@ -33,9 +33,10 @@
     "watch": "npm-run-all -p watch:rollup watch:dts"
   },
   "dependencies": {
-    "@react-fabric/core": "^1.0.0-beta.3",
-    "@react-fabric/form": "^1.0.0-beta.3",
-    "@react-fabric/utilities": "^1.0.0-beta.1",
+    "@react-fabric/core": "^1.0.0-beta.30",
+    "@react-fabric/date": "^1.0.0-beta.30",
+    "@react-fabric/form": "^1.0.0-beta.30",
+    "@react-fabric/utilities": "^1.0.0-beta.30",
     "@tanstack/react-virtual": "^3.8.6",
     "classnames": "^2.5.1",
     "color": "^4.2.3",
@@ -43,13 +44,13 @@
   },
   "peerDependencies": {
     "i18next": "^23.15.1",
-    "react": ">=18.0.0 <20.0.0",
-    "react-dom": ">=18.0.0 <20.0.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
     "react-i18next": "^15.0.2"
   },
   "engines": {
     "node": ">=18.12.0",
     "npm": ">=8.19.0"
   },
-  "gitHead": "2ce2a968f48d6ffc338f5da3a0cf67232d0c6864"
+  "gitHead": "5b10298b7627c2e56bcccf18100b6d85a02c9b06"
 }