@_tc/template-core 0.1.15 → 0.2.0-bate.0

package/fe/packages/react/ui/components/Overlay/Overlay.js

@@ -0,0 +1,61 @@
+import { cn } from "../../lib/utils.js";
+import { useEffect } from "react";
+import { jsx } from "react/jsx-runtime";
+import { createPortal } from "react-dom";
+//#region packages/react/ui/components/Overlay/Overlay.tsx
+var bodyScrollLockCount = 0;
+var originalBodyOverflow = "";
+var canUseDocument = () => typeof document !== "undefined";
+var lockBodyScroll = () => {
+	if (!canUseDocument()) return () => {};
+	if (bodyScrollLockCount === 0) {
+		originalBodyOverflow = document.body.style.overflow;
+		document.body.style.overflow = "hidden";
+	}
+	bodyScrollLockCount += 1;
+	return () => {
+		bodyScrollLockCount = Math.max(0, bodyScrollLockCount - 1);
+		if (bodyScrollLockCount === 0) {
+			document.body.style.overflow = originalBodyOverflow;
+			originalBodyOverflow = "";
+		}
+	};
+};
+function Overlay({ open = false, visible = open, children, className, style, zIndex = 1e3, mask = true, maskClosable = true, lockScroll = true, keyboard = true, closable = true, onClose, onClick, renderNode }) {
+	useEffect(() => {
+		if (!open || !keyboard || !canUseDocument()) return;
+		const handleEscape = (e) => {
+			if (e.key === "Escape" && closable) onClose?.();
+		};
+		document.addEventListener("keydown", handleEscape);
+		return () => {
+			document.removeEventListener("keydown", handleEscape);
+		};
+	}, [
+		open,
+		closable,
+		onClose,
+		keyboard
+	]);
+	useEffect(() => {
+		if (!open || !lockScroll) return;
+		return lockBodyScroll();
+	}, [lockScroll, open]);
+	const handleMaskClick = (e) => {
+		onClick?.(e);
+		if (maskClosable && e.target === e.currentTarget) onClose?.();
+	};
+	if (!open || !canUseDocument()) return null;
+	const parent = typeof renderNode === "function" ? renderNode() : renderNode ?? document.body;
+	return createPortal(/* @__PURE__ */ jsx("div", {
+		className: cn("tc-ui-overlay fixed inset-0 z-[1000]", mask && "bg-black/50 backdrop-blur-sm", "transition-opacity duration-200", visible ? "opacity-100" : "opacity-0", className),
+		style: {
+			zIndex,
+			...style
+		},
+		onClick: handleMaskClick,
+		children
+	}), parent);
+}
+//#endregion
+export { Overlay, canUseDocument };

package/fe/packages/react/ui/components/Overlay/index.d.ts

@@ -0,0 +1,2 @@
+export { Overlay, canUseDocument } from "./Overlay";
+export type { OverlayProps } from "./Overlay";

package/fe/packages/react/ui/components/Overlay/index.js

@@ -0,0 +1,2 @@
+import { Overlay, canUseDocument } from "./Overlay.js";
+export { Overlay, canUseDocument };

package/fe/packages/{ui/react → react/ui}/components/Pagination/Pagination.d.ts

@@ -1,18 +1,10 @@
 export interface PaginationProps {
-    /** 当前页码 */
     current: number;
-    /** 每页显示数量 */
     pageSize: number;
-    /** 总数据量 */
     total: number;
-    /** 页码改变回调 */
     onChange: (page: number) => void;
-    /** 每页显示数量改变回调 */
     onPageSizeChange?: (pageSize: number) => void;
-    /** 每页显示数量选项 */
     pageSizeOptions?: number[];
-    /** 自定义类名 */
     className?: string;
 }
 export declare function Pagination({ current, pageSize, total, onChange, onPageSizeChange, pageSizeOptions, className, }: PaginationProps): import("react/jsx-runtime").JSX.Element | null;
-//# sourceMappingURL=Pagination.d.ts.map

package/fe/packages/react/ui/components/Pagination/Pagination.js

@@ -0,0 +1,115 @@
+import { cn } from "../../lib/utils.js";
+import { Button } from "../Button/Button.js";
+import "../Button/index.js";
+import { Select } from "../Select/Select.js";
+import "../Select/index.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ChevronLeft, ChevronRight } from "lucide-react";
+//#region packages/react/ui/components/Pagination/Pagination.tsx
+function Pagination({ current, pageSize, total, onChange, onPageSizeChange, pageSizeOptions = [
+	10,
+	20,
+	50,
+	100
+], className }) {
+	const totalPages = Math.ceil(total / pageSize);
+	const releaseFocus = (event) => {
+		event.currentTarget.blur();
+	};
+	const getPageNumbers = () => {
+		const pages = [];
+		if (totalPages <= 7) for (let i = 1; i <= totalPages; i++) pages.push(i);
+		else if (current <= 4) {
+			for (let i = 1; i <= 5; i++) pages.push(i);
+			pages.push("...");
+			pages.push(totalPages);
+		} else if (current >= totalPages - 3) {
+			pages.push(1);
+			pages.push("...");
+			for (let i = totalPages - 4; i <= totalPages; i++) pages.push(i);
+		} else {
+			pages.push(1);
+			pages.push("...");
+			for (let i = current - 1; i <= current + 1; i++) pages.push(i);
+			pages.push("...");
+			pages.push(totalPages);
+		}
+		return pages;
+	};
+	const handlePrevious = (event) => {
+		releaseFocus(event);
+		if (current > 1) onChange(current - 1);
+	};
+	const handleNext = (event) => {
+		releaseFocus(event);
+		if (current < totalPages) onChange(current + 1);
+	};
+	const handlePageClick = (page, event) => {
+		releaseFocus(event);
+		if (typeof page === "number" && page !== current) onChange(page);
+	};
+	const handlePageSizeChange = (newPageSize) => {
+		if (newPageSize !== void 0 && typeof newPageSize === "number" && newPageSize !== pageSize && onPageSizeChange) {
+			onPageSizeChange(newPageSize);
+			if (current !== 1) onChange(1);
+		}
+	};
+	if (totalPages === 0) return null;
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("tc-ui-pagination flex items-center gap-4", className),
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "text-sm text-muted-foreground",
+				children: ["Total ", total]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex flex-1 items-center justify-center gap-1.5",
+				children: [
+					/* @__PURE__ */ jsx(Button, {
+						onClick: handlePrevious,
+						disabled: current === 1,
+						size: "sm",
+						className: cn("inline-flex items-center justify-center", "h-8 w-8 rounded-md px-0", "text-sm font-medium", "border border-border/70 bg-background", "transition-colors duration-150", "focus-visible:ring-2 focus-visible:ring-ring/35 focus-visible:ring-offset-0", current === 1 ? "cursor-not-allowed text-muted-foreground/45" : "cursor-pointer text-muted-foreground hover:bg-foreground/8 hover:text-foreground"),
+						children: /* @__PURE__ */ jsx(ChevronLeft, { className: "h-4 w-4" })
+					}),
+					getPageNumbers().map((page, index) => {
+						if (page === "...") return /* @__PURE__ */ jsx("span", {
+							className: "px-2 text-muted-foreground",
+							children: "..."
+						}, `ellipsis-${index}`);
+						return /* @__PURE__ */ jsx(Button, {
+							onClick: (event) => handlePageClick(page, event),
+							size: "sm",
+							"aria-current": page === current ? "page" : void 0,
+							className: cn("inline-flex items-center justify-center", "h-8 min-w-8 rounded-md px-2.5", "text-sm font-medium", "border transition-colors duration-150", "focus-visible:ring-2 focus-visible:ring-ring/35 focus-visible:ring-offset-0", page === current ? "border-theme/45 bg-theme/12 text-foreground cursor-default" : "bg-background border-border/70 text-muted-foreground hover:bg-foreground/8 hover:text-foreground cursor-pointer"),
+							children: page
+						}, page);
+					}),
+					/* @__PURE__ */ jsx(Button, {
+						onClick: handleNext,
+						size: "sm",
+						disabled: current === totalPages,
+						className: cn("inline-flex items-center justify-center", "h-8 w-8 rounded-md px-0", "text-sm font-medium", "border border-border/70 bg-background", "transition-colors duration-150", "focus-visible:ring-2 focus-visible:ring-ring/35 focus-visible:ring-offset-0", current === totalPages ? "cursor-not-allowed text-muted-foreground/45" : "cursor-pointer text-muted-foreground hover:bg-foreground/8 hover:text-foreground"),
+						children: /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4" })
+					})
+				]
+			}),
+			onPageSizeChange && /* @__PURE__ */ jsx("div", {
+				className: "flex items-center gap-2",
+				children: /* @__PURE__ */ jsx(Select, {
+					value: pageSize,
+					onChange: handlePageSizeChange,
+					options: pageSizeOptions.map((size) => ({
+						label: `${size}`,
+						value: size
+					})),
+					className: "w-20 [&>div]:bg-muted [&>div]:border-border [&>div]:shadow-sm [&>div]:py-2 [&>div]:px-3 [&>div]:h-8",
+					clearable: false,
+					searchable: false
+				})
+			})
+		]
+	});
+}
+//#endregion
+export { Pagination };

package/fe/packages/react/ui/components/Pagination/index.d.ts

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

package/fe/packages/react/ui/components/Pagination/index.js

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

package/fe/packages/{ui/react → react/ui}/components/Popup/Popup.d.ts

@@ -23,4 +23,3 @@ export interface PopupProps {
     onOpenChange?: (open: boolean) => void;
 }
 export declare function Popup({ open, anchorRef, children, className, style, placement, offset, keepMounted, closeOnClickOutside, closeOnEscape, matchAnchorWidth, position, positioning, strategy, contentRef, container, positionMode, hoverBridge, hoverBridgePlacement, onOpenChange, }: PopupProps): import("react").ReactPortal | null;
-//# sourceMappingURL=Popup.d.ts.map

package/fe/packages/react/ui/components/Popup/Popup.js

@@ -0,0 +1,86 @@
+import { cn } from "../../lib/utils.js";
+import { getDefaultDropdownPosition, useDropdownPositioning } from "../hooks/useDropdownPositioning.js";
+import { useEffect, useMemo, useRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { createPortal } from "react-dom";
+//#region packages/react/ui/components/Popup/Popup.tsx
+var DEFAULT_POPUP_CLASSNAME = cn("fixed z-[1000]", "rounded-xl border border-border/60 bg-popover text-popover-foreground", "shadow-[var(--shadow-floating)]", "animate-in fade-in-0 zoom-in-95");
+var canUseDocument = () => typeof document !== "undefined";
+function Popup({ open, anchorRef, children, className, style, placement = "bottom-end", offset = 8, keepMounted = false, closeOnClickOutside = true, closeOnEscape = true, matchAnchorWidth = false, position, positioning, strategy = getDefaultDropdownPosition, contentRef, container, positionMode = "fixed", hoverBridge = 0, hoverBridgePlacement = "auto", onOpenChange }) {
+	const internalContentRef = useRef(null);
+	const panelRef = contentRef ?? internalContentRef;
+	const internalPositioning = useDropdownPositioning({
+		open,
+		anchorRef,
+		contentRef: panelRef,
+		placement,
+		offset,
+		matchAnchorWidth,
+		strategy,
+		containerRef: useMemo(() => ({ current: container ?? null }), [container]),
+		positionMode
+	});
+	const resolvedPositioning = position ? null : positioning ?? internalPositioning;
+	useEffect(() => {
+		if (!open || !closeOnClickOutside) return;
+		const handleClickOutside = (event) => {
+			const target = event.target;
+			const clickedAnchor = anchorRef.current?.contains(target);
+			const clickedPanel = panelRef.current?.contains(target);
+			if (!clickedAnchor && !clickedPanel) onOpenChange?.(false);
+		};
+		document.addEventListener("mousedown", handleClickOutside);
+		return () => document.removeEventListener("mousedown", handleClickOutside);
+	}, [
+		anchorRef,
+		closeOnClickOutside,
+		onOpenChange,
+		open,
+		panelRef
+	]);
+	useEffect(() => {
+		if (!open || !closeOnEscape) return;
+		const handleKeyDown = (event) => {
+			if (event.key === "Escape") onOpenChange?.(false);
+		};
+		document.addEventListener("keydown", handleKeyDown);
+		return () => document.removeEventListener("keydown", handleKeyDown);
+	}, [
+		closeOnEscape,
+		onOpenChange,
+		open
+	]);
+	const mergedStyle = useMemo(() => ({
+		...resolvedPositioning?.position,
+		...position,
+		...style
+	}), [
+		position,
+		resolvedPositioning?.position,
+		style
+	]);
+	const showBothHorizontalHoverBridges = hoverBridge > 0 && (placement.startsWith("right") || placement.startsWith("left")) && hoverBridgePlacement === "horizontal";
+	if (!keepMounted && !open) return null;
+	const portalContainer = container ?? (canUseDocument() ? document.body : void 0);
+	if (!portalContainer) return null;
+	return createPortal(/* @__PURE__ */ jsxs("div", {
+		ref: panelRef,
+		className: cn("tc-ui-popup", DEFAULT_POPUP_CLASSNAME, positionMode === "absolute" && "absolute", !resolvedPositioning?.ready && "invisible", keepMounted && !open && "hidden", className),
+		style: mergedStyle,
+		children: [
+			hoverBridge > 0 && /* @__PURE__ */ jsx("div", {
+				"aria-hidden": "true",
+				className: cn("absolute bg-transparent", placement.startsWith("bottom") && "left-0 right-0 top-0 -translate-y-full", placement.startsWith("top") && "bottom-0 left-0 right-0 translate-y-full", placement.startsWith("right") && "bottom-0 left-0 top-0 -translate-x-full", placement.startsWith("left") && "bottom-0 right-0 top-0 translate-x-full"),
+				style: placement.startsWith("right") || placement.startsWith("left") ? { width: hoverBridge } : { height: hoverBridge }
+			}),
+			showBothHorizontalHoverBridges && /* @__PURE__ */ jsx("div", {
+				"aria-hidden": "true",
+				className: "absolute bottom-0 right-0 top-0 translate-x-full bg-transparent",
+				style: { width: hoverBridge }
+			}),
+			children
+		]
+	}), portalContainer);
+}
+//#endregion
+export { Popup };

package/fe/packages/react/ui/components/Popup/index.d.ts

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

package/fe/packages/react/ui/components/Popup/index.js

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

package/fe/packages/{ui/react → react/ui}/components/Radio/Radio.d.ts

@@ -1,4 +1,4 @@
-import type { InputHTMLAttributes, ReactNode } from 'react';
+import type { InputHTMLAttributes, ReactNode } from "react";
 export type RadioProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'children'> & {
     label?: ReactNode;
 };
@@ -6,4 +6,3 @@ declare const Radio: import("react").ForwardRefExoticComponent<Omit<InputHTMLAtt
     label?: ReactNode;
 } & import("react").RefAttributes<HTMLInputElement>>;
 export { Radio };
-//# sourceMappingURL=Radio.d.ts.map

package/fe/packages/react/ui/components/Radio/Radio.js

@@ -0,0 +1,36 @@
+import { cn } from "../../lib/utils.js";
+import { useRadioGroupContext } from "./RadioGroup.js";
+import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region packages/react/ui/components/Radio/Radio.tsx
+var Radio = forwardRef(({ className, label, disabled, ...props }, ref) => {
+	const group = useRadioGroupContext();
+	const name = group.name ?? props.name;
+	const checked = group.selectedValue !== void 0 ? group.selectedValue === props.value : props.checked;
+	const onChange = group.onSelect ? () => {
+		if (!disabled && typeof props.value === "string") group.onSelect?.(props.value);
+	} : props.onChange;
+	return /* @__PURE__ */ jsxs("label", {
+		className: cn("tc-ui-radio inline-flex items-center gap-2", disabled && "cursor-not-allowed opacity-50", !disabled && "cursor-pointer group", className),
+		children: [
+			/* @__PURE__ */ jsx("input", {
+				ref,
+				type: "radio",
+				name,
+				checked,
+				disabled,
+				onChange,
+				className: "sr-only peer",
+				...props
+			}),
+			/* @__PURE__ */ jsx("span", {
+				className: "flex h-4 w-4 shrink-0 items-center justify-center rounded-full border border-border bg-background transition-colors duration-200 ease-out peer-checked:border-theme peer-checked:bg-theme peer-focus-visible:ring-2 peer-focus-visible:ring-ring peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-background group-hover:border-foreground/25",
+				children: /* @__PURE__ */ jsx("span", { className: "h-2 w-2 rounded-full bg-theme-foreground" })
+			}),
+			label && /* @__PURE__ */ jsx("span", { children: label })
+		]
+	});
+});
+Radio.displayName = "Radio";
+//#endregion
+export { Radio };

package/fe/packages/{ui/react → react/ui}/components/Radio/RadioGroup.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from 'react';
+import type { ReactNode } from "react";
 export type RadioGroupProps = {
     name?: string;
     value?: string;
@@ -16,4 +16,3 @@ type RadioGroupContextValue = {
 export declare function useRadioGroupContext(): RadioGroupContextValue;
 declare const RadioGroup: import("react").ForwardRefExoticComponent<RadioGroupProps & import("react").RefAttributes<HTMLDivElement>>;
 export { RadioGroup };
-//# sourceMappingURL=RadioGroup.d.ts.map

package/fe/packages/react/ui/components/Radio/RadioGroup.js

@@ -0,0 +1,33 @@
+import { cn } from "../../lib/utils.js";
+import { createContext, forwardRef, useCallback, useContext, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region packages/react/ui/components/Radio/RadioGroup.tsx
+var RadioGroupContext = createContext({});
+function useRadioGroupContext() {
+	return useContext(RadioGroupContext);
+}
+var RadioGroup = forwardRef(({ name, value: controlledValue, defaultValue, onChange, direction = "vertical", children, className }, ref) => {
+	const [internalValue, setInternalValue] = useState(defaultValue ?? "");
+	const isControlled = controlledValue !== void 0;
+	const selectedValue = isControlled ? controlledValue : internalValue;
+	const handleSelect = useCallback((val) => {
+		if (!isControlled) setInternalValue(val);
+		onChange?.(val);
+	}, [isControlled, onChange]);
+	return /* @__PURE__ */ jsx(RadioGroupContext.Provider, {
+		value: {
+			name,
+			selectedValue,
+			onSelect: handleSelect
+		},
+		children: /* @__PURE__ */ jsx("div", {
+			ref,
+			role: "radiogroup",
+			className: cn("tc-ui-radio-group", direction === "horizontal" ? "flex flex-wrap gap-4" : "flex flex-col gap-2", className),
+			children
+		})
+	});
+});
+RadioGroup.displayName = "RadioGroup";
+//#endregion
+export { RadioGroup, useRadioGroupContext };

package/fe/packages/react/ui/components/Radio/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Radio";
+export * from "./RadioGroup";

package/fe/packages/react/ui/components/Radio/index.js

@@ -0,0 +1,3 @@
+import { RadioGroup, useRadioGroupContext } from "./RadioGroup.js";
+import { Radio } from "./Radio.js";
+export { Radio, RadioGroup, useRadioGroupContext };

package/fe/packages/{ui/react → react/ui}/components/Search/Search.d.ts

@@ -1,17 +1,13 @@
-import type { MOmit } from '../../types';
-import type { FormInstance } from 'rc-field-form';
-import type { ReactNode } from 'react';
-import { type FormFieldSchema } from '../Form';
+import type { MOmit } from "../../types/index";
+import type { FormInstance } from "rc-field-form";
+import type { ReactNode } from "react";
+import { type FormFieldSchema } from "../Form";
 export type SearchProps<T> = {
     defaultValue?: T;
     schemas: MOmit<FormFieldSchema<T>, 'rules' | 'required'>[];
     children?: ReactNode;
-    /**
-     * 获取表单实例的回调
-     */
     getForm?: (form: FormInstance<T>) => void;
     btnsClassName?: string;
 };
 declare const Search: <T extends object>(props: SearchProps<T>) => import("react/jsx-runtime").JSX.Element;
 export default Search;
-//# sourceMappingURL=Search.d.ts.map

package/fe/packages/react/ui/components/Search/Search.js

@@ -0,0 +1,24 @@
+import { cn } from "../../lib/utils.js";
+import { SchemaForm } from "../Form/SchemaForm/index.js";
+import "../Form/index.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region packages/react/ui/components/Search/Search.tsx
+var Search = (props) => {
+	const { defaultValue: pDefaultValue, schemas, children, getForm, btnsClassName } = props;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "tc-ui-search flex items-end justify-between gap-4 flex-wrap",
+		children: [/* @__PURE__ */ jsx(SchemaForm, {
+			preserve: true,
+			layout: "horizontal",
+			schemas,
+			initialValues: pDefaultValue,
+			getForm,
+			footerButtons: false
+		}), /* @__PURE__ */ jsx("div", {
+			className: cn("flex items-center gap-2 self-end ml-auto flex-wrap", btnsClassName),
+			children
+		})]
+	});
+};
+//#endregion
+export { Search as default };

package/fe/packages/react/ui/components/Search/index.d.ts

@@ -0,0 +1 @@
+export { default as Search } from "./Search";

package/fe/packages/react/ui/components/Search/index.js

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

package/fe/packages/{ui/react → react/ui}/components/Select/Select.d.ts

@@ -1,9 +1,7 @@
-import React from 'react';
+import React from "react";
 export type SelectOption = {
-    /** 展示内容；传 ReactNode 时建议同时提供 searchText 用于搜索 */
     label: React.ReactNode;
     value: string | number;
-    /** 搜索文本；优先级高于 label */
     searchText?: string;
 };
 export type SelectProps = {
@@ -12,15 +10,12 @@ export type SelectProps = {
     defaultValue?: string | number;
     placeholder?: string;
     onChange?: (value: string | number | undefined) => void;
+    loading?: boolean;
     className?: string;
     disabled?: boolean;
-    /** 开启清除 默认开启*/
     clearable?: boolean;
-    /** 是否支持搜索 默认开启 */
     searchable?: boolean;
-    /** 自定义弹出容器，传 parent 时挂载到当前 Select 的父元素，不传则默认挂载到 document.body */
     getPopupContainer?: 'parent' | (() => HTMLElement);
 };
 declare const Select: React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<HTMLDivElement>>;
 export { Select };
-//# sourceMappingURL=Select.d.ts.map