office-ui-fabric-react/lib-amd/components/pickers/TagPicker/TagItem.js

Reusable React components for building experiences for Microsoft 365.

define(["require", "exports", "react", "../../../Utilities", "../../../Button", "./TagItem.styles"], function (require, exports, React, Utilities_1, Button_1, TagItem_styles_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var getClassNames = Utilities_1.classNamesFunction();
    /**
     * {@docCategory TagPicker}
     */
    exports.TagItemBase = function (props) {
        var theme = props.theme, styles = props.styles, selected = props.selected, disabled = props.disabled, enableTagFocusInDisabledPicker = props.enableTagFocusInDisabledPicker, children = props.children, className = props.className, index = props.index, onRemoveItem = props.onRemoveItem, removeButtonAriaLabel = props.removeButtonAriaLabel, _a = props.title, title = _a === void 0 ? typeof props.children === 'string' ? props.children : props.item.name : _a;
        var classNames = getClassNames(styles, {
            theme: theme,
            className: className,
            selected: selected,
            disabled: disabled,
        });
        return (React.createElement("div", { className: classNames.root, role: 'listitem', key: index, "data-selection-index": index, "data-is-focusable": (enableTagFocusInDisabledPicker || !disabled) && true },
            React.createElement("span", { className: classNames.text, "aria-label": title, title: title }, children),
            React.createElement(Button_1.IconButton, { onClick: onRemoveItem, disabled: disabled, iconProps: { iconName: 'Cancel', styles: { root: { fontSize: '12px' } } }, className: classNames.close, ariaLabel: removeButtonAriaLabel })));
    };
    exports.TagItem = Utilities_1.styled(exports.TagItemBase, TagItem_styles_1.getStyles, undefined, {
        scope: 'TagItem',
    });
});
//# sourceMappingURL=TagItem.js.map