"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const join_1 = tslib_1.__importDefault(require("../../utils/join"));
const SelectableList_1 = require("../../SelectableList");
const baseClassName = 'ab-ListGroupItem';
const ListGroupItem = React.forwardRef((props, ref) => {
    const { className, active, factory: Tag = 'button', noZebra, ...domProps } = props;
    const onSelectionClick = (0, SelectableList_1.useSelectionEvent)();
    const result = (React.createElement(Tag, { ...domProps, onClick: (event) => {
            if (domProps.onClick) {
                domProps.onClick(event);
            }
            onSelectionClick(event, { index: props.index });
        }, ref: ref, className: (0, join_1.default)(className, baseClassName, noZebra ? `${baseClassName}--no-zebra` : null, `${baseClassName}--${active ? 'active' : 'not-active'}`) }));
    return result;
});
exports.default = ListGroupItem;
