[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-1297":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":14,"contributorsCount":15,"subscribersCount":15,"size":15,"stars1d":16,"stars7d":17,"stars30d":18,"stars90d":15,"forks30d":15,"starsTrendScore":19,"compositeScore":20,"rankGlobal":10,"rankLanguage":10,"license":21,"archived":22,"fork":22,"defaultBranch":23,"hasWiki":22,"hasPages":22,"topics":24,"createdAt":10,"pushedAt":10,"updatedAt":25,"readmeContent":26,"aiSummary":27,"trendingCount":15,"starSnapshotCount":15,"syncStatus":14,"lastSyncTime":28,"discoverSource":29},1297,"mesurer","ibelick\u002Fmesurer","ibelick","Measure and align everything.","https:\u002F\u002Fmesurer.dev",null,"TypeScript",275,13,2,0,3,5,14,9,53.34,"Other",false,"main",[],"2026-06-12 04:00:08","\u003Cpicture>\n  \u003Csource media=\"(prefers-color-scheme: dark)\" srcset=\"https:\u002F\u002Fmesurer.dev\u002Flogo-dark.svg\">\n  \u003Cimg src=\"https:\u002F\u002Fmesurer.dev\u002Flogo.svg\" alt=\"Mesurer\" width=\"200\">\n\u003C\u002Fpicture>\n\n\u003Cbr>\n\n[![npm version](https:\u002F\u002Fimg.shields.io\u002Fnpm\u002Fv\u002Fmesurer)](https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Fmesurer)\n[![downloads](https:\u002F\u002Fimg.shields.io\u002Fnpm\u002Fdm\u002Fmesurer)](https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Fmesurer)\n\n**[Mesurer](https:\u002F\u002Fmesurer.dev)** is a lightweight measurement and alignment overlay for React apps. Toggle it on, select elements, and measure distances directly in the browser.\n\n[Full documentation](https:\u002F\u002Fmesurer.dev\u002F)\n\n## Install\n\n```bash\nnpm install mesurer\n```\n\n## Usage\n\n```tsx\nimport { Measurer } from \"mesurer\";\n\nfunction App() {\n  return (\n    \u003C>\n      \u003CYourApp \u002F>\n      \u003CMeasurer \u002F>\n    \u003C\u002F>\n  );\n}\n```\n\n## Props\n\n| Prop                    | Description                                                                   |\n| ----------------------- | ----------------------------------------------------------------------------- |\n| `highlightColor`        | Base color for selection\u002Fhover overlays (defaults to `oklch(0.62 0.18 255)`). |\n| `guideColor`            | Base color for guides (defaults to `oklch(0.63 0.26 29.23)`).                 |\n| `hoverHighlightEnabled` | Disables hover highlight and deselects on click when `false`.                 |\n| `persistOnReload`       | Persists state in `localStorage` as `mesurer-state` when `true`.              |\n| `portalTarget`          | Optional element or shadow root used as the overlay portal mount target.      |\n\n## Commands\n\n| Shortcut               | Action                                                |\n| ---------------------- | ----------------------------------------------------- |\n| `M`                    | Toggle measurer on\u002Foff.                               |\n| `S`                    | Toggle Select mode.                                   |\n| `G`                    | Toggle Guides mode.                                   |\n| `H`                    | Set guide orientation to horizontal.                  |\n| `V`                    | Set guide orientation to vertical.                    |\n| `Alt`                  | Temporarily enable option\u002Fguide measurement overlays. |\n| `Esc`                  | Clear all measurements and guides.                    |\n| `Backspace` \u002F `Delete` | Remove selected guides.                               |\n| `Cmd\u002FCtrl + Z`         | Undo.                                                 |\n| `Cmd\u002FCtrl + Shift + Z` | Redo.                                                 |\n\n## Features\n\n- **Toggle on\u002Foff** – Enable the overlay with a single shortcut\n- **Select mode** – Click elements to measure their bounds\n- **Guides mode** – Add vertical or horizontal guides\n- **Distance overlays** – Hold Alt for quick spacing checks\n- **Undo\u002Fredo** – Command history for guide and measurement changes\n- **Persist state** – Keep guides and measurements on reload\n\n## Requirements\n\n- React 18+\n\n## License\n\nLicensed under the MIT License.\n","Mesurer 是一个为React应用设计的轻量级测量和对齐覆盖工具。其核心功能包括通过快捷键快速启用\u002F禁用测量模式、选择元素以测量边界、添加水平或垂直参考线以及实时查看间距等，支持撤销\u002F重做操作，并且可以将状态持久化到本地存储中。该工具特别适合需要精确控制UI布局和间距的前端开发场景，如网页设计、组件库开发等。采用TypeScript编写，确保了代码质量和类型安全。","2026-06-11 02:42:53","CREATED_QUERY"]