@diegotsi/flint-react 0.1.0
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 +85 -0
- package/dist/index.cjs +1116 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +24 -0
- package/dist/index.d.ts +24 -0
- package/dist/index.js +1088 -0
- package/dist/index.js.map +1 -0
- package/package.json +46 -0
package/README.md
ADDED
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
# @diegotsi/flint-react
|
|
2
|
+
|
|
3
|
+
Embeddable React widget that lets users report bugs directly from your app. Sends reports to a running `flint-server` instance.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
bun add @diegotsi/flint-react
|
|
9
|
+
# or
|
|
10
|
+
npm install @diegotsi/flint-react
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
React 17+ is required as a peer dependency.
|
|
14
|
+
|
|
15
|
+
## Usage
|
|
16
|
+
|
|
17
|
+
```tsx
|
|
18
|
+
import { FlintWidget } from "@diegotsi/flint-react"
|
|
19
|
+
|
|
20
|
+
export default function App() {
|
|
21
|
+
return (
|
|
22
|
+
<>
|
|
23
|
+
{/* your app */}
|
|
24
|
+
<FlintWidget
|
|
25
|
+
projectKey="your-project-api-key"
|
|
26
|
+
serverUrl="https://your-flint-server.com"
|
|
27
|
+
/>
|
|
28
|
+
</>
|
|
29
|
+
)
|
|
30
|
+
}
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
The widget renders a floating button fixed to the bottom-right corner. Clicking it opens a modal where the user fills in a bug report.
|
|
34
|
+
|
|
35
|
+
## Props
|
|
36
|
+
|
|
37
|
+
| Prop | Type | Default | Description |
|
|
38
|
+
|------|------|---------|-------------|
|
|
39
|
+
| `projectKey` | `string` | required | API key from flint-server |
|
|
40
|
+
| `serverUrl` | `string` | required | Base URL of your flint-server |
|
|
41
|
+
| `user` | `FlintUser` | — | Pre-fill reporter info |
|
|
42
|
+
| `meta` | `Record<string, unknown>` | — | Extra metadata attached to every report |
|
|
43
|
+
| `buttonLabel` | `string` | `"Reportar bug"` | Label on the trigger button |
|
|
44
|
+
| `locale` | `"pt-BR" \| "en-US"` | `"pt-BR"` | UI language |
|
|
45
|
+
| `theme` | `"light" \| "dark" \| ThemeOverride` | `"light"` | Visual theme |
|
|
46
|
+
| `zIndex` | `number` | `9999` | CSS z-index of the widget |
|
|
47
|
+
|
|
48
|
+
## Theme customization
|
|
49
|
+
|
|
50
|
+
Pass a `ThemeOverride` object to fine-tune colors:
|
|
51
|
+
|
|
52
|
+
```tsx
|
|
53
|
+
<FlintWidget
|
|
54
|
+
projectKey="..."
|
|
55
|
+
serverUrl="..."
|
|
56
|
+
theme={{
|
|
57
|
+
background: "#0f0f0f",
|
|
58
|
+
accent: "#6366f1",
|
|
59
|
+
text: "#f5f5f5",
|
|
60
|
+
border: "#2a2a2a",
|
|
61
|
+
}}
|
|
62
|
+
/>
|
|
63
|
+
```
|
|
64
|
+
|
|
65
|
+
## Severity levels
|
|
66
|
+
|
|
67
|
+
| Level | Meaning |
|
|
68
|
+
|-------|---------|
|
|
69
|
+
| P1 | Critical — system down |
|
|
70
|
+
| P2 | High — core feature broken |
|
|
71
|
+
| P3 | Medium — noticeable but workable |
|
|
72
|
+
| P4 | Low — cosmetic or improvement |
|
|
73
|
+
|
|
74
|
+
## Development
|
|
75
|
+
|
|
76
|
+
```bash
|
|
77
|
+
# Watch mode
|
|
78
|
+
bun run dev
|
|
79
|
+
|
|
80
|
+
# Type-check
|
|
81
|
+
bun run typecheck
|
|
82
|
+
|
|
83
|
+
# Build
|
|
84
|
+
bun run build
|
|
85
|
+
```
|