@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
61 lines (60 loc) • 2.73 kB
TypeScript
import React from 'react';
import type { FieldBlockWidth } from '../../FieldBlock';
import type { ReturnAdditional } from '../../hooks/useFieldProps';
import type { DefaultErrorMessages, FieldProps, Path } from '../../types';
import type { Data } from '../Selection';
import type { CheckboxProps } from '../../../../components/Checkbox';
import type { ToggleButtonProps } from '../../../../components/ToggleButton';
type OptionValue = string | number;
type RenderArraySelectionChildren = (params: {
value: FieldArraySelectionProps['value'];
options: FieldArraySelectionProps['data'];
}) => React.ReactNode;
export type FieldArraySelectionProps = FieldProps<Array<OptionValue> | undefined> & {
children?: React.ReactNode | RenderArraySelectionChildren;
variant?: 'checkbox' | 'button' | 'checkbox-button';
optionsLayout?: 'horizontal' | 'vertical';
/**
* The width of the component.
*/
width?: FieldBlockWidth;
/**
* The path to the context data (Form.Handler).
* The context data object needs to have a `value` and a `title` property.
*/
dataPath?: Path;
/**
* Data to be used for the component. The object needs to have a `value` and a `title` property.
* The generated options will be placed above given JSX based children.
*/
data?: Data;
/**
* The size of the component.
*/
size?: ToggleButtonProps['size'] | CheckboxProps['size'];
errorMessages?: DefaultErrorMessages & {
minItems?: string;
maxItems?: string;
};
};
declare function ArraySelection(props: FieldArraySelectionProps): import("react/jsx-runtime").JSX.Element;
export declare function useCheckboxOrToggleOptions({ id, path, variant, info, warning, emptyValue, htmlAttributes, dataList, children, value, disabled, size, hasError, handleChange, handleActiveData, }: {
id: FieldArraySelectionProps['id'];
path?: FieldArraySelectionProps['path'];
variant?: FieldArraySelectionProps['variant'];
info?: FieldArraySelectionProps['info'];
warning?: FieldArraySelectionProps['warning'];
emptyValue?: FieldArraySelectionProps['emptyValue'];
htmlAttributes?: FieldArraySelectionProps['htmlAttributes'];
dataList?: FieldArraySelectionProps['data'];
children?: React.ReactNode;
value?: FieldArraySelectionProps['value'];
disabled?: FieldArraySelectionProps['disabled'];
size?: FieldArraySelectionProps['size'];
hasError?: ReturnAdditional<FieldArraySelectionProps['value']>['hasError'];
handleChange?: ReturnAdditional<FieldArraySelectionProps['value']>['handleChange'];
handleActiveData?: (item: {
labels: React.ReactNode[];
}) => void;
}): any[];
export default ArraySelection;