@cognite/aura 0.3.0 → 0.3.1

package/README.md

@@ -2,6 +2,109 @@
 
 Aura exports Cognite's UI components, styles, utilities, and ESLint guidance for preserving the design system in downstream apps.
 
+## Using Aura in Fusion
+
+[`DESIGN.md`](./DESIGN.md) describes visual identity, critical interaction rules, and UX guidance for feedback, disclosure, errors, layout, and accessibility. This section covers *how to use the package* in the Fusion monorepo and host shell.
+
+### Package imports
+
+Aura ships two flavours of component import. Both resolve through the package's `exports` map — never reach into `src/`.
+
+**Per-component subpath (preferred for app code)** keeps bundles small by only pulling in what each module actually needs:
+
+```tsx
+import { Button } from '@cognite/aura/components/button';
+import { Card } from '@cognite/aura/components/card';
+import { DatePicker } from '@cognite/aura/components/date-time-pickers';
+```
+
+**Aggregate barrel** is convenient for stories, prototypes, and code that already pulls in many components. The barrel is side-effect-free (`*.css` aside) and tree-shakes well in modern bundlers, so prefer whichever style reads better at the call site:
+
+```tsx
+import { Button, Card } from '@cognite/aura/components';
+```
+
+Stylesheets and tokens are imported the same way regardless of which component-import style you use:
+
+```tsx
+import '@cognite/aura/colors.css';
+import '@cognite/aura/styles.css';
+```
+
+Canonical token sources in this repo: `src/colors.css` and `src/styles.source.css`. In consuming apps, import from the published package paths above — not from `src/` next to your app code.
+
+Do not import Aura through relative paths from another project, such as `../../../libs/aura/src/components`. Fusion resolves Aura through its package exports, so use `@cognite/aura/components` (or a per-component subpath), `@cognite/aura/colors.css`, and `@cognite/aura/styles.css`.
+
+#### Adding a new component
+
+Every Aura component must support **both** import styles. When you add a new component:
+
+1. Place its source under `src/components/ui/core/<name>/<name>.tsx`, matching the kebab-case directory used by existing components.
+2. Re-export it from the aggregate barrel in `src/components/index.ts` so `@cognite/aura/components` keeps working.
+3. Register a per-component subpath export in `libs/aura/package.json` (alphabetical order):
+
+   ```json
+   "./components/<name>": {
+     "@fusion/source": "./src/components/ui/core/<name>/<name>.tsx",
+     "import": "./dist/components/ui/core/<name>/<name>.js",
+     "types": "./dist/components/ui/core/<name>/<name>.d.ts"
+   }
+   ```
+
+   Composite components that ship as a folder (such as `date-time-pickers`) point at the folder's `index.ts` instead.
+
+The Vite build derives library entries directly from `package.json` (`entriesFromPackageJson: true`), so once both entry points are wired the dist output and types appear automatically. The two surfaces must stay in sync — consumers should be able to choose either style without missing exports.
+
+Aura uses Tailwind v4 package CSS entry points. Consuming Fusion apps should not add a `tailwind.config.js` just to wire Aura tokens or content paths; import `@cognite/aura/styles.css` and let Aura's exported CSS carry the theme and source directives. `styles.css` is the public stylesheet entry point for product consumers; in published external packages it resolves to the built Tailwind CSS output produced by Aura's build.
+
+When another Fusion library exposes Aura-styled components, give that library the same self-sourcing setup instead of pushing scan rules into every consumer:
+
+- Export a package stylesheet, for example `@cognite/example-ui/styles.css`.
+- In that stylesheet, import `@cognite/aura/styles.source.css` and source the library itself. `styles.source.css` is for package stylesheets that compose Aura's Tailwind theme/source directives before adding their own `@source` rules:
+
+  ```css
+  @import '@cognite/aura/styles.source.css';
+  @source './';
+  ```
+
+- If the target app already relies on `!important` style precedence, for example through styled-components overrides or existing Cogs components, add Tailwind's import modifier so Aura utilities can match that setup when necessary:
+
+  ```css
+  @import '@cognite/aura/styles.source.css' important;
+  @source './';
+  ```
+
+- If the library builds or previews that stylesheet directly, include `@tailwindcss/vite` in its Vite and Storybook setup.
+- Consumers should import the library stylesheet, not Aura internals. For example, an app using `@cognite/atlas-ai-react-ui` should import `@cognite/atlas-ai-react-ui/styles.css`, which can pull in Aura internally.
+- Do not add cross-project `@source "../../../libs/..."` directives or `tailwind.config.js` `content` entries for other Fusion libraries. In Tailwind v4 these app-level content arrays do not replace package-owned `@source` directives.
+
+Prefer **CVA** variants and component APIs over overriding primitive styles. Prop names, `size` values, and subcomponents are defined in:
+
+- [Aura Storybook](https://storybook-aura-23638.fusion-preview.preview.cogniteapp.com)
+- [Aura design system docs](https://docs.cognite.com/aura-design-system/get-started)
+- TypeScript types from `@cognite/aura/components`
+
+### Fusion shell integration
+
+The Fusion host shell owns global chrome that Aura does not ship: **Topbar**, **Sonner** toasts, **AlertDialog**, **Sheet** / **Drawer**, **Tabs**, **SegmentedControl**, and some patterns like **EmptyState**. These **must** still follow Aura tokens, [Interaction states](./DESIGN.md#interaction-states), and [Heuristics](./DESIGN.md#heuristics).
+
+| Concern | Fusion convention |
+| ------- | ----------------- |
+| Primary navigation | One **Topbar**; avoid duplicating global nav in content |
+| View switching | Shell **Tabs** / **SegmentedControl** when the product uses that pattern |
+| Toasts | **Sonner**, bottom-right, ~4s auto-dismiss, themed with Aura tokens |
+| Confirm destructive work | Shell **AlertDialog** or Aura **Dialog** with explicit copy |
+| Narrow viewports | Prefer shell **Drawer** / **Dialog** over compressed multi-column chrome |
+
+For local sub-app development against the live shell, use import map overrides — see the Fusion [subapp manual testing guide](../../.cursor/rules/subapp-manual-testing.mdc).
+
+### Serve and test locally
+
+```sh
+pnpm nx serve aura          # Storybook
+pnpm nx run aura:design-md-lint
+```
+
 ## Optional peer dependencies
 
 Some Aura entry points require optional peer dependencies that consumers must install themselves:
@@ -35,29 +138,27 @@ Some Aura entry points require optional peer dependencies that consumers must in
   </ChartContainer>
   ```
 
-## DESIGN.md (Google design.md linter)
+## DESIGN.md
 
-[`DESIGN.md`](./DESIGN.md) is linted with [`@google/design.md`](https://www.npmjs.com/package/@google/design.md) (listed in this package’s `devDependencies`). After `pnpm install` in the Fusion workspace, run the CLI’s `lint` subcommand—no `dlx` needed.
+[`DESIGN.md`](./DESIGN.md) describes Aura's visual identity in the [Google design.md](https://github.com/google-labs-code/design.md) format — YAML design tokens in front matter plus markdown rationale for coding agents.
 
-Published installs ship this spec at the package root; you can resolve it as `@cognite/aura/DESIGN.md` (for example with `import.meta.resolve` or your bundler’s raw import).
+Validate structure, token references, and section order with [`@google/design.md`](https://www.npmjs.com/package/@google/design.md):
 
-From `fusion/libs/aura`:
+**Recommended (from the Fusion workspace root):**
 
 ```sh
-pnpm exec design.md lint ./DESIGN.md
+pnpm nx run aura:design-md-lint
 ```
 
-From the Fusion workspace root:
+**Direct CLI (from `libs/aura`):**
 
 ```sh
-pnpm --filter @cognite/aura exec design.md lint ./DESIGN.md
+npx --yes @google/design.md lint ./DESIGN.md
 ```
 
-Or with Nx:
+Exit code `0` means the file passed (no errors). Warnings surface issues such as orphaned tokens or out-of-order sections.
 
-```sh
-nx run aura:design-md-lint
-```
+Published installs ship this spec at the package root; resolve it as `@cognite/aura/DESIGN.md` (for example with `import.meta.resolve` or your bundler's raw import).
 
 ## ESLint
 

package/dist/components/index.d.ts

@@ -31,6 +31,7 @@ export { Kbd, KbdGroup } from './ui/core/kbd/kbd';
 export { Progress } from './ui/core/progress/progress';
 export { Textarea } from './ui/core/textarea/textarea';
 export { Tabs, TabsLabel, TabsList, TabsPanel, TabsTrigger, tabsListVariants, tabsTriggerVariants, } from './ui/core/tabs/tabs';
+export { Toggle, toggleVariants } from './ui/core/toggle/toggle';
 export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupText, InputGroupInput, InputGroupTextarea, } from './ui/core/input-group/input-group';
 export { Alert, AlertTitle, AlertDescription, AlertActions, AlertButton, AlertClose, } from './ui/core/alert/alert';
 export { EmptyState, EmptyStateIcon, EmptyStateTitle, EmptyStateDescription, EmptyStateActions, } from './ui/core/empty-state/empty-state';
@@ -46,7 +47,7 @@ export { Search } from './ui/core/search/search';
 export { Popover, PopoverClose, PopoverContent, PopoverDescription, PopoverHeader, PopoverHeaderContent, PopoverSlot, PopoverTitle, PopoverTrigger, } from './ui/core/popover/popover';
 export { Pagination, PaginationContent, PaginationEllipsis, PaginationFirst, PaginationItem, PaginationLast, PaginationLink, PaginationNext, PaginationPrevious, PaginationResultsPerPage, PaginationResultsPerPageLabel, PaginationSelectTrigger, PaginationStatus, PaginationTeleport, } from './ui/core/pagination/pagination';
 export { Sources, SourcesTitle, Source } from './ui/core/sources/sources';
-export { DateRangePicker, DateTimeRangePicker, } from './ui/core/date-time-pickers';
-export type { DateRangePickerProps, DateTimeRangePickerProps, ShortcutItem, TimeFormat, } from './ui/core/date-time-pickers';
+export { DatePicker, DateRangePicker, DateTimeRangePicker, } from './ui/core/date-time-pickers';
+export type { DatePickerProps, DateRangePickerProps, DateTimeRangePickerProps, ShortcutItem, TimeFormat, } from './ui/core/date-time-pickers';
 export { PortalContainerContext } from '../lib/portal-container-context';
 export type { ComponentMeta, ComponentStatusType } from '../lib/types';

package/dist/components/index.js

@@ -1,6 +1,6 @@
 import { Accordion as r, AccordionContent as e, AccordionItem as n, AccordionTrigger as a } from "./ui/core/accordion/accordion.js";
 import { ActionToolbar as i, ActionToolbarAction as m, ActionToolbarActionClear as l, ActionToolbarActions as u, ActionToolbarPrimaryAction as d, ActionToolbarSelection as C, ActionToolbarSelectionSummary as c } from "./ui/core/action-toolbar/action-toolbar.js";
-import { Card as g, CardActions as I, CardContent as P, CardDescription as T, CardFooter as x, CardFooterEnd as b, CardFooterStart as S, CardHeader as f, CardHeaderCenter as B, CardHeaderEnd as A, CardHeaderStart as D, CardTitle as M } from "./ui/core/card/card.js";
+import { Card as g, CardActions as I, CardContent as P, CardDescription as x, CardFooter as T, CardFooterEnd as b, CardFooterStart as S, CardHeader as f, CardHeaderCenter as B, CardHeaderEnd as D, CardHeaderStart as A, CardTitle as M } from "./ui/core/card/card.js";
 import { Button as G, buttonVariants as L } from "./ui/core/button/button.js";
 import { ButtonGroup as k, ButtonGroupSeparator as H, ButtonGroupText as R, buttonGroupVariants as h } from "./ui/core/button-group/button-group.js";
 import { Avatar as E, AvatarFallback as V, AvatarIcon as F, AvatarImage as K } from "./ui/core/avatar/avatar.js";
@@ -13,14 +13,14 @@ import { Shimmer as to } from "./ui/core/shimmer/shimmer.js";
 import { CodeBlock as eo, CodeBlockCollapseButton as no, CodeBlockCopyButton as ao, CodeBlockDownloadButton as po } from "./ui/core/code-block/code-block.js";
 import { Separator as mo } from "./ui/core/separator/separator.js";
 import { Tooltip as uo, TooltipContent as Co, TooltipProvider as co, TooltipTrigger as so } from "./ui/core/tooltip/tooltip.js";
-import { Tool as Io, ToolContent as Po, ToolHeader as To, ToolInput as xo, ToolOutput as bo } from "./ui/core/tool/tool.js";
-import { DropdownMenu as fo, DropdownMenuCheckboxItem as Bo, DropdownMenuContent as Ao, DropdownMenuGroup as Do, DropdownMenuHeader as Mo, DropdownMenuItem as vo, DropdownMenuLabel as Go, DropdownMenuPortal as Lo, DropdownMenuRadioGroup as wo, DropdownMenuRadioItem as ko, DropdownMenuSectionLabel as Ho, DropdownMenuSeparator as Ro, DropdownMenuShortcut as ho, DropdownMenuSub as yo, DropdownMenuSubContent as Eo, DropdownMenuSubTrigger as Vo, DropdownMenuTrigger as Fo } from "./ui/core/dropdown-menu/dropdown-menu.js";
+import { Tool as Io, ToolContent as Po, ToolHeader as xo, ToolInput as To, ToolOutput as bo } from "./ui/core/tool/tool.js";
+import { DropdownMenu as fo, DropdownMenuCheckboxItem as Bo, DropdownMenuContent as Do, DropdownMenuGroup as Ao, DropdownMenuHeader as Mo, DropdownMenuItem as vo, DropdownMenuLabel as Go, DropdownMenuPortal as Lo, DropdownMenuRadioGroup as wo, DropdownMenuRadioItem as ko, DropdownMenuSectionLabel as Ho, DropdownMenuSeparator as Ro, DropdownMenuShortcut as ho, DropdownMenuSub as yo, DropdownMenuSubContent as Eo, DropdownMenuSubTrigger as Vo, DropdownMenuTrigger as Fo } from "./ui/core/dropdown-menu/dropdown-menu.js";
 import { RadioGroup as Oo, RadioGroupItem as No, RadioGroupItemControl as Qo, RadioGroupItemDescription as Uo, RadioGroupItemLabel as jo } from "./ui/core/radio-group/radio-group.js";
 import { Badge as zo, badgeVariants as Jo } from "./ui/core/badge/badge.js";
 import { Banner as Xo, BannerAction as Yo, BannerActions as Zo, BannerClose as _o, BannerIcon as $o, BannerStatus as ot, BannerTitle as tt } from "./ui/core/banner/banner.js";
 import { Breadcrumb as et, BreadcrumbEllipsis as nt, BreadcrumbEllipsisButton as at, BreadcrumbItem as pt, BreadcrumbLink as it, BreadcrumbList as mt, BreadcrumbPage as lt, BreadcrumbPageButton as ut, BreadcrumbSeparator as dt } from "./ui/core/breadcrumb/breadcrumb.js";
-import { Topbar as ct, TopbarAction as st, TopbarBreadcrumbs as gt, TopbarCenter as It, TopbarIcon as Pt, TopbarLeft as Tt, TopbarMetadata as xt, TopbarRight as bt, TopbarThemeSwitcher as St } from "./ui/core/topbar/topbar.js";
-import { Collapsible as Bt, CollapsibleContent as At, CollapsibleTrigger as Dt } from "./ui/core/collapsible/collapsible.js";
+import { Topbar as ct, TopbarAction as st, TopbarBreadcrumbs as gt, TopbarCenter as It, TopbarIcon as Pt, TopbarLeft as xt, TopbarMetadata as Tt, TopbarRight as bt, TopbarThemeSwitcher as St } from "./ui/core/topbar/topbar.js";
+import { Collapsible as Bt, CollapsibleContent as Dt, CollapsibleTrigger as At } from "./ui/core/collapsible/collapsible.js";
 import { HoverCard as vt, HoverCardContent as Gt, HoverCardTrigger as Lt } from "./ui/core/hover-card/hover-card.js";
 import { Select as kt, SelectContent as Ht, SelectGroup as Rt, SelectItem as ht, SelectLabel as yt, SelectScrollDownButton as Et, SelectScrollUpButton as Vt, SelectSeparator as Ft, SelectTrigger as Kt, SelectValue as Ot } from "./ui/core/select/select.js";
 import { SegmentedControl as Qt, SegmentedControlButton as Ut, SegmentedControlContent as jt, SegmentedControlList as qt, segmentedControlButtonVariants as zt, segmentedControlListVariants as Jt } from "./ui/core/segmented-control/segmented-control.js";
@@ -31,26 +31,28 @@ import { Kbd as tr, KbdGroup as rr } from "./ui/core/kbd/kbd.js";
 import { Progress as nr } from "./ui/core/progress/progress.js";
 import { Textarea as pr } from "./ui/core/textarea/textarea.js";
 import { Tabs as mr, TabsLabel as lr, TabsList as ur, TabsPanel as dr, TabsTrigger as Cr, tabsListVariants as cr, tabsTriggerVariants as sr } from "./ui/core/tabs/tabs.js";
-import { InputGroup as Ir, InputGroupAddon as Pr, InputGroupButton as Tr, InputGroupInput as xr, InputGroupText as br, InputGroupTextarea as Sr } from "./ui/core/input-group/input-group.js";
-import { Alert as Br, AlertActions as Ar, AlertButton as Dr, AlertClose as Mr, AlertDescription as vr, AlertTitle as Gr } from "./ui/core/alert/alert.js";
-import { EmptyState as wr, EmptyStateActions as kr, EmptyStateDescription as Hr, EmptyStateIcon as Rr, EmptyStateTitle as hr } from "./ui/core/empty-state/empty-state.js";
-import { Message as Er, MessageAction as Vr, MessageActions as Fr, MessageContent as Kr, MessageResponse as Or } from "./ui/core/message/message.js";
-import { PromptInput as Qr, PromptInputActionMenu as Ur, PromptInputActionMenuContent as jr, PromptInputActionMenuItem as qr, PromptInputActionMenuTrigger as zr, PromptInputBody as Jr, PromptInputButton as Wr, PromptInputCommand as Xr, PromptInputCommandEmpty as Yr, PromptInputCommandGroup as Zr, PromptInputCommandInput as _r, PromptInputCommandItem as $r, PromptInputCommandList as oe, PromptInputCommandSeparator as te, PromptInputFooter as re, PromptInputHeader as ee, PromptInputHoverCard as ne, PromptInputHoverCardContent as ae, PromptInputHoverCardTrigger as pe, PromptInputModelSelect as ie, PromptInputModelSelectContent as me, PromptInputModelSelectItem as le, PromptInputModelSelectTrigger as ue, PromptInputModelSelectValue as de, PromptInputProvider as Ce, PromptInputSubmit as ce, PromptInputTab as se, PromptInputTabBody as ge, PromptInputTabItem as Ie, PromptInputTabLabel as Pe, PromptInputTabsList as Te, PromptInputTextarea as xe, PromptInputTools as be, usePromptInputController as Se } from "./ui/core/prompt-input/prompt-input.js";
-import { Dialog as Be, DialogClose as Ae, DialogContent as De, DialogDescription as Me, DialogFooter as ve, DialogHeader as Ge, DialogOverlay as Le, DialogPortal as we, DialogTitle as ke, DialogTrigger as He } from "./ui/core/dialog/dialog.js";
-import { Command as he, CommandDialog as ye, CommandEmpty as Ee, CommandGroup as Ve, CommandInput as Fe, CommandItem as Ke, CommandList as Oe, CommandSeparator as Ne, CommandShortcut as Qe } from "./ui/core/command/command.js";
-import { Count as je, countVariants as qe } from "./ui/core/count/count.js";
-import { InlineCitation as Je, InlineCitationCard as We, InlineCitationCardBody as Xe, InlineCitationCardTrigger as Ye, InlineCitationGroup as Ze, InlineCitationLink as _e, InlineCitationQuote as $e, InlineCitationSource as on, InlineCitationText as tn } from "./ui/core/inline-citation/inline-citation.js";
-import { Reasoning as en, ReasoningContent as nn, ReasoningHeader as an, ReasoningItem as pn } from "./ui/core/reasoning/reasoning.js";
-import { ScrollArea as ln, ScrollBar as un } from "./ui/core/scroll-area/scroll-area.js";
-import { Search as Cn } from "./ui/core/search/search.js";
-import { Popover as sn, PopoverClose as gn, PopoverContent as In, PopoverDescription as Pn, PopoverHeader as Tn, PopoverHeaderContent as xn, PopoverSlot as bn, PopoverTitle as Sn, PopoverTrigger as fn } from "./ui/core/popover/popover.js";
-import { Pagination as An, PaginationContent as Dn, PaginationEllipsis as Mn, PaginationFirst as vn, PaginationItem as Gn, PaginationLast as Ln, PaginationLink as wn, PaginationNext as kn, PaginationPrevious as Hn, PaginationResultsPerPage as Rn, PaginationResultsPerPageLabel as hn, PaginationSelectTrigger as yn, PaginationStatus as En } from "./ui/core/pagination/pagination.js";
-import { Source as Fn, Sources as Kn, SourcesTitle as On } from "./ui/core/sources/sources.js";
-import { PortalContainerContext as Qn } from "../lib/portal-container-context.js";
-import { DateRangePicker as jn } from "./ui/core/date-time-pickers/date-range-picker/date-range-picker.js";
-import { DateTimeRangePicker as zn } from "./ui/core/date-time-pickers/date-time-range-picker/date-time-range-picker.js";
-import { PaginationTeleport as Wn } from "./ui/core/pagination/pagination-teleport.js";
-import { toast as Yn } from "sonner";
+import { Toggle as Ir, toggleVariants as Pr } from "./ui/core/toggle/toggle.js";
+import { InputGroup as Tr, InputGroupAddon as br, InputGroupButton as Sr, InputGroupInput as fr, InputGroupText as Br, InputGroupTextarea as Dr } from "./ui/core/input-group/input-group.js";
+import { Alert as Mr, AlertActions as vr, AlertButton as Gr, AlertClose as Lr, AlertDescription as wr, AlertTitle as kr } from "./ui/core/alert/alert.js";
+import { EmptyState as Rr, EmptyStateActions as hr, EmptyStateDescription as yr, EmptyStateIcon as Er, EmptyStateTitle as Vr } from "./ui/core/empty-state/empty-state.js";
+import { Message as Kr, MessageAction as Or, MessageActions as Nr, MessageContent as Qr, MessageResponse as Ur } from "./ui/core/message/message.js";
+import { PromptInput as qr, PromptInputActionMenu as zr, PromptInputActionMenuContent as Jr, PromptInputActionMenuItem as Wr, PromptInputActionMenuTrigger as Xr, PromptInputBody as Yr, PromptInputButton as Zr, PromptInputCommand as _r, PromptInputCommandEmpty as $r, PromptInputCommandGroup as oe, PromptInputCommandInput as te, PromptInputCommandItem as re, PromptInputCommandList as ee, PromptInputCommandSeparator as ne, PromptInputFooter as ae, PromptInputHeader as pe, PromptInputHoverCard as ie, PromptInputHoverCardContent as me, PromptInputHoverCardTrigger as le, PromptInputModelSelect as ue, PromptInputModelSelectContent as de, PromptInputModelSelectItem as Ce, PromptInputModelSelectTrigger as ce, PromptInputModelSelectValue as se, PromptInputProvider as ge, PromptInputSubmit as Ie, PromptInputTab as Pe, PromptInputTabBody as xe, PromptInputTabItem as Te, PromptInputTabLabel as be, PromptInputTabsList as Se, PromptInputTextarea as fe, PromptInputTools as Be, usePromptInputController as De } from "./ui/core/prompt-input/prompt-input.js";
+import { Dialog as Me, DialogClose as ve, DialogContent as Ge, DialogDescription as Le, DialogFooter as we, DialogHeader as ke, DialogOverlay as He, DialogPortal as Re, DialogTitle as he, DialogTrigger as ye } from "./ui/core/dialog/dialog.js";
+import { Command as Ve, CommandDialog as Fe, CommandEmpty as Ke, CommandGroup as Oe, CommandInput as Ne, CommandItem as Qe, CommandList as Ue, CommandSeparator as je, CommandShortcut as qe } from "./ui/core/command/command.js";
+import { Count as Je, countVariants as We } from "./ui/core/count/count.js";
+import { InlineCitation as Ye, InlineCitationCard as Ze, InlineCitationCardBody as _e, InlineCitationCardTrigger as $e, InlineCitationGroup as on, InlineCitationLink as tn, InlineCitationQuote as rn, InlineCitationSource as en, InlineCitationText as nn } from "./ui/core/inline-citation/inline-citation.js";
+import { Reasoning as pn, ReasoningContent as mn, ReasoningHeader as ln, ReasoningItem as un } from "./ui/core/reasoning/reasoning.js";
+import { ScrollArea as Cn, ScrollBar as cn } from "./ui/core/scroll-area/scroll-area.js";
+import { Search as gn } from "./ui/core/search/search.js";
+import { Popover as Pn, PopoverClose as xn, PopoverContent as Tn, PopoverDescription as bn, PopoverHeader as Sn, PopoverHeaderContent as fn, PopoverSlot as Bn, PopoverTitle as Dn, PopoverTrigger as An } from "./ui/core/popover/popover.js";
+import { Pagination as vn, PaginationContent as Gn, PaginationEllipsis as Ln, PaginationFirst as wn, PaginationItem as kn, PaginationLast as Hn, PaginationLink as Rn, PaginationNext as hn, PaginationPrevious as yn, PaginationResultsPerPage as En, PaginationResultsPerPageLabel as Vn, PaginationSelectTrigger as Fn, PaginationStatus as Kn } from "./ui/core/pagination/pagination.js";
+import { Source as Nn, Sources as Qn, SourcesTitle as Un } from "./ui/core/sources/sources.js";
+import { PortalContainerContext as qn } from "../lib/portal-container-context.js";
+import { DatePicker as Jn } from "./ui/core/date-time-pickers/date-picker/date-picker.js";
+import { DateRangePicker as Xn } from "./ui/core/date-time-pickers/date-range-picker/date-range-picker.js";
+import { DateTimeRangePicker as Zn } from "./ui/core/date-time-pickers/date-time-range-picker/date-time-range-picker.js";
+import { PaginationTeleport as $n } from "./ui/core/pagination/pagination-teleport.js";
+import { toast as ta } from "sonner";
 export {
   r as Accordion,
   e as AccordionContent,
@@ -63,12 +65,12 @@ export {
   d as ActionToolbarPrimaryAction,
   C as ActionToolbarSelection,
   c as ActionToolbarSelectionSummary,
-  Br as Alert,
-  Ar as AlertActions,
-  Dr as AlertButton,
-  Mr as AlertClose,
-  vr as AlertDescription,
-  Gr as AlertTitle,
+  Mr as Alert,
+  vr as AlertActions,
+  Gr as AlertButton,
+  Lr as AlertClose,
+  wr as AlertDescription,
+  kr as AlertTitle,
   E as Avatar,
   V as AvatarFallback,
   F as AvatarIcon,
@@ -97,14 +99,14 @@ export {
   g as Card,
   I as CardActions,
   P as CardContent,
-  T as CardDescription,
-  x as CardFooter,
+  x as CardDescription,
+  T as CardFooter,
   b as CardFooterEnd,
   S as CardFooterStart,
   f as CardHeader,
   B as CardHeaderCenter,
-  A as CardHeaderEnd,
-  D as CardHeaderStart,
+  D as CardHeaderEnd,
+  A as CardHeaderStart,
   M as CardTitle,
   U as CheckboxGroup,
   j as CheckboxItem,
@@ -117,34 +119,35 @@ export {
   ao as CodeBlockCopyButton,
   po as CodeBlockDownloadButton,
   Bt as Collapsible,
-  At as CollapsibleContent,
-  Dt as CollapsibleTrigger,
-  he as Command,
-  ye as CommandDialog,
-  Ee as CommandEmpty,
-  Ve as CommandGroup,
-  Fe as CommandInput,
-  Ke as CommandItem,
-  Oe as CommandList,
-  Ne as CommandSeparator,
-  Qe as CommandShortcut,
-  je as Count,
-  jn as DateRangePicker,
-  zn as DateTimeRangePicker,
-  Be as Dialog,
-  Ae as DialogClose,
-  De as DialogContent,
-  Me as DialogDescription,
-  ve as DialogFooter,
-  Ge as DialogHeader,
-  Le as DialogOverlay,
-  we as DialogPortal,
-  ke as DialogTitle,
-  He as DialogTrigger,
+  Dt as CollapsibleContent,
+  At as CollapsibleTrigger,
+  Ve as Command,
+  Fe as CommandDialog,
+  Ke as CommandEmpty,
+  Oe as CommandGroup,
+  Ne as CommandInput,
+  Qe as CommandItem,
+  Ue as CommandList,
+  je as CommandSeparator,
+  qe as CommandShortcut,
+  Je as Count,
+  Jn as DatePicker,
+  Xn as DateRangePicker,
+  Zn as DateTimeRangePicker,
+  Me as Dialog,
+  ve as DialogClose,
+  Ge as DialogContent,
+  Le as DialogDescription,
+  we as DialogFooter,
+  ke as DialogHeader,
+  He as DialogOverlay,
+  Re as DialogPortal,
+  he as DialogTitle,
+  ye as DialogTrigger,
   fo as DropdownMenu,
   Bo as DropdownMenuCheckboxItem,
-  Ao as DropdownMenuContent,
-  Do as DropdownMenuGroup,
+  Do as DropdownMenuContent,
+  Ao as DropdownMenuGroup,
   Mo as DropdownMenuHeader,
   vo as DropdownMenuItem,
   Go as DropdownMenuLabel,
@@ -158,110 +161,110 @@ export {
   Eo as DropdownMenuSubContent,
   Vo as DropdownMenuSubTrigger,
   Fo as DropdownMenuTrigger,
-  wr as EmptyState,
-  kr as EmptyStateActions,
-  Hr as EmptyStateDescription,
-  Rr as EmptyStateIcon,
-  hr as EmptyStateTitle,
+  Rr as EmptyState,
+  hr as EmptyStateActions,
+  yr as EmptyStateDescription,
+  Er as EmptyStateIcon,
+  Vr as EmptyStateTitle,
   Z as HelperText,
   vt as HoverCard,
   Gt as HoverCardContent,
   Lt as HoverCardTrigger,
-  Je as InlineCitation,
-  We as InlineCitationCard,
-  Xe as InlineCitationCardBody,
-  Ye as InlineCitationCardTrigger,
-  Ze as InlineCitationGroup,
-  _e as InlineCitationLink,
-  $e as InlineCitationQuote,
-  on as InlineCitationSource,
-  tn as InlineCitationText,
+  Ye as InlineCitation,
+  Ze as InlineCitationCard,
+  _e as InlineCitationCardBody,
+  $e as InlineCitationCardTrigger,
+  on as InlineCitationGroup,
+  tn as InlineCitationLink,
+  rn as InlineCitationQuote,
+  en as InlineCitationSource,
+  nn as InlineCitationText,
   $t as Input,
-  Ir as InputGroup,
-  Pr as InputGroupAddon,
-  Tr as InputGroupButton,
-  xr as InputGroupInput,
-  br as InputGroupText,
-  Sr as InputGroupTextarea,
+  Tr as InputGroup,
+  br as InputGroupAddon,
+  Sr as InputGroupButton,
+  fr as InputGroupInput,
+  Br as InputGroupText,
+  Dr as InputGroupTextarea,
   tr as Kbd,
   rr as KbdGroup,
   N as Label,
   $ as Loader,
-  Er as Message,
-  Vr as MessageAction,
-  Fr as MessageActions,
-  Kr as MessageContent,
-  Or as MessageResponse,
-  An as Pagination,
-  Dn as PaginationContent,
-  Mn as PaginationEllipsis,
-  vn as PaginationFirst,
-  Gn as PaginationItem,
-  Ln as PaginationLast,
-  wn as PaginationLink,
-  kn as PaginationNext,
-  Hn as PaginationPrevious,
-  Rn as PaginationResultsPerPage,
-  hn as PaginationResultsPerPageLabel,
-  yn as PaginationSelectTrigger,
-  En as PaginationStatus,
-  Wn as PaginationTeleport,
-  sn as Popover,
-  gn as PopoverClose,
-  In as PopoverContent,
-  Pn as PopoverDescription,
-  Tn as PopoverHeader,
-  xn as PopoverHeaderContent,
-  bn as PopoverSlot,
-  Sn as PopoverTitle,
-  fn as PopoverTrigger,
-  Qn as PortalContainerContext,
+  Kr as Message,
+  Or as MessageAction,
+  Nr as MessageActions,
+  Qr as MessageContent,
+  Ur as MessageResponse,
+  vn as Pagination,
+  Gn as PaginationContent,
+  Ln as PaginationEllipsis,
+  wn as PaginationFirst,
+  kn as PaginationItem,
+  Hn as PaginationLast,
+  Rn as PaginationLink,
+  hn as PaginationNext,
+  yn as PaginationPrevious,
+  En as PaginationResultsPerPage,
+  Vn as PaginationResultsPerPageLabel,
+  Fn as PaginationSelectTrigger,
+  Kn as PaginationStatus,
+  $n as PaginationTeleport,
+  Pn as Popover,
+  xn as PopoverClose,
+  Tn as PopoverContent,
+  bn as PopoverDescription,
+  Sn as PopoverHeader,
+  fn as PopoverHeaderContent,
+  Bn as PopoverSlot,
+  Dn as PopoverTitle,
+  An as PopoverTrigger,
+  qn as PortalContainerContext,
   nr as Progress,
-  Qr as PromptInput,
-  Ur as PromptInputActionMenu,
-  jr as PromptInputActionMenuContent,
-  qr as PromptInputActionMenuItem,
-  zr as PromptInputActionMenuTrigger,
-  Jr as PromptInputBody,
-  Wr as PromptInputButton,
-  Xr as PromptInputCommand,
-  Yr as PromptInputCommandEmpty,
-  Zr as PromptInputCommandGroup,
-  _r as PromptInputCommandInput,
-  $r as PromptInputCommandItem,
-  oe as PromptInputCommandList,
-  te as PromptInputCommandSeparator,
-  re as PromptInputFooter,
-  ee as PromptInputHeader,
-  ne as PromptInputHoverCard,
-  ae as PromptInputHoverCardContent,
-  pe as PromptInputHoverCardTrigger,
-  ie as PromptInputModelSelect,
-  me as PromptInputModelSelectContent,
-  le as PromptInputModelSelectItem,
-  ue as PromptInputModelSelectTrigger,
-  de as PromptInputModelSelectValue,
-  Ce as PromptInputProvider,
-  ce as PromptInputSubmit,
-  se as PromptInputTab,
-  ge as PromptInputTabBody,
-  Ie as PromptInputTabItem,
-  Pe as PromptInputTabLabel,
-  Te as PromptInputTabsList,
-  xe as PromptInputTextarea,
-  be as PromptInputTools,
+  qr as PromptInput,
+  zr as PromptInputActionMenu,
+  Jr as PromptInputActionMenuContent,
+  Wr as PromptInputActionMenuItem,
+  Xr as PromptInputActionMenuTrigger,
+  Yr as PromptInputBody,
+  Zr as PromptInputButton,
+  _r as PromptInputCommand,
+  $r as PromptInputCommandEmpty,
+  oe as PromptInputCommandGroup,
+  te as PromptInputCommandInput,
+  re as PromptInputCommandItem,
+  ee as PromptInputCommandList,
+  ne as PromptInputCommandSeparator,
+  ae as PromptInputFooter,
+  pe as PromptInputHeader,
+  ie as PromptInputHoverCard,
+  me as PromptInputHoverCardContent,
+  le as PromptInputHoverCardTrigger,
+  ue as PromptInputModelSelect,
+  de as PromptInputModelSelectContent,
+  Ce as PromptInputModelSelectItem,
+  ce as PromptInputModelSelectTrigger,
+  se as PromptInputModelSelectValue,
+  ge as PromptInputProvider,
+  Ie as PromptInputSubmit,
+  Pe as PromptInputTab,
+  xe as PromptInputTabBody,
+  Te as PromptInputTabItem,
+  be as PromptInputTabLabel,
+  Se as PromptInputTabsList,
+  fe as PromptInputTextarea,
+  Be as PromptInputTools,
   Oo as RadioGroup,
   No as RadioGroupItem,
   Qo as RadioGroupItemControl,
   Uo as RadioGroupItemDescription,
   jo as RadioGroupItemLabel,
-  en as Reasoning,
-  nn as ReasoningContent,
-  an as ReasoningHeader,
-  pn as ReasoningItem,
-  ln as ScrollArea,
-  un as ScrollBar,
-  Cn as Search,
+  pn as Reasoning,
+  mn as ReasoningContent,
+  ln as ReasoningHeader,
+  un as ReasoningItem,
+  Cn as ScrollArea,
+  cn as ScrollBar,
+  gn as Search,
   Qt as SegmentedControl,
   Ut as SegmentedControlButton,
   jt as SegmentedControlContent,
@@ -279,9 +282,9 @@ export {
   mo as Separator,
   to as Shimmer,
   Xt as Skeleton,
-  Fn as Source,
-  Kn as Sources,
-  On as SourcesTitle,
+  Nn as Source,
+  Qn as Sources,
+  Un as SourcesTitle,
   mr as Tabs,
   lr as TabsLabel,
   ur as TabsList,
@@ -289,10 +292,11 @@ export {
   Cr as TabsTrigger,
   pr as Textarea,
   Zt as Toaster,
+  Ir as Toggle,
   Io as Tool,
   Po as ToolContent,
-  To as ToolHeader,
-  xo as ToolInput,
+  xo as ToolHeader,
+  To as ToolInput,
   bo as ToolOutput,
   uo as Tooltip,
   Co as TooltipContent,
@@ -303,18 +307,19 @@ export {
   gt as TopbarBreadcrumbs,
   It as TopbarCenter,
   Pt as TopbarIcon,
-  Tt as TopbarLeft,
-  xt as TopbarMetadata,
+  xt as TopbarLeft,
+  Tt as TopbarMetadata,
   bt as TopbarRight,
   St as TopbarThemeSwitcher,
   Jo as badgeVariants,
   h as buttonGroupVariants,
   L as buttonVariants,
-  qe as countVariants,
+  We as countVariants,
   zt as segmentedControlButtonVariants,
   Jt as segmentedControlListVariants,
   cr as tabsListVariants,
   sr as tabsTriggerVariants,
-  Yn as toast,
-  Se as usePromptInputController
+  ta as toast,
+  Pr as toggleVariants,
+  De as usePromptInputController
 };

package/dist/components/ui/core/action-toolbar/action-toolbar.js

@@ -1,5 +1,5 @@
 import { jsx as i, jsxs as m } from "react/jsx-runtime";
-import { forwardRef as e, useMemo as b, useContext as A, createContext as x } from "react";
+import { createContext as b, forwardRef as e, useMemo as A, useContext as x } from "react";
 import { IconX as T } from "@tabler/icons-react";
 import { cva as y } from "class-variance-authority";
 import { cn as s } from "../../../../lib/utils.js";
@@ -18,11 +18,11 @@ const v = y(
       width: "full"
     }
   }
-), p = x({
+), p = b({
   selectedCount: void 0
 }), k = e(
   ({ className: t, width: a, role: n = "toolbar", selectedCount: o, ...r }, l) => {
-    const c = typeof o == "number" && o === 0, d = b(() => ({ selectedCount: o }), [o]);
+    const c = typeof o == "number" && o === 0, d = A(() => ({ selectedCount: o }), [o]);
     return c ? null : /* @__PURE__ */ i(g, { delayDuration: 0, children: /* @__PURE__ */ i(p.Provider, { value: d, children: /* @__PURE__ */ i(
       "div",
       {
@@ -51,7 +51,7 @@ const C = e(
 C.displayName = "ActionToolbarSelection";
 const S = e(
   ({ className: t, count: a, label: n = "selected", children: o, ...r }, l) => {
-    const { selectedCount: c } = A(p), d = a ?? c;
+    const { selectedCount: c } = x(p), d = a ?? c;
     return /* @__PURE__ */ i(
       "div",
       {