@epicbagel/saas-kit 1.13.0 → 1.15.0

package/dist/primitives/list.d.cts

@@ -1,5 +1,8 @@
 import * as React from 'react';
-import { HTMLAttributes } from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
+import { Sentiment } from './sentiment-dot.cjs';
+import 'react/jsx-runtime';
+import '../lib/status-colors.cjs';
 
 interface ListProps extends HTMLAttributes<HTMLUListElement | HTMLOListElement> {
     ordered?: boolean;
@@ -17,7 +20,11 @@ interface ListProps extends HTMLAttributes<HTMLUListElement | HTMLOListElement>
 /** Semantic ordered or unordered list with controlled rhythm and markers. */
 declare const List: React.ForwardRefExoticComponent<ListProps & React.RefAttributes<HTMLOListElement | HTMLUListElement>>;
 interface ListItemProps extends HTMLAttributes<HTMLLIElement> {
-    layout?: "plain" | "row";
+    layout?: "plain" | "row" | "bullet";
+    /** A semantic dot with consistent spacing and wrapping in the bullet layout. */
+    sentiment?: Sentiment;
+    /** Trailing controls for a bullet row; the content keeps the same alignment without them. */
+    actions?: ReactNode;
     surface?: "none" | "bordered";
     padding?: "none" | "sm" | "compact" | "md";
     textSize?: "inherit" | "xs" | "sm";

package/dist/primitives/list.d.ts

@@ -1,5 +1,8 @@
 import * as React from 'react';
-import { HTMLAttributes } from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
+import { Sentiment } from './sentiment-dot.js';
+import 'react/jsx-runtime';
+import '../lib/status-colors.js';
 
 interface ListProps extends HTMLAttributes<HTMLUListElement | HTMLOListElement> {
     ordered?: boolean;
@@ -17,7 +20,11 @@ interface ListProps extends HTMLAttributes<HTMLUListElement | HTMLOListElement>
 /** Semantic ordered or unordered list with controlled rhythm and markers. */
 declare const List: React.ForwardRefExoticComponent<ListProps & React.RefAttributes<HTMLOListElement | HTMLUListElement>>;
 interface ListItemProps extends HTMLAttributes<HTMLLIElement> {
-    layout?: "plain" | "row";
+    layout?: "plain" | "row" | "bullet";
+    /** A semantic dot with consistent spacing and wrapping in the bullet layout. */
+    sentiment?: Sentiment;
+    /** Trailing controls for a bullet row; the content keeps the same alignment without them. */
+    actions?: ReactNode;
     surface?: "none" | "bordered";
     padding?: "none" | "sm" | "compact" | "md";
     textSize?: "inherit" | "xs" | "sm";

package/dist/primitives/list.js

@@ -1,67 +1,12 @@
 "use client";
 import {
-  cn
-} from "../chunk-G6SRSWXB.js";
-
-// src/primitives/list.tsx
-import { forwardRef } from "react";
-import { jsx } from "react/jsx-runtime";
-var spacingStyles = { none: "", tight: "space-y-1.5", normal: "space-y-3" };
-var markerStyles = {
-  none: "list-none",
-  disc: "list-disc pl-5",
-  decimal: "list-decimal pl-5"
-};
-var List = forwardRef(function List2({ ordered = false, spacing = "none", marker = "none", divided = false, inset = "none", guide = false, textSize = "inherit", tone = "inherit", marginTop = "none", surface = "none", radius = "none", className, ...props }, ref) {
-  const Component = ordered ? "ol" : "ul";
-  return /* @__PURE__ */ jsx(
-    Component,
-    {
-      ref,
-      className: cn(
-        spacingStyles[spacing],
-        markerStyles[marker],
-        divided && "divide-y divide-border",
-        inset === "xs" && "pl-1",
-        inset === "md" && "pl-4",
-        guide && "border-l border-border",
-        textSize === "xs" && "text-xs",
-        textSize === "sm" && "text-sm",
-        tone === "muted" && "text-muted-foreground",
-        tone === "soft" && "text-foreground/80",
-        marginTop === "sm" && "mt-2",
-        marginTop === "md" && "mt-4",
-        surface === "bordered" && "border border-border bg-background",
-        radius === "md" && "rounded-md",
-        className
-      ),
-      ...props
-    }
-  );
-});
-var ListItem = forwardRef(function ListItem2({ className, layout = "plain", surface = "none", padding = "none", textSize = "inherit", tone = "inherit", position = "static", justify = "start", align = "start", gap = "xs", interactiveGroup = false, radius = "none", accent = "none", ...props }, ref) {
-  return /* @__PURE__ */ jsx("li", { ref, className: cn(
-    layout === "row" && "flex items-start",
-    surface === "bordered" && "rounded-md border",
-    padding === "sm" && "p-2",
-    padding === "md" && "px-3 py-2",
-    padding === "compact" && "py-2.5",
-    textSize === "xs" && "text-xs",
-    textSize === "sm" && "text-sm",
-    tone === "soft" && "text-foreground/80",
-    position === "relative" && "relative",
-    justify === "between" && "justify-between gap-3",
-    align === "center" && "items-center",
-    align === "baseline" && "items-baseline",
-    gap === "xs" && "gap-1.5",
-    gap === "sm" && "gap-2",
-    interactiveGroup && "group",
-    radius === "md" && "rounded-md",
-    accent === "success" && "border-l-2 border-emerald-500 bg-emerald-500/5",
-    accent === "destructive" && "border-l-2 border-red-500 bg-red-500/5",
-    className
-  ), ...props });
-});
+  List,
+  ListItem
+} from "../chunk-YFXZWDA5.js";
+import "../chunk-YWAQRAXP.js";
+import "../chunk-EIY5LLSP.js";
+import "../chunk-F7JHSZNT.js";
+import "../chunk-G6SRSWXB.js";
 export {
   List,
   ListItem

package/dist/primitives/message-scroller.cjs

@@ -10,7 +10,10 @@
 
 
 
-var _chunk5VMKDVB6cjs = require('../chunk-5VMKDVB6.cjs');
+
+var _chunkPD5UQEKYcjs = require('../chunk-PD5UQEKY.cjs');
+require('../chunk-34AS3OCC.cjs');
+require('../chunk-WABCLRBR.cjs');
 require('../chunk-JDEXZGIY.cjs');
 require('../chunk-KWLSBTB2.cjs');
 
@@ -23,4 +26,5 @@ require('../chunk-KWLSBTB2.cjs');
 
 
 
-exports.MessageScroller = _chunk5VMKDVB6cjs.MessageScroller; exports.MessageScrollerButton = _chunk5VMKDVB6cjs.MessageScrollerButton; exports.MessageScrollerContent = _chunk5VMKDVB6cjs.MessageScrollerContent; exports.MessageScrollerItem = _chunk5VMKDVB6cjs.MessageScrollerItem; exports.MessageScrollerProvider = _chunk5VMKDVB6cjs.MessageScrollerProvider; exports.MessageScrollerViewport = _chunk5VMKDVB6cjs.MessageScrollerViewport; exports.useMessageScroller = _chunk5VMKDVB6cjs.useMessageScroller; exports.useMessageScrollerScrollable = _chunk5VMKDVB6cjs.useMessageScrollerScrollable; exports.useMessageScrollerVisibility = _chunk5VMKDVB6cjs.useMessageScrollerVisibility;
+
+exports.MessageScroller = _chunkPD5UQEKYcjs.MessageScroller; exports.MessageScrollerButton = _chunkPD5UQEKYcjs.MessageScrollerButton; exports.MessageScrollerContent = _chunkPD5UQEKYcjs.MessageScrollerContent; exports.MessageScrollerItem = _chunkPD5UQEKYcjs.MessageScrollerItem; exports.MessageScrollerNavigator = _chunkPD5UQEKYcjs.MessageScrollerNavigator; exports.MessageScrollerProvider = _chunkPD5UQEKYcjs.MessageScrollerProvider; exports.MessageScrollerViewport = _chunkPD5UQEKYcjs.MessageScrollerViewport; exports.useMessageScroller = _chunkPD5UQEKYcjs.useMessageScroller; exports.useMessageScrollerScrollable = _chunkPD5UQEKYcjs.useMessageScrollerScrollable; exports.useMessageScrollerVisibility = _chunkPD5UQEKYcjs.useMessageScrollerVisibility;

package/dist/primitives/message-scroller.d.cts

@@ -3,14 +3,18 @@ import * as React from 'react';
 import { MessageScroller as MessageScroller$1 } from '@shadcn/react/message-scroller';
 export { useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility } from '@shadcn/react/message-scroller';
 import { Button } from './button.cjs';
+import { ScrollNavigatorProps } from './scroll-navigator.cjs';
 import 'class-variance-authority/types';
 import 'class-variance-authority';
 
 declare function MessageScrollerProvider(props: React.ComponentProps<typeof MessageScroller$1.Provider>): react_jsx_runtime.JSX.Element;
+/** A list index inside a message. Jumps use the thread's own anchoring API,
+ * so incoming content cannot snap the reader back to the end of the thread. */
+declare function MessageScrollerNavigator(props: ScrollNavigatorProps): react_jsx_runtime.JSX.Element;
 declare function MessageScroller({ className, ...props }: React.ComponentProps<typeof MessageScroller$1.Root>): react_jsx_runtime.JSX.Element;
 declare function MessageScrollerViewport({ className, ...props }: React.ComponentProps<typeof MessageScroller$1.Viewport>): react_jsx_runtime.JSX.Element;
 declare function MessageScrollerContent({ className, ...props }: React.ComponentProps<typeof MessageScroller$1.Content>): react_jsx_runtime.JSX.Element;
 declare function MessageScrollerItem({ className, scrollAnchor, ...props }: React.ComponentProps<typeof MessageScroller$1.Item>): react_jsx_runtime.JSX.Element;
 declare function MessageScrollerButton({ direction, className, children, render, variant, size, ...props }: React.ComponentProps<typeof MessageScroller$1.Button> & Pick<React.ComponentProps<typeof Button>, "variant" | "size">): react_jsx_runtime.JSX.Element;
 
-export { MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport };
+export { MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerNavigator, MessageScrollerProvider, MessageScrollerViewport };

package/dist/primitives/message-scroller.d.ts

@@ -3,14 +3,18 @@ import * as React from 'react';
 import { MessageScroller as MessageScroller$1 } from '@shadcn/react/message-scroller';
 export { useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility } from '@shadcn/react/message-scroller';
 import { Button } from './button.js';
+import { ScrollNavigatorProps } from './scroll-navigator.js';
 import 'class-variance-authority/types';
 import 'class-variance-authority';
 
 declare function MessageScrollerProvider(props: React.ComponentProps<typeof MessageScroller$1.Provider>): react_jsx_runtime.JSX.Element;
+/** A list index inside a message. Jumps use the thread's own anchoring API,
+ * so incoming content cannot snap the reader back to the end of the thread. */
+declare function MessageScrollerNavigator(props: ScrollNavigatorProps): react_jsx_runtime.JSX.Element;
 declare function MessageScroller({ className, ...props }: React.ComponentProps<typeof MessageScroller$1.Root>): react_jsx_runtime.JSX.Element;
 declare function MessageScrollerViewport({ className, ...props }: React.ComponentProps<typeof MessageScroller$1.Viewport>): react_jsx_runtime.JSX.Element;
 declare function MessageScrollerContent({ className, ...props }: React.ComponentProps<typeof MessageScroller$1.Content>): react_jsx_runtime.JSX.Element;
 declare function MessageScrollerItem({ className, scrollAnchor, ...props }: React.ComponentProps<typeof MessageScroller$1.Item>): react_jsx_runtime.JSX.Element;
 declare function MessageScrollerButton({ direction, className, children, render, variant, size, ...props }: React.ComponentProps<typeof MessageScroller$1.Button> & Pick<React.ComponentProps<typeof Button>, "variant" | "size">): react_jsx_runtime.JSX.Element;
 
-export { MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport };
+export { MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerNavigator, MessageScrollerProvider, MessageScrollerViewport };

package/dist/primitives/message-scroller.js

@@ -5,12 +5,15 @@ import {
   MessageScrollerButton,
   MessageScrollerContent,
   MessageScrollerItem,
+  MessageScrollerNavigator,
   MessageScrollerProvider,
   MessageScrollerViewport,
   useMessageScroller,
   useMessageScrollerScrollable,
   useMessageScrollerVisibility
-} from "../chunk-2V7AVB2U.js";
+} from "../chunk-UBTLWSKK.js";
+import "../chunk-VT2WDFSU.js";
+import "../chunk-3OWGL4Q2.js";
 import "../chunk-W326GKML.js";
 import "../chunk-G6SRSWXB.js";
 export {
@@ -18,6 +21,7 @@ export {
   MessageScrollerButton,
   MessageScrollerContent,
   MessageScrollerItem,
+  MessageScrollerNavigator,
   MessageScrollerProvider,
   MessageScrollerViewport,
   useMessageScroller,

package/dist/primitives/scroll-navigator.cjs

@@ -0,0 +1,10 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
+"use client";
+
+
+var _chunk34AS3OCCcjs = require('../chunk-34AS3OCC.cjs');
+require('../chunk-WABCLRBR.cjs');
+require('../chunk-KWLSBTB2.cjs');
+
+
+exports.ScrollNavigator = _chunk34AS3OCCcjs.ScrollNavigator;

package/dist/primitives/scroll-navigator.d.cts

@@ -0,0 +1,40 @@
+import * as React from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
+
+interface ScrollNavigatorItem {
+    /** Stable within this list. Separate lists can contain the same IDs. */
+    id: string;
+    label: string;
+    imageSrc?: string | null;
+    /** Initials or an icon; defaults to the label's initials. */
+    fallback?: ReactNode;
+    content: ReactNode;
+}
+interface ScrollNavigatorScrollOptions {
+    /** Space above the target, including the horizontal navigator when present. */
+    offset: number;
+    behavior: ScrollBehavior;
+}
+interface ScrollNavigatorProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
+    items: readonly ScrollNavigatorItem[];
+    label?: string;
+    /** Space below a sticky header inside the scroll viewport, in pixels. */
+    topOffset?: number;
+    /** The nearest vertically scrolling ancestor is detected by default. */
+    scrollRoot?: HTMLElement | null;
+    /** Return true when a host scroller has handled the jump. */
+    onNavigate?: (id: string, target: HTMLElement, options: ScrollNavigatorScrollOptions) => boolean | void;
+}
+/**
+ * A list with an avatar index which follows the first item at the viewport's
+ * reading edge. The index lives only beside this list: it disappears before
+ * and after it. With no room in the left gutter it becomes a horizontal row.
+ * The row reserves space above the first item; later items scroll beneath it.
+ *
+ * Portalling the controls avoids clipping by cards, message bubbles and
+ * content-visibility containers. Their bounds still follow the list and its
+ * actual scroll viewport, never the full browser height of a nested pane.
+ */
+declare const ScrollNavigator: React.ForwardRefExoticComponent<ScrollNavigatorProps & React.RefAttributes<HTMLDivElement>>;
+
+export { ScrollNavigator, type ScrollNavigatorItem, type ScrollNavigatorProps, type ScrollNavigatorScrollOptions };

package/dist/primitives/scroll-navigator.d.ts

@@ -0,0 +1,40 @@
+import * as React from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
+
+interface ScrollNavigatorItem {
+    /** Stable within this list. Separate lists can contain the same IDs. */
+    id: string;
+    label: string;
+    imageSrc?: string | null;
+    /** Initials or an icon; defaults to the label's initials. */
+    fallback?: ReactNode;
+    content: ReactNode;
+}
+interface ScrollNavigatorScrollOptions {
+    /** Space above the target, including the horizontal navigator when present. */
+    offset: number;
+    behavior: ScrollBehavior;
+}
+interface ScrollNavigatorProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
+    items: readonly ScrollNavigatorItem[];
+    label?: string;
+    /** Space below a sticky header inside the scroll viewport, in pixels. */
+    topOffset?: number;
+    /** The nearest vertically scrolling ancestor is detected by default. */
+    scrollRoot?: HTMLElement | null;
+    /** Return true when a host scroller has handled the jump. */
+    onNavigate?: (id: string, target: HTMLElement, options: ScrollNavigatorScrollOptions) => boolean | void;
+}
+/**
+ * A list with an avatar index which follows the first item at the viewport's
+ * reading edge. The index lives only beside this list: it disappears before
+ * and after it. With no room in the left gutter it becomes a horizontal row.
+ * The row reserves space above the first item; later items scroll beneath it.
+ *
+ * Portalling the controls avoids clipping by cards, message bubbles and
+ * content-visibility containers. Their bounds still follow the list and its
+ * actual scroll viewport, never the full browser height of a nested pane.
+ */
+declare const ScrollNavigator: React.ForwardRefExoticComponent<ScrollNavigatorProps & React.RefAttributes<HTMLDivElement>>;
+
+export { ScrollNavigator, type ScrollNavigatorItem, type ScrollNavigatorProps, type ScrollNavigatorScrollOptions };

package/dist/primitives/scroll-navigator.js

@@ -0,0 +1,10 @@
+"use client";
+"use client";
+import {
+  ScrollNavigator
+} from "../chunk-VT2WDFSU.js";
+import "../chunk-3OWGL4Q2.js";
+import "../chunk-G6SRSWXB.js";
+export {
+  ScrollNavigator
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epicbagel/saas-kit",
-  "version": "1.13.0",
+  "version": "1.15.0",
   "description": "Accessible React primitives, layout components and design tokens for SaaS apps, built on Radix UI and Tailwind CSS v4.",
   "license": "MIT",
   "keywords": [
@@ -950,6 +950,16 @@
         "default": "./dist/primitives/scroll-area.cjs"
       }
     },
+    "./primitives/scroll-navigator": {
+      "import": {
+        "types": "./dist/primitives/scroll-navigator.d.ts",
+        "default": "./dist/primitives/scroll-navigator.js"
+      },
+      "require": {
+        "types": "./dist/primitives/scroll-navigator.d.cts",
+        "default": "./dist/primitives/scroll-navigator.cjs"
+      }
+    },
     "./primitives/search-input": {
       "import": {
         "types": "./dist/primitives/search-input.d.ts",