@hamster-note/reader 0.2.0-beta.1

package/dist/style.css

@@ -0,0 +1,323 @@
+@charset "UTF-8";
+/* dev 模式下 Vite 会通过 package export inline selection CSS；
+   lib build 时 scripts/build-styles.mjs 会解析同一个 export，移除此 @import 并追加真实 CSS，
+   保证发布的 @hamster-note/reader/style.css 是自包含的。 */
+
+.hamster-reader {
+  display: block;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
+}
+.hamster-reader__upload-zone {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 48px 24px;
+  border: 2px dashed #d1d5db;
+  border-radius: 12px;
+  background-color: #f9fafb;
+  cursor: pointer;
+  transition: all 0.2s ease;
+  width: 100%;
+  min-height: 200px;
+  box-sizing: border-box;
+}
+.hamster-reader__upload-zone:hover {
+  border-color: #9ca3af;
+  background-color: #f3f4f6;
+}
+.hamster-reader__upload-zone:focus {
+  outline: none;
+  border-color: #3b82f6;
+  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
+}
+.hamster-reader__upload-zone--dragging {
+  border-color: #3b82f6;
+  background-color: #eff6ff;
+  border-style: solid;
+}
+.hamster-reader__file-input {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+.hamster-reader__upload-content {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 12px;
+}
+.hamster-reader__upload-icon {
+  width: 48px;
+  height: 48px;
+  color: #6b7280;
+}
+.hamster-reader__upload-text {
+  margin: 0;
+  font-size: 16px;
+  font-weight: 500;
+  color: #374151;
+}
+.hamster-reader__upload-hint {
+  margin: 0;
+  font-size: 14px;
+  color: #9ca3af;
+}
+.hamster-reader__content {
+  font-size: 16px;
+  color: #374151;
+  height: 100%;
+  box-sizing: border-box;
+}
+.hamster-reader__file-info {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  padding: 16px;
+  border: 1px solid #e5e7eb;
+  border-radius: 8px;
+  background-color: #ffffff;
+}
+.hamster-reader__file-icon {
+  width: 40px;
+  height: 40px;
+  color: #3b82f6;
+  flex-shrink: 0;
+}
+.hamster-reader__file-details {
+  flex: 1;
+  min-width: 0;
+}
+.hamster-reader__file-name {
+  margin: 0;
+  font-size: 14px;
+  font-weight: 500;
+  color: #111827;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.hamster-reader__file-meta {
+  margin: 4px 0 0;
+  font-size: 12px;
+  color: #6b7280;
+}
+.hamster-reader__upload-another {
+  padding: 8px 16px;
+  font-size: 14px;
+  font-weight: 500;
+  color: #3b82f6;
+  background-color: #eff6ff;
+  border: 1px solid #dbeafe;
+  border-radius: 6px;
+  cursor: pointer;
+  transition: all 0.2s ease;
+  white-space: nowrap;
+}
+.hamster-reader__upload-another:hover {
+  background-color: #dbeafe;
+  border-color: #bfdbfe;
+}
+.hamster-reader__upload-another:focus {
+  outline: none;
+  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
+}
+.hamster-reader__intermediate-document-viewer {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 16px;
+  overflow: hidden;
+  box-sizing: border-box;
+  height: var(--hamster-reader-viewer-height, 100vh);
+  max-height: var(--hamster-reader-viewer-max-height, 100vh);
+  scroll-behavior: smooth;
+}
+.hamster-reader__intermediate-document-viewer .virtual-paper-wrapper {
+  flex: 1 1 auto;
+  width: 100%;
+  min-height: 0;
+  touch-action: none;
+}
+.hamster-reader__html-parser-output {
+  width: 100%;
+  box-sizing: border-box;
+}
+.hamster-reader__html-parser-output .hamster-note-document {
+  position: relative;
+  display: block;
+  contain: layout style;
+  width: 100%;
+}
+.hamster-reader__html-parser-output .hamster-note-page {
+  position: relative;
+  overflow: visible;
+  background-repeat: no-repeat;
+  background-position: top center;
+  background-size: contain;
+}
+.hamster-reader__html-parser-output .hamster-note-text {
+  position: absolute;
+  white-space: pre;
+  transform-origin: 0 0;
+}
+.hamster-reader__html-parser-output .hamster-note-image {
+  position: absolute;
+}
+.hamster-reader__html-parser-output {
+  user-select: text;
+  -webkit-user-select: text;
+}
+.hamster-reader__html-parser-output .hamster-note-page,
+.hamster-reader__html-parser-output .hamster-note-page * {
+  user-select: text;
+  -webkit-user-select: text;
+}
+.hamster-reader__intermediate-page {
+  position: relative;
+  box-sizing: border-box;
+  background-color: #ffffff;
+  outline: 1px solid #e5e7eb;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+  overflow: hidden;
+  flex-shrink: 0;
+  user-select: none;
+  -webkit-user-select: none;
+}
+.hamster-reader__intermediate-page--loading {
+  background: linear-gradient(90deg, #f3f4f6 25%, #e5e7eb 50%, #f3f4f6 75%);
+  background-size: 200% 100%;
+  animation: skeleton-shimmer 1.5s ease-in-out infinite;
+}
+.hamster-reader__intermediate-page-status {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 24px;
+  box-sizing: border-box;
+  color: #6b7280;
+  font-size: 14px;
+  text-align: center;
+}
+.hamster-reader__intermediate-page-status--error {
+  color: #b91c1c;
+  background-color: #fef2f2;
+}
+.hamster-reader__intermediate-page-base-image {
+  position: absolute;
+  inset: 0;
+  width: 100%;
+  height: 100%;
+  object-fit: fill;
+  user-select: none;
+  -webkit-user-select: none;
+  -webkit-touch-callout: none;
+  pointer-events: none;
+  z-index: 0;
+}
+.hamster-reader__intermediate-text {
+  position: absolute;
+  display: inline-block;
+  white-space: pre;
+  box-sizing: border-box;
+  user-select: text;
+  -webkit-user-select: text;
+  z-index: 1;
+}
+.hamster-reader .hsn-selection-percent-overlay {
+  mix-blend-mode: multiply;
+  opacity: 1;
+}
+.hamster-reader .hsn-selection-rect--highlight {
+  mix-blend-mode: multiply;
+}
+.hamster-reader .hsn-selection-container,
+.hamster-reader .hsn-selection-content {
+  height: 100%;
+}
+@media (pointer: coarse) {
+  .hamster-reader__intermediate-text, .hsn-selection-content .hamster-reader__intermediate-text, .hamster-reader__html-parser-output, .hamster-reader__html-parser-output .hamster-note-page, .hamster-reader__html-parser-output .hamster-note-page * {
+    user-select: none;
+    -webkit-user-select: none;
+    -webkit-touch-callout: none;
+  }
+}
+
+@keyframes skeleton-shimmer {
+  0% {
+    background-position: 200% 0;
+  }
+  100% {
+    background-position: -200% 0;
+  }
+}
+.hamster-demo-shell {
+  display: flex;
+  width: 100vw;
+  height: 100vh;
+  overflow: hidden;
+  box-sizing: border-box;
+}
+
+.hamster-demo-sidebar {
+  width: 300px;
+  background-color: #f9fafb; /* gray-50 */
+  border-right: 1px solid #e5e7eb;
+  overflow-y: auto;
+  flex-shrink: 0;
+  display: flex;
+  flex-direction: column;
+  padding: 16px;
+  box-sizing: border-box;
+}
+
+.hamster-demo-main {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
+  min-width: 0;
+}
+.hamster-demo-main .hamster-reader {
+  height: 100%;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+}
+.hamster-demo-main .hamster-reader__upload-zone {
+  flex: 1;
+  height: 100%;
+  min-height: 0;
+}
+.hamster-demo-main .hamster-reader__intermediate-document-viewer {
+  height: 100%;
+  max-height: 100%;
+}
+
+.hamster-demo-action-group {
+  display: flex;
+  flex-direction: row;
+  gap: 8px;
+  align-items: center;
+}
+.hamster-demo-action-group button:hover {
+  background-color: #f3f4f6 !important; /* overrides inline styles for hover */
+}
+.hamster-demo-action-group button:focus-visible {
+  outline: none;
+  box-shadow: 0 0 0 2px #3b82f6;
+}
+
+/* @hamster-note/selection/style.css */
+.hsn-selection-container{cursor:text;word-break:break-word;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;line-height:1.8;position:relative}.hsn-selection-content{z-index:1;-webkit-user-select:text;user-select:text;-webkit-touch-callout:none;touch-action:manipulation;position:relative}@media (pointer:coarse){.hsn-selection-content{-webkit-user-select:none;user-select:none}}.hsn-selection-content::selection{color:inherit;background:0 0}.hsn-selection-content ::selection{color:inherit;background:0 0}.hsn-selection-content::-moz-selection{color:inherit;background:0 0}.hsn-selection-content ::-moz-selection{color:inherit;background:0 0}.hsn-selection-overlay{pointer-events:none;z-index:2;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.hsn-selection-rect{pointer-events:none;transition:fill .15s}.hsn-selection-rect--highlight{fill:#ffd54f66}.hsn-selection-rect--selected{fill:#ffc1078c;stroke:#ff9800e6;stroke-width:1.5px}.hsn-selection-rect--active{fill:#ff69b473}.hsn-selection-percent-overlay{pointer-events:none;z-index:2;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.hsn-selection-percent-rect{pointer-events:none;border-radius:2px;transition:background-color .15s,border-color .15s,opacity .15s,transform .15s;position:absolute}.hsn-selection-percent-rect-highlight{background-color:#ffd54f66}.hsn-selection-percent-rect-selected{background-color:#ffc1078c;border:1.5px solid #ff9800e6}.hsn-selection-percent-rect-active{background-color:#ff69b473}.hsn-selection-popover{z-index:3;pointer-events:auto;-webkit-user-select:none;user-select:none;margin-top:-6px;position:absolute;transform:translate(-50%,-100%)}.hsn-selection-toolbar{z-index:1000;-webkit-user-select:none;user-select:none;background:#2d2d2d;border-radius:6px;align-items:center;gap:4px;padding:4px 8px;display:inline-flex;position:absolute;transform:translate(-50%);box-shadow:0 2px 8px #00000026,0 0 1px #0003}.hsn-selection-toolbar-btn{color:#fff;cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:4px;padding:2px 8px;font-size:13px}.hsn-selection-toolbar-btn:hover{background:#ffffff26}.hsn-selection-handle{z-index:4;cursor:ew-resize;pointer-events:auto;-webkit-user-select:none;user-select:none;touch-action:none;background:#ff4fa3;border:2px solid #fff;border-radius:50%;width:12px;height:12px;margin:0;padding:0;position:absolute;transform:translate(-50%,-50%);box-shadow:0 1px 4px #00000040}.hsn-selection-handle:focus{outline:none}.hsn-selection-handle--dragging{pointer-events:none}
+/*$vite$:1*/

package/dist/types/selection.d.ts

@@ -0,0 +1,42 @@
+import type { LinkedSelectionData, LinkedSelectionRange, MousePosition, OverlayRect, OverlayRectType, SelectionEndpoint } from '@hamster-note/selection';
+/**
+ * Reader 公开 linked selection 端点。
+ *
+ * `selectionId` 只使用稳定的公开页面 ID（例如 `page-2`）。Reader 后续在
+ * 运行时传给 @hamster-note/selection 的 scoped ID 是内部 adapter 细节，
+ * 不能出现在这个公开类型、回调 payload 或持久化数据里。
+ */
+export type ReaderSelectionEndpoint = SelectionEndpoint;
+/** Reader 公开 selection 矩形；linked ranges 按页面 ID 分组保存这些矩形。 */
+export type ReaderSelectionRect = OverlayRect;
+export type ReaderLinkedSelectionRange = Omit<LinkedSelectionRange, 'start' | 'end' | 'rectsBySelectionId'> & {
+    start: ReaderSelectionEndpoint;
+    end: ReaderSelectionEndpoint;
+    rectsBySelectionId: Record<string, ReaderSelectionRect[]>;
+};
+/** html-parser highlight API 的公开 range 契约：只接受 linked/page-scoped 形状。 */
+export type ReaderSelectionRange = ReaderLinkedSelectionRange & {
+    readonly __readerSelectionRangeBrand?: never;
+};
+export type ReaderLinkedSelectionData = Omit<LinkedSelectionData, 'items' | 'activeRange'> & {
+    items: ReaderLinkedSelectionRange[];
+    activeRange?: ReaderLinkedSelectionRange | null;
+};
+/**
+ * Reader 公开 selection ref 接口。
+ *
+ * 由 Reader 自己实现，不是上游 @hamster-note/selection 的 `SelectionRef`。
+ * Reader 在内部将 `highlight()` / `clear()` 分发到各页面的上游
+ * `SelectionRef`，并新增 `scrollToRange()` 来滚动到指定 range。
+ */
+export interface ReaderSelectionRef {
+    /** 执行高亮：将当前用户选中的文本确认为一个持久高亮 range。 */
+    highlight: () => void;
+    /** 清除所有页面的高亮和选区状态。 */
+    clear: () => void;
+    /** 滚动视图到指定 range（按 range id 查找）。实现细节留给 Reader 内部。 */
+    scrollToRange: (id: string) => void;
+}
+export type ReaderMousePosition = MousePosition;
+export type ReaderSelectionOverlayRectType = OverlayRectType;
+//# sourceMappingURL=selection.d.ts.map

package/dist/types/selection.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"selection.d.ts","sourceRoot":"","sources":["../../src/types/selection.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,mBAAmB,EACnB,oBAAoB,EACpB,aAAa,EACb,WAAW,EACX,eAAe,EACf,iBAAiB,EAClB,MAAM,yBAAyB,CAAA;AAEhC;;;;;;GAMG;AACH,MAAM,MAAM,uBAAuB,GAAG,iBAAiB,CAAA;AAEvD,4DAA4D;AAC5D,MAAM,MAAM,mBAAmB,GAAG,WAAW,CAAA;AAE7C,MAAM,MAAM,0BAA0B,GAAG,IAAI,CAC3C,oBAAoB,EACpB,OAAO,GAAG,KAAK,GAAG,oBAAoB,CACvC,GAAG;IACF,KAAK,EAAE,uBAAuB,CAAA;IAC9B,GAAG,EAAE,uBAAuB,CAAA;IAC5B,kBAAkB,EAAE,MAAM,CAAC,MAAM,EAAE,mBAAmB,EAAE,CAAC,CAAA;CAC1D,CAAA;AAED,wEAAwE;AACxE,MAAM,MAAM,oBAAoB,GAAG,0BAA0B,GAAG;IAC9D,QAAQ,CAAC,2BAA2B,CAAC,EAAE,KAAK,CAAA;CAC7C,CAAA;AAED,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAC1C,mBAAmB,EACnB,OAAO,GAAG,aAAa,CACxB,GAAG;IACF,KAAK,EAAE,0BAA0B,EAAE,CAAA;IACnC,WAAW,CAAC,EAAE,0BAA0B,GAAG,IAAI,CAAA;CAChD,CAAA;AAED;;;;;;GAMG;AACH,MAAM,WAAW,kBAAkB;IACjC,sCAAsC;IACtC,SAAS,EAAE,MAAM,IAAI,CAAA;IACrB,sBAAsB;IACtB,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,qDAAqD;IACrD,aAAa,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;CACpC;AACD,MAAM,MAAM,mBAAmB,GAAG,aAAa,CAAA;AAC/C,MAAM,MAAM,8BAA8B,GAAG,eAAe,CAAA"}

package/dist/vendor/clipper-lib.d.ts

@@ -0,0 +1,3 @@
+declare const ClipperLib: any;
+export default ClipperLib;
+//# sourceMappingURL=clipper-lib.d.ts.map

package/dist/vendor/clipper-lib.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"clipper-lib.d.ts","sourceRoot":"","sources":["../../src/vendor/clipper-lib.ts"],"names":[],"mappings":"AAYA,QAAA,MAAM,UAAU,KAA6C,CAAA;AAM7D,eAAe,UAAU,CAAA"}

package/package.json

@@ -0,0 +1,99 @@
+{
+  "name": "@hamster-note/reader",
+  "version": "0.2.0-beta.1",
+  "description": "",
+  "type": "module",
+  "main": "dist/index.js",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
+    },
+    "./style.css": "./dist/style.css"
+  },
+  "files": [
+    "dist"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/HamsterNote/reader.git"
+  },
+  "homepage": "https://github.com/HamsterNote/reader#readme",
+  "bugs": {
+    "url": "https://github.com/HamsterNote/reader/issues"
+  },
+  "scripts": {
+    "dev": "vite",
+    "build:lib": "yarn build:lib:js && yarn build:lib:types && yarn build:lib:styles",
+    "build:lib:js": "vite build --config vite.lib.config.ts",
+    "build:lib:types": "tsc --project tsconfig.build.json",
+    "build:lib:styles": "node scripts/build-styles.mjs",
+    "build:demo": "vite build",
+    "build:all": "yarn build:lib && yarn build:demo",
+    "build": "yarn build:all",
+    "typecheck": "tsc --project tsconfig.json --noEmit",
+    "lint": "eslint .",
+    "test": "vitest",
+    "test:run": "vitest run",
+    "preview": "vite preview",
+    "prepublishOnly": "yarn build:lib",
+    "pack:check": "node scripts/check-pack.mjs"
+  },
+  "dependencies": {
+    "@hamster-note/docx-parser": "^0.1.0",
+    "@hamster-note/html-parser": "0.9.0-beta",
+    "@hamster-note/image-parser": "^0.3.0",
+    "@hamster-note/markdown-parser": "0.1.2-beta.2",
+    "@hamster-note/pdf-parser": "^1.0.0",
+    "@hamster-note/txt-parser": "^0.3.0",
+    "@hamster-note/types": "^0.8.0",
+    "@hamster-note/virtual-paper": "0.1.0-beta.2",
+    "@system-ui-js/multi-drag": "^0.4.0"
+  },
+  "peerDependencies": {
+    "@hamster-note/selection": "0.0.2-beta.1",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.39.2",
+    "@hamster-note/selection": "0.0.2-beta.1",
+    "@system-ui-js/development-base": "^0.1.2",
+    "@testing-library/dom": "^10.0.0",
+    "@testing-library/jest-dom": "^6.0.0",
+    "@testing-library/react": "^16.0.0",
+    "@testing-library/user-event": "^14.0.0",
+    "@types/node": "^25.6.0",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "@typescript-eslint/eslint-plugin": "^8.50.0",
+    "@typescript-eslint/parser": "^8.50.0",
+    "@vitejs/plugin-react": "^5.0.0",
+    "eslint": "^9.39.2",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
+    "eslint-plugin-prettier": "^5.5.4",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "eslint-plugin-sonarjs": "^4.0.3",
+    "globals": "^15.14.0",
+    "jsdom": "^27.0.0",
+    "prettier": "^3.7.4",
+    "prettier-config-standard": "^7.0.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "sass": "^1.0.0",
+    "typescript": "^5.0.2",
+    "typescript-eslint": "^8.50.0",
+    "vite": "^7.0.0",
+    "vitest": "^3.0.0"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
+}