/**
 * @fileoverview Sidebar layout components — main sidebar shell, rail, inset area, header, footer, content groups, and input.
 * Provides the structural layout primitives for the sidebar. Part of the Saasflare base component layer.
 * @module packages/ui/components/ui/sidebar/layout
 * @package ui
 *
 * @example
 * import { Sidebar, SidebarHeader, SidebarContent, SidebarGroup, SidebarFooter, SidebarInset } from '@saasflare/ui';
 * <Sidebar side="left" variant="sidebar" collapsible="offcanvas">
 *   <SidebarHeader>Logo</SidebarHeader>
 *   <SidebarContent>
 *     <SidebarGroup>Navigation items</SidebarGroup>
 *   </SidebarContent>
 *   <SidebarFooter>User menu</SidebarFooter>
 * </Sidebar>
 */
import * as React from "react";
import { type SaasflareComponentProps } from "../../../providers";
import { Input } from "../input";
import { Separator } from "../separator";
export interface SidebarProps extends Omit<React.ComponentProps<"div">, keyof SaasflareComponentProps>, SaasflareComponentProps {
    side?: "left" | "right";
    variant?: "sidebar" | "floating" | "inset";
    collapsible?: "offcanvas" | "icon" | "none";
}
/**
 * Root sidebar shell. Renders the collapsible navigation chrome and resolves the
 * design-system axes (`surface`, `radius`, `animated`) onto its root element across
 * the `collapsible="none"`, mobile (Sheet), and desktop branches.
 *
 * @example
 * <Sidebar side="left" variant="floating" collapsible="icon" surface="elevated" radius="lg">
 *   <SidebarHeader>Logo</SidebarHeader>
 *   <SidebarContent>
 *     <SidebarGroup>Navigation items</SidebarGroup>
 *   </SidebarContent>
 *   <SidebarFooter>User menu</SidebarFooter>
 * </Sidebar>
 */
export declare function Sidebar({ side, variant, collapsible, className, children, surface, radius, animated, iconWeight, ...props }: SidebarProps): import("react/jsx-runtime").JSX.Element;
/**
 * Interactive rail along the sidebar edge that toggles the collapsed/expanded state.
 *
 * @example
 * <Sidebar collapsible="icon">…<SidebarRail /></Sidebar>
 */
export declare function SidebarRail({ className, ...props }: React.ComponentProps<"button">): import("react/jsx-runtime").JSX.Element;
/**
 * Props for {@link SidebarInset}. Extends `<main>` props with
 * {@link SaasflareComponentProps} (`surface`, `radius`, `animated`, `iconWeight`).
 */
export interface SidebarInsetProps extends Omit<React.ComponentProps<"main">, keyof SaasflareComponentProps>, SaasflareComponentProps {
}
/**
 * Main content area that sits beside the sidebar. For the `inset` variant it gains a
 * rounded, elevated surface offset from the sidebar, so it carries the
 * `surface`/`radius`/`animated` axes.
 *
 * @example
 * <SidebarInset surface="elevated" radius="xl">
 *   <PageContent />
 * </SidebarInset>
 */
export declare function SidebarInset({ className, surface, radius, animated, iconWeight, ...props }: SidebarInsetProps): import("react/jsx-runtime").JSX.Element;
/**
 * Search/filter input styled for placement inside the sidebar header.
 *
 * @example
 * <SidebarHeader><SidebarInput placeholder="Search…" /></SidebarHeader>
 */
export declare function SidebarInput({ className, ...props }: React.ComponentProps<typeof Input>): import("react/jsx-runtime").JSX.Element;
/**
 * Top region of the sidebar, typically holding the brand/logo or a search input.
 *
 * @example
 * <SidebarHeader>Logo</SidebarHeader>
 */
export declare function SidebarHeader({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
/**
 * Bottom region of the sidebar, typically holding the user menu or secondary actions.
 *
 * @example
 * <SidebarFooter>User menu</SidebarFooter>
 */
export declare function SidebarFooter({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
/**
 * Props for {@link SidebarSeparator}. Extends {@link Separator} props with
 * {@link SaasflareComponentProps} (`surface`, `radius`, `animated`, `iconWeight`).
 */
export interface SidebarSeparatorProps extends Omit<React.ComponentProps<typeof Separator>, keyof SaasflareComponentProps>, SaasflareComponentProps {
}
/**
 * Horizontal divider styled for use between sidebar sections. Carries the
 * `surface`/`radius`/`animated` axes onto its rendered border element.
 *
 * @example
 * <SidebarGroup>…</SidebarGroup>
 * <SidebarSeparator />
 * <SidebarGroup>…</SidebarGroup>
 */
export declare function SidebarSeparator({ className, surface, radius, animated, iconWeight, ...props }: SidebarSeparatorProps): import("react/jsx-runtime").JSX.Element;
/**
 * Scrollable middle region of the sidebar that holds the navigation groups.
 *
 * @example
 * <SidebarContent><SidebarGroup>…</SidebarGroup></SidebarContent>
 */
export declare function SidebarContent({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
/**
 * Logical grouping of sidebar items, optionally labelled and with a group action.
 *
 * @example
 * <SidebarGroup>
 *   <SidebarGroupLabel>Projects</SidebarGroupLabel>
 *   <SidebarGroupContent>…</SidebarGroupContent>
 * </SidebarGroup>
 */
export declare function SidebarGroup({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
/**
 * Heading for a sidebar group. Pass `asChild` to render as a custom element.
 *
 * @example
 * <SidebarGroupLabel>Projects</SidebarGroupLabel>
 */
export declare function SidebarGroupLabel({ className, asChild, ...props }: React.ComponentProps<"div"> & {
    asChild?: boolean;
}): import("react/jsx-runtime").JSX.Element;
/**
 * Action button anchored to the top-right of a sidebar group. Pass `asChild` to
 * render as a custom element.
 *
 * @example
 * <SidebarGroup>
 *   <SidebarGroupLabel>Projects</SidebarGroupLabel>
 *   <SidebarGroupAction title="Add project"><PlusIcon /></SidebarGroupAction>
 * </SidebarGroup>
 */
export declare function SidebarGroupAction({ className, asChild, ...props }: React.ComponentProps<"button"> & {
    asChild?: boolean;
}): import("react/jsx-runtime").JSX.Element;
/**
 * Container for the items inside a sidebar group (typically a `SidebarMenu`).
 *
 * @example
 * <SidebarGroupContent><SidebarMenu>…</SidebarMenu></SidebarGroupContent>
 */
export declare function SidebarGroupContent({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;