@fluentui/react-northstar
Version:
A themable React component library.
75 lines (74 loc) • 3.42 kB
TypeScript
import { Accessibility, DropdownSelectedItemBehaviorProps } from '@fluentui/accessibility';
import * as React from 'react';
import * as PropTypes from 'prop-types';
import { ComponentEventHandler, ShorthandValue, ComponentKeyboardEventHandler, FluentComponentStaticProps } from '../../types';
import { UIComponentProps } from '../../utils/commonPropInterfaces';
import { ImageProps } from '../Image/Image';
import { BoxProps } from '../Box/Box';
export interface DropdownSelectedItemSlotClassNames {
header: string;
icon: string;
image: string;
}
export interface DropdownSelectedItemProps extends UIComponentProps<DropdownSelectedItemProps> {
/**
* Accessibility behavior if overridden by the user.
*/
accessibility?: Accessibility<DropdownSelectedItemBehaviorProps>;
/** A selected item can be active. */
active?: boolean;
/** Header of the selected item. */
header?: ShorthandValue<BoxProps>;
/** Icon of the selected item. */
icon?: ShorthandValue<BoxProps>;
/** Image of the selected item. */
image?: ShorthandValue<ImageProps>;
/** A dropdown selected item can show that it cannot be interacted with. */
disabled?: boolean;
/**
* Called on selected item click.
*
* @param event - React's original SyntheticEvent.
* @param data - All props and proposed value.
*/
onClick?: ComponentEventHandler<DropdownSelectedItemProps>;
/**
* Called on selected item key down.
*
* @param event - React's original SyntheticEvent.
* @param data - All props and proposed value.
*/
onKeyDown?: ComponentKeyboardEventHandler<DropdownSelectedItemProps>;
/**
* Called when item is removed from the selection list.
*
* @param event - React's original SyntheticEvent.
* @param data - All props and proposed value.
*/
onRemove?: ComponentEventHandler<DropdownSelectedItemProps>;
}
export declare const dropdownSelectedItemClassName = "ui-dropdown__selecteditem";
export declare const dropdownSelectedItemSlotClassNames: DropdownSelectedItemSlotClassNames;
export declare type DropdownSelectedItemStylesProps = {
hasImage: boolean;
};
/**
* A DropdownSelectedItem represents a selected item of 'multiple-selection' Dropdown.
*/
export declare const DropdownSelectedItem: (<TExtendedElementType extends React.ElementType<any> = "span">(props: React.RefAttributes<HTMLSpanElement> & Omit<import("@fluentui/react-bindings").PropsOfElement<TExtendedElementType>, "as" | keyof DropdownSelectedItemProps> & {
as?: TExtendedElementType;
} & DropdownSelectedItemProps) => JSX.Element) & {
propTypes?: React.WeakValidationMap<DropdownSelectedItemProps> & {
as: React.Requireable<string | ((props: any, context?: any) => any) | (new (props: any, context?: any) => any)>;
};
contextTypes?: PropTypes.ValidationMap<any>;
defaultProps?: Partial<DropdownSelectedItemProps & {
as: "span";
}>;
displayName?: string;
readonly __PRIVATE_PROPS?: React.RefAttributes<HTMLSpanElement> & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "key" | keyof React.HTMLAttributes<HTMLSpanElement>> & {
ref?: React.Ref<HTMLSpanElement>;
}, "as" | keyof DropdownSelectedItemProps> & {
as?: "span";
} & DropdownSelectedItemProps;
} & FluentComponentStaticProps<DropdownSelectedItemProps>;