import { VariantProps } from '@payfit/unity-themes';
import { PropsWithChildren } from 'react';
export declare const sidePanel: import('tailwind-variants').TVReturnType<{
    [key: string]: {
        [key: string]: import('tailwind-merge').ClassNameValue | {
            content?: import('tailwind-merge').ClassNameValue;
            overlay?: import('tailwind-merge').ClassNameValue;
            wrapper?: import('tailwind-merge').ClassNameValue;
        };
    };
} | {
    [x: string]: {
        [x: string]: import('tailwind-merge').ClassNameValue | {
            content?: import('tailwind-merge').ClassNameValue;
            overlay?: import('tailwind-merge').ClassNameValue;
            wrapper?: import('tailwind-merge').ClassNameValue;
        };
    };
} | {}, {
    overlay: string[];
    wrapper: string[];
    content: string[];
}, undefined, {
    [key: string]: {
        [key: string]: import('tailwind-merge').ClassNameValue | {
            content?: import('tailwind-merge').ClassNameValue;
            overlay?: import('tailwind-merge').ClassNameValue;
            wrapper?: import('tailwind-merge').ClassNameValue;
        };
    };
} | {}, {
    overlay: string[];
    wrapper: string[];
    content: string[];
}, import('tailwind-variants').TVReturnType<unknown, {
    overlay: string[];
    wrapper: string[];
    content: string[];
}, undefined, unknown, unknown, undefined>>;
export interface SidePanelProps extends PropsWithChildren<VariantProps<typeof sidePanel>> {
    /**
     * Controls whether the panel can be dismissed by clicking outside or using escape key.
     * @default true
     */
    isDismissable?: boolean;
    /**
     * When true, pressing the Escape key will not close the panel.
     * This is useful when you need to prevent accidental dismissal.
     * @default false
     */
    isKeyboardDismissDisabled?: boolean;
    /**
     * Controls the open state of the panel in controlled mode.
     * Must be used together with `onOpenChange`.
     */
    isOpen?: boolean;
    /**
     * Sets the initial open state in uncontrolled mode.
     * @default false
     */
    defaultOpen?: boolean;
    /**
     * Callback fired when the open state changes.
     * Required when using controlled mode with `isOpen`.
     */
    onOpenChange?: (isOpen: boolean) => void;
    /**
     * If true, scroll locking will be disabled, allowing background scrolling while the panel is open.
     * **Requires** controlled mode with `isOpen`/`onOpenChange`.
     * @default false
     */
    disableScrollLocking?: boolean;
}
/**
 * The SidePanel component provides contextual space for supplementary content without fully
 * interrupting the user's workflow. It slides in from the right on desktop and from the bottom on mobile.
 *
 * You can use SidePanel to display detailed information, forms, or secondary actions while keeping
 * the main interface visible and accessible. It's ideal for multi-step processes, editing items in a list,
 * or displaying contextual details.
 *
 * Control the panel using either uncontrolled mode with `defaultOpen` or controlled mode with
 * `isOpen`/`onOpenChange` props. Customize dismissal behavior with `isDismissable` and
 * `isKeyboardDismissDisabled` props.
 * @param {SidePanelProps} props - The props for the SidePanel component
 * @see {@link SidePanelProps} for all available props
 * @example
 * ```tsx
 * import {
 *   SidePanel,
 *   SidePanelHeader,
 *   SidePanelContent,
 *   SidePanelFooter,
 *   Button
 * } from '@payfit/unity-components'
 *
 * // Uncontrolled example
 * function BasicExample() {
 *   return (
 *     <DialogTrigger>
 *       <Button>Open panel</Button>
 *       <SidePanel>
 *         <SidePanelHeader>Panel title</SidePanelHeader>
 *         <SidePanelContent>Your content here</SidePanelContent>
 *         <SidePanelFooter>
 *           <Button variant="secondary">Cancel</Button>
 *           <Button variant="primary">Save</Button>
 *         </SidePanelFooter>
 *       </SidePanel>
 *     </DialogTrigger>
 *   )
 * }
 *
 * // Controlled example
 * function ControlledExample() {
 *   const [isOpen, setIsOpen] = useState(false)
 *
 *   return (
 *     <>
 *       <Button onPress={() => setIsOpen(true)}>Open panel</Button>
 *
 *       <SidePanel isOpen={isOpen} onOpenChange={setIsOpen}>
 *         <SidePanelHeader>Panel title</SidePanelHeader>
 *         <SidePanelContent>Your content here</SidePanelContent>
 *         <SidePanelFooter>
 *           <Button
 *             variant="primary"
 *             onPress={() => setIsOpen(false)}
 *           >
 *             Close
 *           </Button>
 *         </SidePanelFooter>
 *       </SidePanel>
 *     </>
 *   )
 * }
 * ```
 * @remarks
 * [API Docs](https://unity-components.payfit.io/?path=/docs/feedback-sidepanel--docs) • [Design Docs](https://www.payfit.design/24f360409/p/21bfe4-side-panel)
 */
declare const SidePanel: import('react').ForwardRefExoticComponent<SidePanelProps & import('react').RefAttributes<HTMLDivElement>>;
export { SidePanel };