@mediansh/widget 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 +86 -0
- package/dist/chunk-6E3NBXLE.js +30786 -0
- package/dist/chunk-6E3NBXLE.js.map +1 -0
- package/dist/highlighted-body-OFNGDK62-UN447WAU.js +28 -0
- package/dist/highlighted-body-OFNGDK62-UN447WAU.js.map +1 -0
- package/dist/index.d.ts +525 -0
- package/dist/index.js +13883 -0
- package/dist/index.js.map +1 -0
- package/dist/mermaid-GHXKKRXX-5WPKRFDI.js +9 -0
- package/dist/mermaid-GHXKKRXX-5WPKRFDI.js.map +1 -0
- package/dist/widget.css +2 -0
- package/package.json +48 -0
package/README.md
ADDED
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
# @mediansh/widget
|
|
2
|
+
|
|
3
|
+
The Median support widget. A launcher in the corner of your site opens into a
|
|
4
|
+
support panel. An AI agent answers first, your team picks up in the Median
|
|
5
|
+
inbox, and replies stream back to the visitor. There is no connection or
|
|
6
|
+
message list to manage.
|
|
7
|
+
|
|
8
|
+
## Install
|
|
9
|
+
|
|
10
|
+
```sh
|
|
11
|
+
npm install @mediansh/widget
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
Import the stylesheet once, wherever your global CSS lives:
|
|
15
|
+
|
|
16
|
+
```ts
|
|
17
|
+
import "@mediansh/widget/styles.css";
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
## React
|
|
21
|
+
|
|
22
|
+
```tsx
|
|
23
|
+
import { MedianSupport } from "@mediansh/widget";
|
|
24
|
+
|
|
25
|
+
<MedianSupport apiKey="median_pk_..." />;
|
|
26
|
+
```
|
|
27
|
+
|
|
28
|
+
Mount it once, anywhere in your tree. The `median_pk_` id is derived from
|
|
29
|
+
your server's `MEDIAN_KEY`; the docs show the one line helper.
|
|
30
|
+
|
|
31
|
+
## Without React
|
|
32
|
+
|
|
33
|
+
```ts
|
|
34
|
+
import { mountMedianSupport } from "@mediansh/widget";
|
|
35
|
+
|
|
36
|
+
const support = mountMedianSupport({ apiKey: "median_pk_..." });
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
Same widget, same options, on any page with a bundler. The instance returns
|
|
40
|
+
`update` for new options and `unmount` to take it off the page. React
|
|
41
|
+
installs alongside as a peer dependency; your app does not use it.
|
|
42
|
+
|
|
43
|
+
## Control it from anywhere
|
|
44
|
+
|
|
45
|
+
```ts
|
|
46
|
+
import { medianSupport } from "@mediansh/widget";
|
|
47
|
+
|
|
48
|
+
medianSupport.open();
|
|
49
|
+
medianSupport.attach("Crash trace", error.stack);
|
|
50
|
+
medianSupport.reportError(error); // from your error screen
|
|
51
|
+
medianSupport.reset(); // on sign out
|
|
52
|
+
```
|
|
53
|
+
|
|
54
|
+
React components can use `useMedianSupport()` for the same control with a
|
|
55
|
+
live `isOpen`.
|
|
56
|
+
|
|
57
|
+
## Feedback
|
|
58
|
+
|
|
59
|
+
A second panel, for notes rather than questions. It wraps a trigger of your
|
|
60
|
+
own and opens under it:
|
|
61
|
+
|
|
62
|
+
```tsx
|
|
63
|
+
import { MedianFeedback } from "@mediansh/widget";
|
|
64
|
+
|
|
65
|
+
<MedianFeedback apiKey="median_pk_...">
|
|
66
|
+
<button>Share feedback</button>
|
|
67
|
+
</MedianFeedback>;
|
|
68
|
+
```
|
|
69
|
+
|
|
70
|
+
One box and one button. A model reads the note and files it as a bug or a
|
|
71
|
+
suggestion, or drops it as spam. Nobody picks a category or writes a title,
|
|
72
|
+
and the page it was written on rides along.
|
|
73
|
+
|
|
74
|
+
`mountMedianFeedback` is the version for pages without React, and
|
|
75
|
+
`medianFeedback` / `useMedianFeedback()` open it from anywhere else.
|
|
76
|
+
|
|
77
|
+
## Theming
|
|
78
|
+
|
|
79
|
+
Both panels read shadcn-style CSS variables from your page and fall back to
|
|
80
|
+
a plain light theme without them. They inherit your font.
|
|
81
|
+
|
|
82
|
+
## Docs
|
|
83
|
+
|
|
84
|
+
Props, identity, diagnostics, feedback, and agent tools:
|
|
85
|
+
[docs.median.sh](https://docs.median.sh), or the source at
|
|
86
|
+
[github.com/mediansh/median](https://github.com/mediansh/median).
|