@funhub/platform 0.2.29 → 0.2.31

package/dist/components/ui/list.mjs

@@ -1,8 +1,224 @@
 
-"use client";import{pxToVw as e}from"../../utils/helper.mjs";import{EmptyState as t}from"./empty.mjs";import{InfiniteScroll as n}from"./infinite-scroll.mjs";import*as r from"react";import{Children as i,useCallback as a,useEffect as o,useRef as s}from"react";import{Fragment as c,jsx as l,jsxs as u}from"react/jsx-runtime";import{useTranslations as d}from"next-intl";const f=({size:e=32})=>l(`div`,{className:`inline-block animate-spin rounded-full border-2 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]`,style:{width:e,height:e},role:`status`,children:l(`span`,{className:`sr-only`,children:`Loading...`})}),p=()=>u(`span`,{className:`inline-flex gap-1 ml-1`,children:[l(`span`,{className:`w-1 h-1 bg-current rounded-full animate-pulse`,style:{animationDelay:`0s`}}),l(`span`,{className:`w-1 h-1 bg-current rounded-full animate-pulse`,style:{animationDelay:`0.2s`}}),l(`span`,{className:`w-1 h-1 bg-current rounded-full animate-pulse`,style:{animationDelay:`0.4s`}})]}),m=({index:e,onIntersect:t,resetKey:n,rootMargin:r=`0px`,threshold:i=.1,children:a})=>{let c=s(null);return o(()=>{let n=c.current;if(!n)return;let a=new IntersectionObserver(n=>{n[0]?.isIntersecting&&(t(e),a.disconnect())},{rootMargin:r,threshold:i});return a.observe(n),()=>a.disconnect()},[e,t,n,r,i]),l(`div`,{ref:c,children:a})};function h({title:e,children:t,description:n,prefix:r,extra:i,arrow:a=!1,onClick:o,clickable:s=!1,className:c=``,style:d,disabled:f=!1}){return u(`div`,{className:`
+'use client';
+
+import { pxToVw } from "../../utils/helper.mjs";
+import { EmptyState } from "./empty.mjs";
+import { InfiniteScroll } from "./infinite-scroll.mjs";
+import * as React from "react";
+import { Children, useCallback, useEffect, useRef } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { useTranslations } from "next-intl";
+
+//#region components/ui/list.tsx
+const SpinLoading = ({ size = 32 }) => {
+	return /* @__PURE__ */ jsx("div", {
+		className: "inline-block animate-spin rounded-full border-2 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]",
+		style: {
+			width: size,
+			height: size
+		},
+		role: "status",
+		children: /* @__PURE__ */ jsx("span", {
+			className: "sr-only",
+			children: "Loading..."
+		})
+	});
+};
+const DotLoading = () => {
+	return /* @__PURE__ */ jsxs("span", {
+		className: "inline-flex gap-1 ml-1",
+		children: [
+			/* @__PURE__ */ jsx("span", {
+				className: "w-1 h-1 bg-current rounded-full animate-pulse",
+				style: { animationDelay: "0s" }
+			}),
+			/* @__PURE__ */ jsx("span", {
+				className: "w-1 h-1 bg-current rounded-full animate-pulse",
+				style: { animationDelay: "0.2s" }
+			}),
+			/* @__PURE__ */ jsx("span", {
+				className: "w-1 h-1 bg-current rounded-full animate-pulse",
+				style: { animationDelay: "0.4s" }
+			})
+		]
+	});
+};
+const ItemWrapper = ({ index, onIntersect, resetKey, rootMargin = "0px", threshold = .1, children }) => {
+	const elementRef = useRef(null);
+	useEffect(() => {
+		const element = elementRef.current;
+		if (!element) return;
+		const observer = new IntersectionObserver((entries) => {
+			if (entries[0]?.isIntersecting) {
+				onIntersect(index);
+				observer.disconnect();
+			}
+		}, {
+			rootMargin,
+			threshold
+		});
+		observer.observe(element);
+		return () => observer.disconnect();
+	}, [
+		index,
+		onIntersect,
+		resetKey,
+		rootMargin,
+		threshold
+	]);
+	return /* @__PURE__ */ jsx("div", {
+		ref: elementRef,
+		children
+	});
+};
+function ListItem({ title, children, description, prefix, extra, arrow = false, onClick, clickable = false, className = "", style, disabled = false }) {
+	const isClickable = clickable || !!onClick;
+	const handleClick = (e) => {
+		if (disabled) return;
+		onClick?.(e);
+	};
+	return /* @__PURE__ */ jsxs("div", {
+		className: `
         flex items-center px-4 py-1.5 
-        ${(s||o)&&!f?`active:opacity-80 cursor-pointer`:``}
-        ${f?`opacity-50 cursor-not-allowed`:``}
+        ${isClickable && !disabled ? "active:opacity-80 cursor-pointer" : ""}
+        ${disabled ? "opacity-50 cursor-not-allowed" : ""}
         border-b border-gray-100 last:border-b-0
-        ${c}
-      `.trim().replace(/\s+/g,` `),style:d,onClick:e=>{f||o?.(e)},children:[r&&l(`div`,{className:`flex items-center mr-3 shrink-0`,children:r}),u(`div`,{className:`flex-1 min-w-0`,children:[e&&l(`div`,{className:`text-base text-text1 leading-5.5`,children:e}),(t||n)&&l(`div`,{className:`text-sm text-text2 leading-4.5 mt-0.5`,children:t||n})]}),i&&l(`div`,{className:`flex items-center ml-3 shrink-0 text-text3`,children:i}),a&&l(`div`,{className:`flex items-center ml-2 shrink-0 text-text4 opacity-60`,children:a===!0?l(`svg`,{width:`20`,height:`20`,viewBox:`0 0 16 16`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:l(`path`,{d:`M6 4L10 8L6 12`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`})}):a})]})}function g({children:h,loadMore:g,hasMore:_,empty:v,emptyText:y,emptySlot:b,onItemRender:x,intersectionRootMargin:S,intersectionThreshold:C,loading:w,columns:T=1,gridGap:E=12,style:D,className:O=``}){let k=d(`components.ui`),A=s(x),j=s(new Set),M=s(0),N=s(0),P=s(!1);o(()=>{A.current=x},[x]);let F=a(e=>{if(!j.current.has(e)&&(j.current.add(e),e===M.current))for(A.current?.(e),M.current=e+1;j.current.has(M.current);)A.current?.(M.current),M.current++},[]),I=i.count(h),L=s(I);o(()=>{let e=L.current;I!==e&&(j.current.clear(),N.current++,I<=e&&(M.current=0),L.current=I)},[I]);let R=i.count(h)>0;o(()=>{P.current||(P.current=!0,I===0&&_&&!w&&g?.(!1))},[]);let z=0,B=i.map(h,e=>{if(r.isValidElement(e)){let t=z++;return l(m,{index:t,onIntersect:F,resetKey:N.current,rootMargin:S,threshold:C,children:e},e.key||t)}return e});return R?T>1?u(c,{children:[l(`div`,{className:`grid bg-bg1 ${O}`,style:{gridTemplateColumns:`repeat(${T}, 1fr)`,gap:e(E),...D},children:B}),g?l(n,{loadMore:g,hasMore:_,threshold:100}):null]}):u(c,{children:[R&&l(`div`,{className:`bg-bg1 ${O}`,style:D,children:B}),g?l(n,{loadMore:g,hasMore:_,threshold:100}):null]}):w?u(`div`,{className:`flex flex-col gap-5 items-center justify-center mt-25 w-full`,children:[l(f,{size:32}),u(`div`,{className:`text-gray-600`,children:[l(`span`,{children:k(`list.loading`)}),l(p,{})]})]}):l(t,{type:v,text:y||k(`list.empty`),extraContent:b})}g.Item=h;export{g as List,h as ListItem};
+        ${className}
+      `.trim().replace(/\s+/g, " "),
+		style,
+		onClick: handleClick,
+		children: [
+			prefix && /* @__PURE__ */ jsx("div", {
+				className: "flex items-center mr-3 shrink-0",
+				children: prefix
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex-1 min-w-0",
+				children: [title && /* @__PURE__ */ jsx("div", {
+					className: "text-base text-text1 leading-5.5",
+					children: title
+				}), (children || description) && /* @__PURE__ */ jsx("div", {
+					className: "text-sm text-text2 leading-4.5 mt-0.5",
+					children: children || description
+				})]
+			}),
+			extra && /* @__PURE__ */ jsx("div", {
+				className: "flex items-center ml-3 shrink-0 text-text3",
+				children: extra
+			}),
+			arrow && /* @__PURE__ */ jsx("div", {
+				className: "flex items-center ml-2 shrink-0 text-text4 opacity-60",
+				children: arrow === true ? /* @__PURE__ */ jsx("svg", {
+					width: "20",
+					height: "20",
+					viewBox: "0 0 16 16",
+					fill: "none",
+					xmlns: "http://www.w3.org/2000/svg",
+					children: /* @__PURE__ */ jsx("path", {
+						d: "M6 4L10 8L6 12",
+						stroke: "currentColor",
+						strokeWidth: "1.5",
+						strokeLinecap: "round",
+						strokeLinejoin: "round"
+					})
+				}) : arrow
+			})
+		]
+	});
+}
+function List({ children, loadMore, hasMore, empty, emptyText, emptySlot, onItemRender, intersectionRootMargin, intersectionThreshold, loading, columns = 1, gridGap = 12, style, className = "" }) {
+	const t = useTranslations("components.ui");
+	const onItemRenderRef = useRef(onItemRender);
+	const triggeredIndicesRef = useRef(/* @__PURE__ */ new Set());
+	const nextExpectedIndexRef = useRef(0);
+	const resetKeyRef = useRef(0);
+	const isInitializedRef = useRef(false);
+	useEffect(() => {
+		onItemRenderRef.current = onItemRender;
+	}, [onItemRender]);
+	const handleIntersect = useCallback((index) => {
+		if (triggeredIndicesRef.current.has(index)) return;
+		triggeredIndicesRef.current.add(index);
+		if (index === nextExpectedIndexRef.current) {
+			onItemRenderRef.current?.(index);
+			nextExpectedIndexRef.current = index + 1;
+			while (triggeredIndicesRef.current.has(nextExpectedIndexRef.current)) {
+				onItemRenderRef.current?.(nextExpectedIndexRef.current);
+				nextExpectedIndexRef.current++;
+			}
+		}
+	}, []);
+	const currentChildrenCount = Children.count(children);
+	const prevChildrenCountRef = useRef(currentChildrenCount);
+	useEffect(() => {
+		const prevCount = prevChildrenCountRef.current;
+		if (currentChildrenCount !== prevCount) {
+			triggeredIndicesRef.current.clear();
+			resetKeyRef.current++;
+			if (currentChildrenCount <= prevCount) nextExpectedIndexRef.current = 0;
+			prevChildrenCountRef.current = currentChildrenCount;
+		}
+	}, [currentChildrenCount]);
+	const hasChildren = Children.count(children) > 0;
+	useEffect(() => {
+		if (!isInitializedRef.current) {
+			isInitializedRef.current = true;
+			if (currentChildrenCount === 0 && hasMore && !loading) loadMore?.(false);
+		}
+	}, []);
+	let itemIndex = 0;
+	const childrenWithIndex = Children.map(children, (child) => {
+		if (React.isValidElement(child)) {
+			const currentIndex = itemIndex++;
+			return /* @__PURE__ */ jsx(ItemWrapper, {
+				index: currentIndex,
+				onIntersect: handleIntersect,
+				resetKey: resetKeyRef.current,
+				rootMargin: intersectionRootMargin,
+				threshold: intersectionThreshold,
+				children: child
+			}, child.key || currentIndex);
+		}
+		return child;
+	});
+	if (!hasChildren) {
+		if (loading) return /* @__PURE__ */ jsxs("div", {
+			className: "flex flex-col gap-5 items-center justify-center mt-25 w-full",
+			children: [/* @__PURE__ */ jsx(SpinLoading, { size: 32 }), /* @__PURE__ */ jsxs("div", {
+				className: "text-gray-600",
+				children: [/* @__PURE__ */ jsx("span", { children: t("list.loading") }), /* @__PURE__ */ jsx(DotLoading, {})]
+			})]
+		});
+		return /* @__PURE__ */ jsx(EmptyState, {
+			type: empty,
+			text: emptyText || t("list.empty"),
+			extraContent: emptySlot
+		});
+	}
+	if (columns > 1) return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("div", {
+		className: `grid bg-bg1 ${className}`,
+		style: {
+			gridTemplateColumns: `repeat(${columns}, 1fr)`,
+			gap: pxToVw(gridGap),
+			...style
+		},
+		children: childrenWithIndex
+	}), loadMore ? /* @__PURE__ */ jsx(InfiniteScroll, {
+		loadMore,
+		hasMore,
+		threshold: 100
+	}) : null] });
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [hasChildren && /* @__PURE__ */ jsx("div", {
+		className: `bg-bg1 ${className}`,
+		style,
+		children: childrenWithIndex
+	}), loadMore ? /* @__PURE__ */ jsx(InfiniteScroll, {
+		loadMore,
+		hasMore,
+		threshold: 100
+	}) : null] });
+}
+List.Item = ListItem;
+
+//#endregion
+export { List, ListItem };

package/dist/components/ui/loading.mjs

@@ -1,2 +1,45 @@
 
-"use client";import{Box as e}from"./box.mjs";import{Text as t}from"./text.mjs";import"react";import{Fragment as n,jsx as r,jsxs as i}from"react/jsx-runtime";import{useTranslations as a}from"next-intl";function o({label:o,className:s=``,size:c=`medium`,showLabel:l=!0,color:u=``,...d}){let f=a(`components.ui`),p=o||f(`loading.label`),m={small:`h-4 w-4`,medium:`h-5 w-5`,large:`h-8 w-8`},h={small:`text-sm`,medium:`text-base`,large:`text-lg`},g=`inline-block animate-spin rounded-full border-2 border-current border-r-transparent ${m[c]}`;return i(e,{className:`inline-flex items-center gap-2 ${u} ${h[c]} ${s}`.trim(),role:`status`,"aria-live":`polite`,...d,children:[r(t,{as:`span`,className:g,"aria-hidden":`true`}),l&&i(n,{children:[r(t,{className:`sr-only`,children:p}),r(t,{"aria-hidden":`true`,children:p})]})]})}export{o as default};
+'use client';
+
+import { Box } from "./box.mjs";
+import { Text } from "./text.mjs";
+import "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { useTranslations } from "next-intl";
+
+//#region components/ui/loading.tsx
+function Loading({ label, className = "", size = "medium", showLabel = true, color = "", ...rest }) {
+	const t = useTranslations("components.ui");
+	const resolvedLabel = label || t("loading.label");
+	const sizeClasses = {
+		small: "h-4 w-4",
+		medium: "h-5 w-5",
+		large: "h-8 w-8"
+	};
+	const textSizeClasses = {
+		small: "text-sm",
+		medium: "text-base",
+		large: "text-lg"
+	};
+	const spinnerClasses = `inline-block animate-spin rounded-full border-2 border-current border-r-transparent ${sizeClasses[size]}`;
+	return /* @__PURE__ */ jsxs(Box, {
+		className: `inline-flex items-center gap-2 ${color} ${textSizeClasses[size]} ${className}`.trim(),
+		role: "status",
+		"aria-live": "polite",
+		...rest,
+		children: [/* @__PURE__ */ jsx(Text, {
+			as: "span",
+			className: spinnerClasses,
+			"aria-hidden": "true"
+		}), showLabel && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Text, {
+			className: "sr-only",
+			children: resolvedLabel
+		}), /* @__PURE__ */ jsx(Text, {
+			"aria-hidden": "true",
+			children: resolvedLabel
+		})] })]
+	});
+}
+
+//#endregion
+export { Loading as default };

package/dist/components/ui/mask.mjs

@@ -1,2 +1,18 @@
 
-"use client";import{jsx as e}from"react/jsx-runtime";function t({visible:t,onMaskClick:n}){return t?e(`div`,{className:`fixed inset-0 z-40 bg-black/0`,onClick:n,style:{pointerEvents:t?`auto`:`none`}}):null}export{t as Mask};
+'use client';
+
+import { jsx } from "react/jsx-runtime";
+
+//#region components/ui/mask.tsx
+/** Mask 组件。 */
+function Mask({ visible, onMaskClick }) {
+	if (!visible) return null;
+	return /* @__PURE__ */ jsx("div", {
+		className: "fixed inset-0 z-40 bg-black/0",
+		onClick: onMaskClick,
+		style: { pointerEvents: visible ? "auto" : "none" }
+	});
+}
+
+//#endregion
+export { Mask };

package/dist/components/ui/menubar.mjs

@@ -1,2 +1,155 @@
 
-"use client";import{cn as e}from"../../utils/cn.mjs";import{DropdownMenu as t,DropdownMenuContent as n,DropdownMenuGroup as r,DropdownMenuItem as i,DropdownMenuLabel as a,DropdownMenuPortal as o,DropdownMenuRadioGroup as s,DropdownMenuSeparator as c,DropdownMenuShortcut as l,DropdownMenuSub as u,DropdownMenuSubContent as d,DropdownMenuSubTrigger as f,DropdownMenuTrigger as p}from"./dropdown-menu.mjs";import"react";import{CheckIcon as m}from"lucide-react";import{jsx as h,jsxs as g}from"react/jsx-runtime";import{Menu as _}from"@base-ui/react/menu";import{Menubar as v}from"@base-ui/react/menubar";function y({className:t,...n}){return h(v,{"data-slot":`menubar`,className:e(`bg-background h-8 gap-0.5 rounded-lg border p-1 flex items-center`,t),...n})}function b({...e}){return h(t,{"data-slot":`menubar-menu`,...e})}function x({...e}){return h(r,{"data-slot":`menubar-group`,...e})}function S({...e}){return h(o,{"data-slot":`menubar-portal`,...e})}function C({className:t,...n}){return h(p,{"data-slot":`menubar-trigger`,className:e(`hover:bg-muted aria-expanded:bg-muted rounded-sm px-1.5 py-px text-sm font-medium flex items-center outline-none select-none`,t),...n})}function w({className:t,align:r=`start`,alignOffset:i=-4,sideOffset:a=8,...o}){return h(n,{"data-slot":`menubar-content`,align:r,alignOffset:i,sideOffset:a,className:e(`bg-popover text-popover-foreground data-[open]:animate-in data-[open]:fade-in-0 data-[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 ring-foreground/10 min-w-36 rounded-lg p-1 shadow-md ring-1 duration-100`,t),...o})}function T({className:t,inset:n,variant:r=`default`,...a}){return h(i,{"data-slot":`menubar-item`,"data-inset":n,"data-variant":r,className:e(`focus:bg-accent focus:text-accent-foreground focus:[&_*]:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:[&>svg]:!text-destructive data-[variant=destructive]:focus:[&_*]:text-destructive gap-1.5 rounded-md px-1.5 py-1 text-sm data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg:not([class*='w-']):not([class*='h-'])]:w-4 [&_svg:not([class*='w-']):not([class*='h-'])]:h-4 group/menubar-item`,t),...a})}function E({className:t,children:n,checked:r,...i}){return g(_.CheckboxItem,{"data-slot":`menubar-checkbox-item`,className:e(`focus:bg-accent focus:text-accent-foreground focus:[&_*]:text-accent-foreground gap-1.5 rounded-md py-1 pr-1.5 pl-7 text-sm data-[disabled]:opacity-50 relative flex cursor-default items-center outline-none select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0`,t),checked:r,...i,children:[h(`span`,{className:`left-1.5 w-4 h-4 [&_svg:not([class*='w-']):not([class*='h-'])]:w-4 [&_svg:not([class*='w-']):not([class*='h-'])]:h-4 pointer-events-none absolute flex items-center justify-center`,children:h(_.CheckboxItemIndicator,{children:h(m,{})})}),n]})}function D({...e}){return h(s,{"data-slot":`menubar-radio-group`,...e})}function O({className:t,children:n,...r}){return g(_.RadioItem,{"data-slot":`menubar-radio-item`,className:e(`focus:bg-accent focus:text-accent-foreground focus:[&_*]:text-accent-foreground gap-1.5 rounded-md py-1 pr-1.5 pl-7 text-sm data-[disabled]:opacity-50 [&_svg:not([class*='w-']):not([class*='h-'])]:w-4 [&_svg:not([class*='w-']):not([class*='h-'])]:h-4 relative flex cursor-default items-center outline-none select-none data-[disabled]:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0`,t),...r,children:[h(`span`,{className:`left-1.5 w-4 h-4 [&_svg:not([class*='w-']):not([class*='h-'])]:w-4 [&_svg:not([class*='w-']):not([class*='h-'])]:h-4 pointer-events-none absolute flex items-center justify-center`,children:h(_.RadioItemIndicator,{children:h(m,{})})}),n]})}function k({className:t,inset:n,...r}){return h(a,{"data-slot":`menubar-label`,"data-inset":n,className:e(`px-1.5 py-1 text-sm font-medium data-[inset]:pl-8`,t),...r})}function A({className:t,...n}){return h(c,{"data-slot":`menubar-separator`,className:e(`bg-border -mx-1 my-1 h-px`,t),...n})}function j({className:t,...n}){return h(l,{"data-slot":`menubar-shortcut`,className:e(`text-muted-foreground group-focus/menubar-item:text-accent-foreground text-xs tracking-widest ml-auto`,t),...n})}function M({...e}){return h(u,{"data-slot":`menubar-sub`,...e})}function N({className:t,inset:n,...r}){return h(f,{"data-slot":`menubar-sub-trigger`,"data-inset":n,className:e(`focus:bg-accent focus:text-accent-foreground data-[open]:bg-accent data-[open]:text-accent-foreground gap-1.5 rounded-md px-1.5 py-1 text-sm data-[inset]:pl-8 [&_svg:not([class*='w-']):not([class*='h-'])]:w-4 [&_svg:not([class*='w-']):not([class*='h-'])]:h-4`,t),...r})}function P({className:t,...n}){return h(d,{"data-slot":`menubar-sub-content`,className:e(`bg-popover text-popover-foreground data-[open]:animate-in data-[closed]:animate-out data-[closed]:fade-out-0 data-[open]:fade-in-0 data-[closed]:zoom-out-95 data-[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 ring-foreground/10 min-w-32 rounded-lg p-1 shadow-lg ring-1 duration-100`,t),...n})}export{y as Menubar,E as MenubarCheckboxItem,w as MenubarContent,x as MenubarGroup,T as MenubarItem,k as MenubarLabel,b as MenubarMenu,S as MenubarPortal,D as MenubarRadioGroup,O as MenubarRadioItem,A as MenubarSeparator,j as MenubarShortcut,M as MenubarSub,P as MenubarSubContent,N as MenubarSubTrigger,C as MenubarTrigger};
+'use client';
+
+import { cn } from "../../utils/cn.mjs";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger } from "./dropdown-menu.mjs";
+import "react";
+import { CheckIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Menu } from "@base-ui/react/menu";
+import { Menubar } from "@base-ui/react/menubar";
+
+//#region components/ui/menubar.tsx
+/** UI 组件模块。 */
+/** Menubar 组件。 */
+function Menubar$1({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Menubar, {
+		"data-slot": "menubar",
+		className: cn("bg-background h-8 gap-0.5 rounded-lg border p-1 flex items-center", className),
+		...props
+	});
+}
+/** MenubarMenu 组件。 */
+function MenubarMenu({ ...props }) {
+	return /* @__PURE__ */ jsx(DropdownMenu, {
+		"data-slot": "menubar-menu",
+		...props
+	});
+}
+/** MenubarGroup 组件。 */
+function MenubarGroup({ ...props }) {
+	return /* @__PURE__ */ jsx(DropdownMenuGroup, {
+		"data-slot": "menubar-group",
+		...props
+	});
+}
+/** MenubarPortal 组件。 */
+function MenubarPortal({ ...props }) {
+	return /* @__PURE__ */ jsx(DropdownMenuPortal, {
+		"data-slot": "menubar-portal",
+		...props
+	});
+}
+/** MenubarTrigger 组件。 */
+function MenubarTrigger({ className, ...props }) {
+	return /* @__PURE__ */ jsx(DropdownMenuTrigger, {
+		"data-slot": "menubar-trigger",
+		className: cn("hover:bg-muted aria-expanded:bg-muted rounded-sm px-1.5 py-px text-sm font-medium flex items-center outline-none select-none", className),
+		...props
+	});
+}
+/** MenubarContent 组件。 */
+function MenubarContent({ className, align = "start", alignOffset = -4, sideOffset = 8, ...props }) {
+	return /* @__PURE__ */ jsx(DropdownMenuContent, {
+		"data-slot": "menubar-content",
+		align,
+		alignOffset,
+		sideOffset,
+		className: cn("bg-popover text-popover-foreground data-[open]:animate-in data-[open]:fade-in-0 data-[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 ring-foreground/10 min-w-36 rounded-lg p-1 shadow-md ring-1 duration-100", className),
+		...props
+	});
+}
+/** MenubarItem 组件。 */
+function MenubarItem({ className, inset, variant = "default", ...props }) {
+	return /* @__PURE__ */ jsx(DropdownMenuItem, {
+		"data-slot": "menubar-item",
+		"data-inset": inset,
+		"data-variant": variant,
+		className: cn("focus:bg-accent focus:text-accent-foreground focus:[&_*]:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:[&>svg]:!text-destructive data-[variant=destructive]:focus:[&_*]:text-destructive gap-1.5 rounded-md px-1.5 py-1 text-sm data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg:not([class*='w-']):not([class*='h-'])]:w-4 [&_svg:not([class*='w-']):not([class*='h-'])]:h-4 group/menubar-item", className),
+		...props
+	});
+}
+/** MenubarCheckboxItem 组件。 */
+function MenubarCheckboxItem({ className, children, checked, ...props }) {
+	return /* @__PURE__ */ jsxs(Menu.CheckboxItem, {
+		"data-slot": "menubar-checkbox-item",
+		className: cn("focus:bg-accent focus:text-accent-foreground focus:[&_*]:text-accent-foreground gap-1.5 rounded-md py-1 pr-1.5 pl-7 text-sm data-[disabled]:opacity-50 relative flex cursor-default items-center outline-none select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0", className),
+		checked,
+		...props,
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "left-1.5 w-4 h-4 [&_svg:not([class*='w-']):not([class*='h-'])]:w-4 [&_svg:not([class*='w-']):not([class*='h-'])]:h-4 pointer-events-none absolute flex items-center justify-center",
+			children: /* @__PURE__ */ jsx(Menu.CheckboxItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon, {}) })
+		}), children]
+	});
+}
+/** MenubarRadioGroup 组件。 */
+function MenubarRadioGroup({ ...props }) {
+	return /* @__PURE__ */ jsx(DropdownMenuRadioGroup, {
+		"data-slot": "menubar-radio-group",
+		...props
+	});
+}
+/** MenubarRadioItem 组件。 */
+function MenubarRadioItem({ className, children, ...props }) {
+	return /* @__PURE__ */ jsxs(Menu.RadioItem, {
+		"data-slot": "menubar-radio-item",
+		className: cn("focus:bg-accent focus:text-accent-foreground focus:[&_*]:text-accent-foreground gap-1.5 rounded-md py-1 pr-1.5 pl-7 text-sm data-[disabled]:opacity-50 [&_svg:not([class*='w-']):not([class*='h-'])]:w-4 [&_svg:not([class*='w-']):not([class*='h-'])]:h-4 relative flex cursor-default items-center outline-none select-none data-[disabled]:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0", className),
+		...props,
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "left-1.5 w-4 h-4 [&_svg:not([class*='w-']):not([class*='h-'])]:w-4 [&_svg:not([class*='w-']):not([class*='h-'])]:h-4 pointer-events-none absolute flex items-center justify-center",
+			children: /* @__PURE__ */ jsx(Menu.RadioItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon, {}) })
+		}), children]
+	});
+}
+/** MenubarLabel 组件。 */
+function MenubarLabel({ className, inset, ...props }) {
+	return /* @__PURE__ */ jsx(DropdownMenuLabel, {
+		"data-slot": "menubar-label",
+		"data-inset": inset,
+		className: cn("px-1.5 py-1 text-sm font-medium data-[inset]:pl-8", className),
+		...props
+	});
+}
+/** MenubarSeparator 组件。 */
+function MenubarSeparator({ className, ...props }) {
+	return /* @__PURE__ */ jsx(DropdownMenuSeparator, {
+		"data-slot": "menubar-separator",
+		className: cn("bg-border -mx-1 my-1 h-px", className),
+		...props
+	});
+}
+/** MenubarShortcut 组件。 */
+function MenubarShortcut({ className, ...props }) {
+	return /* @__PURE__ */ jsx(DropdownMenuShortcut, {
+		"data-slot": "menubar-shortcut",
+		className: cn("text-muted-foreground group-focus/menubar-item:text-accent-foreground text-xs tracking-widest ml-auto", className),
+		...props
+	});
+}
+/** MenubarSub 组件。 */
+function MenubarSub({ ...props }) {
+	return /* @__PURE__ */ jsx(DropdownMenuSub, {
+		"data-slot": "menubar-sub",
+		...props
+	});
+}
+/** MenubarSubTrigger 组件。 */
+function MenubarSubTrigger({ className, inset, ...props }) {
+	return /* @__PURE__ */ jsx(DropdownMenuSubTrigger, {
+		"data-slot": "menubar-sub-trigger",
+		"data-inset": inset,
+		className: cn("focus:bg-accent focus:text-accent-foreground data-[open]:bg-accent data-[open]:text-accent-foreground gap-1.5 rounded-md px-1.5 py-1 text-sm data-[inset]:pl-8 [&_svg:not([class*='w-']):not([class*='h-'])]:w-4 [&_svg:not([class*='w-']):not([class*='h-'])]:h-4", className),
+		...props
+	});
+}
+/** MenubarSubContent 组件。 */
+function MenubarSubContent({ className, ...props }) {
+	return /* @__PURE__ */ jsx(DropdownMenuSubContent, {
+		"data-slot": "menubar-sub-content",
+		className: cn("bg-popover text-popover-foreground data-[open]:animate-in data-[closed]:animate-out data-[closed]:fade-out-0 data-[open]:fade-in-0 data-[closed]:zoom-out-95 data-[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 ring-foreground/10 min-w-32 rounded-lg p-1 shadow-lg ring-1 duration-100", className),
+		...props
+	});
+}
+
+//#endregion
+export { Menubar$1 as Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger };

package/dist/components/ui/native-select.mjs

@@ -1,2 +1,44 @@
 
-import{cn as e}from"../../utils/cn.mjs";import"react";import{ChevronDownIcon as t}from"lucide-react";import{jsx as n,jsxs as r}from"react/jsx-runtime";function i({className:i,size:a=`default`,...o}){return r(`div`,{className:e(`group/native-select relative w-fit has-[select:disabled]:opacity-50`,i),"data-slot":`native-select-wrapper`,"data-size":a,children:[n(`select`,{"data-slot":`native-select`,"data-size":a,className:`border-input placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 dark:hover:bg-input/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 h-8 w-full min-w-0 appearance-none rounded-lg border bg-transparent py-1 pr-8 pl-2.5 text-sm transition-colors select-none focus-visible:ring-[3px] aria-invalid:ring-[3px] data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] data-[size=sm]:py-0.5 outline-none disabled:pointer-events-none disabled:cursor-not-allowed`,...o}),n(t,{className:`text-muted-foreground top-1/2 right-2.5 w-4 h-4 -translate-y-1/2 pointer-events-none absolute select-none`,"aria-hidden":`true`,"data-slot":`native-select-icon`})]})}function a({...e}){return n(`option`,{"data-slot":`native-select-option`,...e})}function o({className:t,...r}){return n(`optgroup`,{"data-slot":`native-select-optgroup`,className:e(t),...r})}export{i as NativeSelect,o as NativeSelectOptGroup,a as NativeSelectOption};
+import { cn } from "../../utils/cn.mjs";
+import "react";
+import { ChevronDownIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region components/ui/native-select.tsx
+/** UI 组件模块。 */
+/** NativeSelect 组件。 */
+function NativeSelect({ className, size = "default", ...props }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("group/native-select relative w-fit has-[select:disabled]:opacity-50", className),
+		"data-slot": "native-select-wrapper",
+		"data-size": size,
+		children: [/* @__PURE__ */ jsx("select", {
+			"data-slot": "native-select",
+			"data-size": size,
+			className: "border-input placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 dark:hover:bg-input/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 h-8 w-full min-w-0 appearance-none rounded-lg border bg-transparent py-1 pr-8 pl-2.5 text-sm transition-colors select-none focus-visible:ring-[3px] aria-invalid:ring-[3px] data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] data-[size=sm]:py-0.5 outline-none disabled:pointer-events-none disabled:cursor-not-allowed",
+			...props
+		}), /* @__PURE__ */ jsx(ChevronDownIcon, {
+			className: "text-muted-foreground top-1/2 right-2.5 w-4 h-4 -translate-y-1/2 pointer-events-none absolute select-none",
+			"aria-hidden": "true",
+			"data-slot": "native-select-icon"
+		})]
+	});
+}
+/** NativeSelectOption 组件。 */
+function NativeSelectOption({ ...props }) {
+	return /* @__PURE__ */ jsx("option", {
+		"data-slot": "native-select-option",
+		...props
+	});
+}
+/** NativeSelectOptGroup 组件。 */
+function NativeSelectOptGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx("optgroup", {
+		"data-slot": "native-select-optgroup",
+		className: cn(className),
+		...props
+	});
+}
+
+//#endregion
+export { NativeSelect, NativeSelectOptGroup, NativeSelectOption };

package/dist/components/ui/pagination.mjs

@@ -1,2 +1,91 @@
 
-import{cn as e}from"../../utils/cn.mjs";import{Button as t}from"./button.mjs";import"react";import{ChevronLeftIcon as n,ChevronRightIcon as r,MoreHorizontalIcon as i}from"lucide-react";import{jsx as a,jsxs as o}from"react/jsx-runtime";function s({className:t,...n}){return a(`nav`,{role:`navigation`,"aria-label":`pagination`,"data-slot":`pagination`,className:e(`mx-auto flex w-full justify-center`,t),...n})}function c({className:t,...n}){return a(`ul`,{"data-slot":`pagination-content`,className:e(`gap-0.5 flex items-center`,t),...n})}function l({...e}){return a(`li`,{"data-slot":`pagination-item`,...e})}function u({className:n,isActive:r,size:i=`icon`,...o}){return a(t,{variant:r?`outline`:`ghost`,size:i,className:e(n),nativeButton:!1,render:a(`a`,{"aria-current":r?`page`:void 0,"data-slot":`pagination-link`,"data-active":r,...o})})}function d({className:t,...r}){return o(u,{"aria-label":`Go to previous page`,size:`default`,className:e(`!pl-1.5`,t),...r,children:[a(n,{"data-icon":`inline-start`}),a(`span`,{className:`hidden sm:block`,children:`Previous`})]})}function f({className:t,...n}){return o(u,{"aria-label":`Go to next page`,size:`default`,className:e(`!pr-1.5`,t),...n,children:[a(`span`,{className:`hidden sm:block`,children:`Next`}),a(r,{"data-icon":`inline-end`})]})}function p({className:t,...n}){return o(`span`,{"aria-hidden":!0,"data-slot":`pagination-ellipsis`,className:e(`w-8 h-8 items-center justify-center [&_svg:not([class*='w-']):not([class*='h-'])]:w-4 [&_svg:not([class*='w-']):not([class*='h-'])]:h-4 flex items-center justify-center`,t),...n,children:[a(i,{}),a(`span`,{className:`sr-only`,children:`More pages`})]})}export{s as Pagination,c as PaginationContent,p as PaginationEllipsis,l as PaginationItem,u as PaginationLink,f as PaginationNext,d as PaginationPrevious};
+import { cn } from "../../utils/cn.mjs";
+import { Button } from "./button.mjs";
+import "react";
+import { ChevronLeftIcon, ChevronRightIcon, MoreHorizontalIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region components/ui/pagination.tsx
+/** UI 组件模块。 */
+/** Pagination 组件。 */
+function Pagination({ className, ...props }) {
+	return /* @__PURE__ */ jsx("nav", {
+		role: "navigation",
+		"aria-label": "pagination",
+		"data-slot": "pagination",
+		className: cn("mx-auto flex w-full justify-center", className),
+		...props
+	});
+}
+/** PaginationContent 组件。 */
+function PaginationContent({ className, ...props }) {
+	return /* @__PURE__ */ jsx("ul", {
+		"data-slot": "pagination-content",
+		className: cn("gap-0.5 flex items-center", className),
+		...props
+	});
+}
+/** PaginationItem 组件。 */
+function PaginationItem({ ...props }) {
+	return /* @__PURE__ */ jsx("li", {
+		"data-slot": "pagination-item",
+		...props
+	});
+}
+/** PaginationLink 组件。 */
+function PaginationLink({ className, isActive, size = "icon", ...props }) {
+	return /* @__PURE__ */ jsx(Button, {
+		variant: isActive ? "outline" : "ghost",
+		size,
+		className: cn(className),
+		nativeButton: false,
+		render: /* @__PURE__ */ jsx("a", {
+			"aria-current": isActive ? "page" : void 0,
+			"data-slot": "pagination-link",
+			"data-active": isActive,
+			...props
+		})
+	});
+}
+/** PaginationPrevious 组件。 */
+function PaginationPrevious({ className, ...props }) {
+	return /* @__PURE__ */ jsxs(PaginationLink, {
+		"aria-label": "Go to previous page",
+		size: "default",
+		className: cn("!pl-1.5", className),
+		...props,
+		children: [/* @__PURE__ */ jsx(ChevronLeftIcon, { "data-icon": "inline-start" }), /* @__PURE__ */ jsx("span", {
+			className: "hidden sm:block",
+			children: "Previous"
+		})]
+	});
+}
+/** PaginationNext 组件。 */
+function PaginationNext({ className, ...props }) {
+	return /* @__PURE__ */ jsxs(PaginationLink, {
+		"aria-label": "Go to next page",
+		size: "default",
+		className: cn("!pr-1.5", className),
+		...props,
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "hidden sm:block",
+			children: "Next"
+		}), /* @__PURE__ */ jsx(ChevronRightIcon, { "data-icon": "inline-end" })]
+	});
+}
+/** PaginationEllipsis 组件。 */
+function PaginationEllipsis({ className, ...props }) {
+	return /* @__PURE__ */ jsxs("span", {
+		"aria-hidden": true,
+		"data-slot": "pagination-ellipsis",
+		className: cn("w-8 h-8 items-center justify-center [&_svg:not([class*='w-']):not([class*='h-'])]:w-4 [&_svg:not([class*='w-']):not([class*='h-'])]:h-4 flex items-center justify-center", className),
+		...props,
+		children: [/* @__PURE__ */ jsx(MoreHorizontalIcon, {}), /* @__PURE__ */ jsx("span", {
+			className: "sr-only",
+			children: "More pages"
+		})]
+	});
+}
+
+//#endregion
+export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious };