@loadsmart/loadsmart-ui 8.0.5 → 8.0.6

package/dist/components/SideNavigation/Logo/Logo.d.ts

@@ -1,9 +1,10 @@
-import { default as React, PropsWithChildren } from 'react';
+import { default as React, ReactNode } from 'react';
 import { StyledComponent } from 'styled-components';
-export type LogoProps = PropsWithChildren<{
+export interface LogoProps {
     readonly url: string;
     readonly className?: string;
-}>;
+    readonly children?: ReactNode;
+}
 declare function Logo({ className, url, children }: LogoProps): React.JSX.Element;
 declare const _default: StyledComponent<typeof Logo, any, LogoProps, never>;
 export default _default;

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

@@ -1,4 +1,4 @@
-import { PropsWithChildren, default as React } from 'react';
+import { default as React, ReactNode } from 'react';
 import { MenuExpandableProps } from './MenuExpandable';
 import { MenuLinkProps } from './MenuLink';
 import { StyledComponentBase, StyledComponent } from 'styled-components';
@@ -9,7 +9,8 @@ export interface MenuProps extends React.HTMLAttributes<HTMLDivElement> {
 declare function Menu({ label, children, ...props }: MenuProps): React.JSX.Element;
 type MenuItemProps = {
     readonly active?: boolean;
-} & PropsWithChildren<MenuLinkProps & MenuExpandableProps>;
+    readonly children?: ReactNode;
+} & MenuLinkProps & MenuExpandableProps;
 declare function MenuItem(props: MenuItemProps): React.JSX.Element;
 declare const _default: string & StyledComponentBase<typeof Menu, any, {}, never> & NonReactStatics<typeof Menu, {}> & {
     Item: typeof MenuItem;

package/dist/components/SideNavigation/Menu/MenuBaseItem.d.ts

@@ -1,11 +1,11 @@
 import { default as React, ReactNode, HTMLAttributes } from 'react';
 import { MenuLinkProps } from './MenuLink';
-export type MenuBaseItemProps = HTMLAttributes<HTMLElement> & {
+export interface MenuBaseItemProps extends HTMLAttributes<HTMLElement> {
     readonly label: string;
     readonly leading?: ReactNode;
     readonly trailing?: ReactNode;
     readonly url?: string;
     readonly subItems?: MenuLinkProps[];
-};
+}
 declare function MenuBaseItem({ label, leading, trailing, ...props }: MenuBaseItemProps): React.JSX.Element;
 export default MenuBaseItem;

package/dist/components/SideNavigation/Menu/MenuExpandable.d.ts

@@ -1,6 +1,7 @@
-import { default as React, PropsWithChildren, HTMLAttributes } from 'react';
-export type MenuExpandableProps = HTMLAttributes<HTMLDivElement> & PropsWithChildren<{
+import { default as React, ReactNode, HTMLAttributes } from 'react';
+export interface MenuExpandableProps extends HTMLAttributes<HTMLDivElement> {
     readonly label: string;
-}>;
+    readonly children?: ReactNode;
+}
 declare function MenuExpandable({ label, children, ...props }: MenuExpandableProps): React.JSX.Element;
 export default MenuExpandable;

package/dist/components/SideNavigation/Menu/MenuLink.d.ts

@@ -1,11 +1,11 @@
 import { default as React, ReactNode } from 'react';
 import { StyledComponent } from 'styled-components';
-export type MenuLinkProps = React.HTMLAttributes<HTMLAnchorElement> & {
+export interface MenuLinkProps extends React.HTMLAttributes<HTMLAnchorElement> {
     readonly label: string;
     readonly leading?: ReactNode;
     readonly trailing?: ReactNode;
     readonly url?: string;
-};
+}
 declare function MenuLink({ url, ...props }: MenuLinkProps): React.JSX.Element;
 declare const _default: StyledComponent<typeof MenuLink, any, {}, never>;
 export default _default;

package/dist/components/SideNavigation/SideNavigation.d.ts

@@ -9,16 +9,8 @@ declare namespace SideNavigation {
     var Menu: string & import("styled-components").StyledComponentBase<({ label, children, ...props }: import("./Menu/Menu").MenuProps) => React.JSX.Element, any, {}, never> & import("hoist-non-react-statics").NonReactStatics<({ label, children, ...props }: import("./Menu/Menu").MenuProps) => React.JSX.Element, {}> & {
         Item: (props: {
             readonly active?: boolean;
-        } & React.HTMLAttributes<HTMLAnchorElement> & {
-            readonly label: string;
-            readonly leading?: ReactNode;
-            readonly trailing?: ReactNode;
-            readonly url?: string;
-        } & React.HTMLAttributes<HTMLDivElement> & {
-            readonly label: string;
-        } & {
-            children?: ReactNode | undefined;
-        }) => React.JSX.Element;
+            readonly children?: ReactNode;
+        } & import("./Menu/MenuLink").MenuLinkProps & import("./Menu/MenuExpandable").MenuExpandableProps) => React.JSX.Element;
         SubItem: import("styled-components").StyledComponent<({ url, ...props }: import("./Menu/MenuLink").MenuLinkProps) => React.JSX.Element, any, {}, never>;
     };
     var Separator: typeof import("./Separator").Separator;

package/dist/components/SideNavigation/useSideNavigation.d.ts

@@ -1,8 +1,8 @@
 export interface useSideNavigationProps {
-    open: boolean;
-    show: () => void;
-    hide: () => void;
-    toggle: () => void;
+    readonly open: boolean;
+    readonly show: () => void;
+    readonly hide: () => void;
+    readonly toggle: () => void;
 }
 declare function useSideNavigation(): useSideNavigationProps;
 export default useSideNavigation;

package/dist/components/Steps/ProgressSteps/ProgressStep.d.ts

@@ -1,8 +1,8 @@
 import { ReactNode, default as React } from 'react';
 import { Step } from '../Steps.types';
 export interface StepsProgressProps {
-    steps: Array<Step>;
-    current: number | string;
+    readonly steps: Array<Step>;
+    readonly current: number | string;
 }
 declare function ProgressStep(props: {
     readonly step: Step;

package/dist/components/Steps/Steps.d.ts

@@ -1,4 +1,4 @@
-import { default as React, PropsWithChildren } from 'react';
+import { default as React, ReactNode } from 'react';
 import { default as StepsStep } from './StepsStep';
 import { ColorScheme } from '../../utils/types/ColorScheme';
 import { Step } from './Steps.types';
@@ -8,8 +8,9 @@ export interface StepsProps {
     readonly steps: Array<Step>;
     readonly className?: string;
     readonly scheme?: ColorScheme;
+    readonly children?: ReactNode;
 }
-declare function Steps({ id, children, current, steps, ...others }: PropsWithChildren<StepsProps>): React.JSX.Element;
+declare function Steps({ id, children, current, steps, ...others }: StepsProps): React.JSX.Element;
 declare namespace Steps {
     var Step: typeof StepsStep;
 }

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

@@ -1,5 +1,5 @@
 export interface Step {
-    id: number | string;
-    label: string;
-    complete: boolean;
+    readonly id: number | string;
+    readonly label: string;
+    readonly complete: boolean;
 }

package/dist/components/Steps/StepsStep.d.ts

@@ -1,9 +1,10 @@
-import { default as React, PropsWithChildren } from 'react';
+import { default as React, ReactNode } from 'react';
 import { StyledComponent } from 'styled-components';
 export interface StepsStepProps {
     readonly id: number | string;
     readonly className?: string;
+    readonly children?: ReactNode;
 }
 export declare const StepWrapper: StyledComponent<"article", any, {}, never>;
-declare function StepsStep({ children, id, ...others }: PropsWithChildren<StepsStepProps>): React.JSX.Element;
+declare function StepsStep({ children, id, ...others }: StepsStepProps): React.JSX.Element;
 export default StepsStep;

package/dist/components/Steps/useSteps.d.ts

@@ -1,12 +1,12 @@
 import { Dispatch } from 'react';
 import { Step } from './Steps.types';
 export interface useStepsProps {
-    steps: Array<Step>;
-    current?: number | string;
+    readonly steps: Array<Step>;
+    readonly current?: number | string;
 }
 interface State {
-    current: number | string;
-    steps: Array<Step>;
+    readonly current: number | string;
+    readonly steps: Array<Step>;
 }
 type Action = {
     type: 'navigate';

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

@@ -1,12 +1,12 @@
-import { default as React, PropsWithChildren } from 'react';
+import { default as React, ReactNode } from 'react';
 import { Selectable, SelectableState } from '../../hooks/useSelectable';
 import { useSelectableProps } from '../../hooks/useSelectable/useSelectable.types';
-export type TableSelectableRow = Selectable & {
+export interface TableSelectableRow extends Selectable {
     value?: string | number | boolean;
-};
-export type TableSelectionSelectable<T extends Selectable = TableSelectableRow> = Omit<useSelectableProps<T>, 'onChange'> & {
+}
+export interface TableSelectionSelectable<T extends Selectable = TableSelectableRow> extends Omit<useSelectableProps<T>, 'onChange'> {
     onChange: (selected: T[]) => void;
-};
+}
 export type TableSelectionConfig<T extends Selectable = TableSelectableRow> = boolean | Partial<TableSelectionSelectable<T>>;
 export interface TableSelectionCore<T extends Selectable = TableSelectableRow> {
     selected?: SelectableState<T>;
@@ -18,10 +18,11 @@ export interface TableSelectionCore<T extends Selectable = TableSelectableRow> {
     register: (key?: T) => void;
 }
 export declare function useTableSelectionCore<T extends Selectable>(config?: TableSelectionConfig<T>): TableSelectionCore<T>;
-export declare const TableSelectionContext: React.Context<TableSelectionCore<any>>;
-type TableSelectionProviderProps = PropsWithChildren<{
+export declare const TableSelectionContext: React.Context<TableSelectionCore<TableSelectableRow>>;
+interface TableSelectionProviderProps {
     readonly selection?: TableSelectionConfig;
-}>;
+    readonly children?: ReactNode;
+}
 export declare function TableSelectionProvider({ children, selection }: TableSelectionProviderProps): React.JSX.Element;
 export declare function useTableSelection<T extends Selectable = TableSelectableRow>(): TableSelectionCore<T>;
 interface TableSelectionHook<T extends Selectable = TableSelectableRow> {

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

@@ -1,72 +1,73 @@
 import { Selectable } from '../../hooks/useSelectable';
-import { ComponentType, HTMLAttributes, PropsWithChildren, ReactNode } from 'react';
+import { ComponentType, HTMLAttributes, ReactNode } from 'react';
 import { DropdownMenuItemProps, DropdownMenuProps } from '../Dropdown';
 import { DropdownTriggerButtonProps } from '../Dropdown/DropdownTrigger';
 import { TableSelectableRow, TableSelectionConfig } from './Selection';
 type Scale = 'default' | 'small' | 'large';
 export interface TableProps<T extends Selectable = TableSelectableRow> extends HTMLAttributes<HTMLTableElement> {
-    scale?: Scale;
-    selection?: TableSelectionConfig<T>;
+    readonly scale?: Scale;
+    readonly selection?: TableSelectionConfig<T>;
 }
 export interface TableCaptionProps extends HTMLAttributes<HTMLTableCaptionElement> {
-    position?: 'top' | 'bottom';
-    height?: number;
+    readonly position?: 'top' | 'bottom';
+    readonly height?: number;
 }
 export interface TableSelectionProps extends HTMLAttributes<HTMLDivElement> {
-    buttons: ComponentType<{
+    readonly buttons: ComponentType<{
         values: TableSelectableRow[];
     }>[];
 }
 export interface SelectionCellProps<T extends TableSelectableRow = TableSelectableRow> extends Omit<HTMLAttributes<HTMLTableCellElement>, 'children'> {
-    value?: T;
-    children?: (props: {
+    readonly value?: T;
+    readonly children?: (props: {
         selected: boolean;
         toggle: () => void;
     }) => ReactNode;
 }
 export interface TableSectionProps extends HTMLAttributes<HTMLTableSectionElement> {
-    scale?: Scale;
+    readonly scale?: Scale;
 }
 export type TableRowProps = HTMLAttributes<HTMLTableRowElement>;
-export type ExpandableTableRowProps = TableRowProps & {
-    expandableContent?: ReactNode;
-    leading?: ReactNode | ((expanded: boolean) => ReactNode);
-    initialExpanded?: boolean;
-    expanded?: boolean;
-    onExpandedChange?: (expanded: boolean) => void;
-};
+export interface ExpandableTableRowProps extends TableRowProps {
+    readonly expandableContent?: ReactNode;
+    readonly leading?: ReactNode | ((expanded: boolean) => ReactNode);
+    readonly initialExpanded?: boolean;
+    readonly expanded?: boolean;
+    readonly onExpandedChange?: (expanded: boolean) => void;
+}
 export interface TableCellProps extends HTMLAttributes<HTMLTableCellElement> {
-    alignment?: 'left' | 'right';
-    format?: 'default' | 'number' | 'currency';
-    columnWidth?: string;
-    scale?: Scale;
-    selected?: boolean;
+    readonly alignment?: 'left' | 'right';
+    readonly format?: 'default' | 'number' | 'currency';
+    readonly columnWidth?: string;
+    readonly scale?: Scale;
+    readonly selected?: boolean;
 }
 export interface TableColumn<T = Record<string, unknown>> {
     /**
      * The accessor of you entry interface
      */
-    key: Exclude<keyof T, symbol>;
+    readonly key: Exclude<keyof T, symbol>;
     /**
      * The label that should go in the Header cell
      */
-    title: ReactNode;
+    readonly title: ReactNode;
     /**
      * The text of the Dropdown.Item
      * If omitted, `title` is used
      */
-    option?: string;
+    readonly option?: string;
 }
 export type TableColumns<T> = Array<TableColumn<T>>;
 export interface TablePickerItemProps<T> extends DropdownMenuItemProps {
-    option?: TableColumn<T>;
-    checked?: boolean;
+    readonly option?: TableColumn<T>;
+    readonly checked?: boolean;
 }
-export interface TablePickerProps<T> extends PropsWithChildren<Partial<Omit<DropdownTriggerButtonProps, 'onChange' | 'value' | 'children'>>> {
-    value?: TableColumn<T>;
-    onChange?: (value: TableColumn<T>) => void;
-    options?: TableColumns<T>;
-    trigger?: ReactNode | ((expanded: boolean) => ReactNode);
-    align?: DropdownMenuProps['align'];
+export interface TablePickerProps<T> extends Partial<Omit<DropdownTriggerButtonProps, 'onChange' | 'value' | 'children'>> {
+    readonly value?: TableColumn<T>;
+    readonly onChange?: (value: TableColumn<T>) => void;
+    readonly options?: TableColumns<T>;
+    readonly trigger?: ReactNode | ((expanded: boolean) => ReactNode);
+    readonly align?: DropdownMenuProps['align'];
+    readonly children?: ReactNode;
 }
 export {};

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

@@ -5,55 +5,55 @@ export interface TablePaginationProps extends GroupProps {
      * The pagination variant
      * @default 'default'
      */
-    variant?: 'compact' | 'default';
+    readonly variant?: 'compact' | 'default';
     /**
      * The total number of paginated items
      */
-    count: number;
+    readonly count: number;
     /**
      * Customize the rows per page label.
      * @default 'Rows per page:'
      */
-    labelRowsPerPage?: string;
+    readonly labelRowsPerPage?: string;
     /**
      * Callback fired when the page is changed.
      */
-    onPageChange: (page: number) => void;
+    readonly onPageChange: (page: number) => void;
     /**
      * Callback fired when the number of rows per page is changed.
      *
      * Note: Resetting the page to zero after the number of rows per page is changed isn't part of
      * the component and has to be implemented where it's necessary
      */
-    onRowsPerPageChange: (rowsPerPage: number) => void;
+    readonly onRowsPerPageChange: (rowsPerPage: number) => void;
     /**
      * The number of rows per page.
      * @default 50
      */
-    rowsPerPage?: number;
+    readonly rowsPerPage?: number;
     /**
      * The zero-based index of the current page.
      */
-    page: number;
+    readonly page: number;
     /**
      * Customizes the options of the rows per page select field.
      * @default [10, 25, 50, 100]
      */
-    rowsPerPageOptions?: number[];
+    readonly rowsPerPageOptions?: number[];
     /**
      * Disable all the pagination actions
      */
-    disabled?: boolean;
+    readonly disabled?: boolean;
     /**
      * Customizes the placement of the rows per page select field.
      * @default { position: 'bottom', align: 'start' }
      */
-    rowsPerPagePlacement?: PopoverPlacement;
+    readonly rowsPerPagePlacement?: PopoverPlacement;
+}
+export interface TablePaginationActionsProps extends Omit<TablePaginationProps, 'labelRowsPerPage' | 'onRowsPerPageChange' | 'rowsPerPageOptions' | 'rowsPerPage'> {
+    readonly rowsPerPage: number;
+}
+export interface RowsPerPageProps extends Omit<TablePaginationProps, 'rowsPerPageOptions' | 'onPageChange' | 'rowsPerPage' | 'align'>, PopoverPlacement {
+    readonly rowsPerPageOptions: number[];
+    readonly rowsPerPage: number;
 }
-export type TablePaginationActionsProps = Omit<TablePaginationProps, 'labelRowsPerPage' | 'onRowsPerPageChange' | 'rowsPerPageOptions' | 'rowsPerPage'> & {
-    rowsPerPage: number;
-};
-export type RowsPerPageProps = Omit<TablePaginationProps, 'rowsPerPageOptions' | 'onPageChange' | 'rowsPerPage' | 'align'> & PopoverPlacement & {
-    rowsPerPageOptions: number[];
-    rowsPerPage: number;
-};

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

@@ -1,6 +1,6 @@
 export interface WithDirectionProps {
-    direction?: 'horizontal' | 'vertical';
+    readonly direction?: 'horizontal' | 'vertical';
 }
 export interface WithActiveProps {
-    $active?: boolean;
+    readonly $active?: boolean;
 }

package/dist/components/Tooltip/Tooltip.d.ts

@@ -1,4 +1,4 @@
-import { default as React, PropsWithChildren, HTMLAttributes, ReactNode } from 'react';
+import { default as React, HTMLAttributes, ReactNode } from 'react';
 import { ColorScheme } from '../../utils/types/ColorScheme';
 import { PopoverAlign, PopoverPosition } from '../Popover';
 export declare enum TooltipPosition {
@@ -17,6 +17,7 @@ export interface TooltipProps extends HTMLAttributes<HTMLDivElement> {
     readonly scheme?: ColorScheme;
     readonly position?: TooltipPosition | PopoverPosition;
     readonly align?: TooltipAlign | PopoverAlign;
+    readonly children?: ReactNode;
 }
-declare function Tooltip({ children, message, scheme, position, align, ...rest }: PropsWithChildren<TooltipProps>): React.JSX.Element;
+declare function Tooltip({ children, message, scheme, position, align, ...rest }: TooltipProps): React.JSX.Element;
 export default Tooltip;

package/dist/components/TopNavigation/Logo/Logo.d.ts

@@ -1,9 +1,10 @@
-import { default as React, PropsWithChildren } from 'react';
+import { default as React, ReactNode } from 'react';
 import { StyledComponent } from 'styled-components';
-export type LogoProps = PropsWithChildren<{
+export interface LogoProps {
     readonly url: string;
     readonly className?: string;
-}>;
+    readonly children?: ReactNode;
+}
 declare function Logo({ url, className, children }: LogoProps): React.JSX.Element;
 declare const _default: StyledComponent<typeof Logo, any, LogoProps, never>;
 export default _default;

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

@@ -1,13 +1,15 @@
-import { default as React, PropsWithChildren, ReactNode, HTMLAttributes } from 'react';
+import { default as React, ReactNode, HTMLAttributes } from 'react';
 import { MenuDropdownSubItem } from './MenuItemDropdown';
-type MenuItemProps = HTMLAttributes<HTMLElement> & PropsWithChildren<{
+interface MenuItemProps extends HTMLAttributes<HTMLElement> {
     readonly label: string;
     readonly icon?: ReactNode;
     readonly url?: string;
-}>;
-export type MenuProps = PropsWithChildren<{
+    readonly children?: ReactNode;
+}
+export interface MenuProps {
     readonly align?: 'left' | 'right';
-}>;
+    readonly children?: ReactNode;
+}
 declare function MenuItem({ children, ...props }: MenuItemProps): React.JSX.Element;
 declare function Menu({ align, children }: MenuProps): React.JSX.Element;
 declare namespace Menu {

package/dist/components/TopNavigation/Menu/MenuItemDropdown.d.ts

@@ -1,17 +1,18 @@
-import { default as React, PropsWithChildren, ReactNode, HTMLAttributes } from 'react';
+import { default as React, ReactNode, HTMLAttributes } from 'react';
 import { StyledComponent } from 'styled-components';
 export declare const MenuDropdown: StyledComponent<any, any, any, any>;
 export declare const MenuDropdownSeparator: StyledComponent<"hr", any, {}, never>;
 export declare const MenuDropdownLabel: StyledComponent<"label", any, {}, never>;
-type MenuDropdownSubItemProps = HTMLAttributes<HTMLElement> & {
+interface MenuDropdownSubItemProps extends HTMLAttributes<HTMLElement> {
     readonly label: string;
     readonly url?: string;
     readonly icon?: ReactNode;
     readonly separator?: boolean;
-};
+}
 export declare function MenuDropdownSubItem({ icon, label, url, ...rest }: MenuDropdownSubItemProps): React.JSX.Element;
-export type MenuItemDropdownProps = PropsWithChildren<{
+export interface MenuItemDropdownProps {
     readonly label: string;
-}>;
+    readonly children?: ReactNode;
+}
 declare function MenuItemDropdown(props: MenuItemDropdownProps): React.JSX.Element;
 export { MenuItemDropdown };

package/dist/hooks/useFocusTrap/useFocusTrap.d.ts

@@ -1,8 +1,8 @@
 import { SupportedKey } from '../../utils/toolset/keyboard';
 export interface useFocusTrapProps {
-    onActivate?: () => void;
-    onDeactivate?: () => void;
-    keys?: SupportedKey[];
+    readonly onActivate?: () => void;
+    readonly onDeactivate?: () => void;
+    readonly keys?: readonly SupportedKey[];
 }
 /**
  * Custom hook that limits the focusable elements within a container, when activated.

package/dist/hooks/useFocusWithin/useFocusWithin.d.ts

@@ -1,7 +1,7 @@
 import { RefObject } from 'react';
 export interface useFocusWithinProps {
-    onFocus?: () => void;
-    onBlur?: () => void;
+    readonly onFocus?: () => void;
+    readonly onBlur?: () => void;
 }
 /**
  * As CSS's focus-within is not fully supported, this hook

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

@@ -39,8 +39,8 @@ export interface useSelectableReturn<T extends Selectable> {
     clear: () => void;
 }
 export interface useSelectableProps<T extends Selectable> {
-    selected: T | T[];
-    multiple?: boolean;
-    onChange?: (selected: SelectableState<T>) => void;
-    adapters?: Record<string, SelectableAdapter<T>>;
+    readonly selected: T | T[];
+    readonly multiple?: boolean;
+    readonly onChange?: (selected: SelectableState<T>) => void;
+    readonly adapters?: Record<string, SelectableAdapter<T>>;
 }

package/dist/index.js

@@ -5496,13 +5496,13 @@ function useDropdown({
     }
     setExpanded((isExpanded) => !isExpanded);
   }, [disabled, expandDisabled]);
-  const expand = useCallback(function toggle2() {
+  const expand = useCallback(function expand2() {
     if (disabled || expandDisabled) {
       return;
     }
     setExpanded(true);
   }, [disabled, expandDisabled]);
-  const collapse = useCallback(function toggle2() {
+  const collapse = useCallback(function collapse2() {
     if (disabled || expandDisabled) {
       return;
     }