diff --git a/src/Drawer.tsx b/src/Drawer.tsx index 0150691..7515560 100644 --- a/src/Drawer.tsx +++ b/src/Drawer.tsx @@ -40,12 +40,14 @@ export interface DrawerProps maxSize?: number; /** Default size for uncontrolled resizable drawer */ defaultSize?: number | string; - /** Resizable configuration - object with optional callbacks */ - resizable?: { - onResize?: (size: number) => void; - onResizeStart?: () => void; - onResizeEnd?: () => void; - }; + /** Resizable configuration - boolean to enable/disable or object with optional callbacks */ + resizable?: + | boolean + | { + onResize?: (size: number) => void; + onResizeStart?: () => void; + onResizeEnd?: () => void; + }; } const Drawer: React.FC = props => { diff --git a/src/DrawerPopup.tsx b/src/DrawerPopup.tsx index ab63780..900a1a4 100644 --- a/src/DrawerPopup.tsx +++ b/src/DrawerPopup.tsx @@ -85,11 +85,13 @@ export interface DrawerPopupProps // resizable /** Default size for uncontrolled resizable drawer */ defaultSize?: number | string; - resizable?: { - onResize?: (size: number) => void; - onResizeStart?: () => void; - onResizeEnd?: () => void; - }; + resizable?: + | boolean + | { + onResize?: (size: number) => void; + onResizeStart?: () => void; + onResizeEnd?: () => void; + }; } const DrawerPopup: React.ForwardRefRenderFunction< @@ -319,9 +321,12 @@ const DrawerPopup: React.ForwardRefRenderFunction< // =========================== Resize =========================== const wrapperRef = React.useRef(null); + const isResizable = !!resizable; + const resizeConfig = (typeof resizable === 'object' && resizable) || {}; + const onInternalResize = useEvent((size: number) => { setCurrentSize(size); - resizable?.onResize?.(size); + resizeConfig.onResize?.(size); }); const { dragElementProps, isDragging } = useDrag({ @@ -333,8 +338,8 @@ const DrawerPopup: React.ForwardRefRenderFunction< containerRef: wrapperRef, currentSize: mergedSize, onResize: onInternalResize, - onResizeStart: resizable?.onResizeStart, - onResizeEnd: resizable?.onResizeEnd, + onResizeStart: resizeConfig.onResizeStart, + onResizeEnd: resizeConfig.onResizeEnd, }); // =========================== Events =========================== @@ -394,7 +399,7 @@ const DrawerPopup: React.ForwardRefRenderFunction< }} {...pickAttrs(props, { data: true })} > - {resizable &&
} + {isResizable &&
} {drawerRender ? drawerRender(content) : content}
);