@webority/ui-react 0.13.0 → 0.13.3
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/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@webority/ui-react",
|
|
3
|
-
"version": "0.13.
|
|
3
|
+
"version": "0.13.3",
|
|
4
4
|
"description": "Webority shared React component library — App* primitives on react-bootstrap + the @webority/theme design system.",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE",
|
|
6
6
|
"type": "module",
|
|
@@ -28,8 +28,8 @@
|
|
|
28
28
|
},
|
|
29
29
|
"sideEffects": false,
|
|
30
30
|
"dependencies": {
|
|
31
|
-
"@webority/
|
|
32
|
-
"@webority/
|
|
31
|
+
"@webority/theme": "0.13.3",
|
|
32
|
+
"@webority/ui-elements": "0.13.3"
|
|
33
33
|
},
|
|
34
34
|
"peerDependencies": {
|
|
35
35
|
"@webority/analytics": "^0.5.2",
|
|
@@ -1,61 +0,0 @@
|
|
|
1
|
-
import "@webority/ui-elements";
|
|
2
|
-
/**
|
|
3
|
-
* An in-product feedback affordance — a floating trigger pinned to a page corner that opens a
|
|
4
|
-
* small panel with a message box and, optionally, an email address.
|
|
5
|
-
*
|
|
6
|
-
* Wraps the shared `<wui-feedback>` element, which owns the panel, the keyboard and ARIA
|
|
7
|
-
* behaviour, and the busy/error/thank-you states. This wrapper owns exactly one thing: turning
|
|
8
|
-
* the element's `wui-feedback-submit` event into your `onSubmit`, and your promise's outcome
|
|
9
|
-
* back into the element's `submitted()` / `failed()`.
|
|
10
|
-
*
|
|
11
|
-
* `onSubmit` is REQUIRED and it is the whole contract — resolve and the person sees a
|
|
12
|
-
* thank-you, reject and they see an inline error with everything they typed still there. The
|
|
13
|
-
* library never posts anything itself: every product has its own endpoint, its own auth and its
|
|
14
|
-
* own idea of where feedback lands.
|
|
15
|
-
*
|
|
16
|
-
* ```jsx
|
|
17
|
-
* <AppFeedback
|
|
18
|
-
* surface="customer-portal"
|
|
19
|
-
* screen={location.pathname}
|
|
20
|
-
* collectEmail
|
|
21
|
-
* onSubmit={async ({ message, email, surface, screen }) => {
|
|
22
|
-
* await Api.Feedback.submit({ message, email, surface, screen });
|
|
23
|
-
* }}
|
|
24
|
-
* />
|
|
25
|
-
* ```
|
|
26
|
-
*
|
|
27
|
-
* To show your own failure copy rather than the element's default, reject with an error
|
|
28
|
-
* carrying a `userMessage` — an exception's own `message` is never shown, because it is written
|
|
29
|
-
* for a developer, not for the person reading it.
|
|
30
|
-
*
|
|
31
|
-
* @param {object} props
|
|
32
|
-
* @param {(payload: { message: string, email: string, surface: string, screen: string }) =>
|
|
33
|
-
* Promise<void>|void} props.onSubmit Required. Deliver the feedback; resolve on success,
|
|
34
|
-
* reject on failure.
|
|
35
|
-
* @param {string} [props.surface] Which product surface this came from, passed through to onSubmit.
|
|
36
|
-
* @param {string} [props.screen] Which screen/route it came from, passed through to onSubmit.
|
|
37
|
-
* @param {string} [props.heading='Share feedback'] Panel heading, and the dialog's accessible name.
|
|
38
|
-
* @param {string} [props.label='Feedback'] Trigger text beside the icon.
|
|
39
|
-
* @param {string} [props.placeholder] Placeholder for the message box.
|
|
40
|
-
* @param {boolean} [props.collectEmail=false] Also ask for an email address.
|
|
41
|
-
* @param {"bottom-right"|"bottom-left"} [props.position='bottom-right'] Which corner it pins to.
|
|
42
|
-
* @param {string} [props.className] Extra classes on the element.
|
|
43
|
-
* @param {import('react').CSSProperties} [props.style] Inline style; lands on the element with `className`.
|
|
44
|
-
*/
|
|
45
|
-
export default function AppFeedback({ onSubmit, surface, screen, heading, label, placeholder, collectEmail, position, className, style, ...rest }: {
|
|
46
|
-
onSubmit: (payload: {
|
|
47
|
-
message: string;
|
|
48
|
-
email: string;
|
|
49
|
-
surface: string;
|
|
50
|
-
screen: string;
|
|
51
|
-
}) => Promise<void> | void;
|
|
52
|
-
surface?: string;
|
|
53
|
-
screen?: string;
|
|
54
|
-
heading?: string;
|
|
55
|
-
label?: string;
|
|
56
|
-
placeholder?: string;
|
|
57
|
-
collectEmail?: boolean;
|
|
58
|
-
position?: "bottom-right" | "bottom-left";
|
|
59
|
-
className?: string;
|
|
60
|
-
style?: import('react').CSSProperties;
|
|
61
|
-
}): import("react").JSX.Element;
|