@epicbagel/saas-kit 0.0.0-stage → 1.0.0

package/dist/chunk-62UTAG2C.js

@@ -0,0 +1,152 @@
+"use client";
+import {
+  ScrollArea
+} from "./chunk-LELFPLTE.js";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from "./chunk-J6NXDZR5.js";
+import {
+  CountBadge
+} from "./chunk-H7TETFLB.js";
+import {
+  Skeleton
+} from "./chunk-YEW65ASC.js";
+
+// src/primitives/board-view-internals.tsx
+import { ChevronRight } from "lucide-react";
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function BoardColumnComponent({
+  column,
+  items,
+  loading,
+  getItemId,
+  renderCard,
+  renderColumnHeader,
+  renderEmpty,
+  dragItemId,
+  onDragStart,
+  onDragEnd,
+  onMove,
+  columnMinHeight
+}) {
+  const [isDropTarget, setIsDropTarget] = useState(false);
+  const handleDrop = (e) => {
+    e.preventDefault();
+    setIsDropTarget(false);
+    const itemId = e.dataTransfer.getData("text/board-item-id");
+    const fromColumn = e.dataTransfer.getData("text/board-column-id");
+    if (!itemId || fromColumn === column.id) return;
+    const parsed = Number(itemId);
+    onMove?.(Number.isNaN(parsed) ? itemId : parsed, fromColumn, column.id);
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      onDragOver: (e) => {
+        if (dragItemId !== null) {
+          e.preventDefault();
+          setIsDropTarget(true);
+        }
+      },
+      onDragLeave: () => setIsDropTarget(false),
+      onDrop: handleDrop,
+      className: `rounded-md flex flex-col transition-colors ${isDropTarget ? "bg-primary/10 ring-2 ring-primary/40" : "bg-muted/30"}`,
+      style: { minHeight: columnMinHeight },
+      children: [
+        renderColumnHeader ? renderColumnHeader(column, items) : /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-3 py-2.5 border-b", children: [
+          /* @__PURE__ */ jsx("span", { className: "text-xs font-medium uppercase tracking-wider", children: column.label }),
+          /* @__PURE__ */ jsx(CountBadge, { value: items.length, variant: "secondary" })
+        ] }),
+        /* @__PURE__ */ jsx(ScrollArea, { className: "flex-1", children: /* @__PURE__ */ jsx("div", { className: "p-2 space-y-2", children: loading && items.length === 0 ? Array.from({ length: 2 }).map((_, i) => /* @__PURE__ */ jsx(Skeleton, { className: "h-20 w-full" }, i)) : items.length === 0 ? renderEmpty ? renderEmpty(column) : /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground text-center py-6", children: isDropTarget ? "Drop to move here" : "Empty" }) : items.map((item) => {
+          const id = getItemId(item);
+          return /* @__PURE__ */ jsx(
+            "div",
+            {
+              draggable: !!onMove,
+              onDragStart: (e) => {
+                e.dataTransfer.setData("text/board-item-id", String(id));
+                e.dataTransfer.setData("text/board-column-id", column.id);
+                e.dataTransfer.effectAllowed = "move";
+                onDragStart(id);
+              },
+              onDragEnd,
+              className: onMove ? `cursor-grab active:cursor-grabbing ${dragItemId === id ? "opacity-40 ring-2 ring-primary rounded-md" : ""}` : "",
+              children: renderCard(item, column.id)
+            },
+            id
+          );
+        }) }) })
+      ]
+    }
+  );
+}
+function MobileBoardView({
+  columns,
+  grouped,
+  activeColumnId,
+  onActiveColumnChange,
+  loading,
+  getItemId,
+  renderCard,
+  renderEmpty,
+  onMove
+}) {
+  const activeColumn = columns.find((c) => c.id === activeColumnId) ?? columns[0];
+  const items = activeColumn ? grouped[activeColumn.id] ?? [] : [];
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+    /* @__PURE__ */ jsx("div", { className: "flex gap-1.5 overflow-x-auto pb-1 -mx-1 px-1 scrollbar-none", children: columns.map((col) => {
+      const count = (grouped[col.id] ?? []).length;
+      const isActive = col.id === activeColumn.id;
+      return /* @__PURE__ */ jsxs(
+        "button",
+        {
+          type: "button",
+          onClick: () => onActiveColumnChange(col.id),
+          className: `flex items-center gap-1.5 whitespace-nowrap rounded-full px-3 py-1.5 text-xs font-medium transition-colors shrink-0 ${isActive ? "bg-foreground text-background" : "bg-muted text-muted-foreground"}`,
+          children: [
+            col.label,
+            count > 0 && /* @__PURE__ */ jsx(CountBadge, { value: count, variant: "secondary" })
+          ]
+        },
+        col.id
+      );
+    }) }),
+    /* @__PURE__ */ jsx("div", { className: "space-y-2", children: loading && items.length === 0 ? Array.from({ length: 3 }).map((_, i) => /* @__PURE__ */ jsx(Skeleton, { className: "h-20 w-full rounded-lg" }, i)) : items.length === 0 ? renderEmpty ? renderEmpty(activeColumn) : /* @__PURE__ */ jsxs("p", { className: "text-sm text-muted-foreground text-center py-8", children: [
+      "No items in ",
+      activeColumn.label
+    ] }) : items.map((item) => {
+      const id = getItemId(item);
+      return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+        renderCard(item, activeColumn.id),
+        onMove && /* @__PURE__ */ jsx("div", { className: "absolute top-2 right-2", onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsxs(
+          Select,
+          {
+            value: activeColumn.id,
+            onValueChange: (toCol) => {
+              if (toCol !== activeColumn.id) {
+                onMove(id, activeColumn.id, toCol);
+              }
+            },
+            children: [
+              /* @__PURE__ */ jsxs(SelectTrigger, { className: "h-7 text-[10px] w-auto gap-1 px-2 bg-background/80 backdrop-blur-sm", children: [
+                /* @__PURE__ */ jsx(ChevronRight, { className: "h-3 w-3" }),
+                /* @__PURE__ */ jsx(SelectValue, {})
+              ] }),
+              /* @__PURE__ */ jsx(SelectContent, { children: columns.map((col) => /* @__PURE__ */ jsx(SelectItem, { value: col.id, className: "text-xs", children: col.label }, col.id)) })
+            ]
+          }
+        ) })
+      ] }, id);
+    }) })
+  ] });
+}
+
+export {
+  BoardColumnComponent,
+  MobileBoardView
+};

package/dist/chunk-667ZCM4X.cjs

@@ -0,0 +1,72 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
+
+
+var _chunkKWLSBTB2cjs = require('./chunk-KWLSBTB2.cjs');
+
+// src/primitives/alert.tsx
+var _classvarianceauthority = require('class-variance-authority');
+var _react = require('react');
+var _jsxruntime = require('react/jsx-runtime');
+var alertVariants = _classvarianceauthority.cva.call(void 0, 
+  "relative w-full rounded-lg border p-4 [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground",
+  {
+    variants: {
+      variant: {
+        default: "border-border bg-background text-foreground",
+        destructive: "border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive",
+        warning: "border-amber-500/50 bg-amber-500/10 text-amber-800 dark:text-amber-300 [&>svg]:text-amber-600",
+        success: "border-emerald-500/40 bg-emerald-500/10 text-emerald-800 dark:text-emerald-300 [&>svg]:text-emerald-600"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+var Alert = _react.forwardRef.call(void 0, ({ className, variant, marginBottom = "none", marginTop = "none", padding = "default", radius = "lg", textSize = "inherit", layout = "block", justify = "start", align = "start", ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  "div",
+  {
+    ref,
+    role: "alert",
+    className: _chunkKWLSBTB2cjs.cn.call(void 0, 
+      alertVariants({ variant }),
+      marginBottom === "md" && "mb-3",
+      marginTop === "md" && "mt-4",
+      padding === "compact" && "px-3 py-2",
+      radius === "md" && "rounded-md",
+      radius === "xl" && "rounded-xl",
+      textSize === "xs" && "text-xs",
+      textSize === "sm" && "text-sm",
+      layout === "row" && "flex gap-3",
+      justify === "between" && "justify-between",
+      align === "center" && "items-center",
+      className
+    ),
+    ...props
+  }
+));
+Alert.displayName = "Alert";
+var AlertTitle = _react.forwardRef.call(void 0, ({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  "h5",
+  {
+    ref,
+    className: _chunkKWLSBTB2cjs.cn.call(void 0, "mb-1 font-medium leading-none tracking-tight", className),
+    ...props
+  }
+));
+AlertTitle.displayName = "AlertTitle";
+var AlertDescription = _react.forwardRef.call(void 0, ({ className, spacing = "none", ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  "div",
+  {
+    ref,
+    className: _chunkKWLSBTB2cjs.cn.call(void 0, "text-sm [&_p]:leading-relaxed", spacing === "tight" && "space-y-1", className),
+    ...props
+  }
+));
+AlertDescription.displayName = "AlertDescription";
+
+
+
+
+
+exports.Alert = Alert; exports.AlertTitle = AlertTitle; exports.AlertDescription = AlertDescription;

package/dist/chunk-6RVPQGYS.js

@@ -0,0 +1,181 @@
+"use client";
+import {
+  cn
+} from "./chunk-G6SRSWXB.js";
+
+// src/primitives/stack.tsx
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+var gapStyles = {
+  none: "gap-0",
+  xs: "gap-1",
+  sm: "gap-2",
+  compact: "gap-3",
+  md: "gap-4",
+  lg: "gap-6"
+};
+var directionStyles = {
+  vertical: "flex flex-col",
+  horizontal: "flex flex-row"
+};
+var alignStyles = {
+  start: "items-start",
+  center: "items-center",
+  end: "items-end",
+  stretch: "items-stretch",
+  baseline: "items-baseline"
+};
+var justifyStyles = {
+  start: "justify-start",
+  center: "justify-center",
+  end: "justify-end",
+  between: "justify-between"
+};
+var Stack = forwardRef(
+  function Stack2({
+    gap = "md",
+    direction = "vertical",
+    reverse = false,
+    align = "stretch",
+    justify = "start",
+    wrap = false,
+    grow = false,
+    shrink = true,
+    minWidth = "auto",
+    minHeight = "auto",
+    height = "auto",
+    overflow = "visible",
+    marginTop = "none",
+    marginBottom = "none",
+    marginEnd = "none",
+    marginStart = "none",
+    overlap = "none",
+    padding = "none",
+    paddingX = "none",
+    paddingY = "none",
+    paddingTop = "none",
+    paddingBottom = "none",
+    border = "none",
+    tone = "inherit",
+    textSize = "inherit",
+    surface = "none",
+    radius = "none",
+    width = "auto",
+    textAlign = "start",
+    columnGap = "none",
+    rowGap = "none",
+    font = "sans",
+    transform = "none",
+    tracking = "normal",
+    maxWidth = "none",
+    maxHeight = "none",
+    centered = false,
+    opacity = "full",
+    interaction = "none",
+    selected = false,
+    divided = false,
+    gridSpan = "auto",
+    as,
+    className,
+    ...props
+  }, ref) {
+    const Component = as ?? "div";
+    return /* @__PURE__ */ jsx(
+      Component,
+      {
+        ref,
+        className: cn(
+          directionStyles[direction],
+          reverse && (direction === "horizontal" ? "flex-row-reverse" : "flex-col-reverse"),
+          gapStyles[gap],
+          alignStyles[align],
+          justifyStyles[justify],
+          wrap && "flex-wrap",
+          grow && "flex-1",
+          !shrink && "shrink-0",
+          minWidth === "zero" && "min-w-0",
+          minHeight === "zero" && "min-h-0",
+          height === "full" && "h-full",
+          overflow === "hidden" && "overflow-hidden",
+          overflow === "auto" && "overflow-auto",
+          overflow === "x-auto" && "overflow-x-auto",
+          overflow === "y-auto" && "overflow-y-auto",
+          marginTop === "xs" && "mt-1",
+          marginTop === "sm" && "mt-2",
+          marginTop === "md" && "mt-4",
+          marginTop === "lg" && "mt-6",
+          marginBottom === "md" && "mb-3",
+          marginBottom === "lg" && "mb-8",
+          marginEnd === "negative-xs" && "-mr-1",
+          marginStart === "auto" && "ml-auto",
+          overlap === "sm" && "-space-x-2",
+          padding === "xs" && "p-[10px]",
+          padding === "sm" && "p-[14px]",
+          padding === "control" && "px-3 py-2",
+          padding === "compact" && "p-3",
+          padding === "md" && "p-[22px]",
+          padding === "lg" && "p-[26px]",
+          padding === "action-row" && "px-4 py-3",
+          padding === "card-header" && "px-5 pt-5 pb-2",
+          padding === "card-footer" && "px-5 pb-2",
+          paddingX === "md" && "px-[22px]",
+          paddingX === "lg" && "px-[26px]",
+          paddingY === "sm" && "py-[14px]",
+          paddingY === "compact" && "py-2.5",
+          paddingY === "section" && "py-3",
+          paddingY === "md" && "py-[22px]",
+          paddingY === "lg" && "py-[26px]",
+          paddingY === "xl" && "py-8",
+          paddingY === "hero" && "py-24",
+          paddingTop === "tight" && "pt-0.5",
+          paddingTop === "md" && "pt-3",
+          paddingTop === "base" && "pt-4",
+          paddingTop === "lg" && "pt-5",
+          paddingTop === "safe" && "pt-[max(env(safe-area-inset-top),0.75rem)]",
+          paddingBottom === "sm" && "pb-2",
+          paddingBottom === "md" && "pb-3",
+          border === "top" && "border-t",
+          border === "bottom" && "border-b",
+          border === "dashed" && "border border-dashed",
+          tone === "muted" && "text-muted-foreground",
+          tone === "subtle" && "text-muted-foreground/70",
+          tone === "primary" && "text-primary",
+          tone === "warning" && "text-amber-700 dark:text-amber-400",
+          tone === "destructive" && "text-destructive",
+          textSize === "xs" && "text-xs",
+          textSize === "sm" && "text-sm",
+          surface === "background" && "bg-background",
+          surface === "card" && "border bg-card",
+          surface === "muted" && "border bg-muted/40",
+          radius === "md" && "rounded-md",
+          radius === "lg" && "rounded-lg",
+          radius === "xl" && "rounded-xl",
+          width === "full" && "w-full",
+          width === "fit" && "inline-flex w-fit",
+          textAlign === "center" && "text-center",
+          columnGap === "md" && "gap-x-3",
+          rowGap === "xs" && "gap-y-1",
+          font === "mono" && "font-mono",
+          transform === "uppercase" && "uppercase",
+          tracking === "wide" && "tracking-[0.18em]",
+          maxWidth === "xl" && "max-w-xl",
+          maxHeight === "viewport" && "max-h-[60vh]",
+          centered && "mx-auto",
+          opacity === "soft" && "opacity-70",
+          interaction === "group" && "group",
+          interaction === "hover-accent" && "transition-colors hover:bg-accent/40",
+          interaction === "group-hover-accent" && "group transition-colors hover:bg-accent/40",
+          selected && "border-foreground",
+          divided && "divide-y",
+          gridSpan === "full" && "sm:col-span-full",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+
+export {
+  Stack
+};

package/dist/chunk-6T2EULKN.cjs

@@ -0,0 +1,42 @@
+"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/eyebrow.tsx
+var _react = require('react');
+var _jsxruntime = require('react/jsx-runtime');
+var Eyebrow = _react.forwardRef.call(void 0, 
+  function Eyebrow2({ as, className, dot, display = "inline", marginBottom = "none", children, ...props }, ref) {
+    const Tag = _nullishCoalesce(as, () => ( "span"));
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      Tag,
+      {
+        ref,
+        className: _chunkKWLSBTB2cjs.cn.call(void 0, 
+          "font-mono text-xs uppercase tracking-[0.18em] text-muted-foreground",
+          dot && "inline-flex items-center",
+          display === "block" && "block",
+          marginBottom === "sm" && "mb-2",
+          marginBottom === "md" && "mb-3",
+          className
+        ),
+        ...props,
+        children: [
+          dot && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "span",
+            {
+              "aria-hidden": true,
+              className: "mr-2 inline-block h-1.5 w-1.5 shrink-0 rounded-full bg-primary"
+            }
+          ),
+          children
+        ]
+      }
+    );
+  }
+);
+
+
+
+exports.Eyebrow = Eyebrow;

package/dist/chunk-7CRDYV3C.js

@@ -0,0 +1,137 @@
+"use client";
+import {
+  cn
+} from "./chunk-G6SRSWXB.js";
+
+// src/primitives/tabs.tsx
+import * as TabsPrimitive from "@radix-ui/react-tabs";
+import {
+  forwardRef,
+  useCallback,
+  useEffect,
+  useImperativeHandle,
+  useRef,
+  useState
+} from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var Tabs = TabsPrimitive.Root;
+var TabsList = forwardRef(
+  function TabsList2({
+    className,
+    responsiveGrid = false,
+    scrollable = false,
+    width = "auto",
+    marginBottom = "none",
+    ...props
+  }, ref) {
+    const listRef = useRef(null);
+    const [overflow, setOverflow] = useState({ start: false, end: false });
+    useImperativeHandle(ref, () => listRef.current);
+    const updateOverflow = useCallback(() => {
+      const node = listRef.current;
+      if (!node) return;
+      const maxScrollLeft = Math.max(0, node.scrollWidth - node.clientWidth);
+      const next = {
+        start: node.scrollLeft > 1,
+        end: node.scrollLeft < maxScrollLeft - 1
+      };
+      setOverflow(
+        (current) => current.start === next.start && current.end === next.end ? current : next
+      );
+    }, []);
+    useEffect(() => {
+      const node = listRef.current;
+      if (!scrollable || !node) {
+        setOverflow({ start: false, end: false });
+        return;
+      }
+      updateOverflow();
+      node.addEventListener("scroll", updateOverflow, { passive: true });
+      window.addEventListener("resize", updateOverflow);
+      const observer = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(updateOverflow);
+      observer?.observe(node);
+      return () => {
+        node.removeEventListener("scroll", updateOverflow);
+        window.removeEventListener("resize", updateOverflow);
+        observer?.disconnect();
+      };
+    }, [scrollable, updateOverflow]);
+    const list = /* @__PURE__ */ jsx(
+      TabsPrimitive.List,
+      {
+        ref: listRef,
+        className: cn(
+          "min-h-10 h-auto items-center rounded-md bg-muted p-1 text-muted-foreground",
+          responsiveGrid ? "grid grid-cols-2 sm:grid-cols-4 [&>*]:min-w-0 [&>*]:whitespace-normal" : scrollable ? "flex max-w-full justify-start overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden" : "inline-flex justify-start",
+          width === "full" && "w-full",
+          marginBottom === "lg" && "mb-6",
+          className
+        ),
+        ...props
+      }
+    );
+    if (!scrollable || responsiveGrid) return list;
+    return /* @__PURE__ */ jsxs("div", { className: cn("relative max-w-full", width === "full" && "w-full"), children: [
+      list,
+      overflow.start && /* @__PURE__ */ jsx(
+        "span",
+        {
+          "aria-hidden": "true",
+          "data-scroll-fade": "start",
+          className: "pointer-events-none absolute inset-y-1 left-0 z-10 w-10 rounded-l-md bg-linear-to-r from-muted to-transparent"
+        }
+      ),
+      overflow.end && /* @__PURE__ */ jsx(
+        "span",
+        {
+          "aria-hidden": "true",
+          "data-scroll-fade": "end",
+          className: "pointer-events-none absolute inset-y-1 right-0 z-10 w-10 rounded-r-md bg-linear-to-l from-muted to-transparent"
+        }
+      )
+    ] });
+  }
+);
+TabsList.displayName = TabsPrimitive.List.displayName;
+var triggerPadding = {
+  sm: "px-2 py-1",
+  md: "px-3 py-1.5",
+  lg: "px-4 py-2",
+  xl: "px-6 py-3"
+};
+var TabsTrigger = forwardRef(({ className, padding = "xl", ...props }, ref) => /* @__PURE__ */ jsx(
+  TabsPrimitive.Trigger,
+  {
+    ref,
+    className: cn(
+      "inline-flex shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-sm text-sm font-medium ring-offset-background transition-all focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-xs",
+      triggerPadding[padding],
+      className
+    ),
+    ...props
+  }
+));
+TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
+var TabsContent = forwardRef(({ className, spacing = "none", marginTop = "default", ...props }, ref) => /* @__PURE__ */ jsx(
+  TabsPrimitive.Content,
+  {
+    ref,
+    className: cn(
+      marginTop === "default" ? "mt-2" : "mt-3",
+      "ring-offset-background focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+      spacing === "compact" && "space-y-3",
+      spacing === "md" && "space-y-4",
+      spacing === "relaxed" && "space-y-6",
+      className
+    ),
+    ...props
+  }
+));
+TabsContent.displayName = TabsPrimitive.Content.displayName;
+
+export {
+  Tabs,
+  TabsList,
+  TabsTrigger,
+  TabsContent
+};

package/dist/chunk-BEJJN2SY.cjs

@@ -0,0 +1,73 @@
+"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";
+
+
+var _chunkKWLSBTB2cjs = require('./chunk-KWLSBTB2.cjs');
+
+// src/primitives/interactive-card.tsx
+
+
+var _react = require('react');
+var _jsxruntime = require('react/jsx-runtime');
+function interactiveCardClass({
+  selected,
+  surface = "card",
+  borderWidth = "default"
+} = {}) {
+  return _chunkKWLSBTB2cjs.cn.call(void 0, 
+    "group relative w-full rounded-xl text-left",
+    borderWidth === "thin" ? "border" : "border-2",
+    surface === "subtle" ? "bg-muted/20" : "bg-card",
+    "transition-colors duration-150",
+    "hover:border-foreground/40",
+    "focus-visible:outline-hidden focus-visible:border-foreground/40",
+    "focus-visible:ring-2 focus-visible:ring-ring",
+    selected ? "border-primary" : "border-border"
+  );
+}
+var InteractiveCard = _react.forwardRef.call(void 0, 
+  function InteractiveCard2({ as, selected, flat, clip, padding = "none", radius = "xl", joined = "none", border = "default", borderWidth = "default", display = "inline", textSize = "inherit", opacity = "full", surface = "card", indicator = "bar", className, onClick, onKeyDown, ...props }, ref) {
+    const Component = _nullishCoalesce(as, () => ( "button"));
+    const needsButtonSemantics = Component !== "button" && Component !== "a" && !!onClick;
+    const handleKeyDown = (event) => {
+      _optionalChain([onKeyDown, 'optionalCall', _ => _(event)]);
+      if (event.defaultPrevented || !needsButtonSemantics) return;
+      if (event.key === "Enter" || event.key === " ") {
+        event.preventDefault();
+        _optionalChain([onClick, 'optionalCall', _2 => _2(event)]);
+      }
+    };
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      Component,
+      {
+        ref,
+        ...Component === "button" ? { type: "button" } : {},
+        ...needsButtonSemantics ? { role: "button", tabIndex: 0 } : {},
+        ...selected !== void 0 ? { "aria-current": selected || void 0 } : {},
+        className: _chunkKWLSBTB2cjs.cn.call(void 0, 
+          interactiveCardClass({ selected, flat, indicator, surface, borderWidth }),
+          clip && "overflow-hidden",
+          padding === "compact" && "p-3",
+          padding === "row" && "px-3 py-2",
+          padding === "comfortable" && "px-5 py-4",
+          padding === "roomy" && "p-5 md:p-6",
+          radius === "lg" && "rounded-lg",
+          radius === "none" && "rounded-none",
+          joined === "top" && "rounded-b-none rounded-t-xl",
+          border === "none" && "border-0",
+          display === "block" && "block",
+          textSize === "sm" && "text-sm",
+          opacity === "subdued" && "opacity-60",
+          className
+        ),
+        onClick,
+        onKeyDown: handleKeyDown,
+        ...props
+      }
+    );
+  }
+);
+
+
+
+
+exports.interactiveCardClass = interactiveCardClass; exports.InteractiveCard = InteractiveCard;