import { mergeProps, splitProps } from "solid-js";
import classNames from "./classnames";
import { Anchor, useDropdownItem, } from "solid-bootstrap-core";
import { useBootstrapPrefix } from "./ThemeProvider";
import { Dynamic } from "solid-js/web";
const defaultProps = {
    as: Anchor,
    disabled: false,
};
const DropdownItem = (p) => {
    const [local, props] = splitProps(mergeProps(defaultProps, p), [
        "as",
        "bsPrefix",
        "className",
        "eventKey",
        "disabled",
        "onClick",
        "active",
    ]);
    const prefix = useBootstrapPrefix(local.bsPrefix, "dropdown-item");
    const [dropdownItemProps, meta] = useDropdownItem({
        get key() {
            return local.eventKey;
        },
        get href() {
            return props.href;
        },
        get disabled() {
            return local.disabled;
        },
        get onClick() {
            return local.onClick;
        },
        get active() {
            return local.active;
        },
    });
    return (<Dynamic component={local.as} {...props} {...dropdownItemProps} className={classNames(local.className, prefix, meta.isActive && "active", local.disabled && "disabled")}>
      {props.children}
    </Dynamic>);
};
export default DropdownItem;
