acid-info/lsd
1
0
Fork 0
mirror of https://github.com/acid-info/lsd.git synced 2025-01-27 01:09:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: fix Collapse component's controlled state issue

Browse Source
This commit is contained in:
Hossein Mehrabi 2023-05-25 19:30:47 +03:30
parent 7dd6c8083e
commit bf40a03e4c
1 changed files with 14 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
packages/lsd-react/src/components/Collapse/Collapse.tsx
View File

@ -15,13 +15,20 @@ export type CollapseProps = CommonProps &
export const Collapse: React.FC<CollapseProps> & {
classes: typeof collapseClasses
} = ({ label, disabled = false, size = 'large', children, ...props }) => {
} = ({
label,
disabled = false,
size = 'large',
open: openProp,
children,
...props
}) => {
const globalProps = useCommonProps(props)
const ref = useRef<HTMLDivElement>(null)
const [open, setOpen] = useState(props.open ?? false)
const [open, setOpen] = useState(openProp ?? false)
const handleChange = (value: boolean) => {
if (typeof props.open === 'undefined') return setOpen(value)
if (typeof openProp === 'undefined') return setOpen(value)
props.onChange && props.onChange(value)
}
@ -31,6 +38,10 @@ export const Collapse: React.FC<CollapseProps> & {
disabled && open && handleChange(false)
}, [disabled, open, handleChange])
useEffect(() => {
typeof openProp !== 'undefined' && setOpen(openProp)
}, [openProp])
return (
<div
{...props}