@epicbagel/saas-kit 0.0.0-stage → 1.1.0

package/dist/primitives/compact-app-shell.js

@@ -0,0 +1,40 @@
+"use client";
+import {
+  Stack
+} from "../chunk-6RVPQGYS.js";
+import {
+  Heading
+} from "../chunk-H2O6NMLZ.js";
+import {
+  cn
+} from "../chunk-G6SRSWXB.js";
+
+// src/primitives/compact-app-shell.tsx
+import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var widths = {
+  sm: "w-[320px]",
+  md: "w-[360px]"
+};
+var CompactAppShell = forwardRef(
+  function CompactAppShell2({ title, description, width = "md", className, children, ...props }, ref) {
+    return /* @__PURE__ */ jsx(
+      "main",
+      {
+        ref,
+        className: cn("min-h-0 bg-background p-4 text-foreground", widths[width], className),
+        ...props,
+        children: /* @__PURE__ */ jsxs(Stack, { gap: "md", children: [
+          /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
+            /* @__PURE__ */ jsx(Heading, { level: 1, className: "text-base", children: title }),
+            description
+          ] }),
+          children
+        ] })
+      }
+    );
+  }
+);
+export {
+  CompactAppShell
+};

package/dist/primitives/compact-log.cjs

@@ -0,0 +1,39 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
+
+
+var _chunkKWLSBTB2cjs = require('../chunk-KWLSBTB2.cjs');
+
+// src/primitives/compact-log.tsx
+var _react = require('react');
+var _jsxruntime = require('react/jsx-runtime');
+var CompactLog = _react.forwardRef.call(void 0, 
+  function CompactLog2({ className, items, emptyText = "No activity yet", children, ...props }, ref) {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      "div",
+      {
+        ref,
+        className: _chunkKWLSBTB2cjs.cn.call(void 0, 
+          "max-h-48 overflow-auto rounded-md border font-mono text-[11px] leading-relaxed",
+          "[&_[data-slot=row]]:flex [&_[data-slot=row]]:gap-1.5 [&_[data-slot=row]]:border-b [&_[data-slot=row]]:px-2 [&_[data-slot=row]]:py-1 [&_[data-slot=row]:last-child]:border-b-0",
+          "[&_[data-slot=time]]:shrink-0 [&_[data-slot=time]]:text-muted-foreground",
+          "[&_[data-slot=kind]]:shrink-0 [&_[data-slot=kind]]:font-semibold",
+          "[&_[data-slot=success]]:shrink-0 [&_[data-slot=success]]:text-emerald-600",
+          "[&_[data-slot=error]]:shrink-0 [&_[data-slot=error]]:text-destructive",
+          "[&_[data-slot=detail]]:min-w-0 [&_[data-slot=detail]]:truncate [&_[data-slot=detail]]:text-muted-foreground",
+          "[&_[data-slot=empty]]:p-3 [&_[data-slot=empty]]:text-center [&_[data-slot=empty]]:text-muted-foreground",
+          className
+        ),
+        ...props,
+        children: items ? items.length ? items.map((item) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { "data-slot": "row", children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { "data-slot": "time", children: item.time }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { "data-slot": "kind", children: item.kind }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { "data-slot": item.tone, children: item.status }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { "data-slot": "detail", children: item.detail })
+        ] }, item.id)) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { "data-slot": "empty", children: emptyText }) : children
+      }
+    );
+  }
+);
+
+
+exports.CompactLog = CompactLog;

package/dist/primitives/compact-log.d.cts

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { HTMLAttributes } from 'react';
+
+interface CompactLogItem {
+    id: string;
+    time: string;
+    kind: string;
+    status: string | number;
+    tone: "success" | "error";
+    detail?: string;
+}
+interface CompactLogProps extends HTMLAttributes<HTMLDivElement> {
+    items?: CompactLogItem[];
+    emptyText?: string;
+}
+/** Dense, scrollable diagnostic/event log for constrained application surfaces. */
+declare const CompactLog: React.ForwardRefExoticComponent<CompactLogProps & React.RefAttributes<HTMLDivElement>>;
+
+export { CompactLog, type CompactLogItem, type CompactLogProps };

package/dist/primitives/compact-log.d.ts

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { HTMLAttributes } from 'react';
+
+interface CompactLogItem {
+    id: string;
+    time: string;
+    kind: string;
+    status: string | number;
+    tone: "success" | "error";
+    detail?: string;
+}
+interface CompactLogProps extends HTMLAttributes<HTMLDivElement> {
+    items?: CompactLogItem[];
+    emptyText?: string;
+}
+/** Dense, scrollable diagnostic/event log for constrained application surfaces. */
+declare const CompactLog: React.ForwardRefExoticComponent<CompactLogProps & React.RefAttributes<HTMLDivElement>>;
+
+export { CompactLog, type CompactLogItem, type CompactLogProps };

package/dist/primitives/compact-log.js

@@ -0,0 +1,39 @@
+"use client";
+import {
+  cn
+} from "../chunk-G6SRSWXB.js";
+
+// src/primitives/compact-log.tsx
+import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var CompactLog = forwardRef(
+  function CompactLog2({ className, items, emptyText = "No activity yet", children, ...props }, ref) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(
+          "max-h-48 overflow-auto rounded-md border font-mono text-[11px] leading-relaxed",
+          "[&_[data-slot=row]]:flex [&_[data-slot=row]]:gap-1.5 [&_[data-slot=row]]:border-b [&_[data-slot=row]]:px-2 [&_[data-slot=row]]:py-1 [&_[data-slot=row]:last-child]:border-b-0",
+          "[&_[data-slot=time]]:shrink-0 [&_[data-slot=time]]:text-muted-foreground",
+          "[&_[data-slot=kind]]:shrink-0 [&_[data-slot=kind]]:font-semibold",
+          "[&_[data-slot=success]]:shrink-0 [&_[data-slot=success]]:text-emerald-600",
+          "[&_[data-slot=error]]:shrink-0 [&_[data-slot=error]]:text-destructive",
+          "[&_[data-slot=detail]]:min-w-0 [&_[data-slot=detail]]:truncate [&_[data-slot=detail]]:text-muted-foreground",
+          "[&_[data-slot=empty]]:p-3 [&_[data-slot=empty]]:text-center [&_[data-slot=empty]]:text-muted-foreground",
+          className
+        ),
+        ...props,
+        children: items ? items.length ? items.map((item) => /* @__PURE__ */ jsxs("span", { "data-slot": "row", children: [
+          /* @__PURE__ */ jsx("span", { "data-slot": "time", children: item.time }),
+          /* @__PURE__ */ jsx("span", { "data-slot": "kind", children: item.kind }),
+          /* @__PURE__ */ jsx("span", { "data-slot": item.tone, children: item.status }),
+          /* @__PURE__ */ jsx("span", { "data-slot": "detail", children: item.detail })
+        ] }, item.id)) : /* @__PURE__ */ jsx("span", { "data-slot": "empty", children: emptyText }) : children
+      }
+    );
+  }
+);
+export {
+  CompactLog
+};

package/dist/primitives/confirm-bar.cjs

@@ -0,0 +1,101 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }"use client";
+"use client";
+
+
+var _chunkL4DH72UFcjs = require('../chunk-L4DH72UF.cjs');
+require('../chunk-KWLSBTB2.cjs');
+
+// src/primitives/confirm-bar.tsx
+var _react = require('react');
+var _reactdom = require('react-dom');
+var _jsxruntime = require('react/jsx-runtime');
+function ConfirmBar({
+  open,
+  title,
+  description,
+  confirmLabel = "Confirm",
+  cancelLabel = "Cancel",
+  confirmVariant = "default",
+  onConfirm,
+  onCancel,
+  countdown: initialCountdown,
+  paused = false,
+  expandableDescription = false,
+  containerClassName = "max-w-3xl",
+  className
+}) {
+  const [remaining, setRemaining] = _react.useState.call(void 0, _nullishCoalesce(initialCountdown, () => ( 0)));
+  const timerRef = _react.useRef.call(void 0, null);
+  const [mounted, setMounted] = _react.useState.call(void 0, false);
+  const [expanded, setExpanded] = _react.useState.call(void 0, false);
+  _react.useEffect.call(void 0, () => {
+    setMounted(true);
+  }, []);
+  _react.useEffect.call(void 0, () => {
+    if (!open) setExpanded(false);
+  }, [open]);
+  const timerPaused = paused || expanded;
+  _react.useEffect.call(void 0, () => {
+    if (!open || !initialCountdown || timerPaused) {
+      if (timerRef.current) {
+        clearInterval(timerRef.current);
+        timerRef.current = null;
+      }
+      return;
+    }
+    setRemaining(initialCountdown);
+    timerRef.current = setInterval(() => {
+      setRemaining((prev) => {
+        if (prev <= 1) {
+          clearInterval(timerRef.current);
+          timerRef.current = null;
+          onCancel();
+          return 0;
+        }
+        return prev - 1;
+      });
+    }, 1e3);
+    return () => {
+      if (timerRef.current) {
+        clearInterval(timerRef.current);
+        timerRef.current = null;
+      }
+    };
+  }, [open, initialCountdown, timerPaused]);
+  if (!mounted || !open) return null;
+  return _reactdom.createPortal.call(void 0, 
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      "div",
+      {
+        className: `fixed inset-x-0 bottom-0 z-50 border-t bg-background shadow-lg pb-[env(safe-area-inset-bottom)] animate-in slide-in-from-bottom-full duration-200 ${_nullishCoalesce(className, () => ( ""))}`,
+        onClick: (e) => e.stopPropagation(),
+        onPointerDown: (e) => e.stopPropagation(),
+        children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: `mx-auto px-5 py-4 flex items-center gap-4 ${containerClassName}`, children: [
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex-1 min-w-0", children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-base font-medium", children: title }),
+            description && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: `text-sm text-muted-foreground mt-0.5 ${expandableDescription && !expanded ? "truncate" : ""}`, children: description }),
+            expandableDescription && description && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              "button",
+              {
+                type: "button",
+                onClick: () => setExpanded((v) => !v),
+                className: "text-xs text-foreground/70 hover:text-foreground underline underline-offset-2 mt-1",
+                children: expanded ? "See less" : "See more"
+              }
+            )
+          ] }),
+          initialCountdown && !timerPaused && remaining > 0 && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { className: "text-xs text-muted-foreground tabular-nums shrink-0", children: [
+            remaining,
+            "s"
+          ] }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkL4DH72UFcjs.Button, { size: "sm", variant: "ghost", onClick: onCancel, className: "shrink-0", children: cancelLabel }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkL4DH72UFcjs.Button, { size: "sm", variant: confirmVariant, onClick: onConfirm, className: "shrink-0", children: confirmLabel })
+        ] })
+      }
+    ),
+    document.body
+  );
+}
+
+
+exports.ConfirmBar = ConfirmBar;

package/dist/primitives/confirm-bar.d.cts

@@ -0,0 +1,60 @@
+import * as React from 'react';
+import { ReactNode } from 'react';
+
+interface ConfirmBarProps {
+    /** Whether the bar is visible. */
+    open: boolean;
+    /** Primary question — e.g. "No to Tom Harris?" */
+    title: ReactNode;
+    /** Supporting detail — e.g. the transcript or reason. */
+    description?: ReactNode;
+    /** Label for the confirm button. Defaults to "Confirm". */
+    confirmLabel?: ReactNode;
+    /** Label for the cancel button. Defaults to "Cancel". */
+    cancelLabel?: ReactNode;
+    /** Visual style of the confirm button. */
+    confirmVariant?: "default" | "destructive";
+    /** Called when the user confirms (or the countdown expires). */
+    onConfirm: () => void;
+    /** Called when the user cancels. */
+    onCancel: () => void;
+    /**
+     * Auto-dismiss countdown in seconds. When set, the bar shows a
+     * countdown and auto-fires onCancel (dismiss) when it reaches zero.
+     * The user must explicitly click Confirm to act. Omit for no timer.
+     */
+    countdown?: number;
+    /**
+     * Pause the countdown without dismissing the bar. Useful while the
+     * user is reading more detail so it doesn't auto-dismiss out from
+     * under them. Combine with internal expand if needed.
+     */
+    paused?: boolean;
+    /**
+     * When true, the description is truncated to one line with a
+     * "See more" toggle that expands the full text and pauses the
+     * countdown while expanded. Use for long AI explanations that don't
+     * fit on small screens.
+     */
+    expandableDescription?: boolean;
+    /** Outer container max-width class. Defaults to `max-w-3xl`. */
+    containerClassName?: string;
+    className?: string;
+}
+/**
+ * Fixed bottom confirmation bar — slides up to confirm or cancel an
+ * action. Optionally counts down and auto-fires if the user doesn't
+ * respond.
+ *
+ * Use when the system has inferred an action from user input (voice
+ * note → reject, bulk import → archive duplicates, AI suggestion →
+ * apply) and wants to surface the suggestion for explicit confirmation.
+ * The countdown auto-dismisses (not auto-confirms) — the user must
+ * actively click to act.
+ *
+ * For form save state, use `<SaveBar>` instead. For multi-select
+ * batch actions, use `<BatchActionBar>`.
+ */
+declare function ConfirmBar({ open, title, description, confirmLabel, cancelLabel, confirmVariant, onConfirm, onCancel, countdown: initialCountdown, paused, expandableDescription, containerClassName, className, }: ConfirmBarProps): React.ReactPortal | null;
+
+export { ConfirmBar, type ConfirmBarProps };

package/dist/primitives/confirm-bar.d.ts

@@ -0,0 +1,60 @@
+import * as React from 'react';
+import { ReactNode } from 'react';
+
+interface ConfirmBarProps {
+    /** Whether the bar is visible. */
+    open: boolean;
+    /** Primary question — e.g. "No to Tom Harris?" */
+    title: ReactNode;
+    /** Supporting detail — e.g. the transcript or reason. */
+    description?: ReactNode;
+    /** Label for the confirm button. Defaults to "Confirm". */
+    confirmLabel?: ReactNode;
+    /** Label for the cancel button. Defaults to "Cancel". */
+    cancelLabel?: ReactNode;
+    /** Visual style of the confirm button. */
+    confirmVariant?: "default" | "destructive";
+    /** Called when the user confirms (or the countdown expires). */
+    onConfirm: () => void;
+    /** Called when the user cancels. */
+    onCancel: () => void;
+    /**
+     * Auto-dismiss countdown in seconds. When set, the bar shows a
+     * countdown and auto-fires onCancel (dismiss) when it reaches zero.
+     * The user must explicitly click Confirm to act. Omit for no timer.
+     */
+    countdown?: number;
+    /**
+     * Pause the countdown without dismissing the bar. Useful while the
+     * user is reading more detail so it doesn't auto-dismiss out from
+     * under them. Combine with internal expand if needed.
+     */
+    paused?: boolean;
+    /**
+     * When true, the description is truncated to one line with a
+     * "See more" toggle that expands the full text and pauses the
+     * countdown while expanded. Use for long AI explanations that don't
+     * fit on small screens.
+     */
+    expandableDescription?: boolean;
+    /** Outer container max-width class. Defaults to `max-w-3xl`. */
+    containerClassName?: string;
+    className?: string;
+}
+/**
+ * Fixed bottom confirmation bar — slides up to confirm or cancel an
+ * action. Optionally counts down and auto-fires if the user doesn't
+ * respond.
+ *
+ * Use when the system has inferred an action from user input (voice
+ * note → reject, bulk import → archive duplicates, AI suggestion →
+ * apply) and wants to surface the suggestion for explicit confirmation.
+ * The countdown auto-dismisses (not auto-confirms) — the user must
+ * actively click to act.
+ *
+ * For form save state, use `<SaveBar>` instead. For multi-select
+ * batch actions, use `<BatchActionBar>`.
+ */
+declare function ConfirmBar({ open, title, description, confirmLabel, cancelLabel, confirmVariant, onConfirm, onCancel, countdown: initialCountdown, paused, expandableDescription, containerClassName, className, }: ConfirmBarProps): React.ReactPortal | null;
+
+export { ConfirmBar, type ConfirmBarProps };

package/dist/primitives/confirm-bar.js

@@ -0,0 +1,101 @@
+"use client";
+"use client";
+import {
+  Button
+} from "../chunk-HQRWRRZJ.js";
+import "../chunk-G6SRSWXB.js";
+
+// src/primitives/confirm-bar.tsx
+import { useEffect, useRef, useState } from "react";
+import { createPortal } from "react-dom";
+import { jsx, jsxs } from "react/jsx-runtime";
+function ConfirmBar({
+  open,
+  title,
+  description,
+  confirmLabel = "Confirm",
+  cancelLabel = "Cancel",
+  confirmVariant = "default",
+  onConfirm,
+  onCancel,
+  countdown: initialCountdown,
+  paused = false,
+  expandableDescription = false,
+  containerClassName = "max-w-3xl",
+  className
+}) {
+  const [remaining, setRemaining] = useState(initialCountdown ?? 0);
+  const timerRef = useRef(null);
+  const [mounted, setMounted] = useState(false);
+  const [expanded, setExpanded] = useState(false);
+  useEffect(() => {
+    setMounted(true);
+  }, []);
+  useEffect(() => {
+    if (!open) setExpanded(false);
+  }, [open]);
+  const timerPaused = paused || expanded;
+  useEffect(() => {
+    if (!open || !initialCountdown || timerPaused) {
+      if (timerRef.current) {
+        clearInterval(timerRef.current);
+        timerRef.current = null;
+      }
+      return;
+    }
+    setRemaining(initialCountdown);
+    timerRef.current = setInterval(() => {
+      setRemaining((prev) => {
+        if (prev <= 1) {
+          clearInterval(timerRef.current);
+          timerRef.current = null;
+          onCancel();
+          return 0;
+        }
+        return prev - 1;
+      });
+    }, 1e3);
+    return () => {
+      if (timerRef.current) {
+        clearInterval(timerRef.current);
+        timerRef.current = null;
+      }
+    };
+  }, [open, initialCountdown, timerPaused]);
+  if (!mounted || !open) return null;
+  return createPortal(
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: `fixed inset-x-0 bottom-0 z-50 border-t bg-background shadow-lg pb-[env(safe-area-inset-bottom)] animate-in slide-in-from-bottom-full duration-200 ${className ?? ""}`,
+        onClick: (e) => e.stopPropagation(),
+        onPointerDown: (e) => e.stopPropagation(),
+        children: /* @__PURE__ */ jsxs("div", { className: `mx-auto px-5 py-4 flex items-center gap-4 ${containerClassName}`, children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+            /* @__PURE__ */ jsx("p", { className: "text-base font-medium", children: title }),
+            description && /* @__PURE__ */ jsx("p", { className: `text-sm text-muted-foreground mt-0.5 ${expandableDescription && !expanded ? "truncate" : ""}`, children: description }),
+            expandableDescription && description && /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => setExpanded((v) => !v),
+                className: "text-xs text-foreground/70 hover:text-foreground underline underline-offset-2 mt-1",
+                children: expanded ? "See less" : "See more"
+              }
+            )
+          ] }),
+          initialCountdown && !timerPaused && remaining > 0 && /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground tabular-nums shrink-0", children: [
+            remaining,
+            "s"
+          ] }),
+          /* @__PURE__ */ jsx(Button, { size: "sm", variant: "ghost", onClick: onCancel, className: "shrink-0", children: cancelLabel }),
+          /* @__PURE__ */ jsx(Button, { size: "sm", variant: confirmVariant, onClick: onConfirm, className: "shrink-0", children: confirmLabel })
+        ] })
+      }
+    ),
+    document.body
+  );
+}
+export {
+  ConfirmBar
+};