From b181444d6c6360d42cf76997a10e7373361409a7 Mon Sep 17 00:00:00 2001 From: jinhojang6 Date: Tue, 7 Mar 2023 02:34:53 +0900 Subject: [PATCH] refactor: refactor checkbox group component --- .../CheckboxGroup/CheckboxGroup.context.ts | 5 +---- .../CheckboxGroup/CheckboxGroup.tsx | 21 ++++--------------- 2 files changed, 5 insertions(+), 21 deletions(-) diff --git a/packages/lsd-react/src/components/CheckboxGroup/CheckboxGroup.context.ts b/packages/lsd-react/src/components/CheckboxGroup/CheckboxGroup.context.ts index 3e08151..7c4bdc2 100644 --- a/packages/lsd-react/src/components/CheckboxGroup/CheckboxGroup.context.ts +++ b/packages/lsd-react/src/components/CheckboxGroup/CheckboxGroup.context.ts @@ -1,10 +1,7 @@ import React from 'react' -import { ActiveCheckboxType, CheckboxGroupProps } from './CheckboxGroup' +import { CheckboxGroupProps } from './CheckboxGroup' export type CheckboxGroupContextType = { - activeCheckbox?: ActiveCheckboxType | null - setActiveCheckbox: (value: ActiveCheckboxType) => void - size?: CheckboxGroupProps['size'] } diff --git a/packages/lsd-react/src/components/CheckboxGroup/CheckboxGroup.tsx b/packages/lsd-react/src/components/CheckboxGroup/CheckboxGroup.tsx index bcfb20b..178826f 100644 --- a/packages/lsd-react/src/components/CheckboxGroup/CheckboxGroup.tsx +++ b/packages/lsd-react/src/components/CheckboxGroup/CheckboxGroup.tsx @@ -1,5 +1,5 @@ import clsx from 'clsx' -import React, { useEffect, useRef, useState } from 'react' +import React from 'react' import { CheckboxGroupContext } from './CheckboxGroup.context' import { checkboxGroupClasses } from './CheckboxGroup.classes' import { Typography } from '../Typography' @@ -7,29 +7,16 @@ import { Typography } from '../Typography' export type ActiveCheckboxType = string | number | readonly string[] export type CheckboxGroupProps = React.HTMLAttributes & { - activeCheckbox?: ActiveCheckboxType | null size?: 'small' | 'medium' | 'large' label?: string } export const CheckboxGroup: React.FC & { classes: typeof checkboxGroupClasses -} = ({ size = 'large', label, activeCheckbox, children, ...props }) => { - const ref = useRef(null) - const [value, setValue] = useState(activeCheckbox) - - const setActiveCheckbox = (radioButton: ActiveCheckboxType) => { - setValue(radioButton) - } - - useEffect(() => setValue(activeCheckbox), [activeCheckbox]) - +} = ({ size = 'large', label, children, ...props }) => { return ( - +
@@ -38,7 +25,7 @@ export const CheckboxGroup: React.FC & { variant={size === 'small' ? 'label2' : 'label1'} className={checkboxGroupClasses.label} > - {label && label} + {label} {children}