import { type ComponentPropsWithoutRef, type CSSProperties, type ReactNode } from 'react'; /** * Base props shared by both the legacy and new panel size APIs. */ type SplitViewBaseProps = { /** * The content to display in the left panel. */ leftPanelSlot: ReactNode; /** * The content to display in the right panel. */ rightPanelSlot: ReactNode; /** * Controls which panel is visible. * * When `true`, the controlled panel (determined by `targetPanel`) is shown with a slide-in animation. * When `false`, the controlled panel is hidden with a slide-out animation. * When `undefined`, the controlled panel is visible by default. * * The behavior when hidden depends on the `enableAutoUnmount` prop: * - `enableAutoUnmount=true` (default): The controlled panel content will be unmounted when hidden * - `enableAutoUnmount=false`: The controlled panel content stays mounted but is hidden via CSS * * @default undefined (controlled panel is visible by default) * * @example * ```tsx * // New API: control left panel size * } * rightPanelSlot={} * isOpen={isOpen} * targetPanel="left" * initialPanelSize={300} * minPanelSize={200} * maxPanelSize={500} * style={{ minWidth: '600px' }} * /> * ``` */ isOpen?: boolean; /** * Props for the left panel container. */ leftPanelProps?: ComponentPropsWithoutRef<'div'>; /** * Props for the right panel container. */ rightPanelProps?: ComponentPropsWithoutRef<'div'>; /** * Props for the divider element. */ dividerProps?: ComponentPropsWithoutRef<'div'>; /** * Enable auto unmounting of the controlled panel content when it is not displayed. * When true, the controlled panel content will return null instead of hiding via CSS. * * @default true */ enableAutoUnmount?: boolean; } & ComponentPropsWithoutRef<'div'>; /** * Legacy panel size props (right-panel-specific). * * This type will be deprecated in v4.0.0. * Use `TargetPanelSizeProps` (`initialPanelSize`, `minPanelSize`, `maxPanelSize`, `targetPanel`) instead. */ type LegacyPanelSizeProps = { /** * The initial size of the right panel. * * This prop will be deprecated in v4.0.0. Use `initialPanelSize` with `targetPanel="right"` instead. */ initialRightPanelSize: NonNullable; /** * The minimum size of the right panel. * * This prop will be deprecated in v4.0.0. Use `minPanelSize` with `targetPanel="right"` instead. */ minRightPanelSize: NonNullable; /** * The maximum size of the right panel. * * This prop will be deprecated in v4.0.0. Use `maxPanelSize` with `targetPanel="right"` instead. */ maxRightPanelSize: NonNullable; initialPanelSize?: never; minPanelSize?: never; maxPanelSize?: never; targetPanel?: never; }; /** * Panel size props for the new API. Supports controlling either the left or right panel. */ type TargetPanelSizeProps = { /** * The initial size of the panel specified by `targetPanel`. */ initialPanelSize: NonNullable; /** * The minimum size of the panel specified by `targetPanel`. */ minPanelSize: NonNullable; /** * The maximum size of the panel specified by `targetPanel`. */ maxPanelSize: NonNullable; /** * Specifies which panel's size is controlled by `initialPanelSize`, `minPanelSize`, and `maxPanelSize`. * Also determines which panel is shown or hidden by the `isOpen` prop. * * - `"right"`: The right panel has a fixed size; the left panel expands to fill remaining space. * - `"left"`: The left panel has a fixed size; the right panel expands to fill remaining space. */ targetPanel: 'left' | 'right'; /** Disallowed when using the new API. Use `initialPanelSize` instead. */ initialRightPanelSize?: never; /** Disallowed when using the new API. Use `minPanelSize` instead. */ minRightPanelSize?: never; /** Disallowed when using the new API. Use `maxPanelSize` instead. */ maxRightPanelSize?: never; }; /** * Props for the SplitView component. */ export type SplitViewProps = SplitViewBaseProps & (LegacyPanelSizeProps | TargetPanelSizeProps); export {};