@gravity-ui/page-constructor 8.21.2 → 8.22.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 +47 -3
- package/build/cjs/context/analyticsContext/analyticsContext.d.ts +9 -1
- package/build/cjs/context/analyticsContext/analyticsContext.js.map +1 -1
- package/build/cjs/hooks/useAnalytics.d.ts +1 -1
- package/build/cjs/hooks/useAnalytics.js +33 -7
- package/build/cjs/hooks/useAnalytics.js.map +1 -1
- package/build/cjs/models/common.d.ts +1 -0
- package/build/cjs/models/common.js +1 -0
- package/build/cjs/models/common.js.map +1 -1
- package/build/esm/context/analyticsContext/analyticsContext.d.ts +9 -1
- package/build/esm/context/analyticsContext/analyticsContext.js.map +1 -1
- package/build/esm/hooks/useAnalytics.d.ts +1 -1
- package/build/esm/hooks/useAnalytics.js +33 -7
- package/build/esm/hooks/useAnalytics.js.map +1 -1
- package/build/esm/models/common.d.ts +1 -0
- package/build/esm/models/common.js +1 -0
- package/build/esm/models/common.js.map +1 -1
- package/package.json +1 -1
- package/server/models/common.d.ts +1 -0
- package/server/models/common.js +1 -0
package/README.md
CHANGED
|
@@ -375,9 +375,13 @@ You can define environment variables for dev-mode in .env.development file withi
|
|
|
375
375
|
|
|
376
376
|
#### Init
|
|
377
377
|
|
|
378
|
-
To start using
|
|
378
|
+
To start using analytics, pass a handler to the constructor. The handler must be created on the project side. It receives three classes of events:
|
|
379
379
|
|
|
380
|
-
|
|
380
|
+
- **Default events** are generic Page Constructor events generated for button, link, navigation, and control interactions. Set `autoEvents.enabled` to `true` to emit them.
|
|
381
|
+
- **Extended events** are registered events supplied by a composing library. The presence of `autoEvents.extendedEvents` enables them independently of `enabled` and optionally adds a prefix and counter.
|
|
382
|
+
- **Custom events** are supplied by consumers through `analyticsEvents`. The auto-events configuration does not change them.
|
|
383
|
+
|
|
384
|
+
The object form is the preferred configuration:
|
|
381
385
|
|
|
382
386
|
```ts
|
|
383
387
|
function sendEvents(events: MyEventType []) {
|
|
@@ -387,12 +391,51 @@ function sendEvents(events: MyEventType []) {
|
|
|
387
391
|
<PageConstructorProvider
|
|
388
392
|
...
|
|
389
393
|
|
|
390
|
-
analytics={{
|
|
394
|
+
analytics={{
|
|
395
|
+
sendEvents,
|
|
396
|
+
autoEvents: {
|
|
397
|
+
enabled: true,
|
|
398
|
+
extendedEvents: {
|
|
399
|
+
prefix: 'LIBRARY_',
|
|
400
|
+
counter: 'secondary',
|
|
401
|
+
},
|
|
402
|
+
},
|
|
403
|
+
}}
|
|
391
404
|
|
|
392
405
|
...
|
|
393
406
|
/>
|
|
394
407
|
```
|
|
395
408
|
|
|
409
|
+
```ts
|
|
410
|
+
type ExtendedEventsConfig = {
|
|
411
|
+
prefix?: string;
|
|
412
|
+
counter?: string;
|
|
413
|
+
};
|
|
414
|
+
|
|
415
|
+
type AutoEventsConfig = {
|
|
416
|
+
enabled: boolean;
|
|
417
|
+
extendedEvents?: ExtendedEventsConfig;
|
|
418
|
+
};
|
|
419
|
+
```
|
|
420
|
+
|
|
421
|
+
The legacy boolean form remains supported for backward compatibility: `true` is equivalent to `{enabled: true}`, and `false` is equivalent to `{enabled: false}`. If `autoEvents` is omitted, both default and extended events are disabled. An `extendedEvents` object enables supplied extended events even when `enabled` is `false`.
|
|
422
|
+
|
|
423
|
+
Extended events must have `type: 'extended-event'`. Their prefix is concatenated exactly as configured, without changing case, separators, or whitespace. If `counter` is set, it defines `counters.include` for the extended event:
|
|
424
|
+
|
|
425
|
+
```ts
|
|
426
|
+
// Supplied event
|
|
427
|
+
{name: 'REGISTERED_CLICK', type: 'extended-event'}
|
|
428
|
+
|
|
429
|
+
// Event received by sendEvents with the configuration above
|
|
430
|
+
{
|
|
431
|
+
name: 'LIBRARY_REGISTERED_CLICK',
|
|
432
|
+
type: 'extended-event',
|
|
433
|
+
counters: {include: ['secondary']},
|
|
434
|
+
}
|
|
435
|
+
```
|
|
436
|
+
|
|
437
|
+
Events are sent in this order: the generated default event first (when enabled), followed by supplied extended and custom events in their original order. Extended events are omitted when `extendedEvents` is not configured. Any interaction-specific additional context is merged into every emitted event last.
|
|
438
|
+
|
|
396
439
|
An event object has only one required field - `name`. It also has predefined fields, which serve to help manage complex logic. For example, `counter.include` can help to send event in a particular counter if several analytics systems are used in a project.
|
|
397
440
|
|
|
398
441
|
```ts
|
|
@@ -443,6 +486,7 @@ Several predefined event types are used to mark automatically configured events.
|
|
|
443
486
|
```ts
|
|
444
487
|
enum PredefinedEventTypes {
|
|
445
488
|
Default = 'default-event', // default events which fire on every button click
|
|
489
|
+
Extended = 'extended-event', // events supplied by a composing library
|
|
446
490
|
Play = 'play', // React player event
|
|
447
491
|
Stop = 'stop', // React player event
|
|
448
492
|
}
|
|
@@ -1,7 +1,15 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { AnalyticsEvent } from "../../models/index.js";
|
|
3
|
+
export type ExtendedEventsConfig = {
|
|
4
|
+
prefix?: string;
|
|
5
|
+
counter?: string;
|
|
6
|
+
};
|
|
7
|
+
export type AutoEventsConfig = {
|
|
8
|
+
enabled: boolean;
|
|
9
|
+
extendedEvents?: ExtendedEventsConfig;
|
|
10
|
+
};
|
|
3
11
|
export interface AnalyticsContextProps {
|
|
4
12
|
sendEvents?: (events: AnalyticsEvent[]) => void;
|
|
5
|
-
autoEvents?: boolean;
|
|
13
|
+
autoEvents?: boolean | AutoEventsConfig;
|
|
6
14
|
}
|
|
7
15
|
export declare const AnalyticsContext: React.Context<AnalyticsContextProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"analyticsContext.js","sourceRoot":"../../../../src","sources":["context/analyticsContext/analyticsContext.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;
|
|
1
|
+
{"version":3,"file":"analyticsContext.js","sourceRoot":"../../../../src","sources":["context/analyticsContext/analyticsContext.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAmBlB,QAAA,gBAAgB,GAAG,KAAK,CAAC,aAAa,CAAwB,EAAE,CAAC,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {AnalyticsEvent} from '../../models';\n\nexport type ExtendedEventsConfig = {\n prefix?: string;\n counter?: string;\n};\n\nexport type AutoEventsConfig = {\n enabled: boolean;\n extendedEvents?: ExtendedEventsConfig;\n};\n\nexport interface AnalyticsContextProps {\n sendEvents?: (events: AnalyticsEvent[]) => void;\n autoEvents?: boolean | AutoEventsConfig;\n}\n\nexport const AnalyticsContext = React.createContext<AnalyticsContextProps>({});\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { AnalyticsEventsProp } from "../models/index.js";
|
|
2
|
-
export declare const useAnalytics: (name?: string, target?: string) => (
|
|
2
|
+
export declare const useAnalytics: (name?: string, target?: string) => (analyticsEvent?: AnalyticsEventsProp | null, additionalContext?: Record<string, string>) => void;
|
|
@@ -6,9 +6,19 @@ const React = tslib_1.__importStar(require("react"));
|
|
|
6
6
|
const analyticsContext_1 = require("../context/analyticsContext/index.js");
|
|
7
7
|
const blockIdContext_1 = require("../context/blockIdContext/index.js");
|
|
8
8
|
const models_1 = require("../models/index.js");
|
|
9
|
+
const normalizeEvents = (events) => {
|
|
10
|
+
if (!events) {
|
|
11
|
+
return [];
|
|
12
|
+
}
|
|
13
|
+
if (Array.isArray(events)) {
|
|
14
|
+
return events;
|
|
15
|
+
}
|
|
16
|
+
return [events];
|
|
17
|
+
};
|
|
9
18
|
const useAnalytics = (name = '', target) => {
|
|
10
19
|
const { sendEvents, autoEvents } = React.useContext(analyticsContext_1.AnalyticsContext);
|
|
11
20
|
const context = React.useContext(blockIdContext_1.BlockIdContext);
|
|
21
|
+
const autoEventsConfig = typeof autoEvents === 'boolean' ? { enabled: autoEvents } : autoEvents;
|
|
12
22
|
const defaultEvent = React.useMemo(() => name
|
|
13
23
|
? {
|
|
14
24
|
name,
|
|
@@ -20,13 +30,29 @@ const useAnalytics = (name = '', target) => {
|
|
|
20
30
|
if (!sendEvents) {
|
|
21
31
|
return () => { };
|
|
22
32
|
}
|
|
23
|
-
const defaultEvents = defaultEvent &&
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
33
|
+
const defaultEvents = defaultEvent && autoEventsConfig?.enabled ? [defaultEvent] : [];
|
|
34
|
+
const extendedEventsConfig = autoEventsConfig?.extendedEvents;
|
|
35
|
+
return (analyticsEvent, additionalContext) => {
|
|
36
|
+
const suppliedEvents = normalizeEvents(analyticsEvent);
|
|
37
|
+
const preparedSuppliedEvents = suppliedEvents.flatMap((event) => {
|
|
38
|
+
if (event.type !== models_1.PredefinedEventTypes.Extended) {
|
|
39
|
+
return [event];
|
|
40
|
+
}
|
|
41
|
+
if (!extendedEventsConfig) {
|
|
42
|
+
return [];
|
|
43
|
+
}
|
|
44
|
+
return [
|
|
45
|
+
{
|
|
46
|
+
...event,
|
|
47
|
+
name: `${extendedEventsConfig.prefix || ''}${event.name}`,
|
|
48
|
+
...(extendedEventsConfig.counter
|
|
49
|
+
? { counters: { include: [extendedEventsConfig.counter] } }
|
|
50
|
+
: {}),
|
|
51
|
+
},
|
|
52
|
+
];
|
|
53
|
+
});
|
|
54
|
+
const events = [...defaultEvents, ...preparedSuppliedEvents];
|
|
55
|
+
if (!events.length) {
|
|
30
56
|
return;
|
|
31
57
|
}
|
|
32
58
|
const preparedEvents = additionalContext
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useAnalytics.js","sourceRoot":"../../../src","sources":["hooks/useAnalytics.ts"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAE/B,2EAA6D;AAC7D,uEAAyD;AACzD,+CAAoF;
|
|
1
|
+
{"version":3,"file":"useAnalytics.js","sourceRoot":"../../../src","sources":["hooks/useAnalytics.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {AnalyticsContext} from '../context/analyticsContext';\nimport {BlockIdContext} from '../context/blockIdContext';\nimport {AnalyticsEvent, AnalyticsEventsProp, PredefinedEventTypes} from '../models';\n\nconst normalizeEvents = (events?: AnalyticsEventsProp | null): AnalyticsEvent[] => {\n if (!events) {\n return [];\n }\n\n if (Array.isArray(events)) {\n return events;\n }\n\n return [events];\n};\n\nexport const useAnalytics = (name = '', target?: string) => {\n const {sendEvents, autoEvents} = React.useContext(AnalyticsContext);\n const context = React.useContext(BlockIdContext);\n const autoEventsConfig = typeof autoEvents === 'boolean' ? {enabled: autoEvents} : autoEvents;\n const defaultEvent = React.useMemo(\n () =>\n name\n ? {\n name,\n context,\n type: PredefinedEventTypes.Default,\n target: target,\n }\n : undefined,\n [context, name, target],\n );\n\n if (!sendEvents) {\n return () => {};\n }\n\n const defaultEvents = defaultEvent && autoEventsConfig?.enabled ? [defaultEvent] : [];\n const extendedEventsConfig = autoEventsConfig?.extendedEvents;\n\n return (\n analyticsEvent?: AnalyticsEventsProp | null,\n additionalContext?: Record<string, string>,\n ) => {\n const suppliedEvents = normalizeEvents(analyticsEvent);\n const preparedSuppliedEvents = suppliedEvents.flatMap((event) => {\n if (event.type !== PredefinedEventTypes.Extended) {\n return [event];\n }\n\n if (!extendedEventsConfig) {\n return [];\n }\n\n return [\n {\n ...event,\n name: `${extendedEventsConfig.prefix || ''}${event.name}`,\n ...(extendedEventsConfig.counter\n ? {counters: {include: [extendedEventsConfig.counter]}}\n : {}),\n },\n ];\n });\n const events: AnalyticsEvent[] = [...defaultEvents, ...preparedSuppliedEvents];\n\n if (!events.length) {\n return;\n }\n\n const preparedEvents = additionalContext\n ? events.map((event) => ({\n ...event,\n ...additionalContext,\n }))\n : events;\n\n sendEvents(preparedEvents);\n };\n};\n"]}
|
|
@@ -13,6 +13,7 @@ exports.themeNames = {
|
|
|
13
13
|
var PredefinedEventTypes;
|
|
14
14
|
(function (PredefinedEventTypes) {
|
|
15
15
|
PredefinedEventTypes["Default"] = "default-event";
|
|
16
|
+
PredefinedEventTypes["Extended"] = "extended-event";
|
|
16
17
|
PredefinedEventTypes["Play"] = "play";
|
|
17
18
|
PredefinedEventTypes["Stop"] = "stop";
|
|
18
19
|
})(PredefinedEventTypes || (exports.PredefinedEventTypes = PredefinedEventTypes = {}));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"common.js","sourceRoot":"../../../src","sources":["models/common.ts"],"names":[],"mappings":";;;AAIA,IAAY,KAGX;AAHD,WAAY,KAAK;IACb,wBAAe,CAAA;IACf,sBAAa,CAAA;AACjB,CAAC,EAHW,KAAK,qBAAL,KAAK,QAGhB;AAEY,QAAA,UAAU,GAA0B;IAC7C,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,OAAO;IACtB,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM;CACvB,CAAC;AAcF,IAAY,
|
|
1
|
+
{"version":3,"file":"common.js","sourceRoot":"../../../src","sources":["models/common.ts"],"names":[],"mappings":";;;AAIA,IAAY,KAGX;AAHD,WAAY,KAAK;IACb,wBAAe,CAAA;IACf,sBAAa,CAAA;AACjB,CAAC,EAHW,KAAK,qBAAL,KAAK,QAGhB;AAEY,QAAA,UAAU,GAA0B;IAC7C,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,OAAO;IACtB,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM;CACvB,CAAC;AAcF,IAAY,oBAKX;AALD,WAAY,oBAAoB;IAC5B,iDAAyB,CAAA;IACzB,mDAA2B,CAAA;IAC3B,qCAAa,CAAA;IACb,qCAAa,CAAA;AACjB,CAAC,EALW,oBAAoB,oCAApB,oBAAoB,QAK/B;AAED,IAAY,iBAYX;AAZD,WAAY,iBAAiB;IACzB,uDAAkC,CAAA;IAClC,4CAAuB,CAAA;IACvB,iDAA4B,CAAA;IAC5B,wCAAmB,CAAA;IACnB,wEAAmD,CAAA;IACnD,4DAAuC,CAAA;IACvC,8DAAyC,CAAA;IACzC,uDAAkC,CAAA;IAClC,iDAA4B,CAAA;IAC5B,oDAA+B,CAAA;IAC/B,yDAAoC,CAAA;AACxC,CAAC,EAZW,iBAAiB,iCAAjB,iBAAiB,QAY5B","sourcesContent":["export interface Refable<T> {\n ref?: React.Ref<T>;\n}\n\nexport enum Theme {\n Light = 'light',\n Dark = 'dark',\n}\n\nexport const themeNames: Record<Theme, string> = {\n [Theme.Light]: 'Light',\n [Theme.Dark]: 'Dark',\n};\n\nexport type Modifiers = {[name: string]: string | boolean | undefined};\n\nexport interface ClassNameProps {\n className?: string;\n}\n\nexport interface QAProps {\n qa?: string;\n}\n\nexport type Timeout = ReturnType<typeof setTimeout> | undefined;\n\nexport enum PredefinedEventTypes {\n Default = 'default-event',\n Extended = 'extended-event',\n Play = 'play',\n Stop = 'stop',\n}\n\nexport enum DefaultEventNames {\n ShareButton = 'share-button-click',\n Button = 'button-click',\n CardBase = 'card-base-click',\n Link = 'link-click',\n ReactPlayerControls = 'react-player-controls-click',\n YandexFormSubmit = 'yandex-form-submit',\n HubspotFormSubmit = 'hubspot-form-submit',\n QuoteButton = 'quote-button-click',\n BackLink = 'back-link-click',\n Breadcrumb = 'breadcrumb-click',\n VideoPreview = 'video-preview-click',\n}\n\nexport type AnalyticsCounters = {\n include?: string[];\n exclude?: string[];\n};\n\nexport type AnalyticsEvent<T = {}> = T & {\n name: string;\n type?: string;\n counters?: AnalyticsCounters;\n context?: string;\n target?: string;\n};\n\nexport type AnalyticsEventsProp = AnalyticsEvent | AnalyticsEvent[];\n\nexport interface AnalyticsEventsBase {\n analyticsEvents?: AnalyticsEventsProp;\n}\n\nexport type TagName = 'span' | 'div' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'section' | 'p';\n"]}
|
|
@@ -1,7 +1,15 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { AnalyticsEvent } from "../../models/index.js";
|
|
3
|
+
export type ExtendedEventsConfig = {
|
|
4
|
+
prefix?: string;
|
|
5
|
+
counter?: string;
|
|
6
|
+
};
|
|
7
|
+
export type AutoEventsConfig = {
|
|
8
|
+
enabled: boolean;
|
|
9
|
+
extendedEvents?: ExtendedEventsConfig;
|
|
10
|
+
};
|
|
3
11
|
export interface AnalyticsContextProps {
|
|
4
12
|
sendEvents?: (events: AnalyticsEvent[]) => void;
|
|
5
|
-
autoEvents?: boolean;
|
|
13
|
+
autoEvents?: boolean | AutoEventsConfig;
|
|
6
14
|
}
|
|
7
15
|
export declare const AnalyticsContext: React.Context<AnalyticsContextProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"analyticsContext.js","sourceRoot":"../../../../src","sources":["context/analyticsContext/analyticsContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"analyticsContext.js","sourceRoot":"../../../../src","sources":["context/analyticsContext/analyticsContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAmB/B,MAAM,CAAC,MAAM,gBAAgB,GAAG,KAAK,CAAC,aAAa,CAAwB,EAAE,CAAC,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {AnalyticsEvent} from '../../models';\n\nexport type ExtendedEventsConfig = {\n prefix?: string;\n counter?: string;\n};\n\nexport type AutoEventsConfig = {\n enabled: boolean;\n extendedEvents?: ExtendedEventsConfig;\n};\n\nexport interface AnalyticsContextProps {\n sendEvents?: (events: AnalyticsEvent[]) => void;\n autoEvents?: boolean | AutoEventsConfig;\n}\n\nexport const AnalyticsContext = React.createContext<AnalyticsContextProps>({});\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { AnalyticsEventsProp } from "../models/index.js";
|
|
2
|
-
export declare const useAnalytics: (name?: string, target?: string) => (
|
|
2
|
+
export declare const useAnalytics: (name?: string, target?: string) => (analyticsEvent?: AnalyticsEventsProp | null, additionalContext?: Record<string, string>) => void;
|
|
@@ -2,9 +2,19 @@ import * as React from 'react';
|
|
|
2
2
|
import { AnalyticsContext } from "../context/analyticsContext/index.js";
|
|
3
3
|
import { BlockIdContext } from "../context/blockIdContext/index.js";
|
|
4
4
|
import { PredefinedEventTypes } from "../models/index.js";
|
|
5
|
+
const normalizeEvents = (events) => {
|
|
6
|
+
if (!events) {
|
|
7
|
+
return [];
|
|
8
|
+
}
|
|
9
|
+
if (Array.isArray(events)) {
|
|
10
|
+
return events;
|
|
11
|
+
}
|
|
12
|
+
return [events];
|
|
13
|
+
};
|
|
5
14
|
export const useAnalytics = (name = '', target) => {
|
|
6
15
|
const { sendEvents, autoEvents } = React.useContext(AnalyticsContext);
|
|
7
16
|
const context = React.useContext(BlockIdContext);
|
|
17
|
+
const autoEventsConfig = typeof autoEvents === 'boolean' ? { enabled: autoEvents } : autoEvents;
|
|
8
18
|
const defaultEvent = React.useMemo(() => name
|
|
9
19
|
? {
|
|
10
20
|
name,
|
|
@@ -16,13 +26,29 @@ export const useAnalytics = (name = '', target) => {
|
|
|
16
26
|
if (!sendEvents) {
|
|
17
27
|
return () => { };
|
|
18
28
|
}
|
|
19
|
-
const defaultEvents = defaultEvent &&
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
29
|
+
const defaultEvents = defaultEvent && autoEventsConfig?.enabled ? [defaultEvent] : [];
|
|
30
|
+
const extendedEventsConfig = autoEventsConfig?.extendedEvents;
|
|
31
|
+
return (analyticsEvent, additionalContext) => {
|
|
32
|
+
const suppliedEvents = normalizeEvents(analyticsEvent);
|
|
33
|
+
const preparedSuppliedEvents = suppliedEvents.flatMap((event) => {
|
|
34
|
+
if (event.type !== PredefinedEventTypes.Extended) {
|
|
35
|
+
return [event];
|
|
36
|
+
}
|
|
37
|
+
if (!extendedEventsConfig) {
|
|
38
|
+
return [];
|
|
39
|
+
}
|
|
40
|
+
return [
|
|
41
|
+
{
|
|
42
|
+
...event,
|
|
43
|
+
name: `${extendedEventsConfig.prefix || ''}${event.name}`,
|
|
44
|
+
...(extendedEventsConfig.counter
|
|
45
|
+
? { counters: { include: [extendedEventsConfig.counter] } }
|
|
46
|
+
: {}),
|
|
47
|
+
},
|
|
48
|
+
];
|
|
49
|
+
});
|
|
50
|
+
const events = [...defaultEvents, ...preparedSuppliedEvents];
|
|
51
|
+
if (!events.length) {
|
|
26
52
|
return;
|
|
27
53
|
}
|
|
28
54
|
const preparedEvents = additionalContext
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useAnalytics.js","sourceRoot":"../../../src","sources":["hooks/useAnalytics.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,gBAAgB,EAAC,6CAAoC;AAC7D,OAAO,EAAC,cAAc,EAAC,2CAAkC;AACzD,OAAO,EAAsC,oBAAoB,EAAC,2BAAkB;AAEpF,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,IAAI,GAAG,EAAE,EAAE,MAAe,EAAE,EAAE;IACvD,MAAM,EAAC,UAAU,EAAE,UAAU,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,gBAAgB,CAAC,CAAC;IACpE,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC;IACjD,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAC9B,GAAG,EAAE,CACD,IAAI;QACA,CAAC,CAAC;YACI,IAAI;YACJ,OAAO;YACP,IAAI,EAAE,oBAAoB,CAAC,OAAO;YAClC,MAAM,EAAE,MAAM;SACjB;QACH,CAAC,CAAC,SAAS,EACnB,CAAC,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAC1B,CAAC;IAEF,IAAI,CAAC,UAAU,EAAE,CAAC;QACd,OAAO,GAAG,EAAE,GAAE,CAAC,CAAC;IACpB,CAAC;IAED,MAAM,aAAa,GAAG,YAAY,IAAI,
|
|
1
|
+
{"version":3,"file":"useAnalytics.js","sourceRoot":"../../../src","sources":["hooks/useAnalytics.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,gBAAgB,EAAC,6CAAoC;AAC7D,OAAO,EAAC,cAAc,EAAC,2CAAkC;AACzD,OAAO,EAAsC,oBAAoB,EAAC,2BAAkB;AAEpF,MAAM,eAAe,GAAG,CAAC,MAAmC,EAAoB,EAAE;IAC9E,IAAI,CAAC,MAAM,EAAE,CAAC;QACV,OAAO,EAAE,CAAC;IACd,CAAC;IAED,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC;QACxB,OAAO,MAAM,CAAC;IAClB,CAAC;IAED,OAAO,CAAC,MAAM,CAAC,CAAC;AACpB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,IAAI,GAAG,EAAE,EAAE,MAAe,EAAE,EAAE;IACvD,MAAM,EAAC,UAAU,EAAE,UAAU,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,gBAAgB,CAAC,CAAC;IACpE,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC;IACjD,MAAM,gBAAgB,GAAG,OAAO,UAAU,KAAK,SAAS,CAAC,CAAC,CAAC,EAAC,OAAO,EAAE,UAAU,EAAC,CAAC,CAAC,CAAC,UAAU,CAAC;IAC9F,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAC9B,GAAG,EAAE,CACD,IAAI;QACA,CAAC,CAAC;YACI,IAAI;YACJ,OAAO;YACP,IAAI,EAAE,oBAAoB,CAAC,OAAO;YAClC,MAAM,EAAE,MAAM;SACjB;QACH,CAAC,CAAC,SAAS,EACnB,CAAC,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAC1B,CAAC;IAEF,IAAI,CAAC,UAAU,EAAE,CAAC;QACd,OAAO,GAAG,EAAE,GAAE,CAAC,CAAC;IACpB,CAAC;IAED,MAAM,aAAa,GAAG,YAAY,IAAI,gBAAgB,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IACtF,MAAM,oBAAoB,GAAG,gBAAgB,EAAE,cAAc,CAAC;IAE9D,OAAO,CACH,cAA2C,EAC3C,iBAA0C,EAC5C,EAAE;QACA,MAAM,cAAc,GAAG,eAAe,CAAC,cAAc,CAAC,CAAC;QACvD,MAAM,sBAAsB,GAAG,cAAc,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE;YAC5D,IAAI,KAAK,CAAC,IAAI,KAAK,oBAAoB,CAAC,QAAQ,EAAE,CAAC;gBAC/C,OAAO,CAAC,KAAK,CAAC,CAAC;YACnB,CAAC;YAED,IAAI,CAAC,oBAAoB,EAAE,CAAC;gBACxB,OAAO,EAAE,CAAC;YACd,CAAC;YAED,OAAO;gBACH;oBACI,GAAG,KAAK;oBACR,IAAI,EAAE,GAAG,oBAAoB,CAAC,MAAM,IAAI,EAAE,GAAG,KAAK,CAAC,IAAI,EAAE;oBACzD,GAAG,CAAC,oBAAoB,CAAC,OAAO;wBAC5B,CAAC,CAAC,EAAC,QAAQ,EAAE,EAAC,OAAO,EAAE,CAAC,oBAAoB,CAAC,OAAO,CAAC,EAAC,EAAC;wBACvD,CAAC,CAAC,EAAE,CAAC;iBACZ;aACJ,CAAC;QACN,CAAC,CAAC,CAAC;QACH,MAAM,MAAM,GAAqB,CAAC,GAAG,aAAa,EAAE,GAAG,sBAAsB,CAAC,CAAC;QAE/E,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC;YACjB,OAAO;QACX,CAAC;QAED,MAAM,cAAc,GAAG,iBAAiB;YACpC,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;gBACnB,GAAG,KAAK;gBACR,GAAG,iBAAiB;aACvB,CAAC,CAAC;YACL,CAAC,CAAC,MAAM,CAAC;QAEb,UAAU,CAAC,cAAc,CAAC,CAAC;IAC/B,CAAC,CAAC;AACN,CAAC,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {AnalyticsContext} from '../context/analyticsContext';\nimport {BlockIdContext} from '../context/blockIdContext';\nimport {AnalyticsEvent, AnalyticsEventsProp, PredefinedEventTypes} from '../models';\n\nconst normalizeEvents = (events?: AnalyticsEventsProp | null): AnalyticsEvent[] => {\n if (!events) {\n return [];\n }\n\n if (Array.isArray(events)) {\n return events;\n }\n\n return [events];\n};\n\nexport const useAnalytics = (name = '', target?: string) => {\n const {sendEvents, autoEvents} = React.useContext(AnalyticsContext);\n const context = React.useContext(BlockIdContext);\n const autoEventsConfig = typeof autoEvents === 'boolean' ? {enabled: autoEvents} : autoEvents;\n const defaultEvent = React.useMemo(\n () =>\n name\n ? {\n name,\n context,\n type: PredefinedEventTypes.Default,\n target: target,\n }\n : undefined,\n [context, name, target],\n );\n\n if (!sendEvents) {\n return () => {};\n }\n\n const defaultEvents = defaultEvent && autoEventsConfig?.enabled ? [defaultEvent] : [];\n const extendedEventsConfig = autoEventsConfig?.extendedEvents;\n\n return (\n analyticsEvent?: AnalyticsEventsProp | null,\n additionalContext?: Record<string, string>,\n ) => {\n const suppliedEvents = normalizeEvents(analyticsEvent);\n const preparedSuppliedEvents = suppliedEvents.flatMap((event) => {\n if (event.type !== PredefinedEventTypes.Extended) {\n return [event];\n }\n\n if (!extendedEventsConfig) {\n return [];\n }\n\n return [\n {\n ...event,\n name: `${extendedEventsConfig.prefix || ''}${event.name}`,\n ...(extendedEventsConfig.counter\n ? {counters: {include: [extendedEventsConfig.counter]}}\n : {}),\n },\n ];\n });\n const events: AnalyticsEvent[] = [...defaultEvents, ...preparedSuppliedEvents];\n\n if (!events.length) {\n return;\n }\n\n const preparedEvents = additionalContext\n ? events.map((event) => ({\n ...event,\n ...additionalContext,\n }))\n : events;\n\n sendEvents(preparedEvents);\n };\n};\n"]}
|
|
@@ -10,6 +10,7 @@ export const themeNames = {
|
|
|
10
10
|
export var PredefinedEventTypes;
|
|
11
11
|
(function (PredefinedEventTypes) {
|
|
12
12
|
PredefinedEventTypes["Default"] = "default-event";
|
|
13
|
+
PredefinedEventTypes["Extended"] = "extended-event";
|
|
13
14
|
PredefinedEventTypes["Play"] = "play";
|
|
14
15
|
PredefinedEventTypes["Stop"] = "stop";
|
|
15
16
|
})(PredefinedEventTypes || (PredefinedEventTypes = {}));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"common.js","sourceRoot":"../../../src","sources":["models/common.ts"],"names":[],"mappings":"AAIA,MAAM,CAAN,IAAY,KAGX;AAHD,WAAY,KAAK;IACb,wBAAe,CAAA;IACf,sBAAa,CAAA;AACjB,CAAC,EAHW,KAAK,KAAL,KAAK,QAGhB;AAED,MAAM,CAAC,MAAM,UAAU,GAA0B;IAC7C,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,OAAO;IACtB,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM;CACvB,CAAC;AAcF,MAAM,CAAN,IAAY,
|
|
1
|
+
{"version":3,"file":"common.js","sourceRoot":"../../../src","sources":["models/common.ts"],"names":[],"mappings":"AAIA,MAAM,CAAN,IAAY,KAGX;AAHD,WAAY,KAAK;IACb,wBAAe,CAAA;IACf,sBAAa,CAAA;AACjB,CAAC,EAHW,KAAK,KAAL,KAAK,QAGhB;AAED,MAAM,CAAC,MAAM,UAAU,GAA0B;IAC7C,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,OAAO;IACtB,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM;CACvB,CAAC;AAcF,MAAM,CAAN,IAAY,oBAKX;AALD,WAAY,oBAAoB;IAC5B,iDAAyB,CAAA;IACzB,mDAA2B,CAAA;IAC3B,qCAAa,CAAA;IACb,qCAAa,CAAA;AACjB,CAAC,EALW,oBAAoB,KAApB,oBAAoB,QAK/B;AAED,MAAM,CAAN,IAAY,iBAYX;AAZD,WAAY,iBAAiB;IACzB,uDAAkC,CAAA;IAClC,4CAAuB,CAAA;IACvB,iDAA4B,CAAA;IAC5B,wCAAmB,CAAA;IACnB,wEAAmD,CAAA;IACnD,4DAAuC,CAAA;IACvC,8DAAyC,CAAA;IACzC,uDAAkC,CAAA;IAClC,iDAA4B,CAAA;IAC5B,oDAA+B,CAAA;IAC/B,yDAAoC,CAAA;AACxC,CAAC,EAZW,iBAAiB,KAAjB,iBAAiB,QAY5B","sourcesContent":["export interface Refable<T> {\n ref?: React.Ref<T>;\n}\n\nexport enum Theme {\n Light = 'light',\n Dark = 'dark',\n}\n\nexport const themeNames: Record<Theme, string> = {\n [Theme.Light]: 'Light',\n [Theme.Dark]: 'Dark',\n};\n\nexport type Modifiers = {[name: string]: string | boolean | undefined};\n\nexport interface ClassNameProps {\n className?: string;\n}\n\nexport interface QAProps {\n qa?: string;\n}\n\nexport type Timeout = ReturnType<typeof setTimeout> | undefined;\n\nexport enum PredefinedEventTypes {\n Default = 'default-event',\n Extended = 'extended-event',\n Play = 'play',\n Stop = 'stop',\n}\n\nexport enum DefaultEventNames {\n ShareButton = 'share-button-click',\n Button = 'button-click',\n CardBase = 'card-base-click',\n Link = 'link-click',\n ReactPlayerControls = 'react-player-controls-click',\n YandexFormSubmit = 'yandex-form-submit',\n HubspotFormSubmit = 'hubspot-form-submit',\n QuoteButton = 'quote-button-click',\n BackLink = 'back-link-click',\n Breadcrumb = 'breadcrumb-click',\n VideoPreview = 'video-preview-click',\n}\n\nexport type AnalyticsCounters = {\n include?: string[];\n exclude?: string[];\n};\n\nexport type AnalyticsEvent<T = {}> = T & {\n name: string;\n type?: string;\n counters?: AnalyticsCounters;\n context?: string;\n target?: string;\n};\n\nexport type AnalyticsEventsProp = AnalyticsEvent | AnalyticsEvent[];\n\nexport interface AnalyticsEventsBase {\n analyticsEvents?: AnalyticsEventsProp;\n}\n\nexport type TagName = 'span' | 'div' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'section' | 'p';\n"]}
|
package/package.json
CHANGED
package/server/models/common.js
CHANGED
|
@@ -13,6 +13,7 @@ exports.themeNames = {
|
|
|
13
13
|
var PredefinedEventTypes;
|
|
14
14
|
(function (PredefinedEventTypes) {
|
|
15
15
|
PredefinedEventTypes["Default"] = "default-event";
|
|
16
|
+
PredefinedEventTypes["Extended"] = "extended-event";
|
|
16
17
|
PredefinedEventTypes["Play"] = "play";
|
|
17
18
|
PredefinedEventTypes["Stop"] = "stop";
|
|
18
19
|
})(PredefinedEventTypes || (exports.PredefinedEventTypes = PredefinedEventTypes = {}));
|