@equinor/apollo-components 3.7.1 → 3.7.3

package/dist/index.d.mts

@@ -1,13 +1,16 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
 import { IconData } from '@equinor/eds-icons';
 import * as react from 'react';
 import { ReactNode, ReactElement, HTMLProps, MutableRefObject, Dispatch, SetStateAction, SyntheticEvent } from 'react';
 import { CellContext, Table, Row, SortingState, OnChangeFn, Cell, ColumnDef, ColumnResizeMode, RowSelectionState, ExpandedState, ColumnPinningState, VisibilityState, HeaderContext, Column, Header } from '@tanstack/react-table';
 export { Cell, CellContext, ColumnDef, ColumnPinningState, ColumnResizeMode, ColumnSort, ExpandedState, HeaderContext, OnChangeFn, Row, RowSelectionState, SortingState, Table, VisibilityState, createColumnHelper } from '@tanstack/react-table';
-import * as styled_components from 'styled-components';
+import * as styled_components_dist_types from 'styled-components/dist/types';
 import * as _equinor_eds_core_react from '@equinor/eds-core-react';
 import { CellProps, TypographyProps as TypographyProps$1 } from '@equinor/eds-core-react';
+import * as _equinor_eds_core_react_dist_types_components_Table_Table_types from '@equinor/eds-core-react/dist/types/components/Table/Table.types';
 import { ColumnDef as ColumnDef$1 } from '@tanstack/table-core';
 import { SetRequired } from 'type-fest';
+import * as styled_components from 'styled-components';
 import { Variants } from '@equinor/eds-core-react/dist/types/components/types';
 import { FieldError } from 'react-hook-form';
 
@@ -17,27 +20,27 @@ interface AppShellProps {
     icon?: IconData;
     title?: string;
 }
-declare const AppShell: ({ children, icon, title, sidebar }: AppShellProps) => JSX.Element;
+declare const AppShell: ({ children, icon, title, sidebar }: AppShellProps) => react_jsx_runtime.JSX.Element;
 
-declare function AppSidebar(): JSX.Element;
+declare function AppSidebar(): react_jsx_runtime.JSX.Element;
 
-declare function CheckboxCell<T>(context: CellContext<T, boolean>): JSX.Element;
+declare function CheckboxCell<T>(context: CellContext<T, boolean>): react_jsx_runtime.JSX.Element;
 
 declare const ChipsCell: (props: {
     values?: string[];
-}) => JSX.Element;
+}) => react_jsx_runtime.JSX.Element;
 
 interface ColumnSelectProps<T> {
     table: Table<T>;
     columnSelectPlaceholder?: string;
 }
-declare function ColumnSelect<T>({ table, columnSelectPlaceholder }: ColumnSelectProps<T>): JSX.Element;
+declare function ColumnSelect<T>({ table, columnSelectPlaceholder }: ColumnSelectProps<T>): react_jsx_runtime.JSX.Element;
 
 interface TableHeaderProps<T> {
     table: Table<T>;
     sticky?: boolean;
 }
-declare function TableHeader<T>({ table, sticky }: TableHeaderProps<T>): JSX.Element;
+declare function TableHeader<T>({ table, sticky }: TableHeaderProps<T>): react_jsx_runtime.JSX.Element;
 
 interface TableRowWrapper<T> {
     (props: TableRowWrapperProps<T>): ReactElement;
@@ -168,7 +171,7 @@ type ControlledState<T> = {
     onChange?: Dispatch<SetStateAction<T>>;
 };
 
-declare function DataTable<T>(props: DataTableProps<T>): JSX.Element;
+declare function DataTable<T>(props: DataTableProps<T>): react_jsx_runtime.JSX.Element;
 
 /**
  * Capitalize the table header.
@@ -206,40 +209,76 @@ type TableCellProps<T> = {
 type StyledStickyCellProps = {
     backgroundColor?: string;
 };
-declare const StyledStickyCell: styled_components.StyledComponent<react.ForwardRefExoticComponent<_equinor_eds_core_react.CellProps & react.RefAttributes<HTMLTableCellElement>>, any, ({} & _equinor_eds_core_react.CellProps) & StyledStickyCellProps, never>;
-declare function DynamicCell<T>({ cell, cellConfig }: TableCellProps<T>): JSX.Element;
+declare const StyledStickyCell: styled_components_dist_types.IStyledComponentBase<"web", styled_components_dist_types.Substitute<styled_components_dist_types.Substitute<(Omit<{
+    variant?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Variants;
+    color?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Colors;
+    sort?: React.AriaAttributes["aria-sort"];
+} & react.TdHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>, "ref"> & {
+    ref?: ((instance: HTMLTableCellElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLTableCellElement> | null | undefined;
+}) | (Omit<{
+    variant?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Variants;
+    color?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Colors;
+    sort?: React.AriaAttributes["aria-sort"];
+} & react.ThHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>, "ref"> & {
+    ref?: ((instance: HTMLTableCellElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLTableCellElement> | null | undefined;
+}), _equinor_eds_core_react.CellProps> & styled_components_dist_types.BaseObject, StyledStickyCellProps>> & string;
+declare function DynamicCell<T>({ cell, cellConfig }: TableCellProps<T>): react_jsx_runtime.JSX.Element;
 
 interface HeaderCellProps<TData, TValue> {
     header: Header<TData, TValue>;
     /** Needed for column resizing */
     table: Table<TData>;
 }
-declare const HeaderCell: <TData, TValue>({ header, table }: HeaderCellProps<TData, TValue>) => JSX.Element;
+declare const HeaderCell: <TData, TValue>({ header, table }: HeaderCellProps<TData, TValue>) => react_jsx_runtime.JSX.Element;
 
 type HierarchyCellOptions = {
     getRowDepth?: () => number;
     getDisplayName?: () => string;
 };
-declare function HierarchyCell<T>(cell: CellContext<T, any>, options?: HierarchyCellOptions): JSX.Element;
+declare function HierarchyCell<T>(cell: CellContext<T, any>, options?: HierarchyCellOptions): react_jsx_runtime.JSX.Element;
 
 interface PopoverCellProps {
     id: string;
     value: string;
     title?: string | JSX.Element | ReactNode;
 }
-declare function PopoverCell(props: PopoverCellProps): JSX.Element;
+declare function PopoverCell(props: PopoverCellProps): react_jsx_runtime.JSX.Element;
 
 declare function SelectColumnDef<T>(props: SetRequired<DataTableProps<T>, 'rowSelection'>['rowSelection']): ColumnDef$1<T, any>;
 
-declare const leftCellShadow: styled_components.FlattenSimpleInterpolation;
-declare const StickyCell: styled_components.StyledComponent<react.ForwardRefExoticComponent<CellProps & react.RefAttributes<HTMLTableCellElement>>, any, {} & CellProps, never>;
-declare const StickyHeaderCell: styled_components.StyledComponent<react.ForwardRefExoticComponent<CellProps & react.RefAttributes<HTMLTableCellElement>>, any, ({} & CellProps) & CellProps, never>;
+declare const leftCellShadow: styled_components.RuleSet<object>;
+declare const StickyCell: styled_components_dist_types.IStyledComponentBase<"web", styled_components_dist_types.Substitute<(Omit<{
+    variant?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Variants;
+    color?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Colors;
+    sort?: React.AriaAttributes["aria-sort"];
+} & react.TdHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>, "ref"> & {
+    ref?: ((instance: HTMLTableCellElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLTableCellElement> | null | undefined;
+}) | (Omit<{
+    variant?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Variants;
+    color?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Colors;
+    sort?: React.AriaAttributes["aria-sort"];
+} & react.ThHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>, "ref"> & {
+    ref?: ((instance: HTMLTableCellElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLTableCellElement> | null | undefined;
+}), CellProps>> & string & Omit<react.ForwardRefExoticComponent<CellProps & react.RefAttributes<HTMLTableCellElement>>, keyof react.Component<any, {}, any>>;
+declare const StickyHeaderCell: styled_components_dist_types.IStyledComponentBase<"web", styled_components_dist_types.Substitute<styled_components_dist_types.Substitute<(Omit<{
+    variant?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Variants;
+    color?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Colors;
+    sort?: React.AriaAttributes["aria-sort"];
+} & react.TdHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>, "ref"> & {
+    ref?: ((instance: HTMLTableCellElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLTableCellElement> | null | undefined;
+}) | (Omit<{
+    variant?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Variants;
+    color?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Colors;
+    sort?: React.AriaAttributes["aria-sort"];
+} & react.ThHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>, "ref"> & {
+    ref?: ((instance: HTMLTableCellElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLTableCellElement> | null | undefined;
+}), CellProps> & styled_components_dist_types.BaseObject, CellProps>> & string;
 
 type TypographyProps = {
     truncate?: boolean;
     enableShowAllOnHover?: boolean;
 } & TypographyProps$1;
-declare const TypographyCustom: (props: TypographyProps) => JSX.Element;
+declare const TypographyCustom: (props: TypographyProps) => react_jsx_runtime.JSX.Element;
 
 /**
  * Generate a HSL color based on a given string.
@@ -307,12 +346,12 @@ interface EditableCellBaseProps<T extends FormMeta, Value> extends CellContext<T
     onChange?: (value: Value) => void;
 }
 
-declare function EditableCheckboxCell<T extends FormMeta>({ onChange: onChangeFromProps, ...context }: EditableCellBaseProps<T, boolean>): JSX.Element;
+declare function EditableCheckboxCell<T extends FormMeta>({ onChange: onChangeFromProps, ...context }: EditableCellBaseProps<T, boolean>): react_jsx_runtime.JSX.Element;
 
 interface EditableDateCellProps<T extends FormMeta> extends EditableCellBaseProps<T, string> {
     dateStringFormatter?: (date: string) => string;
 }
-declare function EditableDateCell<T extends FormMeta>({ dateStringFormatter, error: errorFromProps, onChange: onChangeFromProps, ...context }: EditableDateCellProps<T>): JSX.Element;
+declare function EditableDateCell<T extends FormMeta>({ dateStringFormatter, error: errorFromProps, onChange: onChangeFromProps, ...context }: EditableDateCellProps<T>): react_jsx_runtime.JSX.Element;
 
 interface Option {
     label: string;
@@ -325,16 +364,16 @@ interface EditableDropdownSingleCellProps<T extends FormMeta> extends Omit<Edita
     options: Option[];
     onChange?: (value: Option) => void;
 }
-declare function EditableDropdownSingleCell<T extends FormMeta>({ options, error: errorFromProps, onChange: onChangeFromProps, ...context }: EditableDropdownSingleCellProps<T>): JSX.Element;
+declare function EditableDropdownSingleCell<T extends FormMeta>({ options, error: errorFromProps, onChange: onChangeFromProps, ...context }: EditableDropdownSingleCellProps<T>): react_jsx_runtime.JSX.Element;
 
-declare function EditableNumberCell<T extends FormMeta>({ error: errorFromProps, ...context }: EditableCellBaseProps<T, number>): JSX.Element;
+declare function EditableNumberCell<T extends FormMeta>({ error: errorFromProps, ...context }: EditableCellBaseProps<T, number>): react_jsx_runtime.JSX.Element;
 
 interface EdtiableTextAreaProps<T extends FormMeta> extends EditableCellBaseProps<T, string> {
     title: string;
 }
-declare function EditableTextAreaCell<T extends FormMeta>({ title, error: errorFromProps, onChange: onChangeFromProps, ...context }: EdtiableTextAreaProps<T>): JSX.Element;
+declare function EditableTextAreaCell<T extends FormMeta>({ title, error: errorFromProps, onChange: onChangeFromProps, ...context }: EdtiableTextAreaProps<T>): react_jsx_runtime.JSX.Element;
 
-declare function EditableTextFieldCell<T extends FormMeta>({ error: errorFromProps, ...context }: EditableCellBaseProps<T, string>): JSX.Element;
+declare function EditableTextFieldCell<T extends FormMeta>({ error: errorFromProps, ...context }: EditableCellBaseProps<T, string>): react_jsx_runtime.JSX.Element;
 
 declare const WARNING_PREFIX = "WARNING";
 declare function getHelperTextProps({ error, warning, helperText, }: GetHelperTextPropsProps): GetHelperTextProps;

package/dist/index.d.ts

@@ -1,13 +1,16 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
 import { IconData } from '@equinor/eds-icons';
 import * as react from 'react';
 import { ReactNode, ReactElement, HTMLProps, MutableRefObject, Dispatch, SetStateAction, SyntheticEvent } from 'react';
 import { CellContext, Table, Row, SortingState, OnChangeFn, Cell, ColumnDef, ColumnResizeMode, RowSelectionState, ExpandedState, ColumnPinningState, VisibilityState, HeaderContext, Column, Header } from '@tanstack/react-table';
 export { Cell, CellContext, ColumnDef, ColumnPinningState, ColumnResizeMode, ColumnSort, ExpandedState, HeaderContext, OnChangeFn, Row, RowSelectionState, SortingState, Table, VisibilityState, createColumnHelper } from '@tanstack/react-table';
-import * as styled_components from 'styled-components';
+import * as styled_components_dist_types from 'styled-components/dist/types';
 import * as _equinor_eds_core_react from '@equinor/eds-core-react';
 import { CellProps, TypographyProps as TypographyProps$1 } from '@equinor/eds-core-react';
+import * as _equinor_eds_core_react_dist_types_components_Table_Table_types from '@equinor/eds-core-react/dist/types/components/Table/Table.types';
 import { ColumnDef as ColumnDef$1 } from '@tanstack/table-core';
 import { SetRequired } from 'type-fest';
+import * as styled_components from 'styled-components';
 import { Variants } from '@equinor/eds-core-react/dist/types/components/types';
 import { FieldError } from 'react-hook-form';
 
@@ -17,27 +20,27 @@ interface AppShellProps {
     icon?: IconData;
     title?: string;
 }
-declare const AppShell: ({ children, icon, title, sidebar }: AppShellProps) => JSX.Element;
+declare const AppShell: ({ children, icon, title, sidebar }: AppShellProps) => react_jsx_runtime.JSX.Element;
 
-declare function AppSidebar(): JSX.Element;
+declare function AppSidebar(): react_jsx_runtime.JSX.Element;
 
-declare function CheckboxCell<T>(context: CellContext<T, boolean>): JSX.Element;
+declare function CheckboxCell<T>(context: CellContext<T, boolean>): react_jsx_runtime.JSX.Element;
 
 declare const ChipsCell: (props: {
     values?: string[];
-}) => JSX.Element;
+}) => react_jsx_runtime.JSX.Element;
 
 interface ColumnSelectProps<T> {
     table: Table<T>;
     columnSelectPlaceholder?: string;
 }
-declare function ColumnSelect<T>({ table, columnSelectPlaceholder }: ColumnSelectProps<T>): JSX.Element;
+declare function ColumnSelect<T>({ table, columnSelectPlaceholder }: ColumnSelectProps<T>): react_jsx_runtime.JSX.Element;
 
 interface TableHeaderProps<T> {
     table: Table<T>;
     sticky?: boolean;
 }
-declare function TableHeader<T>({ table, sticky }: TableHeaderProps<T>): JSX.Element;
+declare function TableHeader<T>({ table, sticky }: TableHeaderProps<T>): react_jsx_runtime.JSX.Element;
 
 interface TableRowWrapper<T> {
     (props: TableRowWrapperProps<T>): ReactElement;
@@ -168,7 +171,7 @@ type ControlledState<T> = {
     onChange?: Dispatch<SetStateAction<T>>;
 };
 
-declare function DataTable<T>(props: DataTableProps<T>): JSX.Element;
+declare function DataTable<T>(props: DataTableProps<T>): react_jsx_runtime.JSX.Element;
 
 /**
  * Capitalize the table header.
@@ -206,40 +209,76 @@ type TableCellProps<T> = {
 type StyledStickyCellProps = {
     backgroundColor?: string;
 };
-declare const StyledStickyCell: styled_components.StyledComponent<react.ForwardRefExoticComponent<_equinor_eds_core_react.CellProps & react.RefAttributes<HTMLTableCellElement>>, any, ({} & _equinor_eds_core_react.CellProps) & StyledStickyCellProps, never>;
-declare function DynamicCell<T>({ cell, cellConfig }: TableCellProps<T>): JSX.Element;
+declare const StyledStickyCell: styled_components_dist_types.IStyledComponentBase<"web", styled_components_dist_types.Substitute<styled_components_dist_types.Substitute<(Omit<{
+    variant?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Variants;
+    color?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Colors;
+    sort?: React.AriaAttributes["aria-sort"];
+} & react.TdHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>, "ref"> & {
+    ref?: ((instance: HTMLTableCellElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLTableCellElement> | null | undefined;
+}) | (Omit<{
+    variant?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Variants;
+    color?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Colors;
+    sort?: React.AriaAttributes["aria-sort"];
+} & react.ThHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>, "ref"> & {
+    ref?: ((instance: HTMLTableCellElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLTableCellElement> | null | undefined;
+}), _equinor_eds_core_react.CellProps> & styled_components_dist_types.BaseObject, StyledStickyCellProps>> & string;
+declare function DynamicCell<T>({ cell, cellConfig }: TableCellProps<T>): react_jsx_runtime.JSX.Element;
 
 interface HeaderCellProps<TData, TValue> {
     header: Header<TData, TValue>;
     /** Needed for column resizing */
     table: Table<TData>;
 }
-declare const HeaderCell: <TData, TValue>({ header, table }: HeaderCellProps<TData, TValue>) => JSX.Element;
+declare const HeaderCell: <TData, TValue>({ header, table }: HeaderCellProps<TData, TValue>) => react_jsx_runtime.JSX.Element;
 
 type HierarchyCellOptions = {
     getRowDepth?: () => number;
     getDisplayName?: () => string;
 };
-declare function HierarchyCell<T>(cell: CellContext<T, any>, options?: HierarchyCellOptions): JSX.Element;
+declare function HierarchyCell<T>(cell: CellContext<T, any>, options?: HierarchyCellOptions): react_jsx_runtime.JSX.Element;
 
 interface PopoverCellProps {
     id: string;
     value: string;
     title?: string | JSX.Element | ReactNode;
 }
-declare function PopoverCell(props: PopoverCellProps): JSX.Element;
+declare function PopoverCell(props: PopoverCellProps): react_jsx_runtime.JSX.Element;
 
 declare function SelectColumnDef<T>(props: SetRequired<DataTableProps<T>, 'rowSelection'>['rowSelection']): ColumnDef$1<T, any>;
 
-declare const leftCellShadow: styled_components.FlattenSimpleInterpolation;
-declare const StickyCell: styled_components.StyledComponent<react.ForwardRefExoticComponent<CellProps & react.RefAttributes<HTMLTableCellElement>>, any, {} & CellProps, never>;
-declare const StickyHeaderCell: styled_components.StyledComponent<react.ForwardRefExoticComponent<CellProps & react.RefAttributes<HTMLTableCellElement>>, any, ({} & CellProps) & CellProps, never>;
+declare const leftCellShadow: styled_components.RuleSet<object>;
+declare const StickyCell: styled_components_dist_types.IStyledComponentBase<"web", styled_components_dist_types.Substitute<(Omit<{
+    variant?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Variants;
+    color?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Colors;
+    sort?: React.AriaAttributes["aria-sort"];
+} & react.TdHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>, "ref"> & {
+    ref?: ((instance: HTMLTableCellElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLTableCellElement> | null | undefined;
+}) | (Omit<{
+    variant?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Variants;
+    color?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Colors;
+    sort?: React.AriaAttributes["aria-sort"];
+} & react.ThHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>, "ref"> & {
+    ref?: ((instance: HTMLTableCellElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLTableCellElement> | null | undefined;
+}), CellProps>> & string & Omit<react.ForwardRefExoticComponent<CellProps & react.RefAttributes<HTMLTableCellElement>>, keyof react.Component<any, {}, any>>;
+declare const StickyHeaderCell: styled_components_dist_types.IStyledComponentBase<"web", styled_components_dist_types.Substitute<styled_components_dist_types.Substitute<(Omit<{
+    variant?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Variants;
+    color?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Colors;
+    sort?: React.AriaAttributes["aria-sort"];
+} & react.TdHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>, "ref"> & {
+    ref?: ((instance: HTMLTableCellElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLTableCellElement> | null | undefined;
+}) | (Omit<{
+    variant?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Variants;
+    color?: _equinor_eds_core_react_dist_types_components_Table_Table_types.Colors;
+    sort?: React.AriaAttributes["aria-sort"];
+} & react.ThHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>, "ref"> & {
+    ref?: ((instance: HTMLTableCellElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLTableCellElement> | null | undefined;
+}), CellProps> & styled_components_dist_types.BaseObject, CellProps>> & string;
 
 type TypographyProps = {
     truncate?: boolean;
     enableShowAllOnHover?: boolean;
 } & TypographyProps$1;
-declare const TypographyCustom: (props: TypographyProps) => JSX.Element;
+declare const TypographyCustom: (props: TypographyProps) => react_jsx_runtime.JSX.Element;
 
 /**
  * Generate a HSL color based on a given string.
@@ -307,12 +346,12 @@ interface EditableCellBaseProps<T extends FormMeta, Value> extends CellContext<T
     onChange?: (value: Value) => void;
 }
 
-declare function EditableCheckboxCell<T extends FormMeta>({ onChange: onChangeFromProps, ...context }: EditableCellBaseProps<T, boolean>): JSX.Element;
+declare function EditableCheckboxCell<T extends FormMeta>({ onChange: onChangeFromProps, ...context }: EditableCellBaseProps<T, boolean>): react_jsx_runtime.JSX.Element;
 
 interface EditableDateCellProps<T extends FormMeta> extends EditableCellBaseProps<T, string> {
     dateStringFormatter?: (date: string) => string;
 }
-declare function EditableDateCell<T extends FormMeta>({ dateStringFormatter, error: errorFromProps, onChange: onChangeFromProps, ...context }: EditableDateCellProps<T>): JSX.Element;
+declare function EditableDateCell<T extends FormMeta>({ dateStringFormatter, error: errorFromProps, onChange: onChangeFromProps, ...context }: EditableDateCellProps<T>): react_jsx_runtime.JSX.Element;
 
 interface Option {
     label: string;
@@ -325,16 +364,16 @@ interface EditableDropdownSingleCellProps<T extends FormMeta> extends Omit<Edita
     options: Option[];
     onChange?: (value: Option) => void;
 }
-declare function EditableDropdownSingleCell<T extends FormMeta>({ options, error: errorFromProps, onChange: onChangeFromProps, ...context }: EditableDropdownSingleCellProps<T>): JSX.Element;
+declare function EditableDropdownSingleCell<T extends FormMeta>({ options, error: errorFromProps, onChange: onChangeFromProps, ...context }: EditableDropdownSingleCellProps<T>): react_jsx_runtime.JSX.Element;
 
-declare function EditableNumberCell<T extends FormMeta>({ error: errorFromProps, ...context }: EditableCellBaseProps<T, number>): JSX.Element;
+declare function EditableNumberCell<T extends FormMeta>({ error: errorFromProps, ...context }: EditableCellBaseProps<T, number>): react_jsx_runtime.JSX.Element;
 
 interface EdtiableTextAreaProps<T extends FormMeta> extends EditableCellBaseProps<T, string> {
     title: string;
 }
-declare function EditableTextAreaCell<T extends FormMeta>({ title, error: errorFromProps, onChange: onChangeFromProps, ...context }: EdtiableTextAreaProps<T>): JSX.Element;
+declare function EditableTextAreaCell<T extends FormMeta>({ title, error: errorFromProps, onChange: onChangeFromProps, ...context }: EdtiableTextAreaProps<T>): react_jsx_runtime.JSX.Element;
 
-declare function EditableTextFieldCell<T extends FormMeta>({ error: errorFromProps, ...context }: EditableCellBaseProps<T, string>): JSX.Element;
+declare function EditableTextFieldCell<T extends FormMeta>({ error: errorFromProps, ...context }: EditableCellBaseProps<T, string>): react_jsx_runtime.JSX.Element;
 
 declare const WARNING_PREFIX = "WARNING";
 declare function getHelperTextProps({ error, warning, helperText, }: GetHelperTextPropsProps): GetHelperTextProps;

package/dist/index.js

@@ -2862,8 +2862,7 @@ var HeaderDiv = import_styled_components6.default.div`
 `;
 function HeaderContent({ header, table }) {
   var _a;
-  if (header.isPlaceholder)
-    return null;
+  if (header.isPlaceholder) return null;
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(HeaderDiv, { children: [
     (0, import_react_table2.flexRender)(header.column.columnDef.header, header.getContext()),
     (_a = {
@@ -2886,8 +2885,7 @@ function HeaderContent({ header, table }) {
   ] });
 }
 function getSort({ column }) {
-  if (!column.getCanSort())
-    return void 0;
+  if (!column.getCanSort()) return void 0;
   switch (column.getIsSorted()) {
     case "asc":
       return "ascending";
@@ -3113,29 +3111,22 @@ function enableOrUndefined(enabled, value) {
 }
 function getColumnHeader(column) {
   const columnHeader = column.columnDef.header;
-  if (!columnHeader)
-    return column.id;
+  if (!columnHeader) return column.id;
   return typeof columnHeader === "string" ? columnHeader : column.id;
 }
 function prependSelectColumnIfEnabled(columns, config) {
-  if (!config)
-    return columns;
-  if (!Boolean(config == null ? void 0 : config.mode))
-    return columns;
+  if (!config) return columns;
+  if (!Boolean(config == null ? void 0 : config.mode)) return columns;
   return prependSelectColumn(columns, config);
 }
 function prependSelectColumn(columns, config) {
-  if (!(config == null ? void 0 : config.selectColumn))
-    return columns;
-  if (config.selectColumn === "default")
-    return [SelectColumnDef(config), ...columns];
+  if (!(config == null ? void 0 : config.selectColumn)) return columns;
+  if (config.selectColumn === "default") return [SelectColumnDef(config), ...columns];
   return [config.selectColumn(), ...columns];
 }
 function getFunctionValueOrDefault(valueOrFn, fnProps, defaultValue) {
-  if (valueOrFn === void 0)
-    return defaultValue;
-  if (typeof valueOrFn === "function")
-    return valueOrFn(fnProps);
+  if (valueOrFn === void 0) return defaultValue;
+  if (typeof valueOrFn === "function") return valueOrFn(fnProps);
   return valueOrFn;
 }
 
@@ -3308,8 +3299,7 @@ var StyledTableRow = (0, import_styled_components13.default)(import_eds_core_rea
   ${({ active }) => active ? "" : "background-color: inherit;"}
 `;
 function handleRowEvent(row, handler) {
-  if (!handler)
-    return void 0;
+  if (!handler) return void 0;
   return () => {
     handler(row);
   };
@@ -3452,8 +3442,7 @@ var import_react_virtual = require("@tanstack/react-virtual");
 var import_eds_core_react18 = require("@equinor/eds-core-react");
 var import_jsx_runtime18 = require("react/jsx-runtime");
 var PaddingRow = (props) => {
-  if (!props.height)
-    return null;
+  if (!props.height) return null;
   return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_eds_core_react18.Table.Row, { style: { pointerEvents: "none" }, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_eds_core_react18.Table.Cell, { style: { height: `${props.height}px` } }) });
 };
 
@@ -3512,10 +3501,8 @@ var import_react5 = require("react");
 function useFetchMoreOnBottomReached(tableContainerRef, infiniteScrollConfig) {
   const fetchMoreOnBottomReached = (0, import_react5.useCallback)(
     (tableContainer) => {
-      if (!infiniteScrollConfig)
-        return;
-      if (!tableContainer)
-        return;
+      if (!infiniteScrollConfig) return;
+      if (!tableContainer) return;
       const { onBottomScroll, offset = 300 } = infiniteScrollConfig;
       const { scrollHeight, scrollTop, clientHeight } = tableContainer;
       if (scrollHeight - scrollTop - clientHeight < offset) {
@@ -3529,8 +3516,7 @@ function useFetchMoreOnBottomReached(tableContainerRef, infiniteScrollConfig) {
     [fetchMoreOnBottomReached]
   );
   (0, import_react5.useEffect)(() => {
-    if (!infiniteScrollConfig)
-      return;
+    if (!infiniteScrollConfig) return;
     fetchMoreOnBottomReached(tableContainerRef.current);
   }, [fetchMoreOnBottomReached]);
   return onTableContainerScroll;
@@ -3546,14 +3532,11 @@ function useForceRerender() {
 // src/DataTable/DataTable.tsx
 var import_jsx_runtime20 = require("react/jsx-runtime");
 function canUseContainStrict(height) {
-  if (!height)
-    return false;
+  if (!height) return false;
   const heightIsANumber = !isNaN(Number(height)) && !isNaN(parseFloat(height));
-  if (heightIsANumber)
-    return false;
+  if (heightIsANumber) return false;
   const heightIsPercentage = height.endsWith("%");
-  if (heightIsPercentage)
-    return false;
+  if (heightIsPercentage) return false;
   return true;
 }
 var DataTableWrapper = import_styled_components16.default.div`
@@ -3674,8 +3657,7 @@ function DataTable(props) {
   );
   const forceRerender = useForceRerender();
   (0, import_react7.useEffect)(() => {
-    if (Boolean(tableContainerRef.current))
-      forceRerender();
+    if (Boolean(tableContainerRef.current)) forceRerender();
   }, [tableContainerRef.current === null]);
   return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(DataTableWrapper, { height: props == null ? void 0 : props.height, width: props == null ? void 0 : props.width, tableLayout: props == null ? void 0 : props.tableLayout, children: [
     props.bannerConfig && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
@@ -3879,8 +3861,7 @@ function EditableDateCell(_a) {
     },
     [rawValue, dateStringFormatter]
   );
-  if (!editMode)
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TypographyCustom, { truncate: true, children: formattedValue });
+  if (!editMode) return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TypographyCustom, { truncate: true, children: formattedValue });
   return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     import_react_hook_form3.Controller,
     {
@@ -3995,8 +3976,7 @@ function EditableDropdownSingleCell(_a) {
     "onChange"
   ]);
   const editMode = useEditMode();
-  if (!editMode)
-    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(TypographyCustom, { truncate: true, children: context.getValue() });
+  if (!editMode) return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(TypographyCustom, { truncate: true, children: context.getValue() });
   return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     import_react_hook_form4.Controller,
     {
@@ -4045,8 +4025,7 @@ function EditableNumberCell(_a) {
     "error"
   ]);
   const editMode = useEditMode();
-  if (!editMode)
-    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(TypographyCustom, { truncate: true, children: context.getValue() });
+  if (!editMode) return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(TypographyCustom, { truncate: true, children: context.getValue() });
   return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     import_react_hook_form5.Controller,
     {
@@ -4232,8 +4211,7 @@ function EditableTextFieldCell(_a) {
     "error"
   ]);
   const editMode = useEditMode();
-  if (!editMode)
-    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(TypographyCustom, { truncate: true, children: context.getValue() });
+  if (!editMode) return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(TypographyCustom, { truncate: true, children: context.getValue() });
   return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
     import_react_hook_form7.Controller,
     {

package/dist/index.mjs

@@ -2807,8 +2807,7 @@ var HeaderDiv = styled6.div`
 `;
 function HeaderContent({ header, table }) {
   var _a;
-  if (header.isPlaceholder)
-    return null;
+  if (header.isPlaceholder) return null;
   return /* @__PURE__ */ jsxs3(HeaderDiv, { children: [
     flexRender2(header.column.columnDef.header, header.getContext()),
     (_a = {
@@ -2831,8 +2830,7 @@ function HeaderContent({ header, table }) {
   ] });
 }
 function getSort({ column }) {
-  if (!column.getCanSort())
-    return void 0;
+  if (!column.getCanSort()) return void 0;
   switch (column.getIsSorted()) {
     case "asc":
       return "ascending";
@@ -3060,29 +3058,22 @@ function enableOrUndefined(enabled, value) {
 }
 function getColumnHeader(column) {
   const columnHeader = column.columnDef.header;
-  if (!columnHeader)
-    return column.id;
+  if (!columnHeader) return column.id;
   return typeof columnHeader === "string" ? columnHeader : column.id;
 }
 function prependSelectColumnIfEnabled(columns, config) {
-  if (!config)
-    return columns;
-  if (!Boolean(config == null ? void 0 : config.mode))
-    return columns;
+  if (!config) return columns;
+  if (!Boolean(config == null ? void 0 : config.mode)) return columns;
   return prependSelectColumn(columns, config);
 }
 function prependSelectColumn(columns, config) {
-  if (!(config == null ? void 0 : config.selectColumn))
-    return columns;
-  if (config.selectColumn === "default")
-    return [SelectColumnDef(config), ...columns];
+  if (!(config == null ? void 0 : config.selectColumn)) return columns;
+  if (config.selectColumn === "default") return [SelectColumnDef(config), ...columns];
   return [config.selectColumn(), ...columns];
 }
 function getFunctionValueOrDefault(valueOrFn, fnProps, defaultValue) {
-  if (valueOrFn === void 0)
-    return defaultValue;
-  if (typeof valueOrFn === "function")
-    return valueOrFn(fnProps);
+  if (valueOrFn === void 0) return defaultValue;
+  if (typeof valueOrFn === "function") return valueOrFn(fnProps);
   return valueOrFn;
 }
 
@@ -3261,8 +3252,7 @@ var StyledTableRow = styled13(Table6.Row)`
   ${({ active }) => active ? "" : "background-color: inherit;"}
 `;
 function handleRowEvent(row, handler) {
-  if (!handler)
-    return void 0;
+  if (!handler) return void 0;
   return () => {
     handler(row);
   };
@@ -3405,8 +3395,7 @@ import { useVirtualizer } from "@tanstack/react-virtual";
 import { Table as Table7 } from "@equinor/eds-core-react";
 import { jsx as jsx18 } from "react/jsx-runtime";
 var PaddingRow = (props) => {
-  if (!props.height)
-    return null;
+  if (!props.height) return null;
   return /* @__PURE__ */ jsx18(Table7.Row, { style: { pointerEvents: "none" }, children: /* @__PURE__ */ jsx18(Table7.Cell, { style: { height: `${props.height}px` } }) });
 };
 
@@ -3465,10 +3454,8 @@ import { useCallback, useEffect as useEffect2 } from "react";
 function useFetchMoreOnBottomReached(tableContainerRef, infiniteScrollConfig) {
   const fetchMoreOnBottomReached = useCallback(
     (tableContainer) => {
-      if (!infiniteScrollConfig)
-        return;
-      if (!tableContainer)
-        return;
+      if (!infiniteScrollConfig) return;
+      if (!tableContainer) return;
       const { onBottomScroll, offset = 300 } = infiniteScrollConfig;
       const { scrollHeight, scrollTop, clientHeight } = tableContainer;
       if (scrollHeight - scrollTop - clientHeight < offset) {
@@ -3482,8 +3469,7 @@ function useFetchMoreOnBottomReached(tableContainerRef, infiniteScrollConfig) {
     [fetchMoreOnBottomReached]
   );
   useEffect2(() => {
-    if (!infiniteScrollConfig)
-      return;
+    if (!infiniteScrollConfig) return;
     fetchMoreOnBottomReached(tableContainerRef.current);
   }, [fetchMoreOnBottomReached]);
   return onTableContainerScroll;
@@ -3499,14 +3485,11 @@ function useForceRerender() {
 // src/DataTable/DataTable.tsx
 import { jsx as jsx20, jsxs as jsxs11 } from "react/jsx-runtime";
 function canUseContainStrict(height) {
-  if (!height)
-    return false;
+  if (!height) return false;
   const heightIsANumber = !isNaN(Number(height)) && !isNaN(parseFloat(height));
-  if (heightIsANumber)
-    return false;
+  if (heightIsANumber) return false;
   const heightIsPercentage = height.endsWith("%");
-  if (heightIsPercentage)
-    return false;
+  if (heightIsPercentage) return false;
   return true;
 }
 var DataTableWrapper = styled16.div`
@@ -3627,8 +3610,7 @@ function DataTable(props) {
   );
   const forceRerender = useForceRerender();
   useEffect3(() => {
-    if (Boolean(tableContainerRef.current))
-      forceRerender();
+    if (Boolean(tableContainerRef.current)) forceRerender();
   }, [tableContainerRef.current === null]);
   return /* @__PURE__ */ jsxs11(DataTableWrapper, { height: props == null ? void 0 : props.height, width: props == null ? void 0 : props.width, tableLayout: props == null ? void 0 : props.tableLayout, children: [
     props.bannerConfig && /* @__PURE__ */ jsx20(
@@ -3832,8 +3814,7 @@ function EditableDateCell(_a) {
     },
     [rawValue, dateStringFormatter]
   );
-  if (!editMode)
-    return /* @__PURE__ */ jsx23(TypographyCustom, { truncate: true, children: formattedValue });
+  if (!editMode) return /* @__PURE__ */ jsx23(TypographyCustom, { truncate: true, children: formattedValue });
   return /* @__PURE__ */ jsx23(
     Controller2,
     {
@@ -3948,8 +3929,7 @@ function EditableDropdownSingleCell(_a) {
     "onChange"
   ]);
   const editMode = useEditMode();
-  if (!editMode)
-    return /* @__PURE__ */ jsx25(TypographyCustom, { truncate: true, children: context.getValue() });
+  if (!editMode) return /* @__PURE__ */ jsx25(TypographyCustom, { truncate: true, children: context.getValue() });
   return /* @__PURE__ */ jsx25(
     Controller3,
     {
@@ -3998,8 +3978,7 @@ function EditableNumberCell(_a) {
     "error"
   ]);
   const editMode = useEditMode();
-  if (!editMode)
-    return /* @__PURE__ */ jsx26(TypographyCustom, { truncate: true, children: context.getValue() });
+  if (!editMode) return /* @__PURE__ */ jsx26(TypographyCustom, { truncate: true, children: context.getValue() });
   return /* @__PURE__ */ jsx26(
     Controller4,
     {
@@ -4185,8 +4164,7 @@ function EditableTextFieldCell(_a) {
     "error"
   ]);
   const editMode = useEditMode();
-  if (!editMode)
-    return /* @__PURE__ */ jsx28(TypographyCustom, { truncate: true, children: context.getValue() });
+  if (!editMode) return /* @__PURE__ */ jsx28(TypographyCustom, { truncate: true, children: context.getValue() });
   return /* @__PURE__ */ jsx28(
     Controller6,
     {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@equinor/apollo-components",
-  "version": "3.7.1",
+  "version": "3.7.3",
   "license": "MIT",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
@@ -17,36 +17,42 @@
     "storybook": "storybook dev"
   },
   "dependencies": {
-    "@equinor/eds-icons": "^0.19.1",
-    "@equinor/eds-tokens": "^0.9.1",
-    "@tanstack/match-sorter-utils": "^8.8.4",
-    "@tanstack/react-table": "^8.9.8",
-    "@tanstack/react-virtual": "^3.0.0-beta.54",
-    "tsup": "^8.0.1",
-    "type-fest": "^3.11.0"
+    "@equinor/eds-icons": "^0.21.0",
+    "@equinor/eds-tokens": "^0.9.2",
+    "@tanstack/match-sorter-utils": "^8.15.1",
+    "@tanstack/react-table": "^8.17.3",
+    "@tanstack/react-virtual": "^3.7.0"
+  },
+  "devDependencies": {
+    "@equinor/eds-core-react": "^0.40.0",
+    "@storybook/addon-essentials": "^8.1.11",
+    "@storybook/addon-interactions": "^8.1.11",
+    "@storybook/addon-links": "^8.1.11",
+    "@storybook/react": "^8.1.11",
+    "@storybook/react-vite": "^8.1.11",
+    "@storybook/testing-library": "^0.2.2",
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0",
+    "@types/styled-components": "^5.1.34",
+    "eslint": "^8.56.0",
+    "eslint-config-custom": "*",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-hook-form": "^7.43.8",
+    "storybook": "^8.1.11",
+    "styled-components": "^6.1.11",
+    "tsconfig": "*",
+    "tsup": "^8.1.0",
+    "type-fest": "^4.20.1",
+    "typescript": "^5.5.2"
   },
   "peerDependencies": {
     "@equinor/eds-core-react": "^0.35.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-hook-form": "^7.43.8",
-    "styled-components": "^5.3.11"
-  },
-  "devDependencies": {
-    "@storybook/addon-essentials": "^7.0.0-alpha.38",
-    "@storybook/addon-interactions": "^7.0.0-alpha.38",
-    "@storybook/addon-links": "^7.0.0-alpha.38",
-    "@storybook/react": "^7.0.0-alpha.38",
-    "@storybook/react-vite": "^7.0.0-alpha.38",
-    "@storybook/testing-library": "^0.0.13",
-    "@types/react": "^18.0.1",
-    "@types/react-dom": "^18.0.1",
-    "@types/styled-components": "^5.1.26",
-    "eslint": "^8.56.0",
-    "eslint-config-custom": "*",
-    "storybook": "^7.0.0-alpha.38",
-    "tsconfig": "*",
-    "typescript": "^5.2.2"
+    "styled-components": "^5.3.11",
+    "type-fest": "^3.11.0"
   },
   "publishConfig": {
     "access": "public"