mesurer 0.0.10 → 0.1.0

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # mesurer
 
+## 0.1.0
+
+- add screenshot region selection with clipboard copy and local download support
+- add Chrome extension visible-tab capture integration
+- add configurable screenshot copy and download settings
+- rename the public `Measurer` component and props type to `Mesurer` and `MesurerProps`
+- improve extension isolation, persistence, settings, guides, rulers, and visual inspection workflows
+
+## 0.0.11
+
+- keep guides, select, and rulers on screen while Settings is open so styles can be edited live
+- isolate the Chrome extension overlay from host-page CSS
+- stop settings saves from clearing the live workspace
+
 ## 0.0.10
 
 - add a color picker with hex, rgb, hsl, and oklch output

package/PRIVACY.md

@@ -0,0 +1,63 @@
+# Privacy Policy
+
+## Mesurer
+
+Mesurer is a lightweight tool to measure distances, check alignment, and display visual guides directly on web pages in the browser.
+
+## Data Collection
+
+Mesurer does not collect, store, or transmit personal data.
+
+Mesurer does not collect:
+
+- personally identifiable information
+- authentication credentials
+- financial or health information
+- web history
+- user activity analytics
+- website content for external processing
+
+## Permissions
+
+### activeTab
+
+Used only when the user explicitly activates the extension, to run Mesurer on the current tab.
+
+### scripting
+
+Used to inject the extension script into the active page to render measurement overlays and guides.
+
+### storage
+
+Used to store Mesurer settings and page workspaces locally in Chrome. This data stays in the
+browser and is not sent to Mesurer servers.
+
+### clipboardWrite
+
+Used when the user chooses to copy a selected screenshot or sampled color to the clipboard.
+
+## Screenshot Capture
+
+Screenshot captures are initiated by the user and contain only the selected region of the
+currently visible tab. In the Chrome extension, capture is performed locally through Chrome's
+visible-tab capture API. In a React integration without the extension, Chrome may show its native
+tab-sharing prompt through `getDisplayMedia()`.
+
+Screenshots are copied to the local clipboard or downloaded locally according to the user's
+settings. Mesurer does not upload or externally process screenshots.
+
+## Remote Code
+
+Mesurer does not use remote code.
+
+All JavaScript/Wasm executed by the extension is packaged with the extension bundle.
+
+## Data Sharing
+
+Mesurer does not sell or transfer user data to third parties.
+
+## Contact
+
+For questions, open an issue on GitHub:
+
+https://github.com/ibelick/mesurer/issues

package/README.md

@@ -5,10 +5,19 @@
 
 <br>
 
+# Mesurer
+
 [![npm version](https://img.shields.io/npm/v/mesurer)](https://www.npmjs.com/package/mesurer)
 [![downloads](https://img.shields.io/npm/dm/mesurer)](https://www.npmjs.com/package/mesurer)
 
-**[Mesurer](https://mesurer.dev)** is a lightweight measurement and alignment overlay for React apps. Toggle it on, select elements, and measure distances directly in the browser.
+**Visual precision for building with coding agents.**
+
+Measure, inspect, and capture exactly what you see in the browser.
+
+Mesurer is an open-source UI inspector and visual feedback tool for the browser.
+Use guides, rulers, measurements, color inspection, typography tools, X-ray mode,
+screenshots to understand interfaces and communicate precise
+visual feedback to coding agents.
 
 [Full documentation](https://mesurer.dev/)
 
@@ -21,13 +30,13 @@ npm install mesurer
 ## Usage
 
 ```tsx
-import { Measurer } from "mesurer";
+import { Mesurer } from "mesurer";
 
 function App() {
   return (
     <>
       <YourApp />
-      <Measurer />
+      <Mesurer />
     </>
   );
 }
@@ -44,6 +53,7 @@ function App() {
 | `persistKey`            | Optional workspace storage key; default workspaces are isolated per browser tab. |
 | `portalTarget`          | Optional element or shadow root used as the overlay portal mount target.      |
 | `persistence`           | Optional storage adapter for custom or extension-backed persistence.           |
+| `captureVisibleTab`      | Optional function supplying a PNG of the visible tab for Screenshot capture.  |
 | `onPersistenceError`    | Called when persistence is unavailable or a storage write fails.              |
 | `colorPickerFormats`     | Color formats displayed in the picker popover, in display order.             |
 | `colorPickerClickFormat` | Format copied to the clipboard when a color is picked.                       |
@@ -60,17 +70,18 @@ Props are the defaults. Saved settings override them; **Use defaults** restores
 
 | Shortcut               | Action                                                |
 | ---------------------- | ----------------------------------------------------- |
-| `M`                    | Toggle measurer on/off.                               |
+| `M`                    | Toggle Mesurer on/off.                                |
 | `S`                    | Toggle Select mode.                                   |
 | `A`                    | Toggle Text Inspector mode.                           |
 | `P`                    | Open the native Color picker.                         |
+| `C`                    | Drag a region of the visible tab for a screenshot.    |
 | `G`                    | Toggle Guides mode.                                   |
 | `X`                    | Toggle X-ray mode.                                    |
 | `R`                    | Toggle pixel rulers along the top and left edges.     |
 | `H`                    | Set guide orientation to horizontal.                  |
 | `V`                    | Set guide orientation to vertical.                    |
 | `Alt`                  | Temporarily enable option/guide measurement overlays. |
-| `Esc`                  | Close settings or picker; else clear all.             |
+  | `Esc`                  | Cancel the current interaction and return to Selection. |
 | `Backspace` / `Delete` | Remove selected guides.                               |
 | `Cmd/Ctrl + Z`         | Undo.                                                 |
 | `Cmd/Ctrl + Shift + Z` | Redo.                                                 |
@@ -78,21 +89,22 @@ Props are the defaults. Saved settings override them; **Use defaults** restores
 
 ## Features
 
-- **Select mode** – Click elements to measure their bounds
-- **Guides mode** – Add and drag vertical or horizontal guides
-- **Rulers** – Drag guides from pixel rulers along the top and left edges
-- **Text Inspector** – Inspect typography styles and pin text details
-- **X-ray mode** – Reveal element structure without changing the page
-- **Color picker** – Sample rendered colors and copy values in your chosen format
-- **Distance overlays** – Hold Alt for quick spacing checks
-- **Undo/redo** – Command history for guide and measurement changes
-- **Settings** – Configure selection color, guide styles, ruler behavior, formats, and persistence
-- **Workspace controls** – Restore defaults or clear guides and measurements
+- **Select mode** - Click elements to measure their bounds
+- **Guides mode** - Add and drag vertical or horizontal guides
+- **Rulers** - Drag guides from pixel rulers along the top and left edges
+- **Text Inspector** - Inspect typography styles and pin text details
+- **X-ray mode** - Reveal element structure without changing the page
+- **Color picker** - Sample rendered colors and copy values in your chosen format
+- **Screenshot** - Drag a region of the visible tab and copy or download it. In a React integration without the extension, the browser may show a tab-sharing prompt.
+- **Distance overlays** - Hold Alt for quick spacing checks
+- **Undo/redo** - Command history for guide and measurement changes
+- **Settings** - Configure selection color, guide styles, ruler behavior, formats, and persistence
+- **Workspace controls** - Restore defaults or clear guides and measurements
 
 ## Requirements
 
 - React 18+
-- Chromium-based browser for the native color picker
+- Chromium-based browser for the native color picker and screenshot capture
 
 Settings are stored separately from workspace state. The default adapter uses `localStorage`; integrations can provide a `persistence` adapter such as the browser extension's `chrome.storage.local` implementation.