@a5it/sync-ui 0.1.38 → 0.1.40

package/dist/components/cards/detail-line-item.d.ts

@@ -0,0 +1,45 @@
+import * as React from "react";
+export type DetailLineItemProps = React.ComponentProps<"div">;
+/**
+ * A key-value pair row for detail/sidebar cards.
+ *
+ * Compose with `DetailLineItemLabel` and `DetailLineItemValue` as children.
+ *
+ * @example
+ * ```tsx
+ * <DetailLineItem>
+ *   <DetailLineItemLabel>Sub-Total</DetailLineItemLabel>
+ *   <DetailLineItemValue>$1,234.56</DetailLineItemValue>
+ * </DetailLineItem>
+ * ```
+ *
+ * @example — custom label with tooltip
+ * ```tsx
+ * <DetailLineItem>
+ *   <DetailLineItemLabel>
+ *     <span>Est Margin</span>
+ *     <Tooltip>…</Tooltip>
+ *   </DetailLineItemLabel>
+ *   <DetailLineItemValue className="text-[#2e6dfa]">
+ *     $500.00 (15.5%)
+ *   </DetailLineItemValue>
+ * </DetailLineItem>
+ * ```
+ */
+declare function DetailLineItem({ className, children, ...props }: DetailLineItemProps): import("react/jsx-runtime").JSX.Element;
+export type DetailLineItemLabelProps = React.ComponentProps<"div">;
+/**
+ * Left-side label of a key-value row.
+ * Renders with 60% opacity by default. Accepts any ReactNode — plain text,
+ * icons, tooltips, etc.
+ */
+declare function DetailLineItemLabel({ className, children, ...props }: DetailLineItemLabelProps): import("react/jsx-runtime").JSX.Element;
+export type DetailLineItemValueProps = React.ComponentProps<"div">;
+/**
+ * Right-side value of a key-value row.
+ * Renders as semibold text. Accepts any ReactNode — formatted currency,
+ * status pills, links, etc.
+ */
+declare function DetailLineItemValue({ className, children, ...props }: DetailLineItemValueProps): import("react/jsx-runtime").JSX.Element;
+export { DetailLineItem, DetailLineItemLabel, DetailLineItemValue };
+//# sourceMappingURL=detail-line-item.d.ts.map

package/dist/components/cards/detail-line-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"detail-line-item.d.ts","sourceRoot":"","sources":["../../../src/components/cards/detail-line-item.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAE9D;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,2CAU7E;AAID,MAAM,MAAM,wBAAwB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAEnE;;;;GAIG;AACH,iBAAS,mBAAmB,CAAC,EAC3B,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,wBAAwB,2CAc1B;AAID,MAAM,MAAM,wBAAwB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAEnE;;;;GAIG;AACH,iBAAS,mBAAmB,CAAC,EAC3B,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,wBAAwB,2CAa1B;AAID,OAAO,EAAE,cAAc,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,CAAC"}

package/dist/components/cards/detail-line-item.js

@@ -0,0 +1,51 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "../../lib/utils";
+/**
+ * A key-value pair row for detail/sidebar cards.
+ *
+ * Compose with `DetailLineItemLabel` and `DetailLineItemValue` as children.
+ *
+ * @example
+ * ```tsx
+ * <DetailLineItem>
+ *   <DetailLineItemLabel>Sub-Total</DetailLineItemLabel>
+ *   <DetailLineItemValue>$1,234.56</DetailLineItemValue>
+ * </DetailLineItem>
+ * ```
+ *
+ * @example — custom label with tooltip
+ * ```tsx
+ * <DetailLineItem>
+ *   <DetailLineItemLabel>
+ *     <span>Est Margin</span>
+ *     <Tooltip>…</Tooltip>
+ *   </DetailLineItemLabel>
+ *   <DetailLineItemValue className="text-[#2e6dfa]">
+ *     $500.00 (15.5%)
+ *   </DetailLineItemValue>
+ * </DetailLineItem>
+ * ```
+ */
+function DetailLineItem({ className, children, ...props }) {
+    return (_jsx("div", { className: cn("flex w-full items-start gap-2", className), "data-slot": "detail-line-item", ...props, children: children }));
+}
+/**
+ * Left-side label of a key-value row.
+ * Renders with 60% opacity by default. Accepts any ReactNode — plain text,
+ * icons, tooltips, etc.
+ */
+function DetailLineItemLabel({ className, children, ...props }) {
+    return (_jsx("div", { className: cn("flex flex-1 items-center text-[14px] leading-[16px] text-[#1a1a1a]", className), style: { opacity: 0.6 }, "data-slot": "detail-line-item-label", ...props, children: children }));
+}
+/**
+ * Right-side value of a key-value row.
+ * Renders as semibold text. Accepts any ReactNode — formatted currency,
+ * status pills, links, etc.
+ */
+function DetailLineItemValue({ className, children, ...props }) {
+    return (_jsx("div", { className: cn("shrink-0 text-[14px] font-semibold leading-[16px] text-[#1a1a1a]", className), "data-slot": "detail-line-item-value", ...props, children: children }));
+}
+/* ─────────────────────────── Exports ─────────────────────────── */
+export { DetailLineItem, DetailLineItemLabel, DetailLineItemValue };
+//# sourceMappingURL=detail-line-item.js.map

package/dist/components/cards/detail-line-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"detail-line-item.js","sourceRoot":"","sources":["../../../src/components/cards/detail-line-item.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AAMrC;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,SAAS,cAAc,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAuB;IAC5E,OAAO,CACL,cACE,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE,SAAS,CAAC,eAC/C,kBAAkB,KACxB,KAAK,YAER,QAAQ,GACL,CACP,CAAC;AACJ,CAAC;AAMD;;;;GAIG;AACH,SAAS,mBAAmB,CAAC,EAC3B,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACiB;IACzB,OAAO,CACL,cACE,SAAS,EAAE,EAAE,CACX,oEAAoE,EACpE,SAAS,CACV,EACD,KAAK,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,eACb,wBAAwB,KAC9B,KAAK,YAER,QAAQ,GACL,CACP,CAAC;AACJ,CAAC;AAMD;;;;GAIG;AACH,SAAS,mBAAmB,CAAC,EAC3B,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACiB;IACzB,OAAO,CACL,cACE,SAAS,EAAE,EAAE,CACX,kEAAkE,EAClE,SAAS,CACV,eACS,wBAAwB,KAC9B,KAAK,YAER,QAAQ,GACL,CACP,CAAC;AACJ,CAAC;AAED,qEAAqE;AAErE,OAAO,EAAE,cAAc,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,CAAC"}

package/dist/components/cards/index.d.ts

@@ -0,0 +1,5 @@
+export { SidebarCard, SidebarCardHeader, SidebarCardTitle, SidebarCardAction, SidebarCardContent, SidebarCardSection, } from "./sidebar-card";
+export type { SidebarCardProps, SidebarCardHeaderProps, SidebarCardTitleProps, SidebarCardActionProps, SidebarCardContentProps, SidebarCardSectionProps, } from "./sidebar-card";
+export { DetailLineItem, DetailLineItemLabel, DetailLineItemValue, } from "./detail-line-item";
+export type { DetailLineItemProps, DetailLineItemLabelProps, DetailLineItemValueProps, } from "./detail-line-item";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/cards/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/cards/index.ts"],"names":[],"mappings":"AAGA,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,GACnB,MAAM,gBAAgB,CAAC;AACxB,YAAY,EACV,gBAAgB,EAChB,sBAAsB,EACtB,qBAAqB,EACrB,sBAAsB,EACtB,uBAAuB,EACvB,uBAAuB,GACxB,MAAM,gBAAgB,CAAC;AAGxB,OAAO,EACL,cAAc,EACd,mBAAmB,EACnB,mBAAmB,GACpB,MAAM,oBAAoB,CAAC;AAC5B,YAAY,EACV,mBAAmB,EACnB,wBAAwB,EACxB,wBAAwB,GACzB,MAAM,oBAAoB,CAAC"}

package/dist/components/cards/index.js

@@ -0,0 +1,6 @@
+"use client";
+// ── SidebarCard (composable) ──
+export { SidebarCard, SidebarCardHeader, SidebarCardTitle, SidebarCardAction, SidebarCardContent, SidebarCardSection, } from "./sidebar-card";
+// ── DetailLineItem (composable key-value row) ──
+export { DetailLineItem, DetailLineItemLabel, DetailLineItemValue, } from "./detail-line-item";
+//# sourceMappingURL=index.js.map

package/dist/components/cards/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/cards/index.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,iCAAiC;AACjC,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,GACnB,MAAM,gBAAgB,CAAC;AAUxB,kDAAkD;AAClD,OAAO,EACL,cAAc,EACd,mBAAmB,EACnB,mBAAmB,GACpB,MAAM,oBAAoB,CAAC"}

package/dist/components/cards/sidebar-card.d.ts

@@ -0,0 +1,87 @@
+import * as React from "react";
+export type SidebarCardProps = React.ComponentProps<"div"> & {
+    /**
+     * Initial open state for collapsible cards.
+     * @default true
+     */
+    defaultOpen?: boolean;
+    /**
+     * Whether the card can be collapsed/expanded.
+     * When `false`, the card renders as a static (always-open) detail card.
+     * @default true
+     */
+    collapsible?: boolean;
+    /** Cypress test identifier */
+    "data-cy"?: string;
+};
+/**
+ * Root container for a sidebar card.
+ *
+ * Manages collapse state via internal context so sub-components
+ * (`SidebarCardHeader`, `SidebarCardContent`, etc.) can read it
+ * without prop drilling.
+ *
+ * @example
+ * ```tsx
+ * <SidebarCard>
+ *   <SidebarCardHeader>
+ *     <SidebarCardTitle>Quote</SidebarCardTitle>
+ *     <SidebarCardAction>
+ *       <MyDropdownMenu />
+ *     </SidebarCardAction>
+ *   </SidebarCardHeader>
+ *   <SidebarCardContent>
+ *     <SidebarCardSection bordered>…</SidebarCardSection>
+ *     <SidebarCardSection>…</SidebarCardSection>
+ *   </SidebarCardContent>
+ * </SidebarCard>
+ * ```
+ */
+declare function SidebarCard({ defaultOpen, collapsible, className, children, ...props }: SidebarCardProps): import("react/jsx-runtime").JSX.Element;
+export type SidebarCardHeaderProps = React.ComponentProps<"div">;
+/**
+ * Header row for the sidebar card (56px height).
+ *
+ * When the card is collapsible, clicking the header area (excluding the
+ * action slot) toggles the card open/closed and renders a chevron icon.
+ *
+ * Compose with `SidebarCardTitle` and optionally `SidebarCardAction`.
+ */
+declare function SidebarCardHeader({ className, children, ...props }: SidebarCardHeaderProps): import("react/jsx-runtime").JSX.Element;
+export type SidebarCardTitleProps = React.ComponentProps<"div">;
+/**
+ * Title text inside the header row.
+ * Renders as 18px bold text with truncation.
+ */
+declare function SidebarCardTitle({ className, children, ...props }: SidebarCardTitleProps): import("react/jsx-runtime").JSX.Element;
+export type SidebarCardActionProps = React.ComponentProps<"div">;
+/**
+ * Right-side action slot in the header.
+ *
+ * The consumer brings their own content (dropdown menu, button, etc.).
+ * Clicks inside this slot are stopped from propagating to the toggle button.
+ */
+declare function SidebarCardAction({ className, children, ...props }: SidebarCardActionProps): import("react/jsx-runtime").JSX.Element;
+export type SidebarCardContentProps = React.ComponentProps<"div">;
+/**
+ * Animated collapsible body of the card.
+ *
+ * Uses a ResizeObserver to measure content height and smoothly transition
+ * between open/closed states. When `collapsible` is `false` in the parent
+ * `SidebarCard`, this component simply renders its children without animation.
+ */
+declare function SidebarCardContent({ className, children, ...props }: SidebarCardContentProps): import("react/jsx-runtime").JSX.Element;
+export type SidebarCardSectionProps = React.ComponentProps<"div"> & {
+    /**
+     * Show a bottom border on this section.
+     * @default false
+     */
+    bordered?: boolean;
+};
+/**
+ * A padded section inside the card content.
+ * Use `bordered` to add a bottom separator between sections.
+ */
+declare function SidebarCardSection({ bordered, className, children, ...props }: SidebarCardSectionProps): import("react/jsx-runtime").JSX.Element;
+export { SidebarCard, SidebarCardHeader, SidebarCardTitle, SidebarCardAction, SidebarCardContent, SidebarCardSection, };
+//# sourceMappingURL=sidebar-card.d.ts.map

package/dist/components/cards/sidebar-card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar-card.d.ts","sourceRoot":"","sources":["../../../src/components/cards/sidebar-card.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AA4B/B,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC3D;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,8BAA8B;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,iBAAS,WAAW,CAAC,EACnB,WAAkB,EAClB,WAAkB,EAClB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,gBAAgB,2CA0BlB;AAID,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAEjE;;;;;;;GAOG;AACH,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,sBAAsB,2CAuExB;AAID,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAEhE;;;GAGG;AACH,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,qBAAqB,2CAavB;AAID,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAEjE;;;;;GAKG;AACH,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,sBAAsB,2CAWxB;AAID,MAAM,MAAM,uBAAuB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAElE;;;;;;GAMG;AACH,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,uBAAuB,2CA8DzB;AAID,MAAM,MAAM,uBAAuB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAClE;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF;;;GAGG;AACH,iBAAS,kBAAkB,CAAC,EAC1B,QAAgB,EAChB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,uBAAuB,2CAczB;AAID,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,GACnB,CAAC"}

package/dist/components/cards/sidebar-card.js

@@ -0,0 +1,150 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { ChevronUp } from "lucide-react";
+import { cn } from "../../lib/utils";
+const SidebarCardContext = React.createContext(null);
+function useSidebarCardContext() {
+    const ctx = React.useContext(SidebarCardContext);
+    if (!ctx) {
+        throw new Error("SidebarCard compound components must be used within <SidebarCard>");
+    }
+    return ctx;
+}
+/**
+ * Root container for a sidebar card.
+ *
+ * Manages collapse state via internal context so sub-components
+ * (`SidebarCardHeader`, `SidebarCardContent`, etc.) can read it
+ * without prop drilling.
+ *
+ * @example
+ * ```tsx
+ * <SidebarCard>
+ *   <SidebarCardHeader>
+ *     <SidebarCardTitle>Quote</SidebarCardTitle>
+ *     <SidebarCardAction>
+ *       <MyDropdownMenu />
+ *     </SidebarCardAction>
+ *   </SidebarCardHeader>
+ *   <SidebarCardContent>
+ *     <SidebarCardSection bordered>…</SidebarCardSection>
+ *     <SidebarCardSection>…</SidebarCardSection>
+ *   </SidebarCardContent>
+ * </SidebarCard>
+ * ```
+ */
+function SidebarCard({ defaultOpen = true, collapsible = true, className, children, ...props }) {
+    const [isOpen, setIsOpen] = React.useState(defaultOpen);
+    const toggle = React.useCallback(() => {
+        setIsOpen((prev) => !prev);
+    }, []);
+    const ctx = React.useMemo(() => ({ isOpen: collapsible ? isOpen : true, toggle, collapsible }), [isOpen, toggle, collapsible]);
+    return (_jsx(SidebarCardContext.Provider, { value: ctx, children: _jsx("div", { className: cn("overflow-hidden rounded-[12px] w-full bg-white", className), "data-slot": "sidebar-card", ...props, children: children }) }));
+}
+/**
+ * Header row for the sidebar card (56px height).
+ *
+ * When the card is collapsible, clicking the header area (excluding the
+ * action slot) toggles the card open/closed and renders a chevron icon.
+ *
+ * Compose with `SidebarCardTitle` and optionally `SidebarCardAction`.
+ */
+function SidebarCardHeader({ className, children, ...props }) {
+    const { isOpen, toggle, collapsible } = useSidebarCardContext();
+    return (_jsxs("div", { className: cn("flex h-[56px] w-full items-center gap-[8px] border-b px-[24px] py-[8px]", collapsible && "hover:bg-[#fafafa] transition-colors", isOpen ? "border-[#e6e6e6]" : "border-transparent", className), "data-slot": "sidebar-card-header", ...props, children: [collapsible ? (_jsxs("button", { type: "button", onClick: toggle, className: "flex min-w-0 flex-1 items-center gap-[8px] text-left cursor-pointer rounded-[6px] hover:bg-[#fafafa] transition-colors", "aria-expanded": isOpen, "data-cy": "sidebar-card-toggle", children: [_jsx("div", { className: "size-5 shrink-0", children: _jsx(ChevronUp, { className: cn("size-5 transition-transform duration-200 ease-in-out", !isOpen && "rotate-180"), color: "#1a1a1a" }) }), React.Children.map(children, (child) => {
+                        if (React.isValidElement(child) &&
+                            child.props?.["data-slot"] ===
+                                "sidebar-card-title") {
+                            return child;
+                        }
+                        return null;
+                    })] })) : (_jsx("div", { className: "flex min-w-0 flex-1 items-center gap-[8px]", children: React.Children.map(children, (child) => {
+                    if (React.isValidElement(child) &&
+                        child.props?.["data-slot"] ===
+                            "sidebar-card-title") {
+                        return child;
+                    }
+                    return null;
+                }) })), React.Children.map(children, (child) => {
+                if (React.isValidElement(child) &&
+                    child.props?.["data-slot"] ===
+                        "sidebar-card-action") {
+                    return child;
+                }
+                return null;
+            })] }));
+}
+/**
+ * Title text inside the header row.
+ * Renders as 18px bold text with truncation.
+ */
+function SidebarCardTitle({ className, children, ...props }) {
+    return (_jsx("div", { className: cn("flex-1 truncate text-[18px] font-bold leading-[24px] text-[#1a1a1a]", className), "data-slot": "sidebar-card-title", ...props, children: children }));
+}
+/**
+ * Right-side action slot in the header.
+ *
+ * The consumer brings their own content (dropdown menu, button, etc.).
+ * Clicks inside this slot are stopped from propagating to the toggle button.
+ */
+function SidebarCardAction({ className, children, ...props }) {
+    return (_jsx("div", { className: cn("shrink-0", className), onClick: (e) => e.stopPropagation(), "data-slot": "sidebar-card-action", ...props, children: children }));
+}
+/**
+ * Animated collapsible body of the card.
+ *
+ * Uses a ResizeObserver to measure content height and smoothly transition
+ * between open/closed states. When `collapsible` is `false` in the parent
+ * `SidebarCard`, this component simply renders its children without animation.
+ */
+function SidebarCardContent({ className, children, ...props }) {
+    const { isOpen, collapsible } = useSidebarCardContext();
+    const contentRef = React.useRef(null);
+    const [height, setHeight] = React.useState(isOpen ? undefined : 0);
+    // Measure content height when opening/closing
+    React.useEffect(() => {
+        if (!collapsible || !contentRef.current)
+            return;
+        if (isOpen) {
+            setHeight(contentRef.current.scrollHeight);
+        }
+        else {
+            setHeight(0);
+        }
+    }, [isOpen, collapsible]);
+    // Handle dynamic content changes while open
+    React.useEffect(() => {
+        if (!collapsible || !contentRef.current || !isOpen)
+            return;
+        const resizeObserver = new ResizeObserver((entries) => {
+            for (const entry of entries) {
+                if (isOpen) {
+                    const newHeight = entry.contentRect.height;
+                    setHeight((prev) => (prev === newHeight ? prev : newHeight));
+                }
+            }
+        });
+        resizeObserver.observe(contentRef.current);
+        return () => {
+            resizeObserver.disconnect();
+        };
+    }, [isOpen, collapsible]);
+    // Non-collapsible: render children directly
+    if (!collapsible) {
+        return (_jsx("div", { "data-slot": "sidebar-card-content", className: className, ...props, children: children }));
+    }
+    return (_jsx("div", { className: cn("overflow-hidden transition-all duration-300 ease-in-out", className), style: {
+            height: height !== undefined ? `${height}px` : undefined,
+        }, "data-slot": "sidebar-card-content", ...props, children: _jsx("div", { ref: contentRef, children: children }) }));
+}
+/**
+ * A padded section inside the card content.
+ * Use `bordered` to add a bottom separator between sections.
+ */
+function SidebarCardSection({ bordered = false, className, children, ...props }) {
+    return (_jsx("div", { className: cn("px-6 py-3", bordered && "border-b border-[#e6e6e6]", className), "data-slot": "sidebar-card-section", ...props, children: children }));
+}
+/* ─────────────────────────── Exports ─────────────────────────── */
+export { SidebarCard, SidebarCardHeader, SidebarCardTitle, SidebarCardAction, SidebarCardContent, SidebarCardSection, };
+//# sourceMappingURL=sidebar-card.js.map

package/dist/components/cards/sidebar-card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar-card.js","sourceRoot":"","sources":["../../../src/components/cards/sidebar-card.tsx"],"names":[],"mappings":"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"}

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

@@ -1,2 +1,9 @@
-export {};
+export { SidebarProvider, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarRail, SidebarSeparator, SidebarTrigger, useSidebar, sidebarMenuButtonVariants, } from "../ui/sidebar";
+export { SidebarNavGroup, SidebarNavItem, SidebarNavDivider } from "./sidebar-nav";
+export type { SidebarNavGroupProps, SidebarNavItemProps, SidebarNavDividerProps, } from "./sidebar-nav";
+export { SidebarNavPopover, SidebarNavPopoverItem, SidebarNavPopoverAction, } from "./sidebar-nav-popover";
+export type { SidebarNavPopoverProps, SidebarNavPopoverItemProps, SidebarNavPopoverActionProps, } from "./sidebar-nav-popover";
+export { SidebarToggle } from "./sidebar-toggle";
+export type { SidebarToggleProps } from "./sidebar-toggle";
+export { useSidebarActive, defaultIsActivePath } from "./use-sidebar-active";
 //# sourceMappingURL=index.d.ts.map

package/dist/components/sidebar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/index.ts"],"names":[],"mappings":"AAGA,OAAO,EACL,eAAe,EACf,OAAO,EACP,cAAc,EACd,aAAa,EACb,YAAY,EACZ,kBAAkB,EAClB,mBAAmB,EACnB,iBAAiB,EACjB,aAAa,EACb,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,EACjB,eAAe,EACf,mBAAmB,EACnB,cAAc,EACd,oBAAoB,EACpB,kBAAkB,EAClB,WAAW,EACX,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,yBAAyB,GAC1B,MAAM,eAAe,CAAC;AAGvB,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AACnF,YAAY,EACV,oBAAoB,EACpB,mBAAmB,EACnB,sBAAsB,GACvB,MAAM,eAAe,CAAC;AAEvB,OAAO,EACL,iBAAiB,EACjB,qBAAqB,EACrB,uBAAuB,GACxB,MAAM,uBAAuB,CAAC;AAC/B,YAAY,EACV,sBAAsB,EACtB,0BAA0B,EAC1B,4BAA4B,GAC7B,MAAM,uBAAuB,CAAC;AAE/B,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,YAAY,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAE3D,OAAO,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/components/sidebar/index.js

@@ -1,2 +1,9 @@
-export {};
+"use client";
+// Layer 1 — Primitives (re-exported from ui/sidebar.tsx)
+export { SidebarProvider, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarRail, SidebarSeparator, SidebarTrigger, useSidebar, sidebarMenuButtonVariants, } from "../ui/sidebar";
+// Layer 2 — Composables
+export { SidebarNavGroup, SidebarNavItem, SidebarNavDivider } from "./sidebar-nav";
+export { SidebarNavPopover, SidebarNavPopoverItem, SidebarNavPopoverAction, } from "./sidebar-nav-popover";
+export { SidebarToggle } from "./sidebar-toggle";
+export { useSidebarActive, defaultIsActivePath } from "./use-sidebar-active";
 //# sourceMappingURL=index.js.map

package/dist/components/sidebar/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/sidebar/index.ts"],"names":[],"mappings":""}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/sidebar/index.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,yDAAyD;AACzD,OAAO,EACL,eAAe,EACf,OAAO,EACP,cAAc,EACd,aAAa,EACb,YAAY,EACZ,kBAAkB,EAClB,mBAAmB,EACnB,iBAAiB,EACjB,aAAa,EACb,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,EACjB,eAAe,EACf,mBAAmB,EACnB,cAAc,EACd,oBAAoB,EACpB,kBAAkB,EAClB,WAAW,EACX,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,yBAAyB,GAC1B,MAAM,eAAe,CAAC;AAEvB,wBAAwB;AACxB,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAOnF,OAAO,EACL,iBAAiB,EACjB,qBAAqB,EACrB,uBAAuB,GACxB,MAAM,uBAAuB,CAAC;AAO/B,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAGjD,OAAO,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/components/sidebar/sidebar-nav-popover.d.ts

@@ -0,0 +1,70 @@
+import * as React from "react";
+export interface SidebarNavPopoverActionProps {
+    className?: string;
+    children: React.ReactNode;
+}
+/**
+ * Action slot on a popover item (e.g., bookmark button, pin, etc.).
+ * The library knows nothing about what goes here — it's purely a layout slot.
+ */
+export declare function SidebarNavPopoverAction({ className, children, }: SidebarNavPopoverActionProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace SidebarNavPopoverAction {
+    var displayName: string;
+}
+export interface SidebarNavPopoverItemProps {
+    /** Link destination */
+    href: string;
+    /** Icon component */
+    icon?: React.ComponentType<{
+        className?: string;
+    }>;
+    /** Description text shown below the title (optional) */
+    description?: string;
+    /** Override active path matching. Defaults to [href]. */
+    activePaths?: string[];
+    /** Whether the item is disabled */
+    disabled?: boolean;
+    className?: string;
+    /**
+     * Children: label text, and optionally a SidebarNavPopoverAction.
+     */
+    children: React.ReactNode;
+}
+/**
+ * An individual item inside a SidebarNavPopover.
+ */
+export declare function SidebarNavPopoverItem({ href, icon: Icon, description, activePaths: activePathsProp, disabled, className, children, }: SidebarNavPopoverItemProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace SidebarNavPopoverItem {
+    var displayName: string;
+}
+export interface SidebarNavPopoverProps {
+    className?: string;
+    /** Optional footer content */
+    footer?: React.ReactNode;
+    /** Content shown when there are no children */
+    emptyState?: React.ReactNode;
+    /** Which side to open on. Defaults to "right". */
+    side?: "right" | "left" | "top" | "bottom";
+    /** Alignment relative to the trigger. Defaults to "start". */
+    align?: "start" | "center" | "end";
+    /** Offset from the trigger in pixels. Defaults to 12. */
+    sideOffset?: number;
+    /**
+     * Called when the popover should close (e.g., after a link click).
+     * Injected automatically by SidebarNavItem — no need to pass manually.
+     */
+    onClose?: () => void;
+    /** Children: SidebarNavPopoverItem components */
+    children?: React.ReactNode;
+}
+/**
+ * Flyout popover for sub-navigation. Place as a child of SidebarNavItem.
+ *
+ * The popover renders as a PopoverContent and is wired up to the parent
+ * SidebarNavItem's Popover automatically.
+ */
+export declare function SidebarNavPopover({ className, footer, emptyState, side, align, sideOffset, onClose, children, }: SidebarNavPopoverProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace SidebarNavPopover {
+    var displayName: string;
+}
+//# sourceMappingURL=sidebar-nav-popover.d.ts.map

package/dist/components/sidebar/sidebar-nav-popover.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar-nav-popover.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/sidebar-nav-popover.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAe/B,MAAM,WAAW,4BAA4B;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;GAGG;AACH,wBAAgB,uBAAuB,CAAC,EACtC,SAAS,EACT,QAAQ,GACT,EAAE,4BAA4B,2CAa9B;yBAhBe,uBAAuB;;;AAwBvC,MAAM,WAAW,0BAA0B;IACzC,uBAAuB;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,qBAAqB;IACrB,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACnD,wDAAwD;IACxD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,yDAAyD;IACzD,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,mCAAmC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,IAAI,EACJ,IAAI,EAAE,IAAI,EACV,WAAW,EACX,WAAW,EAAE,eAAe,EAC5B,QAAgB,EAChB,SAAS,EACT,QAAQ,GACT,EAAE,0BAA0B,2CAiF5B;yBAzFe,qBAAqB;;;AAiGrC,MAAM,WAAW,sBAAsB;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8BAA8B;IAC9B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,+CAA+C;IAC/C,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,kDAAkD;IAClD,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,KAAK,GAAG,QAAQ,CAAC;IAC3C,8DAA8D;IAC9D,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;IACnC,yDAAyD;IACzD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,iDAAiD;IACjD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,MAAM,EACN,UAAU,EACV,IAAc,EACd,KAAe,EACf,UAAe,EACf,OAAO,EACP,QAAQ,GACT,EAAE,sBAAsB,2CAuCxB;yBAhDe,iBAAiB"}

package/dist/components/sidebar/sidebar-nav-popover.js

@@ -0,0 +1,71 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { useMemo } from "react";
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import { cn, kebabCase } from "../../lib/utils";
+import { PopoverContent, PopoverArrow } from "../ui/popover";
+import { defaultIsActivePath } from "./use-sidebar-active";
+/**
+ * Action slot on a popover item (e.g., bookmark button, pin, etc.).
+ * The library knows nothing about what goes here — it's purely a layout slot.
+ */
+export function SidebarNavPopoverAction({ className, children, }) {
+    return (_jsx("div", { "data-slot": "sidebar-nav-popover-action", className: cn("transition-opacity flex-none", className), onClick: (e) => e.stopPropagation(), children: children }));
+}
+SidebarNavPopoverAction.displayName = "SidebarNavPopoverAction";
+/**
+ * An individual item inside a SidebarNavPopover.
+ */
+export function SidebarNavPopoverItem({ href, icon: Icon, description, activePaths: activePathsProp, disabled = false, className, children, }) {
+    const pathname = usePathname();
+    const activePaths = activePathsProp ?? [href];
+    const isActive = useMemo(() => defaultIsActivePath(pathname, activePaths), [pathname, activePaths]);
+    // Separate text children from SidebarNavPopoverAction children
+    const { label, actionElement } = useMemo(() => {
+        let action = null;
+        const labelParts = [];
+        React.Children.forEach(children, (child) => {
+            if (React.isValidElement(child) &&
+                child.type?.displayName === "SidebarNavPopoverAction") {
+                action = child;
+            }
+            else {
+                labelParts.push(child);
+            }
+        });
+        return {
+            label: labelParts.length === 1 ? labelParts[0] : labelParts,
+            actionElement: action,
+        };
+    }, [children]);
+    const itemDataCy = `sidebar-popover-item-${kebabCase(typeof label === "string" ? label : href)}`;
+    return (_jsxs("div", { "data-slot": "sidebar-nav-popover-item", className: cn("group/popover-item h-10 flex items-center justify-between gap-2 rounded-[14px] p-2 transition-colors", isActive
+            ? "border-primary/20 bg-primary/5"
+            : "bg-white hover:bg-primary/5", disabled && "pointer-events-none opacity-50", className), children: [_jsxs(Link, { href: href, className: "flex items-center gap-3 min-w-0 flex-1", "data-cy": itemDataCy, children: [Icon && (_jsx(Icon, { className: cn("size-5 shrink-0", isActive
+                            ? "text-primary"
+                            : "text-[#1A1A1A] group-hover/popover-item:text-primary") })), _jsxs("div", { className: "flex flex-col min-w-0", children: [_jsx("span", { className: cn("font-normal text-sm truncate", isActive
+                                    ? "text-primary font-medium"
+                                    : "text-[#1A1A1A] group-hover/popover-item:text-primary"), children: label }), description && (_jsx("span", { className: "text-xs text-muted-foreground truncate", children: description }))] })] }), actionElement] }));
+}
+SidebarNavPopoverItem.displayName = "SidebarNavPopoverItem";
+/**
+ * Flyout popover for sub-navigation. Place as a child of SidebarNavItem.
+ *
+ * The popover renders as a PopoverContent and is wired up to the parent
+ * SidebarNavItem's Popover automatically.
+ */
+export function SidebarNavPopover({ className, footer, emptyState, side = "right", align = "start", sideOffset = 12, onClose, children, }) {
+    const hasChildren = React.Children.count(children) > 0;
+    return (_jsxs(PopoverContent, { side: side, align: align, sideOffset: sideOffset, className: cn("min-w-[266px] max-w-fit border-0 p-0 rounded-[20px] overflow-hidden", "[box-shadow:0_12px_20px_0_rgba(0,0,0,0.08),0_4px_6px_0_rgba(0,0,0,0.06)]", className), "data-slot": "sidebar-nav-popover", onInteractOutside: (event) => {
+            const target = event.target;
+            if (!(target instanceof HTMLElement))
+                return;
+            if (target.closest("[data-slot='sidebar-nav-popover']")) {
+                event.preventDefault();
+            }
+        }, children: [_jsx(PopoverArrow, { className: "fill-white [animation:none]" }), _jsx("div", { className: "bg-white", children: _jsxs("div", { className: "p-2", children: [_jsx("div", { className: "max-h-[500px] overflow-y-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden pr-1", children: _jsx("div", { className: "flex flex-col gap-2", onClick: () => onClose?.(), children: !hasChildren && emptyState ? (_jsx("div", { className: "px-4 py-3", children: emptyState })) : (children) }) }), footer && _jsx("div", { className: "pt-2 mt-2 border-t border-[#E6E6E6]", children: footer })] }) })] }));
+}
+SidebarNavPopover.displayName = "SidebarNavPopover";
+//# sourceMappingURL=sidebar-nav-popover.js.map

package/dist/components/sidebar/sidebar-nav-popover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar-nav-popover.js","sourceRoot":"","sources":["../../../src/components/sidebar/sidebar-nav-popover.tsx"],"names":[],"mappings":"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"}