atlas-react-kit 0.4.0 → 0.5.0

package/dist/pagination.d.ts

@@ -0,0 +1,18 @@
+import * as React from "react";
+/**
+ * Page links for long lists and tables. Links are plain anchors so the page
+ * lives in the URL; pass `onClick` with `href` for client-side routing.
+ */
+declare function Pagination({ className, ...props }: React.ComponentProps<"nav">): React.JSX.Element;
+declare function PaginationContent({ className, ...props }: React.ComponentProps<"ul">): React.JSX.Element;
+declare function PaginationItem({ ...props }: React.ComponentProps<"li">): React.JSX.Element;
+type PaginationLinkProps = {
+    isActive?: boolean;
+    size?: "default" | "icon";
+} & React.ComponentProps<"a">;
+/** The current page gets `aria-current="page"` and the selected wash. */
+declare function PaginationLink({ className, isActive, size, ...props }: PaginationLinkProps): React.JSX.Element;
+declare function PaginationPrevious({ className, children, ...props }: React.ComponentProps<typeof PaginationLink>): React.JSX.Element;
+declare function PaginationNext({ className, children, ...props }: React.ComponentProps<typeof PaginationLink>): React.JSX.Element;
+declare function PaginationEllipsis({ className, ...props }: React.ComponentProps<"span">): React.JSX.Element;
+export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, };

package/dist/pagination.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { ChevronLeftIcon, ChevronRightIcon, MoreHorizontalIcon, } from "lucide-react";
+import { buttonVariants } from "./button.js";
+import { cn } from "./utils.js";
+/**
+ * Page links for long lists and tables. Links are plain anchors so the page
+ * lives in the URL; pass `onClick` with `href` for client-side routing.
+ */
+function Pagination({ className, ...props }) {
+    return (_jsx("nav", { "aria-label": "Pagination", "data-slot": "pagination", className: cn("mx-auto flex w-full justify-center", className), ...props }));
+}
+function PaginationContent({ className, ...props }) {
+    return (_jsx("ul", { "data-slot": "pagination-content", className: cn("flex flex-row items-center gap-1", className), ...props }));
+}
+function PaginationItem({ ...props }) {
+    return _jsx("li", { "data-slot": "pagination-item", ...props });
+}
+/** The current page gets `aria-current="page"` and the selected wash. */
+function PaginationLink({ className, isActive, size = "icon", ...props }) {
+    return (_jsx("a", { "aria-current": isActive ? "page" : undefined, "data-slot": "pagination-link", "data-active": isActive, className: cn(buttonVariants({
+            variant: isActive ? "outline" : "ghost",
+            size: size === "icon" ? "icon-sm" : "sm",
+        }), "font-medium tracking-normal normal-case tabular-nums data-[active=true]:border-primary data-[active=true]:bg-selected data-[active=true]:text-selected-foreground", className), ...props }));
+}
+function PaginationPrevious({ className, children = "Previous", ...props }) {
+    return (_jsxs(PaginationLink, { "aria-label": "Go to previous page", size: "default", className: cn("gap-1 px-2.5 sm:pl-2", className), ...props, children: [_jsx(ChevronLeftIcon, { "data-icon": "inline-start" }), _jsx("span", { className: "hidden sm:block", children: children })] }));
+}
+function PaginationNext({ className, children = "Next", ...props }) {
+    return (_jsxs(PaginationLink, { "aria-label": "Go to next page", size: "default", className: cn("gap-1 px-2.5 sm:pr-2", className), ...props, children: [_jsx("span", { className: "hidden sm:block", children: children }), _jsx(ChevronRightIcon, { "data-icon": "inline-end" })] }));
+}
+function PaginationEllipsis({ className, ...props }) {
+    return (_jsxs("span", { "aria-hidden": true, "data-slot": "pagination-ellipsis", className: cn("flex size-9 items-center justify-center text-muted-foreground", className), ...props, children: [_jsx(MoreHorizontalIcon, { className: "size-4" }), _jsx("span", { className: "sr-only", children: "More pages" })] }));
+}
+export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, };

package/dist/progress.d.ts

@@ -0,0 +1,8 @@
+import * as React from "react";
+import { Progress as ProgressPrimitive } from "radix-ui";
+/**
+ * Determinate progress (uploads, multi-step jobs). `value` is 0–100; omit
+ * it for an indeterminate state and pair the bar with a visible label.
+ */
+declare function Progress({ className, value, ...props }: React.ComponentProps<typeof ProgressPrimitive.Root>): React.JSX.Element;
+export { Progress };

package/dist/progress.js

@@ -0,0 +1,13 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { Progress as ProgressPrimitive } from "radix-ui";
+import { cn } from "./utils.js";
+/**
+ * Determinate progress (uploads, multi-step jobs). `value` is 0–100; omit
+ * it for an indeterminate state and pair the bar with a visible label.
+ */
+function Progress({ className, value, ...props }) {
+    return (_jsx(ProgressPrimitive.Root, { "data-slot": "progress", value: value, className: cn("relative h-2 w-full overflow-hidden rounded-none bg-primary/15", className), ...props, children: _jsx(ProgressPrimitive.Indicator, { "data-slot": "progress-indicator", className: "h-full w-full flex-1 bg-primary transition-transform", style: { transform: `translateX(-${100 - (value ?? 0)}%)` } }) }));
+}
+export { Progress };

package/dist/radio-group.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+import { RadioGroup as RadioGroupPrimitive } from "radix-ui";
+/**
+ * One choice from a short, visible list. Arrow keys move the selection.
+ * Use `Select` or `Combobox` when the list is long.
+ */
+declare function RadioGroup({ className, ...props }: React.ComponentProps<typeof RadioGroupPrimitive.Root>): React.JSX.Element;
+/**
+ * Radio dot. Radios stay round (a circle, per the shape rules) so they read
+ * differently from square checkboxes.
+ */
+declare function RadioGroupItem({ className, ...props }: React.ComponentProps<typeof RadioGroupPrimitive.Item>): React.JSX.Element;
+export { RadioGroup, RadioGroupItem };

package/dist/radio-group.js

@@ -0,0 +1,20 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { RadioGroup as RadioGroupPrimitive } from "radix-ui";
+import { cn } from "./utils.js";
+/**
+ * One choice from a short, visible list. Arrow keys move the selection.
+ * Use `Select` or `Combobox` when the list is long.
+ */
+function RadioGroup({ className, ...props }) {
+    return (_jsx(RadioGroupPrimitive.Root, { "data-slot": "radio-group", className: cn("grid gap-3", className), ...props }));
+}
+/**
+ * Radio dot. Radios stay round (a circle, per the shape rules) so they read
+ * differently from square checkboxes.
+ */
+function RadioGroupItem({ className, ...props }) {
+    return (_jsx(RadioGroupPrimitive.Item, { "data-slot": "radio-group-item", className: cn("peer relative flex aspect-square size-4.5 shrink-0 items-center justify-center rounded-full border border-input bg-transparent shadow-xs transition-shadow outline-none after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/30 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-2 aria-invalid:ring-destructive/20 data-checked:border-primary", className), ...props, children: _jsx(RadioGroupPrimitive.Indicator, { "data-slot": "radio-group-indicator", className: "flex items-center justify-center", children: _jsx("span", { className: "size-2 rounded-full bg-primary" }) }) }));
+}
+export { RadioGroup, RadioGroupItem };

package/dist/spinner.d.ts

@@ -0,0 +1,8 @@
+import * as React from "react";
+/**
+ * Indeterminate loading indicator for a button or small region. Announced as
+ * "Loading" by default; pass `aria-label` for something more specific. Use
+ * `Skeleton` or `TableBodySkeleton` when the layout of the result is known.
+ */
+declare function Spinner({ className, "aria-label": ariaLabel, ...props }: React.ComponentProps<"svg">): React.JSX.Element;
+export { Spinner };

package/dist/spinner.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { Loader2Icon } from "lucide-react";
+import { cn } from "./utils.js";
+/**
+ * Indeterminate loading indicator for a button or small region. Announced as
+ * "Loading" by default; pass `aria-label` for something more specific. Use
+ * `Skeleton` or `TableBodySkeleton` when the layout of the result is known.
+ */
+function Spinner({ className, "aria-label": ariaLabel = "Loading", ...props }) {
+    return (_jsx(Loader2Icon, { role: "status", "aria-label": ariaLabel, "data-slot": "spinner", className: cn("size-4 animate-spin", className), ...props }));
+}
+export { Spinner };

package/dist/switch.d.ts

@@ -0,0 +1,9 @@
+import * as React from "react";
+import { Switch as SwitchPrimitive } from "radix-ui";
+/**
+ * On/off setting that applies immediately (notifications, dark mode). Use
+ * `Checkbox` for choices submitted with a form. Square like the other
+ * primitives; checked uses the primary fill, as `Checkbox` does.
+ */
+declare function Switch({ className, ...props }: React.ComponentProps<typeof SwitchPrimitive.Root>): React.JSX.Element;
+export { Switch };

package/dist/switch.js

@@ -0,0 +1,14 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { Switch as SwitchPrimitive } from "radix-ui";
+import { cn } from "./utils.js";
+/**
+ * On/off setting that applies immediately (notifications, dark mode). Use
+ * `Checkbox` for choices submitted with a form. Square like the other
+ * primitives; checked uses the primary fill, as `Checkbox` does.
+ */
+function Switch({ className, ...props }) {
+    return (_jsx(SwitchPrimitive.Root, { "data-slot": "switch", className: cn("peer inline-flex h-5 w-9 shrink-0 items-center rounded-none border border-transparent bg-input p-0.5 shadow-xs transition-colors outline-none focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/30 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-2 aria-invalid:ring-destructive/20 data-checked:bg-primary dark:bg-input/80 dark:data-checked:bg-primary", className), ...props, children: _jsx(SwitchPrimitive.Thumb, { "data-slot": "switch-thumb", className: "pointer-events-none block size-3.5 rounded-none bg-background shadow-sm ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0 dark:data-[state=checked]:bg-primary-foreground" }) }));
+}
+export { Switch };

package/dist/table.d.ts

@@ -1,4 +1,11 @@
 import * as React from "react";
+/**
+ * Data table. The root is a `min-w-0 overflow-x-auto` scroller so nowrap
+ * columns scroll inside the table instead of widening a card or panel.
+ * While it overflows, the scroller joins the tab order so keyboard users can
+ * scroll it with the arrow keys (WCAG 2.1.1).
+ * Cell padding is `px-2` below `sm` and the original `p-3` from `sm` up.
+ */
 declare function Table({ className, ...props }: React.ComponentProps<"table">): React.JSX.Element;
 declare function TableHeader({ className, ...props }: React.ComponentProps<"thead">): React.JSX.Element;
 declare function TableBody({ className, ...props }: React.ComponentProps<"tbody">): React.JSX.Element;

package/dist/table.js

@@ -2,8 +2,37 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from "react";
 import { cn } from "./utils.js";
+/**
+ * True while the element's content is wider than its box. Re-checked when
+ * the container or its content resizes.
+ */
+function useHorizontalOverflow(ref) {
+    const [overflowing, setOverflowing] = React.useState(false);
+    React.useEffect(() => {
+        const element = ref.current;
+        if (!element || typeof ResizeObserver === "undefined")
+            return;
+        const check = () => setOverflowing(element.scrollWidth > element.clientWidth + 1);
+        check();
+        const observer = new ResizeObserver(check);
+        observer.observe(element);
+        if (element.firstElementChild)
+            observer.observe(element.firstElementChild);
+        return () => observer.disconnect();
+    }, [ref]);
+    return overflowing;
+}
+/**
+ * Data table. The root is a `min-w-0 overflow-x-auto` scroller so nowrap
+ * columns scroll inside the table instead of widening a card or panel.
+ * While it overflows, the scroller joins the tab order so keyboard users can
+ * scroll it with the arrow keys (WCAG 2.1.1).
+ * Cell padding is `px-2` below `sm` and the original `p-3` from `sm` up.
+ */
 function Table({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "table-container", className: "relative w-full overflow-x-auto", children: _jsx("table", { "data-slot": "table", className: cn("w-full caption-bottom text-sm", className), ...props }) }));
+    const containerRef = React.useRef(null);
+    const scrollable = useHorizontalOverflow(containerRef);
+    return (_jsx("div", { ref: containerRef, "data-slot": "table-container", tabIndex: scrollable ? 0 : undefined, className: "relative w-full min-w-0 max-w-full overflow-x-auto overscroll-x-contain outline-none focus-visible:ring-2 focus-visible:ring-ring/30", children: _jsx("table", { "data-slot": "table", className: cn("w-full min-w-full caption-bottom text-sm", className), ...props }) }));
 }
 function TableHeader({ className, ...props }) {
     return (_jsx("thead", { "data-slot": "table-header", className: cn("[&_tr]:border-b", className), ...props }));
@@ -18,10 +47,10 @@ function TableRow({ className, ...props }) {
     return (_jsx("tr", { "data-slot": "table-row", className: cn("border-b transition-colors hover:bg-muted/50 has-aria-expanded:bg-muted/50 data-[state=selected]:bg-selected", className), ...props }));
 }
 function TableHead({ className, ...props }) {
-    return (_jsx("th", { "data-slot": "table-head", className: cn("h-12 px-3 text-left align-middle text-xs font-medium tracking-wider whitespace-nowrap text-muted-foreground uppercase [&:has([role=checkbox])]:pr-0", className), ...props }));
+    return (_jsx("th", { "data-slot": "table-head", className: cn("h-10 px-2 text-left align-middle text-xs font-medium tracking-wider whitespace-nowrap text-muted-foreground uppercase sm:h-12 sm:px-3 [&:has([role=checkbox])]:pr-0", className), ...props }));
 }
 function TableCell({ className, ...props }) {
-    return (_jsx("td", { "data-slot": "table-cell", className: cn("p-3 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0", className), ...props }));
+    return (_jsx("td", { "data-slot": "table-cell", className: cn("px-2 py-2 align-middle whitespace-nowrap sm:p-3 [&:has([role=checkbox])]:pr-0", className), ...props }));
 }
 function TableCaption({ className, ...props }) {
     return (_jsx("caption", { "data-slot": "table-caption", className: cn("mt-4 text-sm text-muted-foreground", className), ...props }));

package/dist/tabs.d.ts

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { type VariantProps } from "class-variance-authority";
 import { Tabs as TabsPrimitive } from "radix-ui";
-import { tabsListVariants } from "./internal/tabs-styles.js";
+import { tabsListVariants, tabsTriggerVariants } from "./internal/tabs-styles.js";
 declare function Tabs({ className, orientation, ...props }: React.ComponentProps<typeof TabsPrimitive.Root>): React.JSX.Element;
 declare function TabsList({ className, variant, ...props }: React.ComponentProps<typeof TabsPrimitive.List> & VariantProps<typeof tabsListVariants>): React.JSX.Element;
 declare function TabsTrigger({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Trigger>): React.JSX.Element;
@@ -9,9 +9,12 @@ declare function TabsContent({ className, ...props }: React.ComponentProps<typeo
 /**
  * Tab-styled links for a view switcher that changes the URL. Use this, not
  * `Tabs` + `TabsTrigger asChild`, when there are no `TabsContent` panels:
- * tabs would point assistive tech at panels that don't exist.
+ * tabs would point assistive tech at panels that don't exist. Style each link
+ * with `tabsTriggerVariants()` and mark the active one with
+ * `data-state="active"` and `aria-current="page"` (the Next adapter
+ * `TabsNavLink` does this for you).
  */
 declare function TabsNav({ className, children, ...props }: React.ComponentProps<"nav"> & {
     "aria-label": string;
 }): React.JSX.Element;
-export { Tabs, TabsList, TabsTrigger, TabsContent, TabsNav, tabsListVariants };
+export { Tabs, TabsList, TabsTrigger, TabsContent, TabsNav, tabsListVariants, tabsTriggerVariants, };

package/dist/tabs.js

@@ -20,9 +20,12 @@ function TabsContent({ className, ...props }) {
 /**
  * Tab-styled links for a view switcher that changes the URL. Use this, not
  * `Tabs` + `TabsTrigger asChild`, when there are no `TabsContent` panels:
- * tabs would point assistive tech at panels that don't exist.
+ * tabs would point assistive tech at panels that don't exist. Style each link
+ * with `tabsTriggerVariants()` and mark the active one with
+ * `data-state="active"` and `aria-current="page"` (the Next adapter
+ * `TabsNavLink` does this for you).
  */
 function TabsNav({ className, children, ...props }) {
     return (_jsx("nav", { "data-slot": "tabs-nav", "data-orientation": "horizontal", className: cn("group/tabs", className), ...props, children: _jsx("div", { "data-slot": "tabs-list", "data-variant": "default", className: tabsListVariants(), children: children }) }));
 }
-export { Tabs, TabsList, TabsTrigger, TabsContent, TabsNav, tabsListVariants };
+export { Tabs, TabsList, TabsTrigger, TabsContent, TabsNav, tabsListVariants, tabsTriggerVariants, };

package/dist/theme-provider.d.ts

@@ -3,7 +3,8 @@ import { useTheme, type ThemeProviderProps as NextThemesProviderProps } from "ne
 export type ThemeProviderProps = NextThemesProviderProps & {
     /**
      * When true, pressing `d` toggles dark/light unless focus is in an editable
-     * field. Defaults to true.
+     * field or a widget with letter typeahead (such as `Select`). Defaults to
+     * true.
      */
     enableShortcut?: boolean;
 };

package/dist/theme-provider.js

@@ -2,22 +2,46 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { ThemeProvider as NextThemesProvider, useTheme, } from "next-themes";
-const EDITABLE_SELECTOR = "input, textarea, select, [contenteditable]:not([contenteditable='false'])";
-function isEditableTarget(target) {
+/**
+ * Targets where a bare `d` is input, not a shortcut: native and ARIA text
+ * fields, plus widgets with letter typeahead (Select trigger and list, menus,
+ * trees, grids).
+ */
+const KEY_CONSUMING_SELECTOR = [
+    "input",
+    "textarea",
+    "select",
+    "[contenteditable]:not([contenteditable='false'])",
+    ...[
+        "textbox",
+        "searchbox",
+        "spinbutton",
+        "combobox",
+        "listbox",
+        "menu",
+        "menubar",
+        "tree",
+        "treegrid",
+        "grid",
+    ].map((role) => `[role="${role}"]`),
+].join(", ");
+function isKeyConsumingTarget(target) {
     if (!(target instanceof HTMLElement))
         return false;
-    return Boolean(target.closest(EDITABLE_SELECTOR));
+    return Boolean(target.closest(KEY_CONSUMING_SELECTOR));
 }
 /** Listens for the optional `d` shortcut inside an existing theme context. */
 function ThemeShortcut() {
     const { resolvedTheme, setTheme } = useTheme();
     React.useEffect(() => {
         function onKeyDown(event) {
+            if (event.defaultPrevented || event.repeat || event.isComposing)
+                return;
             if (event.metaKey || event.ctrlKey || event.altKey)
                 return;
             if (event.key !== "d" && event.key !== "D")
                 return;
-            if (isEditableTarget(event.target))
+            if (isKeyConsumingTarget(event.target))
                 return;
             event.preventDefault();
             setTheme(resolvedTheme === "dark" ? "light" : "dark");

package/dist/toggle.js

@@ -4,7 +4,7 @@ import * as React from "react";
 import { cva } from "class-variance-authority";
 import { Toggle as TogglePrimitive } from "radix-ui";
 import { cn } from "./utils.js";
-const toggleVariants = cva("group/toggle inline-flex items-center justify-center gap-1.5 rounded-none text-xs font-semibold tracking-widest whitespace-nowrap uppercase transition-colors outline-none hover:border-primary hover:bg-selected hover:text-primary focus-visible:border-primary focus-visible:text-primary focus-visible:ring-[3px] focus-visible:ring-primary/30 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 aria-pressed:bg-selected aria-pressed:text-selected-foreground dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-3.5", {
+const toggleVariants = cva("group/toggle inline-flex items-center justify-center gap-1.5 rounded-none text-xs font-semibold tracking-widest whitespace-nowrap uppercase transition-colors outline-none hover:border-primary hover:bg-selected hover:text-selected-foreground focus-visible:border-primary focus-visible:text-selected-foreground focus-visible:ring-[3px] focus-visible:ring-primary/30 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 aria-pressed:bg-selected aria-pressed:text-selected-foreground dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-3.5", {
     variants: {
         variant: {
             default: "bg-transparent",

package/dist/tooltip.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+import { Tooltip as TooltipPrimitive } from "radix-ui";
+/**
+ * Shares open delay across tooltips. `Tooltip` adds one per instance, so a
+ * provider at the app root is optional; add it to tune `delayDuration`.
+ */
+declare function TooltipProvider({ delayDuration, ...props }: React.ComponentProps<typeof TooltipPrimitive.Provider>): React.JSX.Element;
+/**
+ * Short label for an icon button or truncated text. Opens on hover and
+ * keyboard focus; put essential information in visible text instead.
+ */
+declare function Tooltip({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Root>): React.JSX.Element;
+declare function TooltipTrigger({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Trigger>): React.JSX.Element;
+declare function TooltipContent({ className, sideOffset, children, ...props }: React.ComponentProps<typeof TooltipPrimitive.Content>): React.JSX.Element;
+export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };

package/dist/tooltip.js

@@ -0,0 +1,26 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Tooltip as TooltipPrimitive } from "radix-ui";
+import { cn } from "./utils.js";
+/**
+ * Shares open delay across tooltips. `Tooltip` adds one per instance, so a
+ * provider at the app root is optional; add it to tune `delayDuration`.
+ */
+function TooltipProvider({ delayDuration = 0, ...props }) {
+    return (_jsx(TooltipPrimitive.Provider, { "data-slot": "tooltip-provider", delayDuration: delayDuration, ...props }));
+}
+/**
+ * Short label for an icon button or truncated text. Opens on hover and
+ * keyboard focus; put essential information in visible text instead.
+ */
+function Tooltip({ ...props }) {
+    return (_jsx(TooltipProvider, { children: _jsx(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props }) }));
+}
+function TooltipTrigger({ ...props }) {
+    return _jsx(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
+}
+function TooltipContent({ className, sideOffset = 4, children, ...props }) {
+    return (_jsx(TooltipPrimitive.Portal, { children: _jsxs(TooltipPrimitive.Content, { "data-slot": "tooltip-content", sideOffset: sideOffset, className: cn("z-50 w-fit max-w-xs origin-(--radix-tooltip-content-transform-origin) rounded-none bg-foreground px-3 py-1.5 text-xs text-balance text-background duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-[state=instant-open]:animate-in data-[state=instant-open]:fade-in-0", className), ...props, children: [children, _jsx(TooltipPrimitive.Arrow, { className: "fill-foreground" })] }) }));
+}
+export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "atlas-react-kit",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "Shared React components and Tailwind theme for Atlas",
   "type": "module",
   "license": "MIT",
@@ -13,16 +13,33 @@
     "theme.css",
     "DESIGN_RULES.md",
     "COMPONENTS.md",
-    "NOTICE"
+    "NOTICE",
+    "skills"
   ],
   "sideEffects": [
     "**/*.css"
   ],
   "exports": {
+    "./accordion": {
+      "types": "./dist/accordion.d.ts",
+      "default": "./dist/accordion.js"
+    },
+    "./alert": {
+      "types": "./dist/alert.d.ts",
+      "default": "./dist/alert.js"
+    },
+    "./avatar": {
+      "types": "./dist/avatar.d.ts",
+      "default": "./dist/avatar.js"
+    },
     "./badge": {
       "types": "./dist/badge.d.ts",
       "default": "./dist/badge.js"
     },
+    "./breadcrumb": {
+      "types": "./dist/breadcrumb.d.ts",
+      "default": "./dist/breadcrumb.js"
+    },
     "./button": {
       "types": "./dist/button.d.ts",
       "default": "./dist/button.js"
@@ -47,10 +64,18 @@
       "types": "./dist/date-picker.d.ts",
       "default": "./dist/date-picker.js"
     },
+    "./date-time-picker": {
+      "types": "./dist/date-time-picker.d.ts",
+      "default": "./dist/date-time-picker.js"
+    },
     "./dialog": {
       "types": "./dist/dialog.d.ts",
       "default": "./dist/dialog.js"
     },
+    "./dropdown-menu": {
+      "types": "./dist/dropdown-menu.d.ts",
+      "default": "./dist/dropdown-menu.js"
+    },
     "./empty-panel": {
       "types": "./dist/empty-panel.d.ts",
       "default": "./dist/empty-panel.js"
@@ -71,10 +96,22 @@
       "types": "./dist/label.d.ts",
       "default": "./dist/label.js"
     },
+    "./pagination": {
+      "types": "./dist/pagination.d.ts",
+      "default": "./dist/pagination.js"
+    },
     "./popover": {
       "types": "./dist/popover.d.ts",
       "default": "./dist/popover.js"
     },
+    "./progress": {
+      "types": "./dist/progress.d.ts",
+      "default": "./dist/progress.js"
+    },
+    "./radio-group": {
+      "types": "./dist/radio-group.d.ts",
+      "default": "./dist/radio-group.js"
+    },
     "./select": {
       "types": "./dist/select.d.ts",
       "default": "./dist/select.js"
@@ -87,13 +124,21 @@
       "types": "./dist/skeleton.d.ts",
       "default": "./dist/skeleton.js"
     },
+    "./sonner": {
+      "types": "./dist/sonner.d.ts",
+      "default": "./dist/sonner.js"
+    },
     "./sortable-table-head": {
       "types": "./dist/sortable-table-head.d.ts",
       "default": "./dist/sortable-table-head.js"
     },
-    "./sonner": {
-      "types": "./dist/sonner.d.ts",
-      "default": "./dist/sonner.js"
+    "./spinner": {
+      "types": "./dist/spinner.d.ts",
+      "default": "./dist/spinner.js"
+    },
+    "./switch": {
+      "types": "./dist/switch.d.ts",
+      "default": "./dist/switch.js"
     },
     "./table": {
       "types": "./dist/table.d.ts",
@@ -123,10 +168,18 @@
       "types": "./dist/toggle-group.d.ts",
       "default": "./dist/toggle-group.js"
     },
+    "./tooltip": {
+      "types": "./dist/tooltip.d.ts",
+      "default": "./dist/tooltip.js"
+    },
     "./form/date-picker-field": {
       "types": "./dist/form/date-picker-field.d.ts",
       "default": "./dist/form/date-picker-field.js"
     },
+    "./form/date-time-picker-field": {
+      "types": "./dist/form/date-time-picker-field.d.ts",
+      "default": "./dist/form/date-time-picker-field.js"
+    },
     "./form/field-error": {
       "types": "./dist/form/field-error.d.ts",
       "default": "./dist/form/field-error.js"