@sciol/xyzen 0.3.9 → 0.3.11

package/README.md

@@ -1,110 +1,187 @@
-# 如何使用 Xyzen
+# Xyzen React Component
 
-Xyzen 是一个现代化、轻量级且可扩展的 React 聊天组件。它提供了一个功能齐全的侧边栏，可以轻松集成到任何 React 应用中。
+Xyzen is a modern, lightweight, and extensible chat component for React. It provides a full-featured sidebar that can be easily integrated into any React application.
 
-## 安装
+## Getting Started with Integration
 
-使用 yarn 或 npm 安装 Xyzen：
+To use the Xyzen component in your own project, you need to deploy the backend service first, then integrate the frontend component.
 
-```bash
-yarn add @sciol/xyzen@latest
-```
+### Step 1: Deploy the Backend
 
-或者
+The Xyzen component requires a running backend service to handle chat logic and LLM connections.
 
-```bash
-npm install @sciol/xyzen
-```
+1. Clone the Xyzen repository:
+
+   ```bash
+   git clone https://github.com/ScienceOL/Xyzen.git
+   cd Xyzen
+   ```
+
+2. Deploy the backend using the one-click setup script:
+
+   **On Unix/Linux/macOS:**
+
+   ```bash
+   ./launch/dev.sh
+   ```
+
+   **On Windows (PowerShell):**
+
+   ```powershell
+   .\launch\dev.ps1
+   ```
+
+   This script will automatically set up all required services (PostgreSQL, Mosquitto, Casdoor) and start the backend.
+
+3. Configure LLM provider settings by creating a `.env.dev` file in the `docker` directory with the following keys:
+
+   ```env
+   XYZEN_LLM_PROVIDER=azure_openai
+   XYZEN_LLM_KEY=<Your-LLM-API-Key>
+   XYZEN_LLM_ENDPOINT=<Your-LLM-Endpoint>
+   XYZEN_LLM_VERSION=<Your-LLM-API-Version>
+   XYZEN_LLM_DEPLOYMENT=<Your-LLM-Deployment-Name>
+   ```
+
+   The backend will be available at `http://localhost:48196` by default, with API endpoints under `/xyzen/api`, `/xyzen/ws`, and `/xyzen/mcp`.
+
+### Step 2: Install and Integrate the Frontend Component
+
+1. Install the Xyzen component in your React project:
+
+   ```bash
+   yarn add @sciol/xyzen
+   ```
+
+   or
+
+   ```bash
+   npm install @sciol/xyzen
+   ```
+
+2. Add the `Xyzen` component to your application layout:
+
+   In your root layout file (e.g., `App.tsx` or `Layout.tsx`), import and render the `Xyzen` component with the `backendUrl` prop pointing to your deployed backend:
+
+   ```tsx
+   // src/App.tsx
+   import { Xyzen, useXyzen } from "@sciol/xyzen";
+   import "@sciol/xyzen/dist/style.css"; // Import the CSS
+
+   function App() {
+     const { openXyzen } = useXyzen();
+
+     return (
+       <div>
+         <header>
+           <h1>My Application</h1>
+           <button onClick={openXyzen}>Open Chat</button>
+         </header>
+         <main>{/* Your application content */}</main>
+         <Xyzen backendUrl="http://localhost:48196" />
+       </div>
+     );
+   }
+
+   export default App;
+   ```
+
+   **Note:** The `backendUrl` should point to the base URL of your Xyzen backend deployment. The component will automatically handle endpoints like `/xyzen/api`, `/xyzen/ws`, and `/xyzen/mcp`.
+
+3. Control the Xyzen panel from any component:
+
+   Use the `useXyzen` hook to control the sidebar's visibility:
+
+   ```tsx
+   import { useXyzen } from "@sciol/xyzen";
+
+   function MyComponent() {
+     const { isXyzenOpen, toggleXyzen, openXyzen, closeXyzen } = useXyzen();
+
+     return (
+       <div>
+         <p>The chat panel is currently {isXyzenOpen ? "open" : "closed"}.</p>
+         <button onClick={toggleXyzen}>Toggle Chat</button>
+         <button onClick={openXyzen}>Open Chat</button>
+         <button onClick={closeXyzen}>Close Chat</button>
+       </div>
+     );
+   }
+   ```
 
-## 快速上手
+## Local Development
 
-`Xyzen` 组件开箱即用。它通过 `zustand` store 管理自己的状态。你可以通过 `useXyzen` hook 与其进行交互。
+To contribute to or modify the Xyzen web client source code, follow these steps.
 
-以下是如何将其集成到你的应用中的基本示例：
+### Prerequisites
 
-1.  **在你的应用布局中添加 `Xyzen` 组件**
+- Node.js with Yarn (via Corepack)
+- A running instance of the Xyzen backend service (see "Deploy the Backend" above)
 
-    在你的根布局文件（例如 `App.tsx` 或 `Layout.tsx`）中，导入并渲染 `Xyzen` 组件。
+### Setup
 
-    ```tsx
-    // src/App.tsx
-    import { Xyzen, useXyzen } from "@sciol/xyzen";
+1. Navigate to the web directory:
 
-    function App() {
-      const { openXyzen } = useXyzen();
+   ```bash
+   cd web
+   ```
 
-      return (
-        <div>
-          <header>
-            <h1>我的应用</h1>
-            <button onClick={openXyzen}>打开聊天</button>
-          </header>
-          <main>{/* 你的应用内容 */}</main>
-          <Xyzen />
-        </div>
-      );
-    }
+2. Enable Corepack to manage Yarn:
 
-    export default App;
-    ```
+   ```bash
+   corepack enable
+   ```
 
-2.  **控制 Xyzen 面板**
+3. Install dependencies using Yarn:
 
-    使用 `useXyzen` hook 来控制侧边栏的可见性。
+   ```bash
+   yarn install
+   ```
 
-    ```tsx
-    import { useXyzen } from "@sciol/xyzen";
+4. Run the development server:
 
-    function MyComponent() {
-      const { isXyzenOpen, toggleXyzen, openXyzen, closeXyzen } = useXyzen();
+   ```bash
+   yarn dev
+   ```
 
-      return (
-        <div>
-          <p>聊天面板当前是 {isXyzenOpen ? "打开" : "关闭"} 状态。</p>
-          <button onClick={toggleXyzen}>切换聊天</button>
-          <button onClick={openXyzen}>打开聊天</button>
-          <button onClick={closeXyzen}>关闭聊天</button>
-        </div>
-      );
-    }
-    ```
+   The frontend will be available at `http://localhost:32233` and will connect to the local backend service.
 
 ## `useXyzen` Store API
 
-`useXyzen` hook 提供了访问 Xyzen 状态和操作的接口。
+The `useXyzen` hook provides access to the Xyzen state and actions.
 
-### 状态 (State)
+### State
 
-- `isXyzenOpen: boolean`: 侧边栏是否打开。
-- `panelWidth: number`: 侧边栏的当前宽度。
-- `activeChatChannel: string | null`: 当前活动的聊天频道 ID。
-- `user: User | null`: 当前用户信息。
-- `activeTabIndex: number`: 当前活动的标签页索引。
-- `theme: 'light' | 'dark' | 'system'`: 当前主题。
-- `chatHistory: ChatHistoryItem[]`: 聊天历史记录列表。
-- `chatHistoryLoading: boolean`: 聊天历史是否正在加载。
-- `channels: Record<string, ChatChannel>`: 聊天频道的映射表。
-- `assistants: Assistant[]`: 可用的助手列表。
+- `isXyzenOpen: boolean`: Whether the sidebar is open.
+- `panelWidth: number`: The current width of the sidebar.
+- `activeChatChannel: string | null`: The ID of the currently active chat channel.
+- `user: User | null`: The current user information.
+- `activeTabIndex: number`: The index of the currently active tab.
+- `theme: 'light' | 'dark' | 'system'`: The current theme.
+- `chatHistory: ChatHistoryItem[]`: The list of chat history items.
+- `chatHistoryLoading: boolean`: Whether the chat history is being loaded.
+- `channels: Record<string, ChatChannel>`: A map of chat channels.
+- `assistants: Assistant[]`: The list of available assistants.
 
-### 操作 (Actions)
+### Actions
 
-- `toggleXyzen()`: 切换侧边栏的打开/关闭状态。
-- `openXyzen()`: 打开侧边栏。
-- `closeXyzen()`: 关闭侧边栏。
-- `setPanelWidth(width: number)`: 设置侧边栏的宽度。
-- `setActiveChatChannel(channelUUID: string | null)`: 设置当前活动的聊天频道。
-- `setTabIndex(index: number)`: 设置活动的标签页。
-- `setTheme(theme: Theme)`: 设置主题。
-- `fetchChatHistory(): Promise<void>`: 异步获取聊天历史记录。
-- `togglePinChat(chatId: string)`: 切换聊天的置顶状态。
-- `sendMessage(payload: { channelUUID: string; message: string })`: 发送消息到指定频道。
-- `createDefaultChannel()`: 创建一个新的默认聊天频道。
+- `toggleXyzen()`: Toggles the open/closed state of the sidebar.
+- `openXyzen()`: Opens the sidebar.
+- `closeXyzen()`: Closes the sidebar.
+- `setPanelWidth(width: number)`: Sets the width of the sidebar.
+- `setActiveChatChannel(channelUUID: string | null)`: Sets the currently active chat channel.
+- `setTabIndex(index: number)`: Sets the active tab.
+- `setTheme(theme: Theme)`: Sets the theme.
+- `fetchChatHistory(): Promise<void>`: Fetches the chat history asynchronously.
+- `togglePinChat(chatId: string)`: Toggles the pinned state of a chat.
+- `sendMessage(payload: { channelUUID: string; message: string })`: Sends a message to a specified channel.
+- `createDefaultChannel()`: Creates a new default chat channel。
 
-## 自定义
+## Customization
 
-Xyzen 设计为易于扩展。你可以利用 `useXyzen` store 中的状态和操作来构建自定义功能或与其他组件集成。
+Xyzen is designed to be extensible. You can leverage the state and actions in the `useXyzen` store to build custom functionality or integrate with other components.
 
-例如，你可以创建一个按钮，不仅可以打开 Xyzen，还可以切换到特定的标签页：
+For example, you could create a button that not only opens Xyzen but also switches to a specific tab:
 
 ```tsx
 import { useXyzen } from "@sciol/xyzen";

package/dist/app/AppSide.d.ts

@@ -2,5 +2,7 @@ export interface AppSideProps {
     backendUrl?: string;
     showLlmProvider?: boolean;
     isMobile?: boolean;
+    showAuthError?: boolean;
+    onRetryAuth?: () => void;
 }
-export declare function AppSide({ backendUrl, showLlmProvider, isMobile, }: AppSideProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function AppSide({ backendUrl, showLlmProvider, isMobile, showAuthError, onRetryAuth, }: AppSideProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/app/auth/AuthErrorScreen.d.ts

@@ -0,0 +1,6 @@
+interface AuthErrorScreenProps {
+    onRetry: () => void;
+    variant?: "fullscreen" | "inline";
+}
+declare function AuthErrorScreen({ onRetry, variant, }: AuthErrorScreenProps): import("react/jsx-runtime").JSX.Element;
+export default AuthErrorScreen;

package/dist/components/animate-ui/components/animate/tabs.d.ts

@@ -0,0 +1,12 @@
+import { TabsContentProps as TabsContentPrimitiveProps, TabsContentsProps as TabsContentsPrimitiveProps, TabsListProps as TabsListPrimitiveProps, TabsProps as TabsPrimitiveProps, TabsTriggerProps as TabsTriggerPrimitiveProps } from '../../primitives/animate/tabs';
+type TabsProps = TabsPrimitiveProps;
+declare function Tabs({ className, ...props }: TabsProps): import("react/jsx-runtime").JSX.Element;
+type TabsListProps = TabsListPrimitiveProps;
+declare function TabsList({ className, ...props }: TabsListProps): import("react/jsx-runtime").JSX.Element;
+type TabsTriggerProps = TabsTriggerPrimitiveProps;
+declare function TabsTrigger({ className, ...props }: TabsTriggerProps): import("react/jsx-runtime").JSX.Element;
+type TabsContentsProps = TabsContentsPrimitiveProps;
+declare function TabsContents(props: TabsContentsProps): import("react/jsx-runtime").JSX.Element;
+type TabsContentProps = TabsContentPrimitiveProps;
+declare function TabsContent({ className, ...props }: TabsContentProps): import("react/jsx-runtime").JSX.Element;
+export { Tabs, TabsContent, TabsContents, TabsList, TabsTrigger, type TabsContentProps, type TabsContentsProps, type TabsListProps, type TabsProps, type TabsTriggerProps, };

package/dist/components/animate-ui/components/buttons/button.d.ts

@@ -1,8 +1,8 @@
 import { VariantProps } from 'class-variance-authority';
 import { ButtonProps as ButtonPrimitiveProps } from '../../primitives/buttons/button';
 declare const buttonVariants: (props?: ({
-    variant?: "link" | "default" | "outline" | "destructive" | "secondary" | "ghost" | "accent" | null | undefined;
-    size?: "default" | "sm" | "lg" | "icon" | "icon-sm" | "icon-lg" | null | undefined;
+    variant?: "link" | "outline" | "default" | "accent" | "destructive" | "secondary" | "ghost" | null | undefined;
+    size?: "default" | "icon" | "sm" | "lg" | "icon-sm" | "icon-lg" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 type ButtonProps = ButtonPrimitiveProps & VariantProps<typeof buttonVariants>;
 declare function Button({ className, variant, size, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/animate-ui/components/buttons/flip.d.ts

@@ -0,0 +1,10 @@
+import { VariantProps } from 'class-variance-authority';
+import { buttonVariants } from './button';
+import { FlipButtonBackProps as FlipButtonBackPrimitiveProps, FlipButtonFrontProps as FlipButtonFrontPrimitiveProps, FlipButtonProps as FlipButtonPrimitiveProps } from '../../primitives/buttons/flip';
+type FlipButtonProps = FlipButtonPrimitiveProps & VariantProps<typeof buttonVariants>;
+declare function FlipButton({ variant, size, ...props }: FlipButtonProps): import("react/jsx-runtime").JSX.Element;
+type FlipButtonFrontProps = FlipButtonFrontPrimitiveProps & VariantProps<typeof buttonVariants>;
+declare function FlipButtonFront({ variant, size, className, ...props }: FlipButtonFrontProps): import("react/jsx-runtime").JSX.Element;
+type FlipButtonBackProps = FlipButtonBackPrimitiveProps & VariantProps<typeof buttonVariants>;
+declare function FlipButtonBack({ variant, size, className, ...props }: FlipButtonBackProps): import("react/jsx-runtime").JSX.Element;
+export { FlipButton, FlipButtonBack, FlipButtonFront, type FlipButtonBackProps, type FlipButtonFrontProps, type FlipButtonProps, };

package/dist/components/animate-ui/components/buttons/github-stars.d.ts

@@ -2,7 +2,7 @@ import { VariantProps } from 'class-variance-authority';
 import { GithubStarsProps } from '../../primitives/animate/github-stars';
 import { ButtonProps as ButtonPrimitiveProps } from '../../primitives/buttons/button';
 declare const buttonVariants: (props?: ({
-    variant?: "default" | "outline" | "ghost" | "accent" | null | undefined;
+    variant?: "outline" | "default" | "accent" | "ghost" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 type GitHubStarsButtonProps = Omit<ButtonPrimitiveProps & GithubStarsProps, "asChild" | "children"> & VariantProps<typeof buttonVariants>;

package/dist/components/animate-ui/components/radix/progress.d.ts

@@ -0,0 +1,4 @@
+import { ProgressProps as ProgressPrimitiveProps } from '../../primitives/radix/progress';
+type ProgressProps = ProgressPrimitiveProps;
+declare function Progress({ className, ...props }: ProgressProps): import("react/jsx-runtime").JSX.Element;
+export { Progress, type ProgressProps };

package/dist/components/animate-ui/primitives/animate/github-stars.d.ts

@@ -36,5 +36,4 @@ type GithubStarsParticlesProps = ParticlesEffectProps & {
 declare function GithubStarsParticles({ children, size, style, ...props }: GithubStarsParticlesProps): import("react/jsx-runtime").JSX.Element;
 type GithubStarsLogoProps = React.SVGProps<SVGSVGElement>;
 declare function GithubStarsLogo(props: GithubStarsLogoProps): import("react/jsx-runtime").JSX.Element;
-export { GithubStars, GithubStarsNumber, GithubStarsIcon, GithubStarsParticles, GithubStarsLogo, useGithubStars, //eslint-disable-line
-type GithubStarsProps, type GithubStarsNumberProps, type GithubStarsIconProps, type GithubStarsParticlesProps, type GithubStarsLogoProps, type GithubStarsContextType, };
+export { GithubStars, GithubStarsNumber, GithubStarsIcon, GithubStarsParticles, GithubStarsLogo, useGithubStars, type GithubStarsProps, type GithubStarsNumberProps, type GithubStarsIconProps, type GithubStarsParticlesProps, type GithubStarsLogoProps, type GithubStarsContextType, };

package/dist/components/animate-ui/primitives/animate/tabs.d.ts

@@ -0,0 +1,51 @@
+import { HTMLMotionProps, Transition } from 'motion/react';
+import { WithAsChild } from './slot';
+import { HighlightItemProps, HighlightProps } from '../effects/highlight';
+import * as React from "react";
+type TabsContextType = {
+    activeValue: string;
+    handleValueChange: (value: string) => void;
+    registerTrigger: (value: string, node: HTMLElement | null) => void;
+};
+declare const useTabs: () => TabsContextType;
+type BaseTabsProps = React.ComponentProps<"div"> & {
+    children: React.ReactNode;
+};
+type UnControlledTabsProps = BaseTabsProps & {
+    defaultValue?: string;
+    value?: never;
+    onValueChange?: never;
+};
+type ControlledTabsProps = BaseTabsProps & {
+    value: string;
+    onValueChange?: (value: string) => void;
+    defaultValue?: never;
+};
+type TabsProps = UnControlledTabsProps | ControlledTabsProps;
+declare function Tabs({ defaultValue, value, onValueChange, children, ...props }: TabsProps): import("react/jsx-runtime").JSX.Element;
+type TabsHighlightProps = Omit<HighlightProps, "controlledItems" | "value">;
+declare function TabsHighlight({ transition, ...props }: TabsHighlightProps): import("react/jsx-runtime").JSX.Element;
+type TabsListProps = React.ComponentProps<"div"> & {
+    children: React.ReactNode;
+};
+declare function TabsList(props: TabsListProps): import("react/jsx-runtime").JSX.Element;
+type TabsHighlightItemProps = HighlightItemProps & {
+    value: string;
+};
+declare function TabsHighlightItem(props: TabsHighlightItemProps): import("react/jsx-runtime").JSX.Element;
+type TabsTriggerProps = WithAsChild<{
+    value: string;
+    children: React.ReactNode;
+} & HTMLMotionProps<"button">>;
+declare function TabsTrigger({ ref, value, asChild, ...props }: TabsTriggerProps): import("react/jsx-runtime").JSX.Element;
+type TabsContentsProps = HTMLMotionProps<"div"> & {
+    children: React.ReactNode;
+    transition?: Transition;
+};
+declare function TabsContents({ children, transition, ...props }: TabsContentsProps): import("react/jsx-runtime").JSX.Element;
+type TabsContentProps = WithAsChild<{
+    value: string;
+    children: React.ReactNode;
+} & HTMLMotionProps<"div">>;
+declare function TabsContent({ value, style, asChild, ...props }: TabsContentProps): import("react/jsx-runtime").JSX.Element;
+export { Tabs, TabsContent, TabsContents, TabsHighlight, TabsHighlightItem, TabsList, TabsTrigger, useTabs, type TabsContentProps, type TabsContentsProps, type TabsContextType, type TabsHighlightItemProps, type TabsHighlightProps, type TabsListProps, type TabsProps, type TabsTriggerProps, };

package/dist/components/animate-ui/primitives/buttons/flip.d.ts

@@ -0,0 +1,18 @@
+import { HTMLMotionProps } from 'motion/react';
+import { WithAsChild } from '../animate/slot';
+type FlipDirection = "top" | "bottom" | "left" | "right";
+type FlipButtonContextType = {
+    from: FlipDirection;
+    isVertical: boolean;
+    rotateAxis: string;
+};
+declare const useFlipButton: () => FlipButtonContextType;
+type FlipButtonProps = WithAsChild<HTMLMotionProps<"button"> & {
+    from?: FlipDirection;
+    tapScale?: number;
+}>;
+declare function FlipButton({ from, tapScale, asChild, style, ...props }: FlipButtonProps): import("react/jsx-runtime").JSX.Element;
+type FlipButtonFaceProps = WithAsChild<HTMLMotionProps<"span">>;
+declare function FlipButtonFront({ transition, asChild, style, ...props }: FlipButtonFaceProps): import("react/jsx-runtime").JSX.Element;
+declare function FlipButtonBack({ transition, asChild, style, ...props }: FlipButtonFaceProps): import("react/jsx-runtime").JSX.Element;
+export { FlipButton, FlipButtonBack, FlipButtonFront, useFlipButton, type FlipButtonFaceProps as FlipButtonBackProps, type FlipButtonContextType, type FlipButtonFaceProps as FlipButtonFrontProps, type FlipButtonProps, type FlipDirection, };

package/dist/components/animate-ui/primitives/effects/highlight.d.ts

@@ -88,5 +88,4 @@ type HighlightItemProps<T extends React.ElementType = "div"> = React.ComponentPr
     forceUpdateBounds?: boolean;
 };
 declare function HighlightItem<T extends React.ElementType>({ ref, as, children, id, value, className, style, transition, disabled, activeClassName, exitDelay, asChild, forceUpdateBounds, ...props }: HighlightItemProps<T>): any;
-export { Highlight, HighlightItem, useHighlight, //eslint-disable-line
-type HighlightItemProps, type HighlightProps, };
+export { Highlight, HighlightItem, useHighlight, type HighlightItemProps, type HighlightProps, };

package/dist/components/animate-ui/primitives/headless/checkbox.d.ts

@@ -12,5 +12,4 @@ type CheckboxProps<TTag extends React.ElementType = typeof motion.button> = Chec
 declare function Checkbox<TTag extends React.ElementType = typeof motion.button>({ children, ...props }: CheckboxProps<TTag>): import("react/jsx-runtime").JSX.Element;
 type CheckboxIndicatorProps = SVGMotionProps<SVGSVGElement>;
 declare function CheckboxIndicator(props: CheckboxIndicatorProps): import("react/jsx-runtime").JSX.Element;
-export { Checkbox, CheckboxIndicator, useCheckbox, //eslint-disable-line
-type CheckboxContextType, type CheckboxIndicatorProps, type CheckboxProps, };
+export { Checkbox, CheckboxIndicator, useCheckbox, type CheckboxContextType, type CheckboxIndicatorProps, type CheckboxProps, };

package/dist/components/animate-ui/primitives/radix/dropdown-menu.d.ts

@@ -52,6 +52,4 @@ type DropdownMenuShortcutProps = React.ComponentProps<"span">;
 declare function DropdownMenuShortcut(props: DropdownMenuShortcutProps): import("react/jsx-runtime").JSX.Element;
 type DropdownMenuItemIndicatorProps = Omit<React.ComponentProps<typeof DropdownMenuPrimitive.ItemIndicator>, "asChild"> & HTMLMotionProps<"div">;
 declare function DropdownMenuItemIndicator(props: DropdownMenuItemIndicatorProps): import("react/jsx-runtime").JSX.Element;
-export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuHighlight, DropdownMenuHighlightItem, DropdownMenuItem, DropdownMenuItemIndicator, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, useDropdownMenu, //eslint-disable-line
-useDropdownMenuSub, //eslint-disable-line
-type DropdownMenuCheckboxItemProps, type DropdownMenuContentProps, type DropdownMenuContextType, type DropdownMenuGroupProps, type DropdownMenuHighlightItemProps, type DropdownMenuHighlightProps, type DropdownMenuItemIndicatorProps, type DropdownMenuItemProps, type DropdownMenuLabelProps, type DropdownMenuPortalProps, type DropdownMenuProps, type DropdownMenuRadioGroupProps, type DropdownMenuRadioItemProps, type DropdownMenuSeparatorProps, type DropdownMenuShortcutProps, type DropdownMenuSubContentProps, type DropdownMenuSubContextType, type DropdownMenuSubProps, type DropdownMenuSubTriggerProps, type DropdownMenuTriggerProps, };
+export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuHighlight, DropdownMenuHighlightItem, DropdownMenuItem, DropdownMenuItemIndicator, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, useDropdownMenu, useDropdownMenuSub, type DropdownMenuCheckboxItemProps, type DropdownMenuContentProps, type DropdownMenuContextType, type DropdownMenuGroupProps, type DropdownMenuHighlightItemProps, type DropdownMenuHighlightProps, type DropdownMenuItemIndicatorProps, type DropdownMenuItemProps, type DropdownMenuLabelProps, type DropdownMenuPortalProps, type DropdownMenuProps, type DropdownMenuRadioGroupProps, type DropdownMenuRadioItemProps, type DropdownMenuSeparatorProps, type DropdownMenuShortcutProps, type DropdownMenuSubContentProps, type DropdownMenuSubContextType, type DropdownMenuSubProps, type DropdownMenuSubTriggerProps, type DropdownMenuTriggerProps, };