import * as React from "react";
import { type VariantProps } from "class-variance-authority";
import type { LucideIcon } from "lucide-react";
import { TooltipContent } from "../../components/Tooltip/tooltip";
import { type RowSize, type InlineActionConfig } from "../../patterns/element-anatomy/item-anatomy";
type SidebarSize = RowSize;
type SidebarContextProps = {
    state: "expanded" | "collapsed";
    open: boolean;
    setOpen: (open: boolean) => void;
    openMobile: boolean;
    setOpenMobile: (open: boolean) => void;
    isMobile: boolean;
    toggleSidebar: () => void;
    size: SidebarSize;
    activeId: string | undefined;
    setActiveId: (id: string) => void;
};
declare function useSidebar(): SidebarContextProps;
declare const SidebarProvider: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
    defaultOpen?: boolean;
    open?: boolean;
    onOpenChange?: (open: boolean) => void;
    /** Sidebar row 元件的預設尺寸(sm/md/lg),propagate 給所有 children。Default: "md" */
    size?: SidebarSize;
    /** 當前 active item 的 id(controlled)——router-driven sidebar 從 URL 算出來傳進。 */
    activeId?: string;
    /** 初始 active id(uncontrolled)。 */
    defaultActiveId?: string;
    /** Active id 改變時的 callback(controlled 必傳)。 */
    onActiveChange?: (id: string) => void;
    /**
     * 全域 prefix 對齊。**預設 `false`**——只在「sidebar 內有大量 brand logo 跟一般 icon
     * 混用,期待 label 齊左掃視」時 opt-in `true`。
     *
     * **典型 use case**(should opt-in):
     * - Linear / Raycast 風格的 integration 清單:Home / Inbox(lucide icon)
     *   + GitHub / Slack / Figma(brand logo,24px)混在同一個 menu
     * - App launcher / workspace switcher / connected apps,brand logo 為主體
     *
     * **不該 opt-in**:
     * - 全 icon 主導覽 + 全 avatar user footer(語意不同層級,該分 group 不該強迫對齊)
     * - 沒有真實混用情境只想要「視覺整齊」(預設行為已經對)
     *
     * 開啟後機制:CSS `:has()` 偵測 sidebar 子樹同時存在 `data-prefix-type="icon"` 和
     * `"avatar"`(由 `<ItemIcon>` / `<ItemAvatar>` 自動標記)時,套用固定 24px 槽,
     * 跨 menu / 跨 group 全域 label 對齊。不混用時零成本。
     *
     * 為什麼預設關閉而非 always-on auto:explicit-over-implicit——sidebar 排版行為
     * 應該從寫的 prop 一眼看出,不藏 CSS 魔法。詳見 `sidebar.spec.md`。
     */
    uniformPrefix?: boolean;
}, "ref"> & React.RefAttributes<HTMLDivElement>>;
declare const Sidebar: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
    side?: "left" | "right";
    collapsible?: "offcanvas" | "icon" | "none";
    /**
     * Viewport top inset(2026-05-20 ship per AppShell `primary-header` unblock)。
     * 預設 undefined = sidebar 從 viewport top 起算(`top:0 / h:svh`,當前 default)。
     * 提供 CSS value(eg. `'var(--chrome-header-height)'` 或 `'48px'`)時,sidebar 改
     * 從該值起算(`top: viewportInsetTop / height: calc(100svh - viewportInsetTop)`),
     * 讓 global header 不被覆蓋(AppShell primary-header mode 必傳)。
     * 對齊 Mantine `layout="default"` navbar 高度扣 header 慣例。
     */
    viewportInsetTop?: string;
}, "ref"> & React.RefAttributes<HTMLDivElement>>;
declare const SidebarTrigger: React.ForwardRefExoticComponent<Omit<import("../../components/Button/button").ButtonProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
declare const SidebarInput: React.ForwardRefExoticComponent<Omit<import("../../components/Input/input").InputProps & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
declare const SidebarHeader: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
    withTabs?: boolean;
    tabsSlot?: React.ReactNode;
}, "ref"> & React.RefAttributes<HTMLDivElement>>;
declare const SidebarFooter: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
declare const SidebarSeparator: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-separator").SeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
declare const SidebarContent: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
/**
 * SidebarGroup
 *
 * 預設是非互動的 plain group(div)。當 `collapsible` = true 時自動切換成 Radix
 * Collapsible:SidebarGroupLabel 變 trigger、SidebarGroupContent 變 Content、
 * 自動渲染 chevron 於 label 尾端、chevron 依 open state 旋轉。
 *
 * ── API 設計決策 ──
 * 為什麼是 group 層級的 prop 而不是 label 層級?因為「group 是否可收合」是結構層
 * 的決定,影響 group 所有子 primitive 的渲染模式(label 變 button、content 變
 * animated container)。把 prop 放在 label 上會讓 content 不知道自己該不該被包,
 * 形成跨元件的 prop drilling。放在 group 上用 context 傳遞是 React 的標準做法。
 */
declare const SidebarGroup: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
    collapsible?: boolean;
    defaultOpen?: boolean;
    open?: boolean;
    onOpenChange?: (open: boolean) => void;
}, "ref"> & React.RefAttributes<HTMLDivElement>>;
declare const SidebarGroupContent: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
declare const SidebarGroupLabel: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
    asChild?: boolean;
    /** ARIA label for the expand/collapse chevron (only when group is collapsible). Override for i18n. Default: 「展開或收合」 */
    toggleAriaLabel?: string;
} & VariantProps<(props?: ({
    size?: RowSize | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string>, "ref"> & React.RefAttributes<HTMLDivElement>>;
declare const SidebarGroupAction: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLButtonElement> & React.ButtonHTMLAttributes<HTMLButtonElement> & {
    asChild?: boolean;
}, "ref"> & React.RefAttributes<HTMLButtonElement>>;
declare const SidebarMenu: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & React.RefAttributes<HTMLUListElement>>;
declare const SidebarMenuItem: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & React.RefAttributes<HTMLLIElement>>;
declare const SidebarMenuButton: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "id"> & {
    asChild?: boolean;
    /**
     * Item 的唯一識別(對齊 `SidebarProvider.activeId`)。**強烈建議傳**——
     * 傳了之後 `isActive` 自動從 context 算、`onClick` 自動 setActiveId,
     * 整個 sidebar 的 single-selection 自動成立,不會寫出啞 item。
     */
    id?: string;
    /**
     * 手動覆寫 active 狀態(極少用)。預設從 `SidebarProvider.activeId === id` 自動算。
     * 兩者都傳時以 `isActive` 為準。
     */
    isActive?: boolean;
    startIcon?: LucideIcon;
    tooltip?: string | React.ComponentProps<typeof TooltipContent>;
    /**
     * Suffix slot 的 inline actions(宣告式 API,對齊 patterns/element-anatomy/inline-action.spec.md)。
     * Host 自動用 `<ItemInlineAction>` 渲染,consumer 只宣告 intent。
     * Icon 模式下自動隱藏。
     */
    inlineActions?: InlineActionConfig[];
    /**
     * 右側 actions slot(ReactNode)— escape hatch 供 consumer 放自訂元素
     * (如 DropdownMenu trigger / 自訂 popover trigger / 多 tier 動作)。
     *
     * 跟 `inlineActions` 互斥(同時傳 `inlineActionsSlot` 會優先,`inlineActions` 被忽略)。
     * 規則對齊 Input.endSlot canonical:90% case 用 `inlineActions` 宣告式 API,
     * 10% config 表達不出時走 slot。
     *
     * Padding budget:slot mode 預留 1 icon 寬度的 paddingRight(覆寫多 icon 寬度需 consumer 自控 className)。
     * Reveal / collapsed-hide / 絕對定位 chrome 跟 inlineActions 共用,consumer 不需重做。
     */
    inlineActionsSlot?: React.ReactNode;
    /**
     * Inline actions 的顯示模式:
     * - `false`(預設):永遠顯示
     * - `"hover"`:row hover 時才淡入(TreeView 模式)
     */
    actionsReveal?: false | "hover";
} & VariantProps<(props?: ({
    size?: "sm" | "md" | "lg" | null | undefined;
    variant?: "meta" | "default" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
declare const SidebarMenuAction: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLButtonElement> & React.ButtonHTMLAttributes<HTMLButtonElement> & {
    asChild?: boolean;
    showOnHover?: boolean;
}, "ref"> & React.RefAttributes<HTMLButtonElement>>;
declare const SidebarMenuBadge: React.ForwardRefExoticComponent<(Omit<import("../../components/Badge/badge").BadgeDotProps & React.RefAttributes<HTMLSpanElement>, "ref"> | Omit<import("../../components/Badge/badge").BadgeCountProps & React.RefAttributes<HTMLSpanElement>, "ref">) & React.RefAttributes<HTMLSpanElement>>;
declare const SidebarMenuSkeleton: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
    showIcon?: boolean;
} & VariantProps<(props?: ({
    size?: "sm" | "md" | "lg" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string>, "ref"> & React.RefAttributes<HTMLDivElement>>;
export declare const sidebarMeta: {
    readonly component: "Sidebar";
    readonly family: null;
    readonly variants: {
        readonly default: {
            readonly when: "標準導覽 row,參與 single-selection";
        };
        readonly meta: {
            readonly when: "Section 底部命令 row(Show more / 新增),不參與 selection";
        };
    };
    readonly sizes: {
        readonly sm: {
            readonly px: 28;
            readonly when: "次導覽 / 設定頁 / 緊湊空間";
        };
        readonly md: {
            readonly px: 32;
            readonly when: "預設 — 應用程式主導覽";
        };
        readonly lg: {
            readonly px: 36;
            readonly when: "重要主導覽 / icon-prominent workspace switcher";
        };
    };
    readonly states: readonly ["default", "hover", "active", "focus-visible", "disabled"];
    readonly tokens: {
        readonly bg: readonly ["bg-neutral-hover", "bg-surface", "bg-transparent"];
        readonly fg: readonly ["text-fg-muted", "text-fg-secondary", "text-foreground"];
        readonly ring: readonly ["ring-ring"];
    };
    readonly defaultSize: "md";
};
export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarProvider, SidebarSeparator, SidebarTrigger, useSidebar, };
//# sourceMappingURL=sidebar.d.ts.map