@uifabric/experiments
Version:
Experimental React components for building experiences for Microsoft 365.
26 lines • 1.82 kB
JavaScript
import { __assign } from "tslib";
import * as React from 'react';
import { classNamesFunction, css, styled } from 'office-ui-fabric-react/lib/Utilities';
import { CommandButton, IconButton } from 'office-ui-fabric-react/lib/Button';
import { getStyles } from './SuggestionsItem.styles';
var getClassNames = classNamesFunction();
export var SuggestionsItemInner = function (props) {
var suggestionModel = props.suggestionModel, RenderSuggestion = props.onRenderSuggestion, onClick = props.onClick, className = props.className, onRemoveItem = props.onRemoveItem, isSelectedOverride = props.isSelectedOverride, removeButtonAriaLabel = props.removeButtonAriaLabel, styles = props.styles, theme = props.theme;
var classNames = styles
? // TODO don't do this horrible hack to get around `styled` typing problems.
getClassNames(styles || getStyles, {
theme: theme,
className: className,
suggested: suggestionModel.selected || isSelectedOverride,
})
: {
itemButton: css('ms-Suggestions-itemButton'),
closeButton: css('ms-Suggestions-closeButton'),
};
return (React.createElement("div", { className: classNames.root },
React.createElement(CommandButton, { onClick: onClick, className: classNames.itemButton },
React.createElement(RenderSuggestion, __assign({}, props.suggestionModel))),
props.showRemoveButton ? (React.createElement(IconButton, { iconProps: { iconName: 'Cancel', styles: { root: { fontSize: '12px' } } }, title: removeButtonAriaLabel, ariaLabel: removeButtonAriaLabel, onClick: onRemoveItem, className: classNames.closeButton })) : null));
};
export var SuggestionsItem = styled(SuggestionsItemInner, getStyles);
//# sourceMappingURL=SuggestionsItem.js.map