@ciridae/ui 0.2.5 → 0.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (150) hide show
  1. package/dist/components/ui/app-shell-page.js +1 -1
  2. package/dist/components/ui/app-shell.js +1 -1
  3. package/dist/components/ui/button-group.js +1 -1
  4. package/dist/components/ui/card.js +1 -1
  5. package/dist/components/ui/ciridae-ui-provider.d.ts +8 -0
  6. package/dist/components/ui/ciridae-ui-provider.js +14 -0
  7. package/dist/components/ui/color-theme.d.ts +1 -0
  8. package/dist/components/ui/color-theme.js +1 -0
  9. package/dist/components/ui/combobox.js +2 -2
  10. package/dist/components/ui/command.js +1 -1
  11. package/dist/components/ui/context-menu.js +2 -2
  12. package/dist/components/ui/data-table-grid.js +1 -1
  13. package/dist/components/ui/data-table.js +1 -1
  14. package/dist/components/ui/dropdown-menu.js +2 -2
  15. package/dist/components/ui/input-group.js +1 -1
  16. package/dist/components/ui/item.d.ts +1 -1
  17. package/dist/components/ui/menubar.js +2 -2
  18. package/dist/components/ui/page-header.js +1 -1
  19. package/dist/components/ui/registry-docs-api.js +1 -1
  20. package/dist/components/ui/registry-docs-showcase.js +1 -1
  21. package/dist/components/ui/select.js +1 -1
  22. package/dist/components/ui/sidebar/group.js +2 -2
  23. package/dist/components/ui/sidebar/menu.js +3 -3
  24. package/dist/components/ui/sidebar-account-menu-theme.js +2 -2
  25. package/dist/components/ui/sidebar-account-menu.js +3 -3
  26. package/dist/styled-system/styles.css +393 -61
  27. package/dist/styles.css +2 -0
  28. package/package.json +7 -260
  29. package/dist/components/agentic/agent-card.d.ts +0 -28
  30. package/dist/components/agentic/agent-card.js +0 -27
  31. package/dist/components/agentic/agent-composer.d.ts +0 -44
  32. package/dist/components/agentic/agent-composer.js +0 -104
  33. package/dist/components/agentic/agent-context.d.ts +0 -28
  34. package/dist/components/agentic/agent-context.js +0 -102
  35. package/dist/components/agentic/agent-plan.d.ts +0 -27
  36. package/dist/components/agentic/agent-plan.js +0 -43
  37. package/dist/components/agentic/agent-queue.d.ts +0 -46
  38. package/dist/components/agentic/agent-queue.js +0 -53
  39. package/dist/components/agentic/agent-task.d.ts +0 -16
  40. package/dist/components/agentic/agent-task.js +0 -20
  41. package/dist/components/agentic/approval-request.d.ts +0 -24
  42. package/dist/components/agentic/approval-request.js +0 -57
  43. package/dist/components/agentic/artifact.d.ts +0 -24
  44. package/dist/components/agentic/artifact.js +0 -72
  45. package/dist/components/agentic/attachments.d.ts +0 -124
  46. package/dist/components/agentic/attachments.js +0 -595
  47. package/dist/components/agentic/audio-player.d.ts +0 -16
  48. package/dist/components/agentic/audio-player.js +0 -21
  49. package/dist/components/agentic/canvas.d.ts +0 -10
  50. package/dist/components/agentic/canvas.js +0 -22
  51. package/dist/components/agentic/clipboard.d.ts +0 -2
  52. package/dist/components/agentic/clipboard.js +0 -12
  53. package/dist/components/agentic/code-block.d.ts +0 -43
  54. package/dist/components/agentic/code-block.js +0 -92
  55. package/dist/components/agentic/commit.d.ts +0 -57
  56. package/dist/components/agentic/commit.js +0 -85
  57. package/dist/components/agentic/connection.d.ts +0 -3
  58. package/dist/components/agentic/connection.js +0 -8
  59. package/dist/components/agentic/controls.d.ts +0 -6
  60. package/dist/components/agentic/controls.js +0 -7
  61. package/dist/components/agentic/conversation.d.ts +0 -25
  62. package/dist/components/agentic/conversation.js +0 -56
  63. package/dist/components/agentic/edge.d.ts +0 -8
  64. package/dist/components/agentic/edge.js +0 -65
  65. package/dist/components/agentic/effort-selector.d.ts +0 -43
  66. package/dist/components/agentic/effort-selector.js +0 -47
  67. package/dist/components/agentic/environment-variables.d.ts +0 -32
  68. package/dist/components/agentic/environment-variables.js +0 -66
  69. package/dist/components/agentic/file-tree.d.ts +0 -24
  70. package/dist/components/agentic/file-tree.js +0 -56
  71. package/dist/components/agentic/image.d.ts +0 -9
  72. package/dist/components/agentic/image.js +0 -11
  73. package/dist/components/agentic/inline-citation.d.ts +0 -40
  74. package/dist/components/agentic/inline-citation.js +0 -111
  75. package/dist/components/agentic/jsx-preview.d.ts +0 -19
  76. package/dist/components/agentic/jsx-preview.js +0 -34
  77. package/dist/components/agentic/message-branch.d.ts +0 -20
  78. package/dist/components/agentic/message-branch.js +0 -83
  79. package/dist/components/agentic/message-response.css +0 -265
  80. package/dist/components/agentic/message-response.css.d.ts +0 -2
  81. package/dist/components/agentic/message.d.ts +0 -27
  82. package/dist/components/agentic/message.js +0 -57
  83. package/dist/components/agentic/mic-selector.d.ts +0 -58
  84. package/dist/components/agentic/mic-selector.js +0 -173
  85. package/dist/components/agentic/model-selector.d.ts +0 -39
  86. package/dist/components/agentic/model-selector.js +0 -47
  87. package/dist/components/agentic/node.d.ts +0 -26
  88. package/dist/components/agentic/node.js +0 -29
  89. package/dist/components/agentic/open-in-chat.d.ts +0 -9
  90. package/dist/components/agentic/open-in-chat.js +0 -8
  91. package/dist/components/agentic/package-info.d.ts +0 -30
  92. package/dist/components/agentic/package-info.js +0 -44
  93. package/dist/components/agentic/panel.d.ts +0 -6
  94. package/dist/components/agentic/panel.js +0 -7
  95. package/dist/components/agentic/persona.d.ts +0 -16
  96. package/dist/components/agentic/persona.js +0 -116
  97. package/dist/components/agentic/prompt-input-action-menu.d.ts +0 -16
  98. package/dist/components/agentic/prompt-input-action-menu.js +0 -22
  99. package/dist/components/agentic/prompt-input-command.d.ts +0 -18
  100. package/dist/components/agentic/prompt-input-command.js +0 -25
  101. package/dist/components/agentic/prompt-input-hover-card.d.ts +0 -10
  102. package/dist/components/agentic/prompt-input-hover-card.js +0 -13
  103. package/dist/components/agentic/prompt-input-select.d.ts +0 -14
  104. package/dist/components/agentic/prompt-input-select.js +0 -19
  105. package/dist/components/agentic/prompt-input-tabs.d.ts +0 -17
  106. package/dist/components/agentic/prompt-input-tabs.js +0 -45
  107. package/dist/components/agentic/prompt-input.d.ts +0 -79
  108. package/dist/components/agentic/prompt-input.js +0 -206
  109. package/dist/components/agentic/reasoning.d.ts +0 -21
  110. package/dist/components/agentic/reasoning.js +0 -106
  111. package/dist/components/agentic/run-checkpoint.d.ts +0 -13
  112. package/dist/components/agentic/run-checkpoint.js +0 -19
  113. package/dist/components/agentic/run-trace.d.ts +0 -30
  114. package/dist/components/agentic/run-trace.js +0 -56
  115. package/dist/components/agentic/sandbox.d.ts +0 -24
  116. package/dist/components/agentic/sandbox.js +0 -33
  117. package/dist/components/agentic/schema-display.d.ts +0 -39
  118. package/dist/components/agentic/schema-display.js +0 -56
  119. package/dist/components/agentic/shimmer.d.ts +0 -11
  120. package/dist/components/agentic/shimmer.js +0 -16
  121. package/dist/components/agentic/snippet.d.ts +0 -18
  122. package/dist/components/agentic/snippet.js +0 -35
  123. package/dist/components/agentic/sources.d.ts +0 -16
  124. package/dist/components/agentic/sources.js +0 -17
  125. package/dist/components/agentic/speech-input.d.ts +0 -24
  126. package/dist/components/agentic/speech-input.js +0 -30
  127. package/dist/components/agentic/stack-trace.d.ts +0 -27
  128. package/dist/components/agentic/stack-trace.js +0 -76
  129. package/dist/components/agentic/suggestion.d.ts +0 -12
  130. package/dist/components/agentic/suggestion.js +0 -15
  131. package/dist/components/agentic/terminal.d.ts +0 -24
  132. package/dist/components/agentic/terminal.js +0 -47
  133. package/dist/components/agentic/test-results.d.ts +0 -51
  134. package/dist/components/agentic/test-results.js +0 -83
  135. package/dist/components/agentic/theme.d.ts +0 -5
  136. package/dist/components/agentic/theme.js +0 -31
  137. package/dist/components/agentic/tool.d.ts +0 -25
  138. package/dist/components/agentic/tool.js +0 -73
  139. package/dist/components/agentic/toolbar.d.ts +0 -6
  140. package/dist/components/agentic/toolbar.js +0 -7
  141. package/dist/components/agentic/transcription.d.ts +0 -20
  142. package/dist/components/agentic/transcription.js +0 -32
  143. package/dist/components/agentic/types.d.ts +0 -172
  144. package/dist/components/agentic/types.js +0 -1
  145. package/dist/components/agentic/use-controllable-state.d.ts +0 -6
  146. package/dist/components/agentic/use-controllable-state.js +0 -13
  147. package/dist/components/agentic/voice-selector.d.ts +0 -69
  148. package/dist/components/agentic/voice-selector.js +0 -122
  149. package/dist/components/agentic/web-preview.d.ts +0 -25
  150. package/dist/components/agentic/web-preview.js +0 -33
@@ -9,7 +9,7 @@ function AppShellPageHeader({ actions, className, description, title, ...props }
9
9
  return (_jsx(PageHeader, { className: className, ...props, children: _jsxs(PageHeaderMain, { className: "relative pl-14 md:pl-6 lg:pl-8", children: [_jsx(SidebarTrigger, { className: "absolute top-1/2 left-4 -translate-y-1/2 md:hidden" }), _jsxs(PageHeaderContent, { children: [_jsx(PageHeaderTitle, { children: title }), description ? _jsx(PageHeaderDescription, { children: description }) : null] }), actions ? _jsx(PageHeaderActions, { children: actions }) : null] }) }));
10
10
  }
11
11
  function AppShellWelcome({ brand, children, className, description, title, ...props }) {
12
- return (_jsx("div", { "data-slot": "app-shell-welcome", className: cn("flex min-h-0 flex-1 items-center justify-center p-6", className), ...props, children: _jsxs("div", { className: "flex max-w-md flex-col items-center gap-4 text-center", children: [brand ? _jsx(AppShellWelcomeBrand, { brand: brand }) : null, _jsxs("div", { className: "flex flex-col items-center gap-2", children: [_jsx("h2", { className: "text-2xl font-heading tracking-normal", children: title }), description ? (_jsx("div", { className: "text-sm text-muted-foreground [&>a]:font-medium [&>a]:text-foreground [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-foreground/72", children: description })) : null] }), children] }) }));
12
+ return (_jsx("div", { "data-slot": "app-shell-welcome", className: cn("flex min-h-0 flex-1 items-center justify-center p-6", className), ...props, children: _jsxs("div", { className: "flex max-w-md flex-col items-center gap-4 text-center", children: [brand ? _jsx(AppShellWelcomeBrand, { brand: brand }) : null, _jsxs("div", { className: "flex flex-col items-center gap-2", children: [_jsx("h2", { className: "font-heading text-2xl tracking-normal", children: title }), description ? (_jsx("div", { className: "text-sm text-muted-foreground [&>a]:font-medium [&>a]:text-foreground [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-foreground/72", children: description })) : null] }), children] }) }));
13
13
  }
14
14
  function AppShellWelcomeBrand({ brand }) {
15
15
  return (_jsxs(_Fragment, { children: [_jsx("img", { alt: brand.name, className: "h-24 w-auto dark:hidden", src: brand.iconLight }), brand.iconDark ? (_jsx("img", { alt: brand.name, className: "hidden h-24 w-auto dark:block", src: brand.iconDark })) : null] }));
@@ -24,7 +24,7 @@ function AppShellExpandedBrand({ brand }) {
24
24
  }
25
25
  function AppShellWordmark({ brand }) {
26
26
  if (!brand.wordmarkLight) {
27
- return (_jsx("span", { className: "truncate text-sm font-control text-sidebar-foreground", children: brand.name }));
27
+ return (_jsx("span", { className: "font-control truncate text-sm text-sidebar-foreground", children: brand.name }));
28
28
  }
29
29
  return (_jsx(AppShellThemedImage, { alt: brand.name, className: "h-3.5 w-auto max-w-[9.5rem]", darkSrc: brand.wordmarkDark, lightSrc: brand.wordmarkLight }));
30
30
  }
@@ -11,6 +11,6 @@ function ButtonGroupText({ className, asChild = false, ...props }) {
11
11
  return (_jsx(Comp, { className: cn("flex items-center gap-2 rounded-md border bg-muted px-4 text-sm font-medium shadow-xs [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className), ...props }));
12
12
  }
13
13
  function ButtonGroupSeparator({ className, orientation = "vertical", ...props }) {
14
- return (_jsx(Separator, { "data-slot": "button-group-separator", orientation: orientation, className: cn("relative m-0 self-stretch bg-input data-[orientation=horizontal]:-mt-px data-[orientation=vertical]:h-auto data-[orientation=vertical]:-ml-px", className), ...props }));
14
+ return (_jsx(Separator, { "data-slot": "button-group-separator", orientation: orientation, className: cn("relative m-0 self-stretch bg-input data-[orientation=horizontal]:-mt-px data-[orientation=vertical]:-ml-px data-[orientation=vertical]:h-auto", className), ...props }));
15
15
  }
16
16
  export { ButtonGroup, ButtonGroupSeparator, ButtonGroupText };
@@ -8,7 +8,7 @@ function Card({ className, variant = "surface", ...props }) {
8
8
  return (_jsx("div", { "data-slot": "card", "data-variant": variant, className: cn("group/card flex flex-col gap-(--panel-gap)", cardVariants[variant], className), ...props }));
9
9
  }
10
10
  function CardHeader({ className, ...props }) {
11
- return (_jsx("div", { "data-slot": "card-header", className: cn("@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 has-data-[slot=card-action]:grid-cols-[1fr_auto] group-data-[variant=surface]/card:px-(--panel-padding) [.border-b]:pb-(--panel-padding)", className), ...props }));
11
+ return (_jsx("div", { "data-slot": "card-header", className: cn("@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 group-data-[variant=surface]/card:px-(--panel-padding) has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-(--panel-padding)", className), ...props }));
12
12
  }
13
13
  function CardTitle({ className, ...props }) {
14
14
  return (_jsx("div", { "data-slot": "card-title", className: cn("leading-none font-medium", className), ...props }));
@@ -0,0 +1,8 @@
1
+ import { type ReactNode } from "react";
2
+ import { type ThemeProviderProps } from "@ciridae/ui/color-theme";
3
+ export type CiridaeUiProviderProps = {
4
+ children: ReactNode;
5
+ agentation?: boolean;
6
+ } & Pick<ThemeProviderProps, "defaultMode">;
7
+ declare function CiridaeUiProvider({ agentation, children, defaultMode }: CiridaeUiProviderProps): import("react").JSX.Element;
8
+ export { CiridaeUiProvider };
@@ -0,0 +1,14 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { lazy, Suspense } from "react";
3
+ import { ThemeProvider, useTheme } from "@ciridae/ui/color-theme";
4
+ import { Toaster } from "@ciridae/ui/sonner";
5
+ import { TooltipProvider } from "@ciridae/ui/tooltip";
6
+ const LazyAgentation = lazy(() => import("agentation").then((module) => ({ default: module.Agentation })));
7
+ function CiridaeUiToaster() {
8
+ const { mode } = useTheme();
9
+ return _jsx(Toaster, { richColors: true, closeButton: true, theme: mode });
10
+ }
11
+ function CiridaeUiProvider({ agentation = false, children, defaultMode }) {
12
+ return (_jsx(ThemeProvider, { defaultMode: defaultMode, children: _jsxs(TooltipProvider, { children: [children, _jsx(CiridaeUiToaster, {}), agentation ? (_jsx(Suspense, { fallback: null, children: _jsx(LazyAgentation, {}) })) : null] }) }));
13
+ }
14
+ export { CiridaeUiProvider };
@@ -2,3 +2,4 @@ import * as React from "react";
2
2
  import { type ResolvedTheme, type ThemeMode, type ThemeProviderProps } from "./color-theme-context";
3
3
  declare function ThemeProvider({ children, defaultMode, storageKey, }: ThemeProviderProps): React.JSX.Element;
4
4
  export { ThemeProvider, type ResolvedTheme, type ThemeMode, type ThemeProviderProps };
5
+ export { useTheme } from "./use-color-theme";
@@ -45,3 +45,4 @@ function getSystemTheme() {
45
45
  return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
46
46
  }
47
47
  export { ThemeProvider };
48
+ export { useTheme } from "./use-color-theme";
@@ -19,7 +19,7 @@ function ComboboxInput({ className, children, disabled = false, showTrigger = tr
19
19
  return (_jsxs(InputGroup, { className: cn("w-auto", className), children: [_jsx(ComboboxPrimitive.Input, { render: _jsx(InputGroupInput, { disabled: disabled }), ...props }), _jsxs(InputGroupAddon, { align: "inline-end", children: [showTrigger && (_jsx(InputGroupButton, { size: "icon-xs", variant: "ghost", asChild: true, "data-slot": "input-group-button", className: "group-has-data-[slot=combobox-clear]/input-group:hidden data-pressed:bg-transparent", disabled: disabled, children: _jsx(ComboboxTrigger, {}) })), showClear && _jsx(ComboboxClear, { disabled: disabled })] }), children] }));
20
20
  }
21
21
  function ComboboxContent({ className, side = "bottom", sideOffset = 6, align = "start", alignOffset = 0, anchor, ...props }) {
22
- return (_jsx(ComboboxPrimitive.Portal, { children: _jsx(ComboboxPrimitive.Positioner, { side: side, sideOffset: sideOffset, align: align, alignOffset: alignOffset, anchor: anchor, className: "isolate z-50", children: _jsx(ComboboxPrimitive.Popup, { "data-slot": "combobox-content", "data-chips": !!anchor, className: cn("group/combobox-content relative max-h-96 w-(--anchor-width) max-w-(--available-width) min-w-[calc(var(--anchor-width)+--spacing(7))] origin-(--transform-origin) overflow-hidden rounded-md bg-popover text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[chips=true]:min-w-(--anchor-width) 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-[slot=input-group]:m-1 *:data-[slot=input-group]:mb-0 *:data-[slot=input-group]:h-(--control-height-sm) *:data-[slot=input-group]:border-input/30 *:data-[slot=input-group]:bg-input/30 *:data-[slot=input-group]:shadow-none data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0", className), ...props }) }) }));
22
+ return (_jsx(ComboboxPrimitive.Portal, { children: _jsx(ComboboxPrimitive.Positioner, { side: side, sideOffset: sideOffset, align: align, alignOffset: alignOffset, anchor: anchor, className: "isolate z-50", children: _jsx(ComboboxPrimitive.Popup, { "data-slot": "combobox-content", "data-chips": !!anchor, className: cn("group/combobox-content relative max-h-96 w-(--anchor-width) max-w-(--available-width) min-w-[calc(var(--anchor-width)+--spacing(7))] origin-(--transform-origin) overflow-hidden rounded-md bg-popover text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-closed:animate-out data-closed:fade-out-0 data-open:animate-in data-open:fade-in-0 data-[chips=true]:min-w-(--anchor-width) 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-[slot=input-group]:m-1 *:data-[slot=input-group]:mb-0 *:data-[slot=input-group]:h-(--control-height-sm) *:data-[slot=input-group]:border-input/30 *:data-[slot=input-group]:bg-input/30 *:data-[slot=input-group]:shadow-none", className), ...props }) }) }));
23
23
  }
24
24
  function ComboboxList({ className, ...props }) {
25
25
  return (_jsx(ComboboxPrimitive.List, { "data-slot": "combobox-list", className: cn("max-h-[min(calc(--spacing(96)---spacing(9)),calc(var(--available-height)---spacing(9)))] scroll-py-1 overflow-y-auto p-1 data-empty:p-0", className), ...props }));
@@ -31,7 +31,7 @@ function ComboboxGroup({ className, ...props }) {
31
31
  return _jsx(ComboboxPrimitive.Group, { "data-slot": "combobox-group", className: cn(className), ...props });
32
32
  }
33
33
  function ComboboxLabel({ className, ...props }) {
34
- return (_jsx(ComboboxPrimitive.GroupLabel, { "data-slot": "combobox-label", className: cn("px-(--menu-item-padding-x) py-1 text-meta text-muted-foreground pointer-coarse:px-3 pointer-coarse:py-2 pointer-coarse:text-sm", className), ...props }));
34
+ return (_jsx(ComboboxPrimitive.GroupLabel, { "data-slot": "combobox-label", className: cn("text-meta px-(--menu-item-padding-x) py-1 text-muted-foreground pointer-coarse:px-3 pointer-coarse:py-2 pointer-coarse:text-sm", className), ...props }));
35
35
  }
36
36
  function ComboboxCollection({ ...props }) {
37
37
  return _jsx(ComboboxPrimitive.Collection, { "data-slot": "combobox-collection", ...props });
@@ -33,6 +33,6 @@ function CommandItem({ className, ...props }) {
33
33
  return (_jsx(CommandPrimitive.Item, { "data-slot": "command-item", className: cn("relative flex min-h-(--menu-item-height) cursor-default items-center gap-(--control-gap) rounded-sm px-(--menu-item-padding-x) py-1 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground", className), ...props }));
34
34
  }
35
35
  function CommandShortcut({ className, ...props }) {
36
- return (_jsx("span", { "data-slot": "command-shortcut", className: cn("ml-auto text-meta font-mono text-muted-foreground", className), ...props }));
36
+ return (_jsx("span", { "data-slot": "command-shortcut", className: cn("text-meta ml-auto font-mono text-muted-foreground", className), ...props }));
37
37
  }
38
38
  export { Command, CommandDialog, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, CommandShortcut, CommandSeparator, };
@@ -52,12 +52,12 @@ function ContextMenuRadioItem({ className, children, ...props }) {
52
52
  return (_jsxs(ContextMenuPrimitive.RadioItem, { "data-slot": "context-menu-radio-item", className: cn("relative flex min-h-(--menu-item-height) cursor-default items-center gap-(--control-gap) rounded-sm py-1 pr-(--menu-item-padding-x) pl-8 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className), ...props, children: [_jsx("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: _jsx(ContextMenuPrimitive.ItemIndicator, { children: _jsx(CircleIcon, { className: "size-2 fill-current" }) }) }), children] }));
53
53
  }
54
54
  function ContextMenuLabel({ className, inset, ...props }) {
55
- return (_jsx(ContextMenuPrimitive.Label, { "data-slot": "context-menu-label", "data-inset": inset, className: cn("px-(--menu-item-padding-x) py-1 text-meta text-muted-foreground data-[inset]:pl-8", className), ...props }));
55
+ return (_jsx(ContextMenuPrimitive.Label, { "data-slot": "context-menu-label", "data-inset": inset, className: cn("text-meta px-(--menu-item-padding-x) py-1 text-muted-foreground data-[inset]:pl-8", className), ...props }));
56
56
  }
57
57
  function ContextMenuSeparator({ className, ...props }) {
58
58
  return (_jsx(ContextMenuPrimitive.Separator, { "data-slot": "context-menu-separator", className: cn("-mx-1 my-1 h-px bg-border", className), ...props }));
59
59
  }
60
60
  function ContextMenuShortcut({ className, ...props }) {
61
- return (_jsx("span", { "data-slot": "context-menu-shortcut", className: cn("ml-auto text-meta font-mono text-muted-foreground", className), ...props }));
61
+ return (_jsx("span", { "data-slot": "context-menu-shortcut", className: cn("text-meta ml-auto font-mono text-muted-foreground", className), ...props }));
62
62
  }
63
63
  export { ContextMenu, ContextMenuTrigger, ContextMenuContent, ContextMenuItem, ContextMenuCheckboxItem, ContextMenuRadioItem, ContextMenuLabel, ContextMenuSeparator, ContextMenuShortcut, ContextMenuGroup, ContextMenuPortal, ContextMenuPortalContainerProvider, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuRadioGroup, };
@@ -15,6 +15,6 @@ function DataTableHeaderCell({ header }) {
15
15
  const Icon = sorted === "asc" ? ArrowUpIcon : sorted === "desc" ? ArrowDownIcon : ArrowUpDownIcon;
16
16
  if (!header.column.getCanSort())
17
17
  return flexRender(header.column.columnDef.header, header.getContext());
18
- return (_jsxs(Button, { "aria-pressed": Boolean(sorted), className: "-ml-2 h-auto px-2 py-0 text-meta text-muted-foreground hover:bg-transparent hover:text-foreground", onClick: header.column.getToggleSortingHandler(), size: "sm", type: "button", variant: "ghost", children: [_jsx("span", { children: flexRender(header.column.columnDef.header, header.getContext()) }), _jsx(Icon, {})] }));
18
+ return (_jsxs(Button, { "aria-pressed": Boolean(sorted), className: "text-meta -ml-2 h-auto px-2 py-0 text-muted-foreground hover:bg-transparent hover:text-foreground", onClick: header.column.getToggleSortingHandler(), size: "sm", type: "button", variant: "ghost", children: [_jsx("span", { children: flexRender(header.column.columnDef.header, header.getContext()) }), _jsx(Icon, {})] }));
19
19
  }
20
20
  export { DataTableGrid };
@@ -22,6 +22,6 @@ function DataTableSkeleton({ className, ...props }) {
22
22
  }
23
23
  function SortableTableHead({ active = false, children, className, direction = "asc", onSort, align = "left", ...props }) {
24
24
  const Icon = active ? (direction === "asc" ? ArrowUpIcon : ArrowDownIcon) : ArrowUpDownIcon;
25
- return (_jsx(TableHead, { "aria-sort": active ? (direction === "asc" ? "ascending" : "descending") : "none", className: cn(align === "right" && "text-right", className), ...props, children: _jsxs(Button, { "aria-pressed": active, className: cn("h-auto px-0 py-0 text-meta text-muted-foreground hover:bg-transparent hover:text-foreground", align === "right" ? "ml-auto justify-end" : "justify-start"), onClick: onSort, size: "sm", type: "button", variant: "ghost", children: [_jsx("span", { children: children }), _jsx(Icon, {})] }) }));
25
+ return (_jsx(TableHead, { "aria-sort": active ? (direction === "asc" ? "ascending" : "descending") : "none", className: cn(align === "right" && "text-right", className), ...props, children: _jsxs(Button, { "aria-pressed": active, className: cn("text-meta h-auto px-0 py-0 text-muted-foreground hover:bg-transparent hover:text-foreground", align === "right" ? "ml-auto justify-end" : "justify-start"), onClick: onSort, size: "sm", type: "button", variant: "ghost", children: [_jsx("span", { children: children }), _jsx(Icon, {})] }) }));
26
26
  }
27
27
  export { DataTable, DataTableToolbar, DataTableContent, DataTableEmpty, DataTableSkeleton, TanStackDataTable, SortableTableHead, };
@@ -43,13 +43,13 @@ function DropdownMenuRadioItem({ className, children, ...props }) {
43
43
  return (_jsxs(DropdownMenuPrimitive.RadioItem, { "data-slot": "dropdown-menu-radio-item", className: cn("relative flex min-h-(--menu-item-height) cursor-default items-center gap-(--control-gap) rounded-sm py-1 pr-(--menu-item-padding-x) pl-8 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className), ...props, children: [_jsx("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: _jsx(DropdownMenuPrimitive.ItemIndicator, { children: _jsx(CircleIcon, { className: "size-2 fill-current" }) }) }), children] }));
44
44
  }
45
45
  function DropdownMenuLabel({ className, inset, ...props }) {
46
- return (_jsx(DropdownMenuPrimitive.Label, { "data-slot": "dropdown-menu-label", "data-inset": inset, className: cn("px-(--menu-item-padding-x) py-1 text-meta text-muted-foreground data-[inset]:pl-8", className), ...props }));
46
+ return (_jsx(DropdownMenuPrimitive.Label, { "data-slot": "dropdown-menu-label", "data-inset": inset, className: cn("text-meta px-(--menu-item-padding-x) py-1 text-muted-foreground data-[inset]:pl-8", className), ...props }));
47
47
  }
48
48
  function DropdownMenuSeparator({ className, ...props }) {
49
49
  return (_jsx(DropdownMenuPrimitive.Separator, { "data-slot": "dropdown-menu-separator", className: cn("-mx-1 my-1 h-px bg-border", className), ...props }));
50
50
  }
51
51
  function DropdownMenuShortcut({ className, ...props }) {
52
- return (_jsx("span", { "data-slot": "dropdown-menu-shortcut", className: cn("ml-auto text-meta font-mono text-muted-foreground", className), ...props }));
52
+ return (_jsx("span", { "data-slot": "dropdown-menu-shortcut", className: cn("text-meta ml-auto font-mono text-muted-foreground", className), ...props }));
53
53
  }
54
54
  function DropdownMenuSub({ ...props }) {
55
55
  return _jsx(DropdownMenuPrimitive.Sub, { "data-slot": "dropdown-menu-sub", ...props });
@@ -57,6 +57,6 @@ function InputGroupInput({ className, ...props }) {
57
57
  return (_jsx(Input, { "data-slot": "input-group-control", className: cn("flex-1 rounded-none border-0 bg-transparent shadow-none focus-visible:ring-0 dark:bg-transparent", className), ...props }));
58
58
  }
59
59
  function InputGroupTextarea({ className, ...props }) {
60
- return (_jsx(Textarea, { "data-slot": "input-group-control", className: cn("flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 dark:bg-transparent", className), ...props }));
60
+ return (_jsx(Textarea, { "data-slot": "input-group-control", className: cn("field-sizing-fixed! w-full! min-w-0 flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 dark:bg-transparent", className), ...props }));
61
61
  }
62
62
  export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupText, InputGroupInput, InputGroupTextarea, };
@@ -11,7 +11,7 @@ declare function Item({ className, variant, size, asChild, ...props }: React.Com
11
11
  asChild?: boolean;
12
12
  }): React.JSX.Element;
13
13
  declare const itemMediaVariants: (props?: ({
14
- variant?: "image" | "default" | "icon" | null | undefined;
14
+ variant?: "default" | "icon" | "image" | null | undefined;
15
15
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
16
16
  declare function ItemMedia({ className, variant, ...props }: React.ComponentProps<"div"> & VariantProps<typeof itemMediaVariants>): React.JSX.Element;
17
17
  declare function ItemContent({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
@@ -43,13 +43,13 @@ function MenubarRadioItem({ className, children, ...props }) {
43
43
  return (_jsxs(MenubarPrimitive.RadioItem, { "data-slot": "menubar-radio-item", className: cn("relative flex min-h-(--menu-item-height) cursor-default items-center gap-(--control-gap) rounded-xs py-1 pr-(--menu-item-padding-x) pl-8 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className), ...props, children: [_jsx("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: _jsx(MenubarPrimitive.ItemIndicator, { children: _jsx(CircleIcon, { className: "size-2 fill-current" }) }) }), children] }));
44
44
  }
45
45
  function MenubarLabel({ className, inset, ...props }) {
46
- return (_jsx(MenubarPrimitive.Label, { "data-slot": "menubar-label", "data-inset": inset, className: cn("px-(--menu-item-padding-x) py-1 text-meta text-muted-foreground data-[inset]:pl-8", className), ...props }));
46
+ return (_jsx(MenubarPrimitive.Label, { "data-slot": "menubar-label", "data-inset": inset, className: cn("text-meta px-(--menu-item-padding-x) py-1 text-muted-foreground data-[inset]:pl-8", className), ...props }));
47
47
  }
48
48
  function MenubarSeparator({ className, ...props }) {
49
49
  return (_jsx(MenubarPrimitive.Separator, { "data-slot": "menubar-separator", className: cn("-mx-1 my-1 h-px bg-border", className), ...props }));
50
50
  }
51
51
  function MenubarShortcut({ className, ...props }) {
52
- return (_jsx("span", { "data-slot": "menubar-shortcut", className: cn("ml-auto text-meta font-mono text-muted-foreground", className), ...props }));
52
+ return (_jsx("span", { "data-slot": "menubar-shortcut", className: cn("text-meta ml-auto font-mono text-muted-foreground", className), ...props }));
53
53
  }
54
54
  function MenubarSub({ ...props }) {
55
55
  return _jsx(MenubarPrimitive.Sub, { "data-slot": "menubar-sub", ...props });
@@ -9,7 +9,7 @@ function PageHeaderMain({ className, ...props }) {
9
9
  return (_jsx("div", { "data-slot": "page-header-main", className: cn("flex flex-col gap-3 px-4 py-3 md:flex-row md:items-center md:justify-between md:px-6 lg:px-8", className), ...props }));
10
10
  }
11
11
  function PageHeaderContent({ className, ...props }) {
12
- return (_jsx("div", { "data-slot": "page-header-content", className: cn("flex min-w-0 max-w-3xl flex-col gap-1", className), ...props }));
12
+ return (_jsx("div", { "data-slot": "page-header-content", className: cn("flex max-w-3xl min-w-0 flex-col gap-1", className), ...props }));
13
13
  }
14
14
  function PageHeaderBackButton({ asChild = false, children, className, ...props }) {
15
15
  if (asChild) {
@@ -4,6 +4,6 @@ function RegistryDocsApiTable({ props }) {
4
4
  return (_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Prop" }), _jsx(TableHead, { children: "Type" }), _jsx(TableHead, { children: "Default" }), _jsx(TableHead, { children: "Description" })] }) }), _jsx(TableBody, { children: props.map((prop) => (_jsx(RegistryDocsApiTableRow, { prop: prop }, prop.name))) })] }));
5
5
  }
6
6
  function RegistryDocsApiTableRow({ prop }) {
7
- return (_jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx("code", { className: "font-mono text-xs", children: prop.name }) }), _jsx(TableCell, { className: "max-w-72", children: _jsx("code", { className: "font-mono text-xs text-muted-foreground whitespace-normal", children: prop.type }) }), _jsx(TableCell, { children: prop.defaultValue ? (_jsx("code", { className: "font-mono text-xs text-muted-foreground", children: prop.defaultValue })) : (_jsx("span", { className: "text-muted-foreground", children: "None" })) }), _jsx(TableCell, { className: "whitespace-normal text-muted-foreground", children: prop.description })] }));
7
+ return (_jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx("code", { className: "font-mono text-xs", children: prop.name }) }), _jsx(TableCell, { className: "max-w-72", children: _jsx("code", { className: "font-mono text-xs whitespace-normal text-muted-foreground", children: prop.type }) }), _jsx(TableCell, { children: prop.defaultValue ? (_jsx("code", { className: "font-mono text-xs text-muted-foreground", children: prop.defaultValue })) : (_jsx("span", { className: "text-muted-foreground", children: "None" })) }), _jsx(TableCell, { className: "whitespace-normal text-muted-foreground", children: prop.description })] }));
8
8
  }
9
9
  export { RegistryDocsApiTable };
@@ -10,7 +10,7 @@ function RegistryDocsShowcase({ className, code, codeLabel = "preview.tsx", defa
10
10
  return (_jsxs("div", { "data-slot": "registry-docs-showcase", className: cn("min-w-0 overflow-hidden rounded-xl border bg-card text-card-foreground shadow-xs", className), ...props, children: [_jsx(RegistryDocsShowcasePreview, { previewMode: previewMode, children: preview }), _jsx(RegistryDocsShowcaseCode, { code: code, codeId: codeId, codeLabel: codeLabel, expanded: expanded, onExpandedChange: setExpanded })] }));
11
11
  }
12
12
  function RegistryDocsShowcasePreview({ children, previewMode, }) {
13
- return (_jsx("div", { "data-slot": "registry-docs-showcase-preview", "data-preview-mode": previewMode, className: "flex min-h-[28rem] items-center justify-center overflow-auto bg-background p-(--panel-padding) data-[preview-mode=canvas]:min-h-[34rem] data-[preview-mode=canvas]:items-stretch data-[preview-mode=canvas]:justify-stretch data-[preview-mode=canvas]:p-2 data-[preview-mode=page]:min-h-[36rem] data-[preview-mode=page]:items-start data-[preview-mode=page]:p-0 md:data-[preview-mode=canvas]:min-h-[42rem] md:data-[preview-mode=canvas]:p-3", children: _jsx("div", { className: "flex min-w-0 w-full items-center justify-center data-[preview-mode=canvas]:min-h-full data-[preview-mode=canvas]:items-stretch data-[preview-mode=canvas]:justify-stretch data-[preview-mode=page]:min-h-full data-[preview-mode=page]:items-stretch", "data-preview-mode": previewMode, children: children }) }));
13
+ return (_jsx("div", { "data-slot": "registry-docs-showcase-preview", "data-preview-mode": previewMode, className: "flex min-h-[28rem] items-center justify-center overflow-auto bg-background p-(--panel-padding) data-[preview-mode=canvas]:min-h-[34rem] data-[preview-mode=canvas]:items-stretch data-[preview-mode=canvas]:justify-stretch data-[preview-mode=canvas]:p-2 data-[preview-mode=page]:min-h-[36rem] data-[preview-mode=page]:items-start data-[preview-mode=page]:p-0 md:data-[preview-mode=canvas]:min-h-[42rem] md:data-[preview-mode=canvas]:p-3", children: _jsx("div", { className: "flex w-full min-w-0 items-center justify-center data-[preview-mode=canvas]:min-h-full data-[preview-mode=canvas]:items-stretch data-[preview-mode=canvas]:justify-stretch data-[preview-mode=page]:min-h-full data-[preview-mode=page]:items-stretch", "data-preview-mode": previewMode, children: children }) }));
14
14
  }
15
15
  function RegistryDocsShowcaseCode({ code, codeId, codeLabel, expanded, onExpandedChange, }) {
16
16
  return (_jsxs("div", { "data-slot": "registry-docs-showcase-code", className: "relative border-t bg-muted/20", children: [_jsx(RegistryDocsShowcaseToggle, { codeId: codeId, expanded: expanded, onExpandedChange: onExpandedChange }), _jsxs("div", { id: codeId, "aria-label": codeLabel, className: cn("relative", expanded ? "max-h-[42rem] overflow-auto" : "max-h-44 overflow-hidden"), children: [_jsxs("div", { className: "mx-auto w-full max-w-5xl", children: [expanded ? _jsx(RegistryDocsShowcaseCopyButton, { code: code }) : null, _jsx(RegistryDocsCodeSnippet, { code: code, className: cn("text-sm [&_.shiki]:text-sm", expanded ? "px-6 pt-8 pb-8 md:px-8" : "p-7 pb-16 opacity-80") })] }), expanded ? null : _jsx(RegistryDocsShowcaseFade, {})] })] }));
@@ -21,7 +21,7 @@ function SelectContent({ className, children, position = "item-aligned", align =
21
21
  "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"), children: children }), _jsx(SelectScrollDownButton, {})] }) }));
22
22
  }
23
23
  function SelectLabel({ className, ...props }) {
24
- return (_jsx(SelectPrimitive.Label, { "data-slot": "select-label", className: cn("px-(--menu-item-padding-x) py-1 text-meta text-muted-foreground", className), ...props }));
24
+ return (_jsx(SelectPrimitive.Label, { "data-slot": "select-label", className: cn("text-meta px-(--menu-item-padding-x) py-1 text-muted-foreground", className), ...props }));
25
25
  }
26
26
  function SelectItem({ className, children, ...props }) {
27
27
  return (_jsxs(SelectPrimitive.Item, { "data-slot": "select-item", className: cn("relative flex min-h-(--menu-item-height) w-full cursor-default items-center gap-(--control-gap) rounded-sm py-1 pr-8 pl-(--menu-item-padding-x) text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-(--control-gap)", className), ...props, children: [_jsx("span", { "data-slot": "select-item-indicator", className: "absolute right-2 flex size-3.5 items-center justify-center", children: _jsx(SelectPrimitive.ItemIndicator, { children: _jsx(CheckIcon, { className: "size-4" }) }) }), _jsx(SelectPrimitive.ItemText, { children: children })] }));
@@ -6,11 +6,11 @@ function SidebarGroup({ className, ...props }) {
6
6
  }
7
7
  function SidebarGroupLabel({ className, asChild = false, ...props }) {
8
8
  const Comp = asChild ? Slot.Root : "div";
9
- return (_jsx(Comp, { "data-slot": "sidebar-group-label", "data-sidebar": "group-label", className: cn("flex h-(--sidebar-item-height-sm) shrink-0 items-center rounded-[var(--sidebar-item-radius)] px-(--sidebar-item-padding-x) text-meta text-sidebar-foreground/45 ring-sidebar-ring outline-hidden transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-[var(--focus-ring-width)] [&>svg]:size-(--sidebar-icon-size) [&>svg]:shrink-0", "group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0", className), ...props }));
9
+ return (_jsx(Comp, { "data-slot": "sidebar-group-label", "data-sidebar": "group-label", className: cn("text-meta flex h-(--sidebar-item-height-sm) shrink-0 items-center rounded-[var(--sidebar-item-radius)] px-(--sidebar-item-padding-x) text-sidebar-foreground/45 ring-sidebar-ring outline-hidden transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-[var(--focus-ring-width)] [&>svg]:size-(--sidebar-icon-size) [&>svg]:shrink-0", "group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0", className), ...props }));
10
10
  }
11
11
  function SidebarGroupAction({ className, asChild = false, ...props }) {
12
12
  const Comp = asChild ? Slot.Root : "button";
13
- return (_jsx(Comp, { "data-slot": "sidebar-group-action", "data-sidebar": "group-action", className: cn("absolute top-(--sidebar-group-padding) right-(--sidebar-group-padding) flex size-(--sidebar-item-height-sm) items-center justify-center rounded-[var(--sidebar-item-radius)] p-0 text-sidebar-foreground/70 ring-sidebar-ring outline-hidden transition-colors hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-[var(--focus-ring-width)] after:absolute after:-inset-2 md:after:hidden [&>svg]:size-(--sidebar-icon-size) [&>svg]:shrink-0", "group-data-[collapsible=icon]:hidden", className), ...props }));
13
+ return (_jsx(Comp, { "data-slot": "sidebar-group-action", "data-sidebar": "group-action", className: cn("absolute top-(--sidebar-group-padding) right-(--sidebar-group-padding) flex size-(--sidebar-item-height-sm) items-center justify-center rounded-[var(--sidebar-item-radius)] p-0 text-sidebar-foreground/70 ring-sidebar-ring outline-hidden transition-colors after:absolute after:-inset-2 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-[var(--focus-ring-width)] md:after:hidden [&>svg]:size-(--sidebar-icon-size) [&>svg]:shrink-0", "group-data-[collapsible=icon]:hidden", className), ...props }));
14
14
  }
15
15
  function SidebarGroupContent({ className, ...props }) {
16
16
  return (_jsx("div", { "data-slot": "sidebar-group-content", "data-sidebar": "group-content", className: cn("w-full text-sm", className), ...props }));
@@ -40,11 +40,11 @@ function SidebarMenuButton({ asChild = false, isActive = false, variant = "defau
40
40
  }
41
41
  function SidebarMenuAction({ className, asChild = false, showOnHover = false, ...props }) {
42
42
  const Comp = asChild ? Slot.Root : "button";
43
- return (_jsx(Comp, { "data-slot": "sidebar-menu-action", "data-sidebar": "menu-action", className: cn("absolute top-0.5 right-0.5 flex size-(--sidebar-item-height-sm) items-center justify-center rounded-[var(--sidebar-item-radius)] p-0 text-sidebar-foreground/60 ring-sidebar-ring outline-hidden transition-colors peer-hover/menu-button:text-sidebar-accent-foreground hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-[var(--focus-ring-width)] after:absolute after:-inset-2 md:after:hidden [&>svg]:size-(--sidebar-icon-size) [&>svg]:shrink-0", "peer-data-[size=sm]/menu-button:top-1", "peer-data-[size=default]/menu-button:top-1", "peer-data-[size=lg]/menu-button:top-2.5", "group-data-[collapsible=icon]:hidden", showOnHover &&
43
+ return (_jsx(Comp, { "data-slot": "sidebar-menu-action", "data-sidebar": "menu-action", className: cn("absolute top-0.5 right-0.5 flex size-(--sidebar-item-height-sm) items-center justify-center rounded-[var(--sidebar-item-radius)] p-0 text-sidebar-foreground/60 ring-sidebar-ring outline-hidden transition-colors peer-hover/menu-button:text-sidebar-accent-foreground after:absolute after:-inset-2 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-[var(--focus-ring-width)] md:after:hidden [&>svg]:size-(--sidebar-icon-size) [&>svg]:shrink-0", "peer-data-[size=sm]/menu-button:top-1", "peer-data-[size=default]/menu-button:top-1", "peer-data-[size=lg]/menu-button:top-2.5", "group-data-[collapsible=icon]:hidden", showOnHover &&
44
44
  "group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 peer-data-[active=true]/menu-button:text-sidebar-accent-foreground data-[state=open]:opacity-100 md:opacity-0", className), ...props }));
45
45
  }
46
46
  function SidebarMenuBadge({ className, ...props }) {
47
- return (_jsx("div", { "data-slot": "sidebar-menu-badge", "data-sidebar": "menu-badge", className: cn("pointer-events-none absolute right-1 flex h-(--sidebar-item-height-sm) min-w-(--sidebar-item-height-sm) items-center justify-center rounded-[var(--badge-radius)] px-(--badge-padding-x) text-meta text-sidebar-foreground/60 tabular-nums select-none", "peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground", "peer-data-[size=sm]/menu-button:top-1", "peer-data-[size=default]/menu-button:top-1", "peer-data-[size=lg]/menu-button:top-2.5", "group-data-[collapsible=icon]:hidden", className), ...props }));
47
+ return (_jsx("div", { "data-slot": "sidebar-menu-badge", "data-sidebar": "menu-badge", className: cn("text-meta pointer-events-none absolute right-1 flex h-(--sidebar-item-height-sm) min-w-(--sidebar-item-height-sm) items-center justify-center rounded-[var(--badge-radius)] px-(--badge-padding-x) text-sidebar-foreground/60 tabular-nums select-none", "peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground", "peer-data-[size=sm]/menu-button:top-1", "peer-data-[size=default]/menu-button:top-1", "peer-data-[size=lg]/menu-button:top-2.5", "group-data-[collapsible=icon]:hidden", className), ...props }));
48
48
  }
49
49
  function SidebarMenuSkeleton({ className, showIcon = false, ...props }) {
50
50
  const width = React.useMemo(() => `${Math.floor(Math.random() * 40) + 50}%`, []);
@@ -59,6 +59,6 @@ function SidebarMenuSubItem({ className, ...props }) {
59
59
  }
60
60
  function SidebarMenuSubButton({ asChild = false, size = "md", isActive = false, className, ...props }) {
61
61
  const Comp = asChild ? Slot.Root : "a";
62
- return (_jsx(Comp, { "data-slot": "sidebar-menu-sub-button", "data-sidebar": "menu-sub-button", "data-size": size, "data-active": isActive, className: cn("relative flex h-(--sidebar-sub-item-height) min-w-0 items-center gap-(--control-gap) overflow-hidden rounded-[var(--sidebar-item-radius)] px-(--sidebar-item-padding-x) text-sidebar-foreground/65 ring-sidebar-ring outline-hidden transition-[color,background-color,box-shadow] hover:bg-sidebar-accent/70 hover:text-sidebar-accent-foreground hover:[&>svg]:text-sidebar-accent-foreground focus-visible:ring-[var(--focus-ring-width)] active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-transparent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[active=true]:shadow-none data-[active=true]:[&>svg]:text-sidebar-accent-foreground [&>span:last-child]:truncate [&>svg]:size-(--sidebar-icon-size) [&>svg]:shrink-0 [&>svg]:text-sidebar-foreground/45", size === "sm" && "text-xs", size === "md" && "text-sm", "group-data-[collapsible=icon]:hidden", className), ...props }));
62
+ return (_jsx(Comp, { "data-slot": "sidebar-menu-sub-button", "data-sidebar": "menu-sub-button", "data-size": size, "data-active": isActive, className: cn("relative flex h-(--sidebar-sub-item-height) min-w-0 items-center gap-(--control-gap) overflow-hidden rounded-[var(--sidebar-item-radius)] px-(--sidebar-item-padding-x) text-sidebar-foreground/65 ring-sidebar-ring outline-hidden transition-[color,background-color,box-shadow] hover:bg-sidebar-accent/70 hover:text-sidebar-accent-foreground focus-visible:ring-[var(--focus-ring-width)] active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-transparent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[active=true]:shadow-none [&>span:last-child]:truncate [&>svg]:size-(--sidebar-icon-size) [&>svg]:shrink-0 [&>svg]:text-sidebar-foreground/45 hover:[&>svg]:text-sidebar-accent-foreground data-[active=true]:[&>svg]:text-sidebar-accent-foreground", size === "sm" && "text-xs", size === "md" && "text-sm", "group-data-[collapsible=icon]:hidden", className), ...props }));
63
63
  }
64
64
  export { SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, };
@@ -9,11 +9,11 @@ function AccountThemeSection({ mode, onModeChange, }) {
9
9
  return (_jsxs(_Fragment, { children: [_jsx(DropdownMenuSeparator, {}), _jsx(AccountThemeControls, { mode: mode, onModeChange: onModeChange })] }));
10
10
  }
11
11
  function AccountThemeControls({ mode, onModeChange, }) {
12
- return (_jsxs("div", { className: "px-(--menu-item-padding-x) py-1", children: [_jsx("div", { className: "mb-1 text-xs font-control text-muted-foreground", children: "Theme" }), _jsx("div", { className: "grid grid-cols-3 gap-0.5 rounded-[var(--sidebar-item-radius)] border border-border/70 bg-transparent p-0.5", children: sidebarAccountThemeModes.map((themeMode) => (_jsx(ThemeModeButton, { active: mode === themeMode, mode: themeMode, onModeChange: onModeChange }, themeMode))) })] }));
12
+ return (_jsxs("div", { className: "px-(--menu-item-padding-x) py-1", children: [_jsx("div", { className: "font-control mb-1 text-xs text-muted-foreground", children: "Theme" }), _jsx("div", { className: "grid grid-cols-3 gap-0.5 rounded-[var(--sidebar-item-radius)] border border-border/70 bg-transparent p-0.5", children: sidebarAccountThemeModes.map((themeMode) => (_jsx(ThemeModeButton, { active: mode === themeMode, mode: themeMode, onModeChange: onModeChange }, themeMode))) })] }));
13
13
  }
14
14
  function ThemeModeButton({ active, mode, onModeChange, }) {
15
15
  const label = getThemeModeLabel(mode);
16
- return (_jsxs("button", { "aria-pressed": active, className: cn("flex h-(--sidebar-item-height-sm) items-center justify-center gap-1 rounded-sm px-2 text-xs font-control text-muted-foreground outline-hidden transition-[color,background-color,box-shadow]", "hover:bg-background hover:text-foreground focus-visible:ring-[var(--focus-ring-width)] focus-visible:ring-ring", active && "bg-muted text-foreground shadow-none"), onClick: () => onModeChange(mode), type: "button", children: [_jsx(ThemeModeIcon, { mode: mode }), _jsx("span", { children: label })] }));
16
+ return (_jsxs("button", { "aria-pressed": active, className: cn("font-control flex h-(--sidebar-item-height-sm) items-center justify-center gap-1 rounded-sm px-2 text-xs text-muted-foreground outline-hidden transition-[color,background-color,box-shadow]", "hover:bg-background hover:text-foreground focus-visible:ring-[var(--focus-ring-width)] focus-visible:ring-ring", active && "bg-muted text-foreground shadow-none"), onClick: () => onModeChange(mode), type: "button", children: [_jsx(ThemeModeIcon, { mode: mode }), _jsx("span", { children: label })] }));
17
17
  }
18
18
  function ThemeModeIcon({ mode }) {
19
19
  if (mode === "light")
@@ -22,13 +22,13 @@ function AccountMenuTrigger({ accountMark, detail, imageUrl, label, }) {
22
22
  return (_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(SidebarMenuButton, { "aria-label": `Open account menu for ${label}`, className: cn("h-auto min-h-(--control-height) py-1", "text-sidebar-foreground/78 hover:text-sidebar-accent-foreground", "data-[state=open]:bg-sidebar-accent/45 data-[state=open]:text-sidebar-accent-foreground", "group-data-[collapsible=icon]:justify-center group-data-[collapsible=icon]:p-0!"), tooltip: label, children: [_jsx(AccountAvatar, { accountMark: accountMark, imageUrl: imageUrl }), _jsx(AccountTriggerText, { detail: detail, label: label }), _jsx(ChevronUpIcon, { className: "ml-auto size-3.5 text-sidebar-foreground/42 group-data-[collapsible=icon]:hidden" })] }) }));
23
23
  }
24
24
  function AccountTriggerText({ detail, label }) {
25
- return (_jsxs("span", { className: "grid min-w-0 flex-1 gap-0.5 text-left group-data-[collapsible=icon]:hidden", children: [_jsx("span", { className: "truncate text-sm leading-4 font-control", children: label }), _jsx("span", { className: "truncate text-xs leading-3 text-sidebar-foreground/46", children: detail })] }));
25
+ return (_jsxs("span", { className: "grid min-w-0 flex-1 gap-0.5 text-left group-data-[collapsible=icon]:hidden", children: [_jsx("span", { className: "font-control truncate text-sm leading-4", children: label }), _jsx("span", { className: "truncate text-xs leading-3 text-sidebar-foreground/46", children: detail })] }));
26
26
  }
27
27
  function AccountMenuLabel({ accountMark, detail, imageUrl, label, }) {
28
- return (_jsx(DropdownMenuLabel, { className: "p-0 normal-case tracking-normal text-popover-foreground", children: _jsxs("div", { className: "flex min-w-0 items-center gap-(--control-gap) px-(--menu-item-padding-x) py-0.5", children: [_jsx(AccountAvatar, { accountMark: accountMark, imageUrl: imageUrl }), _jsx(AccountMenuLabelText, { detail: detail, label: label })] }) }));
28
+ return (_jsx(DropdownMenuLabel, { className: "p-0 tracking-normal text-popover-foreground normal-case", children: _jsxs("div", { className: "flex min-w-0 items-center gap-(--control-gap) px-(--menu-item-padding-x) py-0.5", children: [_jsx(AccountAvatar, { accountMark: accountMark, imageUrl: imageUrl }), _jsx(AccountMenuLabelText, { detail: detail, label: label })] }) }));
29
29
  }
30
30
  function AccountMenuLabelText({ detail, label }) {
31
- return (_jsxs("span", { className: "grid min-w-0 flex-1 gap-0.5 text-left", children: [_jsx("span", { className: "truncate text-sm leading-4 font-control", children: label }), _jsx("span", { className: "truncate text-xs leading-3 text-muted-foreground", children: detail })] }));
31
+ return (_jsxs("span", { className: "grid min-w-0 flex-1 gap-0.5 text-left", children: [_jsx("span", { className: "font-control truncate text-sm leading-4", children: label }), _jsx("span", { className: "truncate text-xs leading-3 text-muted-foreground", children: detail })] }));
32
32
  }
33
33
  function AccountSignOutItem({ isSigningOut, onSignOut, }) {
34
34
  return (_jsxs(DropdownMenuItem, { className: "min-h-(--sidebar-item-height)", disabled: !onSignOut || isSigningOut, onSelect: () => onSignOut?.(), children: [isSigningOut ? _jsx(Spinner, { "aria-hidden": "true" }) : _jsx(LogOutIcon, {}), _jsx("span", { children: "Sign out" })] }));