@aloudata/aloudata-design 2.19.5 → 3.0.0-beta.2

package/dist/Upload/index.js

@@ -1,2 +1,334 @@
-import { Upload } from 'antd';
-export default Upload;
+import { cn } from "../lib/utils.js";
+import Memo from "../Icon/components/CheckCircleFill.js";
+import Memo$1 from "../Icon/components/CloseCircleFill.js";
+import Memo$2 from "../Icon/components/CloseLightLine.js";
+import Memo$3 from "../Icon/components/EyeOnLine.js";
+import Memo$4 from "../Icon/components/LoadingLine.js";
+import Memo$5 from "../Icon/components/TrashLightLine.js";
+import Tooltip from "../Tooltip/index.js";
+/* empty css       */
+import { useCallback, useMemo, useRef, useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import RcUpload from "rc-upload";
+//#region src/Upload/index.tsx
+var fileUid = 0;
+function getUid() {
+	fileUid += 1;
+	return `ald-upload-${Date.now()}-${fileUid}`;
+}
+function fileToUploadFile(file, status = "uploading") {
+	return {
+		uid: file.uid ?? getUid(),
+		name: file.name,
+		size: file.size,
+		type: file.type,
+		status,
+		percent: 0,
+		originFileObj: file
+	};
+}
+function isImageUrl(file) {
+	if (file.type) return file.type.startsWith("image/");
+	const ext = file.name?.split(".").pop()?.toLowerCase() ?? "";
+	return [
+		"png",
+		"jpg",
+		"jpeg",
+		"gif",
+		"bmp",
+		"webp",
+		"svg",
+		"ico"
+	].includes(ext);
+}
+function getThumbUrl(file) {
+	if (file.thumbUrl) return file.thumbUrl;
+	if (file.url) return file.url;
+	if (file.originFileObj && isImageUrl(file)) try {
+		return URL.createObjectURL(file.originFileObj);
+	} catch {
+		return;
+	}
+}
+function UploadList({ items = [], listType = "text", showUploadList = true, onRemove, onPreview, disabled }) {
+	if (!showUploadList || items.length === 0) return null;
+	const showConfig = typeof showUploadList === "object" ? showUploadList : {
+		showRemoveIcon: true,
+		showPreviewIcon: true,
+		showDownloadIcon: false
+	};
+	const isPictureType = listType === "picture" || listType === "picture-card";
+	return /* @__PURE__ */ jsx("ul", {
+		className: cn("ald-upload-list", `ald-upload-list-${listType}`),
+		children: items.map((file) => {
+			const thumbUrl = isPictureType ? getThumbUrl(file) : void 0;
+			return /* @__PURE__ */ jsxs("li", {
+				className: cn("ald-upload-list-item", `ald-upload-list-item-${file.status || "done"}`),
+				children: [
+					isPictureType && /* @__PURE__ */ jsx("div", {
+						className: "ald-upload-list-item-thumbnail",
+						children: thumbUrl ? /* @__PURE__ */ jsx("img", {
+							src: thumbUrl,
+							alt: file.name
+						}) : /* @__PURE__ */ jsx("div", {
+							className: "ald-upload-list-item-file-icon",
+							children: /* @__PURE__ */ jsx(FileIcon, {})
+						})
+					}),
+					!isPictureType && /* @__PURE__ */ jsxs("span", {
+						className: "ald-upload-list-item-status-icon",
+						children: [
+							file.status === "uploading" && /* @__PURE__ */ jsx("span", {
+								className: "ald-upload-list-item-loading-icon",
+								children: /* @__PURE__ */ jsx(Memo$4, { style: { fontSize: 14 } })
+							}),
+							file.status === "done" && /* @__PURE__ */ jsx(Memo, { style: { fontSize: 14 } }),
+							file.status === "error" && /* @__PURE__ */ jsx(Memo$1, { style: { fontSize: 14 } })
+						]
+					}),
+					/* @__PURE__ */ jsx(Tooltip, {
+						title: file.name,
+						children: /* @__PURE__ */ jsx("span", {
+							className: "ald-upload-list-item-name",
+							onClick: () => onPreview?.(file),
+							style: onPreview ? { cursor: "pointer" } : void 0,
+							children: file.name
+						})
+					}),
+					/* @__PURE__ */ jsxs("span", {
+						className: "ald-upload-list-item-actions",
+						children: [showConfig.showPreviewIcon && onPreview && file.status === "done" && /* @__PURE__ */ jsx("button", {
+							type: "button",
+							className: "ald-upload-list-item-action",
+							title: "Preview",
+							onClick: () => onPreview(file),
+							children: /* @__PURE__ */ jsx(Memo$3, { style: { fontSize: 14 } })
+						}), showConfig.showRemoveIcon !== false && !disabled && /* @__PURE__ */ jsx("button", {
+							type: "button",
+							className: "ald-upload-list-item-action",
+							title: "Remove",
+							onClick: () => onRemove?.(file),
+							children: listType === "picture-card" ? /* @__PURE__ */ jsx(Memo$5, { style: { fontSize: 14 } }) : /* @__PURE__ */ jsx(Memo$2, { style: { fontSize: 14 } })
+						})]
+					}),
+					file.status === "uploading" && /* @__PURE__ */ jsx("div", {
+						className: "ald-upload-list-item-progress",
+						children: /* @__PURE__ */ jsx("div", {
+							className: "ald-upload-list-item-progress-bar",
+							style: { width: `${file.percent ?? 0}%` }
+						})
+					})
+				]
+			}, file.uid);
+		})
+	});
+}
+function FileIcon() {
+	return /* @__PURE__ */ jsxs("svg", {
+		width: "14",
+		height: "14",
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: "2",
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		children: [/* @__PURE__ */ jsx("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }), /* @__PURE__ */ jsx("polyline", { points: "14 2 14 8 20 8" })]
+	});
+}
+function Upload(props) {
+	const { accept, action, method, headers, data, withCredentials, beforeUpload, customRequest, disabled = false, fileList: controlledFileList, defaultFileList, maxCount, multiple, directory, name = "file", listType = "text", showUploadList = true, onChange, onRemove, onPreview, onDownload, className, style, children, openFileDialogOnClick = true, id } = props;
+	const isControlled = controlledFileList !== void 0;
+	const [internalFileList, setInternalFileList] = useState(defaultFileList ?? []);
+	const mergedFileList = isControlled ? controlledFileList : internalFileList;
+	const fileListRef = useRef(mergedFileList);
+	fileListRef.current = mergedFileList;
+	const rcUploadRef = useRef(null);
+	const updateFileList = useCallback((newFile, event) => {
+		const nextList = fileListRef.current.map((f) => f.uid === newFile.uid ? newFile : f);
+		if (!nextList.some((f) => f.uid === newFile.uid)) nextList.push(newFile);
+		if (!isControlled) setInternalFileList(nextList);
+		onChange?.({
+			file: newFile,
+			fileList: nextList,
+			event
+		});
+	}, [isControlled, onChange]);
+	const onBatchStart = useCallback((batchFileInfoList) => {
+		let nextList = [...fileListRef.current];
+		for (const { file } of batchFileInfoList) {
+			const uploadFile = fileToUploadFile(file, "uploading");
+			if (maxCount && nextList.length >= maxCount) {
+				if (maxCount === 1) nextList = [uploadFile];
+				continue;
+			}
+			nextList.push(uploadFile);
+		}
+		if (!isControlled) setInternalFileList(nextList);
+		const firstNew = batchFileInfoList[0];
+		if (firstNew) {
+			const f = nextList.find((x) => x.uid === firstNew.file.uid);
+			if (f) onChange?.({
+				file: f,
+				fileList: nextList
+			});
+		}
+	}, [
+		isControlled,
+		maxCount,
+		onChange
+	]);
+	const onRcProgress = useCallback((event, file) => {
+		const target = fileListRef.current.find((f) => f.uid === file.uid);
+		if (!target) return;
+		updateFileList({
+			...target,
+			status: "uploading",
+			percent: event.percent ?? 0
+		}, event);
+	}, [updateFileList]);
+	const onRcSuccess = useCallback((response, file) => {
+		const target = fileListRef.current.find((f) => f.uid === file.uid);
+		if (!target) return;
+		updateFileList({
+			...target,
+			status: "done",
+			percent: 100,
+			response
+		});
+	}, [updateFileList]);
+	const onRcError = useCallback((error, _ret, file) => {
+		const target = fileListRef.current.find((f) => f.uid === file.uid);
+		if (!target) return;
+		updateFileList({
+			...target,
+			status: "error",
+			error
+		});
+	}, [updateFileList]);
+	const handleRemove = useCallback(async (file) => {
+		if (await onRemove?.(file) === false) return;
+		const nextList = fileListRef.current.filter((f) => f.uid !== file.uid);
+		if (!isControlled) setInternalFileList(nextList);
+		const removedFile = {
+			...file,
+			status: "removed"
+		};
+		onChange?.({
+			file: removedFile,
+			fileList: nextList
+		});
+	}, [
+		isControlled,
+		onChange,
+		onRemove
+	]);
+	const rcUploadProps = useMemo(() => ({
+		accept,
+		action,
+		method,
+		headers,
+		data,
+		withCredentials,
+		beforeUpload,
+		customRequest,
+		disabled,
+		multiple,
+		directory,
+		name,
+		openFileDialogOnClick,
+		id,
+		prefixCls: "ald-upload",
+		onBatchStart,
+		onProgress: onRcProgress,
+		onSuccess: onRcSuccess,
+		onError: onRcError
+	}), [
+		accept,
+		action,
+		method,
+		headers,
+		data,
+		withCredentials,
+		beforeUpload,
+		customRequest,
+		disabled,
+		multiple,
+		directory,
+		name,
+		openFileDialogOnClick,
+		id,
+		onBatchStart,
+		onRcProgress,
+		onRcSuccess,
+		onRcError
+	]);
+	const isPictureCard = listType === "picture-card";
+	return /* @__PURE__ */ jsx("span", {
+		className: cn("ald-upload", { "ald-upload-disabled": disabled }, className),
+		style,
+		children: isPictureCard ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(UploadList, {
+			items: mergedFileList,
+			listType,
+			showUploadList,
+			onRemove: handleRemove,
+			onPreview,
+			onDownload,
+			disabled
+		}), (!maxCount || mergedFileList.length < maxCount) && /* @__PURE__ */ jsx(RcUpload, {
+			...rcUploadProps,
+			ref: rcUploadRef,
+			children: /* @__PURE__ */ jsx("div", {
+				className: "ald-upload-select",
+				children
+			})
+		})] }) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(RcUpload, {
+			...rcUploadProps,
+			ref: rcUploadRef,
+			children: /* @__PURE__ */ jsx("div", {
+				className: "ald-upload-select",
+				children
+			})
+		}), /* @__PURE__ */ jsx(UploadList, {
+			items: mergedFileList,
+			listType,
+			showUploadList,
+			onRemove: handleRemove,
+			onPreview,
+			onDownload,
+			disabled
+		})] })
+	});
+}
+function Dragger(props) {
+	const { height, style, disabled, className, children, ...restProps } = props;
+	const [dragOver, setDragOver] = useState(false);
+	const mergedStyle = {
+		...style,
+		...height !== null && height !== void 0 ? { height } : {}
+	};
+	return /* @__PURE__ */ jsx(Upload, {
+		...restProps,
+		disabled,
+		className: cn("ald-upload-dragger-wrapper", className),
+		style: mergedStyle,
+		children: /* @__PURE__ */ jsx("div", {
+			className: cn("ald-upload-dragger", {
+				"ald-upload-drag-hover": dragOver,
+				"ald-upload-disabled": disabled
+			}),
+			onDragOver: (e) => {
+				e.preventDefault();
+				if (!disabled) setDragOver(true);
+			},
+			onDragLeave: () => setDragOver(false),
+			onDrop: () => setDragOver(false),
+			children
+		})
+	});
+}
+Upload.Dragger = Dragger;
+//#endregion
+export { Upload as default };
+
+//# sourceMappingURL=index.js.map

package/dist/Upload/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/Upload/index.tsx"],"sourcesContent":["import './upload.css';\n\nimport RcUpload from 'rc-upload';\nimport type {\n  RcFile as RcUploadFile,\n  UploadProgressEvent,\n  UploadProps as RcUploadProps,\n} from 'rc-upload/es/interface';\nimport React, { useCallback, useMemo, useRef, useState } from 'react';\nimport {\n  CheckCircleFill,\n  CloseCircleFill,\n  CloseLightLine,\n  EyeOnLine,\n  LoadingLine,\n  TrashLightLine,\n} from '../Icon';\nimport { cn } from '../lib/utils';\nimport Tooltip from '../Tooltip';\n\n// ---------------------------------------------------------------------------\n// Public types – preserved from the previous API surface\n// ---------------------------------------------------------------------------\n\nexport interface UploadFile<T = any> {\n  uid: string;\n  name: string;\n  status?: 'uploading' | 'done' | 'error' | 'removed';\n  url?: string;\n  thumbUrl?: string;\n  size?: number;\n  type?: string;\n  percent?: number;\n  originFileObj?: RcFile;\n  response?: T;\n  error?: any;\n  linkProps?: any;\n}\n\nexport type RcFile = RcUploadFile;\n\nexport interface UploadChangeParam<T = UploadFile> {\n  file: T;\n  fileList: T[];\n  event?: UploadProgressEvent;\n}\n\nexport interface ShowUploadListInterface {\n  showRemoveIcon?: boolean;\n  showPreviewIcon?: boolean;\n  showDownloadIcon?: boolean;\n}\n\nexport interface UploadProps<T = any> {\n  accept?: string;\n  action?: string | ((file: RcFile) => string | Promise<string>);\n  method?: 'POST' | 'PUT' | 'PATCH' | 'post' | 'put' | 'patch';\n  headers?: Record<string, string>;\n  data?:\n    | Record<string, unknown>\n    | ((file: RcFile | string | Blob) => Record<string, unknown>);\n  withCredentials?: boolean;\n  beforeUpload?: (\n    file: RcFile,\n    fileList: RcFile[],\n  ) => boolean | Promise<void | Blob | File>;\n  customRequest?: RcUploadProps['customRequest'];\n  disabled?: boolean;\n  fileList?: UploadFile<T>[];\n  defaultFileList?: UploadFile<T>[];\n  maxCount?: number;\n  multiple?: boolean;\n  directory?: boolean;\n  name?: string;\n  listType?: 'text' | 'picture' | 'picture-card';\n  showUploadList?: boolean | ShowUploadListInterface;\n  onChange?: (info: UploadChangeParam<UploadFile<T>>) => void;\n  onRemove?: (file: UploadFile<T>) => void | boolean | Promise<void | boolean>;\n  onPreview?: (file: UploadFile<T>) => void;\n  onDownload?: (file: UploadFile<T>) => void;\n  className?: string;\n  style?: React.CSSProperties;\n  children?: React.ReactNode;\n  openFileDialogOnClick?: boolean;\n  /** @deprecated Use `id` instead */\n  prefixCls?: string;\n  id?: string;\n}\n\nexport interface UploadListProps {\n  items?: UploadFile[];\n  listType?: 'text' | 'picture' | 'picture-card';\n  showUploadList?: boolean | ShowUploadListInterface;\n  onRemove?: (file: UploadFile) => void;\n  onPreview?: (file: UploadFile) => void;\n  onDownload?: (file: UploadFile) => void;\n  disabled?: boolean;\n}\n\nexport interface DraggerProps extends UploadProps {\n  height?: number;\n}\n\n// ---------------------------------------------------------------------------\n// Helpers\n// ---------------------------------------------------------------------------\n\nlet fileUid = 0;\n\nfunction getUid(): string {\n  fileUid += 1;\n  return `ald-upload-${Date.now()}-${fileUid}`;\n}\n\nfunction fileToUploadFile(\n  file: RcFile,\n  status: UploadFile['status'] = 'uploading',\n): UploadFile {\n  return {\n    uid: file.uid ?? getUid(),\n    name: file.name,\n    size: file.size,\n    type: file.type,\n    status,\n    percent: 0,\n    originFileObj: file,\n  };\n}\n\nfunction isImageUrl(file: UploadFile): boolean {\n  if (file.type) return file.type.startsWith('image/');\n  const ext = file.name?.split('.').pop()?.toLowerCase() ?? '';\n  return ['png', 'jpg', 'jpeg', 'gif', 'bmp', 'webp', 'svg', 'ico'].includes(\n    ext,\n  );\n}\n\nfunction getThumbUrl(file: UploadFile): string | undefined {\n  if (file.thumbUrl) return file.thumbUrl;\n  if (file.url) return file.url;\n  if (file.originFileObj && isImageUrl(file)) {\n    try {\n      return URL.createObjectURL(file.originFileObj);\n    } catch {\n      return undefined;\n    }\n  }\n  return undefined;\n}\n\n// ---------------------------------------------------------------------------\n// UploadList\n// ---------------------------------------------------------------------------\n\nfunction UploadList({\n  items = [],\n  listType = 'text',\n  showUploadList = true,\n  onRemove,\n  onPreview,\n  disabled,\n}: UploadListProps) {\n  if (!showUploadList || items.length === 0) return null;\n\n  const showConfig: ShowUploadListInterface =\n    typeof showUploadList === 'object'\n      ? showUploadList\n      : {\n          showRemoveIcon: true,\n          showPreviewIcon: true,\n          showDownloadIcon: false,\n        };\n\n  const isPictureType = listType === 'picture' || listType === 'picture-card';\n\n  return (\n    <ul className={cn('ald-upload-list', `ald-upload-list-${listType}`)}>\n      {items.map((file) => {\n        const thumbUrl = isPictureType ? getThumbUrl(file) : undefined;\n\n        return (\n          <li\n            key={file.uid}\n            className={cn(\n              'ald-upload-list-item',\n              `ald-upload-list-item-${file.status || 'done'}`,\n            )}\n          >\n            {/* Thumbnail for picture types */}\n            {isPictureType && (\n              <div className=\"ald-upload-list-item-thumbnail\">\n                {thumbUrl ? (\n                  <img src={thumbUrl} alt={file.name} />\n                ) : (\n                  <div className=\"ald-upload-list-item-file-icon\">\n                    <FileIcon />\n                  </div>\n                )}\n              </div>\n            )}\n\n            {/* Status icon for text type */}\n            {!isPictureType && (\n              <span className=\"ald-upload-list-item-status-icon\">\n                {file.status === 'uploading' && (\n                  <span className=\"ald-upload-list-item-loading-icon\">\n                    <LoadingLine style={{ fontSize: 14 }} />\n                  </span>\n                )}\n                {file.status === 'done' && (\n                  <CheckCircleFill style={{ fontSize: 14 }} />\n                )}\n                {file.status === 'error' && (\n                  <CloseCircleFill style={{ fontSize: 14 }} />\n                )}\n              </span>\n            )}\n\n            {/* File name */}\n            <Tooltip title={file.name}>\n              <span\n                className=\"ald-upload-list-item-name\"\n                onClick={() => onPreview?.(file)}\n                style={onPreview ? { cursor: 'pointer' } : undefined}\n              >\n                {file.name}\n              </span>\n            </Tooltip>\n\n            {/* Actions */}\n            <span className=\"ald-upload-list-item-actions\">\n              {showConfig.showPreviewIcon &&\n                onPreview &&\n                file.status === 'done' && (\n                  <button\n                    type=\"button\"\n                    className=\"ald-upload-list-item-action\"\n                    title=\"Preview\"\n                    onClick={() => onPreview(file)}\n                  >\n                    <EyeOnLine style={{ fontSize: 14 }} />\n                  </button>\n                )}\n              {showConfig.showRemoveIcon !== false && !disabled && (\n                <button\n                  type=\"button\"\n                  className=\"ald-upload-list-item-action\"\n                  title=\"Remove\"\n                  onClick={() => onRemove?.(file)}\n                >\n                  {listType === 'picture-card' ? (\n                    <TrashLightLine style={{ fontSize: 14 }} />\n                  ) : (\n                    <CloseLightLine style={{ fontSize: 14 }} />\n                  )}\n                </button>\n              )}\n            </span>\n\n            {/* Progress bar */}\n            {file.status === 'uploading' && (\n              <div className=\"ald-upload-list-item-progress\">\n                <div\n                  className=\"ald-upload-list-item-progress-bar\"\n                  style={{ width: `${file.percent ?? 0}%` }}\n                />\n              </div>\n            )}\n          </li>\n        );\n      })}\n    </ul>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// Simple file icon SVG (inline to avoid extra dependency)\n// ---------------------------------------------------------------------------\n\nfunction FileIcon() {\n  return (\n    <svg\n      width=\"14\"\n      height=\"14\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\" />\n      <polyline points=\"14 2 14 8 20 8\" />\n    </svg>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// Upload component\n// ---------------------------------------------------------------------------\n\nfunction Upload<T = any>(props: UploadProps<T>) {\n  const {\n    accept,\n    action,\n    method,\n    headers,\n    data,\n    withCredentials,\n    beforeUpload,\n    customRequest,\n    disabled = false,\n    fileList: controlledFileList,\n    defaultFileList,\n    maxCount,\n    multiple,\n    directory,\n    name = 'file',\n    listType = 'text',\n    showUploadList = true,\n    onChange,\n    onRemove,\n    onPreview,\n    onDownload,\n    className,\n    style,\n    children,\n    openFileDialogOnClick = true,\n    id,\n  } = props;\n\n  const isControlled = controlledFileList !== undefined;\n  const [internalFileList, setInternalFileList] = useState<UploadFile<T>[]>(\n    defaultFileList ?? [],\n  );\n\n  const mergedFileList = isControlled ? controlledFileList! : internalFileList;\n\n  // Keep a ref to latest list so callbacks always see fresh state\n  const fileListRef = useRef(mergedFileList);\n  fileListRef.current = mergedFileList;\n\n  const rcUploadRef = useRef<any>(null);\n\n  // ----- helpers to update state & fire onChange -----\n\n  const updateFileList = useCallback(\n    (newFile: UploadFile<T>, event?: UploadProgressEvent) => {\n      const nextList = fileListRef.current.map((f) =>\n        f.uid === newFile.uid ? newFile : f,\n      );\n      // If the file is new, append it\n      if (!nextList.some((f) => f.uid === newFile.uid)) {\n        nextList.push(newFile);\n      }\n      if (!isControlled) {\n        setInternalFileList(nextList);\n      }\n      onChange?.({\n        file: newFile,\n        fileList: nextList,\n        event,\n      });\n    },\n    [isControlled, onChange],\n  );\n\n  // ----- rc-upload callback props -----\n\n  const onBatchStart: RcUploadProps['onBatchStart'] = useCallback(\n    (batchFileInfoList: { file: RcFile; parsedFile: any }[]) => {\n      let nextList = [...fileListRef.current];\n\n      for (const { file } of batchFileInfoList) {\n        const uploadFile = fileToUploadFile(file, 'uploading') as UploadFile<T>;\n\n        if (maxCount && nextList.length >= maxCount) {\n          // replace if maxCount === 1, otherwise skip\n          if (maxCount === 1) {\n            nextList = [uploadFile];\n          }\n          continue;\n        }\n        nextList.push(uploadFile);\n      }\n\n      if (!isControlled) {\n        setInternalFileList(nextList);\n      }\n\n      // Fire onChange for the first new file\n      const firstNew = batchFileInfoList[0];\n      if (firstNew) {\n        const f = nextList.find((x) => x.uid === firstNew.file.uid);\n        if (f) {\n          onChange?.({ file: f, fileList: nextList });\n        }\n      }\n    },\n    [isControlled, maxCount, onChange],\n  );\n\n  const onRcProgress = useCallback(\n    (event: UploadProgressEvent, file: RcFile) => {\n      const target = fileListRef.current.find((f) => f.uid === file.uid);\n      if (!target) return;\n      const updated: UploadFile<T> = {\n        ...target,\n        status: 'uploading',\n        percent: event.percent ?? 0,\n      };\n      updateFileList(updated, event);\n    },\n    [updateFileList],\n  );\n\n  const onRcSuccess = useCallback(\n    (response: any, file: RcFile) => {\n      const target = fileListRef.current.find((f) => f.uid === file.uid);\n      if (!target) return;\n      const updated: UploadFile<T> = {\n        ...target,\n        status: 'done',\n        percent: 100,\n        response,\n      };\n      updateFileList(updated);\n    },\n    [updateFileList],\n  );\n\n  const onRcError = useCallback(\n    (error: Error, _ret: any, file: RcFile) => {\n      const target = fileListRef.current.find((f) => f.uid === file.uid);\n      if (!target) return;\n      const updated: UploadFile<T> = {\n        ...target,\n        status: 'error',\n        error,\n      };\n      updateFileList(updated);\n    },\n    [updateFileList],\n  );\n\n  // ----- remove handler -----\n\n  const handleRemove = useCallback(\n    async (file: UploadFile<T>) => {\n      const result = await onRemove?.(file as any);\n      if (result === false) return;\n      const nextList = fileListRef.current.filter((f) => f.uid !== file.uid);\n      if (!isControlled) {\n        setInternalFileList(nextList);\n      }\n      const removedFile: UploadFile<T> = { ...file, status: 'removed' };\n      onChange?.({ file: removedFile, fileList: nextList });\n    },\n    [isControlled, onChange, onRemove],\n  );\n\n  // ----- rc-upload props -----\n\n  const rcUploadProps: RcUploadProps = useMemo(\n    () => ({\n      accept,\n      action: action as RcUploadProps['action'],\n      method,\n      headers,\n      data: data as RcUploadProps['data'],\n      withCredentials,\n      beforeUpload: beforeUpload as RcUploadProps['beforeUpload'],\n      customRequest,\n      disabled,\n      multiple,\n      directory,\n      name,\n      openFileDialogOnClick,\n      id,\n      prefixCls: 'ald-upload',\n      onBatchStart,\n      onProgress: onRcProgress,\n      onSuccess: onRcSuccess,\n      onError: onRcError,\n    }),\n    [\n      accept,\n      action,\n      method,\n      headers,\n      data,\n      withCredentials,\n      beforeUpload,\n      customRequest,\n      disabled,\n      multiple,\n      directory,\n      name,\n      openFileDialogOnClick,\n      id,\n      onBatchStart,\n      onRcProgress,\n      onRcSuccess,\n      onRcError,\n    ],\n  );\n\n  const isPictureCard = listType === 'picture-card';\n\n  return (\n    <span\n      className={cn(\n        'ald-upload',\n        { 'ald-upload-disabled': disabled },\n        className,\n      )}\n      style={style}\n    >\n      {isPictureCard ? (\n        // picture-card: render list first, then the upload trigger\n        <>\n          <UploadList\n            items={mergedFileList as UploadFile[]}\n            listType={listType}\n            showUploadList={showUploadList}\n            onRemove={handleRemove as any}\n            onPreview={onPreview as any}\n            onDownload={onDownload as any}\n            disabled={disabled}\n          />\n          {(!maxCount || mergedFileList.length < maxCount) && (\n            <RcUpload {...rcUploadProps} ref={rcUploadRef}>\n              <div className=\"ald-upload-select\">{children}</div>\n            </RcUpload>\n          )}\n        </>\n      ) : (\n        // text / picture: render trigger then list\n        <>\n          <RcUpload {...rcUploadProps} ref={rcUploadRef}>\n            <div className=\"ald-upload-select\">{children}</div>\n          </RcUpload>\n          <UploadList\n            items={mergedFileList as UploadFile[]}\n            listType={listType}\n            showUploadList={showUploadList}\n            onRemove={handleRemove as any}\n            onPreview={onPreview as any}\n            onDownload={onDownload as any}\n            disabled={disabled}\n          />\n        </>\n      )}\n    </span>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// Dragger sub-component\n// ---------------------------------------------------------------------------\n\nfunction Dragger(props: DraggerProps) {\n  const { height, style, disabled, className, children, ...restProps } = props;\n  const [dragOver, setDragOver] = useState(false);\n\n  const mergedStyle: React.CSSProperties = {\n    ...style,\n    ...(height !== null && height !== undefined ? { height } : {}),\n  };\n\n  return (\n    <Upload\n      {...restProps}\n      disabled={disabled}\n      className={cn('ald-upload-dragger-wrapper', className)}\n      style={mergedStyle}\n    >\n      <div\n        className={cn('ald-upload-dragger', {\n          'ald-upload-drag-hover': dragOver,\n          'ald-upload-disabled': disabled,\n        })}\n        onDragOver={(e) => {\n          e.preventDefault();\n          if (!disabled) setDragOver(true);\n        }}\n        onDragLeave={() => setDragOver(false)}\n        onDrop={() => setDragOver(false)}\n      >\n        {children}\n      </div>\n    </Upload>\n  );\n}\n\nUpload.Dragger = Dragger;\n\nexport default Upload as typeof Upload & { Dragger: typeof Dragger };\n"],"mappings":"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"}

package/dist/User/index.d.ts

@@ -1,9 +1,11 @@
-import React from 'react';
+import { default as React } from 'react';
 export interface IUserProps {
     src: React.ReactNode | string;
     nickname: string;
     size?: 'small' | 'middle' | 'large';
     nicknameClassName?: string;
+    className?: string;
+    style?: React.CSSProperties;
 }
-declare function User({ src, nickname, size, nicknameClassName, }: IUserProps): React.JSX.Element;
+declare function User({ src, nickname, size, nicknameClassName, className, style, }: IUserProps): import("react/jsx-runtime").JSX.Element;
 export default User;

package/dist/User/index.js

@@ -1,28 +1,33 @@
-import classNames from 'classnames';
-import React from 'react';
-import Avatar from "../Avatar";
-var getAvatarSize = function getAvatarSize(size) {
-  return {
-    small: 16,
-    middle: 20,
-    large: 24
-  }[size];
+import { cn } from "../lib/utils.js";
+import Avatar from "../Avatar/index.js";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/User/index.tsx
+var getAvatarSize = (size) => {
+	return {
+		small: 16,
+		middle: 20,
+		large: 24
+	}[size];
 };
-function User(_ref) {
-  var src = _ref.src,
-    nickname = _ref.nickname,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 'middle' : _ref$size,
-    nicknameClassName = _ref.nicknameClassName;
-  return /*#__PURE__*/React.createElement("div", {
-    className: classNames('ald-user', "ald-user-".concat(size)),
-    title: nickname
-  }, /*#__PURE__*/React.createElement(Avatar, {
-    className: 'ald-user-avatar',
-    src: src,
-    size: getAvatarSize(size || 'middle')
-  }, nickname), /*#__PURE__*/React.createElement("div", {
-    className: classNames('ald-user-text', nicknameClassName)
-  }, nickname));
+function User({ src, nickname, size = "middle", nicknameClassName, className, style }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("ald-user tw-flex tw-items-center", `ald-user-${size}`, size === "small" && "tw-gap-1", size === "middle" && "tw-gap-[6px]", size === "large" && "tw-gap-2", className),
+		style,
+		title: nickname,
+		children: [/* @__PURE__ */ jsx(Avatar, {
+			className: "ald-user-avatar tw-shrink-0",
+			src,
+			size: getAvatarSize(size || "middle"),
+			children: nickname
+		}), /* @__PURE__ */ jsx("div", {
+			className: cn("ald-user-text tw-min-w-0 tw-truncate tw-text-[var(--alias-colors-text-default)]", size === "small" && "tw-text-xs tw-leading-4", size === "middle" && "tw-text-sm tw-leading-5", size === "large" && "tw-text-sm tw-font-medium tw-leading-5", nicknameClassName),
+			style: { width: "calc(100% - 20px - 6px)" },
+			children: nickname
+		})]
+	});
 }
-export default User;
+//#endregion
+export { User as default };
+
+//# sourceMappingURL=index.js.map

package/dist/User/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/User/index.tsx"],"sourcesContent":["import React from 'react';\nimport Avatar from '../Avatar';\nimport { cn } from '../lib/utils';\n\nexport interface IUserProps {\n  src: React.ReactNode | string;\n  nickname: string;\n  size?: 'small' | 'middle' | 'large';\n  nicknameClassName?: string;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nconst getAvatarSize = (size: 'small' | 'middle' | 'large') => {\n  return {\n    small: 16,\n    middle: 20,\n    large: 24,\n  }[size];\n};\n\nfunction User({\n  src,\n  nickname,\n  size = 'middle',\n  nicknameClassName,\n  className,\n  style,\n}: IUserProps) {\n  return (\n    <div\n      className={cn(\n        'ald-user tw-flex tw-items-center',\n        `ald-user-${size}`,\n        size === 'small' && 'tw-gap-1',\n        size === 'middle' && 'tw-gap-[6px]',\n        size === 'large' && 'tw-gap-2',\n        className,\n      )}\n      style={style}\n      title={nickname}\n    >\n      <Avatar\n        className=\"ald-user-avatar tw-shrink-0\"\n        src={src}\n        size={getAvatarSize(size || 'middle')}\n      >\n        {nickname}\n      </Avatar>\n      <div\n        className={cn(\n          'ald-user-text tw-min-w-0 tw-truncate tw-text-[var(--alias-colors-text-default)]',\n          size === 'small' && 'tw-text-xs tw-leading-4',\n          size === 'middle' && 'tw-text-sm tw-leading-5',\n          size === 'large' && 'tw-text-sm tw-font-medium tw-leading-5',\n          nicknameClassName,\n        )}\n        style={{ width: 'calc(100% - 20px - 6px)' }}\n      >\n        {nickname}\n      </div>\n    </div>\n  );\n}\n\nexport default User;\n"],"mappings":";;;;;AAaA,IAAM,iBAAiB,SAAuC;AAC5D,QAAO;EACL,OAAO;EACP,QAAQ;EACR,OAAO;EACR,CAAC;;AAGJ,SAAS,KAAK,EACZ,KACA,UACA,OAAO,UACP,mBACA,WACA,SACa;AACb,QACE,qBAAC,OAAD;EACE,WAAW,GACT,oCACA,YAAY,QACZ,SAAS,WAAW,YACpB,SAAS,YAAY,gBACrB,SAAS,WAAW,YACpB,UACD;EACM;EACP,OAAO;YAVT,CAYE,oBAAC,QAAD;GACE,WAAU;GACL;GACL,MAAM,cAAc,QAAQ,SAAS;aAEpC;GACM,CAAA,EACT,oBAAC,OAAD;GACE,WAAW,GACT,mFACA,SAAS,WAAW,2BACpB,SAAS,YAAY,2BACrB,SAAS,WAAW,0CACpB,kBACD;GACD,OAAO,EAAE,OAAO,2BAA2B;aAE1C;GACG,CAAA,CACF"}

package/dist/Watermark/index.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 export interface IFont {
     color?: string;
     fontSize?: number | string;
@@ -21,5 +21,5 @@ export interface IWatermarkProps {
     offset?: [number, number];
     children?: React.ReactNode;
 }
-declare function Watermark(props: IWatermarkProps): React.JSX.Element;
+declare function Watermark(props: IWatermarkProps): import("react/jsx-runtime").JSX.Element;
 export default Watermark;

package/dist/Watermark/index.js

@@ -1,6 +1,63 @@
-import { Watermark as AntdWatermark } from 'antd';
-import React from 'react';
+import { cn } from "../lib/utils.js";
+import { useEffect, useRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/Watermark/index.tsx
 function Watermark(props) {
-  return /*#__PURE__*/React.createElement(AntdWatermark, props);
+	const { zIndex = 9, rotate = -22, width = 120, height = 64, content, font, style, className, gap = [100, 100], offset, children } = props;
+	const containerRef = useRef(null);
+	const watermarkRef = useRef(null);
+	useEffect(() => {
+		if (!content || !watermarkRef.current) return;
+		const canvas = document.createElement("canvas");
+		const ctx = canvas.getContext("2d");
+		if (!ctx) return;
+		const ratio = window.devicePixelRatio || 1;
+		const canvasWidth = (width + gap[0]) * ratio;
+		const canvasHeight = (height + gap[1]) * ratio;
+		canvas.width = canvasWidth;
+		canvas.height = canvasHeight;
+		ctx.translate(canvasWidth / 2, canvasHeight / 2);
+		ctx.rotate(rotate * Math.PI / 180);
+		const fontSize = font?.fontSize || 14;
+		const fontFamily = font?.fontFamily || "sans-serif";
+		const fontWeight = font?.fontWeight || "normal";
+		const fontColor = font?.color || "rgba(0, 0, 0, 0.1)";
+		ctx.font = `${fontWeight} ${fontSize}px ${fontFamily}`;
+		ctx.fillStyle = fontColor;
+		ctx.textAlign = "center";
+		ctx.textBaseline = "middle";
+		const lines = Array.isArray(content) ? content : [content];
+		const lineHeight = typeof fontSize === "number" ? fontSize * 1.5 : 21;
+		lines.forEach((line, i) => {
+			const y = (i - (lines.length - 1) / 2) * lineHeight;
+			ctx.fillText(line, 0, y);
+		});
+		const base64Url = canvas.toDataURL();
+		watermarkRef.current.style.backgroundImage = `url(${base64Url})`;
+		watermarkRef.current.style.backgroundSize = `${width + gap[0]}px`;
+	}, [
+		content,
+		width,
+		height,
+		rotate,
+		gap,
+		font
+	]);
+	return /* @__PURE__ */ jsxs("div", {
+		ref: containerRef,
+		className: cn("ald-watermark tw-relative", className),
+		style,
+		children: [children, /* @__PURE__ */ jsx("div", {
+			ref: watermarkRef,
+			className: "tw-pointer-events-none tw-absolute tw-inset-0 tw-bg-repeat",
+			style: {
+				zIndex,
+				backgroundPosition: offset ? `${offset[0]}px ${offset[1]}px` : void 0
+			}
+		})]
+	});
 }
-export default Watermark;
+//#endregion
+export { Watermark as default };
+
+//# sourceMappingURL=index.js.map

package/dist/Watermark/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/Watermark/index.tsx"],"sourcesContent":["import React, { useEffect, useRef } from 'react';\nimport { cn } from '../lib/utils';\n\nexport interface IFont {\n  color?: string;\n  fontSize?: number | string;\n  fontWeight?: 'normal' | 'light' | 'weight' | number;\n  fontStyle?: 'none' | 'normal' | 'italic' | 'oblique';\n  fontFamily?: string;\n}\n\nexport interface IWatermarkProps {\n  zIndex?: number;\n  rotate?: number;\n  width?: number;\n  height?: number;\n  image?: string;\n  content?: string | string[];\n  font?: IFont;\n  style?: React.CSSProperties;\n  className?: string;\n  rootClassName?: string;\n  gap?: [number, number];\n  offset?: [number, number];\n  children?: React.ReactNode;\n}\n\nfunction Watermark(props: IWatermarkProps) {\n  const {\n    zIndex = 9,\n    rotate = -22,\n    width = 120,\n    height = 64,\n    content,\n    font,\n    style,\n    className,\n    gap = [100, 100],\n    offset,\n    children,\n  } = props;\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const watermarkRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (!content || !watermarkRef.current) return;\n\n    const canvas = document.createElement('canvas');\n    const ctx = canvas.getContext('2d');\n    if (!ctx) return;\n\n    const ratio = window.devicePixelRatio || 1;\n    const canvasWidth = (width + gap[0]) * ratio;\n    const canvasHeight = (height + gap[1]) * ratio;\n    canvas.width = canvasWidth;\n    canvas.height = canvasHeight;\n\n    ctx.translate(canvasWidth / 2, canvasHeight / 2);\n    ctx.rotate((rotate * Math.PI) / 180);\n\n    const fontSize = font?.fontSize || 14;\n    const fontFamily = font?.fontFamily || 'sans-serif';\n    const fontWeight = font?.fontWeight || 'normal';\n    const fontColor = font?.color || 'rgba(0, 0, 0, 0.1)';\n\n    ctx.font = `${fontWeight} ${fontSize}px ${fontFamily}`;\n    ctx.fillStyle = fontColor;\n    ctx.textAlign = 'center';\n    ctx.textBaseline = 'middle';\n\n    const lines = Array.isArray(content) ? content : [content];\n    const lineHeight = typeof fontSize === 'number' ? fontSize * 1.5 : 21;\n    lines.forEach((line, i) => {\n      const y = (i - (lines.length - 1) / 2) * lineHeight;\n      ctx.fillText(line, 0, y);\n    });\n\n    const base64Url = canvas.toDataURL();\n    watermarkRef.current.style.backgroundImage = `url(${base64Url})`;\n    watermarkRef.current.style.backgroundSize = `${width + gap[0]}px`;\n  }, [content, width, height, rotate, gap, font]);\n\n  return (\n    <div\n      ref={containerRef}\n      className={cn('ald-watermark tw-relative', className)}\n      style={style}\n    >\n      {children}\n      <div\n        ref={watermarkRef}\n        className=\"tw-pointer-events-none tw-absolute tw-inset-0 tw-bg-repeat\"\n        style={{\n          zIndex,\n          backgroundPosition: offset\n            ? `${offset[0]}px ${offset[1]}px`\n            : undefined,\n        }}\n      />\n    </div>\n  );\n}\n\nexport default Watermark;\n"],"mappings":";;;;AA2BA,SAAS,UAAU,OAAwB;CACzC,MAAM,EACJ,SAAS,GACT,SAAS,KACT,QAAQ,KACR,SAAS,IACT,SACA,MACA,OACA,WACA,MAAM,CAAC,KAAK,IAAI,EAChB,QACA,aACE;CAEJ,MAAM,eAAe,OAAuB,KAAK;CACjD,MAAM,eAAe,OAAuB,KAAK;AAEjD,iBAAgB;AACd,MAAI,CAAC,WAAW,CAAC,aAAa,QAAS;EAEvC,MAAM,SAAS,SAAS,cAAc,SAAS;EAC/C,MAAM,MAAM,OAAO,WAAW,KAAK;AACnC,MAAI,CAAC,IAAK;EAEV,MAAM,QAAQ,OAAO,oBAAoB;EACzC,MAAM,eAAe,QAAQ,IAAI,MAAM;EACvC,MAAM,gBAAgB,SAAS,IAAI,MAAM;AACzC,SAAO,QAAQ;AACf,SAAO,SAAS;AAEhB,MAAI,UAAU,cAAc,GAAG,eAAe,EAAE;AAChD,MAAI,OAAQ,SAAS,KAAK,KAAM,IAAI;EAEpC,MAAM,WAAW,MAAM,YAAY;EACnC,MAAM,aAAa,MAAM,cAAc;EACvC,MAAM,aAAa,MAAM,cAAc;EACvC,MAAM,YAAY,MAAM,SAAS;AAEjC,MAAI,OAAO,GAAG,WAAW,GAAG,SAAS,KAAK;AAC1C,MAAI,YAAY;AAChB,MAAI,YAAY;AAChB,MAAI,eAAe;EAEnB,MAAM,QAAQ,MAAM,QAAQ,QAAQ,GAAG,UAAU,CAAC,QAAQ;EAC1D,MAAM,aAAa,OAAO,aAAa,WAAW,WAAW,MAAM;AACnE,QAAM,SAAS,MAAM,MAAM;GACzB,MAAM,KAAK,KAAK,MAAM,SAAS,KAAK,KAAK;AACzC,OAAI,SAAS,MAAM,GAAG,EAAE;IACxB;EAEF,MAAM,YAAY,OAAO,WAAW;AACpC,eAAa,QAAQ,MAAM,kBAAkB,OAAO,UAAU;AAC9D,eAAa,QAAQ,MAAM,iBAAiB,GAAG,QAAQ,IAAI,GAAG;IAC7D;EAAC;EAAS;EAAO;EAAQ;EAAQ;EAAK;EAAK,CAAC;AAE/C,QACE,qBAAC,OAAD;EACE,KAAK;EACL,WAAW,GAAG,6BAA6B,UAAU;EAC9C;YAHT,CAKG,UACD,oBAAC,OAAD;GACE,KAAK;GACL,WAAU;GACV,OAAO;IACL;IACA,oBAAoB,SAChB,GAAG,OAAO,GAAG,KAAK,OAAO,GAAG,MAC5B;IACL;GACD,CAAA,CACE"}

package/dist/_utils/SimpleOverflow.d.ts

@@ -0,0 +1,14 @@
+import { default as React } from 'react';
+interface SimpleOverflowProps<T> {
+    data: T[];
+    renderItem: (item: T, index: number) => React.ReactNode;
+    renderRest?: (omittedItems: T[]) => React.ReactNode;
+    suffix?: React.ReactNode;
+    itemKey?: string | ((item: T) => string);
+    maxCount?: 'responsive' | number;
+    className?: string;
+    prefixCls?: string;
+    onVisibleChange?: (visibleCount: number) => void;
+}
+export default function SimpleOverflow<T>(props: SimpleOverflowProps<T>): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/_utils/SimpleOverflow.js

@@ -0,0 +1,61 @@
+import { cn } from "../lib/utils.js";
+import { useEffect, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/_utils/SimpleOverflow.tsx
+function SimpleOverflow(props) {
+	const { data, renderItem, renderRest, suffix, itemKey, className, prefixCls, onVisibleChange } = props;
+	const containerRef = useRef(null);
+	const [visibleCount, setVisibleCount] = useState(data.length);
+	useEffect(() => {
+		const container = containerRef.current;
+		if (!container) return;
+		const measure = () => {
+			const overflowItems = [];
+			for (const child of Array.from(container.children)) if (child.dataset.overflowItem === "true") overflowItems.push(child);
+			if (overflowItems.length === 0) return;
+			const savedDisplays = overflowItems.map((el) => el.style.display);
+			overflowItems.forEach((el) => {
+				el.style.display = "";
+			});
+			container.offsetHeight;
+			const containerRect = container.getBoundingClientRect();
+			let count = 0;
+			for (const el of overflowItems) if (el.getBoundingClientRect().right <= containerRect.right - 40) count++;
+			else break;
+			overflowItems.forEach((el, i) => {
+				el.style.display = savedDisplays[i];
+			});
+			const newCount = Math.max(1, Math.min(count, data.length));
+			setVisibleCount(newCount);
+			onVisibleChange?.(newCount);
+		};
+		measure();
+		const ro = new window.ResizeObserver(measure);
+		ro.observe(container);
+		return () => ro.disconnect();
+	}, [data.length, onVisibleChange]);
+	const getKey = (item, index) => {
+		if (typeof itemKey === "function") return itemKey(item);
+		if (typeof itemKey === "string") return item[itemKey];
+		return String(index);
+	};
+	const omittedItems = data.slice(visibleCount);
+	return /* @__PURE__ */ jsxs("div", {
+		ref: containerRef,
+		className: cn(prefixCls, "tw-flex tw-flex-nowrap tw-items-center tw-overflow-hidden", className),
+		children: [
+			data.map((item, index) => /* @__PURE__ */ jsx("div", {
+				"data-overflow-item": "true",
+				className: prefixCls ? `${prefixCls}-item` : void 0,
+				style: { display: index < visibleCount ? void 0 : "none" },
+				children: renderItem(item, index)
+			}, getKey(item, index))),
+			omittedItems.length > 0 && renderRest?.(omittedItems),
+			suffix
+		]
+	});
+}
+//#endregion
+export { SimpleOverflow as default };
+
+//# sourceMappingURL=SimpleOverflow.js.map

package/dist/_utils/SimpleOverflow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SimpleOverflow.js","names":[],"sources":["../../src/_utils/SimpleOverflow.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { cn } from '../lib/utils';\n\ninterface SimpleOverflowProps<T> {\n  data: T[];\n  renderItem: (item: T, index: number) => React.ReactNode;\n  renderRest?: (omittedItems: T[]) => React.ReactNode;\n  suffix?: React.ReactNode;\n  itemKey?: string | ((item: T) => string);\n  maxCount?: 'responsive' | number;\n  className?: string;\n  prefixCls?: string;\n  onVisibleChange?: (visibleCount: number) => void;\n}\n\nexport default function SimpleOverflow<T>(props: SimpleOverflowProps<T>) {\n  const {\n    data,\n    renderItem,\n    renderRest,\n    suffix,\n    itemKey,\n    className,\n    prefixCls,\n    onVisibleChange,\n  } = props;\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const [visibleCount, setVisibleCount] = useState(data.length);\n\n  useEffect(() => {\n    const container = containerRef.current;\n    if (!container) return;\n\n    const measure = () => {\n      const overflowItems: HTMLElement[] = [];\n      for (const child of Array.from(container.children)) {\n        if ((child as HTMLElement).dataset.overflowItem === 'true') {\n          overflowItems.push(child as HTMLElement);\n        }\n      }\n      if (overflowItems.length === 0) return;\n\n      // Temporarily show all items so we can measure their natural positions\n      const savedDisplays = overflowItems.map((el) => el.style.display);\n      overflowItems.forEach((el) => {\n        el.style.display = '';\n      });\n      // Force synchronous reflow\n      void container.offsetHeight;\n\n      const containerRect = container.getBoundingClientRect();\n      let count = 0;\n      for (const el of overflowItems) {\n        const rect = el.getBoundingClientRect();\n        if (rect.right <= containerRect.right - 40) {\n          count++;\n        } else {\n          break;\n        }\n      }\n\n      // Restore display values before React re-renders\n      overflowItems.forEach((el, i) => {\n        el.style.display = savedDisplays[i];\n      });\n\n      const newCount = Math.max(1, Math.min(count, data.length));\n      setVisibleCount(newCount);\n      onVisibleChange?.(newCount);\n    };\n\n    measure();\n    const ro = new window.ResizeObserver(measure);\n    ro.observe(container);\n    return () => ro.disconnect();\n  }, [data.length, onVisibleChange]);\n\n  const getKey = (item: T, index: number) => {\n    if (typeof itemKey === 'function') return itemKey(item);\n    if (typeof itemKey === 'string')\n      return (item as Record<string, string>)[itemKey];\n    return String(index);\n  };\n\n  const omittedItems = data.slice(visibleCount);\n\n  return (\n    <div\n      ref={containerRef}\n      className={cn(\n        prefixCls,\n        'tw-flex tw-flex-nowrap tw-items-center tw-overflow-hidden',\n        className,\n      )}\n    >\n      {data.map((item, index) => (\n        <div\n          key={getKey(item, index)}\n          data-overflow-item=\"true\"\n          className={prefixCls ? `${prefixCls}-item` : undefined}\n          style={{\n            display: index < visibleCount ? undefined : 'none',\n          }}\n        >\n          {renderItem(item, index)}\n        </div>\n      ))}\n      {omittedItems.length > 0 && renderRest?.(omittedItems)}\n      {suffix}\n    </div>\n  );\n}\n"],"mappings":";;;;AAeA,SAAwB,eAAkB,OAA+B;CACvE,MAAM,EACJ,MACA,YACA,YACA,QACA,SACA,WACA,WACA,oBACE;CAEJ,MAAM,eAAe,OAAuB,KAAK;CACjD,MAAM,CAAC,cAAc,mBAAmB,SAAS,KAAK,OAAO;AAE7D,iBAAgB;EACd,MAAM,YAAY,aAAa;AAC/B,MAAI,CAAC,UAAW;EAEhB,MAAM,gBAAgB;GACpB,MAAM,gBAA+B,EAAE;AACvC,QAAK,MAAM,SAAS,MAAM,KAAK,UAAU,SAAS,CAChD,KAAK,MAAsB,QAAQ,iBAAiB,OAClD,eAAc,KAAK,MAAqB;AAG5C,OAAI,cAAc,WAAW,EAAG;GAGhC,MAAM,gBAAgB,cAAc,KAAK,OAAO,GAAG,MAAM,QAAQ;AACjE,iBAAc,SAAS,OAAO;AAC5B,OAAG,MAAM,UAAU;KACnB;AAEF,GAAK,UAAU;GAEf,MAAM,gBAAgB,UAAU,uBAAuB;GACvD,IAAI,QAAQ;AACZ,QAAK,MAAM,MAAM,cAEf,KADa,GAAG,uBAAuB,CAC9B,SAAS,cAAc,QAAQ,GACtC;OAEA;AAKJ,iBAAc,SAAS,IAAI,MAAM;AAC/B,OAAG,MAAM,UAAU,cAAc;KACjC;GAEF,MAAM,WAAW,KAAK,IAAI,GAAG,KAAK,IAAI,OAAO,KAAK,OAAO,CAAC;AAC1D,mBAAgB,SAAS;AACzB,qBAAkB,SAAS;;AAG7B,WAAS;EACT,MAAM,KAAK,IAAI,OAAO,eAAe,QAAQ;AAC7C,KAAG,QAAQ,UAAU;AACrB,eAAa,GAAG,YAAY;IAC3B,CAAC,KAAK,QAAQ,gBAAgB,CAAC;CAElC,MAAM,UAAU,MAAS,UAAkB;AACzC,MAAI,OAAO,YAAY,WAAY,QAAO,QAAQ,KAAK;AACvD,MAAI,OAAO,YAAY,SACrB,QAAQ,KAAgC;AAC1C,SAAO,OAAO,MAAM;;CAGtB,MAAM,eAAe,KAAK,MAAM,aAAa;AAE7C,QACE,qBAAC,OAAD;EACE,KAAK;EACL,WAAW,GACT,WACA,6DACA,UACD;YANH;GAQG,KAAK,KAAK,MAAM,UACf,oBAAC,OAAD;IAEE,sBAAmB;IACnB,WAAW,YAAY,GAAG,UAAU,SAAS;IAC7C,OAAO,EACL,SAAS,QAAQ,eAAe,SAAY,QAC7C;cAEA,WAAW,MAAM,MAAM;IACpB,EARC,OAAO,MAAM,MAAM,CAQpB,CACN;GACD,aAAa,SAAS,KAAK,aAAa,aAAa;GACrD;GACG"}