From b0752daf7e54f2f56e8b33a081a710492f44072b Mon Sep 17 00:00:00 2001 From: PKulkoRaccoonGang Date: Thu, 12 Oct 2023 11:10:35 +0300 Subject: [PATCH] refactor: refactoring after review --- src/Form/FormCheckbox.jsx | 18 ++++--- src/Form/FormRadio.jsx | 63 +++++++++++------------ src/Menu/__snapshots__/Menu.test.jsx.snap | 1 + 3 files changed, 43 insertions(+), 39 deletions(-) diff --git a/src/Form/FormCheckbox.jsx b/src/Form/FormCheckbox.jsx index 0fa1f061c1f..d2e1951ba52 100644 --- a/src/Form/FormCheckbox.jsx +++ b/src/Form/FormCheckbox.jsx @@ -62,7 +62,7 @@ const FormCheckbox = React.forwardRef(({ floatLabelLeft, ...props }, ref) => { - const { getCheckboxControlProps, hasCheckboxSetProvider } = useCheckboxSetContext(); + const { hasCheckboxSetProvider } = useCheckboxSetContext(); const { hasFormGroupProvider, useSetIsControlGroupEffect, getControlProps } = useFormGroupContext(); useSetIsControlGroupEffect(true); const shouldActAsGroup = hasFormGroupProvider && !hasCheckboxSetProvider; @@ -70,14 +70,11 @@ const FormCheckbox = React.forwardRef(({ ...getControlProps({}), role: 'group', } : {}; - const checkboxInputProps = getCheckboxControlProps({ - ...props, - className: controlClassName, - }); + const control = React.createElement(controlAs, { ...props, className: controlClassName, ref }); return ( @@ -85,7 +82,7 @@ const FormCheckbox = React.forwardRef(({ className={classNames('pgn__form-checkbox', className, { 'pgn__form-control-valid': isValid, 'pgn__form-control-invalid': isInvalid, - 'pgn__form-control-disabled': checkboxInputProps.disabled, + 'pgn__form-control-disabled': props.disabled, 'pgn__form-control-label-left': !!floatLabelLeft, })} {...groupProps} @@ -107,6 +104,8 @@ const FormCheckbox = React.forwardRef(({ }); FormCheckbox.propTypes = { + /** Specifies id of the FormCheckbox component. */ + id: PropTypes.string, /** Specifies contents of the component. */ children: PropTypes.node.isRequired, /** Specifies class name to append to the base element. */ @@ -123,10 +122,14 @@ FormCheckbox.propTypes = { isValid: PropTypes.bool, /** Specifies control element. */ controlAs: PropTypes.elementType, + /** Specifies whether the floating label should be aligned to the left. */ floatLabelLeft: PropTypes.bool, + /** Specifies whether the `FormCheckbox` is disabled. */ + disabled: PropTypes.bool, }; FormCheckbox.defaultProps = { + id: undefined, className: undefined, controlClassName: undefined, labelClassName: undefined, @@ -135,6 +138,7 @@ FormCheckbox.defaultProps = { isValid: false, controlAs: CheckboxControl, floatLabelLeft: false, + disabled: false, }; export { CheckboxControl }; diff --git a/src/Form/FormRadio.jsx b/src/Form/FormRadio.jsx index 2cbacbff0f4..4021e408d54 100644 --- a/src/Form/FormRadio.jsx +++ b/src/Form/FormRadio.jsx @@ -40,42 +40,37 @@ const FormRadio = React.forwardRef(({ isInvalid, isValid, ...props -}, ref) => { - const { getRadioControlProps } = useRadioSetContext(); - const radioInputProps = getRadioControlProps({ - ...props, - className: controlClassName, - }); - return ( - ( + +
-
- -
- - {children} - - {description && ( - - {description} - - )} -
+ +
+ + {children} + + {description && ( + + {description} + + )}
- - ); -}); +
+ +)); FormRadio.propTypes = { + /** Specifies id of the FormRadio component. */ + id: PropTypes.string, /** Specifies contents of the component. */ children: PropTypes.node.isRequired, /** Specifies class name to append to the base element. */ @@ -90,15 +85,19 @@ FormRadio.propTypes = { isInvalid: PropTypes.bool, /** Specifies whether to display component in valid state, this affects styling. */ isValid: PropTypes.bool, + /** Specifies whether the `FormRadio` is disabled. */ + disabled: PropTypes.bool, }; FormRadio.defaultProps = { + id: undefined, className: undefined, controlClassName: undefined, labelClassName: undefined, description: undefined, isInvalid: false, isValid: false, + disabled: false, }; export { RadioControl }; diff --git a/src/Menu/__snapshots__/Menu.test.jsx.snap b/src/Menu/__snapshots__/Menu.test.jsx.snap index ced5b214032..75f4f1b1cf2 100644 --- a/src/Menu/__snapshots__/Menu.test.jsx.snap +++ b/src/Menu/__snapshots__/Menu.test.jsx.snap @@ -126,6 +126,7 @@ exports[`Menu Item renders correctly renders as expected with menu items 1`] = ` >