@lunit/oui 3.1.1 → 3.1.2

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

@@ -1,4 +1,5 @@
 import type { AlertProps as MuiAlertProps } from '@mui/material';
 export interface AlertProps extends MuiAlertProps {
+    /** Called when the close button is clicked; the button is only rendered when this is set */
     onClose?: () => void;
 }

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

@@ -1,17 +1,26 @@
 import type { BoxProps } from '@mui/material';
 interface BaseTextFieldContainerProps {
+    /** Width of the field; a number is treated as px */
     width?: string | number;
 }
 interface RootTextFieldProps extends BaseTextFieldContainerProps {
+    /** Blocks input and renders the muted disabled style */
     disabled?: boolean;
+    /** Allows selection and copying but blocks editing */
     readOnly?: boolean;
+    /** Field contents, for controlled use */
     value?: string;
+    /** Initial contents, for uncontrolled use */
     defaultValue?: string;
+    /** Renders the field in its error state */
     error?: boolean;
+    /** Props for the wrapper Box around the field */
     BoxProps?: BoxProps;
 }
 interface HelperMsgProps {
+    /** Renders the message in the error style */
     error?: boolean;
+    /** Helper text shown under the field */
     helperMsg?: string;
 }
 export { RootTextFieldProps, BaseTextFieldContainerProps, HelperMsgProps };

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

@@ -3,20 +3,33 @@ type ButtonVariant = 'contained' | 'ghost' | 'outlined';
 type ButtonColor = 'primary' | 'secondary' | 'error';
 type ButtonSize = 'small' | 'medium' | 'large';
 interface BaseButtonProps extends Omit<MuiButtonProps, 'variant' | 'color'> {
+    /** Visual style of the button. Defaults to `contained` */
     variant?: ButtonVariant;
+    /** Colour role applied to the button */
     color?: ButtonColor;
+    /** Height and padding preset */
     size?: ButtonSize;
+    /** Blocks interaction and renders the muted disabled style */
     disabled?: boolean;
+    /** Draws a 2px outline on focus and active; `outlined` variant only. Defaults to `false` */
     focusOutline?: boolean;
+    /** Set internally to pick the icon-only layout; use `IconButtonProps` or `NormalButtonProps` instead */
     isIconOnly: boolean;
+    /** Swaps the content for a spinner and swallows clicks */
     loading?: boolean;
+    /** Text shown in the button */
     label?: string;
 }
+/** A button whose content is an icon only */
 interface IconButtonProps extends Omit<BaseButtonProps, 'isIconOnly'> {
+    /** Icon rendered as the whole button content */
     icon: React.ReactNode;
 }
+/** A button with a text label, optionally preceded by an icon */
 interface NormalButtonProps extends Omit<BaseButtonProps, 'isIconOnly'> {
+    /** Text shown in the button */
     label: string;
+    /** Icon rendered before the label */
     icon?: React.ReactNode;
 }
 type ButtonProps = IconButtonProps | NormalButtonProps;

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

@@ -1,8 +1,12 @@
 import type { CardProps as MuiCardProps } from '@mui/material';
 export type CardSize = 'small' | 'large';
 export interface CardProps extends MuiCardProps {
+    /** Fixed card dimensions: `small` is 480x156, `large` is 520x284. Defaults to `large` */
     size?: CardSize;
+    /** Not read by this component; forwarded to the underlying MUI Card */
     open?: boolean;
+    /** Renders the card on the lighter selected background */
     selected?: boolean;
+    /** Called when the card is clicked */
     onClick?: () => void;
 }

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

@@ -1,15 +1,27 @@
 import type { BoxProps, CheckboxProps as MuiCheckboxProps } from '@mui/material';
 export interface CheckboxProps extends Omit<BoxProps<'span'>, 'onChange' | 'onChangeCapture'> {
+    /** Value submitted with the surrounding form */
     value?: MuiCheckboxProps['value'];
+    /** Name of the underlying input */
     name?: MuiCheckboxProps['name'];
+    /** Whether the box is ticked, for controlled use */
     checked?: MuiCheckboxProps['checked'];
+    /** Initial state, for uncontrolled use */
     defaultChecked?: MuiCheckboxProps['defaultChecked'];
+    /** Blocks interaction and renders the muted disabled style */
     disabled?: MuiCheckboxProps['disabled'];
+    /** Marks the input as required in the surrounding form */
     required?: MuiCheckboxProps['required'];
+    /** Renders the dash state used when only some children are ticked */
     indeterminate?: MuiCheckboxProps['indeterminate'];
+    /** Called when the box is ticked or unticked */
     onChange?: MuiCheckboxProps['onChange'];
+    /** Capture-phase change handler */
     onChangeCapture?: MuiCheckboxProps['onChangeCapture'];
+    /** Text shown beside the box; makes the container a `<label>` */
     label?: string;
+    /** Attributes applied to the underlying input element */
     inputProps?: React.InputHTMLAttributes<HTMLInputElement>;
+    /** Ref to the underlying input element */
     inputRef?: React.Ref<HTMLInputElement>;
 }

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

@@ -1,6 +1,8 @@
 import type { ChipProps as MuiChipProps } from '@mui/material';
 export type ChipsPreset = 'default' | 'uploaded' | 'analyzing' | 'analyzed' | 'analysis_failed' | 'qc_failed' | 'ready' | 'inferred' | 'inferencing' | 'invalid' | 'requested';
 export interface ChipProps extends MuiChipProps {
+    /** Analysis status preset that supplies the colour and default label; every `*_failed` preset shares one style */
     preset?: ChipsPreset;
+    /** Text shown in the chip; overrides the preset's default label */
     label?: string;
 }

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

@@ -1,6 +1,8 @@
 import type { DatePickerProps as MuiDatePickerProps } from '@mui/x-date-pickers/DatePicker';
 export type DatePickerAlignment = 'left' | 'center' | 'right';
 export interface DatePickerProps extends MuiDatePickerProps {
+    /** Horizontal alignment of the date text inside the field */
     alignment?: DatePickerAlignment;
+    /** Placeholder shown while no date is selected */
     placeholder?: string;
 }

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

@@ -1,18 +1,33 @@
 import type { SxProps } from '@mui/system';
 export interface DialogProps {
+    /** Whether the dialog is shown */
     open: boolean;
+    /** Heading shown in the dialog header */
     title?: string;
+    /** Icon rendered before the title */
     icon?: React.ReactNode;
+    /** Renders a close button in the header */
     closable?: boolean;
+    /** Keeps the dialog at the narrow 320px prompt width even when `children` is used */
     isPrompt?: boolean;
+    /** Label for the cancel button; the default footer renders only when this or `submitText` is set */
     cancelText?: string;
+    /** Label for the submit button */
     submitText?: string;
+    /** Called when the dialog requests to close, with the reason MUI reports */
     onClose?: (event: object | null, reason: string) => void;
+    /** Plain body text; takes precedence over `children` */
     text?: string;
+    /** Body content, used when `text` is not set. Widens the dialog unless `isPrompt` is set */
     children?: React.ReactNode;
+    /** Replaces the default cancel/submit footer entirely */
     dialogAction?: React.ReactNode;
+    /** Size preset applied to the footer buttons. Defaults to `small` */
     buttonSize?: 'small' | 'medium' | 'large';
+    /** Shows a spinner on the submit button and blocks it */
     loading?: boolean;
+    /** Blocks the submit button without showing a spinner */
     disableSubmit?: boolean;
+    /** Style overrides for the dialog paper */
     sx?: SxProps;
 }

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

@@ -1,5 +1,6 @@
 import type { DividerProps as MuiDividerProps } from '@mui/material';
 interface DividerProps extends MuiDividerProps {
+    /** Direction the rule runs in. Defaults to `vertical`, unlike MUI's `horizontal` */
     orientation?: 'horizontal' | 'vertical';
 }
 export type { DividerProps };

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

@@ -1,19 +1,28 @@
 import type { BoxProps, SelectProps, TypographyProps } from '@mui/material';
 import { IconDropdownOption } from './IconDropdown.types';
 interface DropdownContainerProps extends BoxProps {
+    /** Stretches the container to the full width of its parent */
     fullWidth?: boolean;
 }
 type BaseDropdownProps<T = unknown> = SelectProps<T>;
 interface DropdownProps<T = unknown> extends Omit<BaseDropdownProps<T>, 'IconComponent' | 'error' | 'sx' | 'style'> {
+    /** Error message shown under the field; also puts the field in its error state */
     error?: string;
+    /** Helper text shown under the field when there is no `error` */
     helperMsg?: string;
+    /** Text shown while nothing is selected */
     placeholder?: string;
+    /** Props for the wrapper around the select and its messages */
     ContainerProps?: BoxProps;
+    /** Style overrides for the select */
     sx?: SelectProps['sx'];
+    /** Inline styles for the select */
     style?: SelectProps['style'];
+    /** Options to render; an alternative to passing DropdownItem children */
     options?: IconDropdownOption[];
 }
 interface PlaceholderProps extends TypographyProps {
+    /** Renders the placeholder in the muted disabled style */
     disabled?: boolean;
 }
 type DropdownComponent = <T>(props: DropdownProps<T>) => JSX.Element;

package/dist/types/components/Dropdown/DropdownItem.types.d.ts

@@ -1,11 +1,16 @@
 import type { MenuItemProps } from '@mui/material';
 interface BaseDropdownItemProps extends MenuItemProps {
+    /** Reserves leading space so the label lines up with items that show an icon */
     emptyIcon?: boolean;
 }
 interface DropdownItemProps extends BaseDropdownItemProps {
+    /** Treats the item as an action rather than a value, so selecting it does not change the field */
     asButton?: boolean;
+    /** Shows a check mark while the item is selected */
     checkIcon?: boolean;
+    /** Icon rendered before the label, taking precedence over `checkIcon` */
     customIcon?: React.ReactElement;
+    /** Shortcut hint pinned to the right of the label */
     keyboardShortcut?: string;
 }
 export { DropdownItemProps, BaseDropdownItemProps };

package/dist/types/components/Dropdown/DropdownSubtitle.types.d.ts

@@ -1,5 +1,7 @@
 interface DropdownSubtitleProps {
+    /** Section heading shown above a group of items */
     label: string;
+    /** Secondary text shown next to the label */
     value?: string;
 }
 export default DropdownSubtitleProps;

package/dist/types/components/Dropdown/IconDropdown.types.d.ts

@@ -1,17 +1,24 @@
 import type { TypographyProps } from '@mui/system';
 import type { BaseDropdownProps } from '../Dropdown/Dropdown.types';
 type BaseIconDropdownProps = BaseDropdownProps & {
+    /** Renders the trigger in its active, pressed-in style */
     isToggled?: boolean;
 };
 type IconDropdownProps = BaseIconDropdownProps;
 interface PlaceholderProps extends TypographyProps {
+    /** Renders the placeholder in the muted disabled style */
     disabled?: boolean;
 }
 interface IconDropdownOption {
+    /** Value selected when the option is picked */
     value: string;
+    /** Icon rendered before the label */
     icon: React.ReactElement;
+    /** Text shown for the option */
     label: string;
+    /** Shortcut hint pinned to the right of the label */
     shortcut?: string;
+    /** Marks the option as the default choice */
     default?: boolean;
 }
 export { IconDropdownProps, BaseIconDropdownProps, PlaceholderProps, IconDropdownOption };

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

@@ -1,9 +1,13 @@
 import type { TypographyProps as MuiTypographyProps } from '@mui/material';
 export interface BaseEllipsisTypographyProps extends MuiTypographyProps {
+    /** `row` clamps to a single line, `column` clamps to `maxLines`. Defaults to `row` */
     direction?: 'row' | 'column';
+    /** Lines to show before truncating; `column` direction only. Defaults to 1 */
     maxLines?: number;
 }
 export interface EllipsisTypographyProps extends BaseEllipsisTypographyProps {
+    /** Where the overflow tooltip opens. Defaults to `bottom` */
     tooltipPlacement?: 'top' | 'right' | 'bottom' | 'left';
+    /** Slack in px before overflow counts as truncated, to absorb sub-pixel rounding */
     heightThreshold?: number;
 }

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

@@ -1,12 +1,20 @@
 import type { BoxProps } from '@mui/material';
 interface FileDnDZoneProps {
+    /** Slides already uploaded, shown in the usage message */
     slidesUploaded: number;
+    /** Upper bound shown in the usage message. Defaults to 500 */
     maxSlideLimit?: number;
+    /** Accepted extensions listed in the guidance text */
     acceptedFileFormats?: string;
+    /** Blocks dropping and renders the muted disabled style */
     disabled?: boolean;
+    /** Props for the outermost wrapper */
     WrapperProps?: BoxProps;
+    /** Props for the dashed drop-target box */
     OuterBoxProps?: BoxProps;
+    /** Props for the content box inside the drop target */
     InnerBoxProps?: BoxProps;
+    /** Props for the guidance text section */
     SectionBoxProps?: BoxProps;
 }
 export default FileDnDZoneProps;

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

@@ -1,17 +1,26 @@
 import type { ListProps as MuiListProps, ListSubheaderProps as MuiListSubheaderProps } from '@mui/material';
 export type ListSize = 'small' | 'medium' | 'large';
 export interface ListProps extends MuiListProps {
+    /** Row height and typography preset applied to every item. Defaults to `medium` */
     size?: ListSize;
+    /** Weight of the subheader text. Defaults to `bold` */
     subheaderType?: ListSubheaderProps['type'];
+    /** `visible` keeps the list always open; a boolean makes the subheader a collapse toggle. Defaults to `visible` */
     open?: boolean | 'visible';
+    /** Called when a collapsed list is expanded via the subheader */
     onOpen?: (event: React.MouseEvent<HTMLLIElement>) => void;
+    /** Called when an expanded list is collapsed via the subheader */
     onClose?: (event: React.MouseEvent<HTMLLIElement>) => void;
+    /** Reserves leading space in every item so labels line up with checked ones */
     showCheck?: boolean;
 }
 export interface ListSubheaderProps extends MuiListSubheaderProps {
+    /** Weight of the subheader text */
     type?: 'bold' | 'normal';
+    /** Renders the subheader with hover and pointer affordances */
     clickable?: boolean;
 }
+/** Size and check settings shared with the list's items */
 export interface ListContextValue {
     size: ListSize;
     showCheck: boolean;

package/dist/types/components/List/ListItem.types.d.ts

@@ -3,9 +3,13 @@ import { OverrideProps } from '@mui/material/OverridableComponent';
 import type { ListSize } from '../List/List.types';
 type ListItemRootBasePropsKey = 'className' | 'classes' | 'style' | 'sx';
 export interface ListItemBaseProps extends Omit<MuiListItemButtonProps, ListItemRootBasePropsKey>, Pick<MuiListItemProps, ListItemRootBasePropsKey> {
+    /** Primary content of the row */
     label?: React.ReactNode | string;
+    /** Content rendered before the label, e.g. an icon or checkbox */
     startElement?: React.ReactNode;
+    /** Content rendered after the label, e.g. a caption or action */
     endElement?: React.ReactNode;
+    /** Props applied to the outer `li`, separate from the inner button */
     rootProps?: MuiListItemProps;
 }
 export type ListItemTypeMap<P = {}, D extends React.ElementType = 'span'> = ExtendButtonBaseTypeMap<{
@@ -16,7 +20,9 @@ export type ListItemTypeMap<P = {}, D extends React.ElementType = 'span'> = Exte
 export type ListItemComponent = ExtendButtonBase<ListItemTypeMap>;
 export type ListItemProps<D extends React.ElementType = ListItemTypeMap['defaultComponent'], P = {}> = OverrideProps<ListItemTypeMap<P, D>, D>;
 export interface StyledListItemButtonProps extends MuiListItemButtonProps {
+    /** Element the button renders as */
     component?: React.ElementType;
+    /** Row height and typography preset, supplied by the parent List */
     size: ListSize;
 }
 export {};

package/dist/types/components/List/ListItemCaption.types.d.ts

@@ -1 +1,2 @@
+/** ListItemCaption takes MUI Typography's props unchanged; it declares none of its own. */
 export { TypographyProps as ListItemCaptionProps } from '@mui/material';

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

@@ -1,7 +1,11 @@
 import { ReactNode } from 'react';
 export interface LoadingIndicatorProps {
+    /** Primary line of text shown under the animation */
     message?: string;
+    /** Secondary content shown under the message; replaces the default detail text */
     details?: ReactNode;
+    /** Which Lottie animation to play. Defaults to `dot` */
     loadingAnimation?: 'dot' | 'dna';
+    /** `data-testid` applied to the container. Defaults to `loading-indicator` */
     dataTestId?: string;
 }

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

@@ -1,15 +1,20 @@
 import type { MenuProps as MuiMenuProps, PaperProps } from '@mui/material';
 export type MenuSize = 'small' | 'medium';
 export interface MenuProps extends StyledMenuProps {
+    /** Row height and typography preset applied to every item. Defaults to `medium` */
     size?: MenuSize;
+    /** Content pinned above the item list */
     subheader?: React.ReactNode;
+    /** Reserves leading space in every item so labels line up with checked ones */
     showCheck?: boolean;
 }
 export interface StyledMenuProps extends MuiMenuProps {
+    /** Row height and typography preset */
     size?: MenuSize;
     /** @deprecated Use slotProps={{ paper: ... }} instead */
     PaperProps?: PaperProps;
 }
+/** Size and check settings shared with the menu's items */
 export interface MenuContextValue {
     size: MenuSize;
     showCheck: boolean;

package/dist/types/components/Menu/MenuItem.types.d.ts

@@ -1,12 +1,18 @@
 import type { MenuItemProps as MuiMenuItemProps } from '@mui/material';
 import type { MenuSize } from '../Menu/Menu.types';
 export interface MenuItemProps extends MuiMenuItemProps {
+    /** Icon rendered before the label. Falls back to a spacer when the menu sets `showCheck` */
     icon?: React.ReactNode;
+    /** Secondary text pinned to the right of the row, e.g. a keyboard shortcut */
     caption?: React.ReactNode;
+    /** Primary text of the row */
     label?: React.ReactNode;
+    /** Not read by this component; forwarded to the underlying MUI MenuItem */
     open?: boolean;
+    /** Not rendered; use `label` for the row's text */
     children?: React.ReactNode;
 }
 export interface StyledMenuItemProps extends MuiMenuItemProps {
+    /** Row height and typography preset */
     size: MenuSize;
 }

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

@@ -1,8 +1,13 @@
 export interface PaginationProps {
+    /** Current page, 1-based. Defaults to 1 */
     page?: number;
+    /** Rows shown per page */
     perPage: number;
+    /** Total number of pages */
     totalPage: number;
+    /** Called with the page the user picked */
     onPageChange?: (event: React.MouseEvent<HTMLLIElement> | React.MouseEvent<HTMLButtonElement> | null, page: number) => void;
+    /** Called with the rows-per-page value the user picked */
     onPerPageChange?: (event: React.MouseEvent<HTMLLIElement> | null, perPage: number) => void;
 }
 interface SortObject {
@@ -18,6 +23,7 @@ interface Pageable {
     pageNumber: number;
     pageSize: number;
 }
+/** Page metadata as returned by a Spring Data paged response */
 export interface PaginationViewInfo {
     totalElements: number;
     totalPages: number;

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

@@ -1,9 +1,15 @@
 import type { SxProps } from '@mui/system';
 export interface ProductLabelProps {
+    /** Called when the label is dismissed */
     onClose: () => void;
+    /** Whether the label is shown */
     open: boolean;
+    /** Body content of the label */
     children: React.ReactNode;
+    /** Content pinned to the left of the footer; the footer renders only when this or `footerEnd` is set */
     footerStart?: string | React.ReactNode;
+    /** Content pinned to the right of the footer */
     footerEnd?: string | React.ReactNode;
+    /** Style overrides for the container */
     sx?: SxProps;
 }

package/dist/types/components/Progress/CircularProgress.types.d.ts

@@ -1,5 +1,7 @@
 import type { CircularProgressProps as MuiCircularProgressProps } from '@mui/material';
 export interface CircularProgressProps extends MuiCircularProgressProps {
+    /** Colour of the progress arc */
     circleColor?: string;
+    /** Completion percentage, 0-100. Spins indefinitely when omitted */
     progress?: number;
 }

package/dist/types/components/Progress/LinearProgress.types.d.ts

@@ -1,6 +1,9 @@
 import type { LinearProgressProps as MuiLinearProgressProps } from '@mui/material';
 export interface LinearProgressProps extends Omit<MuiLinearProgressProps, 'color'> {
+    /** Colour of the filled portion of the bar */
     barColor?: string;
+    /** Completion percentage, 0-100. Animates indefinitely when omitted */
     progress?: number;
+    /** Bar thickness in px. Defaults to 4 */
     height?: number;
 }

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

@@ -1,14 +1,25 @@
 import type { BoxProps, RadioProps as MuiRadioProps } from '@mui/material';
 export interface RadioProps extends Omit<BoxProps<'span'>, 'onChange' | 'onChangeCapture'> {
+    /** Value submitted with the surrounding form, and matched against the group's value */
     value?: MuiRadioProps['value'];
+    /** Name of the underlying input; shared across a group */
     name?: MuiRadioProps['name'];
+    /** Whether this option is selected, for controlled use */
     checked?: MuiRadioProps['checked'];
+    /** Initial state, for uncontrolled use */
     defaultChecked?: MuiRadioProps['defaultChecked'];
+    /** Blocks interaction and renders the muted disabled style */
     disabled?: MuiRadioProps['disabled'];
+    /** Marks the input as required in the surrounding form */
     required?: MuiRadioProps['required'];
+    /** Called when this option is selected */
     onChange?: MuiRadioProps['onChange'];
+    /** Capture-phase change handler */
     onChangeCapture?: MuiRadioProps['onChangeCapture'];
+    /** Text shown beside the button; makes the container a `<label>` */
     label?: string;
+    /** Attributes applied to the underlying input element */
     inputProps?: React.InputHTMLAttributes<HTMLInputElement>;
+    /** Ref to the underlying input element */
     inputRef?: React.Ref<HTMLInputElement>;
 }

package/dist/types/components/Radio/RadioGroup.types.d.ts

@@ -1,9 +1,15 @@
 import type { FormGroupProps, RadioGroupProps as MuiRadioGroupProps } from '@mui/material';
 export interface RadioGroupProps extends MuiRadioGroupProps {
+    /** Radio options belonging to this group */
     children?: FormGroupProps['children'];
+    /** Initially selected value, for uncontrolled use */
     defaultValue?: MuiRadioGroupProps['defaultValue'];
+    /** Name shared by every input in the group */
     name?: MuiRadioGroupProps['name'];
+    /** Called with the newly selected value */
     onChange?: MuiRadioGroupProps['onChange'];
+    /** Selected value, for controlled use */
     value?: MuiRadioGroupProps['value'];
+    /** Lays the options out in a row instead of a column */
     row?: FormGroupProps['row'];
 }

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

@@ -1,11 +1,16 @@
 import type { TypographyProps } from '@mui/material';
 import type { SxProps } from '@mui/system';
 export interface StepperProps {
+    /** Step number, rendered as `STEP {step}` */
     step: number;
+    /** Step description shown next to the step number */
     title: string;
+    /** Renders the step number and title in the muted disabled style */
     disabled?: boolean;
+    /** Style overrides for the container */
     sx?: SxProps;
 }
 export interface StepperTypographyProps extends TypographyProps {
+    /** Renders the text in the muted disabled style */
     disabled?: boolean;
 }

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

@@ -3,28 +3,45 @@ import type { TabProps, TabsProps } from '@mui/material';
 type TabSize = 'small' | 'medium';
 type ButtonVariant = 'normal' | 'toggle';
 interface TabConfig {
+    /** Identifier matched against `activatedTab` */
     value: string;
+    /** Panel content shown while this tab is active */
     element: React.ReactNode;
+    /** Blocks selection of this tab */
     disabled?: boolean;
 }
 interface BaseTabProps extends TabProps {
+    /** Height and typography preset */
     size?: TabSize;
+    /** `normal` underlines the active tab, `toggle` renders a segmented control */
     buttonVariant?: ButtonVariant;
 }
 interface BaseTabsProps extends TabsProps {
+    /** Height and typography preset */
     size?: TabSize;
+    /** `normal` underlines the active tab, `toggle` renders a segmented control */
     buttonVariant?: ButtonVariant;
 }
 interface TabbedPanelProps {
+    /** Tabs and their panel content, in display order */
     tabs: TabConfig[];
+    /** `value` of the tab currently shown */
     activatedTab: string;
+    /** Height and typography preset. Defaults to `medium` */
     size?: TabSize;
+    /** `normal` underlines the active tab, `toggle` renders a segmented control. Defaults to `normal` */
     buttonVariant?: ButtonVariant;
+    /** How the tab strip distributes width; falls back to `fullWidth` for two or more tabs */
     menuVariant?: TabsProps['variant'];
+    /** Props forwarded to the underlying MUI Tabs */
     TabsProps?: Partial<TabsProps>;
+    /** Props forwarded to each underlying MUI Tab */
     TabProps?: Partial<TabProps>;
+    /** Props forwarded to each underlying MUI TabPanel */
     TabPanelProps?: Partial<TabPanelProps>;
+    /** Called with the newly selected tab's `value` */
     onActivatedTab: (tab: string) => void;
+    /** Called before `onActivatedTab` with the same value, for side effects */
     onTabChangeListener?: (newTabValue: string) => void;
 }
 export type { TabbedPanelProps, TabConfig, TabSize, BaseTabProps, BaseTabsProps };

package/dist/types/components/TextField/TextArea.types.d.ts

@@ -1,17 +1,27 @@
 import type { BoxProps, SxProps } from '@mui/material';
 import type { HelperMsgProps, RootTextFieldProps } from '../BaseTextField/BaseTextField.types';
 interface RootTextAreaProps extends Omit<RootTextFieldProps, 'BoxProps'> {
+    /** Marks the element as a textarea; always `'true'` */
     multiline: 'true';
+    /** Called on every keystroke */
     onChange?: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;
+    /** Renders the field in its error state */
     error?: boolean;
+    /** Ref to the underlying textarea element */
     ref?: React.ForwardedRef<HTMLTextAreaElement> | undefined;
+    /** Text shown while the field is empty */
     placeholder?: string;
+    /** Width of the field; a number is treated as px */
     width?: string | number;
+    /** Height of the field; a number is treated as px */
     height?: string | number;
+    /** Props for the wrapper Box around the field and its helper message */
     OuterBoxProps?: BoxProps;
+    /** Style overrides for the textarea */
     sx?: SxProps;
 }
 interface TextAreaWithHelperMsgProps extends Omit<RootTextAreaProps, 'error' | 'multiline'>, Omit<HelperMsgProps, 'error'> {
+    /** Error message shown under the field; also puts the field in its error state */
     error?: string;
 }
 interface TextAreaProps extends TextAreaWithHelperMsgProps {

package/dist/types/components/TextField/TextInput.types.d.ts

@@ -1,27 +1,41 @@
 import type { BoxProps, InputProps as MuiInputProps } from '@mui/material';
 import type { RootTextFieldProps, HelperMsgProps } from '../BaseTextField/BaseTextField.types';
 interface RootTextInputProps extends RootTextFieldProps, Omit<MuiInputProps, 'size' | 'error' | 'ref' | 'value' | 'defaultValue' | 'onChange'> {
+    /** Uses the taller input height */
     large?: boolean;
+    /** Icon rendered inside the field, before the text */
     leftIcon?: React.ReactNode;
+    /** Icon rendered inside the field, after the text; replaces the clear button */
     rightIcon?: React.ReactNode;
+    /** Called on every keystroke */
     onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    /** Props for the wrapper Box around the field and its helper message */
     OuterBoxProps?: BoxProps;
+    /** Props for the Box wrapping the input and its icons */
     InputContainerProps?: BoxProps;
+    /** Style overrides for the input element itself, replacing the default icon padding */
     inputSX?: MuiInputProps['sx'];
 }
 interface InputWithHelperMsgProps extends Omit<RootTextInputProps, 'error'>, Omit<HelperMsgProps, 'error'> {
+    /** Error message shown under the field; also puts the field in its error state */
     error?: string;
 }
 interface PasswordInputWithHelperMsgProps extends Omit<InputWithHelperMsgProps, 'rightIcon' | 'readOnly' | 'onClearButtonClick' | 'InputContainerProps'> {
+    /** Renders a password field with a built-in reveal toggle */
     type: 'password';
 }
 interface NormalTextInputProps extends InputWithHelperMsgProps {
+    /** Called when the clear button is pressed; the button only renders when this is set */
     onClearButtonClick?: () => void;
+    /** Icon rendered inside the field, after the text; replaces the clear button */
     rightIcon?: React.ReactNode;
 }
 interface FileInputProps extends NormalTextInputProps {
+    /** Renders a file picker field */
     type: 'file';
+    /** Extensions the picker accepts, as an `accept` attribute value */
     accept: string;
+    /** Called when the field is clicked to open the picker */
     onClick: () => void;
 }
 interface PasswordTextInputProps extends PasswordInputWithHelperMsgProps {

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

@@ -1,17 +1,31 @@
 import type { BoxProps, Color, SwitchProps as MuiSwitchProps } from '@mui/material';
 export interface ToggleProps extends Omit<BoxProps<'span'>, 'onChange' | 'onChangeCapture'> {
+    /** Value submitted with the surrounding form */
     value?: MuiSwitchProps['value'];
+    /** Name of the underlying input */
     name?: MuiSwitchProps['name'];
+    /** Whether the switch is on, for controlled use */
     checked?: MuiSwitchProps['checked'];
+    /** Initial state, for uncontrolled use */
     defaultChecked?: MuiSwitchProps['defaultChecked'];
+    /** Blocks interaction and renders the muted disabled style */
     disabled?: MuiSwitchProps['disabled'];
+    /** Marks the input as required in the surrounding form */
     required?: MuiSwitchProps['required'];
+    /** Called when the switch is flipped */
     onChange?: MuiSwitchProps['onChange'];
+    /** Capture-phase change handler */
     onChangeCapture?: MuiSwitchProps['onChangeCapture'];
+    /** Attributes applied to the underlying input element */
     inputProps?: React.InputHTMLAttributes<HTMLInputElement>;
+    /** Ref to the underlying input element */
     inputRef?: React.Ref<HTMLInputElement>;
+    /** Renders the partial state; the change event still reports `checked: true` */
     indeterminate?: boolean;
+    /** Text shown beside the switch; makes the container a `<label>` */
     label?: string;
+    /** Which side of the switch the label sits on. Defaults to `right` */
     labelPlacement?: 'left' | 'right';
+    /** Track colour while the switch is on */
     toggleColor?: React.CSSProperties['color'] | Color;
 }

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

@@ -3,14 +3,19 @@ import type { TooltipClasses, TooltipProps as MuiTooltipProps } from '@mui/mater
 export type Position = Pick<TooltipProps, 'placement'>;
 export type TooltipSizes = 'small' | 'large';
 export interface TooltipSize {
+    /** Arrow width in px */
     width: number;
+    /** Arrow height in px */
     height: number;
 }
 export type TooltipPlacement = TooltipClasses['tooltipPlacementBottom'] | TooltipClasses['tooltipPlacementLeft'] | TooltipClasses['tooltipPlacementRight'] | TooltipClasses['tooltipPlacementTop'];
 export type ArrowSizeBySize = Record<TooltipSizes, TooltipSize>;
 export type TooltipPlacementToSize = Record<TooltipPlacement, ArrowSizeBySize>;
 export interface TooltipProps extends MuiTooltipProps {
+    /** Icon rendered before the title; `small` size only */
     icon?: ReactNode;
+    /** Padding and typography preset. Defaults to `small` */
     size?: TooltipSizes;
+    /** Removes the tooltip's inner padding, for content that brings its own */
     noPadding?: boolean;
 }

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

@@ -1,14 +1,23 @@
 import { UppyFile } from '@uppy/core';
 export interface UploadFileProps {
+    /** Uppy file whose name, size and progress are rendered */
     file: UppyFile;
+    /** Called with the file id when its cancel button is clicked */
     onCancel?: (id: string) => void;
+    /** Called with the file id when a failed upload is retried */
     onRetry?: (id: string) => void;
 }
 export interface UploadManagerProps {
+    /** Heading of the upload panel */
     title: string;
+    /** Secondary line under the title, e.g. overall progress */
     subTitle?: string;
+    /** Files listed in the panel */
     files: UppyFile[];
+    /** Called when the panel's close button is clicked */
     onClose?: () => void;
+    /** Called with the file id when a file's cancel button is clicked */
     onCancel?: (id: string) => void;
+    /** Called with the file id when a failed upload is retried */
     onRetry?: (id: string) => void;
 }

package/dist/types/presentations/Accordion/Accordion.types.d.ts

@@ -4,18 +4,29 @@ import { FreeTextProps } from '../FreeText';
 import { StatisticProps } from '../Statistic';
 import { ScoreProps } from '../Score';
 export interface AccordionSpec {
+    /** Discriminator identifying this spec as an accordion */
     componentType: 'accordion';
+    /** Section heading shown in the summary row */
     title: string;
+    /** Text size and weight preset for the summary row */
     size?: PresentationElementSize;
+    /** Components rendered inside the expanded section; must contain at least one item */
     items: (StatisticProps | FreeTextProps | ScoreProps)[];
+    /** Whether the section starts expanded */
     isOpen?: boolean;
+    /** Components rendered in a tooltip behind an info icon before the title */
     tooltip?: (StatisticProps | FreeTextProps)[];
+    /** Value appended to the title as `title: metrics` */
     metrics?: string;
 }
 interface AccordionProps extends AccordionSpec {
+    /** Props forwarded to the underlying MUI Accordion */
     MuiAccordionProps?: MuiAccordionProps;
+    /** Props forwarded to the underlying MUI AccordionSummary */
     AccordionSummaryProps?: AccordionSummaryProps;
+    /** Props forwarded to the underlying MUI AccordionDetails */
     AccordionDetailsProps?: AccordionDetailsProps;
+    /** Called with the next expanded state when the summary row is clicked */
     onChange?: (event: React.SyntheticEvent, expanded: boolean) => void;
 }
 export type { AccordionProps };

package/dist/types/presentations/AnalysisBar/AnalysisBar.types.d.ts

@@ -8,15 +8,23 @@ export interface AnalysisBarLevel {
 /** Either a numeric string ('20', '20%') that doubles as its own label, or an explicitly positioned label */
 export type AnalysisBarExpressionLevel = string | AnalysisBarLevel;
 export interface AnalysisBarProps {
+    /** Discriminator identifying this spec as an analysis bar */
     componentType: 'analysisBar';
+    /** Widens segments of 1% or less to a fixed 12px so they stay visible */
     isCutoff?: boolean;
+    /** Axis labels under the bar. Numeric strings are placed at their own value; objects at their `position` */
     expressionLevels?: AnalysisBarExpressionLevel[];
+    /** Caption rendered at the midpoint of the bar */
     caption?: string;
+    /** Colour segments making up the bar; widths are normalised to 100%. A `jet` colour renders a heatmap gradient */
     segments?: {
         color: 'jet' | string;
         width: number;
     }[];
+    /** Value of the point indicator, which also sets its position on the bar */
     expressionValue?: string;
+    /** Overrides the displayed text of the axis label at the same index, leaving its position unchanged */
     expressionLabels?: string[];
+    /** Renders the whole bar at reduced opacity */
     isDimmed?: boolean;
 }

package/dist/types/presentations/FreeText/FreeText.types.d.ts

@@ -1,9 +1,14 @@
 import type { PresentationElementSize } from '../presentations.types';
 interface FreeTextProps {
+    /** Discriminator identifying this spec as free text */
     componentType: 'freeText';
+    /** Text size and weight preset */
     size?: PresentationElementSize;
+    /** Text to render; line breaks are preserved */
     content: string;
+    /** Fixed height in px; the text scrolls when it overflows. Grows with the content when omitted */
     height?: number;
+    /** Wraps the text in a rounded grey panel with padding */
     background?: boolean;
 }
 export type { FreeTextProps };

package/dist/types/presentations/Histogram/Histogram.types.d.ts

@@ -1,24 +1,38 @@
 import { FreeTextProps } from '../FreeText';
 export interface HistogramTab {
+    /** Tab label shown above the chart */
     label: string;
+    /** Bar heights, one entry per bucket */
     data: number[];
 }
 export interface HistogramProps {
+    /** Discriminator identifying this spec as a histogram */
     componentType: 'histogram';
+    /** Heading shown above the tabs */
     title?: string;
+    /** Free text blocks rendered under the chart */
     description?: FreeTextProps[];
+    /** Tick values along the x axis; must contain at least one item */
     xAxisLabels: number[];
+    /** Tick values along the y axis; must contain at least one item */
     yAxisLabels: number[];
+    /** Datasets selectable by tab; the first one is shown initially */
     tabs: HistogramTab[];
 }
 export interface HistogramTabsProps {
+    /** Tab labels in display order */
     options: string[];
+    /** Index of the selected tab */
     active: number;
+    /** Called with the index of the newly selected tab */
     onChange: (index: number) => void;
 }
 export interface HistogramChartProps {
+    /** Dataset to plot */
     dataset: HistogramTab;
+    /** Tick values along the x axis */
     xAxisLabels: number[];
+    /** Tick values along the y axis */
     yAxisLabels: number[];
 }
 interface HistogramDatapoint {

package/dist/types/presentations/HorizonDivider/HorizonDivider.types.d.ts

@@ -1,4 +1,5 @@
 interface HorizonDividerProps {
+    /** Discriminator identifying this spec as a divider */
     componentType: 'divider';
 }
 export type { HorizonDividerProps };

package/dist/types/presentations/ModelType/ModelType.types.d.ts

@@ -1,33 +1,50 @@
 import { SelectChangeEvent } from '@mui/material/Select';
 import { ScoreProps } from '../Score';
 interface ModelTypeOption {
+    /** Option label shown in the dropdown */
     title: string;
+    /** Visualization this option switches the viewer to. Read by the host app, not by this component */
     target: {
         visualizationType: string;
         annotation: {
+            /** Annotation name; must match the LOAR annotation it refers to */
             name: string;
+            /** Measurement region, also used as the option's dropdown value */
             dimension: string;
             color: string;
         };
     };
     key: string;
     value: number;
+    /** Sensitivity of this model type; must be a number */
     sensitivity: number;
+    /** Specificity of this model type; must be a number */
     specificity: number;
 }
 export interface ModelTypeSpec {
+    /** Discriminator identifying this spec as a model type selector */
     componentType: 'modelType';
+    /** Heading shown above the sensitivity and specificity scores */
     title: string;
+    /** Subtitle rendered at the top of the dropdown list */
     optionTitle?: string;
+    /** Scores to show per model type, keyed by the option's `target.annotation.dimension` */
     scoreItems: Record<string, ScoreProps[]>;
+    /** Sensitivity of the currently applied model type */
     currentSensitivity: ScoreProps;
+    /** Specificity of the currently applied model type */
     currentSpecificity: ScoreProps;
+    /** Selectable model types; must contain at least one item */
     options: ModelTypeOption[];
+    /** Dimension of the model type currently applied; selects the initial dropdown value */
     userModelType: string;
+    /** Guidance text rendered under the update button */
     description?: string;
 }
 export interface ModelTypeProps extends ModelTypeSpec {
+    /** Called when a different model type is picked from the dropdown */
     onChangeDropdown: (event: SelectChangeEvent) => void;
+    /** Called when the update button is pressed; the button is disabled until the selection changes */
     onClickUpdateConfiguration: () => void;
 }
 export {};

package/dist/types/presentations/Preview/Preview.types.d.ts

@@ -9,7 +9,9 @@ import { ThresholdProps } from '../Threshold';
 import { HistogramProps } from '../Histogram';
 import { ModelTypeProps } from '../ModelType';
 interface PreviewProps {
+    /** Layer toggles rendered in the upper section, in display order */
     visualizationControls: (ToggleControlProps | ToggleControlGroupProps | AnalysisBarProps)[];
+    /** Result summary components rendered in the lower section, in display order */
     analysisSummary: (AccordionProps | AnalysisBarProps | StatisticProps | ScoreProps | FreeTextProps | ThresholdProps | HistogramProps | ModelTypeProps)[];
 }
 export type { PreviewProps };

package/dist/types/presentations/Score/Score.types.d.ts

@@ -1,12 +1,20 @@
 import { PresentationElementSize } from '../presentations.types';
 interface ScoreProps {
+    /** Discriminator identifying this spec as a score */
     componentType: 'score';
+    /** Score name shown before the value */
     title: string;
+    /** Text size and weight preset */
     size?: PresentationElementSize;
+    /** The score value and how it is coloured */
     metrics: {
+        /** Formatted score value shown after the title */
         value?: string;
+        /** Qualitative result appended after the value, capitalised on render */
         scoreType?: 'positive' | 'negative';
+        /** Colour applied to the score type, and to the whole line when `isFullColored` is set */
         color?: string;
+        /** Applies `color` to the title and value as well, not just the score type */
         isFullColored?: boolean;
     };
 }

package/dist/types/presentations/Statistic/Statistic.types.d.ts

@@ -1,15 +1,24 @@
 import { BoxProps } from '@mui/material';
 import { PresentationSymbolProps } from '../presentations.types';
 export interface StatisticSpec extends BoxProps {
+    /** Discriminator identifying this spec as a statistic */
     componentType: 'statistic';
+    /** Label describing the metric */
     title: string;
+    /** `horizontal` puts the value on the same line as the title, `vertical` stacks them */
     layout?: 'horizontal' | 'vertical';
+    /** Formatted value shown next to the title */
     metrics?: string;
+    /** Text size and weight preset */
     size?: 'small-dimmed' | 'small' | 'small-bold' | 'medium' | 'medium-bold' | 'large-bold';
+    /** Shape of the legend marker drawn before the title; horizontal layout only */
     symbol?: PresentationSymbolProps['symbol'];
+    /** Fill colour of the legend marker */
     color?: string;
+    /** DOM id applied to the container */
     id?: string;
 }
 export interface StatisticProps extends StatisticSpec {
+    /** Renders the marker and title at reduced opacity */
     isDimmed?: boolean;
 }

package/dist/types/presentations/Threshold/Threshold.types.d.ts

@@ -4,9 +4,13 @@ import { SelectChangeEvent } from '@mui/material/Select';
 import { ScoreProps } from '../Score';
 import { StatisticProps } from '../Statistic';
 export interface ThresholdOption {
+    /** Option label shown in the dropdown, also used as its value */
     title: string;
+    /** Grouping key for the option. Read by the host app, not by this component */
     category: string;
+    /** Threshold this option applies, on the 0-100 intensity scale */
     value: number;
+    /** Marks the option as a fixed preset, which locks the slider. Read by the host app, not by this component */
     isPreset?: boolean;
 }
 export interface ThresholdMark {
@@ -16,33 +20,49 @@ export interface ThresholdMark {
     label?: string;
 }
 export interface ThresholdSpec {
+    /** Discriminator identifying this spec as a threshold control */
     componentType: 'threshold';
     /** Overall score summary shown above the cell statistics; omitted when the analysis has no score */
     totalScore?: ScoreProps;
+    /** Total cell count shown above the per-category statistics */
     totalCells: StatisticProps;
+    /** Per-category cell statistics shown under the total */
     statisticItems: StatisticProps[];
+    /** Heading shown above the option dropdown */
     title?: string;
+    /** Guidance text shown under the slider, chosen by whether a preset is selected */
     description?: {
         /** Guidance shown while a preset option is selected */
         preset?: string;
         /** Guidance shown while a user-adjustable option is selected */
         user?: string;
     };
+    /** Selectable threshold options listed in the dropdown */
     options: ThresholdOption[];
+    /** Slider increment; defaults to 1 */
     controlStep?: number;
     /** Labels the selected option's threshold on the slider, e.g. `Default: 40`; off by default */
     showDefaultMark?: boolean;
 }
 export interface ThresholdProps extends ThresholdSpec {
+    /** Current selection and slider position, owned by the host app */
     thresholdState?: {
+        /** Title of the selected option */
         selectedItem: string;
+        /** Current slider position on the 0-100 intensity scale */
         sliderValue: number;
+        /** Locks the slider and shows `description.preset` instead of `description.user` */
         isPresetSelected: boolean;
     };
+    /** Called when a different option is picked from the dropdown */
     onChangeDropdown: (event: SelectChangeEvent) => void;
+    /** Called on every slider movement */
     onChangeSlider: (event: Event | SyntheticEvent, value: number | number[]) => void;
+    /** Called once the slider is released */
     onSliderChangeCommitted: (event: Event | SyntheticEvent, value: number | number[]) => void;
+    /** Called when the update button is pressed */
     onClickUpdateConfiguration: () => void;
+    /** Shows a spinner on the update button and blocks it */
     isLoading?: boolean;
 }
 export interface BaseSliderProps extends SliderProps {

package/dist/types/presentations/ToggleControl/ToggleControl.types.d.ts

@@ -3,47 +3,76 @@ import type { AnalysisBarProps } from '../AnalysisBar';
 import type { PresentationElementSize, PresentationSymbol } from '../presentations.types';
 import { StatisticProps } from '../Statistic';
 export interface ToggleControlSpec {
+    /** Discriminator identifying this spec as a toggle */
     componentType: 'toggle';
+    /** Label shown next to the switch */
     title: string;
+    /** Text size and weight preset */
     size?: PresentationElementSize;
+    /** Shape of the legend marker drawn before the title */
     symbol?: PresentationSymbol;
+    /** Fill colour of the legend marker */
     color?: string;
+    /** Whether the switch is on; required */
     checked: boolean;
+    /** Components rendered in a tooltip behind an info icon before the title */
     tooltip?: (StatisticProps | FreeTextProps)[];
+    /** Statistics rendered under the toggle row */
     content?: StatisticProps[];
+    /** Analysis bar rendered under the toggle row, below `content` */
     bar?: AnalysisBarProps;
 }
 interface PixelAnnotationSpec {
+    /** Annotation name; must match the LOAR `pixelAnnotations` entry */
     name: string;
+    /** Single measurement region to render */
     dimension?: string;
+    /** Multiple measurement regions to render */
     dimensions?: string[];
 }
 interface CellAnnotationSpec {
+    /** Annotation name; must match the LOAR `cellAnnotations` entry */
     name: string;
 }
 interface GridAnnotationSpec {
+    /** Annotation name; must match the LOAR `gridAnnotations` entry */
     name: string;
 }
 interface CutOffLabelProps {
+    /** Colour applied to the label's segment */
     color: string;
+    /** Index of the label within the annotation's label set */
     labelIndex: number;
 }
+/** Visualization layer a toggle controls. Read by the host app, not by this component */
 interface TargetSpec {
+    /** Kind of visualization to render, e.g. `cell`, `grid`, `heatmap` */
     visualizationType: string;
     annotationId?: string;
+    /** Annotation to render, either a spec object or the annotation name */
     annotation: PixelAnnotationSpec | CellAnnotationSpec | GridAnnotationSpec | string;
+    /** Single annotation label to render */
     label?: string;
     labelId?: string;
+    /** Multiple annotation labels to render, optionally with per-label colours */
     labels?: (string | CutOffLabelProps)[];
+    /** Single colour applied to the layer */
     color?: string;
+    /** Per-label colours applied to the layer */
     colors?: string[];
 }
 export interface ToggleControlProps extends ToggleControlSpec {
+    /** Marks this toggle as a group header, adding spacing below it. Set by ToggleControlGroup */
     isParent?: boolean;
+    /** Renders the marker and title at reduced opacity, and blocks the switch */
     isDimmed?: boolean;
+    /** Blocks interaction with the switch */
     disabled?: boolean;
+    /** Visualization layer this toggle controls. Read by the host app, not by this component */
     target?: TargetSpec;
+    /** Marks this toggle as the master switch for every layer. Read by the host app, not by this component */
     isMaster?: boolean;
+    /** Called when the switch is flipped */
     onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
 }
 export {};

package/dist/types/presentations/ToggleControlGroup/ToggleControlGroup.types.d.ts

@@ -5,17 +5,28 @@ import { StatisticProps } from '../Statistic';
 import type { ToggleControlProps } from '../ToggleControl';
 export type ToggleControlGroupBehavior = 'exclusive' | 'multi';
 export interface ToggleGroupControlSpec {
+    /** Discriminator identifying this spec as a toggle group */
     componentType: 'toggleGroup';
+    /** Label shown next to the group's own switch */
     title: string;
+    /** Whether the children may be on together (`multi`) or only one at a time (`exclusive`). Read by the host app, not by this component */
     behavior?: ToggleControlGroupBehavior;
+    /** Text size and weight preset for the group header */
     size?: PresentationElementSize;
+    /** Components rendered in a tooltip behind an info icon before the title */
     tooltip?: (StatisticProps | FreeTextProps)[];
+    /** Analysis bar rendered under the group header row */
     bar?: AnalysisBarProps;
+    /** Whether the group switch is on; turning it off dims and disables every child. Required */
     checked: boolean;
+    /** Toggles rendered under the group header; must contain at least one item */
     childToggles: ToggleControlProps[];
 }
 export interface ToggleControlGroupProps extends ToggleGroupControlSpec {
+    /** Called when the group switch is flipped */
     onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    /** Blocks interaction with the group switch */
     disabled?: boolean;
+    /** Renders the group and its children at reduced opacity */
     isDimmed?: boolean;
 }

package/dist/types/presentations/presentations.types.d.ts

@@ -2,13 +2,19 @@ import { TypographyProps } from '@mui/material';
 export type PresentationElementSize = 'small-dimmed' | 'small' | 'small-bold' | 'medium' | 'medium-bold' | 'large-bold';
 export type PresentationSymbol = 'circle' | 'rectangle' | 'border-circle' | 'border-rectangle';
 interface PresentationSymbolProps {
+    /** Shape of the legend marker drawn next to a label */
     symbol?: PresentationSymbol;
+    /** Fill colour of the legend marker */
     color?: string;
+    /** Renders the marker at reduced opacity */
     isDimmed?: boolean;
 }
 interface PresentationTypographyProps extends TypographyProps {
+    /** Text size and weight preset */
     size?: PresentationElementSize;
+    /** Renders the text at reduced opacity */
     isDimmed?: boolean;
+    /** CSS display mode of the text element */
     display?: 'block' | 'inline-block' | 'flex' | 'inherit';
 }
 export type { PresentationSymbolProps, PresentationTypographyProps };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lunit/oui",
-  "version": "3.1.1",
+  "version": "3.1.2",
   "validate-branch-name": {
     "pattern": "^(main|develop)|(feature|fix|release|hotfix|qe)/.+$",
     "errorMsg": "The branch name is not correct. Please check the pattern. (ex. feature/add-something)"