impact-nova 2.0.9 → 2.1.0-alpha.10

package/dist/components/layout/header/header.js

@@ -0,0 +1,161 @@
+import { jsx as r, jsxs as c, Fragment as h } from "react/jsx-runtime";
+import "react";
+import { cn as n } from "../../../lib/utils.js";
+import { createComponent as i } from "../../../lib/primitives/create-component.js";
+import { createCompoundPart as p } from "../../../lib/primitives/create-compound.js";
+import { Button as x } from "../../primitives/button/button.js";
+import { ButtonIconTooltip as v } from "../../feedback/tooltip/button-icon-tooltip.js";
+import { Badge as N } from "../../data-display/badge/badge.js";
+import { Separator as H } from "../../data-display/separator/separator.js";
+import { Alan as y, Bell as B } from "impact-nova-icons";
+import { useImpactNovaI18n as f } from "../../../i18n/use-impact-nova-i18n.js";
+const P = i(
+  "Header",
+  ({ className: a, children: e, ...t }, o) => /* @__PURE__ */ r(
+    "header",
+    {
+      ref: o,
+      "data-component": "header",
+      className: n(
+        "sticky top-0 z-40 flex h-14 w-full items-center justify-between bg-canvas-elevated px-6 shadow-elevation-header",
+        a
+      ),
+      ...t,
+      children: e
+    }
+  )
+), R = p("header", {
+  part: "left",
+  displayName: "HeaderLeft",
+  className: "flex flex-row items-center justify-start"
+}), F = p("header", {
+  part: "right",
+  displayName: "HeaderRight",
+  className: "flex flex-row items-center justify-start gap-5"
+}), q = i(
+  "HeaderLogo",
+  ({ className: a, children: e, href: t = "/", "aria-label": o, ...s }, d) => {
+    const { t: l } = f();
+    return /* @__PURE__ */ r(
+      "a",
+      {
+        href: t,
+        ref: d,
+        "aria-label": o ?? l("aria.home"),
+        className: n(
+          "h-9 flex items-center justify-center cursor-pointer [&_img]:dark:brightness-0 [&_img]:dark:invert",
+          a
+        ),
+        ...s,
+        children: e
+      }
+    );
+  }
+), D = i("HeaderSeparator", ({ className: a, ...e }, t) => /* @__PURE__ */ r(
+  H,
+  {
+    ref: t,
+    orientation: "vertical",
+    className: n("h-6 mx-3", a),
+    ...e
+  }
+)), E = i(
+  "HeaderTitle",
+  ({ className: a, children: e, ...t }, o) => /* @__PURE__ */ r(
+    "h1",
+    {
+      ref: o,
+      className: n("text-base font-extrabold leading-6 text-content", a),
+      ...t,
+      children: e
+    }
+  )
+), G = i(
+  "HeaderBadge",
+  ({ className: a, children: e, style: t, ...o }, s) => /* @__PURE__ */ r(
+    N,
+    {
+      ref: s,
+      size: "sm",
+      shape: "circle",
+      className: n("border-none header-badge-gradient text-brand-foreground", a),
+      style: t,
+      ...o,
+      children: e
+    }
+  )
+), J = i(
+  "HeaderBotButton",
+  ({ className: a, children: e, ...t }, o) => /* @__PURE__ */ r(
+    "button",
+    {
+      ref: o,
+      type: "button",
+      className: n(
+        "relative flex items-center justify-center w-[106px] h-[34px] gap-[7px] px-[11px] py-0 rounded-lg cursor-pointer border-0 outline-none",
+        "header-bot-button-gradient",
+        "animate-header-bot-gradient hover:animate-header-bot-gradient-fast motion-reduce:animate-none",
+        a
+      ),
+      ...t,
+      children: e || /* @__PURE__ */ c(h, { children: [
+        /* @__PURE__ */ r(y, { size: 20, className: "text-brand-foreground" }),
+        /* @__PURE__ */ r("span", { className: "text-sm font-semibold leading-[20px] text-brand-foreground whitespace-nowrap", children: "Ask Alan" })
+      ] })
+    }
+  )
+), K = i(
+  "NotificationIconButton",
+  ({
+    className: a,
+    showIndicator: e,
+    indicatorVariant: t = "unread",
+    tooltipSide: o = "top",
+    tooltipKeybinding: s,
+    ...d
+  }, l) => {
+    const { t: u } = f(), g = t === "stale", m = u("notificationPanel.title"), b = /* @__PURE__ */ c(
+      x,
+      {
+        variant: "ghost",
+        size: "icon",
+        ref: l,
+        "aria-label": m,
+        "data-indicator": e ? "" : void 0,
+        "data-indicator-variant": e ? t : void 0,
+        className: n(
+          "relative text-content-header-notification [&_svg]:size-6 hover:text-content",
+          a
+        ),
+        ...d,
+        children: [
+          /* @__PURE__ */ r(B, { size: 24 }),
+          e && (g ? /* @__PURE__ */ r("div", { className: "absolute top-1.5 right-1.5 size-2 pointer-events-none z-10 rounded-full bg-content-tertiary" }) : /* @__PURE__ */ c("div", { className: "absolute top-1.5 right-1.5 size-2.5 pointer-events-none z-10", children: [
+            /* @__PURE__ */ r("div", { className: "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 size-2.5 rounded-full bg-feedback-error-surface animate-notification-waves motion-reduce:animate-none" }),
+            /* @__PURE__ */ r("div", { className: "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 size-2 rounded-full bg-destructive" })
+          ] }))
+        ]
+      }
+    );
+    return /* @__PURE__ */ r(
+      v,
+      {
+        label: m,
+        side: o,
+        keybinding: s,
+        children: b
+      }
+    );
+  }
+);
+export {
+  P as Header,
+  G as HeaderBadge,
+  J as HeaderBotButton,
+  R as HeaderLeft,
+  q as HeaderLogo,
+  F as HeaderRight,
+  D as HeaderSeparator,
+  E as HeaderTitle,
+  K as NotificationIconButton
+};

package/dist/components/layout/header/header.types.d.ts

@@ -0,0 +1,24 @@
+import { BadgeProps } from '../../data-display/badge';
+import { Separator } from '../../data-display/separator';
+import { Button } from '../../primitives/button/button';
+import { KeyBinding } from '../../primitives/kbd';
+import type * as React from "react";
+export type HeaderProps = React.HTMLAttributes<HTMLElement>;
+export type HeaderLeftProps = React.HTMLAttributes<HTMLDivElement>;
+export type HeaderRightProps = React.HTMLAttributes<HTMLDivElement>;
+export type HeaderLogoProps = React.AnchorHTMLAttributes<HTMLAnchorElement>;
+export type HeaderSeparatorProps = React.ComponentPropsWithoutRef<typeof Separator>;
+export type HeaderTitleProps = React.HTMLAttributes<HTMLHeadingElement>;
+export type HeaderBadgeProps = Omit<BadgeProps, "size" | "shape">;
+export type HeaderBotButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
+export type NotificationIndicatorVariant = "unread" | "stale";
+export interface NotificationIconButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "children"> {
+    showIndicator?: boolean;
+    /** `unread` — live count (destructive). `stale` — offline / unverified count (muted). */
+    indicatorVariant?: NotificationIndicatorVariant;
+    /** Passed through to the underlying icon `Button` tooltip. */
+    tooltipSide?: "top" | "bottom" | "left" | "right";
+    /** Keyboard shortcut shown in the tooltip next to the label (requires `aria-label`). */
+    tooltipKeybinding?: KeyBinding;
+}
+export type HeaderIconButtonProps = React.ComponentPropsWithoutRef<typeof Button>;

package/dist/components/layout/horizontal-scroller/horizontal-scroller.d.ts

@@ -0,0 +1,5 @@
+import { HorizontalScrollerProps } from './horizontal-scroller.types';
+import * as React from "react";
+declare const HorizontalScroller: <T>(props: HorizontalScrollerProps<T> & React.RefAttributes<HTMLDivElement>) => React.ReactElement;
+export { HorizontalScroller };
+export type { HorizontalScrollerProps } from './horizontal-scroller.types';

package/dist/components/layout/horizontal-scroller/horizontal-scroller.js

@@ -0,0 +1,185 @@
+import { jsxs as a, jsx as t } from "react/jsx-runtime";
+import * as n from "react";
+import { ChevronRight as W } from "impact-nova-icons";
+import { useVirtualizer as j } from "@tanstack/react-virtual";
+import { cn as h } from "../../../lib/utils.js";
+import { Button as O } from "../../primitives/button/button.js";
+import { useImpactNovaI18n as T } from "../../../i18n/use-impact-nova-i18n.js";
+function $({
+  className: N,
+  items: d,
+  renderItem: C,
+  scrollStep: p = 200,
+  hideScrollbar: u = !0,
+  controlsPosition: v = "right",
+  renderPrevious: x,
+  renderNext: g,
+  maxWidth: R = "100%",
+  estimateSize: m = 200,
+  overscan: L = 5,
+  ...B
+}, E) {
+  const { t: b } = T(), r = n.useRef(null), [o, H] = n.useState(!1), [s, I] = n.useState(!1);
+  n.useImperativeHandle(E, () => r.current);
+  const c = j({
+    count: d.length,
+    getScrollElement: () => r.current,
+    estimateSize: typeof m == "function" ? m : () => m,
+    horizontal: !0,
+    overscan: L
+  }), V = c.getTotalSize(), f = n.useCallback(() => {
+    const e = r.current;
+    e && (H(e.scrollLeft > 0), I(
+      Math.ceil(e.scrollLeft + e.clientWidth) < e.scrollWidth
+    ));
+  }, []);
+  n.useEffect(() => {
+    const e = r.current;
+    if (!e) return;
+    f();
+    const l = () => f();
+    e.addEventListener("scroll", l);
+    const i = new ResizeObserver(() => {
+      f();
+    });
+    return i.observe(e), () => {
+      e.removeEventListener("scroll", l), i.disconnect();
+    };
+  }, [f, d, V]);
+  const w = () => {
+    r.current?.scrollBy({ left: -p, behavior: "smooth" });
+  }, z = () => {
+    r.current?.scrollBy({ left: p, behavior: "smooth" });
+  }, S = ({
+    direction: e,
+    onClick: l,
+    disabled: i
+  }) => {
+    if (i) return null;
+    const k = b(e === "left" ? "horizontalScroller.scrollLeft" : "horizontalScroller.scrollRight");
+    return /* @__PURE__ */ a(
+      O,
+      {
+        variant: "ghost",
+        size: "icon",
+        className: h(
+          "h-8 w-8 rounded-md bg-canvas-muted text-content-tertiary hover:bg-brand-tint hover:text-brand"
+        ),
+        onClick: l,
+        disabled: i,
+        "aria-label": k,
+        "data-component": e === "left" ? "horizontal-scroller-prev" : "horizontal-scroller-next",
+        children: [
+          /* @__PURE__ */ t(
+            W,
+            {
+              className: h("h-4 w-4", e === "left" && "rotate-180")
+            }
+          ),
+          /* @__PURE__ */ t("span", { className: "sr-only", children: k })
+        ]
+      }
+    );
+  }, y = (() => {
+    const e = x ? x({ onClick: w, disabled: !o }) : /* @__PURE__ */ t(
+      S,
+      {
+        direction: "left",
+        onClick: w,
+        disabled: !o
+      }
+    ), l = g ? g({ onClick: z, disabled: !s }) : /* @__PURE__ */ t(
+      S,
+      {
+        direction: "right",
+        onClick: z,
+        disabled: !s
+      }
+    );
+    return v === "split" ? {
+      left: o ? /* @__PURE__ */ t("div", { className: "flex-shrink-0", children: e }) : null,
+      right: s ? /* @__PURE__ */ t("div", { className: "flex-shrink-0", children: l }) : null
+    } : v === "left" ? {
+      left: o || s ? /* @__PURE__ */ a("div", { className: "flex-shrink-0 flex items-center gap-1", children: [
+        e,
+        l
+      ] }) : null,
+      right: null
+    } : {
+      left: null,
+      right: o || s ? /* @__PURE__ */ a("div", { className: "flex-shrink-0 flex items-center gap-1", children: [
+        e,
+        l
+      ] }) : null
+    };
+  })();
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      className: h(
+        "flex items-center gap-2 min-w-0 w-full bg-transparent",
+        N
+      ),
+      style: { maxWidth: R },
+      "data-component": "horizontal-scroller",
+      ...B,
+      children: [
+        y.left,
+        /* @__PURE__ */ t(
+          "div",
+          {
+            ref: r,
+            tabIndex: 0,
+            className: h(
+              "flex flex-1 min-w-0 overflow-x-auto overflow-y-hidden whitespace-nowrap",
+              u && "scrollbar-hide",
+              "scroll-smooth"
+            ),
+            style: {
+              scrollbarWidth: u ? "none" : "auto",
+              msOverflowStyle: u ? "none" : "auto"
+            },
+            "data-component": "horizontal-scroller-viewport",
+            children: /* @__PURE__ */ a(
+              "div",
+              {
+                style: {
+                  width: `${c.getTotalSize()}px`,
+                  display: "flex",
+                  position: "relative"
+                },
+                children: [
+                  /* @__PURE__ */ t(
+                    "div",
+                    {
+                      style: {
+                        width: `${c.getVirtualItems()[0]?.start ?? 0}px`,
+                        flexShrink: 0
+                      }
+                    }
+                  ),
+                  c.getVirtualItems().map((e) => /* @__PURE__ */ t(
+                    "div",
+                    {
+                      ref: c.measureElement,
+                      "data-index": e.index,
+                      className: "flex-shrink-0",
+                      children: C(d[e.index], e.index)
+                    },
+                    e.key
+                  ))
+                ]
+              }
+            )
+          }
+        ),
+        y.right
+      ]
+    }
+  );
+}
+const A = n.forwardRef($);
+A.displayName = "HorizontalScroller";
+export {
+  A as HorizontalScroller
+};

package/dist/components/layout/horizontal-scroller/horizontal-scroller.types.d.ts

@@ -0,0 +1,19 @@
+import type * as React from "react";
+export interface HorizontalScrollerProps<T> extends Omit<React.HTMLAttributes<HTMLDivElement>, "children"> {
+    items: T[];
+    renderItem: (item: T, index: number) => React.ReactNode;
+    scrollStep?: number;
+    hideScrollbar?: boolean;
+    controlsPosition?: "left" | "right" | "split";
+    renderPrevious?: (props: {
+        onClick: () => void;
+        disabled: boolean;
+    }) => React.ReactNode;
+    renderNext?: (props: {
+        onClick: () => void;
+        disabled: boolean;
+    }) => React.ReactNode;
+    maxWidth?: string | number;
+    estimateSize?: number | ((index: number) => number);
+    overscan?: number;
+}

package/dist/components/layout/horizontal-scroller/index.d.ts

@@ -0,0 +1,3 @@
+export { HorizontalScroller } from './horizontal-scroller';
+export { HorizontalScroller as default } from './horizontal-scroller';
+export * from './horizontal-scroller.types';

package/dist/components/layout/horizontal-scroller/index.js

@@ -0,0 +1,5 @@
+import { HorizontalScroller as l, HorizontalScroller as a } from "./horizontal-scroller.js";
+export {
+  l as HorizontalScroller,
+  a as default
+};

package/dist/components/layout/layout.d.ts

@@ -1,21 +1,5 @@
-import * as React from "react";
-interface LayoutProps extends React.ComponentProps<"div"> {
-    /**
-     * Sidebar column — render `<Sidebar collapsible="offcanvas">` here.
-     * Do **not** wrap with SidebarProvider; place SidebarProvider at the app
-     * root around this entire layout (see impact-nova://layout).
-     */
-    sidebar: React.ReactNode;
-    /**
-     * App header — compose with Header, HeaderLeft, HeaderRight, etc.
-     */
-    header: React.ReactNode;
-    /**
-     * Main content area. Pages compose breadcrumb, filter strip, and body
-     * directly here using BreadcrumbHeader, FilterStrip, etc.
-     */
-    children: React.ReactNode;
-}
+import { LayoutProps } from './layout.types';
+export type { LayoutProps } from './layout.types';
 /**
  * App shell: Sidebar | (Header + scrollable main).
  *
@@ -39,4 +23,3 @@ interface LayoutProps extends React.ComponentProps<"div"> {
  * ```
  */
 export declare function Layout({ sidebar, header, children, className, ...props }: LayoutProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/layout/layout.js

@@ -1,14 +1,13 @@
-import { jsxs as o, jsx as i } from "react/jsx-runtime";
-import "react";
+import { jsxs as e, jsx as i } from "react/jsx-runtime";
 import { cn as f } from "../../lib/utils.js";
 function c({
-  sidebar: e,
-  header: l,
+  sidebar: l,
+  header: o,
   children: t,
   className: a,
   ...n
 }) {
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ e(
     "div",
     {
       className: f(
@@ -19,9 +18,9 @@ function c({
       "data-component": "layout",
       ...n,
       children: [
-        e,
-        /* @__PURE__ */ o("div", { className: "flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden", children: [
-          l,
+        l,
+        /* @__PURE__ */ e("div", { className: "flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden", children: [
+          o,
           /* @__PURE__ */ i(
             "main",
             {

package/dist/components/layout/layout.story-fixtures-data.d.ts

@@ -0,0 +1,14 @@
+import { ReactNode } from 'react';
+export type RouteItem = {
+    value: string;
+    label: string;
+    icon?: ReactNode;
+    url?: string;
+    disabled?: boolean;
+    children?: {
+        value: string;
+        label: string;
+        url: string;
+    }[];
+};
+export declare function getMockRoutes(tStory: (key: string) => string): RouteItem[];

package/dist/components/layout/layout.story-fixtures.d.ts

@@ -1,17 +1,4 @@
 import { ReactNode } from 'react';
-export type RouteItem = {
-    value: string;
-    label: string;
-    icon?: ReactNode;
-    url?: string;
-    disabled?: boolean;
-    children?: {
-        value: string;
-        label: string;
-        url: string;
-    }[];
-};
-export declare function getMockRoutes(tStory: (key: string) => string): RouteItem[];
 /** Production pattern: SidebarProvider wraps the full layout at the app root. */
 export declare function LayoutStoryShell({ defaultSidebarOpen, children, }: {
     defaultSidebarOpen?: boolean;

package/dist/components/layout/layout.types.d.ts

@@ -0,0 +1,16 @@
+import type * as React from "react";
+export interface LayoutProps extends React.ComponentProps<"div"> {
+    /**
+     * Sidebar column — render `<Sidebar collapsible="offcanvas">` here.
+     * Do **not** wrap with SidebarProvider; place SidebarProvider at the app
+     * root around this entire layout (see impact-nova://layout).
+     */
+    sidebar: React.ReactNode;
+    /** App header — compose with Header, HeaderLeft, HeaderRight, etc. */
+    header: React.ReactNode;
+    /**
+     * Main content area. Pages compose breadcrumb, filter strip, and body
+     * directly here using BreadcrumbHeader, FilterStrip, etc.
+     */
+    children: React.ReactNode;
+}

package/dist/components/layout/sidebar/sidebar-context.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+export type SidebarContextValue = {
+    state: "expanded" | "collapsed";
+    open: boolean;
+    setOpen: (open: boolean) => void;
+    toggleSidebar: () => void;
+    autoHideAfter?: number;
+};
+export declare const SidebarContext: React.Context<SidebarContextValue | null>;
+export declare const SidebarMenuCollapsibleContext: React.Context<{
+    isCollapsible: boolean;
+} | null>;
+export declare function useSidebar(): SidebarContextValue;

package/dist/components/layout/sidebar/sidebar-context.js

@@ -0,0 +1,13 @@
+import * as e from "react";
+const r = e.createContext(null), n = e.createContext(null);
+function o() {
+  const t = e.useContext(r);
+  if (!t)
+    throw new Error("useSidebar must be used within a SidebarProvider.");
+  return t;
+}
+export {
+  r as SidebarContext,
+  n as SidebarMenuCollapsibleContext,
+  o as useSidebar
+};

package/dist/components/layout/sidebar/sidebar.d.ts

@@ -0,0 +1,49 @@
+import { useSidebar } from './sidebar-context';
+import { SidebarProviderProps, SidebarProps, SidebarContentProps, SidebarMenuItemProps, SidebarMenuButtonProps } from './sidebar.types';
+import * as React from "react";
+import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
+declare const SidebarProvider: React.ForwardRefExoticComponent<Omit<SidebarProviderProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const Sidebar: React.ForwardRefExoticComponent<Omit<SidebarProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SidebarTrigger: React.ForwardRefExoticComponent<Omit<import('../../primitives/button/button').ButtonProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const SidebarRail: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const SidebarInset: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SidebarInput: React.ForwardRefExoticComponent<Omit<import('../../forms/input').InputProps & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
+declare const SidebarHeader: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "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<SidebarContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SidebarGroup: 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;
+}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SidebarGroupAction: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLButtonElement> & React.ButtonHTMLAttributes<HTMLButtonElement> & {
+    asChild?: boolean;
+}, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const SidebarGroupContent: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SidebarMenu: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & React.RefAttributes<HTMLUListElement>>;
+declare const SidebarMenuItem: React.ForwardRefExoticComponent<Omit<SidebarMenuItemProps, "ref"> & React.RefAttributes<HTMLLIElement>>;
+declare const SidebarMenuCollapsible: React.ForwardRefExoticComponent<Omit<CollapsiblePrimitive.CollapsibleProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    isActive?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const SidebarMenuButton: React.ForwardRefExoticComponent<Omit<SidebarMenuButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const SidebarMenuLabel: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+declare const SidebarLogout: React.ForwardRefExoticComponent<Omit<Omit<SidebarMenuButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>, "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<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SidebarMenuSkeleton: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
+    showIcon?: boolean;
+}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SidebarMenuSub: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & React.RefAttributes<HTMLUListElement>>;
+declare const SidebarMenuSubItem: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLLIElement> & React.LiHTMLAttributes<HTMLLIElement> & {
+    isActive?: boolean;
+}, "ref"> & React.RefAttributes<HTMLLIElement>>;
+declare const SidebarMenuSubButton: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLAnchorElement> & React.AnchorHTMLAttributes<HTMLAnchorElement> & {
+    asChild?: boolean;
+    size?: "sm" | "md";
+    isActive?: boolean;
+}, "ref"> & React.RefAttributes<HTMLAnchorElement>>;
+export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuCollapsible, SidebarMenuLabel, SidebarLogout, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, useSidebar, };
+export type { SidebarContextValue } from './sidebar-context';