import { mergeProps, splitProps } from "solid-js";
import classNames from "./classnames";
import FormGroup from "./FormGroup";
import { useBootstrapPrefix } from "./ThemeProvider";
const defaultProps = {};
const FloatingLabel = (p) => {
    const [local, props] = splitProps(mergeProps(defaultProps, p), [
        "bsPrefix",
        "className",
        "children",
        "controlId",
        "label",
    ]);
    const bsPrefix = useBootstrapPrefix(local.bsPrefix, "form-floating");
    return (<FormGroup className={classNames(local.className, bsPrefix)} controlId={local.controlId} {...props}>
      {local.children}
      <label htmlFor={local.controlId}>{local.label}</label>
    </FormGroup>);
};
export default FloatingLabel;