fix: remove focus on unselecting the checkbox

affects: @medly-components/core, @medly-components/forms
medly · Jul 10, 2024 · a21e9d9 · a21e9d9
1 parent b903371
commit a21e9d9
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 3 deletions.
diff --git a/packages/core/src/components/Accordion/types.ts b/packages/core/src/components/Accordion/types.ts
@@ -12,7 +12,7 @@ export type AccordionContextType = [
     Dispatch<SetStateAction<boolean>> /** Function to be called to toggle the active state */
 ];
 
-export type AccordionProps = {
+export type AccordionProps = Omit<HTMLProps<HTMLDivElement>, 'onChange'> & {
     /** Use to render any component as Button */
     as?: keyof JSX.IntrinsicElements | React.ComponentType<any>;
     /** Set it true to open the accordion by default */

diff --git a/packages/core/src/components/Checkbox/Checkbox.tsx b/packages/core/src/components/Checkbox/Checkbox.tsx
@@ -1,5 +1,5 @@
 import { CheckIcon, MinimizeIcon } from '@medly-components/icons';
-import { isValidStringOrNumber, useCombinedRefs, useKeyPress, WithStyle } from '@medly-components/utils';
+import { WithStyle, isValidStringOrNumber, useCombinedRefs, useKeyPress } from '@medly-components/utils';
 import { ChangeEvent, FC, FocusEvent, forwardRef, memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { SelectorLabel } from '../Selectors';
 import * as Styled from './Checkbox.styled';
@@ -51,7 +51,10 @@ const Component: FC<CheckboxProps> = memo(
                 [validate, props.onInvalid]
             ),
             onChange = useCallback(
-                (event: ChangeEvent<HTMLInputElement>) => validate(event, props.onChange, false),
+                (event: ChangeEvent<HTMLInputElement>) => {
+                    validate(event, props.onChange, false);
+                    !event.target.checked && event.target.blur();
+                },
                 [validate, props.onChange]
             );