@orangecheck/design 0.6.0 → 0.7.0

package/dist/primitives.d.mts

@@ -14,6 +14,7 @@ import * as PopoverPrimitive from '@radix-ui/react-popover';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
 import * as SelectPrimitive from '@radix-ui/react-select';
 import { ToasterProps } from 'sonner';
+import * as TabsPrimitive from '@radix-ui/react-tabs';
 
 declare const buttonVariants: (props?: ({
     variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
@@ -98,6 +99,9 @@ declare function WorkingPanel({ text, progress }: Pick<WorkingProps, 'text' | 'p
 interface Props {
     children: React.ReactNode;
     fallback?: (error: Error, reset: () => void) => React.ReactNode;
+    title?: string;
+    message?: string;
+    onError?: (error: Error, info: React.ErrorInfo) => void;
 }
 interface State {
     error: Error | null;
@@ -266,6 +270,20 @@ interface StatusPillProps {
     className?: string;
 }
 declare function StatusPill({ label, tone, icon, className }: StatusPillProps): react_jsx_runtime.JSX.Element;
+interface StatusPillSpec {
+    tone: StatusTone;
+    label?: string;
+    icon?: ReactNode;
+}
+declare function makeStatusPill<S extends string>(map: Record<S, StatusPillSpec>): (props: {
+    status: S;
+    className?: string;
+}) => ReactNode;
+
+declare function Tabs({ ...props }: React.ComponentProps<typeof TabsPrimitive.Root>): react_jsx_runtime.JSX.Element;
+declare function TabsList({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.List>): react_jsx_runtime.JSX.Element;
+declare function TabsTrigger({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
+declare function TabsContent({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Content>): react_jsx_runtime.JSX.Element;
 
 interface SatsAmountProps {
     sats: number;
@@ -305,4 +323,4 @@ interface QrCodeProps {
 }
 declare function QrCode({ value, size, label, className }: QrCodeProps): react_jsx_runtime.JSX.Element;
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, AlertWithAction, type AlertWithActionProps, AlertWithCountdown, type AlertWithCountdownProps, Badge, Bar, type BarProps, BitcoinAddress, type BitcoinAddressProps, Button, Card, type CardProps, Checkbox, ConfirmHost, type ConfirmOptions, CopyButton, type CopyButtonProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, ErrorBoundary, Input, Label, Modal, type ModalProps, Pagination, type PaginationProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PromptHost, type PromptOptions, QrCode, type QrCodeProps, RadioGroup, RadioGroupItem, SatsAmount, type SatsAmountProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, type SkeletonProps, Sparkline, type SparklineProps, StatBlock, type StatBlockProps, StatusPill, type StatusPillProps, type StatusTone, Switch, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Working, WorkingPanel, type WorkingProps, badgeVariants, buttonVariants, confirm, prompt };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, AlertWithAction, type AlertWithActionProps, AlertWithCountdown, type AlertWithCountdownProps, Badge, Bar, type BarProps, BitcoinAddress, type BitcoinAddressProps, Button, Card, type CardProps, Checkbox, ConfirmHost, type ConfirmOptions, CopyButton, type CopyButtonProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, ErrorBoundary, Input, Label, Modal, type ModalProps, Pagination, type PaginationProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PromptHost, type PromptOptions, QrCode, type QrCodeProps, RadioGroup, RadioGroupItem, SatsAmount, type SatsAmountProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, type SkeletonProps, Sparkline, type SparklineProps, StatBlock, type StatBlockProps, StatusPill, type StatusPillProps, type StatusPillSpec, type StatusTone, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Working, WorkingPanel, type WorkingProps, badgeVariants, buttonVariants, confirm, makeStatusPill, prompt };

package/dist/primitives.d.ts

@@ -14,6 +14,7 @@ import * as PopoverPrimitive from '@radix-ui/react-popover';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
 import * as SelectPrimitive from '@radix-ui/react-select';
 import { ToasterProps } from 'sonner';
+import * as TabsPrimitive from '@radix-ui/react-tabs';
 
 declare const buttonVariants: (props?: ({
     variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
@@ -98,6 +99,9 @@ declare function WorkingPanel({ text, progress }: Pick<WorkingProps, 'text' | 'p
 interface Props {
     children: React.ReactNode;
     fallback?: (error: Error, reset: () => void) => React.ReactNode;
+    title?: string;
+    message?: string;
+    onError?: (error: Error, info: React.ErrorInfo) => void;
 }
 interface State {
     error: Error | null;
@@ -266,6 +270,20 @@ interface StatusPillProps {
     className?: string;
 }
 declare function StatusPill({ label, tone, icon, className }: StatusPillProps): react_jsx_runtime.JSX.Element;
+interface StatusPillSpec {
+    tone: StatusTone;
+    label?: string;
+    icon?: ReactNode;
+}
+declare function makeStatusPill<S extends string>(map: Record<S, StatusPillSpec>): (props: {
+    status: S;
+    className?: string;
+}) => ReactNode;
+
+declare function Tabs({ ...props }: React.ComponentProps<typeof TabsPrimitive.Root>): react_jsx_runtime.JSX.Element;
+declare function TabsList({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.List>): react_jsx_runtime.JSX.Element;
+declare function TabsTrigger({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
+declare function TabsContent({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Content>): react_jsx_runtime.JSX.Element;
 
 interface SatsAmountProps {
     sats: number;
@@ -305,4 +323,4 @@ interface QrCodeProps {
 }
 declare function QrCode({ value, size, label, className }: QrCodeProps): react_jsx_runtime.JSX.Element;
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, AlertWithAction, type AlertWithActionProps, AlertWithCountdown, type AlertWithCountdownProps, Badge, Bar, type BarProps, BitcoinAddress, type BitcoinAddressProps, Button, Card, type CardProps, Checkbox, ConfirmHost, type ConfirmOptions, CopyButton, type CopyButtonProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, ErrorBoundary, Input, Label, Modal, type ModalProps, Pagination, type PaginationProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PromptHost, type PromptOptions, QrCode, type QrCodeProps, RadioGroup, RadioGroupItem, SatsAmount, type SatsAmountProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, type SkeletonProps, Sparkline, type SparklineProps, StatBlock, type StatBlockProps, StatusPill, type StatusPillProps, type StatusTone, Switch, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Working, WorkingPanel, type WorkingProps, badgeVariants, buttonVariants, confirm, prompt };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, AlertWithAction, type AlertWithActionProps, AlertWithCountdown, type AlertWithCountdownProps, Badge, Bar, type BarProps, BitcoinAddress, type BitcoinAddressProps, Button, Card, type CardProps, Checkbox, ConfirmHost, type ConfirmOptions, CopyButton, type CopyButtonProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, ErrorBoundary, Input, Label, Modal, type ModalProps, Pagination, type PaginationProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PromptHost, type PromptOptions, QrCode, type QrCodeProps, RadioGroup, RadioGroupItem, SatsAmount, type SatsAmountProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, type SkeletonProps, Sparkline, type SparklineProps, StatBlock, type StatBlockProps, StatusPill, type StatusPillProps, type StatusPillSpec, type StatusTone, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Working, WorkingPanel, type WorkingProps, badgeVariants, buttonVariants, confirm, makeStatusPill, prompt };

package/dist/primitives.js

@@ -18,6 +18,7 @@ var PopoverPrimitive = require('@radix-ui/react-popover');
 var AccordionPrimitive = require('@radix-ui/react-accordion');
 var SelectPrimitive = require('@radix-ui/react-select');
 var sonner = require('sonner');
+var TabsPrimitive = require('@radix-ui/react-tabs');
 var QRCode = require('qrcode');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -50,6 +51,7 @@ var SheetPrimitive__namespace = /*#__PURE__*/_interopNamespace(SheetPrimitive);
 var PopoverPrimitive__namespace = /*#__PURE__*/_interopNamespace(PopoverPrimitive);
 var AccordionPrimitive__namespace = /*#__PURE__*/_interopNamespace(AccordionPrimitive);
 var SelectPrimitive__namespace = /*#__PURE__*/_interopNamespace(SelectPrimitive);
+var TabsPrimitive__namespace = /*#__PURE__*/_interopNamespace(TabsPrimitive);
 var QRCode__default = /*#__PURE__*/_interopDefault(QRCode);
 
 // src/primitives/button.tsx
@@ -486,6 +488,7 @@ var ErrorBoundary = class extends React2__namespace.Component {
   }
   componentDidCatch(error, info) {
     console.error("[ErrorBoundary]", error, info);
+    this.props.onError?.(error, info);
   }
   render() {
     if (this.state.error) {
@@ -493,7 +496,7 @@ var ErrorBoundary = class extends React2__namespace.Component {
         return this.props.fallback(this.state.error, this.reset);
       }
       return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "container py-16", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "terminal", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "terminal-title", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-destructive flex items-center gap-1.5", children: "! fatal" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "terminal-title", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-destructive flex items-center gap-1.5", children: this.props.title ?? "! fatal" }) }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3 p-5 font-mono text-xs leading-relaxed", children: [
           /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
             /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-destructive", children: [
@@ -505,7 +508,7 @@ var ErrorBoundary = class extends React2__namespace.Component {
           ] }),
           /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-muted-foreground", children: [
             "> ",
-            "this page crashed. reload to recover."
+            this.props.message ?? "this page crashed. reload to recover."
           ] }),
           /* @__PURE__ */ jsxRuntime.jsx(
             "button",
@@ -807,7 +810,7 @@ function ConfirmHost() {
       ) }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4 p-4 sm:p-5", children: [
         /* @__PURE__ */ jsxRuntime.jsx(SheetPrimitive__namespace.Title, { className: "sr-only", children: state.title }),
-        /* @__PURE__ */ jsxRuntime.jsx(SheetPrimitive__namespace.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground font-mono text-xs leading-relaxed whitespace-pre-wrap", children: state.message }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(SheetPrimitive__namespace.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground font-mono text-xs leading-relaxed whitespace-pre-wrap [overflow-wrap:anywhere]", children: state.message }) }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center justify-end gap-2", children: [
           /* @__PURE__ */ jsxRuntime.jsx(
             Button,
@@ -1458,6 +1461,57 @@ function StatusPill({ label, tone = "muted", icon, className }) {
     }
   );
 }
+function makeStatusPill(map) {
+  function DomainStatusPill({ status, className }) {
+    const spec = map[status];
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      StatusPill,
+      {
+        tone: spec?.tone ?? "muted",
+        label: spec?.label ?? status,
+        icon: spec?.icon,
+        className
+      }
+    );
+  }
+  return DomainStatusPill;
+}
+function Tabs({ ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(TabsPrimitive__namespace.Root, { "data-slot": "tabs", ...props });
+}
+function TabsList({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.List,
+    {
+      "data-slot": "tabs-list",
+      className: cn("border-border -mb-px flex items-center gap-6 border-b", className),
+      ...props
+    }
+  );
+}
+function TabsTrigger({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.Trigger,
+    {
+      "data-slot": "tabs-trigger",
+      className: cn(
+        "text-muted-foreground hover:text-foreground data-[state=active]:text-primary data-[state=active]:border-primary -mb-px border-b-2 border-transparent py-2 font-mono text-[11px] tracking-widest uppercase transition-colors outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TabsContent({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.Content,
+    {
+      "data-slot": "tabs-content",
+      className: cn("mt-4 outline-none", className),
+      ...props
+    }
+  );
+}
 
 // src/format/index.ts
 var REFERENCE_BTC_USD = 95e3;
@@ -1662,6 +1716,10 @@ exports.Sparkline = Sparkline;
 exports.StatBlock = StatBlock;
 exports.StatusPill = StatusPill;
 exports.Switch = Switch;
+exports.Tabs = Tabs;
+exports.TabsContent = TabsContent;
+exports.TabsList = TabsList;
+exports.TabsTrigger = TabsTrigger;
 exports.Textarea = Textarea;
 exports.ThemeToggle = ThemeToggle;
 exports.ThemeToggleLink = ThemeToggleLink;
@@ -1671,6 +1729,7 @@ exports.WorkingPanel = WorkingPanel;
 exports.badgeVariants = badgeVariants;
 exports.buttonVariants = buttonVariants;
 exports.confirm = confirm;
+exports.makeStatusPill = makeStatusPill;
 exports.prompt = prompt;
 //# sourceMappingURL=primitives.js.map
 //# sourceMappingURL=primitives.js.map