@react-fabric/data 1.0.0-beta.8 → 1.0.1

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

@@ -1,18 +1,37 @@
-/// <reference types="react" />
-interface DataState {
-    expanded: Key[];
-    checked: Key[];
-    allChecked: 0 | 1 | 2;
+interface DataGroup {
+    __GROUP__: true;
+    key: Key;
+    open: boolean;
+    itemCount: number;
 }
-export declare const useVirtualTable: (data: KeyValue[], keyProperty?: Key, onCheckChanged?: (checked: Key[]) => void) => {
-    scrollerRef: import("react").RefObject<HTMLDivElement>;
-    items: import("@tanstack/virtual-core").VirtualItem<Element>[];
-    checkState: DataState;
-    getData: (index: number) => KeyValue<any>;
-    virtualizer: import("@tanstack/virtual-core").Virtualizer<HTMLDivElement, Element>;
+export declare function useVirtualTable<T extends KeyValue = KeyValue>(data: T[], options: {
+    checked?: Key[];
+    keyProperty: keyof T;
+    groupProperty?: keyof T;
+    loading?: boolean;
+    total: number;
+    onLoadMore?: (startIndex: number) => void;
+    onCheckChanged?: (checked: AnyObject[]) => void;
+}): {
+    scrollerRef: import("react").RefObject<HTMLDivElement | null>;
+    items: import("@tanstack/virtual-core").VirtualItem[];
+    checkState: {
+        allChecked: number;
+        data: T[];
+        items: (DataGroup | T)[];
+        grouped: KeyValue<T[]>;
+        groups: DataGroup[];
+        expanded: Key[];
+        checked: Key[];
+    };
+    getData: (index: number) => DataGroup | T;
+    virtualizer: import("@tanstack/react-virtual").ReactVirtualizer<HTMLDivElement, Element>;
+    hasActiveSticky: boolean;
+    isActiveSticky: (index: number) => boolean;
     top: number | undefined;
     totalSize: () => number;
-    measureElement: (node: Element | null | undefined) => void;
+    measureElement: (node: Element | null) => 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 function TreeNode<T extends KeyValue>({ node, noLines, expanders, checkable, selectable, defaultLeafIcon, defaultNodeIcon, onToggle, onClick, onSelect, onChecked, children, leafClassName, nodeClassName, }: TreeNodeProps<T>): import("react").JSX.Element;

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

@@ -1,2 +1,37 @@
 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;
+/**
+ * TreePanel component renders a virtualized tree structure with support for
+ * selection, expansion, and filtering. It allows for custom rendering of tree
+ * nodes and supports checkable nodes.
+ *
+ * @example
+ * ```jsx
+ * <TreePanel
+ *   items={items}
+ *   selected={selectedItem}
+ *   checked={checkedItems}
+ *   checkable={true}
+ *   renderer={(item) => <span>{item.name}</span>}
+ *   searchable={true}
+ *   selectable={true}
+ *   matcher={(item, query) => item.name.toLowerCase().includes(query.toLowerCase())}
+ *   filterPlaceholder="Search..."
+ *   defaultLeafIcon={<Icon icon="icon-[mdi--file]" />}
+ *   defaultNodeIcon={<Icon icon="icon-[mdi--folder]" />}
+ *   expander="caret"
+ *   onChecked={(checkedItems) => console.log(checkedItems)}
+ *   onLoad={(id) => console.log(`Load children for ${id}`)}
+ *   onQuery={(query) => console.log(`Query: ${query}`)}
+ *   onSelect={(selectedItem) => console.log(selectedItem)}
+ *   onClick={(item) => console.log(`Clicked on ${item.id}`)}
+ *   sorter={(a, b) => a.label.localeCompare(b.label)}
+ *   makeLabel={(item) => item.name}
+ *   makeIcon={(item) => item.icon ? <Icon icon={item.icon} /> : null}
+ *   defaultExpanded={["root"]}
+ *   onExpandToggle={(id, expanded) => console.log(`Toggle expand for ${id}: ${expanded}`)}
+ *   leafClassName="leaf-node"
+ *   nodeClassName="tree-node"
+ * />
+ * ```
+ */
+export declare function TreePanel<T extends KeyValue>({ ref, items, selected, checked, checkable, noLines, searchable, selectable, multiple, matcher, filterPlaceholder, defaultLeafIcon, defaultNodeIcon, expander, onChecked, onLoad, onQuery, onSelect, onClick, sorter, makeLabel, makeIcon, defaultExpanded, onExpandToggle, leafClassName, nodeClassName, ...aria }: TreePanelProps<T>): import("react").JSX.Element;

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

@@ -1,11 +1,16 @@
-/// <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 { BadgeType } from "@/core/dist/types/components/badge/Badge";
+import { type IconProps } from "@react-fabric/core/dist/types/components/icon/Icon";
+import { type ChildProp, type CssProp, type RefProp, type TestProps } from "@react-fabric/core/dist/types/types";
+interface TreeBaseNode<T> extends CssProp, TestProps {
     id: string;
     /**
      * display label
      */
-    label: Elements<JSX.Element>;
+    label: React.ReactNode;
+    /**
+     * icon path or props
+     */
+    icon?: IconProps;
     /**
      * full text to be used for querying purposes
      */
@@ -22,26 +27,26 @@ interface TreeBaseNode<T> extends IconProps, CssProp, TestProps {
      * disable selection
      */
     disabled?: boolean;
-    data?: T;
+    data: T;
 }
 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<T> extends CssProp, TestProps {
     id: string;
-    label: Elements<JSX.Element>;
+    label: React.ReactNode;
     queryable?: string;
     badge?: string | number | BadgeType;
     disabled?: boolean;
     leaf: boolean;
     open: boolean;
-    children?: InternalNode[];
+    children?: InternalNode<T>[];
     level: number;
     loading: boolean;
     filtered: boolean;
@@ -50,31 +55,63 @@ export interface InternalNode extends IconProps, CssProp, TestProps {
     loaded: boolean;
     parent?: string;
     empty?: boolean;
+    icon?: IconProps;
     errored?: string;
     selected?: true;
     childSelected?: true;
     checked: 0 | 1 | 2;
-    data?: AnyObject;
+    data: T;
     last?: boolean;
     lines: Array<0 | 1 | 2 | 3>;
 }
-export interface TreeNodeProps extends ChildProp {
-    node: InternalNode;
+export interface TreeNodeProps<T> extends ChildProp {
+    node: InternalNode<T>;
     expanders: [string, string];
-    defaultNodeIcon?: string;
-    defaultLeafIcon?: string;
+    defaultNodeIcon?: string | React.ReactElement;
+    defaultLeafIcon?: string | React.ReactElement;
     noLines?: boolean;
     selectable?: true | "leafOnly";
     checkable?: true | "leafOnly";
+    leafClassName?: string;
+    nodeClassName?: string;
     onToggle: (id: string) => void;
-    onSelect: (id: string) => void;
+    onSelect: (id: string, shiftKey?: boolean) => void;
     onChecked: (id: string) => void;
+    onClick?: (id: string, node: T) => void;
 }
 export interface TreeRef {
     select: (id: string) => void;
     open: (id: string) => void;
+    openAndLoad: (list: string[]) => void;
 }
-export interface TreePanelProps<T extends KeyValue = KeyValue> extends TestProps, RefProp<TreeRef> {
+export type TreePanelProps<T extends KeyValue = KeyValue> = BaseTreePanelProps<T> & ({
+    /**
+     * enable multi select
+     */
+    multiple?: false;
+    /**
+     * selected item id
+     */
+    selected?: string;
+    /**
+     * callback on selection of tree node
+     */
+    onSelect?: (id: string, data: T) => void;
+} | {
+    /**
+     * enable multi select
+     */
+    multiple?: true;
+    /**
+     * selected item id
+     */
+    selected?: string[];
+    /**
+     * callback on selection of tree node
+     */
+    onSelect?: (id: string[], data: T) => void;
+});
+export interface BaseTreePanelProps<T extends KeyValue = KeyValue> extends TestProps, RefProp<TreeRef> {
     items?: Array<TreeNodeType<T>>;
     /**
      * make tree searchable
@@ -89,17 +126,18 @@ export interface TreePanelProps<T extends KeyValue = KeyValue> extends TestProps
      */
     selectable?: true | "leafOnly";
     /**
-     * enable checkable
+     * enable multi select
      */
-    checkable?: true | "leafOnly";
+    multiple?: boolean;
     /**
-     * selected item id
+     * enable checkable
      */
-    selected?: string;
+    checkable?: true | "leafOnly";
     /**
      * checked items
      */
     checked?: string[];
+    selected?: string | string[];
     /**
      * default node icon
      */
@@ -121,22 +159,31 @@ export interface TreePanelProps<T extends KeyValue = KeyValue> extends TestProps
      */
     onLoad?: (id: string) => Promise<Array<TreeNodeType<T>> | undefined> | Array<TreeNodeType<T>> | undefined;
     /**
-     * callback on selection of tree node
+     * callback to load tree using search query
      */
-    onSelect?: (id: string) => void;
+    onQuery?: (query: string) => void;
     /**
-     * callback on change of checked list
+     * callback on click of tree node
      */
-    onChecked?: (leafs: string[], nodes: string[]) => void;
+    onClick?: (id: string, data: T) => void;
     /**
-     * item label renderer
+     * callback on change of checked list
+     * @param leafs - list of checked leaf nodes
+     * @param nodes - list of checked nodes
+     * @param partials - list of partially checked nodes
      */
-    renderer?: (data: T) => JSX.Element;
+    onChecked?: (leafs: string[], nodes: string[], partials: string[]) => void;
     /**
      * item filter matcher
      */
     matcher?: (data: T, query: string) => boolean;
+    onSelect?: (id: string | string[], data: T) => void;
+    sorter?: false | ((a: TreeNodeType<T>, b: TreeNodeType<T>) => number);
+    makeLabel?: (node: T) => React.ReactNode;
+    makeIcon?: (node: T) => React.ReactElement;
+    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";
 export {};

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

@@ -1,21 +1,17 @@
-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;
-}) => {
-    tree: InternalNode[];
+import type { BaseTreePanelProps, InternalNode } from "./types";
+export declare function useTree<T extends KeyValue>({ items, checked, selected, multiple, sorter, matcher, onLoad, onQuery, onSelect, onChecked, defaultExpanded, onExpandToggle, }: Partial<BaseTreePanelProps<T>>): {
+    tree: InternalNode<T>[];
+    query: string | undefined;
+    selected: string | string[] | undefined;
     toggleExpand: (id: string) => void;
     expandAll: () => void;
     collapseAll: () => void;
     toggleCheck: (id: string) => void;
-    select: (id: string) => void;
+    expandAndLoad: (expandList: string[]) => void;
+    select: (id: string, shiftKey?: boolean) => void;
     expand: (id: string) => void;
     onFilter: {
-        (...args: any): void;
+        (...args: unknown[]): void;
         cancel(): void;
     };
 };

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

@@ -1,10 +1,17 @@
-import { type InternalNode, type TreeNodeType } from "./types";
-export declare const refactorTree: (nodes: TreeNodeType[], options?: {
+import type { InternalNode, TreeNodeType } from "./types";
+export declare function refactorTree<T extends KeyValue>(nodes: TreeNodeType<T>[], { sorter, defaultExpanded, }: {
+    sorter?: false | ((a: TreeNodeType<T>, b: TreeNodeType<T>) => number);
+    defaultExpanded?: string[];
+}, options?: {
     level: number;
     parent?: string;
-}) => InternalNode[];
-export declare const makeTreeMap: (nodes: InternalNode[], map?: Map<any, any>) => Map<any, any>;
-export declare const flattenTree: (nodes: InternalNode[], lines?: Array<0 | 1 | 2 | 3>) => InternalNode[];
-export declare const updateSelection: (nodes: Map<string, InternalNode>, id: string, selected?: true) => void;
-export declare const updateChecked: (list: Map<string, AnyObject>, id: string) => void;
-export declare const filterTree: (nodes: Map<string, InternalNode>, query?: string, matcher?: AnyObject) => void;
+}): InternalNode<T>[];
+export declare function makeTreeMap<T extends KeyValue>(nodes: InternalNode<T>[], map?: Map<string, InternalNode<T>>): Map<string, InternalNode<T>>;
+export declare function flattenTree<T extends KeyValue>(nodes: InternalNode<T>[], lines?: Array<0 | 1 | 2 | 3>): InternalNode<T>[];
+export declare function updateSelection<T extends KeyValue>({ nodes, multiple, selected, }: {
+    nodes: Map<string, InternalNode<T>>;
+    multiple?: boolean;
+    selected?: string | string[];
+}): void;
+export declare function updateChecked<T extends KeyValue>(list: Map<string, InternalNode<T>>, id: string, checked?: 0 | 1 | 2): void;
+export declare function filterTree<T extends KeyValue>(nodes: Map<string, InternalNode<T>>, query?: string, matcher?: (data: T, query: string) => boolean): void;

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

@@ -0,0 +1,43 @@
+/**
+ * React Fabric
+ * @version 1.0.0
+ * @license MIT
+ * @copyright 2024 Adarsh Pastakia
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+/**
+ * Resolves a color value to a CSS color string.
+ *
+ * If the input is a valid CSS color (e.g., `"#ff0000"`, `"rgb(255,0,0)"`), it is returned as-is.
+ * Otherwise, it is treated as a design token name and resolved to a CSS custom property
+ * (e.g., `"primary-500"` → `"var(--color-primary-500)"`).
+ *
+ * @param {ColorUnion} color - The color value to resolve. Accepts CSS color strings or design token names.
+ * @returns The resolved CSS color string, or `undefined` if color is falsy.
+ *
+ * @example
+ * ```ts
+ * getColor("primary-500");    // "var(--color-primary-500)"
+ * getColor("#ff0000");       // "#ff0000"
+ * getColor("red");           // "var(--color-red)"
+ * getColor(undefined);       // undefined
+ * ```
+ */
+export declare function getColor(color?: string): string | undefined;

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

@@ -7,7 +7,7 @@ export interface VirtualGalleryRef {
 }
 export interface VirtualGalleryProps<T> extends TestProps {
     children: (props: {
-        data: T;
+        item: T;
         index: number;
         isLast: boolean;
     }) => ReactElement;
@@ -24,6 +24,12 @@ export interface VirtualGalleryProps<T> extends TestProps {
      * default item width
      */
     defaultWidth?: number;
+    /**
+     * full width list
+     */
+    fullWidth?: boolean;
+    maxWidth?: string | number;
+    minWidth?: string | number;
     /**
      * padding
      */
@@ -32,6 +38,7 @@ export interface VirtualGalleryProps<T> extends TestProps {
      * data list
      */
     items: T[];
+    total?: number;
     /**
      * loading state
      */
@@ -44,13 +51,37 @@ export interface VirtualGalleryProps<T> extends TestProps {
     /**
      * load more callback
      */
-    onLoadMore?: () => void;
+    onLoadMore?: (lastIndex?: number) => void;
     /**
      * scroll handler
      */
     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, ...aria }: VirtualGalleryProps<T>): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+/**
+ * VirtualGallery component provides a virtualized gallery view for displaying a large list of items efficiently.
+ * It supports features like fixed columns, loading states, and customizable item rendering.
+ * The component uses virtualization to render only the visible items, improving performance for large datasets.
+ * It also provides a scroller for easy navigation through the items.
+ *
+ * @example
+ * ```jsx
+ * <VirtualGallery
+ *   items={items}
+ *   columns={3}
+ *   defaultHeight={100}
+ *   defaultWidth={100}
+ *   fullWidth={true}
+ *   onLoadMore={(lastIndex) => console.log("Load more items from index:", lastIndex)}
+ *   onScroll={(top) => console.log("Scrolled to top:", top)}
+ * >
+ *   {({ item, index, isLast }) => (
+ *     <div className="gallery-item" key={item.id}>
+ *       <img src={item.image} alt={item.label} />
+ *       <p>{item.label}</p>
+ *     </div>
+ *   )}
+ * </VirtualGallery>
+ * ```
+ * @see {@link https://tanstack.com/docs/react-virtual/latest/overview}
+ */
+export declare const VirtualGallery: <T extends unknown>({ items, children, columns, fullWidth, maxWidth, minWidth, total, padding, defaultHeight: height, defaultWidth: width, hideScroller, initialScroll, loading, onLoadMore, onScroll, galleryRef, ...aria }: VirtualGalleryProps<T>) => import("react").JSX.Element;

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

@@ -7,7 +7,7 @@ export interface VirtualListRef {
 }
 export interface VirtualListProps<T> extends TestProps {
     children: (props: {
-        data: T;
+        item: T;
         index: number;
         isLast: boolean;
     }) => ReactElement;
@@ -24,6 +24,8 @@ export interface VirtualListProps<T> extends TestProps {
      * full width list
      */
     fullWidth?: boolean;
+    maxWidth?: string | number;
+    minWidth?: string | number;
     /**
      * padding
      */
@@ -36,6 +38,7 @@ export interface VirtualListProps<T> extends TestProps {
      * data list
      */
     items: T[];
+    total?: number;
     initialScroll?: number;
     /**
      * loading state
@@ -48,13 +51,42 @@ export interface VirtualListProps<T> extends TestProps {
     /**
      * load more callback
      */
-    onLoadMore?: (page?: number) => void;
+    onLoadMore?: (lastIndex?: number) => void;
     /**
      * scroll handler
      */
     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, ...aria }: VirtualListProps<T>): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+/**
+ * VirtualList component for rendering large lists efficiently using virtualization.
+ * It supports horizontal and vertical orientations, custom item heights and widths,
+ * and provides a scroller for navigating through the list.
+ * It also supports loading more items on scroll and provides a way to hilight items.
+ * It can be used with a ref to control scrolling and hilighting of items.
+ *
+ * @example
+ * ```jsx
+ * <VirtualList
+ *   items={items}
+ *   children={({ item, index, isLast }) => (
+ *     <div key={index} className="item">
+ *       {item.label}
+ *     </div>
+ *   )}
+ *   fullWidth={true}
+ *   orientation="vertical"
+ *   defaultHeight={50}
+ *   onLoadMore={(lastIndex) => console.log("Load more items from index:", lastIndex)}
+ *   onScroll={(top) => console.log("Scrolled to top:", top)}
+ *   listRef={virtualListRef}
+ * >
+ *   {({ item, index, isLast }) => (
+ *     <div className="gallery-item" key={item.id}>
+ *       <img src={item.image} alt={item.label} />
+ *       <p>{item.label}</p>
+ *     </div>
+ *   )}
+ * </VirtualList>
+ * ```
+ */
+export declare const VirtualList: <T extends unknown>({ items, total, children, fullWidth, maxWidth, minWidth, padding, orientation, defaultHeight: height, defaultWidth: width, hideScroller, initialScroll, loading, onLoadMore, onScroll, listRef, ...aria }: VirtualListProps<T>) => import("react").JSX.Element;

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

@@ -5,4 +5,4 @@ export declare const Scroller: ({ vertical, scrollActive, onStart, onEnd, onPrev
     onEnd: () => void;
     onPrevious: () => void;
     onNext: () => void;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;

package/package.json

@@ -1,19 +1,21 @@
 {
   "name": "@react-fabric/data",
-  "version": "1.0.0-beta.8",
+  "version": "1.0.1",
   "description": "RUF: Data package",
   "author": "Adarsh Pastakia <adarshpastakia@outlook.com>",
   "license": "MIT",
-  "repository": "https://github.com/adarshpastakia/react-ui-framework/tree/main/packages/data",
+  "repository": "https://github.com/adarshpastakia/react-fabric/tree/main/packages/data",
   "source": "src/index.ts",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/types/index.d.ts",
   "directories": {
     "src": "src",
+    "styles": "css",
     "test": "tests"
   },
   "files": [
+    "css",
     "src",
     "dist"
   ],
@@ -22,8 +24,6 @@
     "registry": "https://registry.npmjs.org/"
   },
   "scripts": {
-    "makelink": "yarn link",
-    "removelink": "yarn unlink",
     "prebuild": "rm -rf ./dist",
     "build:dts": "tsc -p ./tsconfig.build.json",
     "build:rollup": "rollup -c ../../rollup.config.mjs",
@@ -33,24 +33,22 @@
     "watch": "npm-run-all -p watch:rollup watch:dts"
   },
   "dependencies": {
-    "@react-fabric/core": "^1.0.0-beta.8",
-    "@react-fabric/date": "^1.0.0-beta.8",
-    "@react-fabric/form": "^1.0.0-beta.8",
-    "@react-fabric/utilities": "^1.0.0-beta.8",
-    "@tanstack/react-virtual": "^3.8.6",
-    "classnames": "^2.5.1",
-    "color": "^4.2.3",
-    "memoize-one": "^6.0.0"
+    "@react-fabric/core": "^1.0.1",
+    "@react-fabric/date": "^1.0.1",
+    "@react-fabric/form": "^1.0.1",
+    "@react-fabric/utilities": "^1.0.1",
+    "@tanstack/react-virtual": "~3.14.9",
+    "memoize-one": "~6.0.0"
   },
   "peerDependencies": {
-    "i18next": "^23.15.1",
-    "react": ">=18.0.0 <20.0.0",
-    "react-dom": ">=18.0.0 <20.0.0",
-    "react-i18next": "^15.0.2"
+    "i18next": "~26.3.6",
+    "react": "~19.3.0",
+    "react-dom": "~19.3.0",
+    "react-i18next": "~17.0.11"
   },
   "engines": {
-    "node": ">=18.12.0",
-    "npm": ">=8.19.0"
+    "node": ">=24.0.0",
+    "npm": ">=11.0.0"
   },
-  "gitHead": "9f1ede6e9629c9e79121354332cdebabad5878c5"
+  "gitHead": "1419a9df05b5e3850e1d2b4e896ab63df702c7e8"
 }