@strapi/admin 5.15.1 → 5.16.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/admin/admin/src/components/MainNav/NavUser.js +4 -15
- package/dist/admin/admin/src/components/MainNav/NavUser.js.map +1 -1
- package/dist/admin/admin/src/components/MainNav/NavUser.mjs +4 -15
- package/dist/admin/admin/src/components/MainNav/NavUser.mjs.map +1 -1
- package/dist/admin/admin/src/components/Providers.js +10 -5
- package/dist/admin/admin/src/components/Providers.js.map +1 -1
- package/dist/admin/admin/src/components/Providers.mjs +10 -5
- package/dist/admin/admin/src/components/Providers.mjs.map +1 -1
- package/dist/admin/admin/src/components/SearchInput.js +5 -0
- package/dist/admin/admin/src/components/SearchInput.js.map +1 -1
- package/dist/admin/admin/src/components/SearchInput.mjs +5 -0
- package/dist/admin/admin/src/components/SearchInput.mjs.map +1 -1
- package/dist/admin/admin/src/components/UnstableGuidedTour/Context.js +66 -0
- package/dist/admin/admin/src/components/UnstableGuidedTour/Context.js.map +1 -0
- package/dist/admin/admin/src/components/UnstableGuidedTour/Context.mjs +43 -0
- package/dist/admin/admin/src/components/UnstableGuidedTour/Context.mjs.map +1 -0
- package/dist/admin/admin/src/components/UnstableGuidedTour/Step.js +137 -0
- package/dist/admin/admin/src/components/UnstableGuidedTour/Step.js.map +1 -0
- package/dist/admin/admin/src/components/UnstableGuidedTour/Step.mjs +116 -0
- package/dist/admin/admin/src/components/UnstableGuidedTour/Step.mjs.map +1 -0
- package/dist/admin/admin/src/components/UnstableGuidedTour/Tours.js +116 -0
- package/dist/admin/admin/src/components/UnstableGuidedTour/Tours.js.map +1 -0
- package/dist/admin/admin/src/components/UnstableGuidedTour/Tours.mjs +94 -0
- package/dist/admin/admin/src/components/UnstableGuidedTour/Tours.mjs.map +1 -0
- package/dist/admin/admin/src/features/Tracking.js.map +1 -1
- package/dist/admin/admin/src/features/Tracking.mjs.map +1 -1
- package/dist/admin/admin/src/pages/Settings/pages/Roles/components/PluginsAndSettings.js +2 -1
- package/dist/admin/admin/src/pages/Settings/pages/Roles/components/PluginsAndSettings.js.map +1 -1
- package/dist/admin/admin/src/pages/Settings/pages/Roles/components/PluginsAndSettings.mjs +2 -1
- package/dist/admin/admin/src/pages/Settings/pages/Roles/components/PluginsAndSettings.mjs.map +1 -1
- package/dist/admin/admin/src/translations/en.json.js +9 -1
- package/dist/admin/admin/src/translations/en.json.js.map +1 -1
- package/dist/admin/admin/src/translations/en.json.mjs +9 -1
- package/dist/admin/admin/src/translations/en.json.mjs.map +1 -1
- package/dist/admin/admin/src/translations/fr.json.js +3 -0
- package/dist/admin/admin/src/translations/fr.json.js.map +1 -1
- package/dist/admin/admin/src/translations/fr.json.mjs +3 -0
- package/dist/admin/admin/src/translations/fr.json.mjs.map +1 -1
- package/dist/admin/index.js +2 -0
- package/dist/admin/index.js.map +1 -1
- package/dist/admin/index.mjs +1 -0
- package/dist/admin/index.mjs.map +1 -1
- package/dist/admin/src/components/UnstableGuidedTour/Context.d.ts +28 -0
- package/dist/admin/src/components/UnstableGuidedTour/Step.d.ts +35 -0
- package/dist/admin/src/components/UnstableGuidedTour/Tours.d.ts +24 -0
- package/dist/admin/src/features/Tracking.d.ts +16 -1
- package/dist/admin/src/index.d.ts +1 -0
- package/package.json +9 -9
|
@@ -0,0 +1,137 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var React = require('react');
|
|
5
|
+
var designSystem = require('@strapi/design-system');
|
|
6
|
+
var reactIntl = require('react-intl');
|
|
7
|
+
var styled = require('styled-components');
|
|
8
|
+
var Context = require('./Context.js');
|
|
9
|
+
|
|
10
|
+
function _interopNamespaceDefault(e) {
|
|
11
|
+
var n = Object.create(null);
|
|
12
|
+
if (e) {
|
|
13
|
+
Object.keys(e).forEach(function (k) {
|
|
14
|
+
if (k !== 'default') {
|
|
15
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
16
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
17
|
+
enumerable: true,
|
|
18
|
+
get: function () { return e[k]; }
|
|
19
|
+
});
|
|
20
|
+
}
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
n.default = e;
|
|
24
|
+
return Object.freeze(n);
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
28
|
+
|
|
29
|
+
const ActionsContainer = styled.styled(designSystem.Flex)`
|
|
30
|
+
border-top: ${({ theme })=>`1px solid ${theme.colors.neutral150}`};
|
|
31
|
+
`;
|
|
32
|
+
const createStepComponents = (tourName)=>({
|
|
33
|
+
Root: /*#__PURE__*/ React__namespace.forwardRef((props, ref)=>/*#__PURE__*/ jsxRuntime.jsx(designSystem.Popover.Content, {
|
|
34
|
+
ref: ref,
|
|
35
|
+
side: "top",
|
|
36
|
+
align: "center",
|
|
37
|
+
...props,
|
|
38
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
|
|
39
|
+
width: "360px",
|
|
40
|
+
direction: "column",
|
|
41
|
+
alignItems: "start",
|
|
42
|
+
children: props.children
|
|
43
|
+
})
|
|
44
|
+
})),
|
|
45
|
+
Title: (props)=>{
|
|
46
|
+
return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
|
|
47
|
+
paddingTop: 5,
|
|
48
|
+
paddingLeft: 5,
|
|
49
|
+
paddingRight: 5,
|
|
50
|
+
paddingBottom: 1,
|
|
51
|
+
width: "100%",
|
|
52
|
+
children: 'children' in props ? props.children : /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
|
|
53
|
+
tag: "div",
|
|
54
|
+
variant: "omega",
|
|
55
|
+
fontWeight: "bold",
|
|
56
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(reactIntl.FormattedMessage, {
|
|
57
|
+
tagName: "h1",
|
|
58
|
+
id: props.id,
|
|
59
|
+
defaultMessage: props.defaultMessage
|
|
60
|
+
})
|
|
61
|
+
})
|
|
62
|
+
});
|
|
63
|
+
},
|
|
64
|
+
Content: (props)=>/*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
|
|
65
|
+
paddingBottom: 5,
|
|
66
|
+
paddingLeft: 5,
|
|
67
|
+
paddingRight: 5,
|
|
68
|
+
width: "100%",
|
|
69
|
+
children: 'children' in props ? props.children : /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
|
|
70
|
+
tag: "div",
|
|
71
|
+
variant: "omega",
|
|
72
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(reactIntl.FormattedMessage, {
|
|
73
|
+
tagName: "p",
|
|
74
|
+
id: props.id,
|
|
75
|
+
defaultMessage: props.defaultMessage
|
|
76
|
+
})
|
|
77
|
+
})
|
|
78
|
+
}),
|
|
79
|
+
Actions: ({ showStepCount = true, showSkip = false, ...props })=>{
|
|
80
|
+
const dispatch = Context.unstableUseGuidedTour('GuidedTourPopover', (s)=>s.dispatch);
|
|
81
|
+
const state = Context.unstableUseGuidedTour('GuidedTourPopover', (s)=>s.state);
|
|
82
|
+
const currentStep = state.tours[tourName].currentStep + 1;
|
|
83
|
+
const tourLength = state.tours[tourName].length;
|
|
84
|
+
return /*#__PURE__*/ jsxRuntime.jsx(ActionsContainer, {
|
|
85
|
+
width: "100%",
|
|
86
|
+
padding: 3,
|
|
87
|
+
paddingLeft: 5,
|
|
88
|
+
children: 'children' in props ? props.children : /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
|
|
89
|
+
flex: 1,
|
|
90
|
+
justifyContent: showStepCount ? 'space-between' : 'flex-end',
|
|
91
|
+
children: [
|
|
92
|
+
showStepCount && /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
|
|
93
|
+
variant: "omega",
|
|
94
|
+
fontSize: "12px",
|
|
95
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(reactIntl.FormattedMessage, {
|
|
96
|
+
id: "tours.stepCount",
|
|
97
|
+
defaultMessage: "Step {currentStep} of {tourLength}",
|
|
98
|
+
values: {
|
|
99
|
+
currentStep,
|
|
100
|
+
tourLength
|
|
101
|
+
}
|
|
102
|
+
})
|
|
103
|
+
}),
|
|
104
|
+
/*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
|
|
105
|
+
gap: 2,
|
|
106
|
+
children: [
|
|
107
|
+
showSkip && /*#__PURE__*/ jsxRuntime.jsx(designSystem.Button, {
|
|
108
|
+
variant: "tertiary",
|
|
109
|
+
onClick: ()=>dispatch({
|
|
110
|
+
type: 'skip_tour',
|
|
111
|
+
payload: tourName
|
|
112
|
+
}),
|
|
113
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(reactIntl.FormattedMessage, {
|
|
114
|
+
id: "tours.skip",
|
|
115
|
+
defaultMessage: "Skip"
|
|
116
|
+
})
|
|
117
|
+
}),
|
|
118
|
+
/*#__PURE__*/ jsxRuntime.jsx(designSystem.Button, {
|
|
119
|
+
onClick: ()=>dispatch({
|
|
120
|
+
type: 'next_step',
|
|
121
|
+
payload: tourName
|
|
122
|
+
}),
|
|
123
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(reactIntl.FormattedMessage, {
|
|
124
|
+
id: "tours.next",
|
|
125
|
+
defaultMessage: "Next"
|
|
126
|
+
})
|
|
127
|
+
})
|
|
128
|
+
]
|
|
129
|
+
})
|
|
130
|
+
]
|
|
131
|
+
})
|
|
132
|
+
});
|
|
133
|
+
}
|
|
134
|
+
});
|
|
135
|
+
|
|
136
|
+
exports.createStepComponents = createStepComponents;
|
|
137
|
+
//# sourceMappingURL=Step.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Step.js","sources":["../../../../../../admin/src/components/UnstableGuidedTour/Step.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Popover, Box, Flex, Button, Typography } from '@strapi/design-system';\nimport { FormattedMessage, type MessageDescriptor } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { unstableUseGuidedTour, ValidTourName } from './Context';\n\n/* -------------------------------------------------------------------------------------------------\n * Step factory\n * -----------------------------------------------------------------------------------------------*/\n\ntype WithChildren = {\n children: React.ReactNode;\n id?: never;\n defaultMessage?: never;\n};\n\ntype WithIntl = {\n children?: undefined;\n id: MessageDescriptor['id'];\n defaultMessage: MessageDescriptor['defaultMessage'];\n};\n\ntype WithActionsChildren = {\n children: React.ReactNode;\n showStepCount?: boolean;\n showSkip?: boolean;\n};\n\ntype WithActionsProps = {\n children?: undefined;\n showStepCount?: boolean;\n showSkip?: boolean;\n};\n\ntype StepProps = WithChildren | WithIntl;\ntype ActionsProps = WithActionsChildren | WithActionsProps;\n\ntype Step = {\n Root: React.ForwardRefExoticComponent<React.ComponentProps<typeof Popover.Content>>;\n Title: (props: StepProps) => React.ReactNode;\n Content: (props: StepProps) => React.ReactNode;\n Actions: (props: ActionsProps) => React.ReactNode;\n};\n\nconst ActionsContainer = styled(Flex)`\n border-top: ${({ theme }) => `1px solid ${theme.colors.neutral150}`};\n`;\n\nconst createStepComponents = (tourName: ValidTourName): Step => ({\n Root: React.forwardRef((props, ref) => (\n <Popover.Content ref={ref} side=\"top\" align=\"center\" {...props}>\n <Flex width=\"360px\" direction=\"column\" alignItems=\"start\">\n {props.children}\n </Flex>\n </Popover.Content>\n )),\n\n Title: (props) => {\n return (\n <Box paddingTop={5} paddingLeft={5} paddingRight={5} paddingBottom={1} width=\"100%\">\n {'children' in props ? (\n props.children\n ) : (\n <Typography tag=\"div\" variant=\"omega\" fontWeight=\"bold\">\n <FormattedMessage tagName=\"h1\" id={props.id} defaultMessage={props.defaultMessage} />\n </Typography>\n )}\n </Box>\n );\n },\n\n Content: (props) => (\n <Box paddingBottom={5} paddingLeft={5} paddingRight={5} width=\"100%\">\n {'children' in props ? (\n props.children\n ) : (\n <Typography tag=\"div\" variant=\"omega\">\n <FormattedMessage tagName=\"p\" id={props.id} defaultMessage={props.defaultMessage} />\n </Typography>\n )}\n </Box>\n ),\n\n Actions: ({ showStepCount = true, showSkip = false, ...props }) => {\n const dispatch = unstableUseGuidedTour('GuidedTourPopover', (s) => s.dispatch);\n const state = unstableUseGuidedTour('GuidedTourPopover', (s) => s.state);\n const currentStep = state.tours[tourName].currentStep + 1;\n const tourLength = state.tours[tourName].length;\n\n return (\n <ActionsContainer width=\"100%\" padding={3} paddingLeft={5}>\n {'children' in props ? (\n props.children\n ) : (\n <Flex flex={1} justifyContent={showStepCount ? 'space-between' : 'flex-end'}>\n {showStepCount && (\n <Typography variant=\"omega\" fontSize=\"12px\">\n <FormattedMessage\n id=\"tours.stepCount\"\n defaultMessage=\"Step {currentStep} of {tourLength}\"\n values={{ currentStep, tourLength }}\n />\n </Typography>\n )}\n <Flex gap={2}>\n {showSkip && (\n <Button\n variant=\"tertiary\"\n onClick={() => dispatch({ type: 'skip_tour', payload: tourName })}\n >\n <FormattedMessage id=\"tours.skip\" defaultMessage=\"Skip\" />\n </Button>\n )}\n <Button onClick={() => dispatch({ type: 'next_step', payload: tourName })}>\n <FormattedMessage id=\"tours.next\" defaultMessage=\"Next\" />\n </Button>\n </Flex>\n </Flex>\n )}\n </ActionsContainer>\n );\n },\n});\n\nexport type { Step };\nexport { createStepComponents };\n"],"names":["ActionsContainer","styled","Flex","theme","colors","neutral150","createStepComponents","tourName","Root","React","forwardRef","props","ref","_jsx","Popover","Content","side","align","width","direction","alignItems","children","Title","Box","paddingTop","paddingLeft","paddingRight","paddingBottom","Typography","tag","variant","fontWeight","FormattedMessage","tagName","id","defaultMessage","Actions","showStepCount","showSkip","dispatch","unstableUseGuidedTour","s","state","currentStep","tours","tourLength","length","padding","_jsxs","flex","justifyContent","fontSize","values","gap","Button","onClick","type","payload"],"mappings":"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"}
|
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { Flex, Popover, Box, Typography, Button } from '@strapi/design-system';
|
|
4
|
+
import { FormattedMessage } from 'react-intl';
|
|
5
|
+
import { styled } from 'styled-components';
|
|
6
|
+
import { unstableUseGuidedTour } from './Context.mjs';
|
|
7
|
+
|
|
8
|
+
const ActionsContainer = styled(Flex)`
|
|
9
|
+
border-top: ${({ theme })=>`1px solid ${theme.colors.neutral150}`};
|
|
10
|
+
`;
|
|
11
|
+
const createStepComponents = (tourName)=>({
|
|
12
|
+
Root: /*#__PURE__*/ React.forwardRef((props, ref)=>/*#__PURE__*/ jsx(Popover.Content, {
|
|
13
|
+
ref: ref,
|
|
14
|
+
side: "top",
|
|
15
|
+
align: "center",
|
|
16
|
+
...props,
|
|
17
|
+
children: /*#__PURE__*/ jsx(Flex, {
|
|
18
|
+
width: "360px",
|
|
19
|
+
direction: "column",
|
|
20
|
+
alignItems: "start",
|
|
21
|
+
children: props.children
|
|
22
|
+
})
|
|
23
|
+
})),
|
|
24
|
+
Title: (props)=>{
|
|
25
|
+
return /*#__PURE__*/ jsx(Box, {
|
|
26
|
+
paddingTop: 5,
|
|
27
|
+
paddingLeft: 5,
|
|
28
|
+
paddingRight: 5,
|
|
29
|
+
paddingBottom: 1,
|
|
30
|
+
width: "100%",
|
|
31
|
+
children: 'children' in props ? props.children : /*#__PURE__*/ jsx(Typography, {
|
|
32
|
+
tag: "div",
|
|
33
|
+
variant: "omega",
|
|
34
|
+
fontWeight: "bold",
|
|
35
|
+
children: /*#__PURE__*/ jsx(FormattedMessage, {
|
|
36
|
+
tagName: "h1",
|
|
37
|
+
id: props.id,
|
|
38
|
+
defaultMessage: props.defaultMessage
|
|
39
|
+
})
|
|
40
|
+
})
|
|
41
|
+
});
|
|
42
|
+
},
|
|
43
|
+
Content: (props)=>/*#__PURE__*/ jsx(Box, {
|
|
44
|
+
paddingBottom: 5,
|
|
45
|
+
paddingLeft: 5,
|
|
46
|
+
paddingRight: 5,
|
|
47
|
+
width: "100%",
|
|
48
|
+
children: 'children' in props ? props.children : /*#__PURE__*/ jsx(Typography, {
|
|
49
|
+
tag: "div",
|
|
50
|
+
variant: "omega",
|
|
51
|
+
children: /*#__PURE__*/ jsx(FormattedMessage, {
|
|
52
|
+
tagName: "p",
|
|
53
|
+
id: props.id,
|
|
54
|
+
defaultMessage: props.defaultMessage
|
|
55
|
+
})
|
|
56
|
+
})
|
|
57
|
+
}),
|
|
58
|
+
Actions: ({ showStepCount = true, showSkip = false, ...props })=>{
|
|
59
|
+
const dispatch = unstableUseGuidedTour('GuidedTourPopover', (s)=>s.dispatch);
|
|
60
|
+
const state = unstableUseGuidedTour('GuidedTourPopover', (s)=>s.state);
|
|
61
|
+
const currentStep = state.tours[tourName].currentStep + 1;
|
|
62
|
+
const tourLength = state.tours[tourName].length;
|
|
63
|
+
return /*#__PURE__*/ jsx(ActionsContainer, {
|
|
64
|
+
width: "100%",
|
|
65
|
+
padding: 3,
|
|
66
|
+
paddingLeft: 5,
|
|
67
|
+
children: 'children' in props ? props.children : /*#__PURE__*/ jsxs(Flex, {
|
|
68
|
+
flex: 1,
|
|
69
|
+
justifyContent: showStepCount ? 'space-between' : 'flex-end',
|
|
70
|
+
children: [
|
|
71
|
+
showStepCount && /*#__PURE__*/ jsx(Typography, {
|
|
72
|
+
variant: "omega",
|
|
73
|
+
fontSize: "12px",
|
|
74
|
+
children: /*#__PURE__*/ jsx(FormattedMessage, {
|
|
75
|
+
id: "tours.stepCount",
|
|
76
|
+
defaultMessage: "Step {currentStep} of {tourLength}",
|
|
77
|
+
values: {
|
|
78
|
+
currentStep,
|
|
79
|
+
tourLength
|
|
80
|
+
}
|
|
81
|
+
})
|
|
82
|
+
}),
|
|
83
|
+
/*#__PURE__*/ jsxs(Flex, {
|
|
84
|
+
gap: 2,
|
|
85
|
+
children: [
|
|
86
|
+
showSkip && /*#__PURE__*/ jsx(Button, {
|
|
87
|
+
variant: "tertiary",
|
|
88
|
+
onClick: ()=>dispatch({
|
|
89
|
+
type: 'skip_tour',
|
|
90
|
+
payload: tourName
|
|
91
|
+
}),
|
|
92
|
+
children: /*#__PURE__*/ jsx(FormattedMessage, {
|
|
93
|
+
id: "tours.skip",
|
|
94
|
+
defaultMessage: "Skip"
|
|
95
|
+
})
|
|
96
|
+
}),
|
|
97
|
+
/*#__PURE__*/ jsx(Button, {
|
|
98
|
+
onClick: ()=>dispatch({
|
|
99
|
+
type: 'next_step',
|
|
100
|
+
payload: tourName
|
|
101
|
+
}),
|
|
102
|
+
children: /*#__PURE__*/ jsx(FormattedMessage, {
|
|
103
|
+
id: "tours.next",
|
|
104
|
+
defaultMessage: "Next"
|
|
105
|
+
})
|
|
106
|
+
})
|
|
107
|
+
]
|
|
108
|
+
})
|
|
109
|
+
]
|
|
110
|
+
})
|
|
111
|
+
});
|
|
112
|
+
}
|
|
113
|
+
});
|
|
114
|
+
|
|
115
|
+
export { createStepComponents };
|
|
116
|
+
//# sourceMappingURL=Step.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Step.mjs","sources":["../../../../../../admin/src/components/UnstableGuidedTour/Step.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Popover, Box, Flex, Button, Typography } from '@strapi/design-system';\nimport { FormattedMessage, type MessageDescriptor } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { unstableUseGuidedTour, ValidTourName } from './Context';\n\n/* -------------------------------------------------------------------------------------------------\n * Step factory\n * -----------------------------------------------------------------------------------------------*/\n\ntype WithChildren = {\n children: React.ReactNode;\n id?: never;\n defaultMessage?: never;\n};\n\ntype WithIntl = {\n children?: undefined;\n id: MessageDescriptor['id'];\n defaultMessage: MessageDescriptor['defaultMessage'];\n};\n\ntype WithActionsChildren = {\n children: React.ReactNode;\n showStepCount?: boolean;\n showSkip?: boolean;\n};\n\ntype WithActionsProps = {\n children?: undefined;\n showStepCount?: boolean;\n showSkip?: boolean;\n};\n\ntype StepProps = WithChildren | WithIntl;\ntype ActionsProps = WithActionsChildren | WithActionsProps;\n\ntype Step = {\n Root: React.ForwardRefExoticComponent<React.ComponentProps<typeof Popover.Content>>;\n Title: (props: StepProps) => React.ReactNode;\n Content: (props: StepProps) => React.ReactNode;\n Actions: (props: ActionsProps) => React.ReactNode;\n};\n\nconst ActionsContainer = styled(Flex)`\n border-top: ${({ theme }) => `1px solid ${theme.colors.neutral150}`};\n`;\n\nconst createStepComponents = (tourName: ValidTourName): Step => ({\n Root: React.forwardRef((props, ref) => (\n <Popover.Content ref={ref} side=\"top\" align=\"center\" {...props}>\n <Flex width=\"360px\" direction=\"column\" alignItems=\"start\">\n {props.children}\n </Flex>\n </Popover.Content>\n )),\n\n Title: (props) => {\n return (\n <Box paddingTop={5} paddingLeft={5} paddingRight={5} paddingBottom={1} width=\"100%\">\n {'children' in props ? (\n props.children\n ) : (\n <Typography tag=\"div\" variant=\"omega\" fontWeight=\"bold\">\n <FormattedMessage tagName=\"h1\" id={props.id} defaultMessage={props.defaultMessage} />\n </Typography>\n )}\n </Box>\n );\n },\n\n Content: (props) => (\n <Box paddingBottom={5} paddingLeft={5} paddingRight={5} width=\"100%\">\n {'children' in props ? (\n props.children\n ) : (\n <Typography tag=\"div\" variant=\"omega\">\n <FormattedMessage tagName=\"p\" id={props.id} defaultMessage={props.defaultMessage} />\n </Typography>\n )}\n </Box>\n ),\n\n Actions: ({ showStepCount = true, showSkip = false, ...props }) => {\n const dispatch = unstableUseGuidedTour('GuidedTourPopover', (s) => s.dispatch);\n const state = unstableUseGuidedTour('GuidedTourPopover', (s) => s.state);\n const currentStep = state.tours[tourName].currentStep + 1;\n const tourLength = state.tours[tourName].length;\n\n return (\n <ActionsContainer width=\"100%\" padding={3} paddingLeft={5}>\n {'children' in props ? (\n props.children\n ) : (\n <Flex flex={1} justifyContent={showStepCount ? 'space-between' : 'flex-end'}>\n {showStepCount && (\n <Typography variant=\"omega\" fontSize=\"12px\">\n <FormattedMessage\n id=\"tours.stepCount\"\n defaultMessage=\"Step {currentStep} of {tourLength}\"\n values={{ currentStep, tourLength }}\n />\n </Typography>\n )}\n <Flex gap={2}>\n {showSkip && (\n <Button\n variant=\"tertiary\"\n onClick={() => dispatch({ type: 'skip_tour', payload: tourName })}\n >\n <FormattedMessage id=\"tours.skip\" defaultMessage=\"Skip\" />\n </Button>\n )}\n <Button onClick={() => dispatch({ type: 'next_step', payload: tourName })}>\n <FormattedMessage id=\"tours.next\" defaultMessage=\"Next\" />\n </Button>\n </Flex>\n </Flex>\n )}\n </ActionsContainer>\n );\n },\n});\n\nexport type { Step };\nexport { createStepComponents };\n"],"names":["ActionsContainer","styled","Flex","theme","colors","neutral150","createStepComponents","tourName","Root","React","forwardRef","props","ref","_jsx","Popover","Content","side","align","width","direction","alignItems","children","Title","Box","paddingTop","paddingLeft","paddingRight","paddingBottom","Typography","tag","variant","fontWeight","FormattedMessage","tagName","id","defaultMessage","Actions","showStepCount","showSkip","dispatch","unstableUseGuidedTour","s","state","currentStep","tours","tourLength","length","padding","_jsxs","flex","justifyContent","fontSize","values","gap","Button","onClick","type","payload"],"mappings":"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"}
|
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var React = require('react');
|
|
5
|
+
var designSystem = require('@strapi/design-system');
|
|
6
|
+
var styled = require('styled-components');
|
|
7
|
+
var Context = require('./Context.js');
|
|
8
|
+
var Step = require('./Step.js');
|
|
9
|
+
|
|
10
|
+
function _interopNamespaceDefault(e) {
|
|
11
|
+
var n = Object.create(null);
|
|
12
|
+
if (e) {
|
|
13
|
+
Object.keys(e).forEach(function (k) {
|
|
14
|
+
if (k !== 'default') {
|
|
15
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
16
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
17
|
+
enumerable: true,
|
|
18
|
+
get: function () { return e[k]; }
|
|
19
|
+
});
|
|
20
|
+
}
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
n.default = e;
|
|
24
|
+
return Object.freeze(n);
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
28
|
+
|
|
29
|
+
/* -------------------------------------------------------------------------------------------------
|
|
30
|
+
* Tours
|
|
31
|
+
* -----------------------------------------------------------------------------------------------*/ const tours = {
|
|
32
|
+
contentManager: createTour('contentManager', [
|
|
33
|
+
{
|
|
34
|
+
name: 'Introduction',
|
|
35
|
+
content: (Step)=>/*#__PURE__*/ jsxRuntime.jsxs(Step.Root, {
|
|
36
|
+
sideOffset: -36,
|
|
37
|
+
children: [
|
|
38
|
+
/*#__PURE__*/ jsxRuntime.jsx(Step.Title, {
|
|
39
|
+
id: "tours.contentManager.Introduction.title",
|
|
40
|
+
defaultMessage: "Content manager"
|
|
41
|
+
}),
|
|
42
|
+
/*#__PURE__*/ jsxRuntime.jsx(Step.Content, {
|
|
43
|
+
id: "tours.contentManager.Introduction.content",
|
|
44
|
+
defaultMessage: "Create and manage content from your collection types and single types."
|
|
45
|
+
}),
|
|
46
|
+
/*#__PURE__*/ jsxRuntime.jsx(Step.Actions, {
|
|
47
|
+
showSkip: true
|
|
48
|
+
})
|
|
49
|
+
]
|
|
50
|
+
})
|
|
51
|
+
}
|
|
52
|
+
])
|
|
53
|
+
};
|
|
54
|
+
const GuidedTourOverlay = styled.styled(designSystem.Box)`
|
|
55
|
+
position: fixed;
|
|
56
|
+
inset: 0;
|
|
57
|
+
background-color: rgba(50, 50, 77, 0.2);
|
|
58
|
+
z-index: 10;
|
|
59
|
+
pointer-events: none;
|
|
60
|
+
`;
|
|
61
|
+
const UnstableGuidedTourTooltip = ({ children, content, tourName, step })=>{
|
|
62
|
+
const state = Context.unstableUseGuidedTour('UnstableGuidedTourTooltip', (s)=>s.state);
|
|
63
|
+
const dispatch = Context.unstableUseGuidedTour('UnstableGuidedTourTooltip', (s)=>s.dispatch);
|
|
64
|
+
const Step$1 = React__namespace.useMemo(()=>Step.createStepComponents(tourName), [
|
|
65
|
+
tourName
|
|
66
|
+
]);
|
|
67
|
+
const isCurrentStep = state.tours[tourName].currentStep === step;
|
|
68
|
+
const isPopoverOpen = isCurrentStep && !state.tours[tourName].isCompleted;
|
|
69
|
+
// Lock the scroll
|
|
70
|
+
React__namespace.useEffect(()=>{
|
|
71
|
+
if (!isPopoverOpen) return;
|
|
72
|
+
const originalStyle = window.getComputedStyle(document.body).overflow;
|
|
73
|
+
document.body.style.overflow = 'hidden';
|
|
74
|
+
return ()=>{
|
|
75
|
+
document.body.style.overflow = originalStyle;
|
|
76
|
+
};
|
|
77
|
+
}, [
|
|
78
|
+
isPopoverOpen
|
|
79
|
+
]);
|
|
80
|
+
return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
81
|
+
children: [
|
|
82
|
+
isPopoverOpen && /*#__PURE__*/ jsxRuntime.jsx(GuidedTourOverlay, {}),
|
|
83
|
+
/*#__PURE__*/ jsxRuntime.jsxs(designSystem.Popover.Root, {
|
|
84
|
+
open: isPopoverOpen,
|
|
85
|
+
children: [
|
|
86
|
+
/*#__PURE__*/ jsxRuntime.jsx(designSystem.Popover.Anchor, {
|
|
87
|
+
children: children
|
|
88
|
+
}),
|
|
89
|
+
content(Step$1, {
|
|
90
|
+
state,
|
|
91
|
+
dispatch
|
|
92
|
+
})
|
|
93
|
+
]
|
|
94
|
+
})
|
|
95
|
+
]
|
|
96
|
+
});
|
|
97
|
+
};
|
|
98
|
+
function createTour(tourName, steps) {
|
|
99
|
+
const tour = steps.reduce((acc, step, index)=>{
|
|
100
|
+
if (step.name in acc) {
|
|
101
|
+
throw Error(`The tour: ${tourName} with step: ${step.name} has already been registered`);
|
|
102
|
+
}
|
|
103
|
+
acc[step.name] = ({ children })=>/*#__PURE__*/ jsxRuntime.jsx(UnstableGuidedTourTooltip, {
|
|
104
|
+
tourName: tourName,
|
|
105
|
+
step: index,
|
|
106
|
+
content: step.content,
|
|
107
|
+
children: children
|
|
108
|
+
});
|
|
109
|
+
return acc;
|
|
110
|
+
}, {});
|
|
111
|
+
return tour;
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
exports.GuidedTourOverlay = GuidedTourOverlay;
|
|
115
|
+
exports.tours = tours;
|
|
116
|
+
//# sourceMappingURL=Tours.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Tours.js","sources":["../../../../../../admin/src/components/UnstableGuidedTour/Tours.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Box, Popover } from '@strapi/design-system';\nimport { styled } from 'styled-components';\n\nimport { useAuth } from '../../features/Auth';\n\nimport { type State, type Action, unstableUseGuidedTour, ValidTourName } from './Context';\nimport { Step, createStepComponents } from './Step';\n\n/* -------------------------------------------------------------------------------------------------\n * Tours\n * -----------------------------------------------------------------------------------------------*/\n\nconst tours = {\n contentManager: createTour('contentManager', [\n {\n name: 'Introduction',\n content: (Step) => (\n <Step.Root sideOffset={-36}>\n <Step.Title\n id=\"tours.contentManager.Introduction.title\"\n defaultMessage=\"Content manager\"\n />\n <Step.Content\n id=\"tours.contentManager.Introduction.content\"\n defaultMessage=\"Create and manage content from your collection types and single types.\"\n />\n <Step.Actions showSkip />\n </Step.Root>\n ),\n },\n ]),\n} as const;\n\ntype Tours = typeof tours;\n\n/* -------------------------------------------------------------------------------------------------\n * GuidedTourTooltip\n * -----------------------------------------------------------------------------------------------*/\n\ntype Content = (\n Step: Step,\n {\n state,\n dispatch,\n }: {\n state: State;\n dispatch: React.Dispatch<Action>;\n }\n) => React.ReactNode;\n\nexport const GuidedTourOverlay = styled(Box)`\n position: fixed;\n inset: 0;\n background-color: rgba(50, 50, 77, 0.2);\n z-index: 10;\n pointer-events: none;\n`;\n\nconst UnstableGuidedTourTooltip = ({\n children,\n content,\n tourName,\n step,\n}: {\n children: React.ReactNode;\n content: Content;\n tourName: ValidTourName;\n step: number;\n}) => {\n const state = unstableUseGuidedTour('UnstableGuidedTourTooltip', (s) => s.state);\n const dispatch = unstableUseGuidedTour('UnstableGuidedTourTooltip', (s) => s.dispatch);\n const Step = React.useMemo(() => createStepComponents(tourName), [tourName]);\n\n const isCurrentStep = state.tours[tourName].currentStep === step;\n const isPopoverOpen = isCurrentStep && !state.tours[tourName].isCompleted;\n\n // Lock the scroll\n React.useEffect(() => {\n if (!isPopoverOpen) return;\n\n const originalStyle = window.getComputedStyle(document.body).overflow;\n document.body.style.overflow = 'hidden';\n\n return () => {\n document.body.style.overflow = originalStyle;\n };\n }, [isPopoverOpen]);\n\n return (\n <>\n {isPopoverOpen && <GuidedTourOverlay />}\n <Popover.Root open={isPopoverOpen}>\n <Popover.Anchor>{children}</Popover.Anchor>\n {content(Step, { state, dispatch })}\n </Popover.Root>\n </>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Tour factory\n * -----------------------------------------------------------------------------------------------*/\n\ntype TourStep<P extends string> = {\n name: P;\n content: Content;\n};\n\nfunction createTour<const T extends ReadonlyArray<TourStep<string>>>(tourName: string, steps: T) {\n type Components = {\n [K in T[number]['name']]: React.ComponentType<{ children: React.ReactNode }>;\n };\n\n const tour = steps.reduce((acc, step, index) => {\n if (step.name in acc) {\n throw Error(`The tour: ${tourName} with step: ${step.name} has already been registered`);\n }\n\n acc[step.name as keyof Components] = ({ children }: { children: React.ReactNode }) => (\n <UnstableGuidedTourTooltip\n tourName={tourName as ValidTourName}\n step={index}\n content={step.content}\n >\n {children}\n </UnstableGuidedTourTooltip>\n );\n\n return acc;\n }, {} as Components);\n\n return tour;\n}\n\nexport type { Content, Tours };\nexport { tours };\n"],"names":["tours","contentManager","createTour","name","content","Step","_jsxs","Root","sideOffset","_jsx","Title","id","defaultMessage","Content","Actions","showSkip","GuidedTourOverlay","styled","Box","UnstableGuidedTourTooltip","children","tourName","step","state","unstableUseGuidedTour","s","dispatch","React","useMemo","createStepComponents","isCurrentStep","currentStep","isPopoverOpen","isCompleted","useEffect","originalStyle","window","getComputedStyle","document","body","overflow","style","_Fragment","Popover","open","Anchor","steps","tour","reduce","acc","index","Error"],"mappings":"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"}
|
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { Box, Popover } from '@strapi/design-system';
|
|
4
|
+
import { styled } from 'styled-components';
|
|
5
|
+
import { unstableUseGuidedTour } from './Context.mjs';
|
|
6
|
+
import { createStepComponents } from './Step.mjs';
|
|
7
|
+
|
|
8
|
+
/* -------------------------------------------------------------------------------------------------
|
|
9
|
+
* Tours
|
|
10
|
+
* -----------------------------------------------------------------------------------------------*/ const tours = {
|
|
11
|
+
contentManager: createTour('contentManager', [
|
|
12
|
+
{
|
|
13
|
+
name: 'Introduction',
|
|
14
|
+
content: (Step)=>/*#__PURE__*/ jsxs(Step.Root, {
|
|
15
|
+
sideOffset: -36,
|
|
16
|
+
children: [
|
|
17
|
+
/*#__PURE__*/ jsx(Step.Title, {
|
|
18
|
+
id: "tours.contentManager.Introduction.title",
|
|
19
|
+
defaultMessage: "Content manager"
|
|
20
|
+
}),
|
|
21
|
+
/*#__PURE__*/ jsx(Step.Content, {
|
|
22
|
+
id: "tours.contentManager.Introduction.content",
|
|
23
|
+
defaultMessage: "Create and manage content from your collection types and single types."
|
|
24
|
+
}),
|
|
25
|
+
/*#__PURE__*/ jsx(Step.Actions, {
|
|
26
|
+
showSkip: true
|
|
27
|
+
})
|
|
28
|
+
]
|
|
29
|
+
})
|
|
30
|
+
}
|
|
31
|
+
])
|
|
32
|
+
};
|
|
33
|
+
const GuidedTourOverlay = styled(Box)`
|
|
34
|
+
position: fixed;
|
|
35
|
+
inset: 0;
|
|
36
|
+
background-color: rgba(50, 50, 77, 0.2);
|
|
37
|
+
z-index: 10;
|
|
38
|
+
pointer-events: none;
|
|
39
|
+
`;
|
|
40
|
+
const UnstableGuidedTourTooltip = ({ children, content, tourName, step })=>{
|
|
41
|
+
const state = unstableUseGuidedTour('UnstableGuidedTourTooltip', (s)=>s.state);
|
|
42
|
+
const dispatch = unstableUseGuidedTour('UnstableGuidedTourTooltip', (s)=>s.dispatch);
|
|
43
|
+
const Step = React.useMemo(()=>createStepComponents(tourName), [
|
|
44
|
+
tourName
|
|
45
|
+
]);
|
|
46
|
+
const isCurrentStep = state.tours[tourName].currentStep === step;
|
|
47
|
+
const isPopoverOpen = isCurrentStep && !state.tours[tourName].isCompleted;
|
|
48
|
+
// Lock the scroll
|
|
49
|
+
React.useEffect(()=>{
|
|
50
|
+
if (!isPopoverOpen) return;
|
|
51
|
+
const originalStyle = window.getComputedStyle(document.body).overflow;
|
|
52
|
+
document.body.style.overflow = 'hidden';
|
|
53
|
+
return ()=>{
|
|
54
|
+
document.body.style.overflow = originalStyle;
|
|
55
|
+
};
|
|
56
|
+
}, [
|
|
57
|
+
isPopoverOpen
|
|
58
|
+
]);
|
|
59
|
+
return /*#__PURE__*/ jsxs(Fragment, {
|
|
60
|
+
children: [
|
|
61
|
+
isPopoverOpen && /*#__PURE__*/ jsx(GuidedTourOverlay, {}),
|
|
62
|
+
/*#__PURE__*/ jsxs(Popover.Root, {
|
|
63
|
+
open: isPopoverOpen,
|
|
64
|
+
children: [
|
|
65
|
+
/*#__PURE__*/ jsx(Popover.Anchor, {
|
|
66
|
+
children: children
|
|
67
|
+
}),
|
|
68
|
+
content(Step, {
|
|
69
|
+
state,
|
|
70
|
+
dispatch
|
|
71
|
+
})
|
|
72
|
+
]
|
|
73
|
+
})
|
|
74
|
+
]
|
|
75
|
+
});
|
|
76
|
+
};
|
|
77
|
+
function createTour(tourName, steps) {
|
|
78
|
+
const tour = steps.reduce((acc, step, index)=>{
|
|
79
|
+
if (step.name in acc) {
|
|
80
|
+
throw Error(`The tour: ${tourName} with step: ${step.name} has already been registered`);
|
|
81
|
+
}
|
|
82
|
+
acc[step.name] = ({ children })=>/*#__PURE__*/ jsx(UnstableGuidedTourTooltip, {
|
|
83
|
+
tourName: tourName,
|
|
84
|
+
step: index,
|
|
85
|
+
content: step.content,
|
|
86
|
+
children: children
|
|
87
|
+
});
|
|
88
|
+
return acc;
|
|
89
|
+
}, {});
|
|
90
|
+
return tour;
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
export { GuidedTourOverlay, tours };
|
|
94
|
+
//# sourceMappingURL=Tours.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Tours.mjs","sources":["../../../../../../admin/src/components/UnstableGuidedTour/Tours.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Box, Popover } from '@strapi/design-system';\nimport { styled } from 'styled-components';\n\nimport { useAuth } from '../../features/Auth';\n\nimport { type State, type Action, unstableUseGuidedTour, ValidTourName } from './Context';\nimport { Step, createStepComponents } from './Step';\n\n/* -------------------------------------------------------------------------------------------------\n * Tours\n * -----------------------------------------------------------------------------------------------*/\n\nconst tours = {\n contentManager: createTour('contentManager', [\n {\n name: 'Introduction',\n content: (Step) => (\n <Step.Root sideOffset={-36}>\n <Step.Title\n id=\"tours.contentManager.Introduction.title\"\n defaultMessage=\"Content manager\"\n />\n <Step.Content\n id=\"tours.contentManager.Introduction.content\"\n defaultMessage=\"Create and manage content from your collection types and single types.\"\n />\n <Step.Actions showSkip />\n </Step.Root>\n ),\n },\n ]),\n} as const;\n\ntype Tours = typeof tours;\n\n/* -------------------------------------------------------------------------------------------------\n * GuidedTourTooltip\n * -----------------------------------------------------------------------------------------------*/\n\ntype Content = (\n Step: Step,\n {\n state,\n dispatch,\n }: {\n state: State;\n dispatch: React.Dispatch<Action>;\n }\n) => React.ReactNode;\n\nexport const GuidedTourOverlay = styled(Box)`\n position: fixed;\n inset: 0;\n background-color: rgba(50, 50, 77, 0.2);\n z-index: 10;\n pointer-events: none;\n`;\n\nconst UnstableGuidedTourTooltip = ({\n children,\n content,\n tourName,\n step,\n}: {\n children: React.ReactNode;\n content: Content;\n tourName: ValidTourName;\n step: number;\n}) => {\n const state = unstableUseGuidedTour('UnstableGuidedTourTooltip', (s) => s.state);\n const dispatch = unstableUseGuidedTour('UnstableGuidedTourTooltip', (s) => s.dispatch);\n const Step = React.useMemo(() => createStepComponents(tourName), [tourName]);\n\n const isCurrentStep = state.tours[tourName].currentStep === step;\n const isPopoverOpen = isCurrentStep && !state.tours[tourName].isCompleted;\n\n // Lock the scroll\n React.useEffect(() => {\n if (!isPopoverOpen) return;\n\n const originalStyle = window.getComputedStyle(document.body).overflow;\n document.body.style.overflow = 'hidden';\n\n return () => {\n document.body.style.overflow = originalStyle;\n };\n }, [isPopoverOpen]);\n\n return (\n <>\n {isPopoverOpen && <GuidedTourOverlay />}\n <Popover.Root open={isPopoverOpen}>\n <Popover.Anchor>{children}</Popover.Anchor>\n {content(Step, { state, dispatch })}\n </Popover.Root>\n </>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Tour factory\n * -----------------------------------------------------------------------------------------------*/\n\ntype TourStep<P extends string> = {\n name: P;\n content: Content;\n};\n\nfunction createTour<const T extends ReadonlyArray<TourStep<string>>>(tourName: string, steps: T) {\n type Components = {\n [K in T[number]['name']]: React.ComponentType<{ children: React.ReactNode }>;\n };\n\n const tour = steps.reduce((acc, step, index) => {\n if (step.name in acc) {\n throw Error(`The tour: ${tourName} with step: ${step.name} has already been registered`);\n }\n\n acc[step.name as keyof Components] = ({ children }: { children: React.ReactNode }) => (\n <UnstableGuidedTourTooltip\n tourName={tourName as ValidTourName}\n step={index}\n content={step.content}\n >\n {children}\n </UnstableGuidedTourTooltip>\n );\n\n return acc;\n }, {} as Components);\n\n return tour;\n}\n\nexport type { Content, Tours };\nexport { tours };\n"],"names":["tours","contentManager","createTour","name","content","Step","_jsxs","Root","sideOffset","_jsx","Title","id","defaultMessage","Content","Actions","showSkip","GuidedTourOverlay","styled","Box","UnstableGuidedTourTooltip","children","tourName","step","state","unstableUseGuidedTour","s","dispatch","React","useMemo","createStepComponents","isCurrentStep","currentStep","isPopoverOpen","isCompleted","useEffect","originalStyle","window","getComputedStyle","document","body","overflow","style","_Fragment","Popover","open","Anchor","steps","tour","reduce","acc","index","Error"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tracking.js","sources":["../../../../../admin/src/features/Tracking.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport axios, { AxiosResponse } from 'axios';\n\nimport { useInitQuery, useTelemetryPropertiesQuery } from '../services/admin';\n\nimport { useAppInfo } from './AppInfo';\nimport { useAuth } from './Auth';\nimport { useStrapiApp } from './StrapiApp';\n\nexport interface TelemetryProperties {\n useTypescriptOnServer?: boolean;\n useTypescriptOnAdmin?: boolean;\n isHostedOnStrapiCloud?: boolean;\n numberOfAllContentTypes?: number;\n numberOfComponents?: number;\n numberOfDynamicZones?: number;\n}\n\nexport interface TrackingContextValue {\n uuid?: string | boolean;\n telemetryProperties?: TelemetryProperties;\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Context\n * -----------------------------------------------------------------------------------------------*/\n\nconst TrackingContext = React.createContext<TrackingContextValue>({\n uuid: false,\n});\n\n/* -------------------------------------------------------------------------------------------------\n * Provider\n * -----------------------------------------------------------------------------------------------*/\n\nexport interface TrackingProviderProps {\n children: React.ReactNode;\n}\n\nconst TrackingProvider = ({ children }: TrackingProviderProps) => {\n const token = useAuth('App', (state) => state.token);\n const getAllWidgets = useStrapiApp('TrackingProvider', (state) => state.widgets.getAll);\n const { data: initData } = useInitQuery();\n const { uuid } = initData ?? {};\n\n const { data } = useTelemetryPropertiesQuery(undefined, {\n skip: !initData?.uuid || !token,\n });\n\n React.useEffect(() => {\n if (uuid && data) {\n const event = 'didInitializeAdministration';\n try {\n fetch('https://analytics.strapi.io/api/v2/track', {\n method: 'POST',\n body: JSON.stringify({\n // This event is anonymous\n event,\n userId: '',\n eventPropeties: {},\n groupProperties: {\n ...data,\n projectId: uuid,\n registeredWidgets: getAllWidgets().map((widget) => widget.uid),\n },\n }),\n headers: {\n 'Content-Type': 'application/json',\n 'X-Strapi-Event': event,\n },\n });\n } catch {\n // silence is golden\n }\n }\n }, [data, uuid, getAllWidgets]);\n\n const value = React.useMemo(\n () => ({\n uuid,\n telemetryProperties: data,\n }),\n [uuid, data]\n );\n\n return <TrackingContext.Provider value={value}>{children}</TrackingContext.Provider>;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Hook\n * -----------------------------------------------------------------------------------------------*/\n\n/**\n * We can group these events together because none have properties so there's no benefit\n * to having them as separate types.\n *\n * Meanwhile those with properties have different property shapes corresponding to the specific\n * event so understanding which properties go with which event is very helpful.\n */\ninterface EventWithoutProperties {\n name:\n | 'changeComponentsOrder'\n | 'didAccessAuthenticatedAdministration'\n | 'didAddComponentToDynamicZone'\n | 'didBulkDeleteEntries'\n | 'didNotBulkDeleteEntries'\n | 'didChangeDisplayedFields'\n | 'didCheckDraftRelations'\n | 'didClickGuidedTourHomepageApiTokens'\n | 'didClickGuidedTourHomepageContentManager'\n | 'didClickGuidedTourHomepageContentTypeBuilder'\n | 'didClickGuidedTourStep1CollectionType'\n | 'didClickGuidedTourStep2ContentManager'\n | 'didClickGuidedTourStep3ApiTokens'\n | 'didClickonBlogSection'\n | 'didClickonCodeExampleSection'\n | 'didClickonReadTheDocumentationSection'\n | 'didClickOnTryStrapiCloudSection'\n | 'didClickonTutorialSection'\n | 'didCreateGuidedTourCollectionType'\n | 'didCreateGuidedTourEntry'\n | 'didCreateNewRole'\n | 'didCreateRole'\n | 'didDeleteToken'\n | 'didDuplicateRole'\n | 'didEditEditSettings'\n | 'didEditEmailTemplates'\n | 'didEditFieldNameOnContentType'\n | 'didEditListSettings'\n | 'didEditMediaLibraryConfig'\n | 'didEditNameOfContentType'\n | 'didGenerateGuidedTourApiTokens'\n | 'didGoToMarketplace'\n | 'didLaunchGuidedtour'\n | 'didMissMarketplacePlugin'\n | 'didNotCreateFirstAdmin'\n | 'didNotSaveComponent'\n | 'didPluginLearnMore'\n | 'didBulkPublishEntries'\n | 'didNotBulkPublishEntries'\n | 'didUnpublishEntry'\n | 'didBulkUnpublishEntries'\n | 'didNotBulkUnpublishEntries'\n | 'didSaveComponent'\n | 'didSaveContentType'\n | 'didSearch'\n | 'didSkipGuidedtour'\n | 'didSubmitPlugin'\n | 'didSubmitProvider'\n | 'didUpdateConditions'\n | 'didSelectAllMediaLibraryElements'\n | 'didSelectContentTypeFieldSettings'\n | 'didSelectContentTypeSettings'\n | 'didEditAuthenticationProvider'\n | 'didRestoreHistoryVersion'\n | 'hasClickedCTBAddFieldBanner'\n | 'removeComponentFromDynamicZone'\n | 'willAddMoreFieldToContentType'\n | 'willBulkDeleteEntries'\n | 'willBulkPublishEntries'\n | 'willBulkUnpublishEntries'\n | 'willChangeNumberOfEntriesPerPage'\n | 'willCheckDraftRelations'\n | 'willCreateComponent'\n | 'willCreateComponentFromAttributesModal'\n | 'willCreateContentType'\n | 'willCreateFirstAdmin'\n | 'willCreateNewRole'\n | 'willCreateRole'\n | 'willCreateSingleType'\n | 'willCreateStage'\n | 'willCreateWorkflow'\n | 'willDeleteEntryFromList'\n | 'willDeleteFieldOfContentType'\n | 'willDuplicateRole'\n | 'willEditEditLayout'\n | 'willEditEmailTemplates'\n | 'willEditEntryFromButton'\n | 'willEditEntryFromHome'\n | 'willEditEntryFromList'\n | 'willEditFieldOfContentType'\n | 'willEditMediaLibraryConfig'\n | 'willEditNameOfContentType'\n | 'willEditNameOfSingleType'\n | 'willEditAuthenticationProvider'\n | 'willEditFieldNameOnContentType'\n | 'willEditStage'\n | 'willFilterEntries'\n | 'willInstallPlugin'\n | 'willUnpublishEntry'\n | 'willSaveComponent'\n | 'willSaveContentType'\n | 'willSaveContentTypeLayout'\n | 'didEditFieldNameOnContentType'\n | 'didCreateRelease';\n properties?: never;\n}\n\ninterface DidFilterMediaLibraryElementsEvent {\n name: 'didFilterMediaLibraryElements';\n properties: MediaEvents['properties'] & {\n filter: string;\n };\n}\n\ninterface DidSortMediaLibraryElementsEvent {\n name: 'didSortMediaLibraryElements';\n properties: MediaEvents['properties'] & {\n sort: string;\n };\n}\n\ninterface DidCropFileEvent {\n name: 'didCropFile';\n properties: MediaEvents['properties'] & {\n duplicatedFile: null | boolean;\n };\n}\n\ninterface DidSelectFile {\n name: 'didSelectFile';\n properties: MediaEvents['properties'] & {\n source: 'url' | 'computer';\n };\n}\n\ninterface DidEditMediaLibraryElementsEvent {\n name: 'didEditMediaLibraryElements';\n properties: MediaEvents['properties'] & {\n type: string;\n changeLocation: string | boolean;\n };\n}\n\ninterface MediaEvents {\n name:\n | 'didSearchMediaLibraryElements'\n | 'didReplaceMedia'\n | 'didAddMediaLibraryFolders'\n | 'willAddMediaLibraryAssets';\n properties: {\n location: string;\n };\n}\n\ninterface DidSelectContentTypeFieldTypeEvent {\n name: 'didSelectContentTypeFieldType';\n properties: {\n type?: string;\n };\n}\n\ninterface DidChangeModeEvent {\n name: 'didChangeMode';\n properties: {\n newMode: string;\n };\n}\ninterface DidSubmitWithErrorsFirstAdminEvent {\n name: 'didSubmitWithErrorsFirstAdmin';\n properties: {\n count: string;\n };\n}\n\ninterface WillNavigateEvent {\n name: 'willNavigate';\n properties: {\n from: string;\n to: string;\n };\n}\n\ninterface DidAccessTokenListEvent {\n name: 'didAccessTokenList';\n properties: {\n tokenType: TokenEvents['properties']['tokenType'];\n number: number;\n };\n}\ninterface LogoEvent {\n name: 'didChangeLogo' | 'didClickResetLogo';\n properties: {\n logo: 'menu' | 'auth';\n };\n}\n\ninterface TokenEvents {\n name:\n | 'didCopyTokenKey'\n | 'didAddTokenFromList'\n | 'didEditTokenFromList'\n | 'willAccessTokenList'\n | 'willAddTokenFromList'\n | 'willCreateToken'\n | 'willDeleteToken'\n | 'willEditToken'\n | 'willEditTokenFromList';\n properties: {\n tokenType: 'api-token' | 'transfer-token';\n };\n}\n\ninterface WillModifyTokenEvent {\n name: 'didCreateToken' | 'didEditToken';\n properties: {\n tokenType: TokenEvents['properties']['tokenType'];\n type: 'custom' | 'full-access' | 'read-only' | Array<'push' | 'pull' | 'push-pull'>;\n };\n}\n\ninterface DeleteEntryEvents {\n name: 'willDeleteEntry' | 'didDeleteEntry' | 'didNotDeleteEntry';\n properties: {\n status?: string;\n error?: unknown;\n };\n}\n\ninterface CreateEntryEvents {\n name: 'willCreateEntry' | 'didCreateEntry' | 'didNotCreateEntry';\n properties: {\n documentId?: string;\n status?: string;\n error?: unknown;\n fromPreview?: boolean;\n fromRelationModal?: boolean;\n };\n}\n\ninterface PublishEntryEvents {\n name: 'willPublishEntry' | 'didPublishEntry';\n properties: {\n documentId?: string;\n fromPreview?: boolean;\n fromRelationModal?: boolean;\n };\n}\n\ninterface UpdateEntryEvents {\n name: 'willEditEntry' | 'didEditEntry' | 'didNotEditEntry';\n properties: {\n documentId?: string;\n status?: string;\n error?: unknown;\n fromPreview?: boolean;\n fromRelationModal?: boolean;\n };\n}\n\ninterface DidFilterEntriesEvent {\n name: 'didFilterEntries';\n properties: {\n useRelation: boolean;\n };\n}\n\ninterface DidPublishRelease {\n name: 'didPublishRelease';\n properties: {\n totalEntries: number;\n totalPublishedEntries: number;\n totalUnpublishedEntries: number;\n };\n}\n\ntype EventsWithProperties =\n | CreateEntryEvents\n | PublishEntryEvents\n | DidAccessTokenListEvent\n | DidChangeModeEvent\n | DidCropFileEvent\n | DeleteEntryEvents\n | DidEditMediaLibraryElementsEvent\n | DidFilterMediaLibraryElementsEvent\n | DidFilterEntriesEvent\n | DidSelectContentTypeFieldTypeEvent\n | DidSelectFile\n | DidSortMediaLibraryElementsEvent\n | DidSubmitWithErrorsFirstAdminEvent\n | LogoEvent\n | TokenEvents\n | UpdateEntryEvents\n | WillModifyTokenEvent\n | WillNavigateEvent\n | DidPublishRelease\n | MediaEvents;\n\nexport type TrackingEvent = EventWithoutProperties | EventsWithProperties;\nexport interface UseTrackingReturn {\n /**\n * This type helps show all the available event names before you start typing,\n * however autocomplete isn't great.\n */\n trackUsage<TEvent extends TrackingEvent>(\n event: TEvent['name'],\n properties: TEvent['properties']\n ): Promise<null | AxiosResponse<string>>;\n trackUsage<TEvent extends Extract<TrackingEvent, { properties?: never }>>(\n event: TEvent['name'],\n properties?: never\n ): Promise<null | AxiosResponse<string>>;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n trackUsage<TEvent extends Extract<TrackingEvent, { properties: object }>>(\n event: TEvent['name'],\n properties: TEvent['properties']\n ): Promise<null | AxiosResponse<string>>;\n}\n\n/**\n * @description Used to send amplitude events to the Strapi Tracking hub.\n *\n * @example\n * ```tsx\n * import { useTracking } from '@strapi/strapi/admin';\n *\n * const MyComponent = () => {\n * const { trackUsage } = useTracking();\n *\n * const handleClick = () => {\n * trackUsage('my-event', { myProperty: 'myValue' });\n * }\n *\n * return <button onClick={handleClick}>Send Event</button>\n * }\n * ```\n */\nconst useTracking = (): UseTrackingReturn => {\n const { uuid, telemetryProperties } = React.useContext(TrackingContext);\n const userId = useAppInfo('useTracking', (state) => state.userId);\n const trackUsage = React.useCallback(\n async <TEvent extends TrackingEvent>(\n event: TEvent['name'],\n properties?: TEvent['properties']\n ) => {\n try {\n if (uuid && !window.strapi.telemetryDisabled) {\n const res = await axios.post<string>(\n 'https://analytics.strapi.io/api/v2/track',\n {\n event,\n userId,\n eventProperties: { ...properties },\n userProperties: {},\n groupProperties: {\n ...telemetryProperties,\n projectId: uuid,\n projectType: window.strapi.projectType,\n },\n },\n {\n headers: {\n 'Content-Type': 'application/json',\n 'X-Strapi-Event': event,\n },\n }\n );\n\n return res;\n }\n } catch (err) {\n // Silence is golden\n }\n\n return null;\n },\n [telemetryProperties, userId, uuid]\n );\n\n return { trackUsage };\n};\n\nexport { TrackingProvider, useTracking };\n"],"names":["TrackingContext","React","createContext","uuid","TrackingProvider","children","token","useAuth","state","getAllWidgets","useStrapiApp","widgets","getAll","data","initData","useInitQuery","useTelemetryPropertiesQuery","undefined","skip","useEffect","event","fetch","method","body","JSON","stringify","userId","eventPropeties","groupProperties","projectId","registeredWidgets","map","widget","uid","headers","value","useMemo","telemetryProperties","_jsx","Provider","useTracking","useContext","useAppInfo","trackUsage","useCallback","properties","window","strapi","telemetryDisabled","res","axios","post","eventProperties","userProperties","projectType","err"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Tracking.js","sources":["../../../../../admin/src/features/Tracking.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport axios, { AxiosResponse } from 'axios';\n\nimport { useInitQuery, useTelemetryPropertiesQuery } from '../services/admin';\n\nimport { useAppInfo } from './AppInfo';\nimport { useAuth } from './Auth';\nimport { useStrapiApp } from './StrapiApp';\n\nexport interface TelemetryProperties {\n useTypescriptOnServer?: boolean;\n useTypescriptOnAdmin?: boolean;\n isHostedOnStrapiCloud?: boolean;\n numberOfAllContentTypes?: number;\n numberOfComponents?: number;\n numberOfDynamicZones?: number;\n}\n\nexport interface TrackingContextValue {\n uuid?: string | boolean;\n telemetryProperties?: TelemetryProperties;\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Context\n * -----------------------------------------------------------------------------------------------*/\n\nconst TrackingContext = React.createContext<TrackingContextValue>({\n uuid: false,\n});\n\n/* -------------------------------------------------------------------------------------------------\n * Provider\n * -----------------------------------------------------------------------------------------------*/\n\nexport interface TrackingProviderProps {\n children: React.ReactNode;\n}\n\nconst TrackingProvider = ({ children }: TrackingProviderProps) => {\n const token = useAuth('App', (state) => state.token);\n const getAllWidgets = useStrapiApp('TrackingProvider', (state) => state.widgets.getAll);\n const { data: initData } = useInitQuery();\n const { uuid } = initData ?? {};\n\n const { data } = useTelemetryPropertiesQuery(undefined, {\n skip: !initData?.uuid || !token,\n });\n\n React.useEffect(() => {\n if (uuid && data) {\n const event = 'didInitializeAdministration';\n try {\n fetch('https://analytics.strapi.io/api/v2/track', {\n method: 'POST',\n body: JSON.stringify({\n // This event is anonymous\n event,\n userId: '',\n eventPropeties: {},\n groupProperties: {\n ...data,\n projectId: uuid,\n registeredWidgets: getAllWidgets().map((widget) => widget.uid),\n },\n }),\n headers: {\n 'Content-Type': 'application/json',\n 'X-Strapi-Event': event,\n },\n });\n } catch {\n // silence is golden\n }\n }\n }, [data, uuid, getAllWidgets]);\n\n const value = React.useMemo(\n () => ({\n uuid,\n telemetryProperties: data,\n }),\n [uuid, data]\n );\n\n return <TrackingContext.Provider value={value}>{children}</TrackingContext.Provider>;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Hook\n * -----------------------------------------------------------------------------------------------*/\n\n/**\n * We can group these events together because none have properties so there's no benefit\n * to having them as separate types.\n *\n * Meanwhile those with properties have different property shapes corresponding to the specific\n * event so understanding which properties go with which event is very helpful.\n */\ninterface EventWithoutProperties {\n name:\n | 'changeComponentsOrder'\n | 'didAccessAuthenticatedAdministration'\n | 'didAddComponentToDynamicZone'\n | 'didBulkDeleteEntries'\n | 'didNotBulkDeleteEntries'\n | 'didChangeDisplayedFields'\n | 'didCheckDraftRelations'\n | 'didClickGuidedTourHomepageApiTokens'\n | 'didClickGuidedTourHomepageContentManager'\n | 'didClickGuidedTourHomepageContentTypeBuilder'\n | 'didClickGuidedTourStep1CollectionType'\n | 'didClickGuidedTourStep2ContentManager'\n | 'didClickGuidedTourStep3ApiTokens'\n | 'didClickonBlogSection'\n | 'didClickonCodeExampleSection'\n | 'didClickonReadTheDocumentationSection'\n | 'didClickOnTryStrapiCloudSection'\n | 'didClickonTutorialSection'\n | 'didCreateGuidedTourCollectionType'\n | 'didCreateGuidedTourEntry'\n | 'didCreateNewRole'\n | 'didCreateRole'\n | 'didDeleteToken'\n | 'didDuplicateRole'\n | 'didEditEditSettings'\n | 'didEditEmailTemplates'\n | 'didEditFieldNameOnContentType'\n | 'didEditListSettings'\n | 'didEditMediaLibraryConfig'\n | 'didEditNameOfContentType'\n | 'didGenerateGuidedTourApiTokens'\n | 'didGoToMarketplace'\n | 'didLaunchGuidedtour'\n | 'didMissMarketplacePlugin'\n | 'didNotCreateFirstAdmin'\n | 'didNotSaveComponent'\n | 'didPluginLearnMore'\n | 'didBulkPublishEntries'\n | 'didNotBulkPublishEntries'\n | 'didUnpublishEntry'\n | 'didBulkUnpublishEntries'\n | 'didNotBulkUnpublishEntries'\n | 'didSaveComponent'\n | 'didSaveContentType'\n | 'didSearch'\n | 'didSkipGuidedtour'\n | 'didSubmitPlugin'\n | 'didSubmitProvider'\n | 'didUpdateConditions'\n | 'didSelectAllMediaLibraryElements'\n | 'didSelectContentTypeFieldSettings'\n | 'didSelectContentTypeSettings'\n | 'didEditAuthenticationProvider'\n | 'didRestoreHistoryVersion'\n | 'hasClickedCTBAddFieldBanner'\n | 'removeComponentFromDynamicZone'\n | 'willAddMoreFieldToContentType'\n | 'willBulkDeleteEntries'\n | 'willBulkPublishEntries'\n | 'willBulkUnpublishEntries'\n | 'willChangeNumberOfEntriesPerPage'\n | 'willCheckDraftRelations'\n | 'willCreateComponent'\n | 'willCreateComponentFromAttributesModal'\n | 'willCreateContentType'\n | 'willCreateFirstAdmin'\n | 'willCreateNewRole'\n | 'willCreateRole'\n | 'willCreateSingleType'\n | 'willCreateStage'\n | 'willCreateWorkflow'\n | 'willDeleteEntryFromList'\n | 'willDeleteFieldOfContentType'\n | 'willDuplicateRole'\n | 'willEditEditLayout'\n | 'willEditEmailTemplates'\n | 'willEditEntryFromButton'\n | 'willEditEntryFromHome'\n | 'willEditEntryFromList'\n | 'willEditFieldOfContentType'\n | 'willEditMediaLibraryConfig'\n | 'willEditNameOfContentType'\n | 'willEditNameOfSingleType'\n | 'willEditAuthenticationProvider'\n | 'willEditFieldNameOnContentType'\n | 'willEditStage'\n | 'willFilterEntries'\n | 'willInstallPlugin'\n | 'willUnpublishEntry'\n | 'willSaveComponent'\n | 'willSaveContentType'\n | 'willSaveContentTypeLayout'\n | 'didEditFieldNameOnContentType'\n | 'didCreateRelease';\n properties?: never;\n}\n\ninterface DidFilterMediaLibraryElementsEvent {\n name: 'didFilterMediaLibraryElements';\n properties: MediaEvents['properties'] & {\n filter: string;\n };\n}\n\ninterface DidSortMediaLibraryElementsEvent {\n name: 'didSortMediaLibraryElements';\n properties: MediaEvents['properties'] & {\n sort: string;\n };\n}\n\ninterface DidCropFileEvent {\n name: 'didCropFile';\n properties: MediaEvents['properties'] & {\n duplicatedFile: null | boolean;\n };\n}\n\ninterface DidSelectFile {\n name: 'didSelectFile';\n properties: MediaEvents['properties'] & {\n source: 'url' | 'computer';\n };\n}\n\ninterface DidEditMediaLibraryElementsEvent {\n name: 'didEditMediaLibraryElements';\n properties: MediaEvents['properties'] & {\n type: string;\n changeLocation: string | boolean;\n };\n}\n\ninterface MediaEvents {\n name:\n | 'didSearchMediaLibraryElements'\n | 'didReplaceMedia'\n | 'didAddMediaLibraryFolders'\n | 'willAddMediaLibraryAssets';\n properties: {\n location: string;\n };\n}\n\ninterface DidSelectContentTypeFieldTypeEvent {\n name: 'didSelectContentTypeFieldType';\n properties: {\n type?: string;\n };\n}\n\ninterface DidChangeModeEvent {\n name: 'didChangeMode';\n properties: {\n newMode: string;\n };\n}\ninterface DidSubmitWithErrorsFirstAdminEvent {\n name: 'didSubmitWithErrorsFirstAdmin';\n properties: {\n count: string;\n };\n}\n\ninterface WillNavigateEvent {\n name: 'willNavigate';\n properties: {\n from: string;\n to: string;\n };\n}\n\ninterface DidAccessTokenListEvent {\n name: 'didAccessTokenList';\n properties: {\n tokenType: TokenEvents['properties']['tokenType'];\n number: number;\n };\n}\ninterface LogoEvent {\n name: 'didChangeLogo' | 'didClickResetLogo';\n properties: {\n logo: 'menu' | 'auth';\n };\n}\n\ninterface TokenEvents {\n name:\n | 'didCopyTokenKey'\n | 'didAddTokenFromList'\n | 'didEditTokenFromList'\n | 'willAccessTokenList'\n | 'willAddTokenFromList'\n | 'willCreateToken'\n | 'willDeleteToken'\n | 'willEditToken'\n | 'willEditTokenFromList';\n properties: {\n tokenType: 'api-token' | 'transfer-token';\n };\n}\n\ninterface WillModifyTokenEvent {\n name: 'didCreateToken' | 'didEditToken';\n properties: {\n tokenType: TokenEvents['properties']['tokenType'];\n type: 'custom' | 'full-access' | 'read-only' | Array<'push' | 'pull' | 'push-pull'>;\n };\n}\n\ninterface DeleteEntryEvents {\n name: 'willDeleteEntry' | 'didDeleteEntry' | 'didNotDeleteEntry';\n properties: {\n status?: string;\n error?: unknown;\n };\n}\n\ninterface CreateEntryEvents {\n name: 'willCreateEntry' | 'didCreateEntry' | 'didNotCreateEntry';\n properties: {\n documentId?: string;\n status?: string;\n error?: unknown;\n fromPreview?: boolean;\n fromRelationModal?: boolean;\n };\n}\n\ninterface PublishEntryEvents {\n name: 'willPublishEntry' | 'didPublishEntry';\n properties: {\n documentId?: string;\n fromPreview?: boolean;\n fromRelationModal?: boolean;\n };\n}\n\ninterface UpdateEntryEvents {\n name: 'willEditEntry' | 'didEditEntry' | 'didNotEditEntry';\n properties: {\n documentId?: string;\n status?: string;\n error?: unknown;\n fromPreview?: boolean;\n fromRelationModal?: boolean;\n };\n}\n\ninterface DidFilterEntriesEvent {\n name: 'didFilterEntries';\n properties: {\n useRelation: boolean;\n };\n}\n\ninterface DidPublishRelease {\n name: 'didPublishRelease';\n properties: {\n totalEntries: number;\n totalPublishedEntries: number;\n totalUnpublishedEntries: number;\n };\n}\n\ninterface DidUpdateCTBSchema {\n name: 'didUpdateCTBSchema';\n properties: {\n success: boolean;\n newContentTypes: number;\n editedContentTypes: number;\n deletedContentTypes: number;\n newComponents: number;\n editedComponents: number;\n deletedComponents: number;\n newFields: number;\n editedFields: number;\n deletedFields: number;\n };\n}\n\ntype EventsWithProperties =\n | CreateEntryEvents\n | PublishEntryEvents\n | DidAccessTokenListEvent\n | DidChangeModeEvent\n | DidCropFileEvent\n | DeleteEntryEvents\n | DidEditMediaLibraryElementsEvent\n | DidFilterMediaLibraryElementsEvent\n | DidFilterEntriesEvent\n | DidSelectContentTypeFieldTypeEvent\n | DidSelectFile\n | DidSortMediaLibraryElementsEvent\n | DidSubmitWithErrorsFirstAdminEvent\n | LogoEvent\n | TokenEvents\n | UpdateEntryEvents\n | WillModifyTokenEvent\n | WillNavigateEvent\n | DidPublishRelease\n | MediaEvents\n | DidUpdateCTBSchema;\n\nexport type TrackingEvent = EventWithoutProperties | EventsWithProperties;\nexport interface UseTrackingReturn {\n /**\n * This type helps show all the available event names before you start typing,\n * however autocomplete isn't great.\n */\n trackUsage<TEvent extends TrackingEvent>(\n event: TEvent['name'],\n properties: TEvent['properties']\n ): Promise<null | AxiosResponse<string>>;\n trackUsage<TEvent extends Extract<TrackingEvent, { properties?: never }>>(\n event: TEvent['name'],\n properties?: never\n ): Promise<null | AxiosResponse<string>>;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n trackUsage<TEvent extends Extract<TrackingEvent, { properties: object }>>(\n event: TEvent['name'],\n properties: TEvent['properties']\n ): Promise<null | AxiosResponse<string>>;\n}\n\n/**\n * @description Used to send amplitude events to the Strapi Tracking hub.\n *\n * @example\n * ```tsx\n * import { useTracking } from '@strapi/strapi/admin';\n *\n * const MyComponent = () => {\n * const { trackUsage } = useTracking();\n *\n * const handleClick = () => {\n * trackUsage('my-event', { myProperty: 'myValue' });\n * }\n *\n * return <button onClick={handleClick}>Send Event</button>\n * }\n * ```\n */\nconst useTracking = (): UseTrackingReturn => {\n const { uuid, telemetryProperties } = React.useContext(TrackingContext);\n const userId = useAppInfo('useTracking', (state) => state.userId);\n const trackUsage = React.useCallback(\n async <TEvent extends TrackingEvent>(\n event: TEvent['name'],\n properties?: TEvent['properties']\n ) => {\n try {\n if (uuid && !window.strapi.telemetryDisabled) {\n const res = await axios.post<string>(\n 'https://analytics.strapi.io/api/v2/track',\n {\n event,\n userId,\n eventProperties: { ...properties },\n userProperties: {},\n groupProperties: {\n ...telemetryProperties,\n projectId: uuid,\n projectType: window.strapi.projectType,\n },\n },\n {\n headers: {\n 'Content-Type': 'application/json',\n 'X-Strapi-Event': event,\n },\n }\n );\n\n return res;\n }\n } catch (err) {\n // Silence is golden\n }\n\n return null;\n },\n [telemetryProperties, userId, uuid]\n );\n\n return { trackUsage };\n};\n\nexport { TrackingProvider, useTracking };\n"],"names":["TrackingContext","React","createContext","uuid","TrackingProvider","children","token","useAuth","state","getAllWidgets","useStrapiApp","widgets","getAll","data","initData","useInitQuery","useTelemetryPropertiesQuery","undefined","skip","useEffect","event","fetch","method","body","JSON","stringify","userId","eventPropeties","groupProperties","projectId","registeredWidgets","map","widget","uid","headers","value","useMemo","telemetryProperties","_jsx","Provider","useTracking","useContext","useAppInfo","trackUsage","useCallback","properties","window","strapi","telemetryDisabled","res","axios","post","eventProperties","userProperties","projectType","err"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwBA;;AAEkG,qGAElG,MAAMA,eAAAA,iBAAkBC,gBAAMC,CAAAA,aAAa,CAAuB;IAChEC,IAAM,EAAA;AACR,CAAA,CAAA;AAUA,MAAMC,gBAAmB,GAAA,CAAC,EAAEC,QAAQ,EAAyB,GAAA;AAC3D,IAAA,MAAMC,QAAQC,YAAQ,CAAA,KAAA,EAAO,CAACC,KAAAA,GAAUA,MAAMF,KAAK,CAAA;IACnD,MAAMG,aAAAA,GAAgBC,uBAAa,kBAAoB,EAAA,CAACF,QAAUA,KAAMG,CAAAA,OAAO,CAACC,MAAM,CAAA;AACtF,IAAA,MAAM,EAAEC,IAAAA,EAAMC,QAAQ,EAAE,GAAGC,kBAAAA,EAAAA;AAC3B,IAAA,MAAM,EAAEZ,IAAI,EAAE,GAAGW,YAAY,EAAC;AAE9B,IAAA,MAAM,EAAED,IAAI,EAAE,GAAGG,kCAA4BC,SAAW,EAAA;QACtDC,IAAM,EAAA,CAACJ,QAAUX,EAAAA,IAAAA,IAAQ,CAACG;AAC5B,KAAA,CAAA;AAEAL,IAAAA,gBAAAA,CAAMkB,SAAS,CAAC,IAAA;AACd,QAAA,IAAIhB,QAAQU,IAAM,EAAA;AAChB,YAAA,MAAMO,KAAQ,GAAA,6BAAA;YACd,IAAI;AACFC,gBAAAA,KAAAA,CAAM,0CAA4C,EAAA;oBAChDC,MAAQ,EAAA,MAAA;oBACRC,IAAMC,EAAAA,IAAAA,CAAKC,SAAS,CAAC;;AAEnBL,wBAAAA,KAAAA;wBACAM,MAAQ,EAAA,EAAA;AACRC,wBAAAA,cAAAA,EAAgB,EAAC;wBACjBC,eAAiB,EAAA;AACf,4BAAA,GAAGf,IAAI;4BACPgB,SAAW1B,EAAAA,IAAAA;AACX2B,4BAAAA,iBAAAA,EAAmBrB,gBAAgBsB,GAAG,CAAC,CAACC,MAAAA,GAAWA,OAAOC,GAAG;AAC/D;AACF,qBAAA,CAAA;oBACAC,OAAS,EAAA;wBACP,cAAgB,EAAA,kBAAA;wBAChB,gBAAkBd,EAAAA;AACpB;AACF,iBAAA,CAAA;AACF,aAAA,CAAE,OAAM;;AAER;AACF;KACC,EAAA;AAACP,QAAAA,IAAAA;AAAMV,QAAAA,IAAAA;AAAMM,QAAAA;AAAc,KAAA,CAAA;AAE9B,IAAA,MAAM0B,KAAQlC,GAAAA,gBAAAA,CAAMmC,OAAO,CACzB,KAAO;AACLjC,YAAAA,IAAAA;YACAkC,mBAAqBxB,EAAAA;AACvB,SAAA,CACA,EAAA;AAACV,QAAAA,IAAAA;AAAMU,QAAAA;AAAK,KAAA,CAAA;IAGd,qBAAOyB,cAAA,CAACtC,gBAAgBuC,QAAQ,EAAA;QAACJ,KAAOA,EAAAA,KAAAA;AAAQ9B,QAAAA,QAAAA,EAAAA;;AAClD;AAoVA;;;;;;;;;;;;;;;;;AAiBC,UACKmC,WAAc,GAAA,IAAA;IAClB,MAAM,EAAErC,IAAI,EAAEkC,mBAAmB,EAAE,GAAGpC,gBAAAA,CAAMwC,UAAU,CAACzC,eAAAA,CAAAA;AACvD,IAAA,MAAM0B,SAASgB,kBAAW,CAAA,aAAA,EAAe,CAAClC,KAAAA,GAAUA,MAAMkB,MAAM,CAAA;AAChE,IAAA,MAAMiB,UAAa1C,GAAAA,gBAAAA,CAAM2C,WAAW,CAClC,OACExB,KACAyB,EAAAA,UAAAA,GAAAA;QAEA,IAAI;AACF,YAAA,IAAI1C,QAAQ,CAAC2C,MAAAA,CAAOC,MAAM,CAACC,iBAAiB,EAAE;AAC5C,gBAAA,MAAMC,GAAM,GAAA,MAAMC,KAAMC,CAAAA,IAAI,CAC1B,0CACA,EAAA;AACE/B,oBAAAA,KAAAA;AACAM,oBAAAA,MAAAA;oBACA0B,eAAiB,EAAA;AAAE,wBAAA,GAAGP;AAAW,qBAAA;AACjCQ,oBAAAA,cAAAA,EAAgB,EAAC;oBACjBzB,eAAiB,EAAA;AACf,wBAAA,GAAGS,mBAAmB;wBACtBR,SAAW1B,EAAAA,IAAAA;wBACXmD,WAAaR,EAAAA,MAAAA,CAAOC,MAAM,CAACO;AAC7B;iBAEF,EAAA;oBACEpB,OAAS,EAAA;wBACP,cAAgB,EAAA,kBAAA;wBAChB,gBAAkBd,EAAAA;AACpB;AACF,iBAAA,CAAA;gBAGF,OAAO6B,GAAAA;AACT;AACF,SAAA,CAAE,OAAOM,GAAK,EAAA;;AAEd;QAEA,OAAO,IAAA;KAET,EAAA;AAAClB,QAAAA,mBAAAA;AAAqBX,QAAAA,MAAAA;AAAQvB,QAAAA;AAAK,KAAA,CAAA;IAGrC,OAAO;AAAEwC,QAAAA;AAAW,KAAA;AACtB;;;;;"}
|