@lark-apaas/client-toolkit 0.1.0-alpha.1 → 0.2.0-alpha.user.1

package/lib/components/ui/avatar.js

@@ -0,0 +1,27 @@
+"use client"
+import { jsx } from "react/jsx-runtime";
+import "react";
+import { Fallback, Image, Root } from "@radix-ui/react-avatar";
+import { clsxWithTw } from "../../utils/utils.js";
+function Avatar({ className, ...props }) {
+    return /*#__PURE__*/ jsx(Root, {
+        "data-slot": "avatar",
+        className: clsxWithTw("relative flex size-8 shrink-0 overflow-hidden rounded-full", className),
+        ...props
+    });
+}
+function AvatarImage({ className, ...props }) {
+    return /*#__PURE__*/ jsx(Image, {
+        "data-slot": "avatar-image",
+        className: clsxWithTw("aspect-square size-full", className),
+        ...props
+    });
+}
+function AvatarFallback({ className, ...props }) {
+    return /*#__PURE__*/ jsx(Fallback, {
+        "data-slot": "avatar-fallback",
+        className: clsxWithTw("bg-muted flex size-full items-center justify-center rounded-full", className),
+        ...props
+    });
+}
+export { Avatar, AvatarFallback, AvatarImage };

package/lib/components/ui/badge.d.ts

@@ -0,0 +1,9 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare const badgeVariants: (props?: {
+    variant?: "default" | "secondary" | "destructive" | "outline";
+} & import("class-variance-authority/dist/types").ClassProp) => string;
+declare function Badge({ className, variant, asChild, ...props }: React.ComponentProps<"span"> & VariantProps<typeof badgeVariants> & {
+    asChild?: boolean;
+}): React.JSX.Element;
+export { Badge, badgeVariants };

package/lib/components/ui/badge.js

@@ -0,0 +1,29 @@
+import { jsx } from "react/jsx-runtime";
+import "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { clsxWithTw } from "../../utils/utils.js";
+const badgeVariants = cva("inline-flex items-center justify-center rounded-md border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden", {
+    variants: {
+        variant: {
+            default: "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
+            secondary: "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
+            destructive: "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+            outline: "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground"
+        }
+    },
+    defaultVariants: {
+        variant: "default"
+    }
+});
+function Badge({ className, variant, asChild = false, ...props }) {
+    const Comp = asChild ? Slot : "span";
+    return /*#__PURE__*/ jsx(Comp, {
+        "data-slot": "badge",
+        className: clsxWithTw(badgeVariants({
+            variant
+        }), className),
+        ...props
+    });
+}
+export { Badge, badgeVariants };

package/lib/components/ui/button.d.ts

@@ -0,0 +1,10 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare const buttonVariants: (props?: {
+    variant?: "default" | "link" | "secondary" | "destructive" | "outline" | "ghost";
+    size?: "default" | "sm" | "lg" | "icon" | "icon-sm" | "icon-lg";
+} & import("class-variance-authority/dist/types").ClassProp) => string;
+declare function Button({ className, variant, size, asChild, ...props }: React.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
+    asChild?: boolean;
+}): React.JSX.Element;
+export { Button, buttonVariants };

package/lib/components/ui/button.js

@@ -0,0 +1,42 @@
+import { jsx } from "react/jsx-runtime";
+import "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { clsxWithTw } from "../../utils/utils.js";
+const buttonVariants = cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", {
+    variants: {
+        variant: {
+            default: "bg-primary text-primary-foreground hover:bg-primary/90",
+            destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+            outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+            secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+            ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
+            link: "text-primary underline-offset-4 hover:underline"
+        },
+        size: {
+            default: "h-9 px-4 py-2 has-[>svg]:px-3",
+            sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+            lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+            icon: "size-9",
+            "icon-sm": "size-8",
+            "icon-lg": "size-10"
+        }
+    },
+    defaultVariants: {
+        variant: "default",
+        size: "default"
+    }
+});
+function Button({ className, variant, size, asChild = false, ...props }) {
+    const Comp = asChild ? Slot : "button";
+    return /*#__PURE__*/ jsx(Comp, {
+        "data-slot": "button",
+        className: clsxWithTw(buttonVariants({
+            variant,
+            size,
+            className
+        })),
+        ...props
+    });
+}
+export { Button, buttonVariants };

package/lib/components/ui/input.d.ts

@@ -0,0 +1,3 @@
+import * as React from "react";
+declare const Input: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
+export { Input };

package/lib/components/ui/input.js

@@ -0,0 +1,12 @@
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { clsxWithTw } from "../../utils/utils.js";
+const Input = /*#__PURE__*/ forwardRef(({ className, type, ...props }, ref)=>/*#__PURE__*/ jsx("input", {
+        ref: ref,
+        type: type,
+        "data-slot": "input",
+        className: clsxWithTw("file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]", "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", className),
+        ...props
+    }));
+Input.displayName = "Input";
+export { Input };

package/lib/components/ui/overflow-tooltip-text.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+export interface OverflowTooltipTextProps extends React.HTMLAttributes<HTMLSpanElement> {
+    text: string;
+}
+/**
+ * Displays truncated inline text and shows a tooltip with the full content when overflowed.
+ */
+export declare function OverflowTooltipText({ text, className, ...props }: OverflowTooltipTextProps): React.JSX.Element;

package/lib/components/ui/overflow-tooltip-text.js

@@ -0,0 +1,66 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useLayoutEffect, useRef, useState } from "react";
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "./tooltip.js";
+import { clsxWithTw } from "../../utils/utils.js";
+function OverflowTooltipText({ text, className, ...props }) {
+    const textRef = useRef(null);
+    const [isOverflowing, setIsOverflowing] = useState(false);
+    const checkOverflow = useCallback(()=>{
+        const el = textRef.current;
+        if (!el) return;
+        setIsOverflowing(el.scrollWidth > el.clientWidth + 1);
+    }, []);
+    useLayoutEffect(()=>{
+        checkOverflow();
+    }, [
+        checkOverflow
+    ]);
+    useEffect(()=>{
+        const el = textRef.current;
+        if (!el) return;
+        const observer = new ResizeObserver(()=>{
+            checkOverflow();
+        });
+        observer.observe(el);
+        return ()=>{
+            observer.disconnect();
+        };
+    }, [
+        checkOverflow
+    ]);
+    useEffect(()=>{
+        const handleResize = ()=>{
+            checkOverflow();
+        };
+        window.addEventListener('resize', handleResize);
+        return ()=>{
+            window.removeEventListener('resize', handleResize);
+        };
+    }, [
+        checkOverflow
+    ]);
+    const textNode = /*#__PURE__*/ jsx("span", {
+        ref: textRef,
+        className: clsxWithTw('inline-block truncate', className),
+        ...props,
+        children: text
+    });
+    if (!isOverflowing) return textNode;
+    return /*#__PURE__*/ jsx(TooltipProvider, {
+        children: /*#__PURE__*/ jsxs(Tooltip, {
+            delayDuration: 80,
+            children: [
+                /*#__PURE__*/ jsx(TooltipTrigger, {
+                    asChild: true,
+                    children: textNode
+                }),
+                /*#__PURE__*/ jsx(TooltipContent, {
+                    sideOffset: 4,
+                    className: "bg-[rgb(31,35,41)] text-white ring-0",
+                    children: text
+                })
+            ]
+        })
+    });
+}
+export { OverflowTooltipText };

package/lib/components/ui/popover.d.ts

@@ -0,0 +1,7 @@
+import * as React from "react";
+import * as PopoverPrimitive from "@radix-ui/react-popover";
+declare function Popover({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Root>): React.JSX.Element;
+declare function PopoverTrigger({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Trigger>): React.JSX.Element;
+declare function PopoverContent({ className, align, sideOffset, ...props }: React.ComponentProps<typeof PopoverPrimitive.Content>): React.JSX.Element;
+declare function PopoverAnchor({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Anchor>): React.JSX.Element;
+export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor };

package/lib/components/ui/popover.js

@@ -0,0 +1,35 @@
+"use client"
+import { jsx } from "react/jsx-runtime";
+import "react";
+import { Anchor, Content, Portal, Root, Trigger } from "@radix-ui/react-popover";
+import { clsxWithTw } from "../../utils/utils.js";
+function Popover({ ...props }) {
+    return /*#__PURE__*/ jsx(Root, {
+        "data-slot": "popover",
+        ...props
+    });
+}
+function PopoverTrigger({ ...props }) {
+    return /*#__PURE__*/ jsx(Trigger, {
+        "data-slot": "popover-trigger",
+        ...props
+    });
+}
+function PopoverContent({ className, align = "center", sideOffset = 4, ...props }) {
+    return /*#__PURE__*/ jsx(Portal, {
+        children: /*#__PURE__*/ jsx(Content, {
+            "data-slot": "popover-content",
+            align: align,
+            sideOffset: sideOffset,
+            className: clsxWithTw("bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 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 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden", className),
+            ...props
+        })
+    });
+}
+function PopoverAnchor({ ...props }) {
+    return /*#__PURE__*/ jsx(Anchor, {
+        "data-slot": "popover-anchor",
+        ...props
+    });
+}
+export { Popover, PopoverAnchor, PopoverContent, PopoverTrigger };

package/lib/components/ui/skeleton.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+export type SkeletonProps = React.HTMLAttributes<HTMLDivElement>;
+/**
+ * Minimal shadcn/ui-compatible Skeleton primitive.
+ * Mirrors the upstream API so that downstream components can swap in seamlessly.
+ */
+export declare const Skeleton: React.ForwardRefExoticComponent<SkeletonProps & React.RefAttributes<HTMLDivElement>>;

package/lib/components/ui/skeleton.js

@@ -0,0 +1,10 @@
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { clsxWithTw } from "../../utils/utils.js";
+const Skeleton = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx("div", {
+        ref: ref,
+        className: clsxWithTw('animate-pulse rounded-md bg-accent', className),
+        ...props
+    }));
+Skeleton.displayName = 'Skeleton';
+export { Skeleton };

package/lib/components/ui/tooltip.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import * as TooltipPrimitive from '@radix-ui/react-tooltip';
+declare const TooltipProvider: React.FC<TooltipPrimitive.TooltipProviderProps>;
+declare const Tooltip: React.FC<TooltipPrimitive.TooltipProps>;
+declare const TooltipTrigger: React.ForwardRefExoticComponent<TooltipPrimitive.TooltipTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const TooltipContent: React.ForwardRefExoticComponent<Omit<TooltipPrimitive.TooltipContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };

package/lib/components/ui/tooltip.js

@@ -0,0 +1,24 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { Arrow, Content, Portal, Provider, Root, Trigger } from "@radix-ui/react-tooltip";
+import { clsxWithTw } from "../../utils/utils.js";
+const TooltipProvider = Provider;
+const Tooltip = Root;
+const TooltipTrigger = Trigger;
+const TooltipContent = /*#__PURE__*/ forwardRef(({ className, sideOffset = 4, children, ...props }, ref)=>/*#__PURE__*/ jsx(Portal, {
+        children: /*#__PURE__*/ jsxs(Content, {
+            ref: ref,
+            sideOffset: sideOffset,
+            className: clsxWithTw('z-50 w-fit rounded-md bg-popover px-3 py-1.5 text-xs text-popover-foreground shadow-lg ring-1 ring-border data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 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 animate-in fade-in-0 zoom-in-95', className),
+            ...props,
+            children: [
+                children,
+                /*#__PURE__*/ jsx(Arrow, {
+                    className: "fill-[rgb(31,35,41)] stroke-[rgb(31,35,41)]"
+                })
+            ]
+        })
+    }));
+TooltipContent.displayName = Content.displayName;
+export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };

package/lib/override.css

@@ -1,19 +1,3 @@
-.miao-top-nav {
-  & .ant-menu-overflow.ant-menu-horizontal > .ant-menu-item:after, & .ant-menu-overflow > .ant-menu.ant-menu-horizontal > .ant-menu-item:after, & .ant-menu-overflow.ant-menu-horizontal > .ant-menu-submenu:after, & .ant-menu-overflow > .ant-menu.ant-menu-horizontal > .ant-menu-submenu:after {
-    bottom: 1px !important;
-  }
-}
-
-.miao-nav {
-  & .ant-drawer-content-wrapper {
-    width: inherit !important;
-  }
-
-  &.ant-btn-color-default.ant-btn-variant-link:not(:disabled):not(.ant-btn-disabled):hover {
-    color: inherit;
-  }
-}
-
 .ant-btn .ant-btn-icon {
   align-items: center;
   display: inline-flex;

package/lib/types/index.d.ts

@@ -1,33 +1,4 @@
-import { type ComponentType } from 'react';
 export type ITheme = 'dark' | 'light' | 'system';
-export interface NavItemProps {
-    name: string;
-    to: string;
-    icon?: ComponentType<{
-        className?: string;
-    }>;
-    children?: NavItemProps[];
-    className?: string;
-    hasBadge?: boolean;
-    direction?: 'horizontal' | 'vertical';
-    onClick?: () => void;
-    hideActive?: boolean;
-}
-export interface BaseNavProps {
-    navList?: NavItemProps[];
-    className?: string;
-    activeClassName?: string;
-}
-export interface NavProps extends BaseNavProps {
-    /** 亮色主题下的主色 */
-    lightColorPrimary?: string;
-    /** 暗色主题下的主色 */
-    darkColorPrimary?: string;
-    /**
-     * 移动端导航栏 变体
-     */
-    mobileVariant?: 'normal' | 'dropdown';
-}
 declare global {
     interface Window {
         token?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lark-apaas/client-toolkit",
-  "version": "0.1.0-alpha.1",
+  "version": "0.2.0-alpha.user.1",
   "types": "./lib/index.d.ts",
   "main": "./lib/index.js",
   "files": [
@@ -77,8 +77,13 @@
     "@ant-design/colors": "^7.2.1",
     "@ant-design/cssinjs": "^1.24.0",
     "@data-loom/js": "0.3.1",
-    "@lark-apaas/miaoda-inspector": "0.1.0-alpha.8",
+    "@lark-apaas/miaoda-inspector": "^1.0.0",
+    "@radix-ui/react-avatar": "^1.1.10",
+    "@radix-ui/react-popover": "^1.1.15",
+    "@radix-ui/react-slot": "^1.2.3",
+    "@radix-ui/react-tooltip": "^1.2.8",
     "@zumer/snapdom": "^1.9.14",
+    "class-variance-authority": "^0.7.1",
     "clsx": "~2.0.1",
     "dayjs": "^1.11.13",
     "echarts": "^6.0.0",
@@ -103,6 +108,7 @@
     "@storybook/blocks": "^8.6.14",
     "@storybook/react": "^8.6.14",
     "@storybook/test": "^8.6.14",
+    "@tailwindcss/postcss": "^4.1.0",
     "@testing-library/jest-dom": "^6.6.4",
     "@testing-library/react": "^16.3.0",
     "@types/lodash": "^4.17.20",
@@ -113,7 +119,7 @@
     "antd": "^5.26.6",
     "eslint": "^8.57.0",
     "jsdom": "^26.1.0",
-    "lucide-react": "npm:@lark-apaas/lucide-react@0.1.0-alpha.5",
+    "lucide-react": "npm:@lark-apaas/lucide-react@1.0.2",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-router-dom": "^6.26.2",

package/lib/apis/components/SidebarNav.d.ts

@@ -1 +0,0 @@
-export { default as SidebarNav } from '../../components/SidebarNav';

package/lib/apis/components/SidebarNav.js

@@ -1,2 +0,0 @@
-import SidebarNav from "../../components/SidebarNav/index.js";
-export { SidebarNav };

package/lib/components/SidebarNav/DrawerNav.d.ts

@@ -1,3 +0,0 @@
-import * as React from 'react';
-import { BaseNavProps } from '../../types';
-export default function DrawerNav({ navList, className, activeClassName, }: BaseNavProps): React.JSX.Element;

package/lib/components/SidebarNav/DrawerNav.js

@@ -1,64 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import { Button, Drawer } from "antd";
-import { Menu } from "lucide-react";
-import { clsxWithTw } from "../../utils/utils.js";
-import { LogoInfo, NavMenu, TopHeaderThemeClass, UserAvatarLayout } from "../common/index.js";
-function DrawerNav({ navList, className, activeClassName }) {
-    const [open, setOpen] = useState(false);
-    const showDrawer = ()=>{
-        setOpen(true);
-    };
-    const onClose = ()=>{
-        setOpen(false);
-    };
-    return /*#__PURE__*/ jsxs("div", {
-        className: clsxWithTw('w-full sticky top-0 z-50 flex flex-row h-14 px-3 items-center', TopHeaderThemeClass, className),
-        children: [
-            /*#__PURE__*/ jsx(Button, {
-                type: "text",
-                onClick: showDrawer,
-                className: "md:hidden px-0 text-inherit border-0",
-                children: /*#__PURE__*/ jsx(Menu, {
-                    className: "h-6 w-6"
-                })
-            }),
-            /*#__PURE__*/ jsx(LogoInfo, {
-                className: "ml-[6px] pl-3"
-            }),
-            /*#__PURE__*/ jsxs(Drawer, {
-                placement: "left",
-                rootClassName: "miao-nav",
-                closeIcon: null,
-                classNames: {
-                    body: clsxWithTw('w-full h-full flex flex-col p-0', className),
-                    content: 'w-[320px]'
-                },
-                onClose: onClose,
-                open: open,
-                children: [
-                    /*#__PURE__*/ jsx("div", {
-                        className: "w-full h-14",
-                        children: /*#__PURE__*/ jsx(LogoInfo, {
-                            className: "pl-5 pr-3 h-full flex items-center"
-                        })
-                    }),
-                    /*#__PURE__*/ jsx("div", {
-                        className: "flex-1 overflow-auto min-h-0",
-                        children: /*#__PURE__*/ jsx(NavMenu, {
-                            navList: navList,
-                            className: clsxWithTw('border-0', className),
-                            activeClassName: activeClassName,
-                            mode: "vertical",
-                            onClick: onClose
-                        })
-                    }),
-                    /*#__PURE__*/ jsx(UserAvatarLayout, {
-                        className: "mt-2"
-                    })
-                ]
-            })
-        ]
-    });
-}
-export { DrawerNav as default };

package/lib/components/SidebarNav/DropdownNav.d.ts

@@ -1,3 +0,0 @@
-import * as React from 'react';
-import { BaseNavProps } from '../../types';
-export default function DropdownNav({ navList, className, activeClassName, }: BaseNavProps): React.JSX.Element;

package/lib/components/SidebarNav/DropdownNav.js

@@ -1,40 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import { Menu, X } from "lucide-react";
-import { clsxWithTw } from "../../utils/utils.js";
-import { DropdownThemeClass, LogoInfo, NavMenu, TopHeaderThemeClass, UserAvatarMenu } from "../common/index.js";
-function DropdownNav({ navList = [], className, activeClassName }) {
-    const [isMenuOpen, setIsMenuOpen] = useState(false);
-    const MenuDropdownIcon = isMenuOpen ? X : Menu;
-    return /*#__PURE__*/ jsxs("header", {
-        className: clsxWithTw('w-full flex sticky top-0 z-50 h-14 px-3 gap-1.5 items-center', TopHeaderThemeClass, isMenuOpen ? 'border-transparent' : '', className),
-        children: [
-            navList.length > 0 ? /*#__PURE__*/ jsx("div", {
-                className: "md:hidden flex mr-3",
-                children: /*#__PURE__*/ jsx(MenuDropdownIcon, {
-                    className: "h-6 w-6 cursor-pointer",
-                    onClick: ()=>setIsMenuOpen(!isMenuOpen)
-                })
-            }) : null,
-            /*#__PURE__*/ jsx(LogoInfo, {
-                className: "flex-1"
-            }),
-            /*#__PURE__*/ jsx(UserAvatarMenu, {
-                className: className
-            }),
-            isMenuOpen && navList.length > 0 ? /*#__PURE__*/ jsx("div", {
-                className: clsxWithTw('overflow-y-auto max-h-[482px] px-2 pb-2 absolute top-14 left-0 right-0 shadow-lg', DropdownThemeClass, className),
-                children: /*#__PURE__*/ jsx(NavMenu, {
-                    navList: navList,
-                    className: className,
-                    activeClassName: activeClassName,
-                    onClick: (_key)=>{
-                        setIsMenuOpen(false);
-                    },
-                    mode: "vertical"
-                })
-            }) : null
-        ]
-    });
-}
-export { DropdownNav as default };

package/lib/components/SidebarNav/Sidebar.d.ts

@@ -1,3 +0,0 @@
-import * as React from 'react';
-import { NavProps } from '../../types';
-export default function SidebarNav({ activeClassName, className, navList, }: NavProps): React.JSX.Element;

package/lib/components/SidebarNav/Sidebar.js

@@ -1,33 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import "react";
-import { clsxWithTw } from "../../utils/utils.js";
-import { LogoInfo, NavMenu, TopHeaderThemeClass, UserAvatarLayout } from "../common/index.js";
-function SidebarNav({ activeClassName, className, navList }) {
-    return /*#__PURE__*/ jsx("div", {
-        className: clsxWithTw('h-full overflow-y-auto scrollbar-none w-[260px] dark:border-gray-800', className),
-        children: /*#__PURE__*/ jsxs("div", {
-            className: clsxWithTw('fixed top-0 bottom-0 left-0 w-[260px] flex flex-col border-r', TopHeaderThemeClass, className),
-            children: [
-                /*#__PURE__*/ jsx("div", {
-                    className: "w-full px-2 pt-2 h-12 mb-3",
-                    children: /*#__PURE__*/ jsx(LogoInfo, {
-                        className: "px-2 pt-[9px] pb-[15px]"
-                    })
-                }),
-                /*#__PURE__*/ jsx("div", {
-                    className: "flex-1 overflow-auto min-h-0",
-                    children: /*#__PURE__*/ jsx(NavMenu, {
-                        navList: navList,
-                        className: clsxWithTw('border-0', className),
-                        activeClassName: activeClassName,
-                        mode: "vertical"
-                    })
-                }),
-                /*#__PURE__*/ jsx(UserAvatarLayout, {
-                    className: "mt-2"
-                })
-            ]
-        })
-    });
-}
-export { SidebarNav as default };

package/lib/components/SidebarNav/index.d.ts

@@ -1,5 +0,0 @@
-import * as React from 'react';
-import { NavProps } from '../../types';
-export declare function SideNavigation(props: NavProps): React.JSX.Element;
-export { SideNavigation as SidebarNav };
-export default SideNavigation;

package/lib/components/SidebarNav/index.js

@@ -1,61 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { useEffect, useMemo } from "react";
-import { useIsMobile } from "../../hooks/useIsMobile.js";
-import { useLocation } from "react-router-dom";
-import DrawerNav from "./DrawerNav.js";
-import Sidebar from "./Sidebar.js";
-import DropdownNav from "./DropdownNav.js";
-import { ConfigProvider } from "antd";
-import { generateDarkTheme, generateLightTheme } from "../theme/util.js";
-import { useTheme } from "../../hooks/useTheme.js";
-function SideNavigationBar({ navList = [], className, activeClassName, mobileVariant = 'normal' }) {
-    const isMobile = useIsMobile();
-    const location = useLocation();
-    useEffect(()=>{
-        window.scrollTo(0, 0);
-    }, [
-        location.pathname
-    ]);
-    if (isMobile) {
-        if ('dropdown' === mobileVariant) return /*#__PURE__*/ jsx(DropdownNav, {
-            navList: navList,
-            className: className,
-            activeClassName: activeClassName
-        });
-        return /*#__PURE__*/ jsx(DrawerNav, {
-            navList: navList,
-            className: className,
-            activeClassName: activeClassName
-        });
-    }
-    return /*#__PURE__*/ jsx(Sidebar, {
-        navList: navList,
-        className: className,
-        activeClassName: activeClassName
-    });
-}
-function SideNavigation(props) {
-    const { theme } = useTheme();
-    const { darkColorPrimary, lightColorPrimary } = props;
-    const themeToken = useMemo(()=>{
-        if ('dark' === theme && darkColorPrimary) return generateDarkTheme({
-            colorPrimary: darkColorPrimary
-        });
-        if ('light' === theme && lightColorPrimary) return generateLightTheme({
-            colorPrimary: lightColorPrimary
-        });
-        return {};
-    }, [
-        theme,
-        darkColorPrimary,
-        lightColorPrimary
-    ]);
-    return /*#__PURE__*/ jsx(ConfigProvider, {
-        theme: themeToken,
-        children: /*#__PURE__*/ jsx(SideNavigationBar, {
-            ...props
-        })
-    });
-}
-const SidebarNav = SideNavigation;
-export { SideNavigation, SideNavigation as SidebarNav, SidebarNav as default };