@pnp/spfx-controls-react/lib-commonjs/controls/modernTaxonomyPicker/termItem/TermItem.js

Reusable React controls for SharePoint Framework solutions

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.TermItem = exports.TermItemBase = void 0;
var tslib_1 = require("tslib");
var Utilities_1 = require("@fluentui/react/lib/Utilities");
var React = tslib_1.__importStar(require("react"));
var TermItem_styles_1 = require("./TermItem.styles");
var Button_1 = require("@fluentui/react/lib/Button");
var getClassNames = (0, Utilities_1.classNamesFunction)();
/**
 * {@docCategory TagPicker}
 */
var TermItemBase = function (props) {
    var theme = props.theme, styles = props.styles, selected = props.selected, disabled = props.disabled, enableTermFocusInDisabledPicker = props.enableTermFocusInDisabledPicker, children = props.children, className = props.className, index = props.index, onRemoveItem = props.onRemoveItem, removeButtonAriaLabel = props.removeButtonAriaLabel;
    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": (enableTermFocusInDisabledPicker || !disabled) && true },
        React.createElement("span", { className: classNames.text, "aria-label": children, title: children }, children),
        React.createElement(Button_1.IconButton, { onClick: onRemoveItem, disabled: disabled, iconProps: { iconName: 'Cancel', styles: { root: { fontSize: '12px' } } }, className: classNames.close, ariaLabel: removeButtonAriaLabel })));
};
exports.TermItemBase = TermItemBase;
exports.TermItem = (0, Utilities_1.styled)(exports.TermItemBase, TermItem_styles_1.getStyles, undefined, {
    scope: 'TermItem',
});
//# sourceMappingURL=TermItem.js.map