@epicbagel/saas-kit 1.12.0 → 1.13.0

package/README.md

@@ -439,3 +439,25 @@ export function Appearance() {
 
 MIT. Some components and styles are adapted from shadcn/ui, and the file
 drop handling from AI SDK Elements (Apache-2.0); see `THIRD_PARTY_NOTICES.md`.
+
+## Notes
+
+`primitives/notes` provides a reusable `Notes` area and `NoteComposer` for any
+record. Pass display data with stable IDs; the list owns rendering and count,
+preserves order, and accepts author/date nodes and optional context, pinned,
+voice/assistant and deletion metadata. Hosts resolve identity, authorize saves
+and confirm deletions.
+
+```tsx
+<Notes
+  notes={[{ id: "note-1", author: "You", date: "Today", text: "Follow up next week." }]}
+  composer={<NoteComposer onSubmit={saveNote} onVoice={openRecorder} />}
+/>
+```
+
+Omit `onVoice` for a text-only composer. A rejected save retains the draft; all
+conflicting actions are disabled during a save. `value` / `onValueChange` and
+`editing` / `onEditingChange` support host-owned drafts, including failed voice
+transcripts. A controlled host clears or replaces `value` after saving. Set
+`maxLength` to the application's limit. `NoteList` and `NoteCard` are available
+for existing compositions.

package/THIRD_PARTY_NOTICES.md

@@ -52,6 +52,26 @@ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 SOFTWARE.
 ```
 
+## Attributed notes
+
+`primitives/notes` adapts the attributed note cards and voice/text composer
+from the public `@recruiteros/recruit-ui` package, version 0.16.0. The adaptation
+adds a generic notes-array API, controlled drafts, accessible labels and
+serialized asynchronous saves. It contains no application data or persistence.
+
+These adapted portions are licensed under the Apache License, Version 2.0,
+reproduced below. The upstream notice is retained here:
+
+```
+Recruit UI
+Copyright 2026 RecruiterOS
+
+RecruiterOS-authored portions are licensed under the Apache License,
+Version 2.0. The UI primitives come from the separately installed
+@epicbagel/saas-kit package (MIT). Third-party runtime dependencies retain
+their own licenses and copyright notices. See THIRD_PARTY_NOTICES.md.
+```
+
 ## AI SDK Elements
 
 Source: https://github.com/vercel/ai-elements (`packages/elements/src/prompt-input.tsx`,

package/dist/chunk-KI7SWNIN.js

@@ -0,0 +1,53 @@
+"use client";
+import {
+  cn
+} from "./chunk-G6SRSWXB.js";
+
+// src/primitives/panel-section.tsx
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+var borders = {
+  none: "",
+  top: "border-t",
+  bottom: "border-b"
+};
+var paddings = {
+  none: "",
+  compact: "px-[22px] py-[18px]",
+  default: "px-[26px] py-[26px]"
+};
+var PanelSection = forwardRef(
+  function PanelSection2({ as, border = "none", padding = "default", paddingX = "none", paddingTop = "none", paddingBottom = "none", paddingY = "none", surface = "default", layout = "block", gap = "none", shrink = true, className, ...props }, ref) {
+    const Component = as ?? "section";
+    return /* @__PURE__ */ jsx(
+      Component,
+      {
+        ref,
+        className: cn(
+          borders[border],
+          paddings[padding],
+          paddingX === "md" && "px-[22px]",
+          paddingX === "lg" && "px-[26px]",
+          paddingTop === "sm" && "pt-2",
+          paddingTop === "md" && "pt-3",
+          paddingTop === "lg" && "pt-5",
+          paddingBottom === "xs" && "pb-1",
+          paddingBottom === "sm" && "pb-2",
+          paddingBottom === "md" && "pb-3",
+          paddingBottom === "lg" && "pb-4",
+          paddingY === "xl" && "py-12",
+          surface === "muted" && "bg-muted/40",
+          layout === "row" && "flex",
+          gap === "sm" && "gap-2",
+          !shrink && "shrink-0",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+
+export {
+  PanelSection
+};

package/dist/chunk-SJB4DPGQ.cjs

@@ -0,0 +1,51 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
+
+
+var _chunkVGTINL5Qcjs = require('./chunk-VGTINL5Q.cjs');
+
+
+var _chunkKWLSBTB2cjs = require('./chunk-KWLSBTB2.cjs');
+
+// src/primitives/section-header.tsx
+var _react = require('react');
+var _classvarianceauthority = require('class-variance-authority');
+var _jsxruntime = require('react/jsx-runtime');
+var sectionHeaderVariants = _classvarianceauthority.cva.call(void 0, "flex items-center gap-1", {
+  variants: {
+    variant: {
+      muted: "text-xs font-semibold text-muted-foreground uppercase tracking-wide",
+      plain: "text-sm font-medium text-foreground"
+    },
+    spacing: {
+      tight: "mb-2",
+      loose: "mb-3",
+      none: ""
+    }
+  },
+  defaultVariants: {
+    variant: "muted",
+    spacing: "tight"
+  }
+});
+var SectionHeader = _react.forwardRef.call(void 0, 
+  function SectionHeader2({ icon, label, count, action, variant, spacing, className, ...rest }, ref) {
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      "h3",
+      {
+        ref,
+        className: _chunkKWLSBTB2cjs.cn.call(void 0, sectionHeaderVariants({ variant, spacing }), className),
+        ...rest,
+        children: [
+          icon,
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { children: label }),
+          typeof count === "number" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVGTINL5Qcjs.CountBadge, { value: count, variant: "secondary" }),
+          action && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "ml-auto", children: action })
+        ]
+      }
+    );
+  }
+);
+
+
+
+exports.SectionHeader = SectionHeader;

package/dist/chunk-SRIGG5I5.js

@@ -0,0 +1,51 @@
+"use client";
+import {
+  CountBadge
+} from "./chunk-H7TETFLB.js";
+import {
+  cn
+} from "./chunk-G6SRSWXB.js";
+
+// src/primitives/section-header.tsx
+import { forwardRef } from "react";
+import { cva } from "class-variance-authority";
+import { jsx, jsxs } from "react/jsx-runtime";
+var sectionHeaderVariants = cva("flex items-center gap-1", {
+  variants: {
+    variant: {
+      muted: "text-xs font-semibold text-muted-foreground uppercase tracking-wide",
+      plain: "text-sm font-medium text-foreground"
+    },
+    spacing: {
+      tight: "mb-2",
+      loose: "mb-3",
+      none: ""
+    }
+  },
+  defaultVariants: {
+    variant: "muted",
+    spacing: "tight"
+  }
+});
+var SectionHeader = forwardRef(
+  function SectionHeader2({ icon, label, count, action, variant, spacing, className, ...rest }, ref) {
+    return /* @__PURE__ */ jsxs(
+      "h3",
+      {
+        ref,
+        className: cn(sectionHeaderVariants({ variant, spacing }), className),
+        ...rest,
+        children: [
+          icon,
+          /* @__PURE__ */ jsx("span", { children: label }),
+          typeof count === "number" && /* @__PURE__ */ jsx(CountBadge, { value: count, variant: "secondary" }),
+          action && /* @__PURE__ */ jsx("span", { className: "ml-auto", children: action })
+        ]
+      }
+    );
+  }
+);
+
+export {
+  SectionHeader
+};

package/dist/chunk-VKYRB37O.cjs

@@ -0,0 +1,53 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }"use client";
+
+
+var _chunkKWLSBTB2cjs = require('./chunk-KWLSBTB2.cjs');
+
+// src/primitives/panel-section.tsx
+var _react = require('react');
+var _jsxruntime = require('react/jsx-runtime');
+var borders = {
+  none: "",
+  top: "border-t",
+  bottom: "border-b"
+};
+var paddings = {
+  none: "",
+  compact: "px-[22px] py-[18px]",
+  default: "px-[26px] py-[26px]"
+};
+var PanelSection = _react.forwardRef.call(void 0, 
+  function PanelSection2({ as, border = "none", padding = "default", paddingX = "none", paddingTop = "none", paddingBottom = "none", paddingY = "none", surface = "default", layout = "block", gap = "none", shrink = true, className, ...props }, ref) {
+    const Component = _nullishCoalesce(as, () => ( "section"));
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      Component,
+      {
+        ref,
+        className: _chunkKWLSBTB2cjs.cn.call(void 0, 
+          borders[border],
+          paddings[padding],
+          paddingX === "md" && "px-[22px]",
+          paddingX === "lg" && "px-[26px]",
+          paddingTop === "sm" && "pt-2",
+          paddingTop === "md" && "pt-3",
+          paddingTop === "lg" && "pt-5",
+          paddingBottom === "xs" && "pb-1",
+          paddingBottom === "sm" && "pb-2",
+          paddingBottom === "md" && "pb-3",
+          paddingBottom === "lg" && "pb-4",
+          paddingY === "xl" && "py-12",
+          surface === "muted" && "bg-muted/40",
+          layout === "row" && "flex",
+          gap === "sm" && "gap-2",
+          !shrink && "shrink-0",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+
+
+
+exports.PanelSection = PanelSection;

package/dist/primitives/chat.cjs

@@ -2,15 +2,15 @@
 "use client";
 
 
-var _chunkYMI3X2YLcjs = require('../chunk-YMI3X2YL.cjs');
+var _chunkQWUMIAYDcjs = require('../chunk-QWUMIAYD.cjs');
 
 
+var _chunkYMI3X2YLcjs = require('../chunk-YMI3X2YL.cjs');
 
 
-var _chunk2BTDBZYNcjs = require('../chunk-2BTDBZYN.cjs');
 
 
-var _chunkQWUMIAYDcjs = require('../chunk-QWUMIAYD.cjs');
+var _chunk2BTDBZYNcjs = require('../chunk-2BTDBZYN.cjs');
 
 
 

package/dist/primitives/chat.js

@@ -1,5 +1,8 @@
 "use client";
 "use client";
+import {
+  VoiceDictationButton
+} from "../chunk-JKVVTFAP.js";
 import {
   VoiceSessionControls
 } from "../chunk-KF4X37DP.js";
@@ -8,9 +11,6 @@ import {
   TraceLine,
   TraceTitle
 } from "../chunk-Z45YKVAM.js";
-import {
-  VoiceDictationButton
-} from "../chunk-JKVVTFAP.js";
 import {
   Suggestion,
   Suggestions

package/dist/primitives/notes.cjs

@@ -0,0 +1,259 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } 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";
+"use client";
+
+
+var _chunkSJB4DPGQcjs = require('../chunk-SJB4DPGQ.cjs');
+
+
+var _chunkVKYRB37Ocjs = require('../chunk-VKYRB37O.cjs');
+
+
+var _chunkR3DQS6U4cjs = require('../chunk-R3DQS6U4.cjs');
+
+
+var _chunk2HV2KKOEcjs = require('../chunk-2HV2KKOE.cjs');
+
+
+var _chunkJ467F76Icjs = require('../chunk-J467F76I.cjs');
+
+
+var _chunk373W6VADcjs = require('../chunk-373W6VAD.cjs');
+
+
+var _chunkT2ZFSPE4cjs = require('../chunk-T2ZFSPE4.cjs');
+require('../chunk-VGTINL5Q.cjs');
+
+
+var _chunkI6GUOEBOcjs = require('../chunk-I6GUOEBO.cjs');
+
+
+var _chunkCLYAASFNcjs = require('../chunk-CLYAASFN.cjs');
+
+
+var _chunkVBPPFC7Xcjs = require('../chunk-VBPPFC7X.cjs');
+
+
+var _chunkJDEXZGIYcjs = require('../chunk-JDEXZGIY.cjs');
+require('../chunk-KWLSBTB2.cjs');
+
+// src/primitives/notes.tsx
+var _lucidereact = require('lucide-react');
+var _react = require('react');
+var _jsxruntime = require('react/jsx-runtime');
+function present(value) {
+  return value != null && value !== false && value !== "";
+}
+function NoteList({
+  count,
+  loading = false,
+  title = "Notes",
+  empty = { title: "No notes yet" },
+  composer,
+  children,
+  border = "bottom",
+  ...props
+}) {
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkVKYRB37Ocjs.PanelSection, { "data-slot": "note-list", border, ...props, children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkSJB4DPGQcjs.SectionHeader, { label: title, count: loading ? void 0 : count }),
+    loading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJ467F76Icjs.Stack, { direction: "vertical", gap: "sm", marginTop: "md", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVBPPFC7Xcjs.Skeleton, { preset: "row", radius: "xl" }) }) : count > 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJ467F76Icjs.Stack, { direction: "vertical", gap: "sm", marginTop: "md", children }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkCLYAASFNcjs.EmptyState,
+      {
+        variant: "empty",
+        size: "inline",
+        icon: _lucidereact.StickyNote,
+        title: empty.title,
+        description: _nullishCoalesce(empty.description, () => ( ""))
+      }
+    ),
+    composer
+  ] });
+}
+var NOTE_CARD_LABELS = {
+  voice: "\xB7 voice",
+  delete: "Delete note"
+};
+var NOTE_ICON = { voice: _lucidereact.Mic, agent: _lucidereact.Sparkles, note: _lucidereact.MessageSquare };
+function NoteCard({
+  author,
+  kind = "note",
+  pinned,
+  scope,
+  date,
+  text,
+  onDelete,
+  revealDelete = "hover",
+  labels,
+  ...props
+}) {
+  const voiceLabel = _optionalChain([labels, 'optionalAccess', _ => _.voice]) !== void 0 ? labels.voice : NOTE_CARD_LABELS.voice;
+  const deleteLabel = _nullishCoalesce(_optionalChain([labels, 'optionalAccess', _2 => _2.delete]), () => ( NOTE_CARD_LABELS.delete));
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkR3DQS6U4cjs.Card, { interaction: "group", surface: pinned ? "card" : "muted", padding: "row", ...props, children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkJ467F76Icjs.Stack, { direction: "horizontal", gap: "xs", align: "center", justify: "between", marginBottom: "md", minWidth: "zero", wrap: true, children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkJ467F76Icjs.Stack, { direction: "horizontal", gap: "sm", align: "center", textSize: "xs", tone: "muted", minWidth: "zero", className: "max-w-full", wrap: true, children: [
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunk373W6VADcjs.Text, { variant: "inherit", as: "span", display: "inline-flex", weight: "medium", tone: "soft", minWidth: "zero", className: "max-w-full", children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkT2ZFSPE4cjs.Icon, { icon: NOTE_ICON[kind], size: "xs" }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk373W6VADcjs.Text, { variant: "inherit", as: "span", minWidth: "zero", className: "[overflow-wrap:anywhere]", children: author })
+        ] }),
+        pinned && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkI6GUOEBOcjs.Badge, { as: "span", variant: "info", size: "micro", weight: "semibold", title: pinned.title, className: "max-w-full whitespace-normal [overflow-wrap:anywhere]", children: pinned.label }),
+        kind === "voice" && present(voiceLabel) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk373W6VADcjs.Text, { variant: "inherit", as: "span", tone: "subtle", children: voiceLabel }),
+        scope && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          _chunkI6GUOEBOcjs.Badge,
+          {
+            as: "span",
+            variant: scope.highlighted ? "info" : "default",
+            size: "micro",
+            weight: "semibold",
+            title: scope.title,
+            className: "max-w-full whitespace-normal [overflow-wrap:anywhere]",
+            children: scope.label
+          }
+        )
+      ] }),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkJ467F76Icjs.Stack, { direction: "horizontal", gap: "xs", align: "center", minWidth: "zero", className: "max-w-full", children: [
+        present(date) ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk373W6VADcjs.Text, { variant: "inherit", as: "span", size: "xs", tone: "muted", minWidth: "zero", className: "[overflow-wrap:anywhere]", children: date }) : null,
+        onDelete && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          _chunkJDEXZGIYcjs.Button,
+          {
+            type: "button",
+            size: "icon-sm",
+            reveal: revealDelete === "always" ? "always" : "parent-hover-responsive",
+            variant: "ghost-destructive",
+            onClick: () => onDelete(),
+            title: deleteLabel,
+            children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkT2ZFSPE4cjs.Icon, { icon: _lucidereact.Trash2, size: "sm" })
+          }
+        )
+      ] })
+    ] }),
+    present(text) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk373W6VADcjs.Text, { size: "sm", whitespace: "pre-wrap", className: "break-words [overflow-wrap:anywhere]", children: text })
+  ] });
+}
+function Notes({ notes, ...props }) {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, NoteList, { "data-slot": "notes", count: notes.length, ...props, children: notes.map(({ id, ...note }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, NoteCard, { ...note }, id)) });
+}
+var COMPOSER_LABELS = {
+  voice: "Tap to speak",
+  type: "or type instead",
+  input: "Note",
+  placeholder: "Type your note\u2026",
+  cancel: "Cancel",
+  submit: "Add note",
+  error: "Could not save your note. Try again."
+};
+function NoteComposer({
+  onVoice,
+  onSubmit,
+  suggestions = [],
+  labels,
+  value,
+  onValueChange,
+  editing,
+  onEditingChange,
+  onCancel,
+  disabled = false,
+  error,
+  maxLength,
+  ...props
+}) {
+  const copy = { ...COMPOSER_LABELS, ...labels };
+  const [draft, setDraft] = _react.useState.call(void 0, "");
+  const [localEditing, setLocalEditing] = _react.useState.call(void 0, false);
+  const [saving, setSaving] = _react.useState.call(void 0, false);
+  const [failed, setFailed] = _react.useState.call(void 0, false);
+  const pending = _react.useRef.call(void 0, false);
+  const mounted = _react.useRef.call(void 0, true);
+  const errorId = _react.useId.call(void 0, );
+  const text = _nullishCoalesce(value, () => ( draft));
+  const latestText = _react.useRef.call(void 0, text);
+  latestText.current = text;
+  const busy = disabled || saving;
+  const message = _nullishCoalesce(error, () => ( (failed ? copy.error : null)));
+  const typing = (_nullishCoalesce(editing, () => ( localEditing))) || Boolean(text) || Boolean(message) || !onVoice;
+  _react.useEffect.call(void 0, () => {
+    mounted.current = true;
+    return () => {
+      mounted.current = false;
+    };
+  }, []);
+  function changeText(next) {
+    if (value === void 0) setDraft(next);
+    _optionalChain([onValueChange, 'optionalCall', _3 => _3(next)]);
+    latestText.current = next;
+  }
+  function changeEditing(next) {
+    if (editing === void 0) setLocalEditing(next);
+    _optionalChain([onEditingChange, 'optionalCall', _4 => _4(next)]);
+  }
+  function cancel() {
+    if (disabled || pending.current) return;
+    changeText("");
+    changeEditing(false);
+    setFailed(false);
+    _optionalChain([onCancel, 'optionalCall', _5 => _5()]);
+  }
+  async function submit(input) {
+    const trimmed = input.trim();
+    if (disabled || pending.current || !trimmed || maxLength != null && trimmed.length > maxLength) return;
+    pending.current = true;
+    setSaving(true);
+    setFailed(false);
+    const previous = latestText.current;
+    try {
+      await onSubmit(trimmed);
+      if (!mounted.current) return;
+      if (value === void 0 && latestText.current === previous) {
+        changeText("");
+        changeEditing(false);
+      }
+    } catch (e) {
+      if (!mounted.current) return;
+      if (latestText.current === previous) changeText(input);
+      changeEditing(true);
+      setFailed(true);
+    } finally {
+      pending.current = false;
+      if (mounted.current) setSaving(false);
+    }
+  }
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkJ467F76Icjs.Stack, { "data-slot": "note-composer", direction: "vertical", gap: "sm", marginTop: "md", "aria-busy": saving, ...props, children: [
+    message ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk373W6VADcjs.Text, { id: errorId, role: "alert", size: "sm", tone: "destructive", children: message }) : null,
+    typing ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _chunk2HV2KKOEcjs.Textarea,
+        {
+          "aria-label": copy.input,
+          "aria-describedby": message ? errorId : void 0,
+          resize: "vertical",
+          placeholder: copy.placeholder,
+          value: text,
+          onChange: (event) => changeText(event.target.value),
+          maxLength,
+          disabled: busy,
+          autoFocus: Boolean(onVoice)
+        }
+      ),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkJ467F76Icjs.Stack, { direction: "horizontal", gap: "sm", align: "center", wrap: true, children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { type: "button", size: "sm", variant: "ghost", onClick: cancel, disabled: busy, children: copy.cancel }),
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkJDEXZGIYcjs.Button, { type: "button", size: "sm", onClick: () => void submit(text), disabled: busy || !text.trim() || maxLength != null && text.trim().length > maxLength, children: [
+          saving ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkT2ZFSPE4cjs.Icon, { icon: _lucidereact.Loader2, size: "sm", spin: true }) : null,
+          copy.submit
+        ] })
+      ] })
+    ] }) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkJ467F76Icjs.Stack, { direction: "vertical", gap: "sm", align: "center", paddingY: "md", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { type: "button", variant: "outline", size: "voice", "aria-label": copy.voice, disabled: busy, onClick: () => {
+          if (!pending.current && !disabled) _optionalChain([onVoice, 'optionalCall', _6 => _6()]);
+        }, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkT2ZFSPE4cjs.Icon, { icon: _lucidereact.Mic, size: 28, tone: "muted" }) }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk373W6VADcjs.Text, { variant: "inherit", as: "span", size: "sm", weight: "medium", children: copy.voice }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { type: "button", variant: "quiet", size: "bare", disabled: busy, onClick: () => changeEditing(true), children: copy.type })
+      ] }),
+      suggestions.length > 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJ467F76Icjs.Stack, { direction: "horizontal", gap: "xs", justify: "center", wrap: true, children: suggestions.map((suggestion) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { type: "button", variant: "outline-muted", size: "suggestion", disabled: busy, onClick: () => void submit(suggestion), children: suggestion }, suggestion)) }) : null
+    ] })
+  ] });
+}
+
+
+
+
+
+exports.NoteCard = NoteCard; exports.NoteComposer = NoteComposer; exports.NoteList = NoteList; exports.Notes = Notes;

package/dist/primitives/notes.d.cts

@@ -0,0 +1,123 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { HTMLAttributes, ReactNode } from 'react';
+
+interface NotesEmptyCopy {
+    title: string;
+    description?: string;
+}
+interface NoteListProps extends Omit<HTMLAttributes<HTMLElement>, "title" | "children"> {
+    /** How many notes there are. Zero shows the empty state instead of `children`. */
+    count: number;
+    /** A skeleton row in place of the list, and no count yet. */
+    loading?: boolean;
+    /** The section heading. */
+    title?: ReactNode;
+    /** The blank slate's wording. Defaults to "No notes yet". */
+    empty?: NotesEmptyCopy;
+    /** Below the notes, usually a NoteComposer. */
+    composer?: ReactNode;
+    /** The notes, usually NoteCards, newest or pinned first. */
+    children?: ReactNode;
+    /** The kit PanelSection's divider. */
+    border?: "none" | "top" | "bottom";
+}
+/**
+ * A notes section, as a counted section: a skeleton row while they
+ * load, then the host's note cards, or the kit's empty state when there are
+ * none, with the composer underneath so a new note lands below the last.
+ *
+ * The root is the kit PanelSection, marked `data-slot="note-list"`.
+ */
+declare function NoteList({ count, loading, title, empty, composer, children, border, ...props }: NoteListProps): react_jsx_runtime.JSX.Element;
+/** How a note was left, which picks its glyph: dictated, written by an assistant, or typed. */
+type NoteKind = "voice" | "agent" | "note";
+/** Marks a note that stays at the top of the list and is edited elsewhere. */
+interface NotePinned {
+    /** The badge text, such as "Client note · pinned". */
+    label: ReactNode;
+    /** The badge tooltip, such as where to edit it. */
+    title?: string;
+}
+/** The context this note belongs to. */
+interface NoteScope {
+    /** The badge text, such as a project name or "General". */
+    label: ReactNode;
+    /** The badge tooltip. */
+    title?: string;
+    /** An info-toned badge, for a note tied to a context, instead of the neutral one. */
+    highlighted?: boolean;
+}
+interface NoteCardLabels {
+    /** After the author on a dictated note. Pass `null` to leave it out. */
+    voice: ReactNode;
+    /** The delete button's tooltip and accessible name. */
+    delete: string;
+}
+interface NoteCardProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
+    /** Who left it, already resolved to a display name. */
+    author: ReactNode;
+    kind?: NoteKind;
+    /** Pins the note: it sits on the card surface, not the muted one, with this badge. */
+    pinned?: NotePinned;
+    scope?: NoteScope;
+    /** When it was left, already formatted. */
+    date?: ReactNode;
+    /** The note, kept as written: line breaks are preserved. */
+    text?: ReactNode;
+    /** Adds a delete button. Confirm in the host before deleting anything. */
+    onDelete?: () => void;
+    /** Whether the delete button is always shown or appears on hover. Use `always` on touch screens. */
+    revealDelete?: "always" | "hover";
+    labels?: Partial<NoteCardLabels>;
+}
+/**
+ * One attributed note: who left it and how, an optional pinned badge, its
+ * optional context, when, and the text, with a delete button that appears
+ * on hover or always. The host resolves authors and context and confirms
+ * deletes.
+ *
+ * The root is the kit Card and keeps the kit's own `data-slot="card"`, which
+ * theme stylesheets select on.
+ */
+declare function NoteCard({ author, kind, pinned, scope, date, text, onDelete, revealDelete, labels, ...props }: NoteCardProps): react_jsx_runtime.JSX.Element;
+/** A display record: hosts resolve identity, context and dates before rendering. */
+interface NoteItem extends Pick<NoteCardProps, "author" | "kind" | "pinned" | "scope" | "date" | "text" | "onDelete" | "revealDelete" | "labels"> {
+    id: string | number;
+}
+interface NotesProps extends Omit<NoteListProps, "count" | "children"> {
+    /** Displayed in the supplied order. Stable IDs keep each note's identity. */
+    notes: readonly NoteItem[];
+}
+/** Reusable notes area. The array owns the count and the rendered cards. */
+declare function Notes({ notes, ...props }: NotesProps): react_jsx_runtime.JSX.Element;
+interface NoteComposerLabels {
+    voice: string;
+    type: string;
+    input: string;
+    placeholder: string;
+    cancel: string;
+    submit: string;
+    error: string;
+}
+interface NoteComposerProps extends Omit<HTMLAttributes<HTMLElement>, "children" | "onSubmit" | "onChange"> {
+    /** Starts the host's recorder. Without it the composer opens for typing. */
+    onVoice?: () => void;
+    /** Receives trimmed text. Resolve only once saved; reject to preserve the draft. */
+    onSubmit: (text: string) => Promise<void>;
+    suggestions?: readonly string[];
+    labels?: Partial<NoteComposerLabels>;
+    /** Controlled text. In this mode the host clears or replaces it after saving. */
+    value?: string;
+    onValueChange?: (text: string) => void;
+    /** The host can keep a recovered draft open even when its text becomes empty. */
+    editing?: boolean;
+    onEditingChange?: (editing: boolean) => void;
+    onCancel?: () => void;
+    disabled?: boolean;
+    error?: ReactNode;
+    maxLength?: number;
+}
+/** Voice or text composer with one pending save and recoverable drafts. */
+declare function NoteComposer({ onVoice, onSubmit, suggestions, labels, value, onValueChange, editing, onEditingChange, onCancel, disabled, error, maxLength, ...props }: NoteComposerProps): react_jsx_runtime.JSX.Element;
+
+export { NoteCard, type NoteCardLabels, type NoteCardProps, NoteComposer, type NoteComposerLabels, type NoteComposerProps, type NoteItem, type NoteKind, NoteList, type NoteListProps, type NotePinned, type NoteScope, Notes, type NotesEmptyCopy, type NotesProps };

package/dist/primitives/notes.d.ts

@@ -0,0 +1,123 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { HTMLAttributes, ReactNode } from 'react';
+
+interface NotesEmptyCopy {
+    title: string;
+    description?: string;
+}
+interface NoteListProps extends Omit<HTMLAttributes<HTMLElement>, "title" | "children"> {
+    /** How many notes there are. Zero shows the empty state instead of `children`. */
+    count: number;
+    /** A skeleton row in place of the list, and no count yet. */
+    loading?: boolean;
+    /** The section heading. */
+    title?: ReactNode;
+    /** The blank slate's wording. Defaults to "No notes yet". */
+    empty?: NotesEmptyCopy;
+    /** Below the notes, usually a NoteComposer. */
+    composer?: ReactNode;
+    /** The notes, usually NoteCards, newest or pinned first. */
+    children?: ReactNode;
+    /** The kit PanelSection's divider. */
+    border?: "none" | "top" | "bottom";
+}
+/**
+ * A notes section, as a counted section: a skeleton row while they
+ * load, then the host's note cards, or the kit's empty state when there are
+ * none, with the composer underneath so a new note lands below the last.
+ *
+ * The root is the kit PanelSection, marked `data-slot="note-list"`.
+ */
+declare function NoteList({ count, loading, title, empty, composer, children, border, ...props }: NoteListProps): react_jsx_runtime.JSX.Element;
+/** How a note was left, which picks its glyph: dictated, written by an assistant, or typed. */
+type NoteKind = "voice" | "agent" | "note";
+/** Marks a note that stays at the top of the list and is edited elsewhere. */
+interface NotePinned {
+    /** The badge text, such as "Client note · pinned". */
+    label: ReactNode;
+    /** The badge tooltip, such as where to edit it. */
+    title?: string;
+}
+/** The context this note belongs to. */
+interface NoteScope {
+    /** The badge text, such as a project name or "General". */
+    label: ReactNode;
+    /** The badge tooltip. */
+    title?: string;
+    /** An info-toned badge, for a note tied to a context, instead of the neutral one. */
+    highlighted?: boolean;
+}
+interface NoteCardLabels {
+    /** After the author on a dictated note. Pass `null` to leave it out. */
+    voice: ReactNode;
+    /** The delete button's tooltip and accessible name. */
+    delete: string;
+}
+interface NoteCardProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
+    /** Who left it, already resolved to a display name. */
+    author: ReactNode;
+    kind?: NoteKind;
+    /** Pins the note: it sits on the card surface, not the muted one, with this badge. */
+    pinned?: NotePinned;
+    scope?: NoteScope;
+    /** When it was left, already formatted. */
+    date?: ReactNode;
+    /** The note, kept as written: line breaks are preserved. */
+    text?: ReactNode;
+    /** Adds a delete button. Confirm in the host before deleting anything. */
+    onDelete?: () => void;
+    /** Whether the delete button is always shown or appears on hover. Use `always` on touch screens. */
+    revealDelete?: "always" | "hover";
+    labels?: Partial<NoteCardLabels>;
+}
+/**
+ * One attributed note: who left it and how, an optional pinned badge, its
+ * optional context, when, and the text, with a delete button that appears
+ * on hover or always. The host resolves authors and context and confirms
+ * deletes.
+ *
+ * The root is the kit Card and keeps the kit's own `data-slot="card"`, which
+ * theme stylesheets select on.
+ */
+declare function NoteCard({ author, kind, pinned, scope, date, text, onDelete, revealDelete, labels, ...props }: NoteCardProps): react_jsx_runtime.JSX.Element;
+/** A display record: hosts resolve identity, context and dates before rendering. */
+interface NoteItem extends Pick<NoteCardProps, "author" | "kind" | "pinned" | "scope" | "date" | "text" | "onDelete" | "revealDelete" | "labels"> {
+    id: string | number;
+}
+interface NotesProps extends Omit<NoteListProps, "count" | "children"> {
+    /** Displayed in the supplied order. Stable IDs keep each note's identity. */
+    notes: readonly NoteItem[];
+}
+/** Reusable notes area. The array owns the count and the rendered cards. */
+declare function Notes({ notes, ...props }: NotesProps): react_jsx_runtime.JSX.Element;
+interface NoteComposerLabels {
+    voice: string;
+    type: string;
+    input: string;
+    placeholder: string;
+    cancel: string;
+    submit: string;
+    error: string;
+}
+interface NoteComposerProps extends Omit<HTMLAttributes<HTMLElement>, "children" | "onSubmit" | "onChange"> {
+    /** Starts the host's recorder. Without it the composer opens for typing. */
+    onVoice?: () => void;
+    /** Receives trimmed text. Resolve only once saved; reject to preserve the draft. */
+    onSubmit: (text: string) => Promise<void>;
+    suggestions?: readonly string[];
+    labels?: Partial<NoteComposerLabels>;
+    /** Controlled text. In this mode the host clears or replaces it after saving. */
+    value?: string;
+    onValueChange?: (text: string) => void;
+    /** The host can keep a recovered draft open even when its text becomes empty. */
+    editing?: boolean;
+    onEditingChange?: (editing: boolean) => void;
+    onCancel?: () => void;
+    disabled?: boolean;
+    error?: ReactNode;
+    maxLength?: number;
+}
+/** Voice or text composer with one pending save and recoverable drafts. */
+declare function NoteComposer({ onVoice, onSubmit, suggestions, labels, value, onValueChange, editing, onEditingChange, onCancel, disabled, error, maxLength, ...props }: NoteComposerProps): react_jsx_runtime.JSX.Element;
+
+export { NoteCard, type NoteCardLabels, type NoteCardProps, NoteComposer, type NoteComposerLabels, type NoteComposerProps, type NoteItem, type NoteKind, NoteList, type NoteListProps, type NotePinned, type NoteScope, Notes, type NotesEmptyCopy, type NotesProps };

package/dist/primitives/notes.js

@@ -0,0 +1,259 @@
+"use client";
+"use client";
+import {
+  SectionHeader
+} from "../chunk-SRIGG5I5.js";
+import {
+  PanelSection
+} from "../chunk-KI7SWNIN.js";
+import {
+  Card
+} from "../chunk-35YMAIEL.js";
+import {
+  Textarea
+} from "../chunk-6FC65AZQ.js";
+import {
+  Stack
+} from "../chunk-WNWBKEWV.js";
+import {
+  Text
+} from "../chunk-EIY5LLSP.js";
+import {
+  Icon
+} from "../chunk-KN4RPX35.js";
+import "../chunk-H7TETFLB.js";
+import {
+  Badge
+} from "../chunk-D4ZL2OEQ.js";
+import {
+  EmptyState
+} from "../chunk-ET4THLFX.js";
+import {
+  Skeleton
+} from "../chunk-YEW65ASC.js";
+import {
+  Button
+} from "../chunk-W326GKML.js";
+import "../chunk-G6SRSWXB.js";
+
+// src/primitives/notes.tsx
+import { Loader2, MessageSquare, Mic, Sparkles, StickyNote, Trash2 } from "lucide-react";
+import { useEffect, useId, useRef, useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function present(value) {
+  return value != null && value !== false && value !== "";
+}
+function NoteList({
+  count,
+  loading = false,
+  title = "Notes",
+  empty = { title: "No notes yet" },
+  composer,
+  children,
+  border = "bottom",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(PanelSection, { "data-slot": "note-list", border, ...props, children: [
+    /* @__PURE__ */ jsx(SectionHeader, { label: title, count: loading ? void 0 : count }),
+    loading ? /* @__PURE__ */ jsx(Stack, { direction: "vertical", gap: "sm", marginTop: "md", children: /* @__PURE__ */ jsx(Skeleton, { preset: "row", radius: "xl" }) }) : count > 0 ? /* @__PURE__ */ jsx(Stack, { direction: "vertical", gap: "sm", marginTop: "md", children }) : /* @__PURE__ */ jsx(
+      EmptyState,
+      {
+        variant: "empty",
+        size: "inline",
+        icon: StickyNote,
+        title: empty.title,
+        description: empty.description ?? ""
+      }
+    ),
+    composer
+  ] });
+}
+var NOTE_CARD_LABELS = {
+  voice: "\xB7 voice",
+  delete: "Delete note"
+};
+var NOTE_ICON = { voice: Mic, agent: Sparkles, note: MessageSquare };
+function NoteCard({
+  author,
+  kind = "note",
+  pinned,
+  scope,
+  date,
+  text,
+  onDelete,
+  revealDelete = "hover",
+  labels,
+  ...props
+}) {
+  const voiceLabel = labels?.voice !== void 0 ? labels.voice : NOTE_CARD_LABELS.voice;
+  const deleteLabel = labels?.delete ?? NOTE_CARD_LABELS.delete;
+  return /* @__PURE__ */ jsxs(Card, { interaction: "group", surface: pinned ? "card" : "muted", padding: "row", ...props, children: [
+    /* @__PURE__ */ jsxs(Stack, { direction: "horizontal", gap: "xs", align: "center", justify: "between", marginBottom: "md", minWidth: "zero", wrap: true, children: [
+      /* @__PURE__ */ jsxs(Stack, { direction: "horizontal", gap: "sm", align: "center", textSize: "xs", tone: "muted", minWidth: "zero", className: "max-w-full", wrap: true, children: [
+        /* @__PURE__ */ jsxs(Text, { variant: "inherit", as: "span", display: "inline-flex", weight: "medium", tone: "soft", minWidth: "zero", className: "max-w-full", children: [
+          /* @__PURE__ */ jsx(Icon, { icon: NOTE_ICON[kind], size: "xs" }),
+          /* @__PURE__ */ jsx(Text, { variant: "inherit", as: "span", minWidth: "zero", className: "[overflow-wrap:anywhere]", children: author })
+        ] }),
+        pinned && /* @__PURE__ */ jsx(Badge, { as: "span", variant: "info", size: "micro", weight: "semibold", title: pinned.title, className: "max-w-full whitespace-normal [overflow-wrap:anywhere]", children: pinned.label }),
+        kind === "voice" && present(voiceLabel) && /* @__PURE__ */ jsx(Text, { variant: "inherit", as: "span", tone: "subtle", children: voiceLabel }),
+        scope && /* @__PURE__ */ jsx(
+          Badge,
+          {
+            as: "span",
+            variant: scope.highlighted ? "info" : "default",
+            size: "micro",
+            weight: "semibold",
+            title: scope.title,
+            className: "max-w-full whitespace-normal [overflow-wrap:anywhere]",
+            children: scope.label
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs(Stack, { direction: "horizontal", gap: "xs", align: "center", minWidth: "zero", className: "max-w-full", children: [
+        present(date) ? /* @__PURE__ */ jsx(Text, { variant: "inherit", as: "span", size: "xs", tone: "muted", minWidth: "zero", className: "[overflow-wrap:anywhere]", children: date }) : null,
+        onDelete && /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            size: "icon-sm",
+            reveal: revealDelete === "always" ? "always" : "parent-hover-responsive",
+            variant: "ghost-destructive",
+            onClick: () => onDelete(),
+            title: deleteLabel,
+            children: /* @__PURE__ */ jsx(Icon, { icon: Trash2, size: "sm" })
+          }
+        )
+      ] })
+    ] }),
+    present(text) && /* @__PURE__ */ jsx(Text, { size: "sm", whitespace: "pre-wrap", className: "break-words [overflow-wrap:anywhere]", children: text })
+  ] });
+}
+function Notes({ notes, ...props }) {
+  return /* @__PURE__ */ jsx(NoteList, { "data-slot": "notes", count: notes.length, ...props, children: notes.map(({ id, ...note }) => /* @__PURE__ */ jsx(NoteCard, { ...note }, id)) });
+}
+var COMPOSER_LABELS = {
+  voice: "Tap to speak",
+  type: "or type instead",
+  input: "Note",
+  placeholder: "Type your note\u2026",
+  cancel: "Cancel",
+  submit: "Add note",
+  error: "Could not save your note. Try again."
+};
+function NoteComposer({
+  onVoice,
+  onSubmit,
+  suggestions = [],
+  labels,
+  value,
+  onValueChange,
+  editing,
+  onEditingChange,
+  onCancel,
+  disabled = false,
+  error,
+  maxLength,
+  ...props
+}) {
+  const copy = { ...COMPOSER_LABELS, ...labels };
+  const [draft, setDraft] = useState("");
+  const [localEditing, setLocalEditing] = useState(false);
+  const [saving, setSaving] = useState(false);
+  const [failed, setFailed] = useState(false);
+  const pending = useRef(false);
+  const mounted = useRef(true);
+  const errorId = useId();
+  const text = value ?? draft;
+  const latestText = useRef(text);
+  latestText.current = text;
+  const busy = disabled || saving;
+  const message = error ?? (failed ? copy.error : null);
+  const typing = (editing ?? localEditing) || Boolean(text) || Boolean(message) || !onVoice;
+  useEffect(() => {
+    mounted.current = true;
+    return () => {
+      mounted.current = false;
+    };
+  }, []);
+  function changeText(next) {
+    if (value === void 0) setDraft(next);
+    onValueChange?.(next);
+    latestText.current = next;
+  }
+  function changeEditing(next) {
+    if (editing === void 0) setLocalEditing(next);
+    onEditingChange?.(next);
+  }
+  function cancel() {
+    if (disabled || pending.current) return;
+    changeText("");
+    changeEditing(false);
+    setFailed(false);
+    onCancel?.();
+  }
+  async function submit(input) {
+    const trimmed = input.trim();
+    if (disabled || pending.current || !trimmed || maxLength != null && trimmed.length > maxLength) return;
+    pending.current = true;
+    setSaving(true);
+    setFailed(false);
+    const previous = latestText.current;
+    try {
+      await onSubmit(trimmed);
+      if (!mounted.current) return;
+      if (value === void 0 && latestText.current === previous) {
+        changeText("");
+        changeEditing(false);
+      }
+    } catch {
+      if (!mounted.current) return;
+      if (latestText.current === previous) changeText(input);
+      changeEditing(true);
+      setFailed(true);
+    } finally {
+      pending.current = false;
+      if (mounted.current) setSaving(false);
+    }
+  }
+  return /* @__PURE__ */ jsxs(Stack, { "data-slot": "note-composer", direction: "vertical", gap: "sm", marginTop: "md", "aria-busy": saving, ...props, children: [
+    message ? /* @__PURE__ */ jsx(Text, { id: errorId, role: "alert", size: "sm", tone: "destructive", children: message }) : null,
+    typing ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        Textarea,
+        {
+          "aria-label": copy.input,
+          "aria-describedby": message ? errorId : void 0,
+          resize: "vertical",
+          placeholder: copy.placeholder,
+          value: text,
+          onChange: (event) => changeText(event.target.value),
+          maxLength,
+          disabled: busy,
+          autoFocus: Boolean(onVoice)
+        }
+      ),
+      /* @__PURE__ */ jsxs(Stack, { direction: "horizontal", gap: "sm", align: "center", wrap: true, children: [
+        /* @__PURE__ */ jsx(Button, { type: "button", size: "sm", variant: "ghost", onClick: cancel, disabled: busy, children: copy.cancel }),
+        /* @__PURE__ */ jsxs(Button, { type: "button", size: "sm", onClick: () => void submit(text), disabled: busy || !text.trim() || maxLength != null && text.trim().length > maxLength, children: [
+          saving ? /* @__PURE__ */ jsx(Icon, { icon: Loader2, size: "sm", spin: true }) : null,
+          copy.submit
+        ] })
+      ] })
+    ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs(Stack, { direction: "vertical", gap: "sm", align: "center", paddingY: "md", children: [
+        /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", size: "voice", "aria-label": copy.voice, disabled: busy, onClick: () => {
+          if (!pending.current && !disabled) onVoice?.();
+        }, children: /* @__PURE__ */ jsx(Icon, { icon: Mic, size: 28, tone: "muted" }) }),
+        /* @__PURE__ */ jsx(Text, { variant: "inherit", as: "span", size: "sm", weight: "medium", children: copy.voice }),
+        /* @__PURE__ */ jsx(Button, { type: "button", variant: "quiet", size: "bare", disabled: busy, onClick: () => changeEditing(true), children: copy.type })
+      ] }),
+      suggestions.length > 0 ? /* @__PURE__ */ jsx(Stack, { direction: "horizontal", gap: "xs", justify: "center", wrap: true, children: suggestions.map((suggestion) => /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline-muted", size: "suggestion", disabled: busy, onClick: () => void submit(suggestion), children: suggestion }, suggestion)) }) : null
+    ] })
+  ] });
+}
+export {
+  NoteCard,
+  NoteComposer,
+  NoteList,
+  Notes
+};

package/dist/primitives/panel-section.cjs

@@ -1,52 +1,8 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }"use client";
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _chunkKWLSBTB2cjs = require('../chunk-KWLSBTB2.cjs');
+var _chunkVKYRB37Ocjs = require('../chunk-VKYRB37O.cjs');
+require('../chunk-KWLSBTB2.cjs');
 
-// src/primitives/panel-section.tsx
-var _react = require('react');
-var _jsxruntime = require('react/jsx-runtime');
-var borders = {
-  none: "",
-  top: "border-t",
-  bottom: "border-b"
-};
-var paddings = {
-  none: "",
-  compact: "px-[22px] py-[18px]",
-  default: "px-[26px] py-[26px]"
-};
-var PanelSection = _react.forwardRef.call(void 0, 
-  function PanelSection2({ as, border = "none", padding = "default", paddingX = "none", paddingTop = "none", paddingBottom = "none", paddingY = "none", surface = "default", layout = "block", gap = "none", shrink = true, className, ...props }, ref) {
-    const Component = _nullishCoalesce(as, () => ( "section"));
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      Component,
-      {
-        ref,
-        className: _chunkKWLSBTB2cjs.cn.call(void 0, 
-          borders[border],
-          paddings[padding],
-          paddingX === "md" && "px-[22px]",
-          paddingX === "lg" && "px-[26px]",
-          paddingTop === "sm" && "pt-2",
-          paddingTop === "md" && "pt-3",
-          paddingTop === "lg" && "pt-5",
-          paddingBottom === "xs" && "pb-1",
-          paddingBottom === "sm" && "pb-2",
-          paddingBottom === "md" && "pb-3",
-          paddingBottom === "lg" && "pb-4",
-          paddingY === "xl" && "py-12",
-          surface === "muted" && "bg-muted/40",
-          layout === "row" && "flex",
-          gap === "sm" && "gap-2",
-          !shrink && "shrink-0",
-          className
-        ),
-        ...props
-      }
-    );
-  }
-);
 
-
-exports.PanelSection = PanelSection;
+exports.PanelSection = _chunkVKYRB37Ocjs.PanelSection;

package/dist/primitives/panel-section.js

@@ -1,52 +1,8 @@
 "use client";
 import {
-  cn
-} from "../chunk-G6SRSWXB.js";
-
-// src/primitives/panel-section.tsx
-import { forwardRef } from "react";
-import { jsx } from "react/jsx-runtime";
-var borders = {
-  none: "",
-  top: "border-t",
-  bottom: "border-b"
-};
-var paddings = {
-  none: "",
-  compact: "px-[22px] py-[18px]",
-  default: "px-[26px] py-[26px]"
-};
-var PanelSection = forwardRef(
-  function PanelSection2({ as, border = "none", padding = "default", paddingX = "none", paddingTop = "none", paddingBottom = "none", paddingY = "none", surface = "default", layout = "block", gap = "none", shrink = true, className, ...props }, ref) {
-    const Component = as ?? "section";
-    return /* @__PURE__ */ jsx(
-      Component,
-      {
-        ref,
-        className: cn(
-          borders[border],
-          paddings[padding],
-          paddingX === "md" && "px-[22px]",
-          paddingX === "lg" && "px-[26px]",
-          paddingTop === "sm" && "pt-2",
-          paddingTop === "md" && "pt-3",
-          paddingTop === "lg" && "pt-5",
-          paddingBottom === "xs" && "pb-1",
-          paddingBottom === "sm" && "pb-2",
-          paddingBottom === "md" && "pb-3",
-          paddingBottom === "lg" && "pb-4",
-          paddingY === "xl" && "py-12",
-          surface === "muted" && "bg-muted/40",
-          layout === "row" && "flex",
-          gap === "sm" && "gap-2",
-          !shrink && "shrink-0",
-          className
-        ),
-        ...props
-      }
-    );
-  }
-);
+  PanelSection
+} from "../chunk-KI7SWNIN.js";
+import "../chunk-G6SRSWXB.js";
 export {
   PanelSection
 };

package/dist/primitives/section-header.cjs

@@ -1,51 +1,10 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _chunkVGTINL5Qcjs = require('../chunk-VGTINL5Q.cjs');
+var _chunkSJB4DPGQcjs = require('../chunk-SJB4DPGQ.cjs');
+require('../chunk-VGTINL5Q.cjs');
 require('../chunk-I6GUOEBO.cjs');
+require('../chunk-KWLSBTB2.cjs');
 
 
-var _chunkKWLSBTB2cjs = require('../chunk-KWLSBTB2.cjs');
-
-// src/primitives/section-header.tsx
-var _react = require('react');
-var _classvarianceauthority = require('class-variance-authority');
-var _jsxruntime = require('react/jsx-runtime');
-var sectionHeaderVariants = _classvarianceauthority.cva.call(void 0, "flex items-center gap-1", {
-  variants: {
-    variant: {
-      muted: "text-xs font-semibold text-muted-foreground uppercase tracking-wide",
-      plain: "text-sm font-medium text-foreground"
-    },
-    spacing: {
-      tight: "mb-2",
-      loose: "mb-3",
-      none: ""
-    }
-  },
-  defaultVariants: {
-    variant: "muted",
-    spacing: "tight"
-  }
-});
-var SectionHeader = _react.forwardRef.call(void 0, 
-  function SectionHeader2({ icon, label, count, action, variant, spacing, className, ...rest }, ref) {
-    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      "h3",
-      {
-        ref,
-        className: _chunkKWLSBTB2cjs.cn.call(void 0, sectionHeaderVariants({ variant, spacing }), className),
-        ...rest,
-        children: [
-          icon,
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { children: label }),
-          typeof count === "number" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVGTINL5Qcjs.CountBadge, { value: count, variant: "secondary" }),
-          action && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "ml-auto", children: action })
-        ]
-      }
-    );
-  }
-);
-
-
-exports.SectionHeader = SectionHeader;
+exports.SectionHeader = _chunkSJB4DPGQcjs.SectionHeader;

package/dist/primitives/section-header.js

@@ -1,51 +1,10 @@
 "use client";
 import {
-  CountBadge
-} from "../chunk-H7TETFLB.js";
+  SectionHeader
+} from "../chunk-SRIGG5I5.js";
+import "../chunk-H7TETFLB.js";
 import "../chunk-D4ZL2OEQ.js";
-import {
-  cn
-} from "../chunk-G6SRSWXB.js";
-
-// src/primitives/section-header.tsx
-import { forwardRef } from "react";
-import { cva } from "class-variance-authority";
-import { jsx, jsxs } from "react/jsx-runtime";
-var sectionHeaderVariants = cva("flex items-center gap-1", {
-  variants: {
-    variant: {
-      muted: "text-xs font-semibold text-muted-foreground uppercase tracking-wide",
-      plain: "text-sm font-medium text-foreground"
-    },
-    spacing: {
-      tight: "mb-2",
-      loose: "mb-3",
-      none: ""
-    }
-  },
-  defaultVariants: {
-    variant: "muted",
-    spacing: "tight"
-  }
-});
-var SectionHeader = forwardRef(
-  function SectionHeader2({ icon, label, count, action, variant, spacing, className, ...rest }, ref) {
-    return /* @__PURE__ */ jsxs(
-      "h3",
-      {
-        ref,
-        className: cn(sectionHeaderVariants({ variant, spacing }), className),
-        ...rest,
-        children: [
-          icon,
-          /* @__PURE__ */ jsx("span", { children: label }),
-          typeof count === "number" && /* @__PURE__ */ jsx(CountBadge, { value: count, variant: "secondary" }),
-          action && /* @__PURE__ */ jsx("span", { className: "ml-auto", children: action })
-        ]
-      }
-    );
-  }
-);
+import "../chunk-G6SRSWXB.js";
 export {
   SectionHeader
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epicbagel/saas-kit",
-  "version": "1.12.0",
+  "version": "1.13.0",
   "description": "Accessible React primitives, layout components and design tokens for SaaS apps, built on Radix UI and Tailwind CSS v4.",
   "license": "MIT",
   "keywords": [
@@ -770,6 +770,16 @@
         "default": "./dist/primitives/native-select.cjs"
       }
     },
+    "./primitives/notes": {
+      "import": {
+        "types": "./dist/primitives/notes.d.ts",
+        "default": "./dist/primitives/notes.js"
+      },
+      "require": {
+        "types": "./dist/primitives/notes.d.cts",
+        "default": "./dist/primitives/notes.cjs"
+      }
+    },
     "./primitives/page-header-actions": {
       "import": {
         "types": "./dist/primitives/page-header-actions.d.ts",