dibk-design 10.1.0 → 10.3.2

package/dist/index.d.ts

@@ -23,7 +23,7 @@ declare interface AccordionProps {
 
 declare type ArrowDirection = "none" | "left" | "right";
 
-export declare const Button: ({ content, color, size, arrow, disabled, inputType, defaultChecked, hasErrors, noHover, rounded, noMargin, href, children, iconLeft, iconRight, className: classNameProp, ...rest }: ButtonProps) => JSX.Element;
+export declare const Button: ({ content, color, size, arrow, disabled, inputType, defaultChecked, hasErrors, noHover, noMargin, href, children, iconLeft, iconRight, className: classNameProp, ...rest }: ButtonProps) => JSX.Element;
 
 declare type ButtonColor = "primary" | "secondary" | "neutral";
 
@@ -39,7 +39,6 @@ declare interface ButtonProps extends Omit<default_2.ButtonHTMLAttributes<HTMLBu
     hasErrors?: boolean;
     "aria-describedby"?: string;
     noHover?: boolean;
-    rounded?: boolean;
     href?: string;
     noMargin?: boolean;
     children?: default_2.ReactNode;
@@ -50,7 +49,7 @@ declare interface ButtonProps extends Omit<default_2.ButtonHTMLAttributes<HTMLBu
 
 declare type ButtonSize = "small" | "regular";
 
-export declare const CheckBoxIcon: ({ size, checked, disabled, showBox, hasErrors, checkmarkCharacter, }: CheckBoxIconProps) => JSX.Element;
+export declare const CheckBoxIcon: ({ size, checked, disabled, showBox, hasErrors, checkmarkCharacter, checkmarkIconSrc, }: CheckBoxIconProps) => JSX.Element;
 
 declare interface CheckBoxIconProps {
     size?: string;
@@ -59,9 +58,10 @@ declare interface CheckBoxIconProps {
     showBox?: boolean;
     hasErrors?: boolean;
     checkmarkCharacter?: string;
+    checkmarkIconSrc?: string;
 }
 
-export declare const CheckBoxInput: ({ checked, disabled, required, requiredGroup, id, name, onChange, contentOnly, hasErrors, checkmarkCharacter, tabIndex, children, "aria-controls": ariaControls, "aria-describedby": ariaDescribedBy, value, }: CheckBoxInputProps) => JSX.Element;
+export declare const CheckBoxInput: ({ checked, disabled, required, requiredGroup, id, name, onChange, hasErrors, checkmarkCharacter, tabIndex, children, "aria-controls": ariaControls, "aria-describedby": ariaDescribedBy, value, }: CheckBoxInputProps) => JSX.Element;
 
 declare interface CheckBoxInputProps {
     checked?: boolean;
@@ -71,7 +71,6 @@ declare interface CheckBoxInputProps {
     id: string;
     name?: string;
     onChange?: (e: default_2.ChangeEvent<HTMLInputElement>) => void;
-    contentOnly?: boolean;
     hasErrors?: boolean;
     checkmarkCharacter?: string;
     "aria-controls"?: string;
@@ -83,7 +82,7 @@ declare interface CheckBoxInputProps {
 
 export declare const CheckBoxList: ({ legend, legendSize, required, compact, children, }: CheckBoxListProps) => JSX.Element;
 
-export declare const CheckBoxListItem: ({ checked, disabled, required, requiredGroup, id, name, onChange, contentOnly, compact, hasErrors, checkmarkCharacter, "aria-controls": ariaControls, "aria-describedby": ariaDescribedBy, children, value, }: CheckBoxListItemProps) => JSX.Element;
+export declare const CheckBoxListItem: ({ checked, disabled, required, requiredGroup, id, name, onChange, compact, hasErrors, checkmarkCharacter, "aria-controls": ariaControls, "aria-describedby": ariaDescribedBy, children, value, }: CheckBoxListItemProps) => JSX.Element;
 
 declare interface CheckBoxListItemProps {
     value?: string | number;
@@ -94,7 +93,6 @@ declare interface CheckBoxListItemProps {
     name?: string;
     id: string;
     onChange?: (e: default_2.ChangeEvent<HTMLInputElement>) => void;
-    contentOnly?: boolean;
     compact?: boolean;
     checkmarkCharacter?: string;
     hasErrors?: boolean;
@@ -118,14 +116,14 @@ declare interface ContainerProps {
     children?: default_2.ReactNode;
 }
 
-export declare const ContentBox: React.FC<ContentBoxProps>;
+export declare const ContentBox: ({ title, titleSize, content, children, color, href, }: ContentBoxProps) => JSX.Element;
 
 declare interface ContentBoxProps {
     title?: string;
-    titleSize?: 'regular' | 'large';
+    titleSize?: "regular" | "large";
     content?: string;
     children?: React.ReactNode;
-    color?: 'default' | 'secondary';
+    color?: "default" | "secondary";
     href?: string | null;
 }
 
@@ -156,12 +154,12 @@ declare interface DescriptionTermProps {
     children?: default_2.ReactNode;
 }
 
-export declare const Dialog: ({ maxWidth, noPadding, closeButton, onClickOutside, modal, attachTo, hidden, children, }: DialogProps) => ReactPortal | null;
+export declare const Dialog: ({ maxWidth, noPadding, title, onClickOutside, modal, attachTo, hidden, children, }: DialogProps) => ReactPortal | null;
 
 declare interface DialogProps {
     maxWidth?: string;
     noPadding?: boolean;
-    closeButton?: boolean;
+    title?: React.ReactNode;
     onClickOutside: () => void;
     modal?: boolean;
     attachTo?: "left" | "right" | "top" | "bottom" | string;
@@ -169,7 +167,7 @@ declare interface DialogProps {
     children?: React.ReactNode;
 }
 
-export declare const DragAndDropFileInput: ({ id, name, onSelectChange, onDragAndDropChange, label, contentOnly, buttonColor, buttonContent, buttonContentWhenSelectedFile, selectedFileName, defaultContent, hasErrors, errorMessage, required, children, "data-transaction-name": transactionName, }: DragAndDropFileInputProps) => JSX.Element;
+export declare const DragAndDropFileInput: ({ id, name, onSelectChange, onDragAndDropChange, label, subLabel, buttonContent, buttonContentWhenSelectedFile, selectedFileName, hasErrors, errorMessage, required, "data-transaction-name": transactionName, }: DragAndDropFileInputProps) => JSX.Element;
 
 declare interface DragAndDropFileInputProps {
     id: string;
@@ -177,16 +175,13 @@ declare interface DragAndDropFileInputProps {
     onSelectChange: (e: default_2.ChangeEvent<HTMLInputElement>) => void;
     onDragAndDropChange: (files: FileList) => void;
     label?: string | (string | JSX_2.Element)[];
-    contentOnly?: boolean;
-    buttonColor?: ButtonColor;
+    subLabel?: string | (string | JSX_2.Element)[];
     buttonContent?: string;
     buttonContentWhenSelectedFile?: string;
     selectedFileName?: string;
-    defaultContent?: string;
     hasErrors?: boolean;
     errorMessage?: string | (string | JSX_2.Element)[];
     required?: boolean;
-    children?: default_2.ReactNode;
     "data-transaction-name"?: string;
 }
 
@@ -209,26 +204,25 @@ declare interface FooterProps {
     children?: React.ReactNode;
 }
 
-export declare const Header: ({ id, content, size, big, label, htmlTag, htmlFor, children, }: HeaderProps) => JSX.Element;
+export declare const Header: ({ id, content, size, htmlTag, htmlFor, children, }: HeaderProps) => JSX.Element;
 
 declare interface HeaderProps {
     id?: string;
     content?: string;
     size?: 1 | 2 | 3 | 4 | 5;
-    big?: boolean;
-    label?: string;
     htmlTag?: keyof JSX_2.IntrinsicElements;
     htmlFor?: string;
     children?: default_2.ReactNode;
 }
 
-export declare const InfoBox: ({ title, children, variant, fullScreen, hideIcon, icon, className, }: InfoBoxProps) => JSX.Element;
+export declare const InfoBox: ({ title, children, variant, fullScreen, noBorder, hideIcon, icon, className, }: InfoBoxProps) => JSX.Element;
 
 declare interface InfoBoxProps {
     title?: default_2.ReactNode;
     children?: default_2.ReactNode;
     variant?: InfoBoxVariant;
     fullScreen?: boolean;
+    noBorder?: boolean;
     hideIcon?: boolean;
     icon?: default_2.ReactNode;
     className?: string;
@@ -236,7 +230,7 @@ declare interface InfoBoxProps {
 
 declare type InfoBoxVariant = "info" | "warning" | "error" | "tip" | "success";
 
-export declare const InputField: ({ id, onChange, onBlur, onFocus, name, type, disabled, required, readOnly, width, value, defaultValue, elementKey, label, contentOnly, buttonColor, buttonContent, selectedFileName, placeholder, defaultContent, min, max, role, "aria-describedby": ariaDescribedBy, "aria-autocomplete": ariaAutocomplete, hasErrors, errorMessage, noMargin, caption, }: InputFieldProps) => JSX.Element;
+export declare const InputField: ({ id, onChange, onBlur, onFocus, name, type, disabled, required, readOnly, width, value, defaultValue, elementKey, label, buttonColor, buttonContent, actionButtonContent, actionButtonIconLeft, actionButtonIconRight, actionButtonOnClick, actionButtonDisabled, actionButtonAriaLabel, selectedFileName, placeholder, min, max, role, "aria-describedby": ariaDescribedBy, "aria-autocomplete": ariaAutocomplete, hasErrors, errorMessage, noMargin, caption, }: InputFieldProps) => JSX.Element;
 
 declare interface InputFieldProps {
     id: string;
@@ -253,12 +247,16 @@ declare interface InputFieldProps {
     defaultValue?: string | number | Date;
     elementKey?: string;
     label?: default_2.ReactNode;
-    contentOnly?: boolean;
     buttonColor?: "primary" | "secondary";
     buttonContent?: string;
+    actionButtonContent?: default_2.ReactNode;
+    actionButtonIconLeft?: default_2.ReactNode;
+    actionButtonIconRight?: default_2.ReactNode;
+    actionButtonOnClick?: (event: default_2.MouseEvent<HTMLButtonElement>) => void;
+    actionButtonDisabled?: boolean;
+    actionButtonAriaLabel?: string;
     selectedFileName?: string;
     placeholder?: string;
-    defaultContent?: string;
     min?: string;
     max?: string;
     role?: string;
@@ -272,7 +270,7 @@ declare interface InputFieldProps {
 
 declare type InputType = "button" | "radio";
 
-export declare const Label: ({ inline, normalCursor, htmlTag, children, id, ...rest }: LabelProps) => default_2.DOMElement<{
+export declare const Label: ({ inline, normalCursor, htmlTag, children, subLabel, id, ...rest }: LabelProps) => default_2.DOMElement<{
     className: string;
     id: string | undefined;
     form?: string | undefined;
@@ -322,7 +320,7 @@ export declare const Label: ({ inline, normalCursor, htmlTag, children, id, ...r
     results?: number | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
-    popover?: "" | "auto" | "manual" | undefined;
+    popover?: "" | "auto" | "manual" | "hint" | undefined;
     popoverTargetAction?: "toggle" | "show" | "hide" | undefined;
     popoverTarget?: string | undefined;
     inert?: boolean | undefined;
@@ -561,17 +559,7 @@ declare interface LabelProps extends default_2.LabelHTMLAttributes<HTMLLabelElem
     normalCursor?: boolean;
     htmlTag?: keyof JSX_2.IntrinsicElements;
     children?: default_2.ReactNode;
-}
-
-export declare const Lead: ({ id, htmlTag, children }: LeadProps) => default_2.ReactElement<{
-    className: string;
-    id: string | undefined;
-}, string | default_2.JSXElementConstructor<any>>;
-
-declare interface LeadProps {
-    id?: string;
-    htmlTag?: keyof JSX_2.IntrinsicElements;
-    children?: default_2.ReactNode;
+    subLabel?: default_2.ReactNode;
 }
 
 export declare const List: ({ listStyle, compact, ordered, children, }: ListProps) => default_2.DetailedReactHTMLElement<{
@@ -581,12 +569,6 @@ export declare const List: ({ listStyle, compact, ordered, children, }: ListProp
 
 export declare const ListItem: ({ compact, children }: ListItemProps) => JSX.Element;
 
-declare interface ListItemObject {
-    name: string;
-    href: string;
-    listItems?: ListItemObject[];
-}
-
 declare interface ListItemProps {
     compact?: boolean;
     children?: default_2.ReactNode;
@@ -599,17 +581,10 @@ declare interface ListProps {
     children?: default_2.ReactNode;
 }
 
-export declare const LoadingAnimation: ({ fixed, message, }: LoadingAnimationProps) => JSX.Element;
-
-export declare const LoadingAnimation2: ({ ariaLabel, }: LoadingAnimation2Props) => JSX.Element;
-
-declare interface LoadingAnimation2Props {
-    ariaLabel?: string;
-}
+export declare const LoadingAnimation: ({ ariaLabel, }: LoadingAnimationProps) => JSX.Element;
 
 declare interface LoadingAnimationProps {
-    fixed?: boolean;
-    message?: string;
+    ariaLabel?: string;
 }
 
 declare interface MultipleSelectProps extends SelectPropsBase {
@@ -619,24 +594,14 @@ declare interface MultipleSelectProps extends SelectPropsBase {
     defaultValue?: (string | number)[];
 }
 
-export declare const NavigationBar: ({ primaryListItems, secondaryListItems, menuContent, logoLink, logoLinkTitle, openLogoLinkInNewTab, theme, compact, mainContentId, color, children, }: NavigationBarProps) => JSX.Element;
-
-export declare const NavigationBarListItem: ({ listItem }: NavigationBarListItemProps) => JSX.Element | null;
-
-declare interface NavigationBarListItemProps {
-    listItem: string | ListItemObject;
-}
+export declare const NavigationBar: ({ logoLink, logoLinkTitle, openLogoLinkInNewTab, theme, compact, color, }: NavigationBarProps) => JSX.Element;
 
 declare interface NavigationBarProps {
-    primaryListItems?: ListItemObject[];
-    secondaryListItems?: ListItemObject[];
-    menuContent?: default_2.ReactNode;
     logoLink?: string;
     logoLinkTitle?: string;
     openLogoLinkInNewTab?: boolean;
     theme?: ThemeProps;
     compact?: boolean;
-    mainContentId?: string;
     color?: "primary" | "secondary" | "neutral";
     children?: default_2.ReactNode;
 }
@@ -685,7 +650,7 @@ declare interface RadioButtonIconProps {
     hasErrors?: boolean;
 }
 
-export declare const RadioButtonInput: ({ checked, disabled, required, requiredGroup, id, name, onChange, contentOnly, hasErrors, inputValue, tabIndex, children, "aria-controls": ariaControls, "aria-describedby": ariaDescribedBy, }: RadioButtonInputProps) => JSX.Element;
+export declare const RadioButtonInput: ({ checked, disabled, required, requiredGroup, id, name, onChange, hasErrors, inputValue, tabIndex, children, "aria-controls": ariaControls, "aria-describedby": ariaDescribedBy, }: RadioButtonInputProps) => JSX.Element;
 
 declare interface RadioButtonInputProps {
     checked?: boolean;
@@ -695,7 +660,6 @@ declare interface RadioButtonInputProps {
     id: string;
     name?: string;
     onChange?: (e: default_2.ChangeEvent<HTMLInputElement>) => void;
-    contentOnly?: boolean;
     hasErrors?: boolean;
     inputValue: string;
     tabIndex?: number;
@@ -706,7 +670,7 @@ declare interface RadioButtonInputProps {
 
 export declare const RadioButtonList: ({ legend, legendSize, required, compact, children, }: RadioButtonListProps) => JSX.Element;
 
-export declare const RadioButtonListItem: ({ inputValue, checked, disabled, required, requiredGroup, name, id, onChange, contentOnly, compact, hasErrors, "aria-controls": ariaControls, "aria-describedby": ariaDescribedBy, children, }: RadioButtonListItemProps) => JSX.Element;
+export declare const RadioButtonListItem: ({ inputValue, checked, disabled, required, requiredGroup, name, id, onChange, compact, hasErrors, "aria-controls": ariaControls, "aria-describedby": ariaDescribedBy, children, }: RadioButtonListItemProps) => JSX.Element;
 
 declare interface RadioButtonListItemProps {
     inputValue: string;
@@ -717,7 +681,6 @@ declare interface RadioButtonListItemProps {
     name?: string;
     id: string;
     onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
-    contentOnly?: boolean;
     compact?: boolean;
     hasErrors?: boolean;
     'aria-controls'?: string;
@@ -745,7 +708,6 @@ declare interface SelectPropsBase {
     options?: Option_2[];
     width?: string;
     label?: default_2.ReactNode;
-    contentOnly?: boolean;
     keyAsContent?: boolean;
     placeholder?: string;
     placeholderValue?: string;
@@ -781,10 +743,10 @@ declare interface StepProps {
     step: StepData;
     index: number;
     activeStepId: string | number;
-    direction?: 'vertical' | 'horizontal';
+    direction?: "vertical" | "horizontal";
 }
 
-export declare const Table: <T extends object>({ columns, data, caption, getRowId, selectionType, selectionLabel, selectedRowId, onSelect, selectedRowIds, onSelectMany, onRowClick, pageSize, page, defaultPage, onPageChange, pageSizeOptions, defaultPageSize, onPageSizeChange, }: TableProps<T>) => JSX.Element;
+export declare const Table: <T extends object>({ columns, data, loading, loadingAriaLabel, getRowId, selectionType, selectionLabel, selectedRowId, onSelect, selectedRowIds, onSelectMany, onRowClick, pageSize, page, defaultPage, onPageChange, pageSizeOptions, defaultPageSize, onPageSizeChange, }: TableProps<T>) => JSX.Element;
 
 declare type TableColumn<T> = {
     key: string;
@@ -799,7 +761,8 @@ declare type TableColumn<T> = {
 declare interface TableProps<T> {
     columns: TableColumn<T>[];
     data: T[];
-    caption?: string;
+    loading?: boolean;
+    loadingAriaLabel?: string;
     getRowId?: (row: T, index: number) => default_2.Key;
     selectionType?: "single" | "multiple";
     selectionLabel?: string;
@@ -861,7 +824,7 @@ declare interface TabsProps {
     className?: string;
 }
 
-export declare const Textarea: ({ id, onChange, onBlur, name, required, readOnly, disabled, width, resize, value, defaultValue, elementKey, rows, label, contentOnly, placeholder, defaultContent, "aria-describedby": ariaDescribedBy, hasErrors, errorMessage, }: TextareaProps) => JSX.Element;
+export declare const Textarea: ({ id, onChange, onBlur, name, required, readOnly, disabled, width, resize, value, defaultValue, elementKey, rows, label, placeholder, "aria-describedby": ariaDescribedBy, hasErrors, errorMessage, }: TextareaProps) => JSX.Element;
 
 declare interface TextareaProps {
     id: string;
@@ -878,9 +841,7 @@ declare interface TextareaProps {
     elementKey?: string;
     rows?: string;
     label?: default_2.ReactNode;
-    contentOnly?: boolean;
     placeholder?: string;
-    defaultContent?: string;
     "aria-describedby"?: string;
     hasErrors?: boolean;
     errorMessage?: default_2.ReactNode;
@@ -889,14 +850,14 @@ declare interface TextareaProps {
 declare interface ThemeProps {
     appName: string;
     logo: string;
+    logoCompact?: string;
     logoPadding?: string;
-    sizes?: {
-        logoSmallWidth: string;
-        logoLargeWidth: string;
-    };
     colors?: {
         [key: string]: string;
     };
+    sizes?: {
+        [key: string]: string;
+    };
 }
 
 export declare const ThemeProvider: ({ theme, children }: ThemeProviderProps) => ReactNode;
@@ -954,7 +915,7 @@ export declare const ToggleNavigationButton: ({ id, htmlTag, showText, hideText,
     results?: number | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
-    popover?: "" | "auto" | "manual" | undefined;
+    popover?: "" | "auto" | "manual" | "hint" | undefined;
     popoverTargetAction?: "toggle" | "show" | "hide" | undefined;
     popoverTarget?: string | undefined;
     inert?: boolean | undefined;