@orangecheck/design 0.7.6 → 0.9.0

package/dist/primitives.d.mts

@@ -17,8 +17,8 @@ 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;
-    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
+    variant?: "default" | "link" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
+    size?: "default" | "icon" | "sm" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare function Button({ className, variant, size, asChild, ...props }: React.ComponentProps<'button'> & VariantProps<typeof buttonVariants> & {
     asChild?: boolean;
@@ -111,7 +111,7 @@ declare class ErrorBoundary extends React.Component<Props, State> {
     static getDerivedStateFromError(error: Error): State;
     componentDidCatch(error: Error, info: React.ErrorInfo): void;
     reset: () => void;
-    render(): string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined;
+    render(): string | number | bigint | boolean | react_jsx_runtime.JSX.Element | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | null | undefined;
 }
 
 interface SkeletonProps {
@@ -198,6 +198,22 @@ declare function PopoverTrigger({ ...props }: React.ComponentProps<typeof Popove
 declare function PopoverContent({ className, align, sideOffset, ...props }: React.ComponentProps<typeof PopoverPrimitive.Content>): react_jsx_runtime.JSX.Element;
 declare function PopoverAnchor({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Anchor>): react_jsx_runtime.JSX.Element;
 
+interface TooltipProps {
+    content: React.ReactNode;
+    children: React.ReactElement;
+    side?: 'top' | 'right' | 'bottom' | 'left';
+    align?: 'start' | 'center' | 'end';
+    sideOffset?: number;
+    collisionPadding?: number;
+    openDelay?: number;
+    closeDelay?: number;
+    disabled?: boolean;
+    portal?: boolean;
+    zIndexClassName?: string;
+    contentClassName?: string;
+}
+declare function Tooltip({ content, children, side, align, sideOffset, collisionPadding, openDelay, closeDelay, disabled, portal, zIndexClassName, contentClassName, }: TooltipProps): react_jsx_runtime.JSX.Element;
+
 declare const Accordion: React.ForwardRefExoticComponent<(AccordionPrimitive.AccordionSingleProps | AccordionPrimitive.AccordionMultipleProps) & React.RefAttributes<HTMLDivElement>>;
 declare const AccordionItem: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const AccordionTrigger: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
@@ -330,4 +346,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 StatusPillSpec, type StatusPillVariant, type StatusTone, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Working, WorkingPanel, type WorkingProps, badgeVariants, buttonVariants, confirm, makeStatusPill, 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 StatusPillVariant, type StatusTone, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Tooltip, type TooltipProps, Working, WorkingPanel, type WorkingProps, badgeVariants, buttonVariants, confirm, makeStatusPill, prompt };

package/dist/primitives.d.ts

@@ -17,8 +17,8 @@ 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;
-    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
+    variant?: "default" | "link" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
+    size?: "default" | "icon" | "sm" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare function Button({ className, variant, size, asChild, ...props }: React.ComponentProps<'button'> & VariantProps<typeof buttonVariants> & {
     asChild?: boolean;
@@ -111,7 +111,7 @@ declare class ErrorBoundary extends React.Component<Props, State> {
     static getDerivedStateFromError(error: Error): State;
     componentDidCatch(error: Error, info: React.ErrorInfo): void;
     reset: () => void;
-    render(): string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined;
+    render(): string | number | bigint | boolean | react_jsx_runtime.JSX.Element | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | null | undefined;
 }
 
 interface SkeletonProps {
@@ -198,6 +198,22 @@ declare function PopoverTrigger({ ...props }: React.ComponentProps<typeof Popove
 declare function PopoverContent({ className, align, sideOffset, ...props }: React.ComponentProps<typeof PopoverPrimitive.Content>): react_jsx_runtime.JSX.Element;
 declare function PopoverAnchor({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Anchor>): react_jsx_runtime.JSX.Element;
 
+interface TooltipProps {
+    content: React.ReactNode;
+    children: React.ReactElement;
+    side?: 'top' | 'right' | 'bottom' | 'left';
+    align?: 'start' | 'center' | 'end';
+    sideOffset?: number;
+    collisionPadding?: number;
+    openDelay?: number;
+    closeDelay?: number;
+    disabled?: boolean;
+    portal?: boolean;
+    zIndexClassName?: string;
+    contentClassName?: string;
+}
+declare function Tooltip({ content, children, side, align, sideOffset, collisionPadding, openDelay, closeDelay, disabled, portal, zIndexClassName, contentClassName, }: TooltipProps): react_jsx_runtime.JSX.Element;
+
 declare const Accordion: React.ForwardRefExoticComponent<(AccordionPrimitive.AccordionSingleProps | AccordionPrimitive.AccordionMultipleProps) & React.RefAttributes<HTMLDivElement>>;
 declare const AccordionItem: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const AccordionTrigger: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
@@ -330,4 +346,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 StatusPillSpec, type StatusPillVariant, type StatusTone, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Working, WorkingPanel, type WorkingProps, badgeVariants, buttonVariants, confirm, makeStatusPill, 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 StatusPillVariant, type StatusTone, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Tooltip, type TooltipProps, Working, WorkingPanel, type WorkingProps, badgeVariants, buttonVariants, confirm, makeStatusPill, prompt };

package/dist/primitives.js

@@ -1084,6 +1084,141 @@ function PopoverContent({
 function PopoverAnchor({ ...props }) {
   return /* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Anchor, { "data-slot": "popover-anchor", ...props });
 }
+var TOOLTIP_SURFACE_CLASS = "bg-popover text-popover-foreground border-border rounded-md border p-2.5 shadow-md";
+var TOOLTIP_MOTION_CLASS = "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-1 data-[side=top]:slide-in-from-bottom-1 data-[side=left]:slide-in-from-right-1 data-[side=right]:slide-in-from-left-1 origin-(--radix-popover-content-transform-origin) duration-150 ease-out";
+function compose(theirs, ours) {
+  return (e) => {
+    theirs?.(e);
+    ours(e);
+  };
+}
+var lastInputWasKeyboard = false;
+var modalityInstalled = false;
+function installModalityTracking() {
+  if (modalityInstalled || typeof window === "undefined") return;
+  modalityInstalled = true;
+  window.addEventListener("keydown", () => lastInputWasKeyboard = true, true);
+  window.addEventListener("pointerdown", () => lastInputWasKeyboard = false, true);
+}
+function Tooltip({
+  content,
+  children,
+  side = "bottom",
+  align = "start",
+  sideOffset = 8,
+  collisionPadding = 12,
+  openDelay = 300,
+  closeDelay = 90,
+  disabled = false,
+  portal = true,
+  zIndexClassName = "z-50",
+  contentClassName
+}) {
+  const [hovering, setHovering] = React2__namespace.useState(false);
+  const [focusing, setFocusing] = React2__namespace.useState(false);
+  const [isFinePointer, setIsFinePointer] = React2__namespace.useState(false);
+  const openTimer = React2__namespace.useRef(null);
+  const closeTimer = React2__namespace.useRef(null);
+  React2__namespace.useEffect(() => {
+    installModalityTracking();
+    const mq = window.matchMedia("(hover: hover) and (pointer: fine)");
+    const apply = () => setIsFinePointer(mq.matches);
+    apply();
+    mq.addEventListener("change", apply);
+    return () => mq.removeEventListener("change", apply);
+  }, []);
+  const clearTimers = React2__namespace.useCallback(() => {
+    if (openTimer.current) clearTimeout(openTimer.current);
+    if (closeTimer.current) clearTimeout(closeTimer.current);
+  }, []);
+  React2__namespace.useEffect(() => clearTimers, [clearTimers]);
+  React2__namespace.useEffect(() => {
+    if (disabled) {
+      clearTimers();
+      setHovering(false);
+    }
+  }, [disabled, clearTimers]);
+  const handlePointerEnter = () => {
+    if (!isFinePointer) return;
+    if (closeTimer.current) clearTimeout(closeTimer.current);
+    openTimer.current = setTimeout(() => setHovering(true), openDelay);
+  };
+  const handlePointerLeave = () => {
+    if (openTimer.current) clearTimeout(openTimer.current);
+    closeTimer.current = setTimeout(() => setHovering(false), closeDelay);
+  };
+  const handlePointerDown = () => {
+    clearTimers();
+    setHovering(false);
+    setFocusing(false);
+  };
+  const handleFocus = () => {
+    if (lastInputWasKeyboard) {
+      clearTimers();
+      setFocusing(true);
+    }
+  };
+  const handleBlur = () => {
+    clearTimers();
+    setFocusing(false);
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "Escape") {
+      clearTimers();
+      setHovering(false);
+      setFocusing(false);
+    }
+  };
+  const effectiveOpen = !disabled && (isFinePointer && hovering || focusing);
+  const extra = {};
+  const childProps = children.props;
+  extra.onPointerEnter = compose(childProps.onPointerEnter, handlePointerEnter);
+  extra.onPointerLeave = compose(childProps.onPointerLeave, handlePointerLeave);
+  extra.onPointerDown = compose(childProps.onPointerDown, handlePointerDown);
+  extra.onFocus = compose(childProps.onFocus, handleFocus);
+  extra.onBlur = compose(childProps.onBlur, handleBlur);
+  extra.onKeyDown = compose(childProps.onKeyDown, handleKeyDown);
+  const trigger = React2__namespace.cloneElement(children, extra);
+  const contentEl = /* @__PURE__ */ jsxRuntime.jsx(
+    PopoverPrimitive__namespace.Content,
+    {
+      side,
+      align,
+      sideOffset,
+      collisionPadding,
+      "aria-hidden": true,
+      onOpenAutoFocus: (e) => e.preventDefault(),
+      onCloseAutoFocus: (e) => e.preventDefault(),
+      onFocusOutside: (e) => e.preventDefault(),
+      className: cn(
+        TOOLTIP_SURFACE_CLASS,
+        TOOLTIP_MOTION_CLASS,
+        "pointer-events-none",
+        zIndexClassName,
+        contentClassName
+      ),
+      children: content
+    }
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    PopoverPrimitive__namespace.Root,
+    {
+      open: effectiveOpen,
+      onOpenChange: (o) => {
+        if (!o) {
+          clearTimers();
+          setHovering(false);
+          setFocusing(false);
+        }
+      },
+      modal: false,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Anchor, { asChild: true, children: trigger }),
+        portal ? /* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Portal, { children: contentEl }) : contentEl
+      ]
+    }
+  );
+}
 var Accordion = AccordionPrimitive__namespace.Root;
 var AccordionItem = React2__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(AccordionPrimitive__namespace.Item, { ref, className: cn("border-b", className), ...props }));
 AccordionItem.displayName = "AccordionItem";
@@ -1778,6 +1913,7 @@ exports.Textarea = Textarea;
 exports.ThemeToggle = ThemeToggle;
 exports.ThemeToggleLink = ThemeToggleLink;
 exports.Toaster = Toaster;
+exports.Tooltip = Tooltip;
 exports.Working = Working;
 exports.WorkingPanel = WorkingPanel;
 exports.badgeVariants = badgeVariants;