@ldkj/web-ui 0.8.2 → 0.10.0

package/LICENSE

@@ -1,21 +1,21 @@
-MIT License
-
-Copyright (c) 2026 ldkj
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+MIT License
+
+Copyright (c) 2026 ldkj
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,27 +1,27 @@
-# @ldkj/web-ui
-
-由 shadcn-ui, Tailwind CSS 和 VitePress 构建的 React 组件库.
-
-## 立即开始
-
-```bash
-pnpm add @ldkj/web-ui
-```
-
-## 使用示例
-
-```tsx
-import "@ldkj/web-ui/style.css";
-import { Button, Chip } from "@ldkj/web-ui";
-
-export default function App() {
-  return (
-    <div className="p-4">
-      <Button variant="primary">Hello World</Button>
-      <Chip variant="success" size="sm">
-        Ready
-      </Chip>
-    </div>
-  );
-}
-```
+# @ldkj/web-ui
+
+由 shadcn-ui, Tailwind CSS 和 VitePress 构建的 React 组件库.
+
+## 立即开始
+
+```bash
+pnpm add @ldkj/web-ui
+```
+
+## 使用示例
+
+```tsx
+import "@ldkj/web-ui/style.css";
+import { Button, Chip } from "@ldkj/web-ui";
+
+export default function App() {
+  return (
+    <div className="p-4">
+      <Button variant="primary">Hello World</Button>
+      <Chip variant="success" size="sm">
+        Ready
+      </Chip>
+    </div>
+  );
+}
+```

package/components/navigation/menu/Menu.d.ts

@@ -0,0 +1,121 @@
+import * as React from "react";
+import type { CSSProperties, ElementType, ReactElement } from "react";
+import { type IconProps } from "@/components/data-display/icon";
+import { type BoxProps } from "@/components/layout/box";
+import { type SxProps } from "@/styling";
+type MenuKey = string;
+type StyledProps = {
+    className?: string;
+    class?: string;
+    style?: CSSProperties;
+    sx?: SxProps;
+};
+type MenuChangeInfo = {
+    key: MenuKey;
+    keys: MenuKey[];
+};
+export type MenuItemColors = {
+    itemText?: string;
+    itemBackground?: string;
+    itemHoverText?: string;
+    itemHoverBackground?: string;
+    itemSelectedText?: string;
+    itemSelectedBackground?: string;
+    itemSelectedHoverText?: string;
+    itemDisabledText?: string;
+};
+export type MenuRef = {
+    select: (key: MenuKey) => void;
+    unselect: (key: MenuKey) => void;
+    open: (key: MenuKey) => void;
+    close: (key: MenuKey) => void;
+    toggleOpen: (key: MenuKey) => void;
+    getSelectedKeys: () => MenuKey[];
+    getOpenKeys: () => MenuKey[];
+};
+/**
+ * 创建 `Menu` 的命令式控制引用，适合配合 `menuRef` 属性使用。
+ */
+export declare function useMenuRef(): React.RefObject<MenuRef>;
+declare function MenuList(props: React.ComponentPropsWithoutRef<"ul"> & StyledProps): import("react/jsx-runtime").JSX.Element;
+declare namespace MenuList {
+    var displayName: string;
+}
+export type MenuItemProps<T extends ElementType = "button"> = Omit<React.ComponentPropsWithoutRef<T>, "as" | "className" | "style" | "children" | "disabled" | "onClick"> & StyledProps & {
+    itemKey: MenuKey;
+    label?: React.ReactNode;
+    icon?: IconProps["name"];
+    iconProps?: Omit<IconProps, "name">;
+    href?: string;
+    component?: T;
+    disabled?: boolean;
+    selected?: boolean;
+    unselectOnClick?: boolean;
+    onClick?: React.MouseEventHandler<Element>;
+    onSelect?: (key: MenuKey) => void;
+    children?: React.ReactNode;
+};
+declare function MenuItem<T extends ElementType = "button">(props: MenuItemProps<T>): import("react/jsx-runtime").JSX.Element;
+declare namespace MenuItem {
+    var displayName: string;
+}
+export type MenuSubProps = Omit<React.ComponentPropsWithoutRef<"li">, "className" | "style" | "children" | "title"> & StyledProps & {
+    itemKey: MenuKey;
+    label: React.ReactNode;
+    icon?: IconProps["name"];
+    iconProps?: Omit<IconProps, "name">;
+    disabled?: boolean;
+    children?: React.ReactNode;
+};
+declare function MenuSub(props: MenuSubProps): import("react/jsx-runtime").JSX.Element;
+declare namespace MenuSub {
+    var displayName: string;
+}
+export type MenuGroupProps = Omit<React.ComponentPropsWithoutRef<"li">, "className" | "style" | "children" | "title"> & StyledProps & {
+    label?: React.ReactNode;
+    children?: React.ReactNode;
+};
+declare function MenuGroup(props: MenuGroupProps): import("react/jsx-runtime").JSX.Element;
+declare namespace MenuGroup {
+    var displayName: string;
+}
+export type MenuItemConfig = {
+    key?: MenuKey;
+    label: React.ReactNode;
+    icon?: IconProps["name"];
+    iconProps?: Omit<IconProps, "name">;
+    href?: string;
+    disabled?: boolean;
+    children?: MenuItemConfig[];
+    type?: "item" | "sub" | "group";
+    unselectOnClick?: boolean;
+    itemProps?: Omit<MenuItemProps, "itemKey" | "label" | "icon" | "iconProps" | "href" | "disabled" | "children">;
+    subProps?: Omit<MenuSubProps, "itemKey" | "label" | "icon" | "iconProps" | "disabled" | "children">;
+    groupProps?: Omit<MenuGroupProps, "label" | "children">;
+};
+export type MenuProps<T extends ElementType = "nav"> = Omit<BoxProps<T>, "children"> & {
+    items?: MenuItemConfig[];
+    selectedKeys?: MenuKey[];
+    defaultSelectedKeys?: MenuKey[];
+    onSelectedKeysChange?: (keys: MenuKey[], info: MenuChangeInfo) => void;
+    openKeys?: MenuKey[];
+    defaultOpenKeys?: MenuKey[];
+    onOpenKeysChange?: (keys: MenuKey[], info: MenuChangeInfo) => void;
+    multiple?: boolean;
+    accordion?: boolean;
+    indent?: number;
+    itemGap?: number | string;
+    itemColors?: MenuItemColors;
+    menuRef?: React.Ref<MenuRef>;
+    children?: React.ReactNode;
+    listProps?: React.ComponentPropsWithoutRef<"ul"> & StyledProps;
+};
+type MenuCompound = {
+    Item: typeof MenuItem;
+    Sub: typeof MenuSub;
+    Group: typeof MenuGroup;
+    List: typeof MenuList;
+};
+type MenuComponent = (<T extends ElementType = "nav">(props: MenuProps<T>) => ReactElement | null) & MenuCompound;
+export declare const Menu: MenuComponent;
+export {};

package/components/navigation/menu/index.d.ts

@@ -0,0 +1 @@
+export * from "./Menu";

package/components/navigation/tabs/index.d.ts

@@ -0,0 +1 @@
+export * from "./tabs";

package/components/navigation/tabs/tabs.d.ts

@@ -0,0 +1,36 @@
+import * as React from "react";
+import * as TabsPrimitive from "@radix-ui/react-tabs";
+import { type SxProps } from "@/styling";
+type StyledProps = {
+    className?: string;
+    class?: string;
+    style?: React.CSSProperties;
+    sx?: SxProps;
+};
+export type TabsItemConfig = {
+    value: string;
+    label: React.ReactNode;
+    content?: React.ReactNode;
+    disabled?: boolean;
+    triggerProps?: Omit<TabsTriggerProps, "value" | "children" | "disabled">;
+    contentProps?: Omit<TabsContentProps, "value" | "children">;
+};
+export type TabsProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.Root> & StyledProps & {
+    items?: TabsItemConfig[];
+    listProps?: TabsListProps;
+};
+export declare function Tabs(props: TabsProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Tabs {
+    var displayName: string;
+}
+export type TabsListProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.List> & StyledProps;
+export declare const TabsList: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & React.RefAttributes<HTMLDivElement>, "ref"> & StyledProps & React.RefAttributes<HTMLDivElement>>;
+export type TabsTriggerProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger> & StyledProps;
+export declare const TabsTrigger: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & StyledProps & React.RefAttributes<HTMLButtonElement>>;
+export type TabsContentProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content> & StyledProps & {
+    borderless?: boolean;
+};
+export declare const TabsContent: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & StyledProps & {
+    borderless?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+export {};