dibk-design 9.3.5 → 9.4.0

package/dist/index.d.ts

@@ -3,10 +3,11 @@ import { default as default_2 } from 'react';
 import { JSX } from 'react/jsx-runtime';
 import { JSX as JSX_2 } from 'react';
 import { ReactNode } from 'react';
+import { ReactPortal } from 'react';
 
 export declare const Accordion: ({ title, color, expanded: expandedProp, onToggleExpand, buttonProps, noMargin, initialized: initializedProp, children, ...rest }: AccordionProps) => JSX.Element;
 
-declare type AccordionColor = 'default' | 'secondary' | 'info' | 'contrast';
+declare type AccordionColor = "default" | "secondary" | "info" | "contrast";
 
 declare interface AccordionProps {
     title?: string;
@@ -20,13 +21,13 @@ declare interface AccordionProps {
     [key: string]: any;
 }
 
-declare type ArrowDirection = 'none' | 'left' | 'right';
+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, ...rest }: ButtonProps) => JSX.Element;
 
-declare type ButtonColor = 'primary' | 'secondary';
+declare type ButtonColor = "primary" | "secondary";
 
-declare interface ButtonProps extends Omit<default_2.ButtonHTMLAttributes<HTMLButtonElement>, 'type'> {
+declare interface ButtonProps extends Omit<default_2.ButtonHTMLAttributes<HTMLButtonElement>, "type"> {
     content?: string;
     color?: ButtonColor;
     size?: ButtonSize;
@@ -36,7 +37,7 @@ declare interface ButtonProps extends Omit<default_2.ButtonHTMLAttributes<HTMLBu
     defaultChecked?: boolean;
     required?: boolean;
     hasErrors?: boolean;
-    'aria-describedby'?: string;
+    "aria-describedby"?: string;
     noHover?: boolean;
     rounded?: boolean;
     href?: string;
@@ -47,16 +48,18 @@ declare interface ButtonProps extends Omit<default_2.ButtonHTMLAttributes<HTMLBu
     [key: string]: any;
 }
 
-declare type ButtonSize = 'small' | 'regular';
+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, }: {
-    size?: string | undefined;
-    checked?: boolean | undefined;
-    disabled?: boolean | undefined;
-    showBox?: boolean | undefined;
-    hasErrors?: boolean | undefined;
-    checkmarkCharacter?: string | undefined;
-}) => JSX.Element;
+declare interface CheckBoxIconProps {
+    size?: string;
+    checked?: boolean;
+    disabled?: boolean;
+    showBox?: boolean;
+    hasErrors?: boolean;
+    checkmarkCharacter?: 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;
 
@@ -71,8 +74,8 @@ declare interface CheckBoxInputProps {
     contentOnly?: boolean;
     hasErrors?: boolean;
     checkmarkCharacter?: string;
-    'aria-controls'?: string;
-    'aria-describedby'?: string;
+    "aria-controls"?: string;
+    "aria-describedby"?: string;
     tabIndex?: number;
     children?: default_2.ReactNode;
     value?: string | number;
@@ -95,8 +98,8 @@ declare interface CheckBoxListItemProps {
     compact?: boolean;
     checkmarkCharacter?: string;
     hasErrors?: boolean;
-    'aria-controls'?: string;
-    'aria-describedby'?: string;
+    "aria-controls"?: string;
+    "aria-describedby"?: string;
     children?: default_2.ReactNode;
 }
 
@@ -153,7 +156,7 @@ declare interface DescriptionTermProps {
     children?: default_2.ReactNode;
 }
 
-export declare const Dialog: ({ maxWidth, noPadding, closeButton, onClickOutside, modal, attachTo, hidden, children, }: DialogProps) => JSX.Element;
+export declare const Dialog: ({ maxWidth, noPadding, closeButton, onClickOutside, modal, attachTo, hidden, children, }: DialogProps) => ReactPortal | null;
 
 declare interface DialogProps {
     maxWidth?: string;
@@ -161,7 +164,7 @@ declare interface DialogProps {
     closeButton?: boolean;
     onClickOutside: () => void;
     modal?: boolean;
-    attachTo?: 'left' | 'right' | 'top' | 'bottom' | string;
+    attachTo?: "left" | "right" | "top" | "bottom" | string;
     hidden?: boolean;
     children?: React.ReactNode;
 }
@@ -184,13 +187,13 @@ declare interface DragAndDropFileInputProps {
     errorMessage?: string | (string | JSX_2.Element)[];
     required?: boolean;
     children?: default_2.ReactNode;
-    'data-transaction-name'?: string;
+    "data-transaction-name"?: string;
 }
 
 export declare const ErrorBox: React.FC<ErrorBoxProps>;
 
 declare interface ErrorBoxProps {
-    type?: 'warning' | 'error';
+    type?: "warning" | "error";
     fullScreen?: boolean;
     children?: React.ReactNode;
 }
@@ -227,24 +230,25 @@ declare interface InfoBoxProps {
     children?: default_2.ReactNode;
 }
 
-export declare const InputField: ({ id, onChange, onBlur, 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, }: InputFieldProps) => JSX.Element;
+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, }: InputFieldProps) => JSX.Element;
 
 declare interface InputFieldProps {
     id: string;
-    onChange: (e: default_2.ChangeEvent<HTMLInputElement>) => void;
+    onChange?: (e: default_2.ChangeEvent<HTMLInputElement>) => void;
     onBlur?: (e: default_2.FocusEvent<HTMLInputElement>) => void;
+    onFocus?: (e: default_2.FocusEvent<HTMLInputElement>) => void;
     name?: string;
     type?: string;
     disabled?: boolean;
     required?: boolean;
     readOnly?: boolean;
     width?: string;
-    value?: any;
-    defaultValue?: any;
+    value?: string | number | Date;
+    defaultValue?: string | number | Date;
     elementKey?: string;
     label?: default_2.ReactNode;
     contentOnly?: boolean;
-    buttonColor?: 'primary' | 'secondary';
+    buttonColor?: "primary" | "secondary";
     buttonContent?: string;
     selectedFileName?: string;
     placeholder?: string;
@@ -252,14 +256,14 @@ declare interface InputFieldProps {
     min?: string;
     max?: string;
     role?: string;
-    'aria-describedby'?: string;
-    'aria-autocomplete'?: 'none' | 'inline' | 'list' | 'both';
+    "aria-describedby"?: string;
+    "aria-autocomplete"?: "none" | "inline" | "list" | "both";
     hasErrors?: boolean;
     errorMessage?: default_2.ReactNode;
     noMargin?: boolean;
 }
 
-declare type InputType = 'button' | 'radio';
+declare type InputType = "button" | "radio";
 
 export declare const Label: ({ inline, normalCursor, htmlTag, children, id, ...rest }: LabelProps) => default_2.DOMElement<{
     className: string;
@@ -595,6 +599,13 @@ declare interface LoadingAnimationProps {
     message?: string;
 }
 
+declare interface MultipleSelectProps extends SelectPropsBase {
+    multiple: true;
+    onChange: (value: (string | number)[]) => void;
+    value?: (string | number)[];
+    defaultValue?: (string | number)[];
+}
+
 export declare const NavigationBar: ({ primaryListItems, secondaryListItems, logoLink, logoLinkTitle, openLogoLinkInNewTab, theme, compact, mainContentId, preventChildElementStacking, children, }: NavigationBarProps) => JSX.Element;
 
 export declare const NavigationBarListItem: ({ listItem }: NavigationBarListItemProps) => JSX.Element | null;
@@ -660,8 +671,8 @@ declare interface RadioButtonInputProps {
     inputValue: string;
     tabIndex?: number;
     children?: default_2.ReactNode;
-    'aria-controls'?: string;
-    'aria-describedby'?: string;
+    "aria-controls"?: string;
+    "aria-describedby"?: string;
 }
 
 export declare const RadioButtonList: ({ legend, legendSize, required, compact, children, }: RadioButtonListProps) => JSX.Element;
@@ -693,19 +704,17 @@ declare interface RadioButtonListProps {
     children?: ReactNode;
 }
 
-export declare const Select: ({ id, onChange, name, required, disabled, multiple, options, width, value, defaultValue, label, contentOnly, keyAsContent, placeholder, placeholderValue, defaultContent, role, "aria-describedby": ariaDescribedBy, hasErrors, errorMessage, }: SelectProps) => JSX.Element;
+export declare const Select: (props: SelectProps) => JSX.Element;
 
-declare interface SelectProps {
+declare type SelectProps = SingleSelectProps | MultipleSelectProps;
+
+declare interface SelectPropsBase {
     id: string;
-    onChange: (value: any) => void;
     name?: string;
     required?: boolean;
     disabled?: boolean;
-    multiple?: boolean;
     options?: Option_2[];
     width?: string;
-    value?: any;
-    defaultValue?: any;
     label?: default_2.ReactNode;
     contentOnly?: boolean;
     keyAsContent?: boolean;
@@ -713,11 +722,18 @@ declare interface SelectProps {
     placeholderValue?: string;
     defaultContent?: string;
     role?: string;
-    'aria-describedby'?: string;
+    "aria-describedby"?: string;
     hasErrors?: boolean;
     errorMessage?: default_2.ReactNode;
 }
 
+declare interface SingleSelectProps extends SelectPropsBase {
+    multiple?: false;
+    onChange: (value: string | number) => void;
+    value?: string | number;
+    defaultValue?: string | number;
+}
+
 declare interface StepData {
     id: string | number;
     name: string;
@@ -738,12 +754,23 @@ declare interface StepProps {
     direction?: 'vertical' | 'horizontal';
 }
 
-export declare const Table: ({ captionAlign, captionSide, children }: TableProps) => JSX.Element;
+export declare const Table: <T extends object>({ columns, data, caption, getRowId, }: TableProps<T>) => JSX.Element;
 
-declare interface TableProps {
-    captionAlign?: 'left' | 'center' | 'right';
-    captionSide?: 'top' | 'bottom';
-    children?: default_2.ReactNode;
+declare type TableColumn<T> = {
+    key: string;
+    label: string;
+    sortable?: boolean;
+    accessor?: (item: T) => string | number | null | undefined;
+    render?: (item: T) => default_2.ReactNode;
+    sortAccessor?: (item: T) => string | number | Date | null | undefined;
+    ariaLabel?: string;
+};
+
+declare interface TableProps<T> {
+    columns: TableColumn<T>[];
+    data: T[];
+    caption?: string;
+    getRowId?: (row: T, index: number) => default_2.Key;
 }
 
 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;
@@ -757,7 +784,7 @@ declare interface TextareaProps {
     readOnly?: boolean;
     disabled?: boolean;
     width?: string;
-    resize?: 'both' | 'horizontal' | 'vertical' | 'none';
+    resize?: "both" | "horizontal" | "vertical" | "none";
     value?: string;
     defaultValue?: string;
     elementKey?: string;
@@ -766,7 +793,7 @@ declare interface TextareaProps {
     contentOnly?: boolean;
     placeholder?: string;
     defaultContent?: string;
-    'aria-describedby'?: string;
+    "aria-describedby"?: string;
     hasErrors?: boolean;
     errorMessage?: default_2.ReactNode;
 }