@availity/mui-feedback 0.1.0 → 0.1.2
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/CHANGELOG.md +7 -0
- package/dist/index.js +34 -308
- package/dist/index.mjs +35 -306
- package/package.json +4 -2
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
|
|
4
4
|
|
|
5
|
+
## [0.1.2](https://github.com/Availity/element/compare/@availity/mui-feedback@0.1.1...@availity/mui-feedback@0.1.2) (2023-11-21)
|
|
6
|
+
|
|
7
|
+
### Dependency Updates
|
|
8
|
+
|
|
9
|
+
* `mui-toggle-button` updated to version `0.1.7`
|
|
10
|
+
## [0.1.1](https://github.com/Availity/element/compare/@availity/mui-feedback@0.1.0...@availity/mui-feedback@0.1.1) (2023-11-21)
|
|
11
|
+
|
|
5
12
|
## 0.1.0 (2023-11-21)
|
|
6
13
|
|
|
7
14
|
### Dependency Updates
|
package/dist/index.js
CHANGED
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __create = Object.create;
|
|
3
2
|
var __defProp = Object.defineProperty;
|
|
4
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
4
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
7
5
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
6
|
var __export = (target, all) => {
|
|
9
7
|
for (var name in all)
|
|
@@ -17,10 +15,6 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
15
|
}
|
|
18
16
|
return to;
|
|
19
17
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
-
mod
|
|
23
|
-
));
|
|
24
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
25
19
|
|
|
26
20
|
// src/index.ts
|
|
@@ -31,277 +25,24 @@ __export(src_exports, {
|
|
|
31
25
|
module.exports = __toCommonJS(src_exports);
|
|
32
26
|
|
|
33
27
|
// src/lib/Feedback.tsx
|
|
34
|
-
var
|
|
28
|
+
var import_react2 = require("react");
|
|
35
29
|
var import_mui_popover = require("@availity/mui-popover");
|
|
36
|
-
var
|
|
37
|
-
var
|
|
30
|
+
var import_mui_button3 = require("@availity/mui-button");
|
|
31
|
+
var import_material3 = require("@mui/material");
|
|
38
32
|
var import_api_axios2 = require("@availity/api-axios");
|
|
39
33
|
|
|
40
34
|
// src/lib/FeedbackForm.tsx
|
|
41
|
-
var
|
|
35
|
+
var import_react = require("react");
|
|
42
36
|
var import_mui_textfield = require("@availity/mui-textfield");
|
|
43
|
-
var import_mui_button2 = require("@availity/mui-button");
|
|
44
|
-
var import_mui_toggle_button = require("@availity/mui-toggle-button");
|
|
45
|
-
var import_material3 = require("@mui/material");
|
|
46
|
-
var import_mui_icon4 = require("@availity/mui-icon");
|
|
47
|
-
|
|
48
|
-
// ../../node_modules/@availity/message-core/dist/index.mjs
|
|
49
|
-
var __defProp2 = Object.defineProperty;
|
|
50
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
51
|
-
var __publicField = (obj, key, value) => {
|
|
52
|
-
__defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
53
|
-
return value;
|
|
54
|
-
};
|
|
55
|
-
var __accessCheck = (obj, member, msg) => {
|
|
56
|
-
if (!member.has(obj))
|
|
57
|
-
throw TypeError("Cannot " + msg);
|
|
58
|
-
};
|
|
59
|
-
var __privateGet = (obj, member, getter) => {
|
|
60
|
-
__accessCheck(obj, member, "read from private field");
|
|
61
|
-
return getter ? getter.call(obj) : member.get(obj);
|
|
62
|
-
};
|
|
63
|
-
var __privateAdd = (obj, member, value) => {
|
|
64
|
-
if (member.has(obj))
|
|
65
|
-
throw TypeError("Cannot add the same private member more than once");
|
|
66
|
-
member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
|
|
67
|
-
};
|
|
68
|
-
var __privateSet = (obj, member, value, setter) => {
|
|
69
|
-
__accessCheck(obj, member, "write to private field");
|
|
70
|
-
setter ? setter.call(obj, value) : member.set(obj, value);
|
|
71
|
-
return value;
|
|
72
|
-
};
|
|
73
|
-
var _lastId;
|
|
74
|
-
var AvMessage = class {
|
|
75
|
-
constructor() {
|
|
76
|
-
__publicField(this, "subscribers", {});
|
|
77
|
-
__publicField(this, "getEventData", (event) => {
|
|
78
|
-
const isSameWindow = event.source === window;
|
|
79
|
-
if (!this.isEnabled || !event || !event.data || !event.origin || !event.source || !this.isDomain(event.origin)) {
|
|
80
|
-
return;
|
|
81
|
-
}
|
|
82
|
-
let { data } = event;
|
|
83
|
-
if (typeof data === "string") {
|
|
84
|
-
try {
|
|
85
|
-
data = JSON.parse(data);
|
|
86
|
-
} catch {
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
if (typeof data === "string") {
|
|
90
|
-
event = data;
|
|
91
|
-
data = void 0;
|
|
92
|
-
} else {
|
|
93
|
-
event = data && data.event || this.DEFAULT_EVENT;
|
|
94
|
-
}
|
|
95
|
-
const metadata = { isSameWindow };
|
|
96
|
-
this.onMessage(event, data, metadata);
|
|
97
|
-
});
|
|
98
|
-
__privateAdd(this, _lastId, 0);
|
|
99
|
-
this.isEnabled = true;
|
|
100
|
-
this.DEFAULT_EVENT = "avMessage";
|
|
101
|
-
this.DOMAIN = /https?:\/\/([\w-]+\.)?availity\.(com|net)/;
|
|
102
|
-
window.addEventListener("message", this.getEventData);
|
|
103
|
-
}
|
|
104
|
-
enabled(value) {
|
|
105
|
-
if (arguments.length > 0) {
|
|
106
|
-
this.isEnabled = !!value;
|
|
107
|
-
}
|
|
108
|
-
return this.isEnabled;
|
|
109
|
-
}
|
|
110
|
-
subscribe(event, callback, options) {
|
|
111
|
-
var _a;
|
|
112
|
-
if (!this.subscribers[event]) {
|
|
113
|
-
this.subscribers[event] = [];
|
|
114
|
-
}
|
|
115
|
-
__privateSet(this, _lastId, __privateGet(this, _lastId) + 1);
|
|
116
|
-
const id = __privateGet(this, _lastId);
|
|
117
|
-
const ignoreSameWindow = (_a = options == null ? void 0 : options.ignoreSameWindow) != null ? _a : true;
|
|
118
|
-
const subscriber = { id, callback, options: { ignoreSameWindow } };
|
|
119
|
-
this.subscribers[event].push(subscriber);
|
|
120
|
-
return () => {
|
|
121
|
-
this.subscribers[event] = this.subscribers[event].filter((subscriber2) => subscriber2.id !== id);
|
|
122
|
-
};
|
|
123
|
-
}
|
|
124
|
-
unsubscribe(event) {
|
|
125
|
-
delete this.subscribers[event];
|
|
126
|
-
}
|
|
127
|
-
unsubscribeAll() {
|
|
128
|
-
this.subscribers = {};
|
|
129
|
-
}
|
|
130
|
-
onMessage(event, data, metadata) {
|
|
131
|
-
const { isSameWindow } = metadata;
|
|
132
|
-
if (this.subscribers[event]) {
|
|
133
|
-
for (const subscriber of this.subscribers[event]) {
|
|
134
|
-
const { ignoreSameWindow } = subscriber.options;
|
|
135
|
-
const skip = isSameWindow && ignoreSameWindow;
|
|
136
|
-
if (!skip) {
|
|
137
|
-
subscriber.callback(data);
|
|
138
|
-
}
|
|
139
|
-
}
|
|
140
|
-
}
|
|
141
|
-
}
|
|
142
|
-
isDomain(url) {
|
|
143
|
-
return !this.DOMAIN.test(this.domain()) || this.DOMAIN.test(url);
|
|
144
|
-
}
|
|
145
|
-
domain() {
|
|
146
|
-
if (window.location.origin) {
|
|
147
|
-
return window.location.origin;
|
|
148
|
-
}
|
|
149
|
-
if (window.location.hostname) {
|
|
150
|
-
return `${window.location.protocol}//${window.location.hostname}${window.location.port ? `:${window.location.port}` : ""}`;
|
|
151
|
-
}
|
|
152
|
-
return "*";
|
|
153
|
-
}
|
|
154
|
-
send(payload, target = window.top) {
|
|
155
|
-
if (!this.isEnabled || !payload) {
|
|
156
|
-
return;
|
|
157
|
-
}
|
|
158
|
-
try {
|
|
159
|
-
const message = typeof payload === "string" ? payload : JSON.stringify(payload);
|
|
160
|
-
target.postMessage(message, this.domain());
|
|
161
|
-
} catch (error) {
|
|
162
|
-
console.warn("AvMessage.send()", error);
|
|
163
|
-
}
|
|
164
|
-
}
|
|
165
|
-
};
|
|
166
|
-
_lastId = /* @__PURE__ */ new WeakMap();
|
|
167
|
-
var AvMessage_default = AvMessage;
|
|
168
|
-
var src_default = new AvMessage_default();
|
|
169
|
-
|
|
170
|
-
// ../form-utils/src/lib/FieldHelpIcon.tsx
|
|
171
|
-
var import_mui_icon = require("@availity/mui-icon");
|
|
172
37
|
var import_mui_button = require("@availity/mui-button");
|
|
173
|
-
var
|
|
174
|
-
var triggerFieldHelp = (id) => {
|
|
175
|
-
src_default.send({
|
|
176
|
-
event: "nav:help:field",
|
|
177
|
-
id
|
|
178
|
-
});
|
|
179
|
-
};
|
|
180
|
-
var FieldHelpIcon = ({ helpTopicId, labelId, sx, ...rest }) => {
|
|
181
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_button.IconButton, {
|
|
182
|
-
...rest,
|
|
183
|
-
color: "primary",
|
|
184
|
-
title: "Help",
|
|
185
|
-
role: "link",
|
|
186
|
-
onClick: () => triggerFieldHelp(helpTopicId),
|
|
187
|
-
"aria-describedby": labelId,
|
|
188
|
-
size: "small",
|
|
189
|
-
sx: { ...sx, padding: 0.5, fontSize: "inherit", marginTop: "-2px", opacity: 1 },
|
|
190
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_icon.HelpCircleIcon, {
|
|
191
|
-
"aria-hidden": true,
|
|
192
|
-
titleAccess: void 0
|
|
193
|
-
})
|
|
194
|
-
});
|
|
195
|
-
};
|
|
196
|
-
|
|
197
|
-
// ../form-utils/src/lib/FormControlLabel.tsx
|
|
198
|
-
var import_react = require("react");
|
|
38
|
+
var import_mui_toggle_button = require("@availity/mui-toggle-button");
|
|
199
39
|
var import_material = require("@mui/material");
|
|
200
|
-
var
|
|
201
|
-
var
|
|
202
|
-
const labelId = id || (rest.htmlFor ? `${rest.htmlFor}-label` : void 0);
|
|
203
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_material.Box, {
|
|
204
|
-
children: [
|
|
205
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.FormControlLabel, {
|
|
206
|
-
id: labelId,
|
|
207
|
-
...rest,
|
|
208
|
-
ref
|
|
209
|
-
}),
|
|
210
|
-
helpTopicId ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FieldHelpIcon, {
|
|
211
|
-
helpTopicId: "12345",
|
|
212
|
-
labelId
|
|
213
|
-
}) : null
|
|
214
|
-
]
|
|
215
|
-
});
|
|
216
|
-
});
|
|
217
|
-
|
|
218
|
-
// ../form-utils/src/lib/FormHelperText.tsx
|
|
219
|
-
var import_FormHelperText = __toESM(require("@mui/material/FormHelperText"));
|
|
220
|
-
var import_mui_icon2 = require("@availity/mui-icon");
|
|
221
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
222
|
-
|
|
223
|
-
// ../form-utils/src/lib/FormLabel.tsx
|
|
224
|
-
var import_react2 = require("react");
|
|
225
|
-
var import_material2 = require("@mui/material");
|
|
226
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
227
|
-
var Children = (0, import_material2.styled)("span", {
|
|
228
|
-
name: "MuiFormLabel",
|
|
229
|
-
slot: "Children",
|
|
230
|
-
overridesResolver: (props, styles) => styles.children
|
|
231
|
-
})({});
|
|
232
|
-
var StyleOverrides = {
|
|
233
|
-
position: "relative !important",
|
|
234
|
-
transform: "none !important",
|
|
235
|
-
transition: "none !important",
|
|
236
|
-
animation: "none !important"
|
|
237
|
-
};
|
|
238
|
-
var FormLabel = (0, import_react2.forwardRef)((props, ref) => {
|
|
239
|
-
const { children, helpTopicId, id, sx, ...rest } = props;
|
|
240
|
-
const labelId = id || (rest.htmlFor ? `${rest.htmlFor}-label` : void 0);
|
|
241
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_material2.Box, {
|
|
242
|
-
display: "flex",
|
|
243
|
-
flexDirection: "row",
|
|
244
|
-
sx,
|
|
245
|
-
children: [
|
|
246
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material2.FormLabel, {
|
|
247
|
-
id: labelId,
|
|
248
|
-
sx: { ...StyleOverrides },
|
|
249
|
-
...rest,
|
|
250
|
-
ref,
|
|
251
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Children, {
|
|
252
|
-
className: "MuiFormLabel-children",
|
|
253
|
-
children
|
|
254
|
-
})
|
|
255
|
-
}),
|
|
256
|
-
helpTopicId ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FieldHelpIcon, {
|
|
257
|
-
helpTopicId,
|
|
258
|
-
labelId,
|
|
259
|
-
sx: { px: 0.5 }
|
|
260
|
-
}) : null
|
|
261
|
-
]
|
|
262
|
-
});
|
|
263
|
-
});
|
|
264
|
-
|
|
265
|
-
// ../form-utils/src/lib/Input.tsx
|
|
266
|
-
var import_OutlinedInput = __toESM(require("@mui/material/OutlinedInput"));
|
|
267
|
-
var import_InputAdornment = __toESM(require("@mui/material/InputAdornment"));
|
|
268
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
269
|
-
var InputPropOverrides = {
|
|
270
|
-
notched: false
|
|
271
|
-
};
|
|
272
|
-
|
|
273
|
-
// ../form-utils/src/lib/Select.tsx
|
|
274
|
-
var import_Select = __toESM(require("@mui/material/Select"));
|
|
275
|
-
var import_Divider = __toESM(require("@mui/material/Divider"));
|
|
276
|
-
var import_Stack = __toESM(require("@mui/material/Stack"));
|
|
277
|
-
var import_mui_icon3 = require("@availity/mui-icon");
|
|
278
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
279
|
-
var InnerEndAdornment = (args) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_Stack.default, {
|
|
280
|
-
...args,
|
|
281
|
-
direction: "row",
|
|
282
|
-
spacing: 1,
|
|
283
|
-
height: "100%",
|
|
284
|
-
paddingY: ".5rem",
|
|
285
|
-
top: "unset!important",
|
|
286
|
-
children: [
|
|
287
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Divider.default, {
|
|
288
|
-
orientation: "vertical"
|
|
289
|
-
}),
|
|
290
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_icon3.ExpandIcon, {
|
|
291
|
-
sx: { position: "relative", top: "calc(50% - .5rem)" }
|
|
292
|
-
})
|
|
293
|
-
]
|
|
294
|
-
});
|
|
295
|
-
var SelectPropOverrides = {
|
|
296
|
-
IconComponent: InnerEndAdornment,
|
|
297
|
-
...InputPropOverrides
|
|
298
|
-
};
|
|
299
|
-
|
|
300
|
-
// src/lib/FeedbackForm.tsx
|
|
40
|
+
var import_mui_icon = require("@availity/mui-icon");
|
|
41
|
+
var import_mui_form_utils = require("@availity/mui-form-utils");
|
|
301
42
|
var import_api_axios = require("@availity/api-axios");
|
|
302
43
|
var import_react_hook_form = require("react-hook-form");
|
|
303
44
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
304
|
-
var SmileButtons = (0,
|
|
45
|
+
var SmileButtons = (0, import_material.styled)(import_mui_toggle_button.ToggleButtonGroup, { name: "AvFeedbackContainer", slot: "SmileButtons" })({});
|
|
305
46
|
var SmileButton = ({ disabled, Icon, label, value, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
306
47
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_toggle_button.ToggleButton, {
|
|
307
48
|
"aria-label": value,
|
|
@@ -352,7 +93,7 @@ var FeedbackForm = ({
|
|
|
352
93
|
setLoading(false);
|
|
353
94
|
}
|
|
354
95
|
};
|
|
355
|
-
(0,
|
|
96
|
+
(0, import_react.useEffect)(() => {
|
|
356
97
|
if (sent) {
|
|
357
98
|
setTimeout(() => {
|
|
358
99
|
handleClose();
|
|
@@ -361,16 +102,16 @@ var FeedbackForm = ({
|
|
|
361
102
|
}, [sent]);
|
|
362
103
|
const options = [
|
|
363
104
|
{
|
|
364
|
-
Icon:
|
|
105
|
+
Icon: import_mui_icon.FaceSmileIcon,
|
|
365
106
|
label: "What do you like?",
|
|
366
107
|
value: "smile"
|
|
367
108
|
},
|
|
368
109
|
{
|
|
369
|
-
Icon:
|
|
110
|
+
Icon: import_mui_icon.FaceNeutralIcon,
|
|
370
111
|
label: "What would you improve?",
|
|
371
112
|
value: "meh"
|
|
372
113
|
},
|
|
373
|
-
{ Icon:
|
|
114
|
+
{ Icon: import_mui_icon.FaceFrownIcon, label: "What don't you like?", value: "frown" }
|
|
374
115
|
];
|
|
375
116
|
const getFeedbackLabel = () => {
|
|
376
117
|
const smile = watch("smileField");
|
|
@@ -378,7 +119,7 @@ var FeedbackForm = ({
|
|
|
378
119
|
return (option == null ? void 0 : option.label) || "What would you improve?";
|
|
379
120
|
};
|
|
380
121
|
if (!sent) {
|
|
381
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
122
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_material.Grid, {
|
|
382
123
|
component: "form",
|
|
383
124
|
container: true,
|
|
384
125
|
justifyContent: "center",
|
|
@@ -418,23 +159,23 @@ var FeedbackForm = ({
|
|
|
418
159
|
label: getFeedbackLabel(),
|
|
419
160
|
inputProps: { "aria-required": "true" },
|
|
420
161
|
InputLabelProps: {
|
|
421
|
-
component: FormLabel,
|
|
162
|
+
component: import_mui_form_utils.FormLabel,
|
|
422
163
|
required: true
|
|
423
164
|
},
|
|
424
165
|
helperText: ((_a = errors.feedback) == null ? void 0 : _a.message) || "Max 200 characters",
|
|
425
166
|
error: !!errors.feedback,
|
|
426
167
|
disabled: loading
|
|
427
168
|
}),
|
|
428
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
169
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_material.Grid, {
|
|
429
170
|
container: true,
|
|
430
171
|
direction: "row",
|
|
431
172
|
marginTop: "16px",
|
|
432
173
|
spacing: 1,
|
|
433
174
|
children: [
|
|
434
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
175
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Grid, {
|
|
435
176
|
item: true,
|
|
436
177
|
xs: 6,
|
|
437
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
178
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_button.Button, {
|
|
438
179
|
color: "secondary",
|
|
439
180
|
disabled: loading,
|
|
440
181
|
fullWidth: true,
|
|
@@ -442,10 +183,10 @@ var FeedbackForm = ({
|
|
|
442
183
|
children: "Cancel"
|
|
443
184
|
})
|
|
444
185
|
}),
|
|
445
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
186
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Grid, {
|
|
446
187
|
item: true,
|
|
447
188
|
xs: 6,
|
|
448
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
189
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_button.LoadingButton, {
|
|
449
190
|
disabled: !watch("smileField"),
|
|
450
191
|
fullWidth: true,
|
|
451
192
|
loading,
|
|
@@ -464,28 +205,13 @@ var FeedbackForm = ({
|
|
|
464
205
|
};
|
|
465
206
|
|
|
466
207
|
// src/lib/FeedbackHeader.tsx
|
|
467
|
-
var
|
|
468
|
-
var
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
var import_react4 = require("react");
|
|
472
|
-
var import_material4 = require("@mui/material");
|
|
473
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
474
|
-
var Typography = (0, import_react4.forwardRef)(
|
|
475
|
-
({ children, ...rest }, ref) => {
|
|
476
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material4.Typography, {
|
|
477
|
-
...rest,
|
|
478
|
-
ref,
|
|
479
|
-
children
|
|
480
|
-
});
|
|
481
|
-
}
|
|
482
|
-
);
|
|
483
|
-
|
|
484
|
-
// src/lib/FeedbackHeader.tsx
|
|
485
|
-
var import_material5 = require("@mui/material");
|
|
208
|
+
var import_mui_button2 = require("@availity/mui-button");
|
|
209
|
+
var import_mui_icon2 = require("@availity/mui-icon");
|
|
210
|
+
var import_mui_typography = require("@availity/mui-typography");
|
|
211
|
+
var import_material2 = require("@mui/material");
|
|
486
212
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
487
213
|
var FeedbackHeader = ({ appName, handleClose, loading, sent }) => {
|
|
488
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
214
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_material2.Grid, {
|
|
489
215
|
alignItems: "center",
|
|
490
216
|
container: true,
|
|
491
217
|
direction: "row",
|
|
@@ -494,23 +220,23 @@ var FeedbackHeader = ({ appName, handleClose, loading, sent }) => {
|
|
|
494
220
|
flexWrap: "nowrap",
|
|
495
221
|
id: "feedback-form-header",
|
|
496
222
|
children: [
|
|
497
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
223
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material2.Grid, {
|
|
498
224
|
item: true,
|
|
499
225
|
whiteSpace: "normal",
|
|
500
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Typography, {
|
|
226
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_typography.Typography, {
|
|
501
227
|
component: "h2",
|
|
502
228
|
variant: "h5",
|
|
503
229
|
children: sent ? "Thank you for your feedback." : `Tell us what you think about ${appName}`
|
|
504
230
|
})
|
|
505
231
|
}),
|
|
506
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
232
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material2.Grid, {
|
|
507
233
|
item: true,
|
|
508
234
|
marginRight: "-8px",
|
|
509
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
235
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_button2.IconButton, {
|
|
510
236
|
disabled: loading,
|
|
511
237
|
title: "Close",
|
|
512
238
|
onClick: handleClose,
|
|
513
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
239
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_icon2.CloseIcon, {})
|
|
514
240
|
})
|
|
515
241
|
})
|
|
516
242
|
]
|
|
@@ -519,11 +245,11 @@ var FeedbackHeader = ({ appName, handleClose, loading, sent }) => {
|
|
|
519
245
|
|
|
520
246
|
// src/lib/Feedback.tsx
|
|
521
247
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
522
|
-
var FeedbackContainer = (0,
|
|
248
|
+
var FeedbackContainer = (0, import_material3.styled)(import_material3.Container, { name: "AvFeedbackContainer", slot: "root" })({});
|
|
523
249
|
var Feedback = ({ analytics = import_api_axios2.avLogMessagesApi, appName }) => {
|
|
524
|
-
const [anchorEl, setAnchorEl] = (0,
|
|
525
|
-
const [sent, setSent] = (0,
|
|
526
|
-
const [loading, setLoading] = (0,
|
|
250
|
+
const [anchorEl, setAnchorEl] = (0, import_react2.useState)(null);
|
|
251
|
+
const [sent, setSent] = (0, import_react2.useState)(false);
|
|
252
|
+
const [loading, setLoading] = (0, import_react2.useState)(false);
|
|
527
253
|
const handlePopoverOpen = (event) => {
|
|
528
254
|
setAnchorEl(event.currentTarget);
|
|
529
255
|
};
|
|
@@ -533,7 +259,7 @@ var Feedback = ({ analytics = import_api_axios2.avLogMessagesApi, appName }) =>
|
|
|
533
259
|
const open = Boolean(anchorEl);
|
|
534
260
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
|
|
535
261
|
children: [
|
|
536
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
262
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_button3.Button, {
|
|
537
263
|
onClick: handlePopoverOpen,
|
|
538
264
|
color: "secondary",
|
|
539
265
|
size: "large",
|
package/dist/index.mjs
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { useState } from "react";
|
|
3
3
|
import { Popover } from "@availity/mui-popover";
|
|
4
4
|
import { Button as Button2 } from "@availity/mui-button";
|
|
5
|
-
import { Container, styled as
|
|
5
|
+
import { Container, styled as styled2 } from "@mui/material";
|
|
6
6
|
import { avLogMessagesApi } from "@availity/api-axios";
|
|
7
7
|
|
|
8
8
|
// src/lib/FeedbackForm.tsx
|
|
@@ -10,276 +10,20 @@ import { useEffect } from "react";
|
|
|
10
10
|
import { TextField } from "@availity/mui-textfield";
|
|
11
11
|
import { LoadingButton, Button } from "@availity/mui-button";
|
|
12
12
|
import { ToggleButtonGroup, ToggleButton } from "@availity/mui-toggle-button";
|
|
13
|
-
import { Grid, styled
|
|
13
|
+
import { Grid, styled } from "@mui/material";
|
|
14
14
|
import { FaceFrownIcon, FaceNeutralIcon, FaceSmileIcon } from "@availity/mui-icon";
|
|
15
|
-
|
|
16
|
-
// ../../node_modules/@availity/message-core/dist/index.mjs
|
|
17
|
-
var __defProp = Object.defineProperty;
|
|
18
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
19
|
-
var __publicField = (obj, key, value) => {
|
|
20
|
-
__defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
21
|
-
return value;
|
|
22
|
-
};
|
|
23
|
-
var __accessCheck = (obj, member, msg) => {
|
|
24
|
-
if (!member.has(obj))
|
|
25
|
-
throw TypeError("Cannot " + msg);
|
|
26
|
-
};
|
|
27
|
-
var __privateGet = (obj, member, getter) => {
|
|
28
|
-
__accessCheck(obj, member, "read from private field");
|
|
29
|
-
return getter ? getter.call(obj) : member.get(obj);
|
|
30
|
-
};
|
|
31
|
-
var __privateAdd = (obj, member, value) => {
|
|
32
|
-
if (member.has(obj))
|
|
33
|
-
throw TypeError("Cannot add the same private member more than once");
|
|
34
|
-
member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
|
|
35
|
-
};
|
|
36
|
-
var __privateSet = (obj, member, value, setter) => {
|
|
37
|
-
__accessCheck(obj, member, "write to private field");
|
|
38
|
-
setter ? setter.call(obj, value) : member.set(obj, value);
|
|
39
|
-
return value;
|
|
40
|
-
};
|
|
41
|
-
var _lastId;
|
|
42
|
-
var AvMessage = class {
|
|
43
|
-
constructor() {
|
|
44
|
-
__publicField(this, "subscribers", {});
|
|
45
|
-
__publicField(this, "getEventData", (event) => {
|
|
46
|
-
const isSameWindow = event.source === window;
|
|
47
|
-
if (!this.isEnabled || !event || !event.data || !event.origin || !event.source || !this.isDomain(event.origin)) {
|
|
48
|
-
return;
|
|
49
|
-
}
|
|
50
|
-
let { data } = event;
|
|
51
|
-
if (typeof data === "string") {
|
|
52
|
-
try {
|
|
53
|
-
data = JSON.parse(data);
|
|
54
|
-
} catch {
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
if (typeof data === "string") {
|
|
58
|
-
event = data;
|
|
59
|
-
data = void 0;
|
|
60
|
-
} else {
|
|
61
|
-
event = data && data.event || this.DEFAULT_EVENT;
|
|
62
|
-
}
|
|
63
|
-
const metadata = { isSameWindow };
|
|
64
|
-
this.onMessage(event, data, metadata);
|
|
65
|
-
});
|
|
66
|
-
__privateAdd(this, _lastId, 0);
|
|
67
|
-
this.isEnabled = true;
|
|
68
|
-
this.DEFAULT_EVENT = "avMessage";
|
|
69
|
-
this.DOMAIN = /https?:\/\/([\w-]+\.)?availity\.(com|net)/;
|
|
70
|
-
window.addEventListener("message", this.getEventData);
|
|
71
|
-
}
|
|
72
|
-
enabled(value) {
|
|
73
|
-
if (arguments.length > 0) {
|
|
74
|
-
this.isEnabled = !!value;
|
|
75
|
-
}
|
|
76
|
-
return this.isEnabled;
|
|
77
|
-
}
|
|
78
|
-
subscribe(event, callback, options) {
|
|
79
|
-
var _a;
|
|
80
|
-
if (!this.subscribers[event]) {
|
|
81
|
-
this.subscribers[event] = [];
|
|
82
|
-
}
|
|
83
|
-
__privateSet(this, _lastId, __privateGet(this, _lastId) + 1);
|
|
84
|
-
const id = __privateGet(this, _lastId);
|
|
85
|
-
const ignoreSameWindow = (_a = options == null ? void 0 : options.ignoreSameWindow) != null ? _a : true;
|
|
86
|
-
const subscriber = { id, callback, options: { ignoreSameWindow } };
|
|
87
|
-
this.subscribers[event].push(subscriber);
|
|
88
|
-
return () => {
|
|
89
|
-
this.subscribers[event] = this.subscribers[event].filter((subscriber2) => subscriber2.id !== id);
|
|
90
|
-
};
|
|
91
|
-
}
|
|
92
|
-
unsubscribe(event) {
|
|
93
|
-
delete this.subscribers[event];
|
|
94
|
-
}
|
|
95
|
-
unsubscribeAll() {
|
|
96
|
-
this.subscribers = {};
|
|
97
|
-
}
|
|
98
|
-
onMessage(event, data, metadata) {
|
|
99
|
-
const { isSameWindow } = metadata;
|
|
100
|
-
if (this.subscribers[event]) {
|
|
101
|
-
for (const subscriber of this.subscribers[event]) {
|
|
102
|
-
const { ignoreSameWindow } = subscriber.options;
|
|
103
|
-
const skip = isSameWindow && ignoreSameWindow;
|
|
104
|
-
if (!skip) {
|
|
105
|
-
subscriber.callback(data);
|
|
106
|
-
}
|
|
107
|
-
}
|
|
108
|
-
}
|
|
109
|
-
}
|
|
110
|
-
isDomain(url) {
|
|
111
|
-
return !this.DOMAIN.test(this.domain()) || this.DOMAIN.test(url);
|
|
112
|
-
}
|
|
113
|
-
domain() {
|
|
114
|
-
if (window.location.origin) {
|
|
115
|
-
return window.location.origin;
|
|
116
|
-
}
|
|
117
|
-
if (window.location.hostname) {
|
|
118
|
-
return `${window.location.protocol}//${window.location.hostname}${window.location.port ? `:${window.location.port}` : ""}`;
|
|
119
|
-
}
|
|
120
|
-
return "*";
|
|
121
|
-
}
|
|
122
|
-
send(payload, target = window.top) {
|
|
123
|
-
if (!this.isEnabled || !payload) {
|
|
124
|
-
return;
|
|
125
|
-
}
|
|
126
|
-
try {
|
|
127
|
-
const message = typeof payload === "string" ? payload : JSON.stringify(payload);
|
|
128
|
-
target.postMessage(message, this.domain());
|
|
129
|
-
} catch (error) {
|
|
130
|
-
console.warn("AvMessage.send()", error);
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
|
-
};
|
|
134
|
-
_lastId = /* @__PURE__ */ new WeakMap();
|
|
135
|
-
var AvMessage_default = AvMessage;
|
|
136
|
-
var src_default = new AvMessage_default();
|
|
137
|
-
|
|
138
|
-
// ../form-utils/src/lib/FieldHelpIcon.tsx
|
|
139
|
-
import { HelpCircleIcon } from "@availity/mui-icon";
|
|
140
|
-
import { IconButton } from "@availity/mui-button";
|
|
141
|
-
import { jsx } from "react/jsx-runtime";
|
|
142
|
-
var triggerFieldHelp = (id) => {
|
|
143
|
-
src_default.send({
|
|
144
|
-
event: "nav:help:field",
|
|
145
|
-
id
|
|
146
|
-
});
|
|
147
|
-
};
|
|
148
|
-
var FieldHelpIcon = ({ helpTopicId, labelId, sx, ...rest }) => {
|
|
149
|
-
return /* @__PURE__ */ jsx(IconButton, {
|
|
150
|
-
...rest,
|
|
151
|
-
color: "primary",
|
|
152
|
-
title: "Help",
|
|
153
|
-
role: "link",
|
|
154
|
-
onClick: () => triggerFieldHelp(helpTopicId),
|
|
155
|
-
"aria-describedby": labelId,
|
|
156
|
-
size: "small",
|
|
157
|
-
sx: { ...sx, padding: 0.5, fontSize: "inherit", marginTop: "-2px", opacity: 1 },
|
|
158
|
-
children: /* @__PURE__ */ jsx(HelpCircleIcon, {
|
|
159
|
-
"aria-hidden": true,
|
|
160
|
-
titleAccess: void 0
|
|
161
|
-
})
|
|
162
|
-
});
|
|
163
|
-
};
|
|
164
|
-
|
|
165
|
-
// ../form-utils/src/lib/FormControlLabel.tsx
|
|
166
|
-
import { forwardRef } from "react";
|
|
167
|
-
import {
|
|
168
|
-
Box,
|
|
169
|
-
FormControlLabel as MuiFormControlLabel
|
|
170
|
-
} from "@mui/material";
|
|
171
|
-
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
172
|
-
var FormControlLabel = forwardRef(({ helpTopicId, id, ...rest }, ref) => {
|
|
173
|
-
const labelId = id || (rest.htmlFor ? `${rest.htmlFor}-label` : void 0);
|
|
174
|
-
return /* @__PURE__ */ jsxs(Box, {
|
|
175
|
-
children: [
|
|
176
|
-
/* @__PURE__ */ jsx2(MuiFormControlLabel, {
|
|
177
|
-
id: labelId,
|
|
178
|
-
...rest,
|
|
179
|
-
ref
|
|
180
|
-
}),
|
|
181
|
-
helpTopicId ? /* @__PURE__ */ jsx2(FieldHelpIcon, {
|
|
182
|
-
helpTopicId: "12345",
|
|
183
|
-
labelId
|
|
184
|
-
}) : null
|
|
185
|
-
]
|
|
186
|
-
});
|
|
187
|
-
});
|
|
188
|
-
|
|
189
|
-
// ../form-utils/src/lib/FormHelperText.tsx
|
|
190
|
-
import MuiFormHelperText from "@mui/material/FormHelperText";
|
|
191
|
-
import { WarningTriangleIcon } from "@availity/mui-icon";
|
|
192
|
-
import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
193
|
-
|
|
194
|
-
// ../form-utils/src/lib/FormLabel.tsx
|
|
195
|
-
import { forwardRef as forwardRef2 } from "react";
|
|
196
|
-
import { Box as Box2, FormLabel as MuiFormLabel, styled } from "@mui/material";
|
|
197
|
-
import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
198
|
-
var Children = styled("span", {
|
|
199
|
-
name: "MuiFormLabel",
|
|
200
|
-
slot: "Children",
|
|
201
|
-
overridesResolver: (props, styles) => styles.children
|
|
202
|
-
})({});
|
|
203
|
-
var StyleOverrides = {
|
|
204
|
-
position: "relative !important",
|
|
205
|
-
transform: "none !important",
|
|
206
|
-
transition: "none !important",
|
|
207
|
-
animation: "none !important"
|
|
208
|
-
};
|
|
209
|
-
var FormLabel = forwardRef2((props, ref) => {
|
|
210
|
-
const { children, helpTopicId, id, sx, ...rest } = props;
|
|
211
|
-
const labelId = id || (rest.htmlFor ? `${rest.htmlFor}-label` : void 0);
|
|
212
|
-
return /* @__PURE__ */ jsxs3(Box2, {
|
|
213
|
-
display: "flex",
|
|
214
|
-
flexDirection: "row",
|
|
215
|
-
sx,
|
|
216
|
-
children: [
|
|
217
|
-
/* @__PURE__ */ jsx4(MuiFormLabel, {
|
|
218
|
-
id: labelId,
|
|
219
|
-
sx: { ...StyleOverrides },
|
|
220
|
-
...rest,
|
|
221
|
-
ref,
|
|
222
|
-
children: /* @__PURE__ */ jsx4(Children, {
|
|
223
|
-
className: "MuiFormLabel-children",
|
|
224
|
-
children
|
|
225
|
-
})
|
|
226
|
-
}),
|
|
227
|
-
helpTopicId ? /* @__PURE__ */ jsx4(FieldHelpIcon, {
|
|
228
|
-
helpTopicId,
|
|
229
|
-
labelId,
|
|
230
|
-
sx: { px: 0.5 }
|
|
231
|
-
}) : null
|
|
232
|
-
]
|
|
233
|
-
});
|
|
234
|
-
});
|
|
235
|
-
|
|
236
|
-
// ../form-utils/src/lib/Input.tsx
|
|
237
|
-
import MuiInput from "@mui/material/OutlinedInput";
|
|
238
|
-
import InputAdornment from "@mui/material/InputAdornment";
|
|
239
|
-
import { jsx as jsx5 } from "react/jsx-runtime";
|
|
240
|
-
var InputPropOverrides = {
|
|
241
|
-
notched: false
|
|
242
|
-
};
|
|
243
|
-
|
|
244
|
-
// ../form-utils/src/lib/Select.tsx
|
|
245
|
-
import MuiSelect from "@mui/material/Select";
|
|
246
|
-
import Divider from "@mui/material/Divider";
|
|
247
|
-
import Stack from "@mui/material/Stack";
|
|
248
|
-
import { ExpandIcon } from "@availity/mui-icon";
|
|
249
|
-
import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
250
|
-
var InnerEndAdornment = (args) => /* @__PURE__ */ jsxs4(Stack, {
|
|
251
|
-
...args,
|
|
252
|
-
direction: "row",
|
|
253
|
-
spacing: 1,
|
|
254
|
-
height: "100%",
|
|
255
|
-
paddingY: ".5rem",
|
|
256
|
-
top: "unset!important",
|
|
257
|
-
children: [
|
|
258
|
-
/* @__PURE__ */ jsx6(Divider, {
|
|
259
|
-
orientation: "vertical"
|
|
260
|
-
}),
|
|
261
|
-
/* @__PURE__ */ jsx6(ExpandIcon, {
|
|
262
|
-
sx: { position: "relative", top: "calc(50% - .5rem)" }
|
|
263
|
-
})
|
|
264
|
-
]
|
|
265
|
-
});
|
|
266
|
-
var SelectPropOverrides = {
|
|
267
|
-
IconComponent: InnerEndAdornment,
|
|
268
|
-
...InputPropOverrides
|
|
269
|
-
};
|
|
270
|
-
|
|
271
|
-
// src/lib/FeedbackForm.tsx
|
|
15
|
+
import { FormLabel } from "@availity/mui-form-utils";
|
|
272
16
|
import { avRegionsApi } from "@availity/api-axios";
|
|
273
17
|
import { useForm, Controller } from "react-hook-form";
|
|
274
|
-
import { jsx
|
|
275
|
-
var SmileButtons =
|
|
276
|
-
var SmileButton = ({ disabled, Icon, label, value, ...props }) => /* @__PURE__ */
|
|
277
|
-
children: /* @__PURE__ */
|
|
18
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
19
|
+
var SmileButtons = styled(ToggleButtonGroup, { name: "AvFeedbackContainer", slot: "SmileButtons" })({});
|
|
20
|
+
var SmileButton = ({ disabled, Icon, label, value, ...props }) => /* @__PURE__ */ jsx("div", {
|
|
21
|
+
children: /* @__PURE__ */ jsx(ToggleButton, {
|
|
278
22
|
"aria-label": value,
|
|
279
23
|
value,
|
|
280
24
|
...props,
|
|
281
25
|
disabled,
|
|
282
|
-
children: /* @__PURE__ */
|
|
26
|
+
children: /* @__PURE__ */ jsx(Icon, {
|
|
283
27
|
fontSize: "large"
|
|
284
28
|
})
|
|
285
29
|
})
|
|
@@ -349,7 +93,7 @@ var FeedbackForm = ({
|
|
|
349
93
|
return (option == null ? void 0 : option.label) || "What would you improve?";
|
|
350
94
|
};
|
|
351
95
|
if (!sent) {
|
|
352
|
-
return /* @__PURE__ */
|
|
96
|
+
return /* @__PURE__ */ jsxs(Grid, {
|
|
353
97
|
component: "form",
|
|
354
98
|
container: true,
|
|
355
99
|
justifyContent: "center",
|
|
@@ -357,12 +101,12 @@ var FeedbackForm = ({
|
|
|
357
101
|
"aria-label": "Feedback Form",
|
|
358
102
|
"aria-describedby": "feedback-form-header",
|
|
359
103
|
children: [
|
|
360
|
-
/* @__PURE__ */
|
|
104
|
+
/* @__PURE__ */ jsx(Controller, {
|
|
361
105
|
control,
|
|
362
106
|
name: "smileField",
|
|
363
107
|
render: ({ field }) => {
|
|
364
|
-
return /* @__PURE__ */
|
|
365
|
-
children: options.map((props, index) => /* @__PURE__ */
|
|
108
|
+
return /* @__PURE__ */ jsx(SmileButtons, {
|
|
109
|
+
children: options.map((props, index) => /* @__PURE__ */ jsx(SmileButton, {
|
|
366
110
|
autoFocus: index === 0,
|
|
367
111
|
disabled: loading,
|
|
368
112
|
...props
|
|
@@ -377,7 +121,7 @@ var FeedbackForm = ({
|
|
|
377
121
|
});
|
|
378
122
|
}
|
|
379
123
|
}),
|
|
380
|
-
/* @__PURE__ */
|
|
124
|
+
/* @__PURE__ */ jsx(TextField, {
|
|
381
125
|
...register("feedback", {
|
|
382
126
|
required: "This field is required",
|
|
383
127
|
maxLength: { value: 200, message: "This field must not exceed 200 characters" }
|
|
@@ -396,16 +140,16 @@ var FeedbackForm = ({
|
|
|
396
140
|
error: !!errors.feedback,
|
|
397
141
|
disabled: loading
|
|
398
142
|
}),
|
|
399
|
-
/* @__PURE__ */
|
|
143
|
+
/* @__PURE__ */ jsxs(Grid, {
|
|
400
144
|
container: true,
|
|
401
145
|
direction: "row",
|
|
402
146
|
marginTop: "16px",
|
|
403
147
|
spacing: 1,
|
|
404
148
|
children: [
|
|
405
|
-
/* @__PURE__ */
|
|
149
|
+
/* @__PURE__ */ jsx(Grid, {
|
|
406
150
|
item: true,
|
|
407
151
|
xs: 6,
|
|
408
|
-
children: /* @__PURE__ */
|
|
152
|
+
children: /* @__PURE__ */ jsx(Button, {
|
|
409
153
|
color: "secondary",
|
|
410
154
|
disabled: loading,
|
|
411
155
|
fullWidth: true,
|
|
@@ -413,10 +157,10 @@ var FeedbackForm = ({
|
|
|
413
157
|
children: "Cancel"
|
|
414
158
|
})
|
|
415
159
|
}),
|
|
416
|
-
/* @__PURE__ */
|
|
160
|
+
/* @__PURE__ */ jsx(Grid, {
|
|
417
161
|
item: true,
|
|
418
162
|
xs: 6,
|
|
419
|
-
children: /* @__PURE__ */
|
|
163
|
+
children: /* @__PURE__ */ jsx(LoadingButton, {
|
|
420
164
|
disabled: !watch("smileField"),
|
|
421
165
|
fullWidth: true,
|
|
422
166
|
loading,
|
|
@@ -435,28 +179,13 @@ var FeedbackForm = ({
|
|
|
435
179
|
};
|
|
436
180
|
|
|
437
181
|
// src/lib/FeedbackHeader.tsx
|
|
438
|
-
import { IconButton
|
|
182
|
+
import { IconButton } from "@availity/mui-button";
|
|
439
183
|
import { CloseIcon } from "@availity/mui-icon";
|
|
440
|
-
|
|
441
|
-
// ../typography/src/lib/Typography.tsx
|
|
442
|
-
import { forwardRef as forwardRef3 } from "react";
|
|
443
|
-
import { Typography as MuiTypography } from "@mui/material";
|
|
444
|
-
import { jsx as jsx8 } from "react/jsx-runtime";
|
|
445
|
-
var Typography = forwardRef3(
|
|
446
|
-
({ children, ...rest }, ref) => {
|
|
447
|
-
return /* @__PURE__ */ jsx8(MuiTypography, {
|
|
448
|
-
...rest,
|
|
449
|
-
ref,
|
|
450
|
-
children
|
|
451
|
-
});
|
|
452
|
-
}
|
|
453
|
-
);
|
|
454
|
-
|
|
455
|
-
// src/lib/FeedbackHeader.tsx
|
|
184
|
+
import { Typography } from "@availity/mui-typography";
|
|
456
185
|
import { Grid as Grid2 } from "@mui/material";
|
|
457
|
-
import { jsx as
|
|
186
|
+
import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
458
187
|
var FeedbackHeader = ({ appName, handleClose, loading, sent }) => {
|
|
459
|
-
return /* @__PURE__ */
|
|
188
|
+
return /* @__PURE__ */ jsxs2(Grid2, {
|
|
460
189
|
alignItems: "center",
|
|
461
190
|
container: true,
|
|
462
191
|
direction: "row",
|
|
@@ -465,23 +194,23 @@ var FeedbackHeader = ({ appName, handleClose, loading, sent }) => {
|
|
|
465
194
|
flexWrap: "nowrap",
|
|
466
195
|
id: "feedback-form-header",
|
|
467
196
|
children: [
|
|
468
|
-
/* @__PURE__ */
|
|
197
|
+
/* @__PURE__ */ jsx2(Grid2, {
|
|
469
198
|
item: true,
|
|
470
199
|
whiteSpace: "normal",
|
|
471
|
-
children: /* @__PURE__ */
|
|
200
|
+
children: /* @__PURE__ */ jsx2(Typography, {
|
|
472
201
|
component: "h2",
|
|
473
202
|
variant: "h5",
|
|
474
203
|
children: sent ? "Thank you for your feedback." : `Tell us what you think about ${appName}`
|
|
475
204
|
})
|
|
476
205
|
}),
|
|
477
|
-
/* @__PURE__ */
|
|
206
|
+
/* @__PURE__ */ jsx2(Grid2, {
|
|
478
207
|
item: true,
|
|
479
208
|
marginRight: "-8px",
|
|
480
|
-
children: /* @__PURE__ */
|
|
209
|
+
children: /* @__PURE__ */ jsx2(IconButton, {
|
|
481
210
|
disabled: loading,
|
|
482
211
|
title: "Close",
|
|
483
212
|
onClick: handleClose,
|
|
484
|
-
children: /* @__PURE__ */
|
|
213
|
+
children: /* @__PURE__ */ jsx2(CloseIcon, {})
|
|
485
214
|
})
|
|
486
215
|
})
|
|
487
216
|
]
|
|
@@ -489,8 +218,8 @@ var FeedbackHeader = ({ appName, handleClose, loading, sent }) => {
|
|
|
489
218
|
};
|
|
490
219
|
|
|
491
220
|
// src/lib/Feedback.tsx
|
|
492
|
-
import { Fragment, jsx as
|
|
493
|
-
var FeedbackContainer =
|
|
221
|
+
import { Fragment, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
222
|
+
var FeedbackContainer = styled2(Container, { name: "AvFeedbackContainer", slot: "root" })({});
|
|
494
223
|
var Feedback = ({ analytics = avLogMessagesApi, appName }) => {
|
|
495
224
|
const [anchorEl, setAnchorEl] = useState(null);
|
|
496
225
|
const [sent, setSent] = useState(false);
|
|
@@ -502,15 +231,15 @@ var Feedback = ({ analytics = avLogMessagesApi, appName }) => {
|
|
|
502
231
|
setAnchorEl(null);
|
|
503
232
|
};
|
|
504
233
|
const open = Boolean(anchorEl);
|
|
505
|
-
return /* @__PURE__ */
|
|
234
|
+
return /* @__PURE__ */ jsxs3(Fragment, {
|
|
506
235
|
children: [
|
|
507
|
-
/* @__PURE__ */
|
|
236
|
+
/* @__PURE__ */ jsx3(Button2, {
|
|
508
237
|
onClick: handlePopoverOpen,
|
|
509
238
|
color: "secondary",
|
|
510
239
|
size: "large",
|
|
511
240
|
children: "Give Feedback"
|
|
512
241
|
}),
|
|
513
|
-
/* @__PURE__ */
|
|
242
|
+
/* @__PURE__ */ jsx3(Popover, {
|
|
514
243
|
anchorEl,
|
|
515
244
|
anchorOrigin: {
|
|
516
245
|
vertical: "bottom",
|
|
@@ -524,15 +253,15 @@ var Feedback = ({ analytics = avLogMessagesApi, appName }) => {
|
|
|
524
253
|
vertical: "top",
|
|
525
254
|
horizontal: "right"
|
|
526
255
|
},
|
|
527
|
-
children: /* @__PURE__ */
|
|
256
|
+
children: /* @__PURE__ */ jsxs3(FeedbackContainer, {
|
|
528
257
|
children: [
|
|
529
|
-
/* @__PURE__ */
|
|
258
|
+
/* @__PURE__ */ jsx3(FeedbackHeader, {
|
|
530
259
|
appName,
|
|
531
260
|
handleClose: handlePopoverClose,
|
|
532
261
|
loading,
|
|
533
262
|
sent
|
|
534
263
|
}),
|
|
535
|
-
/* @__PURE__ */
|
|
264
|
+
/* @__PURE__ */ jsx3(FeedbackForm, {
|
|
536
265
|
analytics,
|
|
537
266
|
appName,
|
|
538
267
|
handleClose: handlePopoverClose,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@availity/mui-feedback",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.2",
|
|
4
4
|
"description": "Availity MUI Feedback Component - part of the @availity/element design system",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react",
|
|
@@ -48,10 +48,12 @@
|
|
|
48
48
|
"dependencies": {
|
|
49
49
|
"@availity/api-axios": "^8.0.3",
|
|
50
50
|
"@availity/mui-button": "^0.5.1",
|
|
51
|
+
"@availity/mui-form-utils": "^0.5.4",
|
|
51
52
|
"@availity/mui-icon": "^0.7.3",
|
|
52
53
|
"@availity/mui-popover": "^0.1.1",
|
|
53
54
|
"@availity/mui-textfield": "^0.3.3",
|
|
54
|
-
"@availity/mui-toggle-button": "^0.1.
|
|
55
|
+
"@availity/mui-toggle-button": "^0.1.7",
|
|
56
|
+
"@availity/mui-typography": "^0.1.5",
|
|
55
57
|
"react-hook-form": "^7.48.2"
|
|
56
58
|
}
|
|
57
59
|
}
|