uikit-react-public 0.17.4 → 0.21.8

package/dist/components/Link/BaseLink.d.ts

@@ -1,10 +1,19 @@
-import { default as React, AnchorHTMLAttributes, ElementType } from 'react';
-export interface BaseLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
-    component?: ElementType;
+import { default as React, ComponentPropsWithoutRef, ElementType } from 'react';
+type BaseLinkOwnProps = {
     size?: 'small' | 'default';
     noVisited?: boolean;
     disabled?: boolean;
     testId?: string;
-}
-declare const BaseLink: React.ForwardRefExoticComponent<BaseLinkProps & React.RefAttributes<HTMLAnchorElement>>;
+    className?: string;
+    children?: React.ReactNode;
+    to?: string;
+};
+type PolymorphicRef<C extends ElementType> = React.ComponentPropsWithRef<C>['ref'];
+export type BaseLinkProps<C extends ElementType = 'a'> = BaseLinkOwnProps & {
+    component?: C;
+} & Omit<ComponentPropsWithoutRef<C>, keyof BaseLinkOwnProps | 'component' | 'disabled'>;
+type BaseLinkComponent = <C extends ElementType = 'a'>(props: BaseLinkProps<C> & {
+    ref?: PolymorphicRef<C>;
+}) => React.JSX.Element;
+declare const BaseLink: BaseLinkComponent;
 export default BaseLink;

package/dist/components/Link/Link.d.ts

@@ -1,6 +1,11 @@
+import { default as React, ComponentPropsWithoutRef, ElementType } from 'react';
 import { BaseLinkProps } from './BaseLink';
-export interface LinkProps extends BaseLinkProps {
+type LinkOwnProps = {
     variant?: 'primary' | 'secondary';
-}
-declare const Link: import('react').ForwardRefExoticComponent<LinkProps & import('react').RefAttributes<HTMLAnchorElement>>;
+};
+export type LinkProps<C extends ElementType = 'a'> = LinkOwnProps & BaseLinkProps<C> & Omit<ComponentPropsWithoutRef<C>, keyof LinkOwnProps>;
+type LinkComponent = <C extends ElementType = 'a'>(props: LinkProps<C> & {
+    ref?: React.ComponentPropsWithRef<C>['ref'];
+}) => React.JSX.Element;
+declare const Link: LinkComponent;
 export default Link;

package/dist/components/Link/Link.stories.d.ts

@@ -1,7 +1,9 @@
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: import('react').ForwardRefExoticComponent<import('./Link').LinkProps & import('react').RefAttributes<HTMLAnchorElement>>;
+    component: <C extends import('react').ElementType = "a">(props: import('./Link').LinkProps<C> & {
+        ref?: React.ComponentPropsWithRef<C>["ref"];
+    }) => React.JSX.Element;
     args: {
         children: string;
         href: string;

package/dist/components/MenuNew/Menu.context.d.ts

@@ -0,0 +1,14 @@
+import { default as React } from 'react';
+interface IContext {
+    isOpen: boolean;
+    toggleMenu: () => void;
+    triggerRef: React.RefObject<HTMLButtonElement | null>;
+    contentRef: React.RefObject<HTMLDivElement | null>;
+}
+export declare const AppMenuContext: React.Context<IContext>;
+export declare const useAppMenu: () => IContext;
+declare const MenuProvider: ({ defaultOpen, children, }: {
+    defaultOpen?: boolean;
+    children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export default MenuProvider;

package/dist/components/MenuNew/Menu.d.ts

@@ -0,0 +1,20 @@
+import { HTMLAttributes } from 'react';
+import { default as MenuItem } from './MenuItem';
+import { default as MenuSection } from './MenuSection';
+import { ButtonMenuTriggerProps } from './trigger/ButtonMenuTrigger';
+export declare const NAME = "ucl-uikit-menu";
+export interface MenuProps extends HTMLAttributes<HTMLDivElement> {
+    defaultOpen?: boolean;
+    title?: string;
+    menuId?: string;
+    position?: 'left' | 'right';
+    trigger?: React.ComponentType<ButtonMenuTriggerProps>;
+    testId?: string;
+}
+export interface IMenuSubComponents {
+    Section: typeof MenuSection;
+    Item: typeof MenuItem;
+}
+declare const MemoMenu: import('react').MemoExoticComponent<({ defaultOpen, title, position, trigger, menuId, testId, children, className, ...props }: MenuProps) => import("react/jsx-runtime").JSX.Element>;
+declare const MenuWithSubComponents: typeof MemoMenu & IMenuSubComponents;
+export default MenuWithSubComponents;

package/dist/components/MenuNew/MenuContent.d.ts

@@ -0,0 +1,9 @@
+import { default as React, HTMLAttributes } from 'react';
+export declare const NAME = "ucl-uikit-menu__content";
+export interface MenuContentProps extends HTMLAttributes<HTMLUListElement> {
+    title?: string;
+    testId?: string;
+    position?: 'left' | 'right';
+}
+declare const _default: React.NamedExoticComponent<MenuContentProps>;
+export default _default;

package/dist/components/MenuNew/MenuItem.d.ts

@@ -0,0 +1,10 @@
+import { default as React, LiHTMLAttributes } from 'react';
+export declare const NAME = "ucl-uikit-menu__item";
+export interface MenuItemProps extends LiHTMLAttributes<HTMLLIElement> {
+    testId?: string;
+    icon?: React.ReactNode;
+    secondary?: boolean;
+    externalLink?: boolean;
+}
+declare const _default: React.NamedExoticComponent<MenuItemProps>;
+export default _default;

package/dist/components/MenuNew/MenuSection.d.ts

@@ -0,0 +1,7 @@
+import { default as React, HTMLAttributes } from 'react';
+export declare const NAME = "ucl-uikit-menu__section";
+export interface MenuSectionProps extends HTMLAttributes<HTMLLIElement> {
+    testId?: string;
+}
+declare const MenuSection: React.FC<MenuSectionProps>;
+export default MenuSection;

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

@@ -0,0 +1,6 @@
+export { default } from './Menu';
+export type { MenuProps } from './Menu';
+export { default as MenuContent } from './MenuContent';
+export type { MenuContentProps } from './MenuContent';
+export { default as ButtonMenuTrigger } from './trigger/ButtonMenuTrigger';
+export type { ButtonMenuTriggerProps } from './trigger/ButtonMenuTrigger';

package/dist/components/MenuNew/trigger/ButtonMenuTrigger.d.ts

@@ -0,0 +1,8 @@
+import { IconButtonProps } from '../../IconButton';
+export declare const NAME = "ucl-uikit-menu__trigger--button";
+export declare const DEFAULT_ARIA_LABEL = "Menu button";
+export interface ButtonMenuTriggerProps extends IconButtonProps {
+    ariaLabel?: string;
+}
+declare const _default: import('react').MemoExoticComponent<({ id, ariaLabel, className, ...props }: ButtonMenuTriggerProps) => import("react/jsx-runtime").JSX.Element>;
+export default _default;

package/dist/components/MenuNew/trigger/IconMenuTrigger.d.ts

@@ -0,0 +1,8 @@
+import { IconButtonProps } from '../../IconButton';
+export declare const NAME = "ucl-uikit-menu__trigger--icon";
+export declare const DEFAULT_ARIA_LABEL = "Menu button";
+export interface IconMenuTriggerProps extends IconButtonProps {
+    ariaLabel?: string;
+}
+declare const _default: import('react').MemoExoticComponent<({ id, ariaLabel, className, ...props }: IconMenuTriggerProps) => import("react/jsx-runtime").JSX.Element>;
+export default _default;

package/dist/components/Overlay/Overlay.stories.d.ts

@@ -96,7 +96,7 @@ declare const meta: {
         results?: number | undefined | undefined;
         security?: string | undefined | undefined;
         unselectable?: "on" | "off" | undefined | undefined;
-        popover?: "" | "auto" | "manual" | undefined | undefined;
+        popover?: "" | "auto" | "manual" | "hint" | undefined | undefined;
         popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
         popoverTarget?: string | undefined | undefined;
         inert?: boolean | undefined | undefined;
@@ -177,18 +177,18 @@ declare const meta: {
         onFocusCapture?: import('react').FocusEventHandler<HTMLDivElement> | undefined;
         onBlur?: import('react').FocusEventHandler<HTMLDivElement> | undefined;
         onBlurCapture?: import('react').FocusEventHandler<HTMLDivElement> | undefined;
-        onChange?: import('react').FormEventHandler<HTMLDivElement> | undefined;
-        onChangeCapture?: import('react').FormEventHandler<HTMLDivElement> | undefined;
+        onChange?: import('react').ChangeEventHandler<HTMLDivElement, Element> | undefined;
+        onChangeCapture?: import('react').ChangeEventHandler<HTMLDivElement, Element> | undefined;
         onBeforeInput?: import('react').InputEventHandler<HTMLDivElement> | undefined;
-        onBeforeInputCapture?: import('react').FormEventHandler<HTMLDivElement> | undefined;
-        onInput?: import('react').FormEventHandler<HTMLDivElement> | undefined;
-        onInputCapture?: import('react').FormEventHandler<HTMLDivElement> | undefined;
-        onReset?: import('react').FormEventHandler<HTMLDivElement> | undefined;
-        onResetCapture?: import('react').FormEventHandler<HTMLDivElement> | undefined;
-        onSubmit?: import('react').FormEventHandler<HTMLDivElement> | undefined;
-        onSubmitCapture?: import('react').FormEventHandler<HTMLDivElement> | undefined;
-        onInvalid?: import('react').FormEventHandler<HTMLDivElement> | undefined;
-        onInvalidCapture?: import('react').FormEventHandler<HTMLDivElement> | undefined;
+        onBeforeInputCapture?: import('react').InputEventHandler<HTMLDivElement> | undefined;
+        onInput?: import('react').InputEventHandler<HTMLDivElement> | undefined;
+        onInputCapture?: import('react').InputEventHandler<HTMLDivElement> | undefined;
+        onReset?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onResetCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onSubmit?: import('react').SubmitEventHandler<HTMLDivElement> | undefined;
+        onSubmitCapture?: import('react').SubmitEventHandler<HTMLDivElement> | undefined;
+        onInvalid?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onInvalidCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
         onLoad?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
         onLoadCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
         onError?: import('react').ReactEventHandler<HTMLDivElement> | undefined;

package/dist/components/ParagraphNew/Paragraph.d.ts

@@ -0,0 +1,13 @@
+import { HTMLAttributes } from 'react';
+import { MarginProps } from '../common/marginsStyle';
+export declare const NAME = "ucl-uikit-paragrah";
+export type ParagraphLevel = 'lg' | 'lg-medium' | 'lg-semibold' | 'lg-bold' | 'md' | 'md-medium' | 'md-semibold' | 'md-semibold' | 'md-medium-numeric' | 'sm' | 'sm-medium' | 'sm-semibold' | 'xs' | 'xs-medium';
+export interface ParagraphBaseProps extends HTMLAttributes<HTMLParagraphElement> {
+    level?: ParagraphLevel;
+    as?: 'p' | 'div' | 'span';
+    testId?: string;
+    ref?: React.Ref<HTMLParagraphElement>;
+}
+export type ParagraphProps = ParagraphBaseProps & MarginProps;
+declare const _default: import('react').MemoExoticComponent<({ level, as, testId, className, ref, ...props }: ParagraphProps) => import("react/jsx-runtime").JSX.Element>;
+export default _default;

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

@@ -0,0 +1,4 @@
+export { default } from './Paragraph';
+export type { ParagraphProps } from './Paragraph';
+export { default as Text } from './Paragraph';
+export type { ParagraphProps as TextProps } from './Paragraph';

package/dist/components/Select/Select.d.ts

@@ -1,3 +1,4 @@
 import { SelectProps } from './Select.types';
-declare const Select: <T extends string | number = string>(props: SelectProps<T>) => import("react/jsx-runtime").JSX.Element;
+type SelectComponent = <T extends string | number = string>(props: SelectProps<T>) => React.JSX.Element;
+declare const Select: SelectComponent;
 export default Select;

package/dist/components/Select/Select.stories.d.ts

@@ -1,7 +1,7 @@
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: <T extends string | number = string>(props: import('./Select.types').SelectProps<T>) => import("react/jsx-runtime").JSX.Element;
+    component: <T extends string | number = string>(props: import('./Select.types').SelectProps<T>) => React.JSX.Element;
     argTypes: {
         selectionBehaviour: {
             description: string;
@@ -99,6 +99,17 @@ declare const meta: {
                 };
             };
         };
+        clearable: {
+            description: string;
+            control: {
+                type: "boolean";
+            };
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
         filterInputProps: {
             description: string;
             control: {
@@ -202,4 +213,5 @@ export declare const WithPlaceholder: Story;
 export declare const SingleLongOption: Story;
 export declare const ManyOptions: Story;
 export declare const filterable: Story;
+export declare const Clearable: Story;
 export declare const SelectionBehaviourCommit: Story;

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

@@ -26,10 +26,7 @@ export type OptionData<T> = {
  * Additional props forwarded to the filter input when `filterable` is true
  */
 export type FilterInputProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange' | 'disabled' | 'ref' | 'role' | 'aria-autocomplete' | 'aria-label'>;
-/**
- * Public props for <Select>, used by both custom and native render paths.
- */
-export interface SelectProps<T = string | number> extends Omit<React.HTMLAttributes<HTMLElement>, 'onChange'> {
+type SelectBaseProps<T = string | number> = Omit<React.HTMLAttributes<HTMLElement>, 'onChange'> & {
     /**
      * Controls keyboard selection behaviour in the custom select variant.
      * - `focus` (default): arrow keys move focus and commit value immediately.
@@ -72,10 +69,6 @@ export interface SelectProps<T = string | number> extends Omit<React.HTMLAttribu
      * Extra attributes forwarded to the native <select> when `native` is true
      */
     nativeHtmlAttributes?: React.SelectHTMLAttributes<HTMLSelectElement>;
-    /**
-     * Current value (controlled)
-     */
-    value?: T;
     /**
      * Disable interaction
      */
@@ -92,16 +85,49 @@ export interface SelectProps<T = string | number> extends Omit<React.HTMLAttribu
      * Custom className for the options panel
      */
     panelClassName?: string;
-    /**
-     * Change handler for the custom variant
-     */
-    onValueChange?: (value: T, ev: React.UIEvent) => void;
     /**
      * Ref forwarded to the rendered element
      * (div for custom, select for native)
      */
     ref?: React.Ref<HTMLDivElement | HTMLSelectElement | null>;
-}
+};
+export type NonClearableSelectProps<T = string | number> = SelectBaseProps<T> & {
+    /**
+     * Current value (controlled)
+     */
+    value?: T;
+    /**
+     * Show a clear action in the custom variant when a value is selected
+     */
+    clearable?: false | undefined;
+    /**
+     * Change handler for the custom variant
+     */
+    onValueChange?: (value: T, ev: React.SyntheticEvent) => void;
+};
+export type ClearableSelectProps<T = string | number> = SelectBaseProps<T> & {
+    /**
+     * Current value (controlled)
+     */
+    value?: T | null;
+    /**
+     * Show a clear action in the custom variant when a value is selected
+     */
+    clearable: true;
+    /**
+     * Change handler for the custom variant
+     */
+    onValueChange?: (value: T | null, ev: React.SyntheticEvent) => void;
+};
+/**
+ * Public props for <Select>, used by both custom and native render paths.
+ */
+export type SelectProps<T = string | number> = NonClearableSelectProps<T> | ClearableSelectProps<T>;
+export type InternalSelectProps<T = string | number> = SelectBaseProps<T> & {
+    value?: T | null;
+    clearable?: boolean;
+    onValueChange?: (value: T | null, ev: React.SyntheticEvent) => void;
+};
 /**
  * Each option as displayed in the Panel of <CustomSelect>
  * Roughly equivalent to a custom version of <option>
@@ -114,3 +140,4 @@ export interface CustomOptionProps<T> extends Omit<React.HTMLAttributes<HTMLDivE
     onSelect: (event: React.MouseEvent, value: T, optionIndex?: number) => void;
     lineBreak?: boolean;
 }
+export {};

package/dist/components/Select/subcomponents/CustomSelect.d.ts

@@ -1,4 +1,4 @@
-import { SelectProps } from '../Select.types';
-type CustomSelectProps<T> = Omit<SelectProps<T>, 'native' | 'nativeHtmlAttributes'>;
-declare const CustomSelect: <T extends string | number>({ selectionBehaviour, value, options, onValueChange, disabled, placeholder, lineBreak, filterInputProps, width, testId, className, panelClassName, filterable, ref, ...props }: CustomSelectProps<T>) => import("react/jsx-runtime").JSX.Element;
+import { InternalSelectProps } from '../Select.types';
+type CustomSelectProps<T> = Omit<InternalSelectProps<T>, 'native' | 'nativeHtmlAttributes'>;
+declare const CustomSelect: <T extends string | number>({ selectionBehaviour, value, options, onValueChange, disabled, clearable, placeholder, lineBreak, filterInputProps, width, testId, className, panelClassName, filterable, ref, ...props }: CustomSelectProps<T>) => import("react/jsx-runtime").JSX.Element;
 export default CustomSelect;

package/dist/components/Select/subcomponents/FilterInput.d.ts

@@ -2,6 +2,8 @@ import { FilterInputProps } from '../Select.types';
 type FilterInputComponentProps = {
     value: string;
     onChange: (value: string) => void;
+    onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
+    onTabOut?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
     placeholder?: string;
     disabled?: boolean;
     inputRef?: React.RefObject<HTMLInputElement | null>;
@@ -10,5 +12,5 @@ type FilterInputComponentProps = {
     ariaExpanded?: boolean;
     ariaActiveDescendant?: string;
 } & FilterInputProps;
-declare const FilterInput: ({ value, onChange, placeholder, disabled, inputRef, className, ariaControls, ariaExpanded, ariaActiveDescendant, ...rest }: FilterInputComponentProps) => import("react/jsx-runtime").JSX.Element;
+declare const FilterInput: ({ value, onChange, onBlur, onTabOut, placeholder, disabled, inputRef, className, ariaControls, ariaExpanded, ariaActiveDescendant, ...rest }: FilterInputComponentProps) => import("react/jsx-runtime").JSX.Element;
 export default FilterInput;

package/dist/components/Select/subcomponents/NativeSelect.d.ts

@@ -1,5 +1,5 @@
-import { SelectProps } from '../Select.types';
-type NativeSelectProps = Omit<React.SelectHTMLAttributes<HTMLSelectElement>, 'value' | 'defaultValue'> & Omit<SelectProps, 'native' | 'filterable' | 'nativeHtmlAttributes' | 'onValueChange' | 'ref'> & {
+import { InternalSelectProps } from '../Select.types';
+type NativeSelectProps = Omit<React.SelectHTMLAttributes<HTMLSelectElement>, 'value' | 'defaultValue'> & Omit<InternalSelectProps, 'native' | 'filterable' | 'nativeHtmlAttributes' | 'onValueChange' | 'ref'> & {
     value?: string | number;
     ref?: React.Ref<HTMLSelectElement>;
 };

package/dist/components/Select/subcomponents/VisibleField.d.ts

@@ -5,7 +5,10 @@ interface VisibleFieldProps<T> {
     selectedOption: OptionData<T> | null | undefined;
     placeholder?: string;
     filterable?: boolean;
+    clearable?: boolean;
+    onClear?: (event: React.MouseEvent | React.KeyboardEvent) => void;
+    clearButtonRef?: React.RefObject<HTMLButtonElement | null>;
     children?: React.ReactNode;
 }
-declare const VisibleField: <T extends string | number>({ selectedOption, isOpen, placeholder, disabled, filterable, children, }: VisibleFieldProps<T>) => import("react/jsx-runtime").JSX.Element;
+declare const VisibleField: <T extends string | number>({ selectedOption, isOpen, placeholder, disabled, filterable, clearable, onClear, clearButtonRef, children, }: VisibleFieldProps<T>) => import("react/jsx-runtime").JSX.Element;
 export default VisibleField;

package/dist/components/Spinner/Spinner.d.ts

@@ -2,7 +2,9 @@ import { SVGAttributes } from 'react';
 export declare const NAME = "ucl-uikit-spinner";
 export interface SpinnerProps extends SVGAttributes<SVGSVGElement> {
     size?: number;
+    strokeWidth?: number;
     testId?: string;
+    inheritColour?: boolean;
 }
 declare const _default: import('react').NamedExoticComponent<SpinnerProps & import('react').RefAttributes<SVGSVGElement>>;
 export default _default;

package/dist/components/StandaloneLink/StandaloneLink.d.ts

@@ -1,12 +1,15 @@
-import { ReactElement } from 'react';
+import { default as React, ComponentPropsWithoutRef, ElementType, ReactElement } from 'react';
 import { IconProps } from '../Icon';
 import { BaseLinkProps } from '../Link/BaseLink';
 import { MarginProps } from '../common/marginsStyle';
-export interface StandaloneLinkBaseProps extends BaseLinkProps {
+type StandaloneLinkOwnProps = {
     variant?: 'primary' | 'secondary' | 'tertiary';
     icon?: ReactElement<IconProps>;
     iconPosition?: 'left' | 'right';
-}
-export type StandaloneLinkProps = StandaloneLinkBaseProps & MarginProps;
-declare const StandaloneLink: import('react').ForwardRefExoticComponent<StandaloneLinkBaseProps & MarginProps & import('react').RefAttributes<HTMLAnchorElement>>;
+};
+export type StandaloneLinkProps<C extends ElementType = 'a'> = StandaloneLinkOwnProps & BaseLinkProps<C> & MarginProps & Omit<ComponentPropsWithoutRef<C>, keyof StandaloneLinkOwnProps>;
+type StandaloneLinkComponent = <C extends ElementType = 'a'>(props: StandaloneLinkProps<C> & {
+    ref?: React.ComponentPropsWithRef<C>['ref'];
+}) => React.JSX.Element;
+declare const StandaloneLink: StandaloneLinkComponent;
 export default StandaloneLink;

package/dist/components/StandaloneLink/StandaloneLink.stories.d.ts

@@ -1,7 +1,9 @@
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: import('react').ForwardRefExoticComponent<import('./StandaloneLink').StandaloneLinkBaseProps & import('../common/marginsStyle').MarginProps & import('react').RefAttributes<HTMLAnchorElement>>;
+    component: <C extends import('react').ElementType = "a">(props: import('./StandaloneLink').StandaloneLinkProps<C> & {
+        ref?: React.ComponentPropsWithRef<C>["ref"];
+    }) => React.JSX.Element;
     args: {
         children: string;
         href: string;

package/dist/components/Table/Table.d.ts

@@ -1,10 +1,10 @@
 import { TableProps } from './Table.types';
 declare const Table: {
-    ({ testId, className, children, ref, ...props }: TableProps): import("react/jsx-runtime").JSX.Element;
+    ({ testId, className, children, ref, ariaLabel, ...props }: TableProps): import("react/jsx-runtime").JSX.Element;
     Head: ({ className, children, ...props }: import('./subcomponents').TableHeadProps) => import("react/jsx-runtime").JSX.Element;
-    HeadCell: ({ variant, accessor, sort, onSortChange, showSortIcon, checked, onCheck, testId, className, children, ...props }: import('./subcomponents').TableHeadCellProps) => import("react/jsx-runtime").JSX.Element;
+    HeadCell: ({ variant, accessor, sort, onSortChange, showSortIcon, checked, onCheck, testId, className, children, checkboxAriaLabel, ...props }: import('./subcomponents').TableHeadCellProps) => import("react/jsx-runtime").JSX.Element;
     Body: ({ className, children, ...props }: import('./subcomponents').TableBodyProps) => import("react/jsx-runtime").JSX.Element;
     Row: ({ selected, className, children, ...props }: import('./subcomponents').TableRowProps) => import("react/jsx-runtime").JSX.Element;
-    Cell: ({ variant, icon, onCheck, checked, onButtonClick, testId, className, children, ...props }: import('./subcomponents').TableCellProps) => import("react/jsx-runtime").JSX.Element;
+    Cell: ({ variant, icon, onCheck, checked, onButtonClick, testId, className, children, checkboxProps, buttonProps, ...props }: import('./subcomponents').TableCellProps) => import("react/jsx-runtime").JSX.Element;
 };
 export default Table;

package/dist/components/Table/Table.stories.d.ts

@@ -2,12 +2,12 @@ import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
     component: {
-        ({ testId, className, children, ref, ...props }: import('./Table.types').TableProps): import("react/jsx-runtime").JSX.Element;
+        ({ testId, className, children, ref, ariaLabel, ...props }: import('./Table.types').TableProps): import("react/jsx-runtime").JSX.Element;
         Head: ({ className, children, ...props }: import('./subcomponents').TableHeadProps) => import("react/jsx-runtime").JSX.Element;
-        HeadCell: ({ variant, accessor, sort, onSortChange, showSortIcon, checked, onCheck, testId, className, children, ...props }: import('./subcomponents').TableHeadCellProps) => import("react/jsx-runtime").JSX.Element;
+        HeadCell: ({ variant, accessor, sort, onSortChange, showSortIcon, checked, onCheck, testId, className, children, checkboxAriaLabel, ...props }: import('./subcomponents').TableHeadCellProps) => import("react/jsx-runtime").JSX.Element;
         Body: ({ className, children, ...props }: import('./subcomponents').TableBodyProps) => import("react/jsx-runtime").JSX.Element;
         Row: ({ selected, className, children, ...props }: import('./subcomponents').TableRowProps) => import("react/jsx-runtime").JSX.Element;
-        Cell: ({ variant, icon, onCheck, checked, onButtonClick, testId, className, children, ...props }: import('./subcomponents').TableCellProps) => import("react/jsx-runtime").JSX.Element;
+        Cell: ({ variant, icon, onCheck, checked, onButtonClick, testId, className, children, checkboxProps, buttonProps, ...props }: import('./subcomponents').TableCellProps) => import("react/jsx-runtime").JSX.Element;
     };
     parameters: {
         layout: string;

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

@@ -8,4 +8,5 @@ export interface TableProps extends React.HTMLAttributes<HTMLTableElement> {
     testId?: string;
     className?: string;
     ref?: React.Ref<HTMLTableElement>;
+    ariaLabel?: string;
 }

package/dist/components/Table/subcomponents/Cell/Cell.d.ts

@@ -1,4 +1,6 @@
 import { ColumnVariant } from '../../Table.types';
+import { CheckboxProps } from '../../../Checkbox/Checkbox';
+import { ButtonProps } from '../../../Button';
 export interface TableCellProps extends React.HTMLAttributes<HTMLTableCellElement> {
     variant?: ColumnVariant;
     icon?: React.ReactNode;
@@ -7,6 +9,8 @@ export interface TableCellProps extends React.HTMLAttributes<HTMLTableCellElemen
     onButtonClick?: (event: React.UIEvent) => void;
     className?: string;
     testId?: string;
+    checkboxProps?: Omit<CheckboxProps, 'checked' | 'onChange'>;
+    buttonProps?: Omit<ButtonProps<'button'>, 'variant' | 'onClick' | 'className'>;
 }
-declare const Cell: ({ variant, icon, onCheck, checked, onButtonClick, testId, className, children, ...props }: TableCellProps) => import("react/jsx-runtime").JSX.Element;
+declare const Cell: ({ variant, icon, onCheck, checked, onButtonClick, testId, className, children, checkboxProps, buttonProps, ...props }: TableCellProps) => import("react/jsx-runtime").JSX.Element;
 export default Cell;

package/dist/components/Table/subcomponents/Cell/Cell.stories.d.ts

@@ -1,7 +1,7 @@
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: ({ variant, icon, onCheck, checked, onButtonClick, testId, className, children, ...props }: import('./Cell').TableCellProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ variant, icon, onCheck, checked, onButtonClick, testId, className, children, checkboxProps, buttonProps, ...props }: import('./Cell').TableCellProps) => import("react/jsx-runtime").JSX.Element;
     parameters: {
         layout: string;
     };
@@ -17,6 +17,8 @@ declare const meta: {
         onButtonClick?: ((event: React.UIEvent) => void) | undefined;
         className?: string | undefined;
         testId?: string | undefined;
+        checkboxProps?: Omit<import('../../..').CheckboxProps, "checked" | "onChange"> | undefined;
+        buttonProps?: Omit<import('../../..').ButtonProps<"button">, "variant" | "onClick" | "className"> | undefined;
         defaultChecked?: boolean | undefined | undefined;
         defaultValue?: string | number | readonly string[] | undefined;
         suppressContentEditableWarning?: boolean | undefined | undefined;
@@ -63,7 +65,7 @@ declare const meta: {
         results?: number | undefined | undefined;
         security?: string | undefined | undefined;
         unselectable?: "on" | "off" | undefined | undefined;
-        popover?: "" | "auto" | "manual" | undefined | undefined;
+        popover?: "" | "auto" | "manual" | "hint" | undefined | undefined;
         popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
         popoverTarget?: string | undefined | undefined;
         inert?: boolean | undefined | undefined;
@@ -144,18 +146,18 @@ declare const meta: {
         onFocusCapture?: import('react').FocusEventHandler<HTMLTableCellElement> | undefined;
         onBlur?: import('react').FocusEventHandler<HTMLTableCellElement> | undefined;
         onBlurCapture?: import('react').FocusEventHandler<HTMLTableCellElement> | undefined;
-        onChange?: import('react').FormEventHandler<HTMLTableCellElement> | undefined;
-        onChangeCapture?: import('react').FormEventHandler<HTMLTableCellElement> | undefined;
+        onChange?: import('react').ChangeEventHandler<HTMLTableCellElement, Element> | undefined;
+        onChangeCapture?: import('react').ChangeEventHandler<HTMLTableCellElement, Element> | undefined;
         onBeforeInput?: import('react').InputEventHandler<HTMLTableCellElement> | undefined;
-        onBeforeInputCapture?: import('react').FormEventHandler<HTMLTableCellElement> | undefined;
-        onInput?: import('react').FormEventHandler<HTMLTableCellElement> | undefined;
-        onInputCapture?: import('react').FormEventHandler<HTMLTableCellElement> | undefined;
-        onReset?: import('react').FormEventHandler<HTMLTableCellElement> | undefined;
-        onResetCapture?: import('react').FormEventHandler<HTMLTableCellElement> | undefined;
-        onSubmit?: import('react').FormEventHandler<HTMLTableCellElement> | undefined;
-        onSubmitCapture?: import('react').FormEventHandler<HTMLTableCellElement> | undefined;
-        onInvalid?: import('react').FormEventHandler<HTMLTableCellElement> | undefined;
-        onInvalidCapture?: import('react').FormEventHandler<HTMLTableCellElement> | undefined;
+        onBeforeInputCapture?: import('react').InputEventHandler<HTMLTableCellElement> | undefined;
+        onInput?: import('react').InputEventHandler<HTMLTableCellElement> | undefined;
+        onInputCapture?: import('react').InputEventHandler<HTMLTableCellElement> | undefined;
+        onReset?: import('react').ReactEventHandler<HTMLTableCellElement> | undefined;
+        onResetCapture?: import('react').ReactEventHandler<HTMLTableCellElement> | undefined;
+        onSubmit?: import('react').SubmitEventHandler<HTMLTableCellElement> | undefined;
+        onSubmitCapture?: import('react').SubmitEventHandler<HTMLTableCellElement> | undefined;
+        onInvalid?: import('react').ReactEventHandler<HTMLTableCellElement> | undefined;
+        onInvalidCapture?: import('react').ReactEventHandler<HTMLTableCellElement> | undefined;
         onLoad?: import('react').ReactEventHandler<HTMLTableCellElement> | undefined;
         onLoadCapture?: import('react').ReactEventHandler<HTMLTableCellElement> | undefined;
         onError?: import('react').ReactEventHandler<HTMLTableCellElement> | undefined;

package/dist/components/Table/subcomponents/Cell/CellContent.d.ts

@@ -1,10 +1,14 @@
+import { CheckboxProps } from '../../../Checkbox/Checkbox';
+import { ButtonProps } from '../../../Button';
 import { ColumnVariant } from '../../Table.types';
 interface CellContentProps extends React.HTMLAttributes<HTMLDivElement> {
     variant: ColumnVariant;
     icon?: React.ReactNode;
     checked?: boolean;
+    checkboxProps?: Omit<CheckboxProps, 'checked' | 'onChange'>;
+    buttonProps?: Omit<ButtonProps<'button'>, 'variant' | 'onClick' | 'className'>;
     handleCheckboxChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
     handleButtonClick: (event: React.UIEvent) => void;
 }
-declare const CellContent: ({ variant, icon, checked, handleCheckboxChange, handleButtonClick, children, }: CellContentProps) => import("react/jsx-runtime").JSX.Element;
+declare const CellContent: ({ variant, icon, checked, checkboxProps, buttonProps, handleCheckboxChange, handleButtonClick, children, }: CellContentProps) => import("react/jsx-runtime").JSX.Element;
 export default CellContent;

package/dist/components/Table/subcomponents/HeadCell/HeadCell.d.ts

@@ -8,6 +8,7 @@ export interface TableHeadCellProps extends React.HTMLAttributes<HTMLTableCellEl
     checked?: boolean;
     onCheck?: (checked: boolean, event: React.ChangeEvent<HTMLInputElement>) => void;
     testId?: string;
+    checkboxAriaLabel?: string;
 }
-declare const HeadCell: ({ variant, accessor, sort, onSortChange, showSortIcon, checked, onCheck, testId, className, children, ...props }: TableHeadCellProps) => import("react/jsx-runtime").JSX.Element;
+declare const HeadCell: ({ variant, accessor, sort, onSortChange, showSortIcon, checked, onCheck, testId, className, children, checkboxAriaLabel, ...props }: TableHeadCellProps) => import("react/jsx-runtime").JSX.Element;
 export default HeadCell;