@gridd/feedback-stickers 1.0.0 → 1.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +35 -53
  2. package/package.json +1 -1
package/README.md CHANGED
@@ -23,76 +23,56 @@ View stickies
23
23
 
24
24
  ---
25
25
 
26
- ## Docusaurus plugin
27
-
28
- The `plugin/` directory contains `@gridd/docusaurus-plugin-feedback-stickers`, a thin wrapper that injects the sticker panel into every page of a Docusaurus site and handles client-side navigation automatically.
29
-
30
- ### Installation
31
-
32
- ```bash
33
- # from the repo root — build the core first, then the plugin
34
- npm run build
35
- cd plugin && npm run build && cd ..
36
- ```
26
+ ## Building from source
37
27
 
38
- In your Docusaurus project, link or install the plugin:
28
+ Requirements: Node.js 18+
39
29
 
40
30
  ```bash
41
- # local development (from within the Docusaurus project)
42
- npm install --save-dev /path/to/gridd-docusaurus-feedback-plugin/plugin
43
-
44
- # or with npm workspaces / yarn workspaces when co-located in a monorepo
45
- ```
46
-
47
- ### Configuration (`docusaurus.config.js`)
48
-
49
- ```js
50
- module.exports = {
51
- // ...
52
- plugins: [
53
- [
54
- '@gridd/docusaurus-plugin-feedback-stickers',
55
- {
56
- // enabled: true, // set false to disable without removing the entry
57
- // devOnly: false, // set true to only show stickers in `docusaurus start`
58
- },
59
- ],
60
- ],
61
- };
31
+ npm install
32
+ npm run build # → dist/feedback-stickers.min.js (~18 KB)
33
+ npm run dev # watch mode, unminified + source map
62
34
  ```
63
35
 
64
- ### How it handles multiple pages
36
+ ---
65
37
 
66
- Each page's stickers are stored in the browser's `localStorage` keyed by the **full page URL** (via an FNV-32 hash). Navigating between pages in Docusaurus is a client-side SPA transition — the plugin's `onRouteDidUpdate` hook fires after each navigation, calls `window.__feedbackStickers.refresh()`, which:
38
+ ## Embedding the script in an HTML file
67
39
 
68
- 1. Stops reviewing mode (so stickers from the old page aren't accidentally placed on the new one)
69
- 2. Removes all sticker DOM elements for the previous page
70
- 3. Loads and renders stickers for the new URL from localStorage
40
+ ### From a CDN (no build step required)
71
41
 
72
- The panel (📌 FAB) stays mounted across navigations — only the sticker layer swaps.
42
+ The package is published to npm as `@gridd/feedback-stickers` and is available on both major CDNs.
73
43
 
74
- ### Plugin options
44
+ **jsDelivr** — recommended, global edge network, SRI hash support:
75
45
 
76
- | Option | Type | Default | Description |
77
- |---|---|---|---|
78
- | `enabled` | `boolean` | `true` | Master switch. `false` removes the panel entirely without touching config. |
79
- | `devOnly` | `boolean` | `false` | `true` restricts injection to `docusaurus start` (development mode). |
46
+ ```html
47
+ <!-- always latest 1.x -->
48
+ <script src="https://cdn.jsdelivr.net/npm/@gridd/feedback-stickers@1/dist/feedback-stickers.min.js"></script>
80
49
 
81
- ---
50
+ <!-- pinned to an exact version (recommended for production) -->
51
+ <script src="https://cdn.jsdelivr.net/npm/@gridd/feedback-stickers@1.0.0/dist/feedback-stickers.min.js"></script>
52
+ ```
82
53
 
83
- ## Building from source
54
+ **unpkg** — alternative CDN, also served directly from the npm registry:
84
55
 
85
- Requirements: Node.js 18+
56
+ ```html
57
+ <!-- always latest 1.x -->
58
+ <script src="https://unpkg.com/@gridd/feedback-stickers@1/dist/feedback-stickers.min.js"></script>
86
59
 
87
- ```bash
88
- npm install
89
- npm run build # → dist/feedback-stickers.min.js (~18 KB)
90
- npm run dev # watch mode, unminified + source map
60
+ <!-- pinned to an exact version -->
61
+ <script src="https://unpkg.com/@gridd/feedback-stickers@1.0.0/dist/feedback-stickers.min.js"></script>
91
62
  ```
92
63
 
93
- ---
64
+ > **SRI integrity hashes** — for pinned production deployments, generate a hash with:
65
+ > ```bash
66
+ > curl -s https://cdn.jsdelivr.net/npm/@gridd/feedback-stickers@1.0.0/dist/feedback-stickers.min.js \
67
+ > | openssl dgst -sha384 -binary | openssl base64 -A
68
+ > ```
69
+ > Then add it to the tag:
70
+ > ```html
71
+ > <script src="https://cdn.jsdelivr.net/npm/@gridd/feedback-stickers@1.0.0/dist/feedback-stickers.min.js"
72
+ > integrity="sha384-<hash>" crossorigin="anonymous"></script>
73
+ > ```
94
74
 
95
- ## Embedding the script in an HTML file
75
+ ### From a local file
96
76
 
97
77
  Add one line before `</body>`:
98
78
 
@@ -191,6 +171,8 @@ Or inline the minified script for a single self-contained file (see *Single-file
191
171
 
192
172
  Send the HTML file to the reviewer. If the script is not inlined, include `feedback-stickers.min.js` alongside it in the same folder (or zip archive).
193
173
 
174
+ Alternatively if you use Docusaurus rendering engine, you can use the [@gridd/docusaurus-feedback-plugin](https://www.npmjs.com/package/@gridd/docusaurus-feedback-plugin)'s export button that generates the page with inlined scripts, images, for easy share with the less technical colleagues.
175
+
194
176
  ---
195
177
 
196
178
  ### Step 2 — Reviewer: open the file
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gridd/feedback-stickers",
3
- "version": "1.0.0",
3
+ "version": "1.0.1",
4
4
  "description": "Drop-in sticky-note annotation panel for any HTML page. Self-contained IIFE — no framework required.",
5
5
  "keywords": ["feedback", "review", "sticky", "annotation", "stickers", "docusaurus"],
6
6
  "license": "UNLICENSED",