You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

76 lines
2.4 KiB

import classNames from 'classnames';
import * as React from 'react';
import { useContext, useMemo } from 'react';
import Feedback from './Feedback';
import FormCheckInput from './FormCheckInput';
import FormCheckLabel from './FormCheckLabel';
import FormContext from './FormContext';
import { useBootstrapPrefix } from './ThemeProvider';
import { hasChildOfType } from './ElementChildren';
import { jsx as _jsx } from "react/jsx-runtime";
import { Fragment as _Fragment } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
const FormCheck = /*#__PURE__*/React.forwardRef(({
id,
bsPrefix,
bsSwitchPrefix,
inline = false,
reverse = false,
disabled = false,
isValid = false,
isInvalid = false,
feedbackTooltip = false,
feedback,
feedbackType,
className,
style,
title = '',
type = 'checkbox',
label,
children,
// Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
as = 'input',
...props
}, ref) => {
bsPrefix = useBootstrapPrefix(bsPrefix, 'form-check');
bsSwitchPrefix = useBootstrapPrefix(bsSwitchPrefix, 'form-switch');
const {
controlId
} = useContext(FormContext);
const innerFormContext = useMemo(() => ({
controlId: id || controlId
}), [controlId, id]);
const hasLabel = !children && label != null && label !== false || hasChildOfType(children, FormCheckLabel);
const input = /*#__PURE__*/_jsx(FormCheckInput, { ...props,
type: type === 'switch' ? 'checkbox' : type,
ref: ref,
isValid: isValid,
isInvalid: isInvalid,
disabled: disabled,
as: as
});
return /*#__PURE__*/_jsx(FormContext.Provider, {
value: innerFormContext,
children: /*#__PURE__*/_jsx("div", {
style: style,
className: classNames(className, hasLabel && bsPrefix, inline && `${bsPrefix}-inline`, reverse && `${bsPrefix}-reverse`, type === 'switch' && bsSwitchPrefix),
children: children || /*#__PURE__*/_jsxs(_Fragment, {
children: [input, hasLabel && /*#__PURE__*/_jsx(FormCheckLabel, {
title: title,
children: label
}), feedback && /*#__PURE__*/_jsx(Feedback, {
type: feedbackType,
tooltip: feedbackTooltip,
children: feedback
})]
})
})
});
});
FormCheck.displayName = 'FormCheck';
export default Object.assign(FormCheck, {
Input: FormCheckInput,
Label: FormCheckLabel
});