import { Button } from "./button.js";
import { Input } from "./input.js";
import { Separator } from "./separator.js";
import { SidebarLayout } from "./sidebar.logic.js";
import { TooltipContent as TooltipPopup } from "./tooltip.js";
import { VariantProps } from "class-variance-authority";
//#region src/components/sidebar.d.ts
/**
 * Inline size the sidebar takes out of the layout row when expanded, in CSS
 * pixels. Kept equal across the two rail-shaped primitives in this package:
 * `SIDE_RAIL_WIDTH` (inspector) and `APPLICATION_RAIL_WIDTH` are both `w-12`
 * (48px), the same as {@link SIDEBAR_WIDTH_ICON_PX} below, so a collapsed
 * sidebar lines up with either rail.
 */
export declare const SIDEBAR_WIDTH_PX = 256;
/** Inline size of the collapsed ("icon") rail, in CSS pixels. See above. */
export declare const SIDEBAR_WIDTH_ICON_PX = 48;
type SidebarContextProps = {
  state: "expanded" | "collapsed";
  open: boolean;
  setOpen: (open: boolean) => void;
  openMobile: boolean;
  setOpenMobile: (open: boolean) => void;
  isMobile: boolean;
  toggleSidebar: () => void;
};
declare function useSidebar(): SidebarContextProps;
/** The sidebar's current layout; see `resolveSidebarLayout`. */
declare function useSidebarLayout(): SidebarLayout;
/**
 * Inline size the sidebar takes out of the layout row, in CSS pixels. Panes
 * docked to the opposite edge need this to know how much room is actually
 * left for the content column. Mobile reports 0: there the sidebar is an
 * overlay sheet and occupies no layout width.
 */
declare function useSidebarInlineSize(): 0 | 48 | 256;
declare const SidebarProvider: ({ defaultOpen, forceCollapsed, open: openProp, onOpenChange: setOpenProp, className, style, children, ...props }: React.ComponentProps<"div"> & {
  defaultOpen?: boolean;
  forceCollapsed?: boolean;
  open?: boolean;
  onOpenChange?: (open: boolean) => void;
}) => import("react").JSX.Element;
declare const Sidebar: ({ side, variant, collapsible, mobileTitle, mobileDescription, className, children, ...props }: React.ComponentProps<"div"> & {
  /**
   * Which edge the sidebar docks to. Despite the physical name, this is
   * applied as a *logical* position: `"left"` docks at the CSS inline-start
   * edge and `"right"` docks at the inline-end edge (see the `start-0` /
   * `end-0` classes below, keyed off `data-side`). Under `dir="rtl"` a
   * `side="left"` sidebar therefore renders on the visual right, mirroring
   * the reading direction rather than a fixed screen edge. `SidebarRail`
   * derives its content-facing offset from `data-side` using the same
   * left→end / right→start mapping so it keeps tracking the boundary
   * between the sidebar and the content pane in both directions.
   */
  side?: "left" | "right";
  variant?: "sidebar" | "floating" | "inset";
  collapsible?: "offcanvas" | "icon" | "none";
  /** Screen-reader title for the mobile sheet. Override to localize. */
  mobileTitle?: string;
  /** Screen-reader description for the mobile sheet. Override to localize. */
  mobileDescription?: string;
}) => import("react").JSX.Element;
declare const SidebarTrigger: ({ className, onClick, label, "aria-label": ariaLabel, ...props }: React.ComponentProps<typeof Button> & {
  /** Accessible name for the trigger. Override to localize. */
  label?: string;
}) => import("react").JSX.Element;
declare const SidebarRail: ({ className, label, "aria-label": ariaLabel, ...props }: React.ComponentProps<"button"> & {
  /** Accessible name for the rail. Override to localize. */
  label?: string;
}) => import("react").JSX.Element;
declare const SidebarInset: ({ className, ...props }: React.ComponentProps<"main">) => import("react").JSX.Element;
declare const SidebarInput: ({ className, ...props }: React.ComponentProps<typeof Input>) => import("react").JSX.Element;
declare const SidebarHeader: ({ className, ...props }: React.ComponentProps<"div">) => import("react").JSX.Element;
declare const SidebarFooter: ({ className, ...props }: React.ComponentProps<"div">) => import("react").JSX.Element;
declare const SidebarSeparator: ({ className, ...props }: React.ComponentProps<typeof Separator>) => import("react").JSX.Element;
declare const SidebarContent: ({ className, ...props }: React.ComponentProps<"div">) => import("react").JSX.Element;
declare const SidebarGroup: ({ className, ...props }: React.ComponentProps<"div">) => import("react").JSX.Element;
declare const SidebarGroupLabel: ({ className, asChild, ...props }: React.ComponentProps<"div"> & {
  asChild?: boolean;
}) => import("react").JSX.Element;
declare const SidebarGroupAction: ({ className, asChild, ...props }: React.ComponentProps<"button"> & {
  asChild?: boolean;
}) => import("react").JSX.Element;
declare const SidebarGroupContent: ({ className, ...props }: React.ComponentProps<"div">) => import("react").JSX.Element;
declare const SidebarMenu: ({ className, ...props }: React.ComponentProps<"ul">) => import("react").JSX.Element;
declare const SidebarMenuItem: ({ className, ...props }: React.ComponentProps<"li">) => import("react").JSX.Element;
declare const sidebarMenuButtonVariants: (props?: ({
  variant?: "default" | "outline" | null | undefined;
  size?: "default" | "lg" | "rail" | "sm" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
/**
 * The footer's avatar trigger, signed in (user menu) or not (sign-in): a
 * 28px avatar, then its label while expanded. Collapsed, it is the rail's
 * 32px square with the avatar centred on the axis of the icons above.
 *
 * Not a `SidebarMenuButton` size: that button fades its last span when
 * collapsed, and an avatar renders as a span. Every avatar trigger takes
 * this class and renders its label only while expanded, so the two auth
 * states cannot drift apart.
 */
declare const sidebarIdentityTriggerClassName: (layout: SidebarLayout) => string;
declare const SidebarMenuButton: ({ asChild, isActive, variant, size, tooltip, className, ...props }: React.ComponentProps<"button"> & {
  asChild?: boolean;
  isActive?: boolean;
  tooltip?: string | React.ComponentProps<typeof TooltipPopup>;
} & VariantProps<typeof sidebarMenuButtonVariants>) => import("react").JSX.Element;
declare const SidebarMenuAction: ({ className, asChild, showOnHover, ...props }: React.ComponentProps<"button"> & {
  asChild?: boolean;
  showOnHover?: boolean;
}) => import("react").JSX.Element;
declare const SidebarMenuBadge: ({ className, ...props }: React.ComponentProps<"div">) => import("react").JSX.Element;
declare const SidebarMenuSkeleton: ({ className, showIcon, ...props }: React.ComponentProps<"div"> & {
  showIcon?: boolean;
}) => import("react").JSX.Element;
declare const SidebarMenuSub: ({ className, ...props }: React.ComponentProps<"ul">) => import("react").JSX.Element;
declare const SidebarMenuSubItem: ({ className, ...props }: React.ComponentProps<"li">) => import("react").JSX.Element;
declare const SidebarMenuSubButton: ({ asChild, size, isActive, className, ...props }: React.ComponentProps<"a"> & {
  asChild?: boolean;
  size?: "sm" | "md";
  isActive?: boolean;
}) => import("react").JSX.Element;
//#endregion
export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, sidebarIdentityTriggerClassName, useSidebar, useSidebarInlineSize, useSidebarLayout };