@cloudscape-design/components 3.0.624 → 3.0.625
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/alert/index.d.ts.map +1 -1
- package/alert/index.js +9 -5
- package/alert/index.js.map +1 -1
- package/attribute-editor/interfaces.d.ts +4 -0
- package/attribute-editor/interfaces.d.ts.map +1 -1
- package/attribute-editor/interfaces.js.map +1 -1
- package/attribute-editor/row.d.ts.map +1 -1
- package/attribute-editor/row.js +4 -1
- package/attribute-editor/row.js.map +1 -1
- package/container/index.js +1 -1
- package/container/index.js.map +1 -1
- package/date-picker/index.d.ts.map +1 -1
- package/date-picker/index.js +2 -2
- package/date-picker/index.js.map +1 -1
- package/date-range-picker/index.d.ts.map +1 -1
- package/date-range-picker/index.js +2 -2
- package/date-range-picker/index.js.map +1 -1
- package/file-upload/interfaces.d.ts +14 -4
- package/file-upload/interfaces.d.ts.map +1 -1
- package/file-upload/interfaces.js.map +1 -1
- package/file-upload/internal.js +13 -7
- package/file-upload/internal.js.map +1 -1
- package/form/index.d.ts.map +1 -1
- package/form/index.js +17 -6
- package/form/index.js.map +1 -1
- package/form/internal.d.ts.map +1 -1
- package/form/internal.js +1 -14
- package/form/internal.js.map +1 -1
- package/form-field/index.d.ts.map +1 -1
- package/form-field/index.js +3 -2
- package/form-field/index.js.map +1 -1
- package/form-field/interfaces.d.ts +12 -1
- package/form-field/interfaces.d.ts.map +1 -1
- package/form-field/interfaces.js.map +1 -1
- package/form-field/internal.d.ts +9 -3
- package/form-field/internal.d.ts.map +1 -1
- package/form-field/internal.js +36 -11
- package/form-field/internal.js.map +1 -1
- package/form-field/styles.css.js +23 -19
- package/form-field/styles.scoped.css +45 -29
- package/form-field/styles.selectors.js +23 -19
- package/form-field/util.d.ts +3 -2
- package/form-field/util.d.ts.map +1 -1
- package/form-field/util.js +4 -3
- package/form-field/util.js.map +1 -1
- package/input/index.d.ts.map +1 -1
- package/input/index.js +2 -1
- package/input/index.js.map +1 -1
- package/input/internal.d.ts.map +1 -1
- package/input/internal.js +4 -1
- package/input/internal.js.map +1 -1
- package/input/styles.css.js +13 -12
- package/input/styles.scoped.css +46 -30
- package/input/styles.selectors.js +13 -12
- package/internal/analytics/components/analytics-funnel.d.ts +12 -12
- package/internal/analytics/components/analytics-funnel.d.ts.map +1 -1
- package/internal/analytics/components/analytics-funnel.js +38 -25
- package/internal/analytics/components/analytics-funnel.js.map +1 -1
- package/internal/analytics/context/analytics-context.d.ts +7 -2
- package/internal/analytics/context/analytics-context.d.ts.map +1 -1
- package/internal/analytics/context/analytics-context.js.map +1 -1
- package/internal/analytics/hooks/use-funnel.d.ts +5 -1
- package/internal/analytics/hooks/use-funnel.d.ts.map +1 -1
- package/internal/analytics/hooks/use-funnel.js +9 -5
- package/internal/analytics/hooks/use-funnel.js.map +1 -1
- package/internal/analytics/interfaces.d.ts +23 -37
- package/internal/analytics/interfaces.d.ts.map +1 -1
- package/internal/analytics/interfaces.js.map +1 -1
- package/internal/base-component/index.d.ts +1 -1
- package/internal/base-component/index.d.ts.map +1 -1
- package/internal/base-component/index.js +1 -1
- package/internal/base-component/index.js.map +1 -1
- package/internal/components/button-trigger/index.d.ts +1 -0
- package/internal/components/button-trigger/index.d.ts.map +1 -1
- package/internal/components/button-trigger/index.js +2 -2
- package/internal/components/button-trigger/index.js.map +1 -1
- package/internal/components/button-trigger/styles.css.js +11 -10
- package/internal/components/button-trigger/styles.scoped.css +35 -24
- package/internal/components/button-trigger/styles.selectors.js +11 -10
- package/internal/context/form-field-context.d.ts +14 -1
- package/internal/context/form-field-context.d.ts.map +1 -1
- package/internal/context/form-field-context.js +1 -1
- package/internal/context/form-field-context.js.map +1 -1
- package/internal/environment.js +1 -1
- package/internal/environment.json +1 -1
- package/internal/manifest.json +1 -1
- package/link/internal.d.ts.map +1 -1
- package/link/internal.js +9 -3
- package/link/internal.js.map +1 -1
- package/modal/body-scroll.d.ts.map +1 -1
- package/modal/body-scroll.js +5 -0
- package/modal/body-scroll.js.map +1 -1
- package/package.json +1 -1
- package/select/parts/filter.d.ts +1 -1
- package/select/parts/filter.d.ts.map +1 -1
- package/select/parts/trigger.d.ts.map +1 -1
- package/select/parts/trigger.js +2 -2
- package/select/parts/trigger.js.map +1 -1
- package/test-utils/dom/file-upload/index.d.ts +2 -0
- package/test-utils/dom/file-upload/index.js +6 -0
- package/test-utils/dom/file-upload/index.js.map +1 -1
- package/test-utils/dom/form-field/index.d.ts +1 -0
- package/test-utils/dom/form-field/index.js +3 -0
- package/test-utils/dom/form-field/index.js.map +1 -1
- package/test-utils/selectors/file-upload/index.d.ts +2 -0
- package/test-utils/selectors/file-upload/index.js +6 -0
- package/test-utils/selectors/file-upload/index.js.map +1 -1
- package/test-utils/selectors/form-field/index.d.ts +1 -0
- package/test-utils/selectors/form-field/index.js +3 -0
- package/test-utils/selectors/form-field/index.js.map +1 -1
- package/test-utils/tsconfig.tsbuildinfo +1 -1
- package/textarea/index.d.ts.map +1 -1
- package/textarea/index.js +2 -1
- package/textarea/index.js.map +1 -1
- package/textarea/styles.css.js +5 -4
- package/textarea/styles.scoped.css +23 -12
- package/textarea/styles.selectors.js +5 -4
- package/token-group/styles.css.js +9 -8
- package/token-group/styles.scoped.css +27 -16
- package/token-group/styles.selectors.js +9 -8
- package/token-group/token.d.ts +3 -1
- package/token-group/token.d.ts.map +1 -1
- package/token-group/token.js +8 -5
- package/token-group/token.js.map +1 -1
- package/wizard/analytics.d.ts +2 -1
- package/wizard/analytics.d.ts.map +1 -1
- package/wizard/analytics.js +7 -3
- package/wizard/analytics.js.map +1 -1
- package/wizard/index.js +1 -1
- package/wizard/index.js.map +1 -1
- package/wizard/internal.d.ts.map +1 -1
- package/wizard/internal.js +2 -2
- package/wizard/internal.js.map +1 -1
- package/wizard/wizard-form.d.ts +4 -2
- package/wizard/wizard-form.d.ts.map +1 -1
- package/wizard/wizard-form.js +31 -19
- package/wizard/wizard-form.js.map +1 -1
package/input/styles.scoped.css
CHANGED
|
@@ -96,11 +96,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
96
96
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
97
97
|
SPDX-License-Identifier: Apache-2.0
|
|
98
98
|
*/
|
|
99
|
-
.
|
|
99
|
+
.awsui_root_2rhyz_deb6p_99:not(#\9) {
|
|
100
100
|
/* used in test-utils for component to distinguish input from other input-like components, for example autosuggest */
|
|
101
101
|
}
|
|
102
102
|
|
|
103
|
-
.
|
|
103
|
+
.awsui_input_2rhyz_deb6p_103:not(#\9) {
|
|
104
104
|
border-collapse: separate;
|
|
105
105
|
border-spacing: 0;
|
|
106
106
|
box-sizing: border-box;
|
|
@@ -151,36 +151,36 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
151
151
|
line-height: var(--line-height-body-m-30ar75, 20px);
|
|
152
152
|
block-size: var(--size-vertical-input-v5iwwf, 32px);
|
|
153
153
|
}
|
|
154
|
-
.
|
|
154
|
+
.awsui_input_2rhyz_deb6p_103.awsui_input-readonly_2rhyz_deb6p_153:not(#\9) {
|
|
155
155
|
background-color: var(--color-background-input-default-igdh5e, #ffffff);
|
|
156
156
|
border-block: var(--border-field-width-09w7vk, 2px) solid var(--color-border-input-disabled-rx2aau, #e9ebed);
|
|
157
157
|
border-inline: var(--border-field-width-09w7vk, 2px) solid var(--color-border-input-disabled-rx2aau, #e9ebed);
|
|
158
158
|
}
|
|
159
|
-
.
|
|
159
|
+
.awsui_input_2rhyz_deb6p_103:not(#\9)::-webkit-input-placeholder {
|
|
160
160
|
color: var(--color-text-input-placeholder-mx1ygd, #5f6b7a);
|
|
161
161
|
font-style: italic;
|
|
162
162
|
-webkit-user-select: none;
|
|
163
163
|
user-select: none;
|
|
164
164
|
}
|
|
165
|
-
.
|
|
165
|
+
.awsui_input_2rhyz_deb6p_103:not(#\9)::-ms-input-placeholder {
|
|
166
166
|
color: var(--color-text-input-placeholder-mx1ygd, #5f6b7a);
|
|
167
167
|
font-style: italic;
|
|
168
168
|
}
|
|
169
|
-
.
|
|
169
|
+
.awsui_input_2rhyz_deb6p_103:not(#\9)::-moz-placeholder {
|
|
170
170
|
color: var(--color-text-input-placeholder-mx1ygd, #5f6b7a);
|
|
171
171
|
font-style: italic;
|
|
172
172
|
opacity: 1;
|
|
173
173
|
}
|
|
174
|
-
.
|
|
174
|
+
.awsui_input_2rhyz_deb6p_103:not(#\9):-ms-input-placeholder {
|
|
175
175
|
color: var(--color-text-input-placeholder-mx1ygd, #5f6b7a);
|
|
176
176
|
font-style: italic;
|
|
177
177
|
}
|
|
178
|
-
.
|
|
178
|
+
.awsui_input_2rhyz_deb6p_103:not(#\9):-moz-placeholder {
|
|
179
179
|
color: var(--color-text-input-placeholder-mx1ygd, #5f6b7a);
|
|
180
180
|
font-style: italic;
|
|
181
181
|
opacity: 1;
|
|
182
182
|
}
|
|
183
|
-
.
|
|
183
|
+
.awsui_input_2rhyz_deb6p_103:not(#\9):focus {
|
|
184
184
|
outline: 2px dotted transparent;
|
|
185
185
|
border-block: var(--border-field-width-09w7vk, 2px) solid var(--color-border-input-focused-3d15sl, #033160);
|
|
186
186
|
border-inline: var(--border-field-width-09w7vk, 2px) solid var(--color-border-input-focused-3d15sl, #033160);
|
|
@@ -190,7 +190,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
190
190
|
border-end-end-radius: var(--border-radius-input-plgbrq, 8px);
|
|
191
191
|
box-shadow: 0 0 0 var(--border-control-focus-ring-shadow-spread-0ctpjf, 0px) var(--color-border-item-focused-b2ntyl, #0972d3);
|
|
192
192
|
}
|
|
193
|
-
.
|
|
193
|
+
.awsui_input_2rhyz_deb6p_103:not(#\9):disabled {
|
|
194
194
|
background-color: var(--color-background-input-disabled-ab59a3, #e9ebed);
|
|
195
195
|
border-block: var(--border-field-width-09w7vk, 2px) solid var(--color-border-input-disabled-rx2aau, #e9ebed);
|
|
196
196
|
border-inline: var(--border-field-width-09w7vk, 2px) solid var(--color-border-input-disabled-rx2aau, #e9ebed);
|
|
@@ -198,29 +198,29 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
198
198
|
cursor: auto;
|
|
199
199
|
cursor: default;
|
|
200
200
|
}
|
|
201
|
-
.
|
|
201
|
+
.awsui_input_2rhyz_deb6p_103:not(#\9):disabled::-webkit-input-placeholder {
|
|
202
202
|
color: var(--color-text-input-placeholder-disabled-abhb0d, #9ba7b6);
|
|
203
203
|
-webkit-user-select: none;
|
|
204
204
|
user-select: none;
|
|
205
205
|
}
|
|
206
|
-
.
|
|
206
|
+
.awsui_input_2rhyz_deb6p_103:not(#\9):disabled::-ms-input-placeholder {
|
|
207
207
|
color: var(--color-text-input-placeholder-disabled-abhb0d, #9ba7b6);
|
|
208
208
|
}
|
|
209
|
-
.
|
|
209
|
+
.awsui_input_2rhyz_deb6p_103:not(#\9):disabled::-moz-placeholder {
|
|
210
210
|
color: var(--color-text-input-placeholder-disabled-abhb0d, #9ba7b6);
|
|
211
211
|
opacity: 1;
|
|
212
212
|
}
|
|
213
|
-
.
|
|
213
|
+
.awsui_input_2rhyz_deb6p_103:not(#\9):disabled:-ms-input-placeholder {
|
|
214
214
|
color: var(--color-text-input-placeholder-disabled-abhb0d, #9ba7b6);
|
|
215
215
|
}
|
|
216
|
-
.
|
|
216
|
+
.awsui_input_2rhyz_deb6p_103:not(#\9):disabled:-moz-placeholder {
|
|
217
217
|
color: var(--color-text-input-placeholder-disabled-abhb0d, #9ba7b6);
|
|
218
218
|
opacity: 1;
|
|
219
219
|
}
|
|
220
|
-
.
|
|
220
|
+
.awsui_input_2rhyz_deb6p_103:not(#\9):invalid {
|
|
221
221
|
box-shadow: none;
|
|
222
222
|
}
|
|
223
|
-
.
|
|
223
|
+
.awsui_input_2rhyz_deb6p_103.awsui_input-invalid_2rhyz_deb6p_220:not(#\9) {
|
|
224
224
|
color: var(--color-text-status-error-wdvepn, #d91515);
|
|
225
225
|
border-color: var(--color-text-status-error-wdvepn, #d91515);
|
|
226
226
|
padding-inline-start: calc(
|
|
@@ -228,58 +228,74 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
228
228
|
);
|
|
229
229
|
border-inline-start-width: var(--border-invalid-width-5ktjp2, 8px);
|
|
230
230
|
}
|
|
231
|
-
.
|
|
231
|
+
.awsui_input_2rhyz_deb6p_103.awsui_input-invalid_2rhyz_deb6p_220:not(#\9):focus {
|
|
232
232
|
box-shadow: 0 0 0 var(--border-control-invalid-focus-ring-shadow-spread-fhmbjn, 2px) var(--color-border-item-focused-b2ntyl, #0972d3);
|
|
233
233
|
}
|
|
234
|
-
.
|
|
234
|
+
.awsui_input_2rhyz_deb6p_103.awsui_input-invalid_2rhyz_deb6p_220.awsui_input-has-icon-left_2rhyz_deb6p_231:not(#\9) {
|
|
235
235
|
padding-inline-start: calc(
|
|
236
236
|
var(--space-field-icon-offset-csk9vw, 36px) - (var(--border-invalid-width-5ktjp2, 8px) - var(--border-field-width-09w7vk, 2px))
|
|
237
237
|
);
|
|
238
238
|
}
|
|
239
|
-
.
|
|
239
|
+
.awsui_input_2rhyz_deb6p_103.awsui_input-warning_2rhyz_deb6p_236:not(#\9) {
|
|
240
|
+
color: var(--color-text-status-warning-yik8vi, #8d6605);
|
|
241
|
+
border-color: var(--color-text-status-warning-yik8vi, #8d6605);
|
|
242
|
+
padding-inline-start: calc(
|
|
243
|
+
var(--space-field-horizontal-gg19kw, 12px) - (var(--border-invalid-width-5ktjp2, 8px) - var(--border-field-width-09w7vk, 2px))
|
|
244
|
+
);
|
|
245
|
+
border-inline-start-width: var(--border-invalid-width-5ktjp2, 8px);
|
|
246
|
+
}
|
|
247
|
+
.awsui_input_2rhyz_deb6p_103.awsui_input-warning_2rhyz_deb6p_236:not(#\9):focus {
|
|
248
|
+
box-shadow: 0 0 0 var(--border-control-invalid-focus-ring-shadow-spread-fhmbjn, 2px) var(--color-border-item-focused-b2ntyl, #0972d3);
|
|
249
|
+
}
|
|
250
|
+
.awsui_input_2rhyz_deb6p_103.awsui_input-warning_2rhyz_deb6p_236.awsui_input-has-icon-left_2rhyz_deb6p_231:not(#\9) {
|
|
251
|
+
padding-inline-start: calc(
|
|
252
|
+
var(--space-field-icon-offset-csk9vw, 36px) - (var(--border-invalid-width-5ktjp2, 8px) - var(--border-field-width-09w7vk, 2px))
|
|
253
|
+
);
|
|
254
|
+
}
|
|
255
|
+
.awsui_input_2rhyz_deb6p_103.awsui_input-type-search_2rhyz_deb6p_252:not(#\9) {
|
|
240
256
|
box-sizing: border-box;
|
|
241
257
|
-webkit-appearance: none; /* stylelint-disable-line plugin/no-unsupported-browser-features */
|
|
242
258
|
}
|
|
243
|
-
.
|
|
259
|
+
.awsui_input_2rhyz_deb6p_103.awsui_input-type-search_2rhyz_deb6p_252:not(#\9)::-ms-clear {
|
|
244
260
|
display: none;
|
|
245
261
|
}
|
|
246
|
-
.
|
|
262
|
+
.awsui_input_2rhyz_deb6p_103.awsui_input-type-search_2rhyz_deb6p_252:not(#\9)::-webkit-search-decoration {
|
|
247
263
|
-webkit-appearance: none; /* stylelint-disable-line plugin/no-unsupported-browser-features */
|
|
248
264
|
}
|
|
249
|
-
.
|
|
265
|
+
.awsui_input_2rhyz_deb6p_103.awsui_input-type-search_2rhyz_deb6p_252:not(#\9)::-webkit-search-cancel-button {
|
|
250
266
|
display: none;
|
|
251
267
|
}
|
|
252
|
-
.
|
|
268
|
+
.awsui_input_2rhyz_deb6p_103.awsui_input-has-icon-left_2rhyz_deb6p_231:not(#\9) {
|
|
253
269
|
padding-inline-start: var(--space-field-icon-offset-csk9vw, 36px);
|
|
254
270
|
}
|
|
255
|
-
.
|
|
271
|
+
.awsui_input_2rhyz_deb6p_103.awsui_input-has-icon-right_2rhyz_deb6p_268:not(#\9) {
|
|
256
272
|
padding-inline-end: var(--space-field-icon-offset-csk9vw, 36px);
|
|
257
273
|
}
|
|
258
|
-
.
|
|
274
|
+
.awsui_input_2rhyz_deb6p_103.awsui_input-has-no-border-radius_2rhyz_deb6p_271:not(#\9) {
|
|
259
275
|
border-start-start-radius: var(--border-radius-dropdown-0dhh79, 8px);
|
|
260
276
|
border-start-end-radius: var(--border-radius-dropdown-0dhh79, 8px);
|
|
261
277
|
border-end-start-radius: var(--border-radius-dropdown-0dhh79, 8px);
|
|
262
278
|
border-end-end-radius: var(--border-radius-dropdown-0dhh79, 8px);
|
|
263
279
|
}
|
|
264
280
|
|
|
265
|
-
.awsui_input-
|
|
281
|
+
.awsui_input-container_2rhyz_deb6p_278:not(#\9) {
|
|
266
282
|
display: flex;
|
|
267
283
|
position: relative;
|
|
268
284
|
}
|
|
269
285
|
|
|
270
|
-
.awsui_input-icon-
|
|
286
|
+
.awsui_input-icon-left_2rhyz_deb6p_283:not(#\9) {
|
|
271
287
|
position: absolute;
|
|
272
288
|
pointer-events: none;
|
|
273
289
|
inset-inline-start: var(--space-field-horizontal-gg19kw, 12px);
|
|
274
290
|
inset-block-start: calc(50% - var(--line-height-body-m-30ar75, 20px) / 2);
|
|
275
291
|
}
|
|
276
292
|
|
|
277
|
-
.awsui_input-icon-
|
|
293
|
+
.awsui_input-icon-right_2rhyz_deb6p_290:not(#\9) {
|
|
278
294
|
position: absolute;
|
|
279
295
|
inset-block-start: calc(50% - var(--line-height-body-m-30ar75, 20px) / 2);
|
|
280
296
|
inset-inline-end: calc(var(--space-field-horizontal-gg19kw, 12px) - var(--space-xxs-p8yyaw, 4px));
|
|
281
297
|
}
|
|
282
298
|
|
|
283
|
-
.awsui_input-button-
|
|
299
|
+
.awsui_input-button-right_2rhyz_deb6p_296:not(#\9) {
|
|
284
300
|
/* used in test-utils */
|
|
285
301
|
}
|
|
@@ -2,17 +2,18 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"root": "
|
|
6
|
-
"input": "
|
|
7
|
-
"input-readonly": "awsui_input-
|
|
8
|
-
"input-invalid": "awsui_input-
|
|
9
|
-
"input-has-icon-left": "awsui_input-has-icon-
|
|
10
|
-
"input-
|
|
11
|
-
"input-
|
|
12
|
-
"input-has-
|
|
13
|
-
"input-
|
|
14
|
-
"input-
|
|
15
|
-
"input-icon-
|
|
16
|
-
"input-
|
|
5
|
+
"root": "awsui_root_2rhyz_deb6p_99",
|
|
6
|
+
"input": "awsui_input_2rhyz_deb6p_103",
|
|
7
|
+
"input-readonly": "awsui_input-readonly_2rhyz_deb6p_153",
|
|
8
|
+
"input-invalid": "awsui_input-invalid_2rhyz_deb6p_220",
|
|
9
|
+
"input-has-icon-left": "awsui_input-has-icon-left_2rhyz_deb6p_231",
|
|
10
|
+
"input-warning": "awsui_input-warning_2rhyz_deb6p_236",
|
|
11
|
+
"input-type-search": "awsui_input-type-search_2rhyz_deb6p_252",
|
|
12
|
+
"input-has-icon-right": "awsui_input-has-icon-right_2rhyz_deb6p_268",
|
|
13
|
+
"input-has-no-border-radius": "awsui_input-has-no-border-radius_2rhyz_deb6p_271",
|
|
14
|
+
"input-container": "awsui_input-container_2rhyz_deb6p_278",
|
|
15
|
+
"input-icon-left": "awsui_input-icon-left_2rhyz_deb6p_283",
|
|
16
|
+
"input-icon-right": "awsui_input-icon-right_2rhyz_deb6p_290",
|
|
17
|
+
"input-button-right": "awsui_input-button-right_2rhyz_deb6p_296"
|
|
17
18
|
};
|
|
18
19
|
|
|
@@ -1,33 +1,33 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FunnelStepContextValue, FunnelSubStepContextValue } from '../context/analytics-context';
|
|
3
|
-
import { AnalyticsMetadata,
|
|
3
|
+
import { AnalyticsMetadata, FunnelStartProps, FunnelStepProps, StepConfiguration } from '../interfaces';
|
|
4
4
|
export declare const FUNNEL_VERSION = "1.4";
|
|
5
5
|
interface AnalyticsFunnelProps {
|
|
6
6
|
children?: React.ReactNode;
|
|
7
7
|
stepConfiguration?: StepConfiguration[];
|
|
8
8
|
funnelNameSelectors?: string[];
|
|
9
|
-
funnelType:
|
|
10
|
-
optionalStepNumbers:
|
|
11
|
-
totalFunnelSteps:
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
9
|
+
funnelType: FunnelStartProps['funnelType'];
|
|
10
|
+
optionalStepNumbers: FunnelStartProps['optionalStepNumbers'];
|
|
11
|
+
totalFunnelSteps: FunnelStartProps['totalFunnelSteps'];
|
|
12
|
+
funnelIdentifier?: AnalyticsMetadata['instanceIdentifier'];
|
|
13
|
+
funnelFlowType?: AnalyticsMetadata['flowType'];
|
|
14
|
+
funnelErrorContext?: AnalyticsMetadata['errorContext'];
|
|
15
15
|
}
|
|
16
16
|
export declare const AnalyticsFunnel: (props: AnalyticsFunnelProps) => JSX.Element;
|
|
17
17
|
export declare const CREATION_EDIT_FLOW_DONE_EVENT_NAME = "awsui-creation-edit-flow-done";
|
|
18
18
|
interface AnalyticsFunnelStepProps {
|
|
19
|
-
|
|
20
|
-
|
|
19
|
+
stepIdentifier?: AnalyticsMetadata['instanceIdentifier'];
|
|
20
|
+
stepErrorContext?: AnalyticsMetadata['errorContext'];
|
|
21
21
|
children?: React.ReactNode | ((props: FunnelStepContextValue) => React.ReactNode);
|
|
22
22
|
stepNameSelector?: FunnelStepProps['stepNameSelector'];
|
|
23
23
|
stepNumber: FunnelStepProps['stepNumber'];
|
|
24
24
|
}
|
|
25
25
|
export declare const AnalyticsFunnelStep: (props: AnalyticsFunnelStepProps) => JSX.Element;
|
|
26
26
|
interface AnalyticsFunnelSubStepProps {
|
|
27
|
-
|
|
28
|
-
|
|
27
|
+
subStepIdentifier?: AnalyticsMetadata['instanceIdentifier'];
|
|
28
|
+
subStepErrorContext?: AnalyticsMetadata['errorContext'];
|
|
29
29
|
children?: React.ReactNode | ((props: FunnelSubStepContextValue) => React.ReactNode);
|
|
30
30
|
}
|
|
31
|
-
export declare const AnalyticsFunnelSubStep: ({ children,
|
|
31
|
+
export declare const AnalyticsFunnelSubStep: ({ children, subStepIdentifier, subStepErrorContext, }: AnalyticsFunnelSubStepProps) => JSX.Element;
|
|
32
32
|
export {};
|
|
33
33
|
//# sourceMappingURL=analytics-funnel.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"analytics-funnel.d.ts","sourceRoot":"","sources":["../../../../../src/internal/analytics/components/analytics-funnel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAEvE,OAAO,EAKL,sBAAsB,EAEtB,yBAAyB,EAC1B,MAAM,8BAA8B,CAAC;AAQtC,OAAO,EACL,iBAAiB,EACjB,
|
|
1
|
+
{"version":3,"file":"analytics-funnel.d.ts","sourceRoot":"","sources":["../../../../../src/internal/analytics/components/analytics-funnel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAEvE,OAAO,EAKL,sBAAsB,EAEtB,yBAAyB,EAC1B,MAAM,8BAA8B,CAAC;AAQtC,OAAO,EACL,iBAAiB,EACjB,gBAAgB,EAChB,eAAe,EACf,iBAAiB,EAElB,MAAM,eAAe,CAAC;AAavB,eAAO,MAAM,cAAc,QAAQ,CAAC;AAEpC,UAAU,oBAAoB;IAC5B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,iBAAiB,CAAC,EAAE,iBAAiB,EAAE,CAAC;IACxC,mBAAmB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC/B,UAAU,EAAE,gBAAgB,CAAC,YAAY,CAAC,CAAC;IAC3C,mBAAmB,EAAE,gBAAgB,CAAC,qBAAqB,CAAC,CAAC;IAC7D,gBAAgB,EAAE,gBAAgB,CAAC,kBAAkB,CAAC,CAAC;IACvD,gBAAgB,CAAC,EAAE,iBAAiB,CAAC,oBAAoB,CAAC,CAAC;IAC3D,cAAc,CAAC,EAAE,iBAAiB,CAAC,UAAU,CAAC,CAAC;IAC/C,kBAAkB,CAAC,EAAE,iBAAiB,CAAC,cAAc,CAAC,CAAC;CACxD;AAED,eAAO,MAAM,eAAe,UAAW,oBAAoB,gBAa1D,CAAC;AACF,eAAO,MAAM,kCAAkC,kCAAkC,CAAC;AAsMlF,UAAU,wBAAwB;IAChC,cAAc,CAAC,EAAE,iBAAiB,CAAC,oBAAoB,CAAC,CAAC;IACzD,gBAAgB,CAAC,EAAE,iBAAiB,CAAC,cAAc,CAAC,CAAC;IACrD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,KAAK,EAAE,sBAAsB,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;IAClF,gBAAgB,CAAC,EAAE,eAAe,CAAC,kBAAkB,CAAC,CAAC;IACvD,UAAU,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;CAC3C;AAED,eAAO,MAAM,mBAAmB,UAAW,wBAAwB,gBAMlE,CAAC;AAyLF,UAAU,2BAA2B;IACnC,iBAAiB,CAAC,EAAE,iBAAiB,CAAC,oBAAoB,CAAC,CAAC;IAC5D,mBAAmB,CAAC,EAAE,iBAAiB,CAAC,cAAc,CAAC,CAAC;IACxD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,KAAK,EAAE,yBAAyB,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;CACtF;AAED,eAAO,MAAM,sBAAsB,0DAIhC,2BAA2B,gBAmG7B,CAAC"}
|
|
@@ -35,11 +35,11 @@ const dispatchCreateEditFlowDoneEvent = () => {
|
|
|
35
35
|
// probably because of cross-origin error, then do not dispatch the event
|
|
36
36
|
}
|
|
37
37
|
};
|
|
38
|
-
const onFunnelCancelled = ({ funnelInteractionId }) => {
|
|
39
|
-
FunnelMetrics.funnelCancelled({ funnelInteractionId });
|
|
38
|
+
const onFunnelCancelled = ({ funnelInteractionId, funnelIdentifier, }) => {
|
|
39
|
+
FunnelMetrics.funnelCancelled({ funnelInteractionId, funnelIdentifier });
|
|
40
40
|
};
|
|
41
|
-
const onFunnelComplete = ({ funnelInteractionId }) => {
|
|
42
|
-
FunnelMetrics.funnelComplete({ funnelInteractionId });
|
|
41
|
+
const onFunnelComplete = ({ funnelInteractionId, funnelIdentifier, }) => {
|
|
42
|
+
FunnelMetrics.funnelComplete({ funnelInteractionId, funnelIdentifier });
|
|
43
43
|
dispatchCreateEditFlowDoneEvent();
|
|
44
44
|
};
|
|
45
45
|
function evaluateSelectors(selectors, defaultSelector) {
|
|
@@ -88,17 +88,22 @@ const InnerAnalyticsFunnel = (_a) => {
|
|
|
88
88
|
// Reset the state, in case the component was re-mounted.
|
|
89
89
|
funnelState.current = 'default';
|
|
90
90
|
const singleStepFlowStepConfiguration = [
|
|
91
|
-
{
|
|
91
|
+
{
|
|
92
|
+
number: 1,
|
|
93
|
+
isOptional: false,
|
|
94
|
+
name: (_a = getNameFromSelector(funnelNameSelector.current)) !== null && _a !== void 0 ? _a : '',
|
|
95
|
+
stepIdentifier: props.funnelIdentifier,
|
|
96
|
+
},
|
|
92
97
|
];
|
|
93
98
|
funnelInteractionId = FunnelMetrics.funnelStart({
|
|
94
|
-
|
|
95
|
-
flowType: props.
|
|
99
|
+
funnelIdentifier: props.funnelIdentifier,
|
|
100
|
+
flowType: props.funnelFlowType,
|
|
96
101
|
funnelNameSelector: funnelNameSelector.current,
|
|
97
102
|
optionalStepNumbers: props.optionalStepNumbers,
|
|
98
103
|
funnelType: props.funnelType,
|
|
99
104
|
totalFunnelSteps: props.totalFunnelSteps,
|
|
100
105
|
componentVersion: PACKAGE_VERSION,
|
|
101
|
-
|
|
106
|
+
componentTheme: isVisualRefresh ? 'vr' : 'classic',
|
|
102
107
|
funnelVersion: FUNNEL_VERSION,
|
|
103
108
|
stepConfiguration: stepConfiguration !== null && stepConfiguration !== void 0 ? stepConfiguration : singleStepFlowStepConfiguration,
|
|
104
109
|
});
|
|
@@ -115,14 +120,14 @@ const InnerAnalyticsFunnel = (_a) => {
|
|
|
115
120
|
}
|
|
116
121
|
if (funnelState.current === 'validating') {
|
|
117
122
|
// Finish the validation phase early.
|
|
118
|
-
onFunnelComplete({ funnelInteractionId });
|
|
123
|
+
onFunnelComplete({ funnelInteractionId, funnelIdentifier: props.funnelIdentifier });
|
|
119
124
|
funnelState.current = 'complete';
|
|
120
125
|
}
|
|
121
126
|
if (funnelState.current === 'complete') {
|
|
122
|
-
FunnelMetrics.funnelSuccessful({ funnelInteractionId });
|
|
127
|
+
FunnelMetrics.funnelSuccessful({ funnelInteractionId, funnelIdentifier: props.funnelIdentifier });
|
|
123
128
|
}
|
|
124
129
|
else {
|
|
125
|
-
onFunnelCancelled({ funnelInteractionId });
|
|
130
|
+
onFunnelCancelled({ funnelInteractionId, funnelIdentifier: props.funnelIdentifier });
|
|
126
131
|
funnelState.current = 'cancelled';
|
|
127
132
|
}
|
|
128
133
|
};
|
|
@@ -166,6 +171,9 @@ const InnerAnalyticsFunnel = (_a) => {
|
|
|
166
171
|
const funnelCancel = () => { };
|
|
167
172
|
const funnelContextValue = {
|
|
168
173
|
funnelInteractionId,
|
|
174
|
+
funnelIdentifier: props.funnelIdentifier,
|
|
175
|
+
funnelFlowType: props.funnelFlowType,
|
|
176
|
+
funnelErrorContext: props.funnelErrorContext,
|
|
169
177
|
setFunnelInteractionId,
|
|
170
178
|
funnelType: props.funnelType,
|
|
171
179
|
optionalStepNumbers: props.optionalStepNumbers,
|
|
@@ -194,11 +202,13 @@ export const AnalyticsFunnelStep = (props) => {
|
|
|
194
202
|
function getSubStepConfiguration() {
|
|
195
203
|
const subSteps = Array.from(document.querySelectorAll(getSubStepAllSelector()));
|
|
196
204
|
const subStepConfiguration = subSteps.map((substep, index) => {
|
|
197
|
-
var _a, _b, _c;
|
|
198
|
-
const
|
|
205
|
+
var _a, _b, _c, _d, _e;
|
|
206
|
+
const subStepIdentifier = (_b = (_a = substep === null || substep === void 0 ? void 0 : substep.__awsuiMetadata__) === null || _a === void 0 ? void 0 : _a.analytics) === null || _b === void 0 ? void 0 : _b.instanceIdentifier;
|
|
207
|
+
const name = (_e = (_d = (_c = substep.querySelector(getSubStepNameSelector())) === null || _c === void 0 ? void 0 : _c.innerText) === null || _d === void 0 ? void 0 : _d.trim()) !== null && _e !== void 0 ? _e : '';
|
|
199
208
|
return {
|
|
200
209
|
name,
|
|
201
210
|
number: index + 1,
|
|
211
|
+
subStepIdentifier,
|
|
202
212
|
};
|
|
203
213
|
});
|
|
204
214
|
return subStepConfiguration;
|
|
@@ -238,8 +248,8 @@ function useStepChangeListener(stepNumber, handler) {
|
|
|
238
248
|
return { onStepChange: stepChangeCallback, subStepConfiguration };
|
|
239
249
|
}
|
|
240
250
|
const InnerAnalyticsFunnelStep = (_a) => {
|
|
241
|
-
var { children, stepNumber,
|
|
242
|
-
const { funnelInteractionId, funnelNameSelector, funnelState, funnelType } = useFunnel();
|
|
251
|
+
var { children, stepNumber, stepIdentifier, stepErrorContext } = _a, rest = __rest(_a, ["children", "stepNumber", "stepIdentifier", "stepErrorContext"]);
|
|
252
|
+
const { funnelInteractionId, funnelIdentifier, funnelNameSelector, funnelState, funnelType } = useFunnel();
|
|
243
253
|
const parentStep = useFunnelStep();
|
|
244
254
|
const parentStepExists = parentStep.isInStep;
|
|
245
255
|
const parentStepFunnelInteractionId = parentStep.funnelInteractionId;
|
|
@@ -247,16 +257,14 @@ const InnerAnalyticsFunnelStep = (_a) => {
|
|
|
247
257
|
const subStepCount = useRef(0);
|
|
248
258
|
const stepNameSelector = rest.stepNameSelector || funnelNameSelector;
|
|
249
259
|
const { onStepChange, subStepConfiguration } = useStepChangeListener(stepNumber, subStepConfiguration => {
|
|
250
|
-
var _a;
|
|
251
260
|
if (!funnelInteractionId) {
|
|
252
261
|
return;
|
|
253
262
|
}
|
|
254
|
-
const stepName = (_a = getNameFromSelector(stepNameSelector)) !== null && _a !== void 0 ? _a : '';
|
|
255
263
|
FunnelMetrics.funnelStepChange({
|
|
256
|
-
|
|
264
|
+
stepIdentifier,
|
|
265
|
+
funnelIdentifier,
|
|
257
266
|
funnelInteractionId,
|
|
258
267
|
stepNumber,
|
|
259
|
-
stepName,
|
|
260
268
|
stepNameSelector,
|
|
261
269
|
subStepAllSelector: getSubStepAllSelector(),
|
|
262
270
|
totalSubSteps: subStepCount.current,
|
|
@@ -283,7 +291,8 @@ const InnerAnalyticsFunnelStep = (_a) => {
|
|
|
283
291
|
const stepName = getNameFromSelector(stepNameSelector);
|
|
284
292
|
if (funnelState.current === 'default') {
|
|
285
293
|
FunnelMetrics.funnelStepStart({
|
|
286
|
-
|
|
294
|
+
stepIdentifier,
|
|
295
|
+
funnelIdentifier,
|
|
287
296
|
funnelInteractionId,
|
|
288
297
|
stepNumber,
|
|
289
298
|
stepName,
|
|
@@ -297,8 +306,9 @@ const InnerAnalyticsFunnelStep = (_a) => {
|
|
|
297
306
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
298
307
|
if (funnelState.current !== 'cancelled') {
|
|
299
308
|
FunnelMetrics.funnelStepComplete({
|
|
300
|
-
|
|
309
|
+
funnelIdentifier,
|
|
301
310
|
funnelInteractionId,
|
|
311
|
+
stepIdentifier,
|
|
302
312
|
stepNumber,
|
|
303
313
|
stepName,
|
|
304
314
|
stepNameSelector,
|
|
@@ -309,7 +319,8 @@ const InnerAnalyticsFunnelStep = (_a) => {
|
|
|
309
319
|
}
|
|
310
320
|
};
|
|
311
321
|
}, [
|
|
312
|
-
|
|
322
|
+
stepIdentifier,
|
|
323
|
+
funnelIdentifier,
|
|
313
324
|
funnelInteractionId,
|
|
314
325
|
stepNumber,
|
|
315
326
|
stepNameSelector,
|
|
@@ -319,7 +330,7 @@ const InnerAnalyticsFunnelStep = (_a) => {
|
|
|
319
330
|
parentStepFunnelInteractionId,
|
|
320
331
|
]);
|
|
321
332
|
const contextValue = {
|
|
322
|
-
|
|
333
|
+
stepIdentifier,
|
|
323
334
|
stepNumber,
|
|
324
335
|
stepNameSelector,
|
|
325
336
|
funnelStepProps,
|
|
@@ -328,6 +339,7 @@ const InnerAnalyticsFunnelStep = (_a) => {
|
|
|
328
339
|
funnelInteractionId,
|
|
329
340
|
onStepChange,
|
|
330
341
|
subStepConfiguration,
|
|
342
|
+
stepErrorContext,
|
|
331
343
|
};
|
|
332
344
|
/*
|
|
333
345
|
If this step is inside another step which already reports events as part of an active
|
|
@@ -337,7 +349,7 @@ const InnerAnalyticsFunnelStep = (_a) => {
|
|
|
337
349
|
const effectiveContextValue = parentStepExists && parentStepFunnelInteractionId ? parentStep : contextValue;
|
|
338
350
|
return (React.createElement(FunnelStepContext.Provider, { value: effectiveContextValue }, typeof children === 'function' ? children(effectiveContextValue) : children));
|
|
339
351
|
};
|
|
340
|
-
export const AnalyticsFunnelSubStep = ({ children,
|
|
352
|
+
export const AnalyticsFunnelSubStep = ({ children, subStepIdentifier, subStepErrorContext, }) => {
|
|
341
353
|
const subStepId = useUniqueId('substep');
|
|
342
354
|
const subStepSelector = getSubStepSelector(subStepId);
|
|
343
355
|
const subStepNameSelector = getSubStepNameSelector(subStepId);
|
|
@@ -349,7 +361,8 @@ export const AnalyticsFunnelSubStep = ({ children, instanceIdentifier }) => {
|
|
|
349
361
|
const { funnelState, funnelInteractionId } = useFunnel();
|
|
350
362
|
const { stepNumber, stepNameSelector } = useFunnelStep();
|
|
351
363
|
const newContext = {
|
|
352
|
-
|
|
364
|
+
subStepIdentifier,
|
|
365
|
+
subStepErrorContext,
|
|
353
366
|
subStepSelector,
|
|
354
367
|
subStepNameSelector,
|
|
355
368
|
subStepId,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"analytics-funnel.js","sourceRoot":"","sources":["../../../../../src/internal/analytics/components/analytics-funnel.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useContext, useEffect, useRef, useState } from 'react';\n\nimport {\n FunnelStepContext,\n FunnelSubStepContext,\n FunnelContext,\n FunnelContextValue,\n FunnelStepContextValue,\n FunnelState,\n FunnelSubStepContextValue,\n} from '../context/analytics-context';\nimport { useFunnel, useFunnelStep } from '../hooks/use-funnel';\nimport { useUniqueId } from '../../hooks/use-unique-id';\nimport { useVisualRefresh } from '../../hooks/use-visual-mode';\n\nimport { PACKAGE_VERSION } from '../../environment';\n\nimport { FunnelMetrics } from '../index';\nimport {\n AnalyticsMetadata,\n FunnelProps,\n FunnelStepProps,\n StepConfiguration,\n SubStepConfiguration,\n} from '../interfaces';\n\nimport {\n DATA_ATTR_FUNNEL_STEP,\n getFunnelNameSelector,\n getNameFromSelector,\n getSubStepAllSelector,\n getSubStepNameSelector,\n getSubStepSelector,\n} from '../selectors';\nimport { useDebounceCallback } from '../../hooks/use-debounce-callback';\nimport { nodeBelongs } from '../../utils/node-belongs';\n\nexport const FUNNEL_VERSION = '1.4';\n\ninterface AnalyticsFunnelProps {\n children?: React.ReactNode;\n stepConfiguration?: StepConfiguration[];\n funnelNameSelectors?: string[];\n funnelType: FunnelProps['funnelType'];\n optionalStepNumbers: FunnelProps['optionalStepNumbers'];\n totalFunnelSteps: FunnelProps['totalFunnelSteps'];\n instanceIdentifier?: AnalyticsMetadata['instanceIdentifier'];\n flowType?: AnalyticsMetadata['flowType'];\n errorContext?: AnalyticsMetadata['errorContext'];\n}\n\nexport const AnalyticsFunnel = (props: AnalyticsFunnelProps) => {\n const { isInFunnel } = useFunnel();\n /*\n If the current funnel component is a Form (i.e. single-page funnel), it should\n defer its funnel-handling to a parent Form element, if present.\n Wizards (i.e. multi-page funnels) always take highest precedence for handling funnels,\n and do not defer to any other element.\n */\n if (isInFunnel && props.funnelType === 'single-page') {\n return <>{props.children}</>;\n }\n\n return <InnerAnalyticsFunnel {...props} />;\n};\nexport const CREATION_EDIT_FLOW_DONE_EVENT_NAME = 'awsui-creation-edit-flow-done';\nconst dispatchCreateEditFlowDoneEvent = () => {\n try {\n window.top?.document.dispatchEvent(new Event(CREATION_EDIT_FLOW_DONE_EVENT_NAME));\n } catch {\n // probably because of cross-origin error, then do not dispatch the event\n }\n};\n\nconst onFunnelCancelled = ({ funnelInteractionId }: { funnelInteractionId: string }) => {\n FunnelMetrics.funnelCancelled({ funnelInteractionId });\n};\n\nconst onFunnelComplete = ({ funnelInteractionId }: { funnelInteractionId: string }) => {\n FunnelMetrics.funnelComplete({ funnelInteractionId });\n dispatchCreateEditFlowDoneEvent();\n};\n\nfunction evaluateSelectors(selectors: string[], defaultSelector: string) {\n for (const selector of selectors) {\n const element = document.querySelector(selector);\n if (element) {\n return selector;\n }\n }\n\n return defaultSelector;\n}\n\nconst InnerAnalyticsFunnel = ({ children, stepConfiguration, ...props }: AnalyticsFunnelProps) => {\n const [funnelInteractionId, setFunnelInteractionId] = useState<string>('');\n const [submissionAttempt, setSubmissionAttempt] = useState(0);\n const isVisualRefresh = useVisualRefresh();\n const funnelState = useRef<FunnelState>('default');\n const funnelNameSelector = useRef<string>(getFunnelNameSelector());\n const errorCount = useRef<number>(0);\n const loadingButtonCount = useRef<number>(0);\n const wizardCount = useRef<number>(0);\n const latestFocusCleanupFunction = useRef<undefined | (() => void)>(undefined);\n\n // This useEffect hook is run once on component mount to initiate the funnel analytics.\n // It first calls the 'funnelStart' method from FunnelMetrics, providing all necessary details\n // about the funnel, and receives a unique interaction id.\n // This unique interaction id is then stored in the state for further use.\n //\n // On component unmount, it checks whether the funnel was successfully completed.\n // Based on this, it either calls 'funnelComplete' or 'funnelCancelled' method from FunnelMetrics.\n //\n // The eslint-disable is required as we deliberately want this effect to run only once on mount and unmount,\n // hence we do not provide any dependencies.\n useEffect(() => {\n /*\n We run this effect with a delay, in order to detect whether this funnel contains a Wizard.\n If it does contain a Wizard, that Wizard should take precedence for handling the funnel, and\n this current funnel component should do nothing.\n */\n let funnelInteractionId: string;\n const handle = setTimeout(() => {\n funnelNameSelector.current = evaluateSelectors(props.funnelNameSelectors || [], getFunnelNameSelector());\n\n if (props.funnelType === 'single-page' && wizardCount.current > 0) {\n return;\n }\n\n // Reset the state, in case the component was re-mounted.\n funnelState.current = 'default';\n\n const singleStepFlowStepConfiguration = [\n { number: 1, isOptional: false, name: getNameFromSelector(funnelNameSelector.current) ?? '' },\n ];\n\n funnelInteractionId = FunnelMetrics.funnelStart({\n instanceIdentifier: props.instanceIdentifier,\n flowType: props.flowType,\n funnelNameSelector: funnelNameSelector.current,\n optionalStepNumbers: props.optionalStepNumbers,\n funnelType: props.funnelType,\n totalFunnelSteps: props.totalFunnelSteps,\n componentVersion: PACKAGE_VERSION,\n theme: isVisualRefresh ? 'vr' : 'classic',\n funnelVersion: FUNNEL_VERSION,\n stepConfiguration: stepConfiguration ?? singleStepFlowStepConfiguration,\n });\n\n setFunnelInteractionId(funnelInteractionId);\n }, 1);\n\n /*\n A funnel counts as \"successful\" if it is unmounted after being \"complete\".\n */\n /* eslint-disable react-hooks/exhaustive-deps */\n return () => {\n clearTimeout(handle);\n if (props.funnelType === 'single-page' && wizardCount.current > 0) {\n return;\n }\n\n if (funnelState.current === 'validating') {\n // Finish the validation phase early.\n onFunnelComplete({ funnelInteractionId });\n funnelState.current = 'complete';\n }\n\n if (funnelState.current === 'complete') {\n FunnelMetrics.funnelSuccessful({ funnelInteractionId });\n } else {\n onFunnelCancelled({ funnelInteractionId });\n funnelState.current = 'cancelled';\n }\n };\n }, []);\n /* eslint-enable react-hooks/exhaustive-deps */\n\n const funnelSubmit = () => {\n funnelState.current = 'validating';\n\n /*\n When the user attempts to submit the form, we wait for 50 milliseconds before checking\n if any form validation errors are present. This value was chosen to give enough time\n for validation and rerendering to occur, but be low enough that the user will not\n be able to take further action in the meantime.\n */\n const VALIDATION_WAIT_DELAY = 50;\n /*\n Loading is expected to take longer than validation, so we can keep the pressure on the CPU low.\n */\n const LOADING_WAIT_DELAY = 100;\n\n const checkForCompleteness = () => {\n if (funnelState.current === 'complete') {\n return;\n }\n\n if (loadingButtonCount.current > 0) {\n setTimeout(checkForCompleteness, LOADING_WAIT_DELAY);\n return;\n }\n\n if (errorCount.current === 0) {\n /*\n If no validation errors are rendered, we treat the funnel as complete.\n */\n onFunnelComplete({ funnelInteractionId });\n funnelState.current = 'complete';\n } else {\n funnelState.current = 'default';\n }\n };\n\n setTimeout(checkForCompleteness, VALIDATION_WAIT_DELAY);\n };\n\n const funnelNextOrSubmitAttempt = () => setSubmissionAttempt(i => i + 1);\n\n const funnelCancel = () => {};\n\n const funnelContextValue: FunnelContextValue = {\n funnelInteractionId,\n setFunnelInteractionId,\n funnelType: props.funnelType,\n optionalStepNumbers: props.optionalStepNumbers,\n totalFunnelSteps: props.totalFunnelSteps,\n funnelNameSelector: funnelNameSelector.current,\n funnelSubmit,\n funnelCancel,\n submissionAttempt,\n funnelNextOrSubmitAttempt,\n funnelState,\n errorCount,\n loadingButtonCount,\n latestFocusCleanupFunction,\n isInFunnel: true,\n wizardCount,\n };\n\n return <FunnelContext.Provider value={funnelContextValue}>{children}</FunnelContext.Provider>;\n};\n\ninterface AnalyticsFunnelStepProps {\n instanceIdentifier?: AnalyticsMetadata['instanceIdentifier'];\n errorContext?: AnalyticsMetadata['errorContext'];\n children?: React.ReactNode | ((props: FunnelStepContextValue) => React.ReactNode);\n stepNameSelector?: FunnelStepProps['stepNameSelector'];\n stepNumber: FunnelStepProps['stepNumber'];\n}\n\nexport const AnalyticsFunnelStep = (props: AnalyticsFunnelStepProps) => {\n /*\n This wrapper is used to apply a `key` property to the actual (inner) AnalyticsFunnelStep\n element. This allows us to keep the state and effects separate per step.\n */\n return <InnerAnalyticsFunnelStep {...props} key={props.stepNumber} />;\n};\n\nfunction getSubStepConfiguration(): SubStepConfiguration[] {\n const subSteps = Array.from(document.querySelectorAll<HTMLElement>(getSubStepAllSelector()));\n\n const subStepConfiguration = subSteps.map((substep, index) => {\n const name = substep.querySelector<HTMLElement>(getSubStepNameSelector())?.innerText?.trim() ?? '';\n return {\n name,\n number: index + 1,\n };\n });\n return subStepConfiguration;\n}\n\nfunction useStepChangeListener(stepNumber: number, handler: (stepConfiguration: SubStepConfiguration[]) => void) {\n const subStepConfiguration = useRef(new Map<number, SubStepConfiguration[] | undefined>());\n /*\n Chosen so that it's hopefully shorter than a user interaction, but gives enough time for the\n amount of containers to stabilise.\n */\n const SUBSTEP_CHANGE_DEBOUNCE = 50;\n\n const listenForSubStepChanges = useRef(false);\n useEffect(() => {\n // We prevent emitting the event on the first render.\n const handle = setTimeout(() => (listenForSubStepChanges.current = true), SUBSTEP_CHANGE_DEBOUNCE);\n\n return () => {\n clearTimeout(handle);\n listenForSubStepChanges.current = false;\n };\n }, []);\n\n useEffect(() => {\n const handle = setTimeout(\n () => subStepConfiguration.current.set(stepNumber, getSubStepConfiguration()),\n SUBSTEP_CHANGE_DEBOUNCE\n );\n return () => {\n clearTimeout(handle);\n };\n }, [stepNumber]);\n\n /* We debounce this handler, so that multiple containers can change at once without causing \n too many events. */\n const stepChangeCallback = useDebounceCallback(() => {\n // We don't want to emit the event after the component has been unmounted.\n if (!listenForSubStepChanges.current) {\n return;\n }\n\n subStepConfiguration.current.set(stepNumber, getSubStepConfiguration());\n handler(subStepConfiguration.current.get(stepNumber)!);\n }, SUBSTEP_CHANGE_DEBOUNCE);\n\n return { onStepChange: stepChangeCallback, subStepConfiguration };\n}\n\nconst InnerAnalyticsFunnelStep = ({ children, stepNumber, instanceIdentifier, ...rest }: AnalyticsFunnelStepProps) => {\n const { funnelInteractionId, funnelNameSelector, funnelState, funnelType } = useFunnel();\n const parentStep = useFunnelStep();\n const parentStepExists = parentStep.isInStep;\n const parentStepFunnelInteractionId = parentStep.funnelInteractionId;\n\n const funnelStepProps = { [DATA_ATTR_FUNNEL_STEP]: stepNumber };\n\n const subStepCount = useRef<number>(0);\n\n const stepNameSelector = rest.stepNameSelector || funnelNameSelector;\n const { onStepChange, subStepConfiguration } = useStepChangeListener(stepNumber, subStepConfiguration => {\n if (!funnelInteractionId) {\n return;\n }\n const stepName = getNameFromSelector(stepNameSelector) ?? '';\n\n FunnelMetrics.funnelStepChange({\n instanceIdentifier,\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n totalSubSteps: subStepCount.current,\n subStepConfiguration,\n });\n });\n\n // This useEffect hook is used to track the start and completion of interaction with the step.\n // On mount, if there is a valid funnel interaction id, it calls the 'funnelStepStart' method from FunnelMetrics\n // to record the beginning of the interaction with the current step.\n // On unmount, it does a similar thing but this time calling 'funnelStepComplete' to record the completion of the interaction.\n useEffect(() => {\n if (!funnelInteractionId) {\n // This step is not inside an active funnel.\n return;\n }\n if (parentStepExists && parentStepFunnelInteractionId) {\n /*\n This step is inside another step, which already reports events as\n part of an active funnel (i.e. that step is not a parent of a Wizard).\n Thus, this current step does not need to report any events.\n */\n return;\n }\n\n const stepName = getNameFromSelector(stepNameSelector);\n\n if (funnelState.current === 'default') {\n FunnelMetrics.funnelStepStart({\n instanceIdentifier,\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n totalSubSteps: subStepCount.current,\n subStepConfiguration: getSubStepConfiguration(),\n });\n }\n\n return () => {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n if (funnelState.current !== 'cancelled') {\n FunnelMetrics.funnelStepComplete({\n instanceIdentifier,\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n totalSubSteps: subStepCount.current,\n });\n }\n };\n }, [\n instanceIdentifier,\n funnelInteractionId,\n stepNumber,\n stepNameSelector,\n funnelState,\n parentStepExists,\n funnelType,\n parentStepFunnelInteractionId,\n ]);\n\n const contextValue: FunnelStepContextValue = {\n instanceIdentifier,\n stepNumber,\n stepNameSelector,\n funnelStepProps,\n subStepCount,\n isInStep: true,\n funnelInteractionId,\n onStepChange,\n subStepConfiguration,\n };\n\n /*\n If this step is inside another step which already reports events as part of an active\n funnel (i.e. that step is not a parent of a Wizard), the current step becomes invisible\n in the hierarchy by passing the context of its parent through.\n */\n const effectiveContextValue = parentStepExists && parentStepFunnelInteractionId ? parentStep : contextValue;\n\n return (\n <FunnelStepContext.Provider value={effectiveContextValue}>\n {typeof children === 'function' ? children(effectiveContextValue) : children}\n </FunnelStepContext.Provider>\n );\n};\ninterface AnalyticsFunnelSubStepProps {\n instanceIdentifier?: AnalyticsMetadata['instanceIdentifier'];\n errorContext?: AnalyticsMetadata['errorContext'];\n children?: React.ReactNode | ((props: FunnelSubStepContextValue) => React.ReactNode);\n}\n\nexport const AnalyticsFunnelSubStep = ({ children, instanceIdentifier }: AnalyticsFunnelSubStepProps) => {\n const subStepId = useUniqueId('substep');\n const subStepSelector = getSubStepSelector(subStepId);\n const subStepNameSelector = getSubStepNameSelector(subStepId);\n const subStepRef = useRef<HTMLDivElement | null>(null);\n const { subStepCount, onStepChange } = useFunnelStep();\n const mousePressed = useRef<boolean>(false);\n const isFocusedSubStep = useRef<boolean>(false);\n const focusCleanupFunction = useRef<undefined | (() => void)>(undefined);\n const { funnelState, funnelInteractionId } = useFunnel();\n const { stepNumber, stepNameSelector } = useFunnelStep();\n\n const newContext: FunnelSubStepContextValue = {\n instanceIdentifier,\n subStepSelector,\n subStepNameSelector,\n subStepId,\n subStepRef,\n mousePressed,\n isFocusedSubStep,\n focusCleanupFunction,\n isNestedSubStep: false,\n };\n\n const inheritedContext = { ...useContext(FunnelSubStepContext), isNestedSubStep: true };\n\n const isNested = Boolean(inheritedContext.subStepId);\n\n useEffect(() => {\n if (!isNested) {\n subStepCount.current++;\n onStepChange();\n\n return () => {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n subStepCount.current--;\n onStepChange();\n };\n }\n }, [isNested, subStepCount, onStepChange]);\n\n const context = isNested ? inheritedContext : newContext;\n\n useEffect(() => {\n if (isNested || !subStepRef.current) {\n return;\n }\n\n const onMouseDown = () => (mousePressed.current = true);\n\n const onMouseUp = async () => {\n mousePressed.current = false;\n\n if (!isFocusedSubStep.current) {\n return;\n }\n\n /*\n Some mouse events result in an element being focused. However,\n this happens only _after_ the onMouseUp event. We yield the\n event loop here, so that `document.activeElement` has the\n correct new value. \n */\n await new Promise(r => setTimeout(r, 1));\n\n if (!subStepRef.current || !document.activeElement || !nodeBelongs(subStepRef.current, document.activeElement)) {\n isFocusedSubStep.current = false;\n\n /*\n Run this substep's own focus cleanup function if another substep\n hasn't already done it for us.\n */\n focusCleanupFunction.current?.();\n }\n };\n window.addEventListener('mousedown', onMouseDown);\n window.addEventListener('mouseup', onMouseUp);\n return () => {\n window.removeEventListener('mousedown', onMouseDown);\n window.removeEventListener('mouseup', onMouseUp);\n };\n }, [\n funnelInteractionId,\n funnelState,\n stepNameSelector,\n stepNumber,\n subStepNameSelector,\n subStepSelector,\n focusCleanupFunction,\n isNested,\n subStepRef,\n ]);\n\n return (\n <FunnelSubStepContext.Provider value={context}>\n {typeof children === 'function' ? children(context) : children}\n </FunnelSubStepContext.Provider>\n );\n};\n"]}
|
|
1
|
+
{"version":3,"file":"analytics-funnel.js","sourceRoot":"","sources":["../../../../../src/internal/analytics/components/analytics-funnel.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useContext, useEffect, useRef, useState } from 'react';\n\nimport {\n FunnelStepContext,\n FunnelSubStepContext,\n FunnelContext,\n FunnelContextValue,\n FunnelStepContextValue,\n FunnelState,\n FunnelSubStepContextValue,\n} from '../context/analytics-context';\nimport { useFunnel, useFunnelStep } from '../hooks/use-funnel';\nimport { useUniqueId } from '../../hooks/use-unique-id';\nimport { useVisualRefresh } from '../../hooks/use-visual-mode';\n\nimport { PACKAGE_VERSION } from '../../environment';\n\nimport { FunnelMetrics } from '../index';\nimport {\n AnalyticsMetadata,\n FunnelStartProps,\n FunnelStepProps,\n StepConfiguration,\n SubStepConfiguration,\n} from '../interfaces';\n\nimport {\n DATA_ATTR_FUNNEL_STEP,\n getFunnelNameSelector,\n getNameFromSelector,\n getSubStepAllSelector,\n getSubStepNameSelector,\n getSubStepSelector,\n} from '../selectors';\nimport { useDebounceCallback } from '../../hooks/use-debounce-callback';\nimport { nodeBelongs } from '../../utils/node-belongs';\n\nexport const FUNNEL_VERSION = '1.4';\n\ninterface AnalyticsFunnelProps {\n children?: React.ReactNode;\n stepConfiguration?: StepConfiguration[];\n funnelNameSelectors?: string[];\n funnelType: FunnelStartProps['funnelType'];\n optionalStepNumbers: FunnelStartProps['optionalStepNumbers'];\n totalFunnelSteps: FunnelStartProps['totalFunnelSteps'];\n funnelIdentifier?: AnalyticsMetadata['instanceIdentifier'];\n funnelFlowType?: AnalyticsMetadata['flowType'];\n funnelErrorContext?: AnalyticsMetadata['errorContext'];\n}\n\nexport const AnalyticsFunnel = (props: AnalyticsFunnelProps) => {\n const { isInFunnel } = useFunnel();\n /*\n If the current funnel component is a Form (i.e. single-page funnel), it should\n defer its funnel-handling to a parent Form element, if present.\n Wizards (i.e. multi-page funnels) always take highest precedence for handling funnels,\n and do not defer to any other element.\n */\n if (isInFunnel && props.funnelType === 'single-page') {\n return <>{props.children}</>;\n }\n\n return <InnerAnalyticsFunnel {...props} />;\n};\nexport const CREATION_EDIT_FLOW_DONE_EVENT_NAME = 'awsui-creation-edit-flow-done';\nconst dispatchCreateEditFlowDoneEvent = () => {\n try {\n window.top?.document.dispatchEvent(new Event(CREATION_EDIT_FLOW_DONE_EVENT_NAME));\n } catch {\n // probably because of cross-origin error, then do not dispatch the event\n }\n};\n\nconst onFunnelCancelled = ({\n funnelInteractionId,\n funnelIdentifier,\n}: {\n funnelInteractionId: string;\n funnelIdentifier?: string;\n}) => {\n FunnelMetrics.funnelCancelled({ funnelInteractionId, funnelIdentifier });\n};\n\nconst onFunnelComplete = ({\n funnelInteractionId,\n funnelIdentifier,\n}: {\n funnelInteractionId: string;\n funnelIdentifier?: string;\n}) => {\n FunnelMetrics.funnelComplete({ funnelInteractionId, funnelIdentifier });\n dispatchCreateEditFlowDoneEvent();\n};\n\nfunction evaluateSelectors(selectors: string[], defaultSelector: string) {\n for (const selector of selectors) {\n const element = document.querySelector(selector);\n if (element) {\n return selector;\n }\n }\n\n return defaultSelector;\n}\n\nconst InnerAnalyticsFunnel = ({ children, stepConfiguration, ...props }: AnalyticsFunnelProps) => {\n const [funnelInteractionId, setFunnelInteractionId] = useState<string>('');\n const [submissionAttempt, setSubmissionAttempt] = useState(0);\n const isVisualRefresh = useVisualRefresh();\n const funnelState = useRef<FunnelState>('default');\n const funnelNameSelector = useRef<string>(getFunnelNameSelector());\n const errorCount = useRef<number>(0);\n const loadingButtonCount = useRef<number>(0);\n const wizardCount = useRef<number>(0);\n const latestFocusCleanupFunction = useRef<undefined | (() => void)>(undefined);\n\n // This useEffect hook is run once on component mount to initiate the funnel analytics.\n // It first calls the 'funnelStart' method from FunnelMetrics, providing all necessary details\n // about the funnel, and receives a unique interaction id.\n // This unique interaction id is then stored in the state for further use.\n //\n // On component unmount, it checks whether the funnel was successfully completed.\n // Based on this, it either calls 'funnelComplete' or 'funnelCancelled' method from FunnelMetrics.\n //\n // The eslint-disable is required as we deliberately want this effect to run only once on mount and unmount,\n // hence we do not provide any dependencies.\n useEffect(() => {\n /*\n We run this effect with a delay, in order to detect whether this funnel contains a Wizard.\n If it does contain a Wizard, that Wizard should take precedence for handling the funnel, and\n this current funnel component should do nothing.\n */\n let funnelInteractionId: string;\n const handle = setTimeout(() => {\n funnelNameSelector.current = evaluateSelectors(props.funnelNameSelectors || [], getFunnelNameSelector());\n\n if (props.funnelType === 'single-page' && wizardCount.current > 0) {\n return;\n }\n\n // Reset the state, in case the component was re-mounted.\n funnelState.current = 'default';\n\n const singleStepFlowStepConfiguration = [\n {\n number: 1,\n isOptional: false,\n name: getNameFromSelector(funnelNameSelector.current) ?? '',\n stepIdentifier: props.funnelIdentifier,\n },\n ];\n\n funnelInteractionId = FunnelMetrics.funnelStart({\n funnelIdentifier: props.funnelIdentifier,\n flowType: props.funnelFlowType,\n funnelNameSelector: funnelNameSelector.current,\n optionalStepNumbers: props.optionalStepNumbers,\n funnelType: props.funnelType,\n totalFunnelSteps: props.totalFunnelSteps,\n componentVersion: PACKAGE_VERSION,\n componentTheme: isVisualRefresh ? 'vr' : 'classic',\n funnelVersion: FUNNEL_VERSION,\n stepConfiguration: stepConfiguration ?? singleStepFlowStepConfiguration,\n });\n\n setFunnelInteractionId(funnelInteractionId);\n }, 1);\n\n /*\n A funnel counts as \"successful\" if it is unmounted after being \"complete\".\n */\n /* eslint-disable react-hooks/exhaustive-deps */\n return () => {\n clearTimeout(handle);\n if (props.funnelType === 'single-page' && wizardCount.current > 0) {\n return;\n }\n\n if (funnelState.current === 'validating') {\n // Finish the validation phase early.\n onFunnelComplete({ funnelInteractionId, funnelIdentifier: props.funnelIdentifier });\n funnelState.current = 'complete';\n }\n\n if (funnelState.current === 'complete') {\n FunnelMetrics.funnelSuccessful({ funnelInteractionId, funnelIdentifier: props.funnelIdentifier });\n } else {\n onFunnelCancelled({ funnelInteractionId, funnelIdentifier: props.funnelIdentifier });\n funnelState.current = 'cancelled';\n }\n };\n }, []);\n /* eslint-enable react-hooks/exhaustive-deps */\n\n const funnelSubmit = () => {\n funnelState.current = 'validating';\n\n /*\n When the user attempts to submit the form, we wait for 50 milliseconds before checking\n if any form validation errors are present. This value was chosen to give enough time\n for validation and rerendering to occur, but be low enough that the user will not\n be able to take further action in the meantime.\n */\n const VALIDATION_WAIT_DELAY = 50;\n /*\n Loading is expected to take longer than validation, so we can keep the pressure on the CPU low.\n */\n const LOADING_WAIT_DELAY = 100;\n\n const checkForCompleteness = () => {\n if (funnelState.current === 'complete') {\n return;\n }\n\n if (loadingButtonCount.current > 0) {\n setTimeout(checkForCompleteness, LOADING_WAIT_DELAY);\n return;\n }\n\n if (errorCount.current === 0) {\n /*\n If no validation errors are rendered, we treat the funnel as complete.\n */\n onFunnelComplete({ funnelInteractionId });\n funnelState.current = 'complete';\n } else {\n funnelState.current = 'default';\n }\n };\n\n setTimeout(checkForCompleteness, VALIDATION_WAIT_DELAY);\n };\n\n const funnelNextOrSubmitAttempt = () => setSubmissionAttempt(i => i + 1);\n\n const funnelCancel = () => {};\n\n const funnelContextValue: FunnelContextValue = {\n funnelInteractionId,\n funnelIdentifier: props.funnelIdentifier,\n funnelFlowType: props.funnelFlowType,\n funnelErrorContext: props.funnelErrorContext,\n setFunnelInteractionId,\n funnelType: props.funnelType,\n optionalStepNumbers: props.optionalStepNumbers,\n totalFunnelSteps: props.totalFunnelSteps,\n funnelNameSelector: funnelNameSelector.current,\n funnelSubmit,\n funnelCancel,\n submissionAttempt,\n funnelNextOrSubmitAttempt,\n funnelState,\n errorCount,\n loadingButtonCount,\n latestFocusCleanupFunction,\n isInFunnel: true,\n wizardCount,\n };\n\n return <FunnelContext.Provider value={funnelContextValue}>{children}</FunnelContext.Provider>;\n};\n\ninterface AnalyticsFunnelStepProps {\n stepIdentifier?: AnalyticsMetadata['instanceIdentifier'];\n stepErrorContext?: AnalyticsMetadata['errorContext'];\n children?: React.ReactNode | ((props: FunnelStepContextValue) => React.ReactNode);\n stepNameSelector?: FunnelStepProps['stepNameSelector'];\n stepNumber: FunnelStepProps['stepNumber'];\n}\n\nexport const AnalyticsFunnelStep = (props: AnalyticsFunnelStepProps) => {\n /*\n This wrapper is used to apply a `key` property to the actual (inner) AnalyticsFunnelStep\n element. This allows us to keep the state and effects separate per step.\n */\n return <InnerAnalyticsFunnelStep {...props} key={props.stepNumber} />;\n};\n\nfunction getSubStepConfiguration(): SubStepConfiguration[] {\n const subSteps = Array.from(document.querySelectorAll<HTMLElement>(getSubStepAllSelector()));\n\n const subStepConfiguration = subSteps.map((substep, index) => {\n const subStepIdentifier = (substep as any)?.__awsuiMetadata__?.analytics?.instanceIdentifier;\n\n const name = substep.querySelector<HTMLElement>(getSubStepNameSelector())?.innerText?.trim() ?? '';\n\n return {\n name,\n number: index + 1,\n subStepIdentifier,\n };\n });\n return subStepConfiguration;\n}\n\nfunction useStepChangeListener(stepNumber: number, handler: (stepConfiguration: SubStepConfiguration[]) => void) {\n const subStepConfiguration = useRef(new Map<number, SubStepConfiguration[] | undefined>());\n /*\n Chosen so that it's hopefully shorter than a user interaction, but gives enough time for the\n amount of containers to stabilise.\n */\n const SUBSTEP_CHANGE_DEBOUNCE = 50;\n\n const listenForSubStepChanges = useRef(false);\n useEffect(() => {\n // We prevent emitting the event on the first render.\n const handle = setTimeout(() => (listenForSubStepChanges.current = true), SUBSTEP_CHANGE_DEBOUNCE);\n\n return () => {\n clearTimeout(handle);\n listenForSubStepChanges.current = false;\n };\n }, []);\n\n useEffect(() => {\n const handle = setTimeout(\n () => subStepConfiguration.current.set(stepNumber, getSubStepConfiguration()),\n SUBSTEP_CHANGE_DEBOUNCE\n );\n return () => {\n clearTimeout(handle);\n };\n }, [stepNumber]);\n\n /* We debounce this handler, so that multiple containers can change at once without causing \n too many events. */\n const stepChangeCallback = useDebounceCallback(() => {\n // We don't want to emit the event after the component has been unmounted.\n if (!listenForSubStepChanges.current) {\n return;\n }\n\n subStepConfiguration.current.set(stepNumber, getSubStepConfiguration());\n handler(subStepConfiguration.current.get(stepNumber)!);\n }, SUBSTEP_CHANGE_DEBOUNCE);\n\n return { onStepChange: stepChangeCallback, subStepConfiguration };\n}\n\nconst InnerAnalyticsFunnelStep = ({\n children,\n stepNumber,\n stepIdentifier,\n stepErrorContext,\n ...rest\n}: AnalyticsFunnelStepProps) => {\n const { funnelInteractionId, funnelIdentifier, funnelNameSelector, funnelState, funnelType } = useFunnel();\n const parentStep = useFunnelStep();\n const parentStepExists = parentStep.isInStep;\n const parentStepFunnelInteractionId = parentStep.funnelInteractionId;\n\n const funnelStepProps = { [DATA_ATTR_FUNNEL_STEP]: stepNumber };\n\n const subStepCount = useRef<number>(0);\n\n const stepNameSelector = rest.stepNameSelector || funnelNameSelector;\n const { onStepChange, subStepConfiguration } = useStepChangeListener(stepNumber, subStepConfiguration => {\n if (!funnelInteractionId) {\n return;\n }\n\n FunnelMetrics.funnelStepChange({\n stepIdentifier,\n funnelIdentifier,\n funnelInteractionId,\n stepNumber,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n totalSubSteps: subStepCount.current,\n subStepConfiguration,\n });\n });\n\n // This useEffect hook is used to track the start and completion of interaction with the step.\n // On mount, if there is a valid funnel interaction id, it calls the 'funnelStepStart' method from FunnelMetrics\n // to record the beginning of the interaction with the current step.\n // On unmount, it does a similar thing but this time calling 'funnelStepComplete' to record the completion of the interaction.\n useEffect(() => {\n if (!funnelInteractionId) {\n // This step is not inside an active funnel.\n return;\n }\n if (parentStepExists && parentStepFunnelInteractionId) {\n /*\n This step is inside another step, which already reports events as\n part of an active funnel (i.e. that step is not a parent of a Wizard).\n Thus, this current step does not need to report any events.\n */\n return;\n }\n\n const stepName = getNameFromSelector(stepNameSelector);\n\n if (funnelState.current === 'default') {\n FunnelMetrics.funnelStepStart({\n stepIdentifier,\n funnelIdentifier,\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n totalSubSteps: subStepCount.current,\n subStepConfiguration: getSubStepConfiguration(),\n });\n }\n\n return () => {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n if (funnelState.current !== 'cancelled') {\n FunnelMetrics.funnelStepComplete({\n funnelIdentifier,\n funnelInteractionId,\n stepIdentifier,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n totalSubSteps: subStepCount.current,\n });\n }\n };\n }, [\n stepIdentifier,\n funnelIdentifier,\n funnelInteractionId,\n stepNumber,\n stepNameSelector,\n funnelState,\n parentStepExists,\n funnelType,\n parentStepFunnelInteractionId,\n ]);\n\n const contextValue: FunnelStepContextValue = {\n stepIdentifier,\n stepNumber,\n stepNameSelector,\n funnelStepProps,\n subStepCount,\n isInStep: true,\n funnelInteractionId,\n onStepChange,\n subStepConfiguration,\n stepErrorContext,\n };\n\n /*\n If this step is inside another step which already reports events as part of an active\n funnel (i.e. that step is not a parent of a Wizard), the current step becomes invisible\n in the hierarchy by passing the context of its parent through.\n */\n const effectiveContextValue = parentStepExists && parentStepFunnelInteractionId ? parentStep : contextValue;\n\n return (\n <FunnelStepContext.Provider value={effectiveContextValue}>\n {typeof children === 'function' ? children(effectiveContextValue) : children}\n </FunnelStepContext.Provider>\n );\n};\ninterface AnalyticsFunnelSubStepProps {\n subStepIdentifier?: AnalyticsMetadata['instanceIdentifier'];\n subStepErrorContext?: AnalyticsMetadata['errorContext'];\n children?: React.ReactNode | ((props: FunnelSubStepContextValue) => React.ReactNode);\n}\n\nexport const AnalyticsFunnelSubStep = ({\n children,\n subStepIdentifier,\n subStepErrorContext,\n}: AnalyticsFunnelSubStepProps) => {\n const subStepId = useUniqueId('substep');\n const subStepSelector = getSubStepSelector(subStepId);\n const subStepNameSelector = getSubStepNameSelector(subStepId);\n const subStepRef = useRef<HTMLDivElement | null>(null);\n const { subStepCount, onStepChange } = useFunnelStep();\n const mousePressed = useRef<boolean>(false);\n const isFocusedSubStep = useRef<boolean>(false);\n const focusCleanupFunction = useRef<undefined | (() => void)>(undefined);\n const { funnelState, funnelInteractionId } = useFunnel();\n const { stepNumber, stepNameSelector } = useFunnelStep();\n\n const newContext: FunnelSubStepContextValue = {\n subStepIdentifier,\n subStepErrorContext,\n subStepSelector,\n subStepNameSelector,\n subStepId,\n subStepRef,\n mousePressed,\n isFocusedSubStep,\n focusCleanupFunction,\n isNestedSubStep: false,\n };\n\n const inheritedContext = { ...useContext(FunnelSubStepContext), isNestedSubStep: true };\n\n const isNested = Boolean(inheritedContext.subStepId);\n\n useEffect(() => {\n if (!isNested) {\n subStepCount.current++;\n onStepChange();\n\n return () => {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n subStepCount.current--;\n onStepChange();\n };\n }\n }, [isNested, subStepCount, onStepChange]);\n\n const context = isNested ? inheritedContext : newContext;\n\n useEffect(() => {\n if (isNested || !subStepRef.current) {\n return;\n }\n\n const onMouseDown = () => (mousePressed.current = true);\n\n const onMouseUp = async () => {\n mousePressed.current = false;\n\n if (!isFocusedSubStep.current) {\n return;\n }\n\n /*\n Some mouse events result in an element being focused. However,\n this happens only _after_ the onMouseUp event. We yield the\n event loop here, so that `document.activeElement` has the\n correct new value. \n */\n await new Promise(r => setTimeout(r, 1));\n\n if (!subStepRef.current || !document.activeElement || !nodeBelongs(subStepRef.current, document.activeElement)) {\n isFocusedSubStep.current = false;\n\n /*\n Run this substep's own focus cleanup function if another substep\n hasn't already done it for us.\n */\n focusCleanupFunction.current?.();\n }\n };\n window.addEventListener('mousedown', onMouseDown);\n window.addEventListener('mouseup', onMouseUp);\n return () => {\n window.removeEventListener('mousedown', onMouseDown);\n window.removeEventListener('mouseup', onMouseUp);\n };\n }, [\n funnelInteractionId,\n funnelState,\n stepNameSelector,\n stepNumber,\n subStepNameSelector,\n subStepSelector,\n focusCleanupFunction,\n isNested,\n subStepRef,\n ]);\n\n return (\n <FunnelSubStepContext.Provider value={context}>\n {typeof children === 'function' ? children(context) : children}\n </FunnelSubStepContext.Provider>\n );\n};\n"]}
|