@cloudscape-design/components 3.0.554 → 3.0.556
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/button/index.d.ts.map +1 -1
- package/button/index.js +0 -8
- package/button/index.js.map +1 -1
- package/button/internal.d.ts.map +1 -1
- package/button/internal.js +9 -0
- package/button/internal.js.map +1 -1
- package/flashbar/internal/analytics.d.ts.map +1 -1
- package/flashbar/internal/analytics.js +3 -1
- package/flashbar/internal/analytics.js.map +1 -1
- package/internal/environment.js +1 -1
- package/internal/environment.json +1 -1
- package/internal/hooks/use-performance-marks.d.ts +3 -0
- package/internal/hooks/use-performance-marks.d.ts.map +1 -0
- package/internal/hooks/use-performance-marks.js +41 -0
- package/internal/hooks/use-performance-marks.js.map +1 -0
- package/internal/hooks/use-unique-id/index.d.ts +0 -1
- package/internal/hooks/use-unique-id/index.d.ts.map +1 -1
- package/internal/hooks/use-unique-id/index.js +1 -1
- package/internal/hooks/use-unique-id/index.js.map +1 -1
- package/internal/manifest.json +1 -1
- package/package.json +1 -1
- package/spinner/index.d.ts.map +1 -1
- package/spinner/index.js +0 -9
- package/spinner/index.js.map +1 -1
- package/table/index.d.ts.map +1 -1
- package/table/index.js +0 -8
- package/table/index.js.map +1 -1
- package/table/internal.d.ts.map +1 -1
- package/table/internal.js +10 -0
- package/table/internal.js.map +1 -1
- package/tabs/index.d.ts +1 -1
- package/tabs/index.d.ts.map +1 -1
- package/tabs/index.js +3 -3
- package/tabs/index.js.map +1 -1
- package/tabs/interfaces.d.ts +5 -0
- package/tabs/interfaces.d.ts.map +1 -1
- package/tabs/interfaces.js.map +1 -1
- package/tabs/styles.css.js +22 -21
- package/tabs/styles.scoped.css +57 -39
- package/tabs/styles.selectors.js +22 -21
- package/internal/analytics/metrics.d.ts +0 -3
- package/internal/analytics/metrics.d.ts.map +0 -1
- package/internal/analytics/metrics.js +0 -6
- package/internal/analytics/metrics.js.map +0 -1
- package/internal/hooks/use-latency-metrics/index.d.ts +0 -11
- package/internal/hooks/use-latency-metrics/index.d.ts.map +0 -1
- package/internal/hooks/use-latency-metrics/index.js +0 -88
- package/internal/hooks/use-latency-metrics/index.js.map +0 -1
- package/internal/hooks/use-latency-metrics/is-in-viewport.d.ts +0 -9
- package/internal/hooks/use-latency-metrics/is-in-viewport.d.ts.map +0 -1
- package/internal/hooks/use-latency-metrics/is-in-viewport.js +0 -74
- package/internal/hooks/use-latency-metrics/is-in-viewport.js.map +0 -1
package/tabs/styles.scoped.css
CHANGED
|
@@ -195,7 +195,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
195
195
|
SPDX-License-Identifier: Apache-2.0
|
|
196
196
|
*/
|
|
197
197
|
/* stylelint-disable selector-max-type */
|
|
198
|
-
.awsui_tabs-
|
|
198
|
+
.awsui_tabs-header_14rmt_n8497_198:not(#\9) {
|
|
199
199
|
margin-block: 0;
|
|
200
200
|
margin-inline: 0;
|
|
201
201
|
padding-block: 0;
|
|
@@ -203,7 +203,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
203
203
|
display: flex;
|
|
204
204
|
}
|
|
205
205
|
|
|
206
|
-
.awsui_tabs-header-
|
|
206
|
+
.awsui_tabs-header-list_14rmt_n8497_206:not(#\9) {
|
|
207
207
|
margin-block: 0;
|
|
208
208
|
margin-inline: 0;
|
|
209
209
|
padding-block: 0;
|
|
@@ -216,33 +216,33 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
216
216
|
-ms-overflow-style: none; /* Internet Explorer 10+ */
|
|
217
217
|
scrollbar-width: none; /* Firefox */
|
|
218
218
|
}
|
|
219
|
-
.awsui_tabs-header-
|
|
219
|
+
.awsui_tabs-header-list_14rmt_n8497_206:not(#\9)::-webkit-scrollbar {
|
|
220
220
|
display: none; /* Safari and Chrome */
|
|
221
221
|
}
|
|
222
222
|
|
|
223
|
-
.awsui_pagination-
|
|
223
|
+
.awsui_pagination-button_14rmt_n8497_223:not(#\9) {
|
|
224
224
|
margin-block: var(--space-scaled-s-aqzyko, 12px);
|
|
225
225
|
margin-inline: 0;
|
|
226
226
|
padding-block: 0;
|
|
227
227
|
padding-inline: var(--space-xxs-p8yyaw, 4px);
|
|
228
228
|
display: flex;
|
|
229
229
|
}
|
|
230
|
-
.awsui_pagination-button-
|
|
230
|
+
.awsui_pagination-button-left_14rmt_n8497_230:not(#\9) {
|
|
231
231
|
border-inline-end: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-control-disabled-bv2kkn, #d1d5db);
|
|
232
232
|
}
|
|
233
|
-
.awsui_pagination-button-left-
|
|
233
|
+
.awsui_pagination-button-left-scrollable_14rmt_n8497_233:not(#\9) {
|
|
234
234
|
z-index: 1;
|
|
235
235
|
box-shadow: 5px 0px 4px -3px var(--color-border-tabs-shadow-w5xpb4, rgba(0, 7, 22, 0.12)), 1px 0px 0px 0px var(--color-border-tabs-shadow-w5xpb4, rgba(0, 7, 22, 0.12));
|
|
236
236
|
}
|
|
237
|
-
.awsui_pagination-button-
|
|
237
|
+
.awsui_pagination-button-right_14rmt_n8497_237:not(#\9) {
|
|
238
238
|
border-inline-start: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-control-disabled-bv2kkn, #d1d5db);
|
|
239
239
|
}
|
|
240
|
-
.awsui_pagination-button-right-
|
|
240
|
+
.awsui_pagination-button-right-scrollable_14rmt_n8497_240:not(#\9) {
|
|
241
241
|
z-index: 1;
|
|
242
242
|
box-shadow: -5px 0px 4px -3px var(--color-border-tabs-shadow-w5xpb4, rgba(0, 7, 22, 0.12)), -1px 0px 0px 0 var(--color-border-tabs-shadow-w5xpb4, rgba(0, 7, 22, 0.12));
|
|
243
243
|
}
|
|
244
244
|
|
|
245
|
-
.awsui_tabs-
|
|
245
|
+
.awsui_tabs-tab_14rmt_n8497_245:not(#\9) {
|
|
246
246
|
list-style: none;
|
|
247
247
|
padding-block: 0;
|
|
248
248
|
padding-inline: 0;
|
|
@@ -250,11 +250,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
250
250
|
display: flex;
|
|
251
251
|
max-inline-size: calc(90% - var(--space-l-t419sm, 20px));
|
|
252
252
|
}
|
|
253
|
-
.awsui_tabs-
|
|
253
|
+
.awsui_tabs-tab_14rmt_n8497_245 > button:not(#\9) {
|
|
254
254
|
background-color: transparent;
|
|
255
255
|
}
|
|
256
256
|
|
|
257
|
-
.awsui_tabs-tab-
|
|
257
|
+
.awsui_tabs-tab-label_14rmt_n8497_257:not(#\9) {
|
|
258
258
|
display: flex;
|
|
259
259
|
align-items: center;
|
|
260
260
|
padding-block: var(--space-scaled-2x-xxs-7v8ivz, 4px);
|
|
@@ -265,12 +265,12 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
265
265
|
word-break: break-word;
|
|
266
266
|
}
|
|
267
267
|
|
|
268
|
-
.awsui_tabs-
|
|
268
|
+
.awsui_tabs-tab_14rmt_n8497_245:not(#\9):not(:last-child) > a > .awsui_tabs-tab-label_14rmt_n8497_257, .awsui_tabs-tab_14rmt_n8497_245:not(#\9):not(:last-child) > button > .awsui_tabs-tab-label_14rmt_n8497_257 {
|
|
269
269
|
margin-inline-end: calc(-1 * var(--border-divider-section-width-1061zr, 1px));
|
|
270
270
|
border-inline-end: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-tabs-divider-6vpso4, #b6bec9);
|
|
271
271
|
}
|
|
272
272
|
|
|
273
|
-
.awsui_tabs-tab-
|
|
273
|
+
.awsui_tabs-tab-link_14rmt_n8497_273:not(#\9) {
|
|
274
274
|
position: relative;
|
|
275
275
|
display: flex;
|
|
276
276
|
align-items: stretch;
|
|
@@ -289,26 +289,26 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
289
289
|
-webkit-font-smoothing: var(--font-smoothing-webkit-m8nc84, antialiased);
|
|
290
290
|
-moz-osx-font-smoothing: var(--font-smoothing-moz-osx-foywby, grayscale);
|
|
291
291
|
}
|
|
292
|
-
.awsui_tabs-tab-
|
|
292
|
+
.awsui_tabs-tab-link_14rmt_n8497_273.awsui_refresh_14rmt_n8497_292:not(#\9) {
|
|
293
293
|
padding-block-start: calc(var(--space-static-xs-7sfb63, 8px) - 1px);
|
|
294
294
|
padding-block-end: var(--space-static-xs-7sfb63, 8px);
|
|
295
295
|
padding-inline: 0;
|
|
296
296
|
}
|
|
297
|
-
.awsui_tabs-tab-
|
|
297
|
+
.awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):hover {
|
|
298
298
|
color: var(--color-text-accent-n2acxv, #0972d3);
|
|
299
299
|
}
|
|
300
|
-
.awsui_tabs-tab-
|
|
300
|
+
.awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):focus {
|
|
301
301
|
outline: none;
|
|
302
302
|
}
|
|
303
|
-
body[data-awsui-focus-visible=true] .awsui_tabs-tab-
|
|
303
|
+
body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):focus {
|
|
304
304
|
z-index: 1;
|
|
305
305
|
position: relative;
|
|
306
306
|
}
|
|
307
|
-
body[data-awsui-focus-visible=true] .awsui_tabs-tab-
|
|
307
|
+
body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):focus {
|
|
308
308
|
outline: 2px dotted transparent;
|
|
309
309
|
outline-offset: calc(var(--space-tabs-focus-outline-gutter-xm37ly, -8px) - 1px);
|
|
310
310
|
}
|
|
311
|
-
body[data-awsui-focus-visible=true] .awsui_tabs-tab-
|
|
311
|
+
body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):focus::before {
|
|
312
312
|
content: " ";
|
|
313
313
|
display: block;
|
|
314
314
|
position: absolute;
|
|
@@ -322,32 +322,32 @@ body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9
|
|
|
322
322
|
border-end-end-radius: var(--border-radius-control-default-focus-ring-u8zbsz, 4px);
|
|
323
323
|
box-shadow: 0 0 0 2px var(--color-border-item-focused-b2ntyl, #0972d3);
|
|
324
324
|
}
|
|
325
|
-
body[data-awsui-focus-visible=true] .awsui_tabs-tab-
|
|
325
|
+
body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):focus > a > .awsui_tabs-tab-label_14rmt_n8497_257, body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):focus > button > .awsui_tabs-tab-label_14rmt_n8497_257 {
|
|
326
326
|
border-inline-end-color: transparent;
|
|
327
327
|
}
|
|
328
328
|
|
|
329
|
-
.awsui_tabs-
|
|
329
|
+
.awsui_tabs-tab_14rmt_n8497_245:not(#\9):first-child {
|
|
330
330
|
margin-inline-start: 1px;
|
|
331
331
|
}
|
|
332
|
-
.awsui_tabs-
|
|
332
|
+
.awsui_tabs-tab_14rmt_n8497_245:not(#\9):first-child > a > .awsui_tabs-tab-label_14rmt_n8497_257, .awsui_tabs-tab_14rmt_n8497_245:not(#\9):first-child > button > .awsui_tabs-tab-label_14rmt_n8497_257 {
|
|
333
333
|
padding-inline-start: calc(var(--space-l-t419sm, 20px) - 1px);
|
|
334
334
|
}
|
|
335
335
|
|
|
336
|
-
.awsui_tabs-
|
|
336
|
+
.awsui_tabs-tab_14rmt_n8497_245:not(#\9):last-child {
|
|
337
337
|
margin-inline-end: 1px;
|
|
338
338
|
}
|
|
339
|
-
.awsui_tabs-
|
|
339
|
+
.awsui_tabs-tab_14rmt_n8497_245:not(#\9):last-child > a > .awsui_tabs-tab-label_14rmt_n8497_257, .awsui_tabs-tab_14rmt_n8497_245:not(#\9):last-child > button > .awsui_tabs-tab-label_14rmt_n8497_257 {
|
|
340
340
|
padding-inline-end: calc(var(--space-l-t419sm, 20px) - 1px);
|
|
341
341
|
}
|
|
342
342
|
|
|
343
|
-
.awsui_tabs-tab-
|
|
343
|
+
.awsui_tabs-tab-disabled_14rmt_n8497_343:not(#\9), .awsui_tabs-tab-disabled_14rmt_n8497_343:not(#\9):hover {
|
|
344
344
|
pointer-events: none;
|
|
345
345
|
cursor: default;
|
|
346
346
|
color: var(--color-text-interactive-disabled-z7a3t4, #9ba7b6);
|
|
347
347
|
font-weight: var(--font-tabs-disabled-weight-1xcs5l, 700);
|
|
348
348
|
}
|
|
349
349
|
|
|
350
|
-
.awsui_tabs-tab-
|
|
350
|
+
.awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_n8497_343):after {
|
|
351
351
|
content: "";
|
|
352
352
|
position: absolute;
|
|
353
353
|
inset-inline-start: 0;
|
|
@@ -361,36 +361,36 @@ body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9
|
|
|
361
361
|
background: var(--color-border-tabs-underline-f1qo5r, #0972d3);
|
|
362
362
|
opacity: 0;
|
|
363
363
|
}
|
|
364
|
-
.awsui_tabs-tab-
|
|
364
|
+
.awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_n8497_343).awsui_refresh_14rmt_n8497_292:after {
|
|
365
365
|
transition: opacity var(--motion-duration-refresh-only-medium-nf6485, 165ms) var(--motion-easing-refresh-only-c-vg1m9h, cubic-bezier(0.84, 0, 0.16, 1));
|
|
366
366
|
}
|
|
367
367
|
@media (prefers-reduced-motion: reduce) {
|
|
368
|
-
.awsui_tabs-tab-
|
|
368
|
+
.awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_n8497_343).awsui_refresh_14rmt_n8497_292:after {
|
|
369
369
|
animation: none;
|
|
370
370
|
transition: none;
|
|
371
371
|
}
|
|
372
372
|
}
|
|
373
|
-
.awsui-motion-disabled .awsui_tabs-tab-
|
|
373
|
+
.awsui-motion-disabled .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_n8497_343).awsui_refresh_14rmt_n8497_292:after, .awsui-mode-entering .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_n8497_343).awsui_refresh_14rmt_n8497_292:after {
|
|
374
374
|
animation: none;
|
|
375
375
|
transition: none;
|
|
376
376
|
}
|
|
377
377
|
|
|
378
|
-
.awsui_tabs-tab-
|
|
378
|
+
.awsui_tabs-tab-active_14rmt_n8497_378:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_n8497_343) {
|
|
379
379
|
color: var(--color-text-accent-n2acxv, #0972d3);
|
|
380
380
|
}
|
|
381
|
-
.awsui_tabs-tab-
|
|
381
|
+
.awsui_tabs-tab-active_14rmt_n8497_378:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_n8497_343):after {
|
|
382
382
|
opacity: 1;
|
|
383
383
|
}
|
|
384
384
|
|
|
385
|
-
.awsui_tabs-header-with-
|
|
385
|
+
.awsui_tabs-header-with-divider_14rmt_n8497_385:not(#\9) {
|
|
386
386
|
border-block-end: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-tabs-divider-6vpso4, #b6bec9);
|
|
387
387
|
}
|
|
388
388
|
|
|
389
|
-
.
|
|
389
|
+
.awsui_root_14rmt_n8497_389:not(#\9) {
|
|
390
390
|
/* used in test-utils or tests */
|
|
391
391
|
}
|
|
392
392
|
|
|
393
|
-
.
|
|
393
|
+
.awsui_tabs_14rmt_n8497_198:not(#\9) {
|
|
394
394
|
border-collapse: separate;
|
|
395
395
|
border-spacing: 0;
|
|
396
396
|
box-sizing: border-box;
|
|
@@ -428,14 +428,21 @@ body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9
|
|
|
428
428
|
inline-size: 100%;
|
|
429
429
|
}
|
|
430
430
|
|
|
431
|
-
.awsui_tabs-
|
|
431
|
+
.awsui_tabs-content_14rmt_n8497_430:not(#\9) {
|
|
432
432
|
display: none;
|
|
433
433
|
}
|
|
434
434
|
|
|
435
|
-
.
|
|
435
|
+
.awsui_fit-height_14rmt_n8497_434:not(#\9) {
|
|
436
|
+
display: flex;
|
|
437
|
+
flex-direction: column;
|
|
438
|
+
block-size: 100%;
|
|
439
|
+
}
|
|
440
|
+
|
|
441
|
+
.awsui_tabs-content-active_14rmt_n8497_440:not(#\9) {
|
|
436
442
|
display: block;
|
|
443
|
+
flex: 1;
|
|
437
444
|
}
|
|
438
|
-
body[data-awsui-focus-visible=true] .awsui_tabs-content-
|
|
445
|
+
body[data-awsui-focus-visible=true] .awsui_tabs-content-active_14rmt_n8497_440:not(#\9):focus {
|
|
439
446
|
outline: 2px dotted transparent;
|
|
440
447
|
outline-offset: 2px;
|
|
441
448
|
border-start-start-radius: var(--border-radius-container-wqv1zi, 16px);
|
|
@@ -445,12 +452,23 @@ body[data-awsui-focus-visible=true] .awsui_tabs-content-active_14rmt_13jmh_434:n
|
|
|
445
452
|
box-shadow: 0 0 0 2px var(--color-border-item-focused-b2ntyl, #0972d3);
|
|
446
453
|
}
|
|
447
454
|
|
|
448
|
-
.awsui_tabs-content-
|
|
455
|
+
.awsui_tabs-content-wrapper_14rmt_n8497_454.awsui_with-paddings_14rmt_n8497_454 > .awsui_tabs-content_14rmt_n8497_430:not(#\9) {
|
|
449
456
|
padding-block: var(--space-scaled-m-mo5yse, 16px);
|
|
450
457
|
padding-inline: 0;
|
|
451
458
|
}
|
|
459
|
+
.awsui_fit-height_14rmt_n8497_434 > .awsui_tabs-content-wrapper_14rmt_n8497_454:not(#\9) {
|
|
460
|
+
flex: 1;
|
|
461
|
+
display: flex;
|
|
462
|
+
flex-direction: column;
|
|
463
|
+
overflow: auto;
|
|
464
|
+
}
|
|
452
465
|
|
|
453
|
-
.awsui_tabs-
|
|
466
|
+
.awsui_fit-height_14rmt_n8497_434 > .awsui_tabs-content-wrapper_14rmt_n8497_454 > .awsui_tabs-container-content-wrapper_14rmt_n8497_465:not(#\9) {
|
|
467
|
+
block-size: 100%;
|
|
468
|
+
display: flex;
|
|
469
|
+
flex-direction: column;
|
|
470
|
+
}
|
|
471
|
+
.awsui_tabs-container-content-wrapper_14rmt_n8497_465.awsui_with-paddings_14rmt_n8497_454 > .awsui_tabs-content_14rmt_n8497_430:not(#\9) {
|
|
454
472
|
padding-block-start: var(--space-tabs-content-top-dedu0k, 12px);
|
|
455
473
|
padding-block-end: var(--space-scaled-l-0hpmd7, 20px);
|
|
456
474
|
padding-inline: var(--space-container-horizontal-wfukh3, 20px);
|
package/tabs/styles.selectors.js
CHANGED
|
@@ -2,26 +2,27 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"tabs-header": "awsui_tabs-
|
|
6
|
-
"tabs-header-list": "awsui_tabs-header-
|
|
7
|
-
"pagination-button": "awsui_pagination-
|
|
8
|
-
"pagination-button-left": "awsui_pagination-button-
|
|
9
|
-
"pagination-button-left-scrollable": "awsui_pagination-button-left-
|
|
10
|
-
"pagination-button-right": "awsui_pagination-button-
|
|
11
|
-
"pagination-button-right-scrollable": "awsui_pagination-button-right-
|
|
12
|
-
"tabs-tab": "awsui_tabs-
|
|
13
|
-
"tabs-tab-label": "awsui_tabs-tab-
|
|
14
|
-
"tabs-tab-link": "awsui_tabs-tab-
|
|
15
|
-
"refresh": "
|
|
16
|
-
"tabs-tab-disabled": "awsui_tabs-tab-
|
|
17
|
-
"tabs-tab-active": "awsui_tabs-tab-
|
|
18
|
-
"tabs-header-with-divider": "awsui_tabs-header-with-
|
|
19
|
-
"root": "
|
|
20
|
-
"tabs": "
|
|
21
|
-
"tabs-content": "awsui_tabs-
|
|
22
|
-
"
|
|
23
|
-
"tabs-content-
|
|
24
|
-
"
|
|
25
|
-
"
|
|
5
|
+
"tabs-header": "awsui_tabs-header_14rmt_n8497_198",
|
|
6
|
+
"tabs-header-list": "awsui_tabs-header-list_14rmt_n8497_206",
|
|
7
|
+
"pagination-button": "awsui_pagination-button_14rmt_n8497_223",
|
|
8
|
+
"pagination-button-left": "awsui_pagination-button-left_14rmt_n8497_230",
|
|
9
|
+
"pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_n8497_233",
|
|
10
|
+
"pagination-button-right": "awsui_pagination-button-right_14rmt_n8497_237",
|
|
11
|
+
"pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_n8497_240",
|
|
12
|
+
"tabs-tab": "awsui_tabs-tab_14rmt_n8497_245",
|
|
13
|
+
"tabs-tab-label": "awsui_tabs-tab-label_14rmt_n8497_257",
|
|
14
|
+
"tabs-tab-link": "awsui_tabs-tab-link_14rmt_n8497_273",
|
|
15
|
+
"refresh": "awsui_refresh_14rmt_n8497_292",
|
|
16
|
+
"tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_n8497_343",
|
|
17
|
+
"tabs-tab-active": "awsui_tabs-tab-active_14rmt_n8497_378",
|
|
18
|
+
"tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_n8497_385",
|
|
19
|
+
"root": "awsui_root_14rmt_n8497_389",
|
|
20
|
+
"tabs": "awsui_tabs_14rmt_n8497_198",
|
|
21
|
+
"tabs-content": "awsui_tabs-content_14rmt_n8497_430",
|
|
22
|
+
"fit-height": "awsui_fit-height_14rmt_n8497_434",
|
|
23
|
+
"tabs-content-active": "awsui_tabs-content-active_14rmt_n8497_440",
|
|
24
|
+
"tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_n8497_454",
|
|
25
|
+
"with-paddings": "awsui_with-paddings_14rmt_n8497_454",
|
|
26
|
+
"tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_n8497_465"
|
|
26
27
|
};
|
|
27
28
|
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"metrics.d.ts","sourceRoot":"lib/default/","sources":["internal/analytics/metrics.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,OAAO,EAAE,MAAM,+CAA+C,CAAC;AAGxE,eAAO,MAAM,OAAO,SAA+C,CAAC"}
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
|
-
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
-
import { Metrics } from '@cloudscape-design/component-toolkit/internal';
|
|
4
|
-
import { PACKAGE_SOURCE, PACKAGE_VERSION } from '../environment';
|
|
5
|
-
export const metrics = new Metrics(PACKAGE_SOURCE, PACKAGE_VERSION);
|
|
6
|
-
//# sourceMappingURL=metrics.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"metrics.js","sourceRoot":"lib/default/","sources":["internal/analytics/metrics.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,OAAO,EAAE,MAAM,+CAA+C,CAAC;AACxE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEjE,MAAM,CAAC,MAAM,OAAO,GAAG,IAAI,OAAO,CAAC,cAAc,EAAE,eAAe,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { Metrics } from '@cloudscape-design/component-toolkit/internal';\nimport { PACKAGE_SOURCE, PACKAGE_VERSION } from '../environment';\n\nexport const metrics = new Metrics(PACKAGE_SOURCE, PACKAGE_VERSION);\n"]}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
interface UseLatencyMetricsProps {
|
|
3
|
-
componentName: string;
|
|
4
|
-
elementRef: React.RefObject<HTMLElement>;
|
|
5
|
-
instanceId: string | undefined;
|
|
6
|
-
loading?: boolean | undefined;
|
|
7
|
-
componentType?: 'spinner' | undefined;
|
|
8
|
-
}
|
|
9
|
-
export declare function useLatencyMetrics({ componentName, componentType, elementRef, instanceId, ...props }: UseLatencyMetricsProps): void;
|
|
10
|
-
export {};
|
|
11
|
-
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/hooks/use-latency-metrics/index.ts"],"names":[],"mappings":";AASA,UAAU,sBAAsB;IAC9B,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACzC,UAAU,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,aAAa,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CACvC;AAED,wBAAgB,iBAAiB,CAAC,EAChC,aAAa,EACb,aAAa,EACb,UAAU,EACV,UAAU,EACV,GAAG,KAAK,EACT,EAAE,sBAAsB,QA+FxB"}
|
|
@@ -1,88 +0,0 @@
|
|
|
1
|
-
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
|
-
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
-
import { __rest } from "tslib";
|
|
4
|
-
import { useEffect, useRef } from 'react';
|
|
5
|
-
import { useIdFallback } from '../use-unique-id';
|
|
6
|
-
import { useEffectOnUpdate } from '../use-effect-on-update';
|
|
7
|
-
import { isInViewport } from './is-in-viewport';
|
|
8
|
-
import { metrics } from '../../analytics/metrics';
|
|
9
|
-
export function useLatencyMetrics(_a) {
|
|
10
|
-
var { componentName, componentType, elementRef, instanceId } = _a, props = __rest(_a, ["componentName", "componentType", "elementRef", "instanceId"]);
|
|
11
|
-
const lifecycleId = useIdFallback();
|
|
12
|
-
const loading = props.loading || componentType === 'spinner';
|
|
13
|
-
const loadingAtMount = useRef(loading);
|
|
14
|
-
const loadingStartTime = useRef(undefined);
|
|
15
|
-
if (loading && loadingStartTime.current === undefined) {
|
|
16
|
-
loadingStartTime.current = performance.now();
|
|
17
|
-
}
|
|
18
|
-
useEffect(() => {
|
|
19
|
-
if (!elementRef.current) {
|
|
20
|
-
return;
|
|
21
|
-
}
|
|
22
|
-
const loading = loadingAtMount.current;
|
|
23
|
-
const timestamp = Date.now();
|
|
24
|
-
const cleanup = isInViewport(elementRef.current, inViewport => {
|
|
25
|
-
emitMetric({
|
|
26
|
-
type: 'mounted',
|
|
27
|
-
lifecycleId,
|
|
28
|
-
componentName,
|
|
29
|
-
inViewport,
|
|
30
|
-
metadata: { instanceId },
|
|
31
|
-
loading,
|
|
32
|
-
loadingDuration: undefined,
|
|
33
|
-
}, timestamp);
|
|
34
|
-
});
|
|
35
|
-
return () => {
|
|
36
|
-
cleanup();
|
|
37
|
-
if (loadingStartTime.current !== undefined) {
|
|
38
|
-
const loadingDuration = performance.now() - loadingStartTime.current;
|
|
39
|
-
emitMetric({
|
|
40
|
-
type: componentType === 'spinner' ? 'loading-finished' : 'loading-cancelled',
|
|
41
|
-
lifecycleId,
|
|
42
|
-
componentName,
|
|
43
|
-
inViewport: undefined,
|
|
44
|
-
metadata: { instanceId },
|
|
45
|
-
loading,
|
|
46
|
-
loadingDuration,
|
|
47
|
-
}, Date.now());
|
|
48
|
-
}
|
|
49
|
-
};
|
|
50
|
-
}, [componentName, componentType, elementRef, instanceId, lifecycleId]);
|
|
51
|
-
useEffectOnUpdate(() => {
|
|
52
|
-
if (componentType === 'spinner') {
|
|
53
|
-
// The spinner component is handled in the other effect above.
|
|
54
|
-
return;
|
|
55
|
-
}
|
|
56
|
-
if (loading) {
|
|
57
|
-
emitMetric({
|
|
58
|
-
type: 'loading-started',
|
|
59
|
-
lifecycleId,
|
|
60
|
-
componentName,
|
|
61
|
-
inViewport: undefined,
|
|
62
|
-
metadata: { instanceId },
|
|
63
|
-
loading,
|
|
64
|
-
loadingDuration: undefined,
|
|
65
|
-
}, Date.now());
|
|
66
|
-
}
|
|
67
|
-
else {
|
|
68
|
-
if (loadingStartTime.current === undefined) {
|
|
69
|
-
return;
|
|
70
|
-
}
|
|
71
|
-
const loadingDuration = performance.now() - loadingStartTime.current;
|
|
72
|
-
loadingStartTime.current = undefined;
|
|
73
|
-
emitMetric({
|
|
74
|
-
type: 'loading-finished',
|
|
75
|
-
lifecycleId,
|
|
76
|
-
componentName,
|
|
77
|
-
inViewport: undefined,
|
|
78
|
-
metadata: { instanceId },
|
|
79
|
-
loading,
|
|
80
|
-
loadingDuration,
|
|
81
|
-
}, Date.now());
|
|
82
|
-
}
|
|
83
|
-
}, [componentName, componentType, instanceId, lifecycleId, loading]);
|
|
84
|
-
}
|
|
85
|
-
function emitMetric(eventDetail, timestamp) {
|
|
86
|
-
metrics.sendPanoramaMetric({ eventType: 'awsui-latency', eventDetail: JSON.stringify(eventDetail), timestamp });
|
|
87
|
-
}
|
|
88
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/hooks/use-latency-metrics/index.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useEffect, useRef } from 'react';\nimport { useIdFallback } from '../use-unique-id';\nimport { useEffectOnUpdate } from '../use-effect-on-update';\nimport { isInViewport } from './is-in-viewport';\nimport { metrics } from '../../analytics/metrics';\n\ninterface UseLatencyMetricsProps {\n componentName: string;\n elementRef: React.RefObject<HTMLElement>;\n instanceId: string | undefined;\n loading?: boolean | undefined;\n componentType?: 'spinner' | undefined;\n}\n\nexport function useLatencyMetrics({\n componentName,\n componentType,\n elementRef,\n instanceId,\n ...props\n}: UseLatencyMetricsProps) {\n const lifecycleId = useIdFallback();\n\n const loading = props.loading || componentType === 'spinner';\n const loadingAtMount = useRef(loading);\n\n const loadingStartTime = useRef<undefined | number>(undefined);\n if (loading && loadingStartTime.current === undefined) {\n loadingStartTime.current = performance.now();\n }\n\n useEffect(() => {\n if (!elementRef.current) {\n return;\n }\n const loading = loadingAtMount.current;\n\n const timestamp = Date.now();\n\n const cleanup = isInViewport(elementRef.current!, inViewport => {\n emitMetric(\n {\n type: 'mounted',\n lifecycleId,\n componentName,\n inViewport,\n metadata: { instanceId },\n loading,\n loadingDuration: undefined,\n },\n timestamp\n );\n });\n\n return () => {\n cleanup();\n\n if (loadingStartTime.current !== undefined) {\n const loadingDuration = performance.now() - loadingStartTime.current;\n\n emitMetric(\n {\n type: componentType === 'spinner' ? 'loading-finished' : 'loading-cancelled',\n lifecycleId,\n componentName,\n inViewport: undefined,\n metadata: { instanceId },\n loading,\n loadingDuration,\n },\n Date.now()\n );\n }\n };\n }, [componentName, componentType, elementRef, instanceId, lifecycleId]);\n\n useEffectOnUpdate(() => {\n if (componentType === 'spinner') {\n // The spinner component is handled in the other effect above.\n return;\n }\n if (loading) {\n emitMetric(\n {\n type: 'loading-started',\n lifecycleId,\n componentName,\n inViewport: undefined,\n metadata: { instanceId },\n loading,\n loadingDuration: undefined,\n },\n Date.now()\n );\n } else {\n if (loadingStartTime.current === undefined) {\n return;\n }\n const loadingDuration = performance.now() - loadingStartTime.current;\n loadingStartTime.current = undefined;\n\n emitMetric(\n {\n type: 'loading-finished',\n lifecycleId,\n componentName,\n inViewport: undefined,\n metadata: { instanceId },\n loading,\n loadingDuration,\n },\n Date.now()\n );\n }\n }, [componentName, componentType, instanceId, lifecycleId, loading]);\n}\n\ninterface EventDetail {\n type: 'mounted' | 'loading-started' | 'loading-finished' | 'loading-cancelled';\n lifecycleId: string;\n componentName: string;\n inViewport: boolean | undefined;\n metadata: { instanceId: string | undefined };\n loading: boolean;\n loadingDuration: number | undefined;\n}\n\nfunction emitMetric(eventDetail: EventDetail, timestamp: number) {\n metrics.sendPanoramaMetric({ eventType: 'awsui-latency', eventDetail: JSON.stringify(eventDetail), timestamp });\n}\n"]}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
type Callback = (inViewport: boolean) => void;
|
|
2
|
-
/**
|
|
3
|
-
* This function determines whether an element is in the viewport. The callback
|
|
4
|
-
* is batched with other elements that also use this function, in order to improve
|
|
5
|
-
* performance.
|
|
6
|
-
*/
|
|
7
|
-
export declare function isInViewport(element: Element, callback: Callback): () => void;
|
|
8
|
-
export {};
|
|
9
|
-
//# sourceMappingURL=is-in-viewport.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"is-in-viewport.d.ts","sourceRoot":"lib/default/","sources":["internal/hooks/use-latency-metrics/is-in-viewport.ts"],"names":[],"mappings":"AAGA,KAAK,QAAQ,GAAG,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;AAM9C;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,cAgChE"}
|
|
@@ -1,74 +0,0 @@
|
|
|
1
|
-
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
|
-
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
-
let map = new WeakMap();
|
|
4
|
-
const MAX_DELAY_MS = 1000;
|
|
5
|
-
const MANUAL_TRIGGER_DELAY = 2000;
|
|
6
|
-
/**
|
|
7
|
-
* This function determines whether an element is in the viewport. The callback
|
|
8
|
-
* is batched with other elements that also use this function, in order to improve
|
|
9
|
-
* performance.
|
|
10
|
-
*/
|
|
11
|
-
export function isInViewport(element, callback) {
|
|
12
|
-
const mapSnapshot = map;
|
|
13
|
-
let called = false;
|
|
14
|
-
mapSnapshot.set(element, entry => {
|
|
15
|
-
if (!called) {
|
|
16
|
-
called = true;
|
|
17
|
-
callback(entry);
|
|
18
|
-
}
|
|
19
|
-
});
|
|
20
|
-
/*
|
|
21
|
-
If the IntersectionObserver does not fire in reasonable time (for example
|
|
22
|
-
in a background page in Chrome), we need to call the callback manually.
|
|
23
|
-
|
|
24
|
-
See https://issues.chromium.org/issues/41383759
|
|
25
|
-
*/
|
|
26
|
-
const timeoutHandle = setTimeout(() => {
|
|
27
|
-
if (!called) {
|
|
28
|
-
called = true;
|
|
29
|
-
callback(false);
|
|
30
|
-
}
|
|
31
|
-
}, MANUAL_TRIGGER_DELAY);
|
|
32
|
-
observer.observe(element);
|
|
33
|
-
// Cleanup
|
|
34
|
-
return () => {
|
|
35
|
-
clearTimeout(timeoutHandle);
|
|
36
|
-
mapSnapshot.delete(element);
|
|
37
|
-
observer.unobserve(element);
|
|
38
|
-
};
|
|
39
|
-
}
|
|
40
|
-
function createIntersectionObserver(callback) {
|
|
41
|
-
if (typeof IntersectionObserver === 'undefined') {
|
|
42
|
-
return {
|
|
43
|
-
observe: () => { },
|
|
44
|
-
unobserve: () => { },
|
|
45
|
-
};
|
|
46
|
-
}
|
|
47
|
-
return new IntersectionObserver(callback);
|
|
48
|
-
}
|
|
49
|
-
const observer = createIntersectionObserver(function isInViewportObserver(entries) {
|
|
50
|
-
// This avoids interference when the IntersectionObserver is called again during the delay.
|
|
51
|
-
const mapSnapshot = map;
|
|
52
|
-
map = new Map();
|
|
53
|
-
// We only want the first run of the observer.
|
|
54
|
-
for (const entry of entries) {
|
|
55
|
-
observer.unobserve(entry.target);
|
|
56
|
-
}
|
|
57
|
-
// We yield the event loop, since these events are low priority and not time critical.
|
|
58
|
-
defer(() => {
|
|
59
|
-
var _a;
|
|
60
|
-
for (const entry of entries) {
|
|
61
|
-
(_a = mapSnapshot.get(entry.target)) === null || _a === void 0 ? void 0 : _a(entry.isIntersecting);
|
|
62
|
-
}
|
|
63
|
-
}, MAX_DELAY_MS);
|
|
64
|
-
});
|
|
65
|
-
function defer(callback, maxDelayMs) {
|
|
66
|
-
if (typeof requestIdleCallback === 'function') {
|
|
67
|
-
requestIdleCallback(callback, { timeout: maxDelayMs });
|
|
68
|
-
}
|
|
69
|
-
else {
|
|
70
|
-
// requestIdleCallback is not supported in Safari
|
|
71
|
-
setTimeout(callback, maxDelayMs);
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
//# sourceMappingURL=is-in-viewport.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"is-in-viewport.js","sourceRoot":"lib/default/","sources":["internal/hooks/use-latency-metrics/is-in-viewport.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAGtC,IAAI,GAAG,GAAG,IAAI,OAAO,EAAqB,CAAC;AAE3C,MAAM,YAAY,GAAG,IAAI,CAAC;AAC1B,MAAM,oBAAoB,GAAG,IAAI,CAAC;AAElC;;;;GAIG;AACH,MAAM,UAAU,YAAY,CAAC,OAAgB,EAAE,QAAkB;IAC/D,MAAM,WAAW,GAAG,GAAG,CAAC;IACxB,IAAI,MAAM,GAAG,KAAK,CAAC;IAEnB,WAAW,CAAC,GAAG,CAAC,OAAO,EAAE,KAAK,CAAC,EAAE;QAC/B,IAAI,CAAC,MAAM,EAAE;YACX,MAAM,GAAG,IAAI,CAAC;YACd,QAAQ,CAAC,KAAK,CAAC,CAAC;SACjB;IACH,CAAC,CAAC,CAAC;IAEH;;;;;OAKG;IACH,MAAM,aAAa,GAAG,UAAU,CAAC,GAAG,EAAE;QACpC,IAAI,CAAC,MAAM,EAAE;YACX,MAAM,GAAG,IAAI,CAAC;YACd,QAAQ,CAAC,KAAK,CAAC,CAAC;SACjB;IACH,CAAC,EAAE,oBAAoB,CAAC,CAAC;IAEzB,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;IAE1B,UAAU;IACV,OAAO,GAAG,EAAE;QACV,YAAY,CAAC,aAAa,CAAC,CAAC;QAC5B,WAAW,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;QAC5B,QAAQ,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;IAC9B,CAAC,CAAC;AACJ,CAAC;AAED,SAAS,0BAA0B,CAAC,QAAsC;IACxE,IAAI,OAAO,oBAAoB,KAAK,WAAW,EAAE;QAC/C,OAAO;YACL,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;YACjB,SAAS,EAAE,GAAG,EAAE,GAAE,CAAC;SACpB,CAAC;KACH;IACD,OAAO,IAAI,oBAAoB,CAAC,QAAQ,CAAC,CAAC;AAC5C,CAAC;AAED,MAAM,QAAQ,GAAG,0BAA0B,CAAC,SAAS,oBAAoB,CAAC,OAAO;IAC/E,2FAA2F;IAC3F,MAAM,WAAW,GAAG,GAAG,CAAC;IACxB,GAAG,GAAG,IAAI,GAAG,EAAE,CAAC;IAEhB,8CAA8C;IAC9C,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE;QAC3B,QAAQ,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;KAClC;IAED,sFAAsF;IACtF,KAAK,CAAC,GAAG,EAAE;;QACT,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE;YAC3B,MAAA,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC,MAAM,CAAC,0CAAG,KAAK,CAAC,cAAc,CAAC,CAAC;SACvD;IACH,CAAC,EAAE,YAAY,CAAC,CAAC;AACnB,CAAC,CAAC,CAAC;AAEH,SAAS,KAAK,CAAC,QAAoB,EAAE,UAAkB;IACrD,IAAI,OAAO,mBAAmB,KAAK,UAAU,EAAE;QAC7C,mBAAmB,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,UAAU,EAAE,CAAC,CAAC;KACxD;SAAM;QACL,iDAAiD;QACjD,UAAU,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC;KAClC;AACH,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\ntype Callback = (inViewport: boolean) => void;\nlet map = new WeakMap<Element, Callback>();\n\nconst MAX_DELAY_MS = 1000;\nconst MANUAL_TRIGGER_DELAY = 2000;\n\n/**\n * This function determines whether an element is in the viewport. The callback\n * is batched with other elements that also use this function, in order to improve\n * performance.\n */\nexport function isInViewport(element: Element, callback: Callback) {\n const mapSnapshot = map;\n let called = false;\n\n mapSnapshot.set(element, entry => {\n if (!called) {\n called = true;\n callback(entry);\n }\n });\n\n /*\n If the IntersectionObserver does not fire in reasonable time (for example\n in a background page in Chrome), we need to call the callback manually.\n\n See https://issues.chromium.org/issues/41383759\n */\n const timeoutHandle = setTimeout(() => {\n if (!called) {\n called = true;\n callback(false);\n }\n }, MANUAL_TRIGGER_DELAY);\n\n observer.observe(element);\n\n // Cleanup\n return () => {\n clearTimeout(timeoutHandle);\n mapSnapshot.delete(element);\n observer.unobserve(element);\n };\n}\n\nfunction createIntersectionObserver(callback: IntersectionObserverCallback) {\n if (typeof IntersectionObserver === 'undefined') {\n return {\n observe: () => {},\n unobserve: () => {},\n };\n }\n return new IntersectionObserver(callback);\n}\n\nconst observer = createIntersectionObserver(function isInViewportObserver(entries) {\n // This avoids interference when the IntersectionObserver is called again during the delay.\n const mapSnapshot = map;\n map = new Map();\n\n // We only want the first run of the observer.\n for (const entry of entries) {\n observer.unobserve(entry.target);\n }\n\n // We yield the event loop, since these events are low priority and not time critical.\n defer(() => {\n for (const entry of entries) {\n mapSnapshot.get(entry.target)?.(entry.isIntersecting);\n }\n }, MAX_DELAY_MS);\n});\n\nfunction defer(callback: () => void, maxDelayMs: number) {\n if (typeof requestIdleCallback === 'function') {\n requestIdleCallback(callback, { timeout: maxDelayMs });\n } else {\n // requestIdleCallback is not supported in Safari\n setTimeout(callback, maxDelayMs);\n }\n}\n"]}
|