@@ -3,14 +3,12 @@ import { twMerge } from 'tailwind-merge'
33
44type PanelRenderProps = {
55 open : boolean
6- orientation : 'horizontal' | 'vertical'
76 toggle : ( ) => void
87}
98
109type PanelProps = {
1110 open ?: boolean
1211 defaultOpen ?: boolean
13- orientation ?: 'horizontal' | 'vertical'
1412 onOpenChange ?: ( open : boolean ) => void
1513 children : React . ReactNode | ( ( props : PanelRenderProps ) => React . ReactNode )
1614 className ?: string
@@ -37,7 +35,6 @@ function usePanel() {
3735export function Panel ( {
3836 open : controlledOpen ,
3937 defaultOpen = false ,
40- orientation = 'vertical' ,
4138 onOpenChange,
4239 children,
4340 className,
@@ -59,14 +56,11 @@ export function Panel({
5956 }
6057 } , [ isControlled , open , onOpenChange ] )
6158
62- const value = React . useMemo (
63- ( ) => ( { open, orientation, toggle } ) ,
64- [ open , orientation , toggle ] ,
65- )
59+ const value = React . useMemo ( ( ) => ( { open, toggle } ) , [ open , toggle ] )
6660
6761 return (
6862 < PanelContext . Provider value = { value } >
69- < div className = { className } data-panel data-orientation = { orientation } >
63+ < div className = { className } data-panel >
7064 { typeof children === 'function' ? children ( value ) : children }
7165 </ div >
7266 </ PanelContext . Provider >
@@ -107,8 +101,7 @@ export function PanelTrigger({
107101
108102export const PanelContent = React . forwardRef < HTMLDivElement , PanelContentProps > (
109103 function PanelContent ( { children, className, ...props } , ref ) {
110- const { open, orientation } = usePanel ( )
111- const horizontal = orientation === 'horizontal'
104+ const { open } = usePanel ( )
112105
113106 return (
114107 < div
@@ -118,27 +111,12 @@ export const PanelContent = React.forwardRef<HTMLDivElement, PanelContentProps>(
118111 inert = { open ? undefined : true }
119112 className = { twMerge (
120113 'grid overflow-hidden duration-200 [transition-timing-function:cubic-bezier(0.32,0.72,0,1)] motion-reduce:transition-none' ,
121- horizontal
122- ? 'transition-[grid-template-columns]'
123- : 'transition-[grid-template-rows]' ,
124- horizontal
125- ? open
126- ? 'grid-cols-[1fr]'
127- : 'grid-cols-[0fr]'
128- : open
129- ? 'grid-rows-[1fr]'
130- : 'grid-rows-[0fr]' ,
114+ 'transition-[grid-template-rows]' ,
115+ open ? 'grid-rows-[1fr]' : 'grid-rows-[0fr]' ,
131116 className ,
132117 ) }
133118 >
134- < div
135- className = { twMerge (
136- 'overflow-hidden' ,
137- horizontal ? 'min-w-0' : 'min-h-0' ,
138- ) }
139- >
140- { children }
141- </ div >
119+ < div className = "min-h-0 overflow-hidden" > { children } </ div >
142120 </ div >
143121 )
144122 } ,
0 commit comments