fubi 0.1.2 → 0.1.4
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.
- package/README.md +43 -3
- package/package.json +18 -2
- package/src/dist/feedback.js +4 -6628
- package/src/dist/index-Ckde0azm.js +6720 -0
- package/src/dist/keys-BCArKQcG.js +31 -0
- package/src/dist/notifications.svelte-DAqzRURB.js +116 -0
package/README.md
CHANGED
|
@@ -5,12 +5,12 @@ Fubi is a lightweight, universal in-page feedback and collaboration tool. It all
|
|
|
5
5
|
## Features
|
|
6
6
|
|
|
7
7
|
- 🎯 **Element Isolation**: Select and isolate specific page elements for targeted feedback
|
|
8
|
-
- 💬 **Threads
|
|
8
|
+
- 💬 **Threads & Comments**: Create comment threads attached to specific page elements
|
|
9
9
|
- ✅ **Mark as Done**: Track progress by marking feedback threads as completed
|
|
10
10
|
- 🔄 **Page Switcher**: Easily navigate between pages where feedback is provided
|
|
11
|
-
- ⚡ **Real-time
|
|
11
|
+
- ⚡ **Real-time**: Get notified of new comments and changes instantly
|
|
12
12
|
- 🔌 **Easy Integration**: Simple to integrate into any web application
|
|
13
|
-
- 📦 **Tiny
|
|
13
|
+
- 📦 **Tiny**: Lightweight package with minimal impact on your website
|
|
14
14
|
|
|
15
15
|
## Installation
|
|
16
16
|
|
|
@@ -32,6 +32,46 @@ const app = fubi({
|
|
|
32
32
|
});
|
|
33
33
|
```
|
|
34
34
|
|
|
35
|
+
## Activation
|
|
36
|
+
|
|
37
|
+
To open the Fubi feedback interface, simply add the `fubi` parameter to your URL:
|
|
38
|
+
|
|
39
|
+
```
|
|
40
|
+
https://yourwebsite.com/?fubi
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
This makes it easy to share feedback-enabled links with your team.
|
|
44
|
+
|
|
45
|
+
## Helper Classes
|
|
46
|
+
|
|
47
|
+
Fubi provides several helper classes to control which elements can be selected for feedback:
|
|
48
|
+
|
|
49
|
+
- **`fubi-ignore`**: Add this class to any element you want Fubi to ignore. The element itself won't be selectable for feedback.
|
|
50
|
+
|
|
51
|
+
- **`fubi-ignore-all`**: Add this class to a container element to make all of its contents unselectable. This is useful for UI components that shouldn't receive feedback.
|
|
52
|
+
|
|
53
|
+
- **`fubi-ignore-stop`**: This class can be used inside a `fubi-ignore-all` container to re-enable element selection. Any element with this class (and its children) will be selectable again, effectively stopping the ignore behavior.
|
|
54
|
+
|
|
55
|
+
Example usage:
|
|
56
|
+
|
|
57
|
+
```html
|
|
58
|
+
<!-- Regular element that can be selected -->
|
|
59
|
+
<div>This element can be selected</div>
|
|
60
|
+
|
|
61
|
+
<!-- Single element that can't be selected -->
|
|
62
|
+
<div class="fubi-ignore">This element can't be selected</div>
|
|
63
|
+
|
|
64
|
+
<!-- Container where nothing can be selected -->
|
|
65
|
+
<ul class="fubi-ignore-all">
|
|
66
|
+
<li>Can't be selected</li>
|
|
67
|
+
<li>Can't be selected</li>
|
|
68
|
+
<!-- This element and its children become selectable again -->
|
|
69
|
+
<li class="fubi-ignore-stop">
|
|
70
|
+
<a href="/page">This can be selected</a>
|
|
71
|
+
</li>
|
|
72
|
+
</ul>
|
|
73
|
+
```
|
|
74
|
+
|
|
35
75
|
## Getting Started
|
|
36
76
|
|
|
37
77
|
To use Fubi, you'll need to create an account at [fubi.dev](https://fubi.dev) where you can set up your projects and manage your feedback.
|
package/package.json
CHANGED
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "fubi",
|
|
3
|
-
"
|
|
3
|
+
"description": "A lightweight, universal in-page feedback and collaboration tool for web applications.",
|
|
4
|
+
"author": "Wonder Makers",
|
|
5
|
+
"version": "0.1.4",
|
|
6
|
+
"homepage": "https://fubi.dev",
|
|
4
7
|
"type": "module",
|
|
5
8
|
"scripts": {
|
|
6
9
|
"dev": "vite",
|
|
@@ -27,6 +30,7 @@
|
|
|
27
30
|
"vite": "^6.2.0"
|
|
28
31
|
},
|
|
29
32
|
"dependencies": {
|
|
33
|
+
"@svelte-put/clickoutside": "^4.0.0",
|
|
30
34
|
"@tailwindcss/postcss": "^4.0.12",
|
|
31
35
|
"@wmdigi/dom": "^2.1.30",
|
|
32
36
|
"pocketbase": "^0.25.2",
|
|
@@ -34,5 +38,17 @@
|
|
|
34
38
|
"rollup-plugin-postcss": "^4.0.2",
|
|
35
39
|
"tailwindcss": "^4.0.9",
|
|
36
40
|
"vite-plugin-css-injected-by-js": "^3.5.2"
|
|
37
|
-
}
|
|
41
|
+
},
|
|
42
|
+
"keywords": [
|
|
43
|
+
"feedback",
|
|
44
|
+
"collaboration",
|
|
45
|
+
"comments",
|
|
46
|
+
"annotation",
|
|
47
|
+
"ui-feedback",
|
|
48
|
+
"web-comments",
|
|
49
|
+
"feedback-tool",
|
|
50
|
+
"in-page-feedback",
|
|
51
|
+
"element-comments",
|
|
52
|
+
"realtime"
|
|
53
|
+
]
|
|
38
54
|
}
|