@comitor/ui 2.0.0 → 3.0.0

package/dist/uploader/use-file-upload.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/uploader/use-file-upload.ts"],"sourcesContent":["\"use client\";\n\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport { DEFAULT_FILE_UPLOAD_LABELS, type FileUploadLogicLabels } from \"./file-upload-constants.js\";\n\n/**\n * Phần MÁY MÓC của việc tải tệp, tách khỏi mọi quyết định về hình dạng.\n *\n * ── VÌ SAO TÁCH ───────────────────────────────────────────────────────────────────────────────\n * `FileUpload` vẽ một khung kéo-thả viền đứt nét — đúng cho tài liệu nhiều tệp, **sai** cho một ô\n * ảnh đại diện 56px. Nhưng phần bên dưới thì hai ca cần y hệt nhau: hàng đợi Uppy, tiến độ theo\n * byte, bốn cạm bẫy của `@uppy/xhr-upload`, và việc xoá `input.value` sau mỗi lượt.\n *\n * Đường cắt này không phải một trừu tượng mới bịa ra: trong `file-upload.tsx` bản 1.2.0, toàn bộ\n * khối `start` + `useEffect` dọn dẹp + ba `useState` **không chạm một dòng JSX nào**, còn JSX thì\n * chỉ đọc `busy`/`percent`/`dragging`. Đây là việc đặt tên cho một ranh giới đã có sẵn.\n *\n * ⚠ `inputProps` và `dropProps` là **prop-getter**: chỗ gọi phải rải chúng lên đúng phần tử. Thiếu\n * `<input {...inputProps} />` thì `open()` không làm gì, và triệu chứng là một nút bấm im lặng.\n * `dropProps` đã tự gọi `preventDefault` — lỗi kinh điển khi để app tự viết.\n */\n/**\n * Bề mặt Uppy mà component này dùng — khai TAY, không import kiểu thật.\n *\n * Hai lý do, cả hai đều thực dụng: kiểu thật của `Uppy` mang generic `<Meta, Body>` và đổi hình\n * dạng giữa các bản major; và `@uppy/core` là peer TUỲ CHỌN, nên `import type` từ nó sẽ làm\n * `tsc` của một app KHÔNG cài Uppy báo đỏ ở một file họ không hề dùng.\n *\n * Cái giá: nếu Uppy đổi tên một phương thức thì lỗi lộ ra lúc CHẠY, không lúc biên dịch. Bù lại\n * bằng `scripts/smoke-entries.mjs` — nó nạp thật entry này ở mỗi lần publish.\n */\ninterface UppyLike {\n  addFile: (file: { name: string; type: string; data: File }) => void;\n  upload: () => Promise<unknown>;\n  cancelAll: () => void;\n  destroy: () => void;\n  on: (event: string, handler: (...args: never[]) => void) => void;\n  use: (plugin: unknown, options?: unknown) => unknown;\n}\n\n/**\n * Nạp Uppy LƯỜI — chỉ khi người dùng thật sự chọn tệp.\n *\n * `import()` động giữ Uppy ra khỏi bundle của lượt tải trang đầu tiên. Với một màn hồ sơ mà đa số\n * người mở ra chỉ để xem, đó là toàn bộ chi phí của Uppy bị hoãn tới lúc nó thật sự có việc.\n *\n * ⚠ Hai gói này là **peer TUỲ CHỌN**. App không cài mà lại render component này thì `import()` sẽ\n * hỏng — nên lỗi được bắt và trả về qua `onError` với thông điệp nói đúng tên gói phải cài, thay vì\n * một `ChunkLoadError` không gợi gì.\n */\nasync function loadUppy(): Promise<{ Uppy: new (o: unknown) => UppyLike; XHRUpload: unknown } | null> {\n  try {\n    const [core, xhr] = await Promise.all([import(\"@uppy/core\"), import(\"@uppy/xhr-upload\")]);\n    return {\n      // `as unknown as` là bắt buộc: kiểu thật của Uppy có generic `<Meta, Body>` mà `UppyLike`\n      // cố ý không mang. Xem ghi chú ở `UppyLike` về việc vì sao gói này không dùng kiểu thật.\n      Uppy: (core.default ?? (core as unknown as { Uppy: unknown }).Uppy) as unknown as new (o: unknown) => UppyLike,\n      XHRUpload: xhr.default ?? xhr\n    };\n  } catch {\n    return null;\n  }\n}\n\nexport interface UseFileUploadOptions<T = unknown> {\n  /** Đường dẫn endpoint nhận multipart, ví dụ `/api/account/avatar`. */\n  endpoint: string;\n  /** Tên trường trong `FormData`. Mặc định `\"file\"`. */\n  fieldName?: string;\n  maxFileSize: number;\n  allowedFileTypes: string[];\n  maxNumberOfFiles?: number;\n  onUploaded: (result: FileUploadResult<T>) => void;\n  onError?: (error: { code?: string; status?: number; message: string }) => void;\n  /**\n   * CHỈ hai chuỗi mà phần máy móc thật sự dùng.\n   *\n   * Cố ý KHÔNG nhận cả `FileUploadLabels`: ba chuỗi còn lại (`dropHint`/`choose`/`uploading`) là\n   * của bố cục, và để chúng lọt vào đây là mời người viết truyền một prop không bao giờ chạy.\n   */\n  labels?: Partial<FileUploadLogicLabels>;\n  disabled?: boolean;\n}\n\n/** Kết quả một tệp tải xong: thân phản hồi JSON của endpoint app. */\nexport interface FileUploadResult<T = unknown> {\n  body: T;\n  fileName: string;\n}\n\nexport interface UseFileUploadResult {\n  /** Mở hộp chọn tệp. Cần `<input {...inputProps} />` có mặt trong cây. */\n  open: () => void;\n  /** Bắt đầu tải một danh sách tệp có sẵn (dùng cho kéo-thả tự xử lý). */\n  start: (files: FileList | File[]) => void;\n  /** Huỷ lượt đang chạy. */\n  cancel: () => void;\n  inputProps: {\n    ref: React.RefObject<HTMLInputElement | null>;\n    type: \"file\";\n    accept: string;\n    multiple: boolean;\n    disabled: boolean;\n    onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;\n  };\n  dropProps: {\n    onDragOver: (event: React.DragEvent) => void;\n    onDragLeave: () => void;\n    onDrop: (event: React.DragEvent) => void;\n  };\n  /** Có tệp đang được rê TRÊN khối này. */\n  dragging: boolean;\n  busy: boolean;\n  /** 0–100. */\n  percent: number;\n}\n\nexport function useFileUpload<T = unknown>(options: UseFileUploadOptions<T>): UseFileUploadResult {\n  const {\n    endpoint,\n    fieldName = \"file\",\n    maxFileSize,\n    allowedFileTypes,\n    maxNumberOfFiles = 1,\n    onUploaded,\n    onError,\n    disabled = false\n  } = options;\n  const labels = { ...DEFAULT_FILE_UPLOAD_LABELS, ...options.labels };\n\n  const inputRef = useRef<HTMLInputElement>(null);\n  const [busy, setBusy] = useState(false);\n  const [percent, setPercent] = useState(0);\n  const [dragging, setDragging] = useState(false);\n\n  /*\n   * `onUploaded`/`onError` đi qua ref: chỗ gọi thường truyền hàm mới ở mỗi lần render, và để chúng\n   * trong mảng phụ thuộc là dựng lại Uppy sau mỗi phím gõ vào biểu mẫu bên cạnh.\n   */\n  const handlers = useRef({ onUploaded, onError });\n  handlers.current = { onUploaded, onError };\n\n  const uppyRef = useRef<UppyLike | null>(null);\n  useEffect(() => {\n    return () => {\n      uppyRef.current?.destroy();\n      uppyRef.current = null;\n    };\n  }, []);\n\n  const start = useCallback(\n    async (files: FileList | File[]) => {\n      const list = Array.from(files).slice(0, maxNumberOfFiles);\n      if (list.length === 0) return;\n\n      setBusy(true);\n      setPercent(0);\n      try {\n        const mod = await loadUppy();\n        if (!mod) {\n          handlers.current.onError?.({ message: labels.missingDependency });\n          return;\n        }\n\n        /*\n         * Dựng MỘT Uppy cho MỘT lượt tải rồi huỷ. Giữ lại một instance dài hạn nghe hấp dẫn hơn,\n         * nhưng Uppy nhớ cả những tệp đã hỏng ở lượt trước — chọn lại đúng tệp đó sẽ bị chặn vì\n         * \"trùng\", và triệu chứng là một nút bấm không làm gì.\n         */\n        uppyRef.current?.destroy();\n        const uppy = new mod.Uppy({\n          autoProceed: false,\n          restrictions: { maxNumberOfFiles, maxFileSize, allowedFileTypes }\n        });\n        uppyRef.current = uppy;\n\n        /*\n         * Chỗ giữ lỗi của lượt gọi gần nhất. `upload-error` của Uppy KHÔNG mang thân phản hồi —\n         * thứ nó ném là `new NetworkError(xhr.statusText, xhr)`, mà trên HTTP/2 `statusText` là\n         * chuỗi RỖNG. Nên `code` phải được nhặt ở `onAfterResponse`, nơi còn nhìn thấy `xhr`.\n         */\n        const lastError: { code?: string; status?: number; message?: string } = {};\n\n        uppy.use(mod.XHRUpload, {\n          endpoint,\n          fieldName,\n          method: \"POST\",\n          // Cookie phiên là cách Comitor xác thực mọi route tự viết — thiếu dòng này là 401.\n          withCredentials: true,\n\n          /*\n           * ⚠ CHỈ THỬ LẠI LỖI 5xx.\n           *\n           * Mặc định của Uppy là `shouldRetry = () => true` với `retries = 3` (đọc\n           * `@uppy/core/lib/utils/fetcher.js`), tức MỌI phản hồi không-2xx bị gửi lại ba lần. Hậu\n           * quả đo được bằng chính hợp đồng của Comitor:\n           *   · một ảnh sai định dạng 2 MB → BỐN lượt POST 2 MB, tất cả đều biết chắc sẽ hỏng;\n           *   · một **429** của `lib/api/rate-limit.ts` cũng bị thử lại, mỗi lần tiêu thêm một đơn\n           *     vị hạn mức và bỏ qua `Retry-After` — client tự đào sâu cái hố nó vừa rơi vào.\n           * 4xx là \"yêu cầu sai, gửi lại cũng thế\"; chỉ 5xx mới đáng thử lại.\n           */\n          shouldRetry: (xhr: XMLHttpRequest) => xhr.status >= 500,\n\n          /*\n           * ⚠ `getResponseError` KHÔNG TỒN TẠI — nó chỉ còn trong một dòng comment cũ ở\n           * `@uppy/xhr-upload/lib/index.js`, không có trong `XhrUploadOpts`, và không được đọc ở\n           * đâu cả. Truyền nó vào là viết một callback không bao giờ chạy. Đường thật là\n           * `onAfterResponse`, thứ XHRUpload có forward xuống fetcher.\n           */\n          onAfterResponse: (xhr: XMLHttpRequest) => {\n            if (xhr.status >= 200 && xhr.status < 300) return;\n            lastError.status = xhr.status;\n            try {\n              const parsed = JSON.parse(xhr.responseText) as { error?: { code?: string; message?: string } };\n              lastError.code = parsed.error?.code;\n              lastError.message = parsed.error?.message;\n            } catch {\n              // Phản hồi không phải JSON (proxy trả HTML, 413 của tầng mạng…). Giữ `status` là đủ.\n            }\n          },\n\n          /*\n           * ⚠ KHÔNG gửi meta kèm tệp.\n           *\n           * Mặc định `allowedMetaFields: true` ghi MỌI meta vào cùng `FormData`, và nó ghi TRƯỚC\n           * khi append tệp. Route của Comitor đọc `form.get(\"file\")` — hàm đó trả phần tử ĐẦU TIÊN\n           * cùng tên. Nên chỉ cần một khoá meta tên `file` là route nhận về một chuỗi,\n           * `file instanceof File` thành false, và nó trả 400 \"Thiếu tệp ảnh\" trong khi tệp vẫn\n           * nằm nguyên trong request. Mảng rỗng đóng hẳn đường đó.\n           */\n          allowedMetaFields: []\n        });\n\n        uppy.on(\"progress\", ((value: number) => setPercent(value)) as never);\n        uppy.on(\"upload-success\", ((file: { name?: string } | undefined, response: { body?: T }) => {\n          handlers.current.onUploaded({ body: response?.body as T, fileName: file?.name ?? \"\" });\n        }) as never);\n        uppy.on(\"upload-error\", ((_file: unknown, error: Error) => {\n          // `lastError` là nguồn duy nhất có `code` — xem `onAfterResponse` ở trên.\n          handlers.current.onError?.({\n            code: lastError.code,\n            status: lastError.status,\n            message: lastError.message ?? error?.message ?? labels.uploadFailed\n          });\n        }) as never);\n        /*\n         * `restriction-failed` là đường RIÊNG, không đi qua `upload-error`. Bỏ sót nó thì một tệp\n         * quá lớn hay sai định dạng bị Uppy chặn trong im lặng — người dùng bấm rồi không thấy gì.\n         */\n        uppy.on(\"restriction-failed\", ((_file: unknown, error: Error) => {\n          handlers.current.onError?.({ message: error?.message ?? labels.uploadFailed });\n        }) as never);\n\n        /*\n         * ⚠ `addFile` BÁO LỖI HẠN CHẾ HAI LẦN, và lần thứ hai là một cú ném.\n         *\n         * Đọc `@uppy/core@6.0.0` (`Uppy.js:614-619`): nó `#informAndEmit(restrictionErrors)` —\n         * tức bắn `restriction-failed` mà ta đã bắt ở trên — RỒI `throw errors[0]`. Vì `start`\n         * được gọi bằng `void start(...)` ở `inputProps.onChange` và `dropProps.onDrop`, cú ném\n         * ấy thành **unhandled promise rejection**: chọn nhầm định dạng tệp — một thao tác hoàn\n         * toàn bình thường — in một lỗi đỏ ra console mỗi lần.\n         *\n         * Đó không phải chuyện thẩm mỹ. Một kênh cảnh báo lúc nào cũng kêu là kênh sẽ bị bỏ qua,\n         * kể cả hôm nó kêu vì một lỗi thật. Nuốt ĐÚNG lỗi hạn chế (`isRestriction`) vì nó đã được\n         * báo qua đường sự kiện; mọi lỗi khác vẫn ném tiếp để `catch` bên ngoài xử lý.\n         */\n        for (const file of list) {\n          try {\n            uppy.addFile({ name: file.name, type: file.type, data: file });\n          } catch (error) {\n            if (!(error as { isRestriction?: boolean })?.isRestriction) throw error;\n          }\n        }\n        await uppy.upload();\n      } finally {\n        setBusy(false);\n        setPercent(0);\n        /*\n         * Xoá giá trị input: chọn LẠI cùng một tệp sau một lần lỗi sẽ KHÔNG bắn `change` nếu giá\n         * trị không đổi — và triệu chứng là thử lại im lặng không làm gì.\n         */\n        if (inputRef.current) inputRef.current.value = \"\";\n      }\n    },\n    [\n      endpoint,\n      fieldName,\n      maxFileSize,\n      allowedFileTypes,\n      maxNumberOfFiles,\n      labels.missingDependency,\n      labels.uploadFailed\n    ]\n  );\n\n  const cancel = useCallback(() => {\n    uppyRef.current?.cancelAll();\n  }, []);\n\n  return {\n    open: () => inputRef.current?.click(),\n    start,\n    cancel,\n    inputProps: {\n      ref: inputRef,\n      type: \"file\",\n      accept: allowedFileTypes.join(\",\"),\n      multiple: maxNumberOfFiles > 1,\n      disabled: disabled || busy,\n      onChange: (event) => {\n        if (event.target.files) void start(event.target.files);\n      }\n    },\n    dropProps: {\n      onDragOver: (event) => {\n        // `preventDefault` là BẮT BUỘC — thiếu nó trình duyệt mở tệp thay vì bắn `onDrop`.\n        event.preventDefault();\n        if (!disabled && !busy) setDragging(true);\n      },\n      onDragLeave: () => setDragging(false),\n      onDrop: (event) => {\n        event.preventDefault();\n        setDragging(false);\n        if (!disabled && !busy && event.dataTransfer.files.length > 0) void start(event.dataTransfer.files);\n      }\n    },\n    dragging,\n    busy,\n    percent\n  };\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/uploader/use-file-upload.ts"],"sourcesContent":["\"use client\";\n\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport { useComitorMessages } from \"../i18n/locale-provider.js\";\nimport type { FileUploadLogicLabels } from \"./file-upload-constants.js\";\n\n/**\n * Phần MÁY MÓC của việc tải tệp, tách khỏi mọi quyết định về hình dạng.\n *\n * ── VÌ SAO TÁCH ───────────────────────────────────────────────────────────────────────────────\n * `FileUpload` vẽ một khung kéo-thả viền đứt nét — đúng cho tài liệu nhiều tệp, **sai** cho một ô\n * ảnh đại diện 56px. Nhưng phần bên dưới thì hai ca cần y hệt nhau: hàng đợi Uppy, tiến độ theo\n * byte, bốn cạm bẫy của `@uppy/xhr-upload`, và việc xoá `input.value` sau mỗi lượt.\n *\n * Đường cắt này không phải một trừu tượng mới bịa ra: trong `file-upload.tsx` bản 1.2.0, toàn bộ\n * khối `start` + `useEffect` dọn dẹp + ba `useState` **không chạm một dòng JSX nào**, còn JSX thì\n * chỉ đọc `busy`/`percent`/`dragging`. Đây là việc đặt tên cho một ranh giới đã có sẵn.\n *\n * ⚠ `inputProps` và `dropProps` là **prop-getter**: chỗ gọi phải rải chúng lên đúng phần tử. Thiếu\n * `<input {...inputProps} />` thì `open()` không làm gì, và triệu chứng là một nút bấm im lặng.\n * `dropProps` đã tự gọi `preventDefault` — lỗi kinh điển khi để app tự viết.\n */\n/**\n * Bề mặt Uppy mà component này dùng — khai TAY, không import kiểu thật.\n *\n * Hai lý do, cả hai đều thực dụng: kiểu thật của `Uppy` mang generic `<Meta, Body>` và đổi hình\n * dạng giữa các bản major; và `@uppy/core` là peer TUỲ CHỌN, nên `import type` từ nó sẽ làm\n * `tsc` của một app KHÔNG cài Uppy báo đỏ ở một file họ không hề dùng.\n *\n * Cái giá: nếu Uppy đổi tên một phương thức thì lỗi lộ ra lúc CHẠY, không lúc biên dịch. Bù lại\n * bằng `scripts/smoke-entries.mjs` — nó nạp thật entry này ở mỗi lần publish.\n */\ninterface UppyLike {\n  addFile: (file: { name: string; type: string; data: File }) => void;\n  upload: () => Promise<unknown>;\n  cancelAll: () => void;\n  destroy: () => void;\n  on: (event: string, handler: (...args: never[]) => void) => void;\n  use: (plugin: unknown, options?: unknown) => unknown;\n}\n\n/**\n * Nạp Uppy LƯỜI — chỉ khi người dùng thật sự chọn tệp.\n *\n * `import()` động giữ Uppy ra khỏi bundle của lượt tải trang đầu tiên. Với một màn hồ sơ mà đa số\n * người mở ra chỉ để xem, đó là toàn bộ chi phí của Uppy bị hoãn tới lúc nó thật sự có việc.\n *\n * ⚠ Hai gói này là **peer TUỲ CHỌN**. App không cài mà lại render component này thì `import()` sẽ\n * hỏng — nên lỗi được bắt và trả về qua `onError` với thông điệp nói đúng tên gói phải cài, thay vì\n * một `ChunkLoadError` không gợi gì.\n */\nasync function loadUppy(): Promise<{ Uppy: new (o: unknown) => UppyLike; XHRUpload: unknown } | null> {\n  try {\n    const [core, xhr] = await Promise.all([import(\"@uppy/core\"), import(\"@uppy/xhr-upload\")]);\n    return {\n      // `as unknown as` là bắt buộc: kiểu thật của Uppy có generic `<Meta, Body>` mà `UppyLike`\n      // cố ý không mang. Xem ghi chú ở `UppyLike` về việc vì sao gói này không dùng kiểu thật.\n      Uppy: (core.default ?? (core as unknown as { Uppy: unknown }).Uppy) as unknown as new (o: unknown) => UppyLike,\n      XHRUpload: xhr.default ?? xhr\n    };\n  } catch {\n    return null;\n  }\n}\n\nexport interface UseFileUploadOptions<T = unknown> {\n  /** Đường dẫn endpoint nhận multipart, ví dụ `/api/account/avatar`. */\n  endpoint: string;\n  /** Tên trường trong `FormData`. Mặc định `\"file\"`. */\n  fieldName?: string;\n  maxFileSize: number;\n  allowedFileTypes: string[];\n  maxNumberOfFiles?: number;\n  onUploaded: (result: FileUploadResult<T>) => void;\n  onError?: (error: { code?: string; status?: number; message: string }) => void;\n  /**\n   * CHỈ hai chuỗi mà phần máy móc thật sự dùng.\n   *\n   * Cố ý KHÔNG nhận cả `FileUploadLabels`: ba chuỗi còn lại (`dropHint`/`choose`/`uploading`) là\n   * của bố cục, và để chúng lọt vào đây là mời người viết truyền một prop không bao giờ chạy.\n   *\n   * Khoá nào không truyền thì lấy từ namespace `fileUpload` của `ComitorLocaleProvider` (không có\n   * provider → tiếng Anh). `FileUpload`/`ImageUploadField` luôn truyền đủ hai khoá, đã theo bảng\n   * của CHÍNH chúng.\n   */\n  labels?: Partial<FileUploadLogicLabels>;\n  disabled?: boolean;\n}\n\n/** Kết quả một tệp tải xong: thân phản hồi JSON của endpoint app. */\nexport interface FileUploadResult<T = unknown> {\n  body: T;\n  fileName: string;\n}\n\nexport interface UseFileUploadResult {\n  /** Mở hộp chọn tệp. Cần `<input {...inputProps} />` có mặt trong cây. */\n  open: () => void;\n  /** Bắt đầu tải một danh sách tệp có sẵn (dùng cho kéo-thả tự xử lý). */\n  start: (files: FileList | File[]) => void;\n  /** Huỷ lượt đang chạy. */\n  cancel: () => void;\n  inputProps: {\n    ref: React.RefObject<HTMLInputElement | null>;\n    type: \"file\";\n    accept: string;\n    multiple: boolean;\n    disabled: boolean;\n    onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;\n  };\n  dropProps: {\n    onDragOver: (event: React.DragEvent) => void;\n    onDragLeave: () => void;\n    onDrop: (event: React.DragEvent) => void;\n  };\n  /** Có tệp đang được rê TRÊN khối này. */\n  dragging: boolean;\n  busy: boolean;\n  /** 0–100. */\n  percent: number;\n}\n\nexport function useFileUpload<T = unknown>(options: UseFileUploadOptions<T>): UseFileUploadResult {\n  const {\n    endpoint,\n    fieldName = \"file\",\n    maxFileSize,\n    allowedFileTypes,\n    maxNumberOfFiles = 1,\n    onUploaded,\n    onError,\n    disabled = false\n  } = options;\n  const messages = useComitorMessages(\"fileUpload\");\n  const labels: FileUploadLogicLabels = {\n    uploadFailed: options.labels?.uploadFailed ?? messages.uploadFailed,\n    missingDependency: options.labels?.missingDependency ?? messages.missingDependency\n  };\n\n  const inputRef = useRef<HTMLInputElement>(null);\n  const [busy, setBusy] = useState(false);\n  const [percent, setPercent] = useState(0);\n  const [dragging, setDragging] = useState(false);\n\n  /*\n   * `onUploaded`/`onError` đi qua ref: chỗ gọi thường truyền hàm mới ở mỗi lần render, và để chúng\n   * trong mảng phụ thuộc là dựng lại Uppy sau mỗi phím gõ vào biểu mẫu bên cạnh.\n   */\n  const handlers = useRef({ onUploaded, onError });\n  handlers.current = { onUploaded, onError };\n\n  const uppyRef = useRef<UppyLike | null>(null);\n  useEffect(() => {\n    return () => {\n      uppyRef.current?.destroy();\n      uppyRef.current = null;\n    };\n  }, []);\n\n  const start = useCallback(\n    async (files: FileList | File[]) => {\n      const list = Array.from(files).slice(0, maxNumberOfFiles);\n      if (list.length === 0) return;\n\n      setBusy(true);\n      setPercent(0);\n      try {\n        const mod = await loadUppy();\n        if (!mod) {\n          handlers.current.onError?.({ message: labels.missingDependency });\n          return;\n        }\n\n        /*\n         * Dựng MỘT Uppy cho MỘT lượt tải rồi huỷ. Giữ lại một instance dài hạn nghe hấp dẫn hơn,\n         * nhưng Uppy nhớ cả những tệp đã hỏng ở lượt trước — chọn lại đúng tệp đó sẽ bị chặn vì\n         * \"trùng\", và triệu chứng là một nút bấm không làm gì.\n         */\n        uppyRef.current?.destroy();\n        const uppy = new mod.Uppy({\n          autoProceed: false,\n          restrictions: { maxNumberOfFiles, maxFileSize, allowedFileTypes }\n        });\n        uppyRef.current = uppy;\n\n        /*\n         * Chỗ giữ lỗi của lượt gọi gần nhất. `upload-error` của Uppy KHÔNG mang thân phản hồi —\n         * thứ nó ném là `new NetworkError(xhr.statusText, xhr)`, mà trên HTTP/2 `statusText` là\n         * chuỗi RỖNG. Nên `code` phải được nhặt ở `onAfterResponse`, nơi còn nhìn thấy `xhr`.\n         */\n        const lastError: { code?: string; status?: number; message?: string } = {};\n\n        uppy.use(mod.XHRUpload, {\n          endpoint,\n          fieldName,\n          method: \"POST\",\n          // Cookie phiên là cách Comitor xác thực mọi route tự viết — thiếu dòng này là 401.\n          withCredentials: true,\n\n          /*\n           * ⚠ CHỈ THỬ LẠI LỖI 5xx.\n           *\n           * Mặc định của Uppy là `shouldRetry = () => true` với `retries = 3` (đọc\n           * `@uppy/core/lib/utils/fetcher.js`), tức MỌI phản hồi không-2xx bị gửi lại ba lần. Hậu\n           * quả đo được bằng chính hợp đồng của Comitor:\n           *   · một ảnh sai định dạng 2 MB → BỐN lượt POST 2 MB, tất cả đều biết chắc sẽ hỏng;\n           *   · một **429** của `lib/api/rate-limit.ts` cũng bị thử lại, mỗi lần tiêu thêm một đơn\n           *     vị hạn mức và bỏ qua `Retry-After` — client tự đào sâu cái hố nó vừa rơi vào.\n           * 4xx là \"yêu cầu sai, gửi lại cũng thế\"; chỉ 5xx mới đáng thử lại.\n           */\n          shouldRetry: (xhr: XMLHttpRequest) => xhr.status >= 500,\n\n          /*\n           * ⚠ `getResponseError` KHÔNG TỒN TẠI — nó chỉ còn trong một dòng comment cũ ở\n           * `@uppy/xhr-upload/lib/index.js`, không có trong `XhrUploadOpts`, và không được đọc ở\n           * đâu cả. Truyền nó vào là viết một callback không bao giờ chạy. Đường thật là\n           * `onAfterResponse`, thứ XHRUpload có forward xuống fetcher.\n           */\n          onAfterResponse: (xhr: XMLHttpRequest) => {\n            if (xhr.status >= 200 && xhr.status < 300) return;\n            lastError.status = xhr.status;\n            try {\n              const parsed = JSON.parse(xhr.responseText) as { error?: { code?: string; message?: string } };\n              lastError.code = parsed.error?.code;\n              lastError.message = parsed.error?.message;\n            } catch {\n              // Phản hồi không phải JSON (proxy trả HTML, 413 của tầng mạng…). Giữ `status` là đủ.\n            }\n          },\n\n          /*\n           * ⚠ KHÔNG gửi meta kèm tệp.\n           *\n           * Mặc định `allowedMetaFields: true` ghi MỌI meta vào cùng `FormData`, và nó ghi TRƯỚC\n           * khi append tệp. Route của Comitor đọc `form.get(\"file\")` — hàm đó trả phần tử ĐẦU TIÊN\n           * cùng tên. Nên chỉ cần một khoá meta tên `file` là route nhận về một chuỗi,\n           * `file instanceof File` thành false, và nó trả 400 \"Thiếu tệp ảnh\" trong khi tệp vẫn\n           * nằm nguyên trong request. Mảng rỗng đóng hẳn đường đó.\n           */\n          allowedMetaFields: []\n        });\n\n        uppy.on(\"progress\", ((value: number) => setPercent(value)) as never);\n        uppy.on(\"upload-success\", ((file: { name?: string } | undefined, response: { body?: T }) => {\n          handlers.current.onUploaded({ body: response?.body as T, fileName: file?.name ?? \"\" });\n        }) as never);\n        uppy.on(\"upload-error\", ((_file: unknown, error: Error) => {\n          // `lastError` là nguồn duy nhất có `code` — xem `onAfterResponse` ở trên.\n          handlers.current.onError?.({\n            code: lastError.code,\n            status: lastError.status,\n            message: lastError.message ?? error?.message ?? labels.uploadFailed\n          });\n        }) as never);\n        /*\n         * `restriction-failed` là đường RIÊNG, không đi qua `upload-error`. Bỏ sót nó thì một tệp\n         * quá lớn hay sai định dạng bị Uppy chặn trong im lặng — người dùng bấm rồi không thấy gì.\n         */\n        uppy.on(\"restriction-failed\", ((_file: unknown, error: Error) => {\n          handlers.current.onError?.({ message: error?.message ?? labels.uploadFailed });\n        }) as never);\n\n        /*\n         * ⚠ `addFile` BÁO LỖI HẠN CHẾ HAI LẦN, và lần thứ hai là một cú ném.\n         *\n         * Đọc `@uppy/core@6.0.0` (`Uppy.js:614-619`): nó `#informAndEmit(restrictionErrors)` —\n         * tức bắn `restriction-failed` mà ta đã bắt ở trên — RỒI `throw errors[0]`. Vì `start`\n         * được gọi bằng `void start(...)` ở `inputProps.onChange` và `dropProps.onDrop`, cú ném\n         * ấy thành **unhandled promise rejection**: chọn nhầm định dạng tệp — một thao tác hoàn\n         * toàn bình thường — in một lỗi đỏ ra console mỗi lần.\n         *\n         * Đó không phải chuyện thẩm mỹ. Một kênh cảnh báo lúc nào cũng kêu là kênh sẽ bị bỏ qua,\n         * kể cả hôm nó kêu vì một lỗi thật. Nuốt ĐÚNG lỗi hạn chế (`isRestriction`) vì nó đã được\n         * báo qua đường sự kiện; mọi lỗi khác vẫn ném tiếp để `catch` bên ngoài xử lý.\n         */\n        for (const file of list) {\n          try {\n            uppy.addFile({ name: file.name, type: file.type, data: file });\n          } catch (error) {\n            if (!(error as { isRestriction?: boolean })?.isRestriction) throw error;\n          }\n        }\n        await uppy.upload();\n      } finally {\n        setBusy(false);\n        setPercent(0);\n        /*\n         * Xoá giá trị input: chọn LẠI cùng một tệp sau một lần lỗi sẽ KHÔNG bắn `change` nếu giá\n         * trị không đổi — và triệu chứng là thử lại im lặng không làm gì.\n         */\n        if (inputRef.current) inputRef.current.value = \"\";\n      }\n    },\n    [\n      endpoint,\n      fieldName,\n      maxFileSize,\n      allowedFileTypes,\n      maxNumberOfFiles,\n      labels.missingDependency,\n      labels.uploadFailed\n    ]\n  );\n\n  const cancel = useCallback(() => {\n    uppyRef.current?.cancelAll();\n  }, []);\n\n  return {\n    open: () => inputRef.current?.click(),\n    start,\n    cancel,\n    inputProps: {\n      ref: inputRef,\n      type: \"file\",\n      accept: allowedFileTypes.join(\",\"),\n      multiple: maxNumberOfFiles > 1,\n      disabled: disabled || busy,\n      onChange: (event) => {\n        if (event.target.files) void start(event.target.files);\n      }\n    },\n    dropProps: {\n      onDragOver: (event) => {\n        // `preventDefault` là BẮT BUỘC — thiếu nó trình duyệt mở tệp thay vì bắn `onDrop`.\n        event.preventDefault();\n        if (!disabled && !busy) setDragging(true);\n      },\n      onDragLeave: () => setDragging(false),\n      onDrop: (event) => {\n        event.preventDefault();\n        setDragging(false);\n        if (!disabled && !busy && event.dataTransfer.files.length > 0) void start(event.dataTransfer.files);\n      }\n    },\n    dragging,\n    busy,\n    percent\n  };\n}\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@comitor/ui",
-  "version": "2.0.0",
+  "version": "3.0.0",
   "description": "Comitor design system — Shadcn/UI tùy biến theo brand Comitor + component dùng chung cho hệ sinh thái SaaS (Tasks, Chat, CRM, HR…)",
   "license": "MIT",
   "type": "module",
@@ -74,8 +74,9 @@
     "verify:directives": "node scripts/verify-directives.mjs",
     "smoke:entries": "node scripts/smoke-entries.mjs",
     "check:exports": "publint --strict && attw --pack . --profile esm-only --exclude-entrypoints styles.css",
-    "prepublishOnly": "pnpm run typecheck && pnpm run build && pnpm run verify:directives && pnpm run smoke:entries && pnpm run check:exports && pnpm run test:nav-active && pnpm run test:grid-contract && pnpm run test:grid-render && pnpm run test:a11y-gate && pnpm run lint:a11y",
-    "test:grid-contract": "node scripts/check-grid-contract.mjs"
+    "prepublishOnly": "pnpm run typecheck && pnpm run test:i18n && pnpm run build && pnpm run verify:directives && pnpm run smoke:entries && pnpm run check:exports && pnpm run test:nav-active && pnpm run test:grid-contract && pnpm run test:grid-render && pnpm run test:a11y-gate && pnpm run lint:a11y",
+    "test:grid-contract": "node scripts/check-grid-contract.mjs",
+    "test:i18n": "node scripts/check-i18n.mjs --self-test && node scripts/check-i18n.mjs"
   },
   "peerDependencies": {
     "@tanstack/react-table": ">=8.21.0 <9",
@@ -114,10 +115,14 @@
     }
   },
   "dependencies": {
+    "@diceui/mention": "^1.0.0",
+    "@diceui/tags-input": "^1.0.0",
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/modifiers": "^9.0.0",
     "@dnd-kit/sortable": "^10.0.0",
     "@dnd-kit/utilities": "^3.2.2",
+    "@floating-ui/react": "^0.27.20",
+    "@floating-ui/react-dom": "^2.1.9",
     "@radix-ui/react-accordion": "1.2.12",
     "@radix-ui/react-alert-dialog": "1.1.15",
     "@radix-ui/react-aspect-ratio": "1.1.8",

package/styles.css

@@ -1015,3 +1015,22 @@
   -webkit-mask-image: repeating-linear-gradient(135deg, #000 0 6px, transparent 6px 9px);
   mask-image: repeating-linear-gradient(135deg, #000 0 6px, transparent 6px 9px);
 }
+
+/* ─ VÒNG QUAY của `CircularProgress` ở trạng thái KHÔNG XÁC ĐỊNH (`value={null}`) ─
+   Port từ Dice UI cùng component. Cung 25% quay trọn một vòng mỗi 0,8s, bắt đầu từ 12 giờ
+   (-90deg) để khớp điểm xuất phát của cung ở trạng thái có giá trị. Component chỉ gắn hiệu ứng
+   dưới `motion-safe:`, nên người dùng bật `prefers-reduced-motion` thấy một cung đứng yên.
+   ⚠ Thiếu khối này thì vòng không xác định ĐỨNG YÊN mà không có lỗi nào — nó trông y như
+   "đang ở 25%", tức một con số sai chứ không phải một hiệu ứng hỏng. */
+@theme {
+  --animate-spin-around: spin-around 0.8s linear infinite;
+
+  @keyframes spin-around {
+    0% {
+      transform: rotate(-90deg);
+    }
+    100% {
+      transform: rotate(270deg);
+    }
+  }
+}

package/dist/data-grid/compose-refs.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/data-grid/compose-refs.ts"],"sourcesContent":["/**\n * @see https://github.com/radix-ui/primitives/blob/main/packages/react/compose-refs/src/compose-refs.tsx\n */\n\nimport * as React from \"react\";\n\ntype PossibleRef<T> = React.Ref<T> | undefined;\n\n/**\n * Set a given ref to a given value\n * This utility takes care of different types of refs: callback refs and RefObject(s)\n */\nfunction setRef<T>(ref: PossibleRef<T>, value: T) {\n  if (typeof ref === \"function\") {\n    return ref(value);\n  }\n\n  if (ref !== null && ref !== undefined) {\n    ref.current = value;\n  }\n}\n\n/**\n * A utility to compose multiple refs together\n * Accepts callback refs and RefObject(s)\n */\nfunction composeRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {\n  return (node) => {\n    let hasCleanup = false;\n    const cleanups = refs.map((ref) => {\n      const cleanup = setRef(ref, node);\n      if (!hasCleanup && typeof cleanup === \"function\") {\n        hasCleanup = true;\n      }\n      return cleanup;\n    });\n\n    // React <19 will log an error to the console if a callback ref returns a\n    // value. We don't use ref cleanups internally so this will only happen if a\n    // user's ref callback returns a value, which we only expect if they are\n    // using the cleanup functionality added in React 19.\n    if (hasCleanup) {\n      return () => {\n        for (let i = 0; i < cleanups.length; i++) {\n          const cleanup = cleanups[i];\n          if (typeof cleanup === \"function\") {\n            cleanup();\n          } else {\n            setRef(refs[i], null);\n          }\n        }\n      };\n    }\n  };\n}\n\n/**\n * A custom hook that composes multiple refs\n * Accepts callback refs and RefObject(s)\n */\nfunction useComposedRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {\n  // biome-ignore lint/correctness/useExhaustiveDependencies: we don't want to re-run this callback when the refs change\n  return React.useCallback(composeRefs(...refs), refs);\n}\n\nexport { composeRefs, useComposedRefs };\n"],"mappings":"AAIA,YAAY,WAAW;AAQvB,SAAS,OAAU,KAAqB,OAAU;AAChD,MAAI,OAAO,QAAQ,YAAY;AAC7B,WAAO,IAAI,KAAK;AAAA,EAClB;AAEA,MAAI,QAAQ,QAAQ,QAAQ,QAAW;AACrC,QAAI,UAAU;AAAA,EAChB;AACF;AAMA,SAAS,eAAkB,MAA8C;AACvE,SAAO,CAAC,SAAS;AACf,QAAI,aAAa;AACjB,UAAM,WAAW,KAAK,IAAI,CAAC,QAAQ;AACjC,YAAM,UAAU,OAAO,KAAK,IAAI;AAChC,UAAI,CAAC,cAAc,OAAO,YAAY,YAAY;AAChD,qBAAa;AAAA,MACf;AACA,aAAO;AAAA,IACT,CAAC;AAMD,QAAI,YAAY;AACd,aAAO,MAAM;AACX,iBAAS,IAAI,GAAG,IAAI,SAAS,QAAQ,KAAK;AACxC,gBAAM,UAAU,SAAS,CAAC;AAC1B,cAAI,OAAO,YAAY,YAAY;AACjC,oBAAQ;AAAA,UACV,OAAO;AACL,mBAAO,KAAK,CAAC,GAAG,IAAI;AAAA,UACtB;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;AAMA,SAAS,mBAAsB,MAA8C;AAE3E,SAAO,MAAM,YAAY,YAAY,GAAG,IAAI,GAAG,IAAI;AACrD;","names":[]}

package/dist/data-grid/use-as-ref.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/data-grid/use-as-ref.ts"],"sourcesContent":["import * as React from \"react\";\n\nimport { useIsomorphicLayoutEffect } from \"./use-isomorphic-layout-effect.js\";\n\nfunction useAsRef<T>(props: T) {\n  const ref = React.useRef<T>(props);\n\n  useIsomorphicLayoutEffect(() => {\n    ref.current = props;\n  });\n\n  return ref;\n}\n\nexport { useAsRef };\n"],"mappings":"AAAA,YAAY,WAAW;AAEvB,SAAS,iCAAiC;AAE1C,SAAS,SAAY,OAAU;AAC7B,QAAM,MAAM,MAAM,OAAU,KAAK;AAEjC,4BAA0B,MAAM;AAC9B,QAAI,UAAU;AAAA,EAChB,CAAC;AAED,SAAO;AACT;","names":[]}

package/dist/data-grid/use-isomorphic-layout-effect.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/data-grid/use-isomorphic-layout-effect.ts"],"sourcesContent":["import * as React from \"react\";\n\nconst useIsomorphicLayoutEffect = typeof window !== \"undefined\" ? React.useLayoutEffect : React.useEffect;\n\nexport { useIsomorphicLayoutEffect };\n"],"mappings":"AAAA,YAAY,WAAW;AAEvB,MAAM,4BAA4B,OAAO,WAAW,cAAc,MAAM,kBAAkB,MAAM;","names":[]}

package/dist/data-grid/use-lazy-ref.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/data-grid/use-lazy-ref.ts"],"sourcesContent":["import * as React from \"react\";\n\nfunction useLazyRef<T>(fn: () => T): React.RefObject<T> {\n  const ref = React.useRef<T | null>(null);\n  if (ref.current === null) {\n    ref.current = fn();\n  }\n  return ref as React.RefObject<T>;\n}\n\nexport { useLazyRef };\n"],"mappings":"AAAA,YAAY,WAAW;AAEvB,SAAS,WAAc,IAAiC;AACtD,QAAM,MAAM,MAAM,OAAiB,IAAI;AACvC,MAAI,IAAI,YAAY,MAAM;AACxB,QAAI,UAAU,GAAG;AAAA,EACnB;AACA,SAAO;AACT;","names":[]}