@epicbagel/saas-kit 1.14.0 → 1.15.0

package/dist/chunk-WE3F6EUM.cjs

@@ -0,0 +1,81 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
+
+
+var _chunkW5I4FN7Gcjs = require('./chunk-W5I4FN7G.cjs');
+
+
+var _chunk373W6VADcjs = require('./chunk-373W6VAD.cjs');
+
+
+var _chunkKWLSBTB2cjs = require('./chunk-KWLSBTB2.cjs');
+
+// src/primitives/list.tsx
+var _react = require('react');
+var _jsxruntime = require('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 = _react.forwardRef.call(void 0, 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__ */ _jsxruntime.jsx.call(void 0, 
+    Component,
+    {
+      ref,
+      role: marker === "none" ? "list" : void 0,
+      className: _chunkKWLSBTB2cjs.cn.call(void 0, 
+        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 = _react.forwardRef.call(void 0, function ListItem2({ className, layout = "plain", sentiment = "neutral", actions, children, 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__ */ _jsxruntime.jsx.call(void 0, "li", { ref, className: _chunkKWLSBTB2cjs.cn.call(void 0, 
+    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",
+    layout === "bullet" && "group flex min-h-8 items-start gap-3 pointer-coarse:min-h-[max(44px,2.75rem)]",
+    className
+  ), ...props, children: layout === "bullet" ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkW5I4FN7Gcjs.SentimentDot, { sentiment, className: "mt-[5px] shrink-0" }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk373W6VADcjs.Text, { as: "div", variant: "small", className: "min-w-0 flex-1 leading-snug [overflow-wrap:anywhere]", children }),
+    actions
+  ] }) : children });
+});
+
+
+
+
+exports.List = List; exports.ListItem = ListItem;

package/dist/chunk-YFXZWDA5.js

@@ -0,0 +1,81 @@
+"use client";
+import {
+  SentimentDot
+} from "./chunk-YWAQRAXP.js";
+import {
+  Text
+} from "./chunk-EIY5LLSP.js";
+import {
+  cn
+} from "./chunk-G6SRSWXB.js";
+
+// src/primitives/list.tsx
+import { forwardRef } from "react";
+import { Fragment, jsx, jsxs } 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,
+      role: marker === "none" ? "list" : void 0,
+      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", sentiment = "neutral", actions, children, 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",
+    layout === "bullet" && "group flex min-h-8 items-start gap-3 pointer-coarse:min-h-[max(44px,2.75rem)]",
+    className
+  ), ...props, children: layout === "bullet" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(SentimentDot, { sentiment, className: "mt-[5px] shrink-0" }),
+    /* @__PURE__ */ jsx(Text, { as: "div", variant: "small", className: "min-w-0 flex-1 leading-snug [overflow-wrap:anywhere]", children }),
+    actions
+  ] }) : children });
+});
+
+export {
+  List,
+  ListItem
+};

package/dist/primitives/alert.d.cts

@@ -4,7 +4,7 @@ import * as class_variance_authority_types from 'class-variance-authority/types'
 import { VariantProps } from 'class-variance-authority';
 
 declare const alertVariants: (props?: ({
-    variant?: "default" | "destructive" | "success" | "warning" | null | undefined;
+    variant?: "success" | "default" | "destructive" | "warning" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface AlertProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {
     marginBottom?: "none" | "md";

package/dist/primitives/alert.d.ts

@@ -4,7 +4,7 @@ import * as class_variance_authority_types from 'class-variance-authority/types'
 import { VariantProps } from 'class-variance-authority';
 
 declare const alertVariants: (props?: ({
-    variant?: "default" | "destructive" | "success" | "warning" | null | undefined;
+    variant?: "success" | "default" | "destructive" | "warning" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface AlertProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {
     marginBottom?: "none" | "md";

package/dist/primitives/badge.d.cts

@@ -4,7 +4,7 @@ import { VariantProps } from 'class-variance-authority';
 import { ElementType } from 'react';
 
 declare const badgeVariants: (props?: ({
-    variant?: "default" | "secondary" | "destructive" | "outline" | "success" | "warning" | "error" | "info" | "neutral" | null | undefined;
+    variant?: "neutral" | "error" | "success" | "default" | "secondary" | "destructive" | "outline" | "warning" | "info" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
     weight?: "normal" | "semibold" | "bold";

package/dist/primitives/badge.d.ts

@@ -4,7 +4,7 @@ import { VariantProps } from 'class-variance-authority';
 import { ElementType } from 'react';
 
 declare const badgeVariants: (props?: ({
-    variant?: "default" | "secondary" | "destructive" | "outline" | "success" | "warning" | "error" | "info" | "neutral" | null | undefined;
+    variant?: "neutral" | "error" | "success" | "default" | "secondary" | "destructive" | "outline" | "warning" | "info" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
     weight?: "normal" | "semibold" | "bold";

package/dist/primitives/bubble.d.cts

@@ -5,7 +5,7 @@ import { VariantProps } from 'class-variance-authority';
 
 declare function BubbleGroup({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 declare const bubbleVariants: (props?: ({
-    variant?: "default" | "muted" | "secondary" | "destructive" | "outline" | "ghost" | "tinted" | null | undefined;
+    variant?: "default" | "muted" | "ghost" | "secondary" | "destructive" | "outline" | "tinted" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare function Bubble({ variant, align, className, ...props }: React.ComponentProps<"div"> & VariantProps<typeof bubbleVariants> & {
     align?: "start" | "end";

package/dist/primitives/bubble.d.ts

@@ -5,7 +5,7 @@ import { VariantProps } from 'class-variance-authority';
 
 declare function BubbleGroup({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 declare const bubbleVariants: (props?: ({
-    variant?: "default" | "muted" | "secondary" | "destructive" | "outline" | "ghost" | "tinted" | null | undefined;
+    variant?: "default" | "muted" | "ghost" | "secondary" | "destructive" | "outline" | "tinted" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare function Bubble({ variant, align, className, ...props }: React.ComponentProps<"div"> & VariantProps<typeof bubbleVariants> & {
     align?: "start" | "end";

package/dist/primitives/button.d.cts

@@ -4,8 +4,8 @@ import * as class_variance_authority_types from 'class-variance-authority/types'
 import { VariantProps } from 'class-variance-authority';
 
 declare const buttonVariants: (props?: ({
-    variant?: "link" | "default" | "secondary" | "destructive" | "outline" | "outline-muted" | "ghost" | "quiet" | "ghost-destructive" | "link-muted" | "inverted" | "status-error" | "status-warning" | "status-muted" | null | undefined;
-    size?: "filter" | "status" | "toolbar" | "sm" | "lg" | "default" | "micro" | "compact" | "hero" | "icon" | "icon-lg" | "icon-sm" | "icon-md" | "icon-xs" | "icon-compact" | "icon-micro" | "bare" | "voice-sm" | "voice" | "suggestion" | "tone" | null | undefined;
+    variant?: "link" | "default" | "ghost" | "secondary" | "destructive" | "outline" | "outline-muted" | "quiet" | "ghost-destructive" | "link-muted" | "inverted" | "status-error" | "status-warning" | "status-muted" | null | undefined;
+    size?: "filter" | "status" | "toolbar" | "sm" | "lg" | "default" | "micro" | "tone" | "compact" | "hero" | "icon" | "icon-lg" | "icon-sm" | "icon-md" | "icon-xs" | "icon-compact" | "icon-micro" | "bare" | "voice-sm" | "voice" | "suggestion" | null | undefined;
     width?: "auto" | "full" | "responsive" | null | undefined;
     align?: "center" | "start" | null | undefined;
     shrink?: boolean | null | undefined;

package/dist/primitives/button.d.ts

@@ -4,8 +4,8 @@ import * as class_variance_authority_types from 'class-variance-authority/types'
 import { VariantProps } from 'class-variance-authority';
 
 declare const buttonVariants: (props?: ({
-    variant?: "link" | "default" | "secondary" | "destructive" | "outline" | "outline-muted" | "ghost" | "quiet" | "ghost-destructive" | "link-muted" | "inverted" | "status-error" | "status-warning" | "status-muted" | null | undefined;
-    size?: "filter" | "status" | "toolbar" | "sm" | "lg" | "default" | "micro" | "compact" | "hero" | "icon" | "icon-lg" | "icon-sm" | "icon-md" | "icon-xs" | "icon-compact" | "icon-micro" | "bare" | "voice-sm" | "voice" | "suggestion" | "tone" | null | undefined;
+    variant?: "link" | "default" | "ghost" | "secondary" | "destructive" | "outline" | "outline-muted" | "quiet" | "ghost-destructive" | "link-muted" | "inverted" | "status-error" | "status-warning" | "status-muted" | null | undefined;
+    size?: "filter" | "status" | "toolbar" | "sm" | "lg" | "default" | "micro" | "tone" | "compact" | "hero" | "icon" | "icon-lg" | "icon-sm" | "icon-md" | "icon-xs" | "icon-compact" | "icon-micro" | "bare" | "voice-sm" | "voice" | "suggestion" | null | undefined;
     width?: "auto" | "full" | "responsive" | null | undefined;
     align?: "center" | "start" | null | undefined;
     shrink?: boolean | null | undefined;

package/dist/primitives/editable-list.cjs

@@ -1,7 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }"use client";
 
 
-var _chunkW5I4FN7Gcjs = require('../chunk-W5I4FN7G.cjs');
+
+var _chunkWE3F6EUMcjs = require('../chunk-WE3F6EUM.cjs');
+require('../chunk-W5I4FN7G.cjs');
 
 
 var _chunk373W6VADcjs = require('../chunk-373W6VAD.cjs');
@@ -49,36 +51,29 @@ function EditableList({
   };
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "section", { className: _chunkKWLSBTB2cjs.cn.call(void 0, "border-t border-border pt-4", className), children: [
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk373W6VADcjs.Text, { as: "span", variant: "caption", className: "text-xs font-medium uppercase tracking-wider", children: label }),
-    items.length === 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk373W6VADcjs.Text, { variant: "caption", className: "mt-3 italic", children: emptyText }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "ul", { className: "mt-3 space-y-3", children: items.map((item, index) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "li", { className: "group flex items-start gap-3", children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkW5I4FN7Gcjs.SentimentDot, { sentiment, className: "mt-[5px] shrink-0" }),
-      !readOnly && _optionalChain([editing, 'optionalAccess', _5 => _5.index]) === index ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _chunkPQUSJEXLcjs.Input,
-          {
-            autoFocus: true,
-            value: editing.value,
-            "aria-label": `Edit ${itemName}`,
-            onChange: (event) => setEditing({ index, value: event.target.value }),
-            onKeyDown: (event) => {
-              if (event.key === "Enter") {
-                event.preventDefault();
-                commitEdit();
-              }
-              if (event.key === "Escape") setEditing(null);
-            },
-            grow: true
+    items.length === 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk373W6VADcjs.Text, { variant: "caption", className: "mt-3 italic", children: emptyText }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkWE3F6EUMcjs.List, { spacing: "normal", className: "mt-3", children: items.map((item, index) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkWE3F6EUMcjs.ListItem, { layout: "bullet", sentiment, actions: !readOnly && (_optionalChain([editing, 'optionalAccess', _5 => _5.index]) === index ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { type: "button", variant: "ghost", size: "icon-sm", shrink: true, className: "text-emerald-600", "aria-label": `Save ${itemName}`, onClick: commitEdit, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Check, { className: "h-4 w-4" }) }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { type: "button", variant: "quiet", size: "icon-sm", shrink: true, marginEnd: "negative-xs", "aria-label": `Cancel editing ${itemName}`, onClick: () => setEditing(null), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.X, { className: "h-4 w-4" }) })
+    ] }) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { type: "button", variant: "ghost", size: "icon", className: "h-8 w-8 shrink-0 text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100 focus:opacity-100", "aria-label": `Edit ${itemName}`, onClick: () => setEditing({ index, value: item }), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Pencil, { className: "h-4 w-4" }) }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { type: "button", variant: "ghost", size: "icon", className: "-mr-1 h-8 w-8 shrink-0 text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100 focus:opacity-100", "aria-label": `Remove ${itemName}`, onClick: () => onChange(items.filter((_, itemIndex) => itemIndex !== index)), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.X, { className: "h-4 w-4" }) })
+    ] })), children: !readOnly && _optionalChain([editing, 'optionalAccess', _6 => _6.index]) === index ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkPQUSJEXLcjs.Input,
+      {
+        autoFocus: true,
+        value: editing.value,
+        "aria-label": `Edit ${itemName}`,
+        onChange: (event) => setEditing({ index, value: event.target.value }),
+        onKeyDown: (event) => {
+          if (event.key === "Enter") {
+            event.preventDefault();
+            commitEdit();
           }
-        ),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { type: "button", variant: "ghost", size: "icon-sm", shrink: true, className: "text-emerald-600", "aria-label": `Save ${itemName}`, onClick: commitEdit, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Check, { className: "h-4 w-4" }) }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { type: "button", variant: "quiet", size: "icon-sm", shrink: true, marginEnd: "negative-xs", "aria-label": `Cancel editing ${itemName}`, onClick: () => setEditing(null), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.X, { className: "h-4 w-4" }) })
-      ] }) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk373W6VADcjs.Text, { as: "span", variant: "small", className: "flex-1 leading-snug", children: item }),
-        !readOnly && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { type: "button", variant: "ghost", size: "icon", className: "h-8 w-8 shrink-0 text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100 focus:opacity-100", "aria-label": `Edit ${itemName}`, onClick: () => setEditing({ index, value: item }), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Pencil, { className: "h-4 w-4" }) }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { type: "button", variant: "ghost", size: "icon", className: "-mr-1 h-8 w-8 shrink-0 text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100 focus:opacity-100", "aria-label": `Remove ${itemName}`, onClick: () => onChange(items.filter((_, itemIndex) => itemIndex !== index)), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.X, { className: "h-4 w-4" }) })
-        ] })
-      ] })
-    ] }, `${item}-${index}`)) }),
+          if (event.key === "Escape") setEditing(null);
+        },
+        grow: true
+      }
+    ) : item }, `${item}-${index}`)) }),
     !readOnly && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "mt-3 flex items-center gap-2", children: [
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
         _chunkPQUSJEXLcjs.Input,

package/dist/primitives/editable-list.js

@@ -1,7 +1,9 @@
 "use client";
 import {
-  SentimentDot
-} from "../chunk-YWAQRAXP.js";
+  List,
+  ListItem
+} from "../chunk-YFXZWDA5.js";
+import "../chunk-YWAQRAXP.js";
 import {
   Text
 } from "../chunk-EIY5LLSP.js";
@@ -49,36 +51,29 @@ function EditableList({
   };
   return /* @__PURE__ */ jsxs("section", { className: cn("border-t border-border pt-4", className), children: [
     /* @__PURE__ */ jsx(Text, { as: "span", variant: "caption", className: "text-xs font-medium uppercase tracking-wider", children: label }),
-    items.length === 0 ? /* @__PURE__ */ jsx(Text, { variant: "caption", className: "mt-3 italic", children: emptyText }) : /* @__PURE__ */ jsx("ul", { className: "mt-3 space-y-3", children: items.map((item, index) => /* @__PURE__ */ jsxs("li", { className: "group flex items-start gap-3", children: [
-      /* @__PURE__ */ jsx(SentimentDot, { sentiment, className: "mt-[5px] shrink-0" }),
-      !readOnly && editing?.index === index ? /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(
-          Input,
-          {
-            autoFocus: true,
-            value: editing.value,
-            "aria-label": `Edit ${itemName}`,
-            onChange: (event) => setEditing({ index, value: event.target.value }),
-            onKeyDown: (event) => {
-              if (event.key === "Enter") {
-                event.preventDefault();
-                commitEdit();
-              }
-              if (event.key === "Escape") setEditing(null);
-            },
-            grow: true
+    items.length === 0 ? /* @__PURE__ */ jsx(Text, { variant: "caption", className: "mt-3 italic", children: emptyText }) : /* @__PURE__ */ jsx(List, { spacing: "normal", className: "mt-3", children: items.map((item, index) => /* @__PURE__ */ jsx(ListItem, { layout: "bullet", sentiment, actions: !readOnly && (editing?.index === index ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "icon-sm", shrink: true, className: "text-emerald-600", "aria-label": `Save ${itemName}`, onClick: commitEdit, children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) }),
+      /* @__PURE__ */ jsx(Button, { type: "button", variant: "quiet", size: "icon-sm", shrink: true, marginEnd: "negative-xs", "aria-label": `Cancel editing ${itemName}`, onClick: () => setEditing(null), children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }) })
+    ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "icon", className: "h-8 w-8 shrink-0 text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100 focus:opacity-100", "aria-label": `Edit ${itemName}`, onClick: () => setEditing({ index, value: item }), children: /* @__PURE__ */ jsx(Pencil, { className: "h-4 w-4" }) }),
+      /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "icon", className: "-mr-1 h-8 w-8 shrink-0 text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100 focus:opacity-100", "aria-label": `Remove ${itemName}`, onClick: () => onChange(items.filter((_, itemIndex) => itemIndex !== index)), children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }) })
+    ] })), children: !readOnly && editing?.index === index ? /* @__PURE__ */ jsx(
+      Input,
+      {
+        autoFocus: true,
+        value: editing.value,
+        "aria-label": `Edit ${itemName}`,
+        onChange: (event) => setEditing({ index, value: event.target.value }),
+        onKeyDown: (event) => {
+          if (event.key === "Enter") {
+            event.preventDefault();
+            commitEdit();
           }
-        ),
-        /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "icon-sm", shrink: true, className: "text-emerald-600", "aria-label": `Save ${itemName}`, onClick: commitEdit, children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) }),
-        /* @__PURE__ */ jsx(Button, { type: "button", variant: "quiet", size: "icon-sm", shrink: true, marginEnd: "negative-xs", "aria-label": `Cancel editing ${itemName}`, onClick: () => setEditing(null), children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }) })
-      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(Text, { as: "span", variant: "small", className: "flex-1 leading-snug", children: item }),
-        !readOnly && /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "icon", className: "h-8 w-8 shrink-0 text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100 focus:opacity-100", "aria-label": `Edit ${itemName}`, onClick: () => setEditing({ index, value: item }), children: /* @__PURE__ */ jsx(Pencil, { className: "h-4 w-4" }) }),
-          /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "icon", className: "-mr-1 h-8 w-8 shrink-0 text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100 focus:opacity-100", "aria-label": `Remove ${itemName}`, onClick: () => onChange(items.filter((_, itemIndex) => itemIndex !== index)), children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }) })
-        ] })
-      ] })
-    ] }, `${item}-${index}`)) }),
+          if (event.key === "Escape") setEditing(null);
+        },
+        grow: true
+      }
+    ) : item }, `${item}-${index}`)) }),
     !readOnly && /* @__PURE__ */ jsxs("div", { className: "mt-3 flex items-center gap-2", children: [
       /* @__PURE__ */ jsx(
         Input,

package/dist/primitives/list.cjs

@@ -1,68 +1,13 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _chunkKWLSBTB2cjs = require('../chunk-KWLSBTB2.cjs');
 
-// src/primitives/list.tsx
-var _react = require('react');
-var _jsxruntime = require('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 = _react.forwardRef.call(void 0, 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__ */ _jsxruntime.jsx.call(void 0, 
-    Component,
-    {
-      ref,
-      className: _chunkKWLSBTB2cjs.cn.call(void 0, 
-        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 = _react.forwardRef.call(void 0, 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__ */ _jsxruntime.jsx.call(void 0, "li", { ref, className: _chunkKWLSBTB2cjs.cn.call(void 0, 
-    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 });
-});
+var _chunkWE3F6EUMcjs = require('../chunk-WE3F6EUM.cjs');
+require('../chunk-W5I4FN7G.cjs');
+require('../chunk-373W6VAD.cjs');
+require('../chunk-EJP2L5QV.cjs');
+require('../chunk-KWLSBTB2.cjs');
 
 
 
-exports.List = List; exports.ListItem = ListItem;
+exports.List = _chunkWE3F6EUMcjs.List; exports.ListItem = _chunkWE3F6EUMcjs.ListItem;

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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epicbagel/saas-kit",
-  "version": "1.14.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": [