canny-ui-react 1.0.0 → 3.0.0

package/dist/components/Menu/Menu.d.ts

@@ -0,0 +1,51 @@
+import type { ComponentPropsWithoutRef, ReactNode } from 'react';
+import * as RadixMenu from '@radix-ui/react-dropdown-menu';
+export declare const Menu: import("react").FC<RadixMenu.DropdownMenuProps>;
+export declare const MenuTrigger: import("react").ForwardRefExoticComponent<RadixMenu.DropdownMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
+export interface MenuContentProps extends ComponentPropsWithoutRef<typeof RadixMenu.Content> {
+    className?: string;
+    /** Visual size — controls padding + font size. Default: `md`. */
+    size?: 'sm' | 'md';
+}
+/**
+ * The popup panel. Wrap in `<Menu>` and pair with `<MenuTrigger>`.
+ *
+ * @example
+ *   <Menu>
+ *     <MenuTrigger asChild><Button>Actions</Button></MenuTrigger>
+ *     <MenuContent>
+ *       <MenuItem onSelect={...}>Edit</MenuItem>
+ *       <MenuSeparator />
+ *       <MenuItem destructive onSelect={...}>Delete</MenuItem>
+ *     </MenuContent>
+ *   </Menu>
+ */
+export declare const MenuContent: import("react").ForwardRefExoticComponent<MenuContentProps & import("react").RefAttributes<HTMLDivElement>>;
+export interface MenuItemProps extends ComponentPropsWithoutRef<typeof RadixMenu.Item> {
+    /** Leading icon. */
+    icon?: ReactNode;
+    /** Right-aligned shortcut hint (e.g. `⌘C`). */
+    shortcut?: ReactNode;
+    /** Apply danger styling (red text, danger hover). */
+    destructive?: boolean;
+}
+export declare const MenuItem: import("react").ForwardRefExoticComponent<MenuItemProps & import("react").RefAttributes<HTMLDivElement>>;
+export interface MenuCheckboxItemProps extends ComponentPropsWithoutRef<typeof RadixMenu.CheckboxItem> {
+    shortcut?: ReactNode;
+}
+export declare const MenuCheckboxItem: import("react").ForwardRefExoticComponent<MenuCheckboxItemProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const MenuRadioGroup: import("react").ForwardRefExoticComponent<RadixMenu.DropdownMenuRadioGroupProps & import("react").RefAttributes<HTMLDivElement>>;
+export interface MenuRadioItemProps extends ComponentPropsWithoutRef<typeof RadixMenu.RadioItem> {
+    shortcut?: ReactNode;
+}
+export declare const MenuRadioItem: import("react").ForwardRefExoticComponent<MenuRadioItemProps & import("react").RefAttributes<HTMLDivElement>>;
+export interface MenuLabelProps extends ComponentPropsWithoutRef<typeof RadixMenu.Label> {
+}
+export declare const MenuLabel: import("react").ForwardRefExoticComponent<MenuLabelProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const MenuSeparator: import("react").ForwardRefExoticComponent<Omit<RadixMenu.DropdownMenuSeparatorProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const MenuSub: import("react").FC<RadixMenu.DropdownMenuSubProps>;
+export interface MenuSubTriggerProps extends ComponentPropsWithoutRef<typeof RadixMenu.SubTrigger> {
+    icon?: ReactNode;
+}
+export declare const MenuSubTrigger: import("react").ForwardRefExoticComponent<MenuSubTriggerProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const MenuSubContent: import("react").ForwardRefExoticComponent<Omit<RadixMenu.DropdownMenuSubContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/Menu/index.d.ts

@@ -0,0 +1,2 @@
+export { Menu, MenuTrigger, MenuContent, MenuItem, MenuCheckboxItem, MenuRadioGroup, MenuRadioItem, MenuLabel, MenuSeparator, MenuSub, MenuSubTrigger, MenuSubContent, } from './Menu';
+export type { MenuContentProps, MenuItemProps, MenuCheckboxItemProps, MenuRadioItemProps, MenuLabelProps, MenuSubTriggerProps, } from './Menu';

package/dist/components/Pagination/Pagination.d.ts

@@ -0,0 +1,22 @@
+export interface PaginationProps {
+    /** Current page (1-based). */
+    page: number;
+    /** Total number of pages. */
+    pageCount: number;
+    /** Fired with the new page when the user clicks. */
+    onPageChange: (page: number) => void;
+    /** Pages to show on each side of the current page. Default 1. */
+    siblingCount?: number;
+    /** Whether to always show the first/last page. Default true. */
+    showEdges?: boolean;
+    /** Hide the prev/next chevrons. */
+    hideControls?: boolean;
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+    'aria-label'?: string;
+}
+/**
+ * Pagination — page-number nav with prev/next chevrons. Server-driven:
+ * pass `page`, `pageCount`, and `onPageChange`.
+ */
+export declare const Pagination: import("react").ForwardRefExoticComponent<PaginationProps & import("react").RefAttributes<HTMLElement>>;

package/dist/components/Pagination/index.d.ts

@@ -0,0 +1,2 @@
+export { Pagination } from './Pagination';
+export type { PaginationProps } from './Pagination';

package/dist/components/Popover/Popover.d.ts

@@ -0,0 +1,24 @@
+import type { ComponentPropsWithoutRef } from 'react';
+import * as RadixPopover from '@radix-ui/react-popover';
+/**
+ * Popover root. Controlled (`open` + `onOpenChange`) or uncontrolled.
+ * Wrap a `<PopoverTrigger>` and `<PopoverContent>`.
+ *
+ * @example
+ *   <Popover>
+ *     <PopoverTrigger asChild><Button>Filters</Button></PopoverTrigger>
+ *     <PopoverContent side="bottom" align="end">
+ *       <FilterForm />
+ *     </PopoverContent>
+ *   </Popover>
+ */
+export declare const Popover: import("react").FC<RadixPopover.PopoverProps>;
+export declare const PopoverTrigger: import("react").ForwardRefExoticComponent<RadixPopover.PopoverTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
+export declare const PopoverAnchor: import("react").ForwardRefExoticComponent<RadixPopover.PopoverAnchorProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const PopoverClose: import("react").ForwardRefExoticComponent<RadixPopover.PopoverCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
+export interface PopoverContentProps extends ComponentPropsWithoutRef<typeof RadixPopover.Content> {
+    className?: string;
+    /** Render the small directional arrow on the popover. Default: false. */
+    withArrow?: boolean;
+}
+export declare const PopoverContent: import("react").ForwardRefExoticComponent<PopoverContentProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/Popover/index.d.ts

@@ -0,0 +1,2 @@
+export { Popover, PopoverTrigger, PopoverAnchor, PopoverClose, PopoverContent, } from './Popover';
+export type { PopoverContentProps } from './Popover';

package/dist/components/Slider/Slider.d.ts

@@ -0,0 +1,15 @@
+import type { ComponentPropsWithoutRef, ReactNode } from 'react';
+import * as SliderPrimitive from '@radix-ui/react-slider';
+export interface SliderProps extends ComponentPropsWithoutRef<typeof SliderPrimitive.Root> {
+    size?: 'sm' | 'md' | 'lg';
+    color?: 'primary' | 'success' | 'warning' | 'danger';
+    /** Show inline value bubble above the active thumb on hover/focus. */
+    showValue?: boolean;
+    /** Format value for the bubble. Default: `String(v)`. */
+    formatValue?: (v: number) => ReactNode;
+}
+/**
+ * Slider — single or range value picker. Pass an array length 1 for single,
+ * length 2 for range. Built on @radix-ui/react-slider.
+ */
+export declare const Slider: import("react").ForwardRefExoticComponent<SliderProps & import("react").RefAttributes<HTMLSpanElement>>;

package/dist/components/Slider/index.d.ts

@@ -0,0 +1,2 @@
+export { Slider } from './Slider';
+export type { SliderProps } from './Slider';

package/dist/components/Stepper/Stepper.d.ts

@@ -0,0 +1,16 @@
+import type { HTMLAttributes, ReactNode } from 'react';
+export interface StepperStep {
+    label: ReactNode;
+    description?: ReactNode;
+    icon?: ReactNode;
+}
+export interface StepperProps extends Omit<HTMLAttributes<HTMLOListElement>, 'children'> {
+    steps: StepperStep[];
+    /** Active step index (0-based). Steps before this are marked complete. */
+    active: number;
+    orientation?: 'horizontal' | 'vertical';
+    size?: 'sm' | 'md';
+    /** Fired when a previously-completed step is clicked. */
+    onStepClick?: (index: number) => void;
+}
+export declare const Stepper: import("react").ForwardRefExoticComponent<StepperProps & import("react").RefAttributes<HTMLOListElement>>;

package/dist/components/Stepper/index.d.ts

@@ -0,0 +1,2 @@
+export { Stepper } from './Stepper';
+export type { StepperProps, StepperStep } from './Stepper';

package/dist/components/Tabs/Tabs.d.ts

@@ -0,0 +1,34 @@
+import type { ComponentPropsWithoutRef } from 'react';
+import * as RadixTabs from '@radix-ui/react-tabs';
+export type TabsVariant = 'line' | 'pills' | 'segmented';
+export type TabsSize = 'sm' | 'md' | 'lg';
+/**
+ * Tabbed view container. Built on @radix-ui/react-tabs — handles roving
+ * tabindex, arrow-key nav, and proper ARIA wiring out of the box.
+ *
+ * @example
+ *   <Tabs defaultValue="overview">
+ *     <TabsList>
+ *       <TabsTrigger value="overview">Overview</TabsTrigger>
+ *       <TabsTrigger value="activity">Activity</TabsTrigger>
+ *     </TabsList>
+ *     <TabsContent value="overview">…</TabsContent>
+ *     <TabsContent value="activity">…</TabsContent>
+ *   </Tabs>
+ */
+export interface TabsProps extends ComponentPropsWithoutRef<typeof RadixTabs.Root> {
+    /** Visual style. Default: `line`. */
+    variant?: TabsVariant;
+    /** Size preset. Default: `md`. */
+    size?: TabsSize;
+}
+export declare const Tabs: import("react").ForwardRefExoticComponent<TabsProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const TabsList: import("react").ForwardRefExoticComponent<Omit<RadixTabs.TabsListProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export interface TabsTriggerProps extends ComponentPropsWithoutRef<typeof RadixTabs.Trigger> {
+    /** Optional leading icon. */
+    icon?: React.ReactNode;
+    /** Optional right-aligned badge (count, status). */
+    badge?: React.ReactNode;
+}
+export declare const TabsTrigger: import("react").ForwardRefExoticComponent<TabsTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
+export declare const TabsContent: import("react").ForwardRefExoticComponent<Omit<RadixTabs.TabsContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/Tabs/index.d.ts

@@ -0,0 +1,2 @@
+export { Tabs, TabsList, TabsTrigger, TabsContent } from './Tabs';
+export type { TabsProps, TabsTriggerProps, TabsVariant, TabsSize } from './Tabs';

package/dist/components/Toast/Toast.d.ts

@@ -0,0 +1,15 @@
+import type { ToastApi, ToastProviderProps } from './Toast.types';
+/**
+ * Wrap your app to enable `useToast()`. Renders a portaled viewport at the
+ * chosen `position`. Multiple providers will simply create separate viewports.
+ */
+export declare function ToastProvider({ children, position, defaultDuration, maxToasts, offset, }: ToastProviderProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Imperative toast API. Must be called inside a `<ToastProvider>` tree.
+ *
+ * @example
+ *   const { toast } = useToast();
+ *   toast.success('Saved');
+ *   toast({ title: 'Custom', description: 'Anything.', action: <button>Undo</button> });
+ */
+export declare function useToast(): ToastApi;

package/dist/components/Toast/Toast.types.d.ts

@@ -0,0 +1,57 @@
+import type { ReactNode } from 'react';
+export type ToastVariant = 'default' | 'success' | 'info' | 'warning' | 'danger' | 'loading';
+export type ToastPosition = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right';
+export interface ToastOptions {
+    /** Visible title. Required unless `description` is supplied. */
+    title?: ReactNode;
+    /** Optional secondary line under the title. */
+    description?: ReactNode;
+    /** Right-side action node — typically a Button. */
+    action?: ReactNode;
+    /** Override the default icon. Pass `false` to hide the icon. */
+    icon?: ReactNode | false;
+    /** Variant — drives color, icon, and ARIA role. */
+    variant?: ToastVariant;
+    /** ms before auto-dismiss. Pass `Infinity` (or a negative number) to keep open until dismissed. */
+    duration?: number;
+    /** Fires when the toast disappears (auto or manual). */
+    onDismiss?: () => void;
+    /** Stable identifier — supply when calling `update(id, …)`. */
+    id?: string;
+    /** Hide the close button. */
+    dismissible?: boolean;
+}
+export interface ToastInstance extends Required<Pick<ToastOptions, 'variant' | 'duration' | 'dismissible'>> {
+    id: string;
+    title?: ReactNode;
+    description?: ReactNode;
+    action?: ReactNode;
+    icon?: ReactNode | false;
+    onDismiss?: () => void;
+    /** Internal — flips to true when entering exit animation. */
+    exiting?: boolean;
+}
+export interface ToastFunction {
+    (opts: ToastOptions | string): string;
+    success: (title: ReactNode, opts?: Omit<ToastOptions, 'variant' | 'title'>) => string;
+    info: (title: ReactNode, opts?: Omit<ToastOptions, 'variant' | 'title'>) => string;
+    warning: (title: ReactNode, opts?: Omit<ToastOptions, 'variant' | 'title'>) => string;
+    error: (title: ReactNode, opts?: Omit<ToastOptions, 'variant' | 'title'>) => string;
+    loading: (title: ReactNode, opts?: Omit<ToastOptions, 'variant' | 'title'>) => string;
+}
+export interface ToastApi {
+    toast: ToastFunction;
+    dismiss: (id?: string) => void;
+    update: (id: string, opts: Partial<ToastOptions>) => void;
+}
+export interface ToastProviderProps {
+    children: ReactNode;
+    /** Where the toast viewport renders. Default `bottom-right`. */
+    position?: ToastPosition;
+    /** Default duration (ms) when individual toasts don't specify one. Default 5000. */
+    defaultDuration?: number;
+    /** Max number of toasts visible at once; older ones drop off. Default 5. */
+    maxToasts?: number;
+    /** Distance from the viewport edges. Default `1rem`. */
+    offset?: string;
+}

package/dist/components/Toast/index.d.ts

@@ -0,0 +1,2 @@
+export { ToastProvider, useToast } from './Toast';
+export type { ToastVariant, ToastPosition, ToastOptions, ToastInstance, ToastFunction, ToastApi, ToastProviderProps, } from './Toast.types';

package/dist/components/Tooltip/Tooltip.d.ts

@@ -0,0 +1,46 @@
+import type { ReactNode } from 'react';
+import * as RadixTooltip from '@radix-ui/react-tooltip';
+/**
+ * Tooltip provider — wrap your app once. Controls the global delay so the
+ * first tooltip in a group has a longer delay, then subsequent tooltips
+ * appear instantly.
+ *
+ * @example
+ *   <TooltipProvider delayDuration={500}>
+ *     <App />
+ *   </TooltipProvider>
+ */
+export declare const TooltipProvider: import("react").FC<RadixTooltip.TooltipProviderProps>;
+export interface TooltipProps {
+    /** The element that triggers the tooltip on hover/focus. */
+    children: ReactNode;
+    /** Tooltip text or node. */
+    content: ReactNode;
+    /** Side preference. Auto-flips when there's no room. Default: `top`. */
+    side?: 'top' | 'right' | 'bottom' | 'left';
+    /** Alignment along the side. Default: `center`. */
+    align?: 'start' | 'center' | 'end';
+    /** Pixels between the trigger and the tooltip. Default: 6. */
+    sideOffset?: number;
+    /** Override delay (ms) before showing. Falls back to TooltipProvider's delay. */
+    delayDuration?: number;
+    /** Controlled open state. Mostly for testing. */
+    open?: boolean;
+    /** Disable the tooltip but keep the trigger interactive. */
+    disabled?: boolean;
+    /** Extra className on the popup. */
+    contentClassName?: string;
+}
+/**
+ * Single-shot tooltip. Pass any element as `children` and it becomes the
+ * trigger. The element must accept a ref (or wrap in `asChild` via Radix).
+ *
+ * @example
+ *   <Tooltip content="Copy to clipboard">
+ *     <IconButton><Copy size={14} /></IconButton>
+ *   </Tooltip>
+ */
+export declare const Tooltip: import("react").ForwardRefExoticComponent<TooltipProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const TooltipRoot: import("react").FC<RadixTooltip.TooltipProps>;
+export declare const TooltipTrigger: import("react").ForwardRefExoticComponent<RadixTooltip.TooltipTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
+export declare const TooltipContent: import("react").ForwardRefExoticComponent<Omit<RadixTooltip.TooltipContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/Tooltip/index.d.ts

@@ -0,0 +1,2 @@
+export { Tooltip, TooltipProvider, TooltipRoot, TooltipTrigger, TooltipContent, } from './Tooltip';
+export type { TooltipProps } from './Tooltip';