@diegotsi/flint-react 2.2.0 → 2.4.1
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/dist/index.cjs +24 -80
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +2 -4
- package/dist/index.d.ts +2 -4
- package/dist/index.js +21 -64
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/dist/index.cjs
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,27 +15,19 @@ 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
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
-
mod
|
|
27
|
-
));
|
|
28
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
19
|
|
|
30
20
|
// src/index.ts
|
|
31
21
|
var index_exports = {};
|
|
32
22
|
__export(index_exports, {
|
|
33
|
-
Flint: () =>
|
|
23
|
+
Flint: () => import_flint_core6.Flint,
|
|
34
24
|
FlintModal: () => FlintModal,
|
|
35
|
-
FlintWidget: () => FlintWidget
|
|
36
|
-
flint: () => import_flint_core5.flint
|
|
25
|
+
FlintWidget: () => FlintWidget
|
|
37
26
|
});
|
|
38
27
|
module.exports = __toCommonJS(index_exports);
|
|
39
28
|
|
|
40
29
|
// src/FlintModal.tsx
|
|
30
|
+
var import_flint_core3 = require("@diegotsi/flint-core");
|
|
41
31
|
var import_react2 = require("react");
|
|
42
32
|
var import_react_i18next = require("react-i18next");
|
|
43
33
|
|
|
@@ -235,8 +225,6 @@ function injectKeyframes() {
|
|
|
235
225
|
document.head.appendChild(s);
|
|
236
226
|
}
|
|
237
227
|
function FlintModal({
|
|
238
|
-
projectKey,
|
|
239
|
-
serverUrl,
|
|
240
228
|
user,
|
|
241
229
|
meta,
|
|
242
230
|
theme,
|
|
@@ -256,6 +244,8 @@ function FlintModal({
|
|
|
256
244
|
onSuccess,
|
|
257
245
|
onError
|
|
258
246
|
}) {
|
|
247
|
+
const config = import_flint_core3.Flint.getConfig();
|
|
248
|
+
const { projectKey, serverUrl } = config;
|
|
259
249
|
const { t } = (0, import_react_i18next.useTranslation)();
|
|
260
250
|
const colors = (0, import_flint_core2.resolveTheme)(theme);
|
|
261
251
|
const isDark = theme === "dark";
|
|
@@ -1182,12 +1172,12 @@ function CheckIcon({ size = 20 }) {
|
|
|
1182
1172
|
}
|
|
1183
1173
|
|
|
1184
1174
|
// src/FlintWidget.tsx
|
|
1185
|
-
var
|
|
1175
|
+
var import_flint_core7 = require("@diegotsi/flint-core");
|
|
1186
1176
|
var import_react4 = require("react");
|
|
1187
1177
|
var import_react_i18next3 = require("react-i18next");
|
|
1188
1178
|
|
|
1189
1179
|
// src/collectors/environment.ts
|
|
1190
|
-
var
|
|
1180
|
+
var import_flint_core4 = require("@diegotsi/flint-core");
|
|
1191
1181
|
|
|
1192
1182
|
// src/i18n/index.ts
|
|
1193
1183
|
var import_i18next = require("i18next");
|
|
@@ -1239,11 +1229,11 @@ widgetI18n.use(import_react_i18next2.initReactI18next).init({
|
|
|
1239
1229
|
var i18n_default = widgetI18n;
|
|
1240
1230
|
|
|
1241
1231
|
// src/store.ts
|
|
1242
|
-
var import_flint_core4 = require("@diegotsi/flint-core");
|
|
1243
|
-
var import_react3 = require("react");
|
|
1244
1232
|
var import_flint_core5 = require("@diegotsi/flint-core");
|
|
1233
|
+
var import_react3 = require("react");
|
|
1234
|
+
var import_flint_core6 = require("@diegotsi/flint-core");
|
|
1245
1235
|
function useFlintStore() {
|
|
1246
|
-
return (0, import_react3.useSyncExternalStore)(
|
|
1236
|
+
return (0, import_react3.useSyncExternalStore)(import_flint_core5.subscribe, import_flint_core5.getSnapshot);
|
|
1247
1237
|
}
|
|
1248
1238
|
|
|
1249
1239
|
// src/FlintWidget.tsx
|
|
@@ -1256,52 +1246,24 @@ function FlintWidget(props) {
|
|
|
1256
1246
|
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_i18next3.I18nextProvider, { i18n: i18n_default, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(WidgetContent, { ...props }) });
|
|
1257
1247
|
}
|
|
1258
1248
|
function WidgetContent({
|
|
1259
|
-
projectKey,
|
|
1260
|
-
serverUrl,
|
|
1261
|
-
user,
|
|
1262
|
-
meta,
|
|
1263
|
-
extraFields,
|
|
1264
1249
|
buttonLabel,
|
|
1265
1250
|
theme = "dark",
|
|
1266
1251
|
zIndex = 9999,
|
|
1267
1252
|
statusPageUrl,
|
|
1268
|
-
datadogSite,
|
|
1269
|
-
enableReplay = true,
|
|
1270
1253
|
enableScreenshot = true,
|
|
1271
|
-
enableConsole = true,
|
|
1272
|
-
enableNetwork = true,
|
|
1273
1254
|
enableTextIssues = true,
|
|
1274
|
-
enableFormErrors = true,
|
|
1275
|
-
enableFrustration = false,
|
|
1276
|
-
autoReportFrustration = false,
|
|
1277
1255
|
onBeforeSubmit,
|
|
1278
1256
|
onSuccess,
|
|
1279
1257
|
onError,
|
|
1280
1258
|
onOpen,
|
|
1281
1259
|
onClose
|
|
1282
1260
|
}) {
|
|
1261
|
+
if (!import_flint_core7.Flint.isInitialized()) {
|
|
1262
|
+
throw new Error("[Flint] Call Flint.init() before mounting <FlintWidget />.");
|
|
1263
|
+
}
|
|
1264
|
+
const config = import_flint_core7.Flint.getConfig();
|
|
1283
1265
|
const globalState = useFlintStore();
|
|
1284
|
-
const resolvedUser = user ??
|
|
1285
|
-
const resolvedSessionReplay = extraFields?.sessionReplay ?? globalState.sessionReplay;
|
|
1286
|
-
const getExternalReplayUrl = () => {
|
|
1287
|
-
const src = resolvedSessionReplay;
|
|
1288
|
-
const explicit = typeof src === "function" ? src() : src;
|
|
1289
|
-
if (explicit) return explicit;
|
|
1290
|
-
if (datadogSite) {
|
|
1291
|
-
try {
|
|
1292
|
-
const ddRum = window.DD_RUM;
|
|
1293
|
-
const ctx = ddRum?.getInternalContext?.();
|
|
1294
|
-
if (ctx?.session_id) {
|
|
1295
|
-
const ts = bugTimestamp.current || Date.now();
|
|
1296
|
-
const fromTs = ts - 3e4;
|
|
1297
|
-
const toTs = ts + 5e3;
|
|
1298
|
-
return `https://${datadogSite}/rum/replay/sessions/${ctx.session_id}?from_ts=${fromTs}&to_ts=${toTs}&tab=replay&live=false`;
|
|
1299
|
-
}
|
|
1300
|
-
} catch {
|
|
1301
|
-
}
|
|
1302
|
-
}
|
|
1303
|
-
return void 0;
|
|
1304
|
-
};
|
|
1266
|
+
const resolvedUser = globalState.user ?? config.user;
|
|
1305
1267
|
const { t } = (0, import_react_i18next3.useTranslation)();
|
|
1306
1268
|
const bugTimestamp = (0, import_react4.useRef)(0);
|
|
1307
1269
|
const [open, setOpen] = (0, import_react4.useState)(false);
|
|
@@ -1351,26 +1313,11 @@ function WidgetContent({
|
|
|
1351
1313
|
setOpen(true);
|
|
1352
1314
|
onOpen?.();
|
|
1353
1315
|
};
|
|
1354
|
-
const
|
|
1355
|
-
if (!
|
|
1356
|
-
|
|
1357
|
-
serverUrl,
|
|
1358
|
-
projectKey,
|
|
1359
|
-
user,
|
|
1360
|
-
enableConsole,
|
|
1361
|
-
enableNetwork,
|
|
1362
|
-
enableFormErrors,
|
|
1363
|
-
enableFrustration,
|
|
1364
|
-
autoReportFrustration,
|
|
1365
|
-
enableReplay,
|
|
1366
|
-
_replayRecorder: enableReplay ? (emit) => import("rrweb").then(({ record }) => {
|
|
1367
|
-
const stop = record({ emit });
|
|
1368
|
-
return stop ?? void 0;
|
|
1369
|
-
}) : void 0
|
|
1370
|
-
});
|
|
1371
|
-
didAutoInit.current = true;
|
|
1316
|
+
const didInjectReplay = (0, import_react4.useRef)(false);
|
|
1317
|
+
if (!didInjectReplay.current && config.enableReplay && !import_flint_core7.Flint.getInstance()?.stopReplay) {
|
|
1318
|
+
didInjectReplay.current = true;
|
|
1372
1319
|
}
|
|
1373
|
-
const global =
|
|
1320
|
+
const global = import_flint_core7.Flint.getInstance();
|
|
1374
1321
|
const label = buttonLabel ?? t("buttonLabel");
|
|
1375
1322
|
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
|
|
1376
1323
|
/* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
@@ -1457,10 +1404,8 @@ function WidgetContent({
|
|
|
1457
1404
|
open && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
1458
1405
|
FlintModal,
|
|
1459
1406
|
{
|
|
1460
|
-
projectKey,
|
|
1461
|
-
serverUrl,
|
|
1462
1407
|
user: resolvedUser,
|
|
1463
|
-
meta,
|
|
1408
|
+
meta: config.meta,
|
|
1464
1409
|
theme,
|
|
1465
1410
|
zIndex,
|
|
1466
1411
|
onClose: () => {
|
|
@@ -1468,12 +1413,12 @@ function WidgetContent({
|
|
|
1468
1413
|
onClose?.();
|
|
1469
1414
|
pendingSelection.current = "";
|
|
1470
1415
|
},
|
|
1471
|
-
getEnvironment:
|
|
1416
|
+
getEnvironment: import_flint_core4.collectEnvironment,
|
|
1472
1417
|
getConsoleLogs: () => global?.console?.getEntries() ?? [],
|
|
1473
1418
|
getNetworkErrors: () => global?.network?.getEntries() ?? [],
|
|
1474
1419
|
getFormErrors: () => global?.formErrors?.getEntries() ?? [],
|
|
1475
|
-
getReplayEvents: () =>
|
|
1476
|
-
getExternalReplayUrl,
|
|
1420
|
+
getReplayEvents: () => import_flint_core7.Flint.getReplayEvents(),
|
|
1421
|
+
getExternalReplayUrl: () => import_flint_core7.Flint.getExternalReplayUrl(),
|
|
1477
1422
|
initialSelection: pendingSelection.current,
|
|
1478
1423
|
enableScreenshot,
|
|
1479
1424
|
enableTextIssues,
|
|
@@ -1528,7 +1473,6 @@ function SparkIcon2() {
|
|
|
1528
1473
|
0 && (module.exports = {
|
|
1529
1474
|
Flint,
|
|
1530
1475
|
FlintModal,
|
|
1531
|
-
FlintWidget
|
|
1532
|
-
flint
|
|
1476
|
+
FlintWidget
|
|
1533
1477
|
});
|
|
1534
1478
|
//# sourceMappingURL=index.cjs.map
|