@neo4j-ndl/react 4.0.0-alpha.0.c6243ce → 4.0.1

package/lib/types/clipboard-button/stories/index.d.ts

@@ -0,0 +1,32 @@
+/**
+ *
+ *  Copyright (c) "Neo4j"
+ *  Neo4j Sweden AB [http://neo4j.com]
+ *
+ *  This file is part of Neo4j.
+ *
+ *  Neo4j is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation, either version 3 of the License, or
+ *  (at your option) any later version.
+ *
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU General Public License for more details.
+ *
+ *  You should have received a copy of the GNU General Public License
+ *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+export { default as ClipboardButtonDefault } from './clipboard-button-default.story';
+export { default as ClipboardButtonNotIconButton } from './clipboard-button-not-icon-button.story';
+export { default as ClipboardButtonSizes } from './clipboard-button-sizes.story';
+export { default as ClipboardButtonTooltip } from './clipboard-button-tooltip.story';
+export { default as ClipboardButtonDisabled } from './clipboard-button-disabled.story';
+export { default as ClipboardButtonNotClean } from './clipboard-button-not-clean.story';
+export declare const ClipboardButtonDefaultSrc: string;
+export declare const ClipboardButtonNotIconButtonSrc: string;
+export declare const ClipboardButtonSizesSrc: string;
+export declare const ClipboardButtonTooltipSrc: string;
+export declare const ClipboardButtonDisabledSrc: string;
+export declare const ClipboardButtonNotCleanSrc: string;

package/lib/types/code/Code.d.ts

@@ -20,13 +20,13 @@
  */
 import { type PolymorphicCommonProps } from '../_common/types';
 type CodeProps = {
-    code: string;
+    children: React.ReactNode;
     isDisabled?: boolean;
     isRunnable?: boolean;
-    /** Tooltip text to display when hovering over the inline code. */
-    tooltipText?: string;
+    /** The description of the code, will be displayed in a tooltip */
+    description?: string;
     /** The callback function triggered when the inline code is clicked */
     onClick?: (e: React.MouseEvent<HTMLElement, MouseEvent> | React.KeyboardEvent<HTMLElement>) => void;
 };
-export declare const Code: <T extends React.ElementType = "button">({ code, className, isDisabled, style, isRunnable, tooltipText, onClick, as, ref, htmlAttributes, ...restProps }: PolymorphicCommonProps<T, CodeProps>) => import("react/jsx-runtime").JSX.Element;
+export declare const Code: <T extends React.ElementType = "button">({ children, className, isDisabled, style, isRunnable, description, onClick, as, ref, htmlAttributes, ...restProps }: PolymorphicCommonProps<T, CodeProps>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/types/code-block/CodeBlock.d.ts

@@ -27,10 +27,10 @@ interface CodeBlockProps {
     isDisabled?: boolean;
     maxHeight?: number;
     language: LanguageProp | 'text';
-    showLineNumbers?: boolean;
+    shouldShowLineNumbers?: boolean;
     theme?: 'vs' | 'base16-ateliersulphurpool.light' | 'coy' | 'duotone-light' | 'ghcolors' | 'prism' | 'solarizedlight' | 'ndl-code-dark' | 'ndl-code-light';
-    headerTitle?: string | React.JSX.Element;
+    heading?: React.ReactNode;
     actions?: React.ComponentProps<typeof IconButton<'button'>>[];
 }
-export declare const CodeBlock: <T extends React.ElementType = "button">({ maxHeight, code, language, showLineNumbers, theme, headerTitle, actions, isDisabled, as, className, style, htmlAttributes, ref, ...restProps }: PolymorphicCommonProps<T, CodeBlockProps>) => import("react/jsx-runtime").JSX.Element;
+export declare const CodeBlock: <T extends React.ElementType = "button">({ as, maxHeight, code, language, shouldShowLineNumbers, theme, heading, actions, isDisabled, className, style, htmlAttributes, ref, ...restProps }: PolymorphicCommonProps<T, CodeBlockProps>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/types/conditional-wrap/ConditionalWrap.d.ts

@@ -20,13 +20,12 @@
  */
 import type React from 'react';
 type ConditionalWrapProps = {
+    /** If true, the children will be wrapped */
     shouldWrap: boolean;
+    /** Function that takes children and returns them wrapped in a component */
     wrap: (children: React.ReactNode) => React.ReactNode;
+    /** The children to potentially wrap */
     children: React.ReactNode;
 };
-/**
- * Component to enable conditional
- * wrapping of components
- */
 export declare const ConditionalWrap: ({ shouldWrap, wrap, children, }: ConditionalWrapProps) => React.ReactNode;
 export {};

package/lib/types/conditional-wrap/stories/conditional-wrap.stories.d.ts

@@ -20,13 +20,13 @@
  */
 import { type StoryObj } from '@storybook/react-vite';
 declare const componentMeta: {
-    title: string;
-    id: string;
     component: ({ shouldWrap, wrap, children, }: {
         shouldWrap: boolean;
         wrap: (children: React.ReactNode) => React.ReactNode;
         children: React.ReactNode;
     }) => import("react").ReactNode;
+    id: string;
+    title: string;
 };
 export default componentMeta;
 type Story = StoryObj<typeof componentMeta>;

package/lib/types/data-grid/Components.d.ts

@@ -18,108 +18,136 @@
  *  You should have received a copy of the GNU General Public License
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
+
 import { type Cell, type CellContext, type Header as HeaderType, type Row, type RowData, type SortDirection } from '@tanstack/react-table';
 import type React from 'react';
+import { type CommonProps, type PolymorphicCommonProps } from '../_common/types';
 import { CleanIconButton } from '../clean-icon-button';
-import { Menu } from '../context-menu';
-import { DatagridNodataIcon } from '../icons';
+import { DataGridCrossIcon } from '../icons';
+import { Menu } from '../menu';
 import { type ColumnAction } from './datagrid-types';
-import NoDataIllustration from './illustrations/NoData';
-type MenuItemProps = React.ComponentProps<typeof Menu.Item>;
 export declare const DEFAULT_SORT_ACTIONS: (cell: HeaderType<any, unknown>) => {
     [key in SortDirection | 'default']: ColumnAction;
 };
-export interface CommonInnerProps<T = HTMLDivElement> {
-    /** Children are surfaced to allow easy overriding */
-    children?: React.ReactNode;
-    innerProps?: {
-        className?: string;
-        style?: React.CSSProperties;
-        onClick?: (e: React.MouseEvent<T, MouseEvent>) => void;
-        htmlAttributes?: React.HTMLAttributes<T>;
-    };
-}
-export interface ResizingBarProps<T extends RowData> extends CommonInnerProps<HTMLButtonElement> {
+type ResizingBarProps<T extends RowData> = {
     header: HeaderType<T, unknown>;
-}
-declare const ResizingBar: <T extends RowData>({ header, children, innerProps, }: ResizingBarProps<T>) => import("react/jsx-runtime").JSX.Element;
-declare const Scrollable: ({ children, ref, innerProps, }: CommonInnerProps<HTMLDivElement> & {
+};
+declare const ResizingBar: <T extends RowData>({ header, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"button", ResizingBarProps<T>>) => import("react/jsx-runtime").JSX.Element;
+type ScrollableProps = {
+    children?: React.ReactNode;
+};
+declare const Scrollable: ({ children, ref, className, style, htmlAttributes, ...restProps }: CommonProps<"div", ScrollableProps> & {
     ref: React.RefObject<HTMLDivElement | null>;
 }) => import("react/jsx-runtime").JSX.Element;
-declare const Header: ({ children, innerProps }: CommonInnerProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-export interface ActionButtonProps {
-    action: ColumnAction;
+type HeaderProps = {
     children?: React.ReactNode;
-    innerProps?: MenuItemProps;
-    /** Callback provided to close the context menu */
+};
+declare const Header: ({ children, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"div", HeaderProps>) => import("react/jsx-runtime").JSX.Element;
+type ActionButtonProps = {
+    action: ColumnAction;
     onClose: () => void;
-}
-export declare const ActionButton: ({ action, children, onClose, innerProps, }: ActionButtonProps) => import("react/jsx-runtime").JSX.Element;
-export interface RowActionCellProps<T extends RowData> {
+};
+export declare const ActionButton: <T extends React.ElementType = "button">({ action, onClose, as, className, style, htmlAttributes, ref, ...restProps }: PolymorphicCommonProps<T, ActionButtonProps>) => import("react/jsx-runtime").JSX.Element;
+export interface ActionCellProps<T extends RowData> {
     cell?: CellContext<T, unknown>;
     innerCleanIconButtonProps?: Partial<React.ComponentPropsWithoutRef<typeof CleanIconButton>>;
     innerMenuProps?: Partial<React.ComponentProps<typeof Menu>>;
 }
-declare const RowActionCell: <T extends RowData>({ cell, innerCleanIconButtonProps, innerMenuProps, }: RowActionCellProps<T>) => import("react/jsx-runtime").JSX.Element | null;
-export interface ColumnControlsProps<T extends RowData> extends CommonInnerProps<HTMLDivElement> {
+declare const ActionCell: <T extends RowData>({ cell, innerCleanIconButtonProps, innerMenuProps, }: ActionCellProps<T>) => import("react/jsx-runtime").JSX.Element | null;
+type ColumnControlsProps<T extends RowData> = {
     cell: HeaderType<T, unknown>;
-}
-export declare const ColumnControls: <T extends RowData>({ cell, children, innerProps, }: ColumnControlsProps<T>) => import("react/jsx-runtime").JSX.Element | null;
-export interface HeaderCellProps<T> extends CommonInnerProps<HTMLDivElement> {
+    children?: React.ReactNode;
+};
+export declare const ColumnControls: <T extends RowData>({ cell, children, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"div", ColumnControlsProps<T>>) => import("react/jsx-runtime").JSX.Element | null;
+type HeaderCellProps<T> = {
     cell: HeaderType<T, unknown>;
-}
-declare const HeaderCell: <T extends RowData>({ cell, children, innerProps, }: HeaderCellProps<T>) => import("react/jsx-runtime").JSX.Element;
-export interface HeaderTitleProps<T> extends CommonInnerProps<HTMLDivElement> {
+    children?: React.ReactNode;
+};
+declare const HeaderCell: <T extends RowData>({ cell, children, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"div", HeaderCellProps<T>>) => import("react/jsx-runtime").JSX.Element;
+type HeaderTitleProps<T> = {
     cell: HeaderType<T, unknown>;
-}
-declare const HeaderTitle: <T extends RowData>({ cell, children, innerProps, }: HeaderTitleProps<T>) => import("react/jsx-runtime").JSX.Element;
-declare const Body: ({ children, innerProps }: CommonInnerProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-export interface BodyCellProps<T extends RowData> extends CommonInnerProps<HTMLDivElement> {
+    children?: React.ReactNode;
+};
+declare const HeaderTitle: <T extends RowData>({ cell, children, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"div", HeaderTitleProps<T>>) => import("react/jsx-runtime").JSX.Element;
+type BodyProps = {
+    children?: React.ReactNode;
+};
+declare const Body: ({ children, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"div", BodyProps>) => import("react/jsx-runtime").JSX.Element;
+type BodyCellProps<T extends RowData> = {
     cell: Cell<T, unknown>;
-}
-declare const BodyCell: <T extends RowData>({ cell, children, innerProps, }: BodyCellProps<T>) => import("react/jsx-runtime").JSX.Element;
-export interface BodyRowProps<T extends RowData> extends CommonInnerProps<HTMLDivElement> {
+    children?: React.ReactNode;
+};
+declare const BodyCell: <T extends RowData>({ cell, children, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"div", BodyCellProps<T>>) => import("react/jsx-runtime").JSX.Element;
+type BodyRowProps<T extends RowData> = {
     row: Row<T>;
-}
-declare const BodyRow: <T extends RowData>({ row, children, innerProps, }: BodyRowProps<T>) => import("react/jsx-runtime").JSX.Element;
-export interface TableResultProps extends CommonInnerProps<HTMLSpanElement> {
+    children?: React.ReactNode;
+};
+declare const BodyRow: <T extends RowData>({ row, children, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"div", BodyRowProps<T>>) => import("react/jsx-runtime").JSX.Element;
+type TableResultProps = {
     manualPagination?: {
         from: number;
         to: number;
         totalRows: number;
     };
-}
-declare const TableResults: ({ children, innerProps, manualPagination, }: TableResultProps) => import("react/jsx-runtime").JSX.Element;
-export interface RowsPerPageProps extends CommonInnerProps<HTMLDivElement> {
+    children?: React.ReactNode;
+    /**
+     * The label to use for the results, meaning the word "results" in the sentence "Showing X-Y of Z results".
+     * @defaultValue 'results'
+     */
+    resultsLabel?: string;
+};
+declare const TableResults: ({ manualPagination, children, className, style, htmlAttributes, ref, resultsLabel, ...restProps }: CommonProps<"span", TableResultProps>) => import("react/jsx-runtime").JSX.Element;
+type RowsPerPageProps = {
     /**
      * The target element to portal the menu of the select component to.
      * Should be document.body normally, or the modal root if the select is inside a modal.
+     * Defaults to the portalTarget prop of the DataGrid root component.
      */
-    menuPortalTarget?: HTMLElement | null;
-}
-declare const RowsPerPage: ({ children, innerProps, menuPortalTarget: menuPortalTargetProp, }: RowsPerPageProps) => import("react/jsx-runtime").JSX.Element;
-export interface PaginationArrowButtonProps extends CommonInnerProps<HTMLButtonElement> {
+    portalTarget?: HTMLElement | null;
+    children?: React.ReactNode;
+};
+declare const RowsPerPage: ({ portalTarget: portalTargetProp, children, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"div", RowsPerPageProps>) => import("react/jsx-runtime").JSX.Element;
+type PaginationArrowButtonProps = {
     action: 'previous' | 'next';
-}
-declare const PaginationArrowButton: ({ action, children, innerProps, }: PaginationArrowButtonProps) => import("react/jsx-runtime").JSX.Element;
-export interface PaginationNumericButtonProps extends CommonInnerProps<HTMLButtonElement> {
+    children?: React.ReactNode;
+    onClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+};
+declare const PaginationArrowButton: ({ action, children, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"button", PaginationArrowButtonProps>) => import("react/jsx-runtime").JSX.Element;
+type PaginationNumericButtonProps = {
     currentIndex: number | string;
     isSelected: boolean;
-}
-declare const PaginationNumericButton: ({ currentIndex, isSelected, children, innerProps, }: PaginationNumericButtonProps) => import("react/jsx-runtime").JSX.Element;
+    children?: React.ReactNode;
+    onClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+};
+declare const PaginationNumericButton: ({ currentIndex, isSelected, children, className, style, htmlAttributes, onClick, ref, ...restProps }: CommonProps<"button", PaginationNumericButtonProps>) => import("react/jsx-runtime").JSX.Element;
 declare const PaginationNumericButtons: () => import("react/jsx-runtime").JSX.Element;
-declare const Pagination: ({ children, innerProps, }: CommonInnerProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-declare const Navigation: ({ children, innerProps, }: CommonInnerProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-declare const LoadingPlaceholder: ({ children, innerProps, }: CommonInnerProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-declare const NoDataPlaceholder: ({ children, innerProps, }: CommonInnerProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-export declare const NoDataPlaceholderContentWrapper: ({ children, innerProps, }: CommonInnerProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
+type PaginationProps = {
+    children?: React.ReactNode;
+};
+declare const Pagination: ({ children, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"nav", PaginationProps>) => import("react/jsx-runtime").JSX.Element;
+type NavigationProps = {
+    children?: React.ReactNode;
+};
+declare const Navigation: ({ children, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"div", NavigationProps>) => import("react/jsx-runtime").JSX.Element;
+type LoadingPlaceholderProps = {
+    children?: React.ReactNode;
+};
+declare const LoadingPlaceholder: ({ children, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"div", LoadingPlaceholderProps>) => import("react/jsx-runtime").JSX.Element;
+type NoDataPlaceholderProps = {
+    children?: React.ReactNode;
+};
+declare const NoDataPlaceholder: ({ children, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"div", NoDataPlaceholderProps>) => import("react/jsx-runtime").JSX.Element;
+type NoDataPlaceholderContentWrapperProps = {
+    children?: React.ReactNode;
+};
+export declare const NoDataPlaceholderContentWrapper: ({ children, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"div", NoDataPlaceholderContentWrapperProps>) => import("react/jsx-runtime").JSX.Element;
 export interface InlineEditCellProps<T extends RowData> {
     cell: CellContext<T, unknown>;
     value: string;
-    ariaLabel?: string;
+    ariaLabel: string;
 }
-declare const InlineEditCell: <T extends RowData>({ cell, value, ariaLabel, }: InlineEditCellProps<T>) => import("react/jsx-runtime").JSX.Element | null;
-export interface DropDownCellProps<T extends RowData> {
+declare const InlineEditCell: <T extends RowData>({ cell, value, ariaLabel, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"input", InlineEditCellProps<T>>) => import("react/jsx-runtime").JSX.Element | null;
+type DropDownCellProps<T extends RowData> = {
     cell: CellContext<T, unknown>;
     options: {
         value: string;
@@ -127,11 +155,11 @@ export interface DropDownCellProps<T extends RowData> {
     }[];
     /**
      * The target element to portal the menu of the select component to, e.g. the modal root if the data grid is inside a modal.
-     * @defaultValue document.body
+     * Defaults to the portalTarget prop of the DataGrid root component.
      */
     portalTarget?: HTMLElement | null;
-    ariaLabel?: string;
-}
-declare const DropDownCell: <T extends RowData>({ cell, options, portalTarget: portalTargetProp, ariaLabel, }: DropDownCellProps<T>) => import("react/jsx-runtime").JSX.Element | null;
-declare const NoDataIcon: ({ className, ...restProps }: React.ComponentPropsWithoutRef<typeof DatagridNodataIcon>) => import("react/jsx-runtime").JSX.Element;
-export { ResizingBar, Header, Body, BodyCell, BodyRow, InlineEditCell, DropDownCell, RowActionCell, HeaderCell, HeaderTitle, Navigation, TableResults, RowsPerPage, Pagination, PaginationNumericButtons, PaginationArrowButton, PaginationNumericButton, NoDataPlaceholder, NoDataIllustration, NoDataIcon, LoadingPlaceholder, Scrollable, };
+    ariaLabel: string;
+};
+declare const DropDownCell: <T extends RowData>({ cell, options, portalTarget: portalTargetProp, ariaLabel, className, style, htmlAttributes, ref: forwardRef, ...restProps }: CommonProps<"div", DropDownCellProps<T>>) => import("react/jsx-runtime").JSX.Element | null;
+declare const NoDataIcon: ({ className, ...restProps }: React.ComponentPropsWithoutRef<typeof DataGridCrossIcon>) => import("react/jsx-runtime").JSX.Element;
+export { ResizingBar, Header, Body, BodyCell, BodyRow, InlineEditCell, DropDownCell, ActionCell, HeaderCell, HeaderTitle, Navigation, TableResults, RowsPerPage, Pagination, PaginationNumericButtons, PaginationArrowButton, PaginationNumericButton, NoDataPlaceholder, NoDataIcon, LoadingPlaceholder, Scrollable, };

package/lib/types/data-grid/DataGrid.d.ts

@@ -21,37 +21,7 @@
 import { type RowData, type Table as DataGridType } from '@tanstack/react-table';
 import { type HtmlAttributes } from '../_common/types';
 import { type Skeleton } from '../skeleton';
-import { type DataGridComponentsInterface } from './DataGridContext';
-export declare const DataGridComponents: {
-    ResizingBar: <T extends RowData>({ header, children, innerProps, }: import("./Components").ResizingBarProps<T>) => import("react/jsx-runtime").JSX.Element;
-    Header: ({ children, innerProps }: import("./Components").CommonInnerProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-    Body: ({ children, innerProps }: import("./Components").CommonInnerProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-    BodyCell: <T extends RowData>({ cell, children, innerProps, }: import("./Components").BodyCellProps<T>) => import("react/jsx-runtime").JSX.Element;
-    BodyRow: <T extends RowData>({ row, children, innerProps, }: import("./Components").BodyRowProps<T>) => import("react/jsx-runtime").JSX.Element;
-    RowActionCell: <T extends RowData>({ cell, innerCleanIconButtonProps, innerMenuProps, }: import("./Components").RowActionCellProps<T>) => import("react/jsx-runtime").JSX.Element | null;
-    InlineEditCell: <T extends RowData>({ cell, value, ariaLabel, }: import("./Components").InlineEditCellProps<T>) => import("react/jsx-runtime").JSX.Element | null;
-    DropDownCell: <T extends RowData>({ cell, options, portalTarget: portalTargetProp, ariaLabel, }: import("./Components").DropDownCellProps<T>) => import("react/jsx-runtime").JSX.Element | null;
-    HeaderCell: <T extends RowData>({ cell, children, innerProps, }: import("./Components").HeaderCellProps<T>) => import("react/jsx-runtime").JSX.Element;
-    HeaderTitle: <T extends RowData>({ cell, children, innerProps, }: import("./Components").HeaderTitleProps<T>) => import("react/jsx-runtime").JSX.Element;
-    ActionButton: ({ action, children, onClose, innerProps, }: import("./Components").ActionButtonProps) => import("react/jsx-runtime").JSX.Element;
-    ColumnControls: <T extends RowData>({ cell, children, innerProps, }: import("./Components").ColumnControlsProps<T>) => import("react/jsx-runtime").JSX.Element | null;
-    Navigation: ({ children, innerProps, }: import("./Components").CommonInnerProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-    TableResults: ({ children, innerProps, manualPagination, }: import("./Components").TableResultProps) => import("react/jsx-runtime").JSX.Element;
-    RowsPerPage: ({ children, innerProps, menuPortalTarget: menuPortalTargetProp, }: import("./Components").RowsPerPageProps) => import("react/jsx-runtime").JSX.Element;
-    Pagination: ({ children, innerProps, }: import("./Components").CommonInnerProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-    PaginationNumericButtons: () => import("react/jsx-runtime").JSX.Element;
-    PaginationNumericButton: ({ currentIndex, isSelected, children, innerProps, }: import("./Components").PaginationNumericButtonProps) => import("react/jsx-runtime").JSX.Element;
-    PaginationArrowButton: ({ action, children, innerProps, }: import("./Components").PaginationArrowButtonProps) => import("react/jsx-runtime").JSX.Element;
-    LoadingPlaceholder: ({ children, innerProps, }: import("./Components").CommonInnerProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-    NoDataPlaceholder: ({ children, innerProps, }: import("./Components").CommonInnerProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-    /** @deprecated use NoDataIcon instead */
-    NoDataIllustration: (props: import("react").SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
-    NoDataIcon: ({ className, ...restProps }: React.ComponentPropsWithoutRef<import("react").MemoExoticComponent<(props: import("react").SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element>>) => import("react/jsx-runtime").JSX.Element;
-    NoDataPlaceholderContentWrapper: ({ children, innerProps, }: import("./Components").CommonInnerProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-    Scrollable: ({ children, ref, innerProps, }: import("./Components").CommonInnerProps<HTMLDivElement> & {
-        ref: React.RefObject<HTMLDivElement | null>;
-    }) => import("react/jsx-runtime").JSX.Element;
-};
+import { type DataGridComponentsInterface } from './data-grid-context';
 declare enum BorderStyleEnum {
     AllSides = "all-sides",
     Horizontal = "horizontal",
@@ -112,5 +82,101 @@ export type DataGridProps<T extends RowData> = {
     portalTarget?: HTMLElement | null;
     ref?: React.Ref<HTMLDivElement>;
 };
-export declare const DataGrid: <T extends RowData = unknown>({ isResizable, isLoading, isKeyboardNavigable, isAutoResizingColumns, tableInstance, components, rootProps, styling, tableNavRef, isSkeletonLoading, skeletonProps, ref, portalTarget, }: DataGridProps<T>) => import("react/jsx-runtime").JSX.Element;
-export {};
+declare const DataGrid: (<T extends RowData = unknown>({ isResizable, isLoading, isKeyboardNavigable, isAutoResizingColumns, tableInstance, components, rootProps, styling, tableNavRef, isSkeletonLoading, skeletonProps, ref, portalTarget, }: DataGridProps<T>) => import("react/jsx-runtime").JSX.Element) & {
+    ActionButton: <T extends React.ElementType = "button">({ action, onClose, as, className, style, htmlAttributes, ref, ...restProps }: import("../_common/types").PolymorphicCommonProps<T, {
+        action: import("./datagrid-types").ColumnAction;
+        onClose: () => void;
+    }>) => import("react/jsx-runtime").JSX.Element;
+    ActionCell: <T extends RowData>({ cell, innerCleanIconButtonProps, innerMenuProps, }: import("./Components").ActionCellProps<T>) => import("react/jsx-runtime").JSX.Element | null;
+    Body: ({ children, className, style, htmlAttributes, ref, ...restProps }: import("../_common/types").CommonProps<"div", {
+        children?: React.ReactNode;
+    }>) => import("react/jsx-runtime").JSX.Element;
+    BodyCell: <T extends RowData>({ cell, children, className, style, htmlAttributes, ref, ...restProps }: import("../_common/types").CommonProps<"div", {
+        cell: import("@tanstack/react-table").Cell<T, unknown>;
+        children?: React.ReactNode;
+    }>) => import("react/jsx-runtime").JSX.Element;
+    BodyRow: <T extends RowData>({ row, children, className, style, htmlAttributes, ref, ...restProps }: import("../_common/types").CommonProps<"div", {
+        row: import("@tanstack/react-table").Row<T>;
+        children?: React.ReactNode;
+    }>) => import("react/jsx-runtime").JSX.Element;
+    ColumnControls: <T extends RowData>({ cell, children, className, style, htmlAttributes, ref, ...restProps }: import("../_common/types").CommonProps<"div", {
+        cell: import("@tanstack/react-table").Header<T, unknown>;
+        children?: React.ReactNode;
+    }>) => import("react/jsx-runtime").JSX.Element | null;
+    DropDownCell: <T extends RowData>({ cell, options, portalTarget: portalTargetProp, ariaLabel, className, style, htmlAttributes, ref: forwardRef, ...restProps }: import("../_common/types").CommonProps<"div", {
+        cell: import("@tanstack/react-table").CellContext<T, unknown>;
+        options: {
+            value: string;
+            label: string;
+        }[];
+        portalTarget?: HTMLElement | null;
+        ariaLabel: string;
+    }>) => import("react/jsx-runtime").JSX.Element | null;
+    Header: ({ children, className, style, htmlAttributes, ref, ...restProps }: import("../_common/types").CommonProps<"div", {
+        children?: React.ReactNode;
+    }>) => import("react/jsx-runtime").JSX.Element;
+    HeaderCell: <T extends RowData>({ cell, children, className, style, htmlAttributes, ref, ...restProps }: import("../_common/types").CommonProps<"div", {
+        cell: import("@tanstack/react-table").Header<T, unknown>;
+        children?: React.ReactNode;
+    }>) => import("react/jsx-runtime").JSX.Element;
+    HeaderTitle: <T extends RowData>({ cell, children, className, style, htmlAttributes, ref, ...restProps }: import("../_common/types").CommonProps<"div", {
+        cell: import("@tanstack/react-table").Header<T, unknown>;
+        children?: React.ReactNode;
+    }>) => import("react/jsx-runtime").JSX.Element;
+    InlineEditCell: <T extends RowData>({ cell, value, ariaLabel, className, style, htmlAttributes, ref, ...restProps }: import("../_common/types").CommonProps<"input", import("./Components").InlineEditCellProps<T>>) => import("react/jsx-runtime").JSX.Element | null;
+    LoadingPlaceholder: ({ children, className, style, htmlAttributes, ref, ...restProps }: import("../_common/types").CommonProps<"div", {
+        children?: React.ReactNode;
+    }>) => import("react/jsx-runtime").JSX.Element;
+    Navigation: ({ children, className, style, htmlAttributes, ref, ...restProps }: import("../_common/types").CommonProps<"div", {
+        children?: React.ReactNode;
+    }>) => import("react/jsx-runtime").JSX.Element;
+    NoDataIcon: ({ className, ...restProps }: React.ComponentPropsWithoutRef<import("react").MemoExoticComponent<({ className, style, ref, htmlAttributes, ...restProps }: {
+        className?: string;
+        style?: React.CSSProperties;
+        htmlAttributes?: HtmlAttributes<(props: import("react").SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element> | undefined;
+        ref?: import("react").Ref<SVGSVGElement> | undefined;
+    }) => import("react/jsx-runtime").JSX.Element>>) => import("react/jsx-runtime").JSX.Element;
+    NoDataPlaceholder: ({ children, className, style, htmlAttributes, ref, ...restProps }: import("../_common/types").CommonProps<"div", {
+        children?: React.ReactNode;
+    }>) => import("react/jsx-runtime").JSX.Element;
+    NoDataPlaceholderContentWrapper: ({ children, className, style, htmlAttributes, ref, ...restProps }: import("../_common/types").CommonProps<"div", {
+        children?: React.ReactNode;
+    }>) => import("react/jsx-runtime").JSX.Element;
+    Pagination: ({ children, className, style, htmlAttributes, ref, ...restProps }: import("../_common/types").CommonProps<"nav", {
+        children?: React.ReactNode;
+    }>) => import("react/jsx-runtime").JSX.Element;
+    PaginationArrowButton: ({ action, children, className, style, htmlAttributes, ref, ...restProps }: import("../_common/types").CommonProps<"button", {
+        action: "previous" | "next";
+        children?: React.ReactNode;
+        onClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+    }>) => import("react/jsx-runtime").JSX.Element;
+    PaginationNumericButton: ({ currentIndex, isSelected, children, className, style, htmlAttributes, onClick, ref, ...restProps }: import("../_common/types").CommonProps<"button", {
+        currentIndex: number | string;
+        isSelected: boolean;
+        children?: React.ReactNode;
+        onClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+    }>) => import("react/jsx-runtime").JSX.Element;
+    PaginationNumericButtons: () => import("react/jsx-runtime").JSX.Element;
+    ResizingBar: <T extends RowData>({ header, className, style, htmlAttributes, ref, ...restProps }: import("../_common/types").CommonProps<"button", {
+        header: import("@tanstack/react-table").Header<T, unknown>;
+    }>) => import("react/jsx-runtime").JSX.Element;
+    RowsPerPage: ({ portalTarget: portalTargetProp, children, className, style, htmlAttributes, ref, ...restProps }: import("../_common/types").CommonProps<"div", {
+        portalTarget?: HTMLElement | null;
+        children?: React.ReactNode;
+    }>) => import("react/jsx-runtime").JSX.Element;
+    Scrollable: ({ children, ref, className, style, htmlAttributes, ...restProps }: import("../_common/types").CommonProps<"div", {
+        children?: React.ReactNode;
+    }> & {
+        ref: React.RefObject<HTMLDivElement | null>;
+    }) => import("react/jsx-runtime").JSX.Element;
+    TableResults: ({ manualPagination, children, className, style, htmlAttributes, ref, resultsLabel, ...restProps }: import("../_common/types").CommonProps<"span", {
+        manualPagination?: {
+            from: number;
+            to: number;
+            totalRows: number;
+        };
+        children?: React.ReactNode;
+        resultsLabel?: string;
+    }>) => import("react/jsx-runtime").JSX.Element;
+};
+export { DataGrid };

package/lib/types/data-grid/data-grid-context.d.ts

@@ -0,0 +1,71 @@
+/**
+ *
+ *  Copyright (c) "Neo4j"
+ *  Neo4j Sweden AB [http://neo4j.com]
+ *
+ *  This file is part of Neo4j.
+ *
+ *  Neo4j is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation, either version 3 of the License, or
+ *  (at your option) any later version.
+ *
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU General Public License for more details.
+ *
+ *  You should have received a copy of the GNU General Public License
+ *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+import { type RowData, type Table as DataGridType } from '@tanstack/react-table';
+import { type Skeleton } from '../skeleton';
+import { type ActionButton, type ActionCell, type Body, type BodyCell, type BodyRow, type ColumnControls, type Header, type HeaderCell, type HeaderTitle, type LoadingPlaceholder, type Navigation, type NoDataPlaceholder, type Pagination, type PaginationArrowButton, type PaginationNumericButton, type PaginationNumericButtons, type ResizingBar, type RowsPerPage, type Scrollable, type TableResults } from './Components';
+import { type DataGridNav } from './data-grid-nav/data-grid-nav';
+type Nullable<T> = T | null;
+export interface DataGridComponentsInterface<T extends RowData> {
+    ResizingBar?: Nullable<typeof ResizingBar<T>>;
+    /**
+     * Header Section
+     */
+    Header?: Nullable<typeof Header>;
+    HeaderCell?: Nullable<typeof HeaderCell<T>>;
+    HeaderTitle?: Nullable<typeof HeaderTitle<T>>;
+    ActionButton?: Nullable<typeof ActionButton>;
+    ColumnControls?: Nullable<typeof ColumnControls>;
+    /**
+     * Body Section
+     */
+    Scrollable?: Nullable<typeof Scrollable>;
+    Body?: Nullable<typeof Body>;
+    BodyCell?: Nullable<typeof BodyCell<T>>;
+    BodyRow?: Nullable<typeof BodyRow<T>>;
+    ActionCell?: Nullable<typeof ActionCell<T>>;
+    LoadingPlaceholder?: Nullable<typeof LoadingPlaceholder>;
+    NoDataPlaceholder?: Nullable<typeof NoDataPlaceholder>;
+    /**
+     * Navigation Section
+     */
+    Navigation?: Nullable<typeof Navigation>;
+    Pagination?: Nullable<typeof Pagination>;
+    PaginationArrowButton?: Nullable<typeof PaginationArrowButton>;
+    TableResults?: Nullable<typeof TableResults>;
+    RowsPerPage?: Nullable<typeof RowsPerPage>;
+    PaginationNumericButtons?: Nullable<typeof PaginationNumericButtons>;
+    PaginationNumericButton?: Nullable<typeof PaginationNumericButton>;
+}
+export interface DataGridContextType<T extends RowData> {
+    isResizable: boolean;
+    tableProps: DataGridType<T>;
+    components: DataGridComponentsInterface<T>;
+    isLoading: boolean;
+    hasResizeColumns: boolean;
+    isKeyboardNavigationEnabled: boolean;
+    isSkeletonLoading: boolean;
+    skeletonProps: React.ComponentProps<typeof Skeleton>;
+    dataGridNav: DataGridNav;
+    portalTarget: HTMLElement | null;
+}
+export declare const DataGridContext: import("react").Context<DataGridContextType<any>>;
+export declare function useDataGridContext<T extends RowData>(): DataGridContextType<T>;
+export {};

package/lib/types/data-grid/data-grid-nav/selectors.d.ts

@@ -20,8 +20,7 @@
  */
 export declare const Selectors: {
     readonly Cell: "[role=\"cell\"],[role=\"gridcell\"],[role=\"columnheader\"],[role=\"rowheader\"],td,th";
+    readonly Focusable: "a,frame,iframe,input:not([type=hidden]):not(:disabled),select:not(:disabled),textarea:not(:disabled),button:not([aria-disabled=\"true\"]):not([tabindex=\"-1\"]):not(:disabled),*[tabindex]:not(.ndl-data-grid-resizer)";
     readonly Row: "[role=\"row\"],tr";
     readonly RowGroup: "[role=\"rowgroup\"],thead,tbody,tfoot";
-    /** Selector from here: https://github.com/Shopify/polaris/blob/main/polaris-react/src/utilities/focus.ts#L10 */
-    readonly Focusable: "a,frame,iframe,input:not([type=hidden]):not(:disabled),select:not(:disabled),textarea:not(:disabled),button:not([aria-disabled=\"true\"]):not([tabindex=\"-1\"]):not(:disabled),*[tabindex]:not(.ndl-data-grid-resizer)";
 };

package/lib/types/data-grid/datagrid-types.d.ts

@@ -20,7 +20,7 @@
  */
 import '@tanstack/react-table';
 import { type CellContext, type RowData } from '@tanstack/react-table';
-import { type MenuItemProps, type NestedMenuItemProps } from '../context-menu/context-menu-types';
+import { type MenuItemProps, type NestedMenuItemProps } from '../menu/menu-types';
 export type ColumnAction = MenuItemProps;
 export type RowAction = MenuItemProps;
 declare module '@tanstack/react-table' {

package/lib/types/data-grid/index.d.ts

@@ -18,11 +18,10 @@
  *  You should have received a copy of the GNU General Public License
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
-import { useDataGridContext } from './DataGridContext';
+import { useDataGridContext } from './data-grid-context';
 import * as dataGridUtils from './helpers';
-export { DataGrid, DataGridComponents, type HeaderStyle, type BorderStyle, } from './DataGrid';
+export { DataGrid, type HeaderStyle, type BorderStyle } from './DataGrid';
 export { dataGridUtils, useDataGridContext };
 export type * from './datagrid-types';
-export { type CommonInnerProps, type BodyRowProps, type HeaderCellProps, } from './Components';
 export { useTableNav } from './data-grid-nav';
 export * from './data-grid-nav/data-grid-nav';