@cloudscape-design/components 3.0.602 → 3.0.604

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.
Files changed (89) hide show
  1. package/app-layout/classic.d.ts +5 -0
  2. package/app-layout/classic.d.ts.map +1 -1
  3. package/app-layout/classic.js +10 -18
  4. package/app-layout/classic.js.map +1 -1
  5. package/app-layout/defaults.d.ts +0 -1
  6. package/app-layout/defaults.d.ts.map +1 -1
  7. package/app-layout/defaults.js +1 -2
  8. package/app-layout/defaults.js.map +1 -1
  9. package/app-layout/implementation.d.ts +5 -0
  10. package/app-layout/implementation.d.ts.map +1 -1
  11. package/app-layout/index.d.ts.map +1 -1
  12. package/app-layout/index.js +31 -6
  13. package/app-layout/index.js.map +1 -1
  14. package/app-layout/interfaces.d.ts +1 -1
  15. package/app-layout/interfaces.d.ts.map +1 -1
  16. package/app-layout/interfaces.js.map +1 -1
  17. package/app-layout/internal.d.ts +5 -0
  18. package/app-layout/internal.d.ts.map +1 -1
  19. package/app-layout/utils/use-resize.d.ts +2 -1
  20. package/app-layout/utils/use-resize.d.ts.map +1 -1
  21. package/app-layout/utils/use-resize.js +7 -9
  22. package/app-layout/utils/use-resize.js.map +1 -1
  23. package/app-layout/visual-refresh/context.d.ts +1 -4
  24. package/app-layout/visual-refresh/context.d.ts.map +1 -1
  25. package/app-layout/visual-refresh/context.js +28 -64
  26. package/app-layout/visual-refresh/context.js.map +1 -1
  27. package/app-layout/visual-refresh/drawers.js +4 -4
  28. package/app-layout/visual-refresh/drawers.js.map +1 -1
  29. package/app-layout/visual-refresh/index.d.ts +5 -0
  30. package/app-layout/visual-refresh/index.d.ts.map +1 -1
  31. package/app-layout/visual-refresh/layout.js +2 -2
  32. package/app-layout/visual-refresh/layout.js.map +1 -1
  33. package/app-layout/visual-refresh/main.js +2 -2
  34. package/app-layout/visual-refresh/main.js.map +1 -1
  35. package/app-layout/visual-refresh/mobile-toolbar.js +3 -3
  36. package/app-layout/visual-refresh/mobile-toolbar.js.map +1 -1
  37. package/app-layout/visual-refresh/navigation.d.ts.map +1 -1
  38. package/app-layout/visual-refresh/navigation.js +10 -12
  39. package/app-layout/visual-refresh/navigation.js.map +1 -1
  40. package/app-layout/visual-refresh/split-panel.d.ts.map +1 -1
  41. package/app-layout/visual-refresh/split-panel.js +5 -5
  42. package/app-layout/visual-refresh/split-panel.js.map +1 -1
  43. package/app-layout/visual-refresh/styles.css.js +81 -81
  44. package/app-layout/visual-refresh/styles.scoped.css +169 -181
  45. package/app-layout/visual-refresh/styles.selectors.js +81 -81
  46. package/app-layout/visual-refresh/tools.d.ts.map +1 -1
  47. package/app-layout/visual-refresh/tools.js +2 -3
  48. package/app-layout/visual-refresh/tools.js.map +1 -1
  49. package/container/index.d.ts.map +1 -1
  50. package/container/index.js +4 -2
  51. package/container/index.js.map +1 -1
  52. package/form/index.d.ts.map +1 -1
  53. package/form/index.js +5 -5
  54. package/form/index.js.map +1 -1
  55. package/form-field/index.d.ts.map +1 -1
  56. package/form-field/index.js +2 -1
  57. package/form-field/index.js.map +1 -1
  58. package/internal/analytics/components/analytics-funnel.d.ts +9 -2
  59. package/internal/analytics/components/analytics-funnel.d.ts.map +1 -1
  60. package/internal/analytics/components/analytics-funnel.js +10 -2
  61. package/internal/analytics/components/analytics-funnel.js.map +1 -1
  62. package/internal/analytics/context/analytics-context.d.ts +3 -1
  63. package/internal/analytics/context/analytics-context.d.ts.map +1 -1
  64. package/internal/analytics/context/analytics-context.js.map +1 -1
  65. package/internal/analytics/hooks/use-funnel.d.ts +1 -0
  66. package/internal/analytics/hooks/use-funnel.d.ts.map +1 -1
  67. package/internal/analytics/hooks/use-funnel.js +3 -1
  68. package/internal/analytics/hooks/use-funnel.js.map +1 -1
  69. package/internal/analytics/interfaces.d.ts +12 -0
  70. package/internal/analytics/interfaces.d.ts.map +1 -1
  71. package/internal/analytics/interfaces.js.map +1 -1
  72. package/internal/base-component/index.d.ts +5 -0
  73. package/internal/base-component/index.d.ts.map +1 -1
  74. package/internal/base-component/index.js +3 -0
  75. package/internal/base-component/index.js.map +1 -1
  76. package/internal/environment.js +1 -1
  77. package/internal/environment.json +1 -1
  78. package/internal/hooks/use-base-component/index.d.ts +2 -1
  79. package/internal/hooks/use-base-component/index.d.ts.map +1 -1
  80. package/internal/hooks/use-base-component/index.js +2 -2
  81. package/internal/hooks/use-base-component/index.js.map +1 -1
  82. package/internal/manifest.json +1 -1
  83. package/package.json +1 -1
  84. package/wizard/index.d.ts.map +1 -1
  85. package/wizard/index.js +4 -4
  86. package/wizard/index.js.map +1 -1
  87. package/wizard/wizard-form.d.ts.map +1 -1
  88. package/wizard/wizard-form.js +10 -4
  89. package/wizard/wizard-form.js.map +1 -1
@@ -2,86 +2,86 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "background": "awsui_background_hyvsj_zz5e8_99",
6
- "scrolling-background": "awsui_scrolling-background_hyvsj_zz5e8_102",
7
- "sticky-background": "awsui_sticky-background_hyvsj_zz5e8_108",
8
- "has-sticky-notifications": "awsui_has-sticky-notifications_hyvsj_zz5e8_116",
9
- "breadcrumbs": "awsui_breadcrumbs_hyvsj_zz5e8_129",
10
- "has-sticky-background": "awsui_has-sticky-background_hyvsj_zz5e8_139",
11
- "drawers-container": "awsui_drawers-container_hyvsj_zz5e8_151",
12
- "has-open-drawer": "awsui_has-open-drawer_hyvsj_zz5e8_162",
13
- "disable-body-scroll": "awsui_disable-body-scroll_hyvsj_zz5e8_185",
14
- "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_hyvsj_zz5e8_190",
15
- "has-multiple-triggers": "awsui_has-multiple-triggers_hyvsj_zz5e8_231",
16
- "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_hyvsj_zz5e8_241",
17
- "drawers-trigger-content": "awsui_drawers-trigger-content_hyvsj_zz5e8_245",
18
- "drawers-trigger-overflow": "awsui_drawers-trigger-overflow_hyvsj_zz5e8_259",
19
- "drawers-trigger": "awsui_drawers-trigger_hyvsj_zz5e8_245",
20
- "drawer": "awsui_drawer_hyvsj_zz5e8_151",
21
- "drawer-content-container": "awsui_drawer-content-container_hyvsj_zz5e8_290",
22
- "drawer-close-button": "awsui_drawer-close-button_hyvsj_zz5e8_299",
23
- "drawer-content": "awsui_drawer-content_hyvsj_zz5e8_290",
24
- "drawer-content-hidden": "awsui_drawer-content-hidden_hyvsj_zz5e8_307",
25
- "drawer-slider": "awsui_drawer-slider_hyvsj_zz5e8_310",
26
- "is-drawer-open": "awsui_is-drawer-open_hyvsj_zz5e8_317",
27
- "content": "awsui_content_hyvsj_zz5e8_343",
28
- "layout": "awsui_layout_hyvsj_zz5e8_364",
29
- "has-max-content-width": "awsui_has-max-content-width_hyvsj_zz5e8_447",
30
- "content-type-dashboard": "awsui_content-type-dashboard_hyvsj_zz5e8_462",
31
- "content-type-table": "awsui_content-type-table_hyvsj_zz5e8_476",
32
- "content-type-cards": "awsui_content-type-cards_hyvsj_zz5e8_476",
33
- "is-overlap-disabled": "awsui_is-overlap-disabled_hyvsj_zz5e8_482",
34
- "is-hide-mobile-toolbar": "awsui_is-hide-mobile-toolbar_hyvsj_zz5e8_485",
35
- "has-content-gap-left": "awsui_has-content-gap-left_hyvsj_zz5e8_517",
36
- "has-content-gap-right": "awsui_has-content-gap-right_hyvsj_zz5e8_520",
37
- "content-first-child-notifications": "awsui_content-first-child-notifications_hyvsj_zz5e8_530",
38
- "has-breadcrumbs": "awsui_has-breadcrumbs_hyvsj_zz5e8_533",
39
- "content-first-child-header": "awsui_content-first-child-header_hyvsj_zz5e8_536",
40
- "has-header": "awsui_has-header_hyvsj_zz5e8_536",
41
- "content-first-child-main": "awsui_content-first-child-main_hyvsj_zz5e8_557",
42
- "disable-content-paddings": "awsui_disable-content-paddings_hyvsj_zz5e8_557",
43
- "has-split-panel": "awsui_has-split-panel_hyvsj_zz5e8_600",
44
- "split-panel-position-bottom": "awsui_split-panel-position-bottom_hyvsj_zz5e8_600",
45
- "block-body-scroll": "awsui_block-body-scroll_hyvsj_zz5e8_616",
46
- "unfocusable": "awsui_unfocusable_hyvsj_zz5e8_621",
47
- "container": "awsui_container_hyvsj_zz5e8_631",
48
- "is-navigation-open": "awsui_is-navigation-open_hyvsj_zz5e8_657",
49
- "is-tools-open": "awsui_is-tools-open_hyvsj_zz5e8_660",
50
- "is-split-panel-open": "awsui_is-split-panel-open_hyvsj_zz5e8_660",
51
- "split-panel-position-side": "awsui_split-panel-position-side_hyvsj_zz5e8_660",
52
- "has-active-drawer": "awsui_has-active-drawer_hyvsj_zz5e8_660",
53
- "mobile-toolbar": "awsui_mobile-toolbar_hyvsj_zz5e8_669",
54
- "remove-high-contrast-header": "awsui_remove-high-contrast-header_hyvsj_zz5e8_686",
55
- "mobile-toolbar-nav": "awsui_mobile-toolbar-nav_hyvsj_zz5e8_690",
56
- "mobile-toolbar-breadcrumbs": "awsui_mobile-toolbar-breadcrumbs_hyvsj_zz5e8_694",
57
- "mobile-toolbar-tools": "awsui_mobile-toolbar-tools_hyvsj_zz5e8_698",
58
- "navigation-container": "awsui_navigation-container_hyvsj_zz5e8_707",
59
- "show-navigation": "awsui_show-navigation_hyvsj_zz5e8_751",
60
- "animating": "awsui_animating_hyvsj_zz5e8_774",
61
- "showButtons": "awsui_showButtons_hyvsj_zz5e8_1",
62
- "navigation": "awsui_navigation_hyvsj_zz5e8_707",
63
- "openNavigation": "awsui_openNavigation_hyvsj_zz5e8_1",
64
- "animated-content": "awsui_animated-content_hyvsj_zz5e8_836",
65
- "hide-navigation": "awsui_hide-navigation_hyvsj_zz5e8_845",
66
- "notifications": "awsui_notifications_hyvsj_zz5e8_855",
67
- "sticky-notifications": "awsui_sticky-notifications_hyvsj_zz5e8_861",
68
- "split-panel-bottom": "awsui_split-panel-bottom_hyvsj_zz5e8_878",
69
- "position-bottom": "awsui_position-bottom_hyvsj_zz5e8_925",
70
- "openSplitPanelBottom": "awsui_openSplitPanelBottom_hyvsj_zz5e8_1",
71
- "split-panel-side": "awsui_split-panel-side_hyvsj_zz5e8_954",
72
- "position-side": "awsui_position-side_hyvsj_zz5e8_967",
73
- "tools-container": "awsui_tools-container_hyvsj_zz5e8_989",
74
- "tools": "awsui_tools_hyvsj_zz5e8_989",
75
- "openTools": "awsui_openTools_hyvsj_zz5e8_1",
76
- "has-tools-form-persistence": "awsui_has-tools-form-persistence_hyvsj_zz5e8_1086",
77
- "hide-tools": "awsui_hide-tools_hyvsj_zz5e8_1096",
78
- "show-tools": "awsui_show-tools_hyvsj_zz5e8_1108",
79
- "has-tools-form": "awsui_has-tools-form_hyvsj_zz5e8_1086",
80
- "trigger-badge-wrapper": "awsui_trigger-badge-wrapper_hyvsj_zz5e8_1191",
81
- "trigger": "awsui_trigger_hyvsj_zz5e8_1191",
82
- "selected": "awsui_selected_hyvsj_zz5e8_1265",
83
- "badge": "awsui_badge_hyvsj_zz5e8_1285",
84
- "trigger-wrapper": "awsui_trigger-wrapper_hyvsj_zz5e8_1289",
85
- "dot": "awsui_dot_hyvsj_zz5e8_1300"
5
+ "background": "awsui_background_hyvsj_1cour_99",
6
+ "scrolling-background": "awsui_scrolling-background_hyvsj_1cour_102",
7
+ "sticky-background": "awsui_sticky-background_hyvsj_1cour_108",
8
+ "has-sticky-notifications": "awsui_has-sticky-notifications_hyvsj_1cour_116",
9
+ "breadcrumbs": "awsui_breadcrumbs_hyvsj_1cour_129",
10
+ "has-sticky-background": "awsui_has-sticky-background_hyvsj_1cour_139",
11
+ "drawers-container": "awsui_drawers-container_hyvsj_1cour_151",
12
+ "has-open-drawer": "awsui_has-open-drawer_hyvsj_1cour_162",
13
+ "disable-body-scroll": "awsui_disable-body-scroll_hyvsj_1cour_185",
14
+ "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_hyvsj_1cour_190",
15
+ "has-multiple-triggers": "awsui_has-multiple-triggers_hyvsj_1cour_231",
16
+ "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_hyvsj_1cour_241",
17
+ "drawers-trigger-content": "awsui_drawers-trigger-content_hyvsj_1cour_245",
18
+ "drawers-trigger-overflow": "awsui_drawers-trigger-overflow_hyvsj_1cour_259",
19
+ "drawers-trigger": "awsui_drawers-trigger_hyvsj_1cour_245",
20
+ "drawer": "awsui_drawer_hyvsj_1cour_151",
21
+ "drawer-content-container": "awsui_drawer-content-container_hyvsj_1cour_290",
22
+ "drawer-close-button": "awsui_drawer-close-button_hyvsj_1cour_299",
23
+ "drawer-content": "awsui_drawer-content_hyvsj_1cour_290",
24
+ "drawer-content-hidden": "awsui_drawer-content-hidden_hyvsj_1cour_307",
25
+ "drawer-slider": "awsui_drawer-slider_hyvsj_1cour_310",
26
+ "is-drawer-open": "awsui_is-drawer-open_hyvsj_1cour_317",
27
+ "content": "awsui_content_hyvsj_1cour_343",
28
+ "layout": "awsui_layout_hyvsj_1cour_364",
29
+ "has-max-content-width": "awsui_has-max-content-width_hyvsj_1cour_447",
30
+ "content-type-dashboard": "awsui_content-type-dashboard_hyvsj_1cour_462",
31
+ "content-type-table": "awsui_content-type-table_hyvsj_1cour_476",
32
+ "content-type-cards": "awsui_content-type-cards_hyvsj_1cour_476",
33
+ "is-overlap-disabled": "awsui_is-overlap-disabled_hyvsj_1cour_482",
34
+ "is-hide-mobile-toolbar": "awsui_is-hide-mobile-toolbar_hyvsj_1cour_485",
35
+ "has-content-gap-left": "awsui_has-content-gap-left_hyvsj_1cour_517",
36
+ "has-content-gap-right": "awsui_has-content-gap-right_hyvsj_1cour_520",
37
+ "content-first-child-notifications": "awsui_content-first-child-notifications_hyvsj_1cour_530",
38
+ "has-breadcrumbs": "awsui_has-breadcrumbs_hyvsj_1cour_533",
39
+ "content-first-child-header": "awsui_content-first-child-header_hyvsj_1cour_536",
40
+ "has-header": "awsui_has-header_hyvsj_1cour_536",
41
+ "content-first-child-main": "awsui_content-first-child-main_hyvsj_1cour_557",
42
+ "disable-content-paddings": "awsui_disable-content-paddings_hyvsj_1cour_557",
43
+ "has-split-panel": "awsui_has-split-panel_hyvsj_1cour_600",
44
+ "split-panel-position-bottom": "awsui_split-panel-position-bottom_hyvsj_1cour_600",
45
+ "block-body-scroll": "awsui_block-body-scroll_hyvsj_1cour_616",
46
+ "unfocusable": "awsui_unfocusable_hyvsj_1cour_621",
47
+ "container": "awsui_container_hyvsj_1cour_631",
48
+ "is-navigation-open": "awsui_is-navigation-open_hyvsj_1cour_657",
49
+ "is-tools-open": "awsui_is-tools-open_hyvsj_1cour_660",
50
+ "is-split-panel-open": "awsui_is-split-panel-open_hyvsj_1cour_660",
51
+ "split-panel-position-side": "awsui_split-panel-position-side_hyvsj_1cour_660",
52
+ "has-active-drawer": "awsui_has-active-drawer_hyvsj_1cour_660",
53
+ "mobile-toolbar": "awsui_mobile-toolbar_hyvsj_1cour_669",
54
+ "remove-high-contrast-header": "awsui_remove-high-contrast-header_hyvsj_1cour_686",
55
+ "mobile-toolbar-nav": "awsui_mobile-toolbar-nav_hyvsj_1cour_690",
56
+ "mobile-toolbar-breadcrumbs": "awsui_mobile-toolbar-breadcrumbs_hyvsj_1cour_694",
57
+ "mobile-toolbar-tools": "awsui_mobile-toolbar-tools_hyvsj_1cour_698",
58
+ "navigation-container": "awsui_navigation-container_hyvsj_1cour_707",
59
+ "show-navigation": "awsui_show-navigation_hyvsj_1cour_745",
60
+ "animating": "awsui_animating_hyvsj_1cour_768",
61
+ "showButtons": "awsui_showButtons_hyvsj_1cour_1",
62
+ "navigation": "awsui_navigation_hyvsj_1cour_707",
63
+ "openNavigation": "awsui_openNavigation_hyvsj_1cour_1",
64
+ "animated-content": "awsui_animated-content_hyvsj_1cour_830",
65
+ "hide-navigation": "awsui_hide-navigation_hyvsj_1cour_839",
66
+ "notifications": "awsui_notifications_hyvsj_1cour_849",
67
+ "sticky-notifications": "awsui_sticky-notifications_hyvsj_1cour_855",
68
+ "split-panel-bottom": "awsui_split-panel-bottom_hyvsj_1cour_872",
69
+ "position-bottom": "awsui_position-bottom_hyvsj_1cour_919",
70
+ "openSplitPanelBottom": "awsui_openSplitPanelBottom_hyvsj_1cour_1",
71
+ "split-panel-side": "awsui_split-panel-side_hyvsj_1cour_948",
72
+ "position-side": "awsui_position-side_hyvsj_1cour_961",
73
+ "tools-container": "awsui_tools-container_hyvsj_1cour_983",
74
+ "tools": "awsui_tools_hyvsj_1cour_983",
75
+ "openTools": "awsui_openTools_hyvsj_1cour_1",
76
+ "has-tools-form-persistence": "awsui_has-tools-form-persistence_hyvsj_1cour_1074",
77
+ "hide-tools": "awsui_hide-tools_hyvsj_1cour_1084",
78
+ "show-tools": "awsui_show-tools_hyvsj_1cour_1096",
79
+ "has-tools-form": "awsui_has-tools-form_hyvsj_1cour_1074",
80
+ "trigger-badge-wrapper": "awsui_trigger-badge-wrapper_hyvsj_1cour_1179",
81
+ "trigger": "awsui_trigger_hyvsj_1cour_1179",
82
+ "selected": "awsui_selected_hyvsj_1cour_1253",
83
+ "badge": "awsui_badge_hyvsj_1cour_1273",
84
+ "trigger-wrapper": "awsui_trigger-wrapper_hyvsj_1cour_1277",
85
+ "dot": "awsui_dot_hyvsj_1cour_1288"
86
86
  };
87
87
 
@@ -1 +1 @@
1
- {"version":3,"file":"tools.d.ts","sourceRoot":"","sources":["../../../../src/app-layout/visual-refresh/tools.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,UAAU,UAAU;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAAE,QAAQ,EAAE,EAAE,UAAU,sBA0IrD"}
1
+ {"version":3,"file":"tools.d.ts","sourceRoot":"","sources":["../../../../src/app-layout/visual-refresh/tools.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,UAAU,UAAU;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAAE,QAAQ,EAAE,EAAE,UAAU,sBAwIrD"}
@@ -19,7 +19,7 @@ import customCssProps from '../../internal/generated/custom-css-properties';
19
19
  * split panel in large viewports;
20
20
  */
21
21
  export default function Tools({ children }) {
22
- const { ariaLabels, disableBodyScroll, drawers, handleSplitPanelClick, handleToolsClick, hasDefaultToolsWidth, hasDrawerViewportOverlay, isMobile, isSplitPanelOpen, isToolsOpen, loseToolsFocus, splitPanel, splitPanelControlId, splitPanelDisplayed, splitPanelPosition, splitPanelRefs, splitPanelToggle, tools, toolsControlId, toolsHide, toolsRefs, toolsWidth, } = useAppLayoutInternals();
22
+ const { ariaLabels, disableBodyScroll, drawers, handleSplitPanelClick, handleToolsClick, hasDrawerViewportOverlay, isMobile, isSplitPanelOpen, isToolsOpen, loseToolsFocus, splitPanel, splitPanelControlId, splitPanelDisplayed, splitPanelPosition, splitPanelRefs, splitPanelToggle, tools, toolsControlId, toolsHide, toolsRefs, toolsWidth, } = useAppLayoutInternals();
23
23
  const hasSplitPanel = !!splitPanel && getSplitPanelStatus(splitPanelDisplayed, splitPanelPosition);
24
24
  const hasToolsForm = getToolsFormStatus(hasSplitPanel, isMobile, isSplitPanelOpen, isToolsOpen, toolsHide);
25
25
  const hasToolsFormPersistence = getToolsFormPersistence(hasSplitPanel, isSplitPanelOpen, isToolsOpen, toolsHide);
@@ -39,8 +39,7 @@ export default function Tools({ children }) {
39
39
  [testutilStyles['drawer-closed']]: !isToolsOpen,
40
40
  }), style: {
41
41
  [customCssProps.toolsAnimationStartingOpacity]: `${hasSplitPanel && isSplitPanelOpen ? 1 : 0}`,
42
- // Overwrite the default tools width (depends on breakpoints) only when the `toolsWidth` property has been set.
43
- [customCssProps.toolsWidth]: hasDefaultToolsWidth ? '' : `${toolsWidth}px`,
42
+ [customCssProps.toolsWidth]: `${toolsWidth}px`,
44
43
  }, onBlur: e => {
45
44
  if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {
46
45
  loseToolsFocus();
@@ -1 +1 @@
1
- {"version":3,"file":"tools.js","sourceRoot":"","sources":["../../../../src/app-layout/visual-refresh/tools.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 from 'react';\nimport clsx from 'clsx';\nimport { InternalButton } from '../../button/internal';\nimport { useAppLayoutInternals } from './context';\nimport TriggerButton from './trigger-button';\nimport styles from './styles.css.js';\nimport splitPanelStyles from '../../split-panel/styles.css.js';\nimport testutilStyles from '../test-classes/styles.css.js';\nimport { Transition } from '../../internal/components/transition';\nimport customCssProps from '../../internal/generated/custom-css-properties';\n\ninterface ToolsProps {\n children: React.ReactNode;\n}\n\n/**\n * The Tools component consists of the following elements:\n * the container, or root element, that sits as a direct child to the Layout grid definition;\n * the split panel, which exists only if there is a split panel in side position;\n * the tools, or drawer, that contains the hide tools form and the children passed through the API;\n * the show tools form that contains the triggers for both the drawer and the\n * split panel in large viewports;\n */\nexport default function Tools({ children }: ToolsProps) {\n const {\n ariaLabels,\n disableBodyScroll,\n drawers,\n handleSplitPanelClick,\n handleToolsClick,\n hasDefaultToolsWidth,\n hasDrawerViewportOverlay,\n isMobile,\n isSplitPanelOpen,\n isToolsOpen,\n loseToolsFocus,\n splitPanel,\n splitPanelControlId,\n splitPanelDisplayed,\n splitPanelPosition,\n splitPanelRefs,\n splitPanelToggle,\n tools,\n toolsControlId,\n toolsHide,\n toolsRefs,\n toolsWidth,\n } = useAppLayoutInternals();\n\n const hasSplitPanel = !!splitPanel && getSplitPanelStatus(splitPanelDisplayed, splitPanelPosition);\n const hasToolsForm = getToolsFormStatus(hasSplitPanel, isMobile, isSplitPanelOpen, isToolsOpen, toolsHide);\n const hasToolsFormPersistence = getToolsFormPersistence(hasSplitPanel, isSplitPanelOpen, isToolsOpen, toolsHide);\n const isUnfocusable = hasDrawerViewportOverlay && !isToolsOpen;\n\n /**\n * If the drawers property is defined the SplitPanel will be mounted and rendered\n * by the Drawers component.\n */\n if ((toolsHide && !hasSplitPanel) || drawers) {\n return null;\n }\n\n return (\n <Transition in={isToolsOpen ?? false}>\n {(state, transitionEventsRef) => (\n <div\n className={clsx(styles['tools-container'], {\n [styles['disable-body-scroll']]: disableBodyScroll,\n [styles.unfocusable]: isUnfocusable,\n [testutilStyles['drawer-closed']]: !isToolsOpen,\n })}\n style={{\n [customCssProps.toolsAnimationStartingOpacity]: `${hasSplitPanel && isSplitPanelOpen ? 1 : 0}`,\n // Overwrite the default tools width (depends on breakpoints) only when the `toolsWidth` property has been set.\n [customCssProps.toolsWidth]: hasDefaultToolsWidth ? '' : `${toolsWidth}px`,\n }}\n onBlur={e => {\n if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {\n loseToolsFocus();\n }\n }}\n >\n {children}\n\n {!toolsHide && (\n <aside\n id={toolsControlId}\n aria-hidden={!isToolsOpen ? true : false}\n aria-label={ariaLabels?.tools ?? undefined}\n className={clsx(\n styles.tools,\n {\n [styles.animating]: state === 'entering',\n [styles['has-tools-form-persistence']]: hasToolsFormPersistence,\n [styles['is-tools-open']]: isToolsOpen,\n },\n testutilStyles.tools\n )}\n ref={state !== 'exiting' ? transitionEventsRef : undefined}\n >\n <div className={clsx(styles['animated-content'])}>\n <div className={clsx(styles['hide-tools'])}>\n <InternalButton\n ariaLabel={ariaLabels?.toolsClose ?? undefined}\n iconName={isMobile ? 'close' : 'angle-right'}\n onClick={() => handleToolsClick(false)}\n variant=\"icon\"\n formAction=\"none\"\n className={testutilStyles['tools-close']}\n ref={toolsRefs.close}\n />\n </div>\n\n {tools}\n </div>\n </aside>\n )}\n\n {!isMobile && (\n <aside\n aria-hidden={!hasToolsForm ? true : false}\n aria-label={ariaLabels?.tools ?? undefined}\n className={clsx(styles['show-tools'], {\n [styles.animating]: state === 'exiting',\n [styles['has-tools-form']]: hasToolsForm,\n [styles['has-tools-form-persistence']]: hasToolsFormPersistence,\n })}\n ref={state === 'exiting' ? transitionEventsRef : undefined}\n data-testid=\"side-split-panel-drawer\"\n >\n {!toolsHide && (\n <TriggerButton\n ariaLabel={ariaLabels?.toolsToggle}\n ariaControls={toolsControlId}\n ariaExpanded={isToolsOpen}\n iconName=\"status-info\"\n onClick={() => handleToolsClick(!isToolsOpen)}\n selected={hasSplitPanel && isToolsOpen}\n className={testutilStyles['tools-toggle']}\n ref={toolsRefs.toggle}\n />\n )}\n\n {hasSplitPanel && splitPanelToggle.displayed && (\n <TriggerButton\n ariaLabel={splitPanelToggle.ariaLabel}\n ariaControls={splitPanelControlId}\n ariaExpanded={!!isSplitPanelOpen}\n iconName=\"view-vertical\"\n onClick={() => handleSplitPanelClick()}\n selected={hasSplitPanel && isSplitPanelOpen}\n className={splitPanelStyles['open-button']}\n ref={splitPanelRefs.toggle}\n />\n )}\n </aside>\n )}\n </div>\n )}\n </Transition>\n );\n}\n\n/**\n * This simple function returns the presence of the split panel as a child of the\n * Tools component. It must exist and be in side position.\n */\nfunction getSplitPanelStatus(splitPanelDisplayed: boolean, splitPanelPosition: string) {\n return splitPanelDisplayed && splitPanelPosition === 'side' ? true : false;\n}\n\n/**\n * By default the Tools form is styled as display: none; This behavior should\n * be unchanged in mobile viewports where the Tools form is always suppressed.\n * In large viewports, however the Tools form and its corresponding buttons\n * should be present in the UI under the below circumstances.\n */\nfunction getToolsFormStatus(\n hasSplitPanel: boolean,\n isMobile: boolean,\n isSplitPanelOpen?: boolean,\n isToolsOpen?: boolean,\n toolsHide?: boolean\n) {\n let hasToolsForm = false;\n\n if (!isMobile) {\n // Both the Split Panel and Tools button are needed\n if (hasSplitPanel && !toolsHide) {\n hasToolsForm = true;\n }\n\n // The Split Panel button is needed\n if (hasSplitPanel && !isSplitPanelOpen && toolsHide) {\n hasToolsForm = true;\n }\n\n // The Tools button is needed\n if (!hasSplitPanel && !toolsHide && !isToolsOpen) {\n hasToolsForm = true;\n }\n }\n\n return hasToolsForm;\n}\n\n/**\n * Under two scenarios the Tools form that contains the triggers\n * for the Tools content and the Split Panel may be persistent\n * in the UI (as opposed to disappearing when one of the drawers\n * is open). This will also add a white background as opposed to the\n * default transparent background. The buttons will present and in a\n * selected / not selected state.\n */\nfunction getToolsFormPersistence(\n hasSplitPanel: boolean,\n isSplitPanelOpen?: boolean,\n isToolsOpen?: boolean,\n toolsHide?: boolean\n) {\n let hasToolsFormPersistence = false;\n\n // Both Tools and Split Panel exist and one or both is open\n if (hasSplitPanel && !toolsHide && (isSplitPanelOpen || isToolsOpen)) {\n hasToolsFormPersistence = true;\n }\n\n return hasToolsFormPersistence;\n}\n"]}
1
+ {"version":3,"file":"tools.js","sourceRoot":"","sources":["../../../../src/app-layout/visual-refresh/tools.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 from 'react';\nimport clsx from 'clsx';\nimport { InternalButton } from '../../button/internal';\nimport { useAppLayoutInternals } from './context';\nimport TriggerButton from './trigger-button';\nimport styles from './styles.css.js';\nimport splitPanelStyles from '../../split-panel/styles.css.js';\nimport testutilStyles from '../test-classes/styles.css.js';\nimport { Transition } from '../../internal/components/transition';\nimport customCssProps from '../../internal/generated/custom-css-properties';\n\ninterface ToolsProps {\n children: React.ReactNode;\n}\n\n/**\n * The Tools component consists of the following elements:\n * the container, or root element, that sits as a direct child to the Layout grid definition;\n * the split panel, which exists only if there is a split panel in side position;\n * the tools, or drawer, that contains the hide tools form and the children passed through the API;\n * the show tools form that contains the triggers for both the drawer and the\n * split panel in large viewports;\n */\nexport default function Tools({ children }: ToolsProps) {\n const {\n ariaLabels,\n disableBodyScroll,\n drawers,\n handleSplitPanelClick,\n handleToolsClick,\n hasDrawerViewportOverlay,\n isMobile,\n isSplitPanelOpen,\n isToolsOpen,\n loseToolsFocus,\n splitPanel,\n splitPanelControlId,\n splitPanelDisplayed,\n splitPanelPosition,\n splitPanelRefs,\n splitPanelToggle,\n tools,\n toolsControlId,\n toolsHide,\n toolsRefs,\n toolsWidth,\n } = useAppLayoutInternals();\n\n const hasSplitPanel = !!splitPanel && getSplitPanelStatus(splitPanelDisplayed, splitPanelPosition);\n const hasToolsForm = getToolsFormStatus(hasSplitPanel, isMobile, isSplitPanelOpen, isToolsOpen, toolsHide);\n const hasToolsFormPersistence = getToolsFormPersistence(hasSplitPanel, isSplitPanelOpen, isToolsOpen, toolsHide);\n const isUnfocusable = hasDrawerViewportOverlay && !isToolsOpen;\n\n /**\n * If the drawers property is defined the SplitPanel will be mounted and rendered\n * by the Drawers component.\n */\n if ((toolsHide && !hasSplitPanel) || drawers) {\n return null;\n }\n\n return (\n <Transition in={isToolsOpen ?? false}>\n {(state, transitionEventsRef) => (\n <div\n className={clsx(styles['tools-container'], {\n [styles['disable-body-scroll']]: disableBodyScroll,\n [styles.unfocusable]: isUnfocusable,\n [testutilStyles['drawer-closed']]: !isToolsOpen,\n })}\n style={{\n [customCssProps.toolsAnimationStartingOpacity]: `${hasSplitPanel && isSplitPanelOpen ? 1 : 0}`,\n [customCssProps.toolsWidth]: `${toolsWidth}px`,\n }}\n onBlur={e => {\n if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {\n loseToolsFocus();\n }\n }}\n >\n {children}\n\n {!toolsHide && (\n <aside\n id={toolsControlId}\n aria-hidden={!isToolsOpen ? true : false}\n aria-label={ariaLabels?.tools ?? undefined}\n className={clsx(\n styles.tools,\n {\n [styles.animating]: state === 'entering',\n [styles['has-tools-form-persistence']]: hasToolsFormPersistence,\n [styles['is-tools-open']]: isToolsOpen,\n },\n testutilStyles.tools\n )}\n ref={state !== 'exiting' ? transitionEventsRef : undefined}\n >\n <div className={clsx(styles['animated-content'])}>\n <div className={clsx(styles['hide-tools'])}>\n <InternalButton\n ariaLabel={ariaLabels?.toolsClose ?? undefined}\n iconName={isMobile ? 'close' : 'angle-right'}\n onClick={() => handleToolsClick(false)}\n variant=\"icon\"\n formAction=\"none\"\n className={testutilStyles['tools-close']}\n ref={toolsRefs.close}\n />\n </div>\n\n {tools}\n </div>\n </aside>\n )}\n\n {!isMobile && (\n <aside\n aria-hidden={!hasToolsForm ? true : false}\n aria-label={ariaLabels?.tools ?? undefined}\n className={clsx(styles['show-tools'], {\n [styles.animating]: state === 'exiting',\n [styles['has-tools-form']]: hasToolsForm,\n [styles['has-tools-form-persistence']]: hasToolsFormPersistence,\n })}\n ref={state === 'exiting' ? transitionEventsRef : undefined}\n data-testid=\"side-split-panel-drawer\"\n >\n {!toolsHide && (\n <TriggerButton\n ariaLabel={ariaLabels?.toolsToggle}\n ariaControls={toolsControlId}\n ariaExpanded={isToolsOpen}\n iconName=\"status-info\"\n onClick={() => handleToolsClick(!isToolsOpen)}\n selected={hasSplitPanel && isToolsOpen}\n className={testutilStyles['tools-toggle']}\n ref={toolsRefs.toggle}\n />\n )}\n\n {hasSplitPanel && splitPanelToggle.displayed && (\n <TriggerButton\n ariaLabel={splitPanelToggle.ariaLabel}\n ariaControls={splitPanelControlId}\n ariaExpanded={!!isSplitPanelOpen}\n iconName=\"view-vertical\"\n onClick={() => handleSplitPanelClick()}\n selected={hasSplitPanel && isSplitPanelOpen}\n className={splitPanelStyles['open-button']}\n ref={splitPanelRefs.toggle}\n />\n )}\n </aside>\n )}\n </div>\n )}\n </Transition>\n );\n}\n\n/**\n * This simple function returns the presence of the split panel as a child of the\n * Tools component. It must exist and be in side position.\n */\nfunction getSplitPanelStatus(splitPanelDisplayed: boolean, splitPanelPosition: string) {\n return splitPanelDisplayed && splitPanelPosition === 'side' ? true : false;\n}\n\n/**\n * By default the Tools form is styled as display: none; This behavior should\n * be unchanged in mobile viewports where the Tools form is always suppressed.\n * In large viewports, however the Tools form and its corresponding buttons\n * should be present in the UI under the below circumstances.\n */\nfunction getToolsFormStatus(\n hasSplitPanel: boolean,\n isMobile: boolean,\n isSplitPanelOpen?: boolean,\n isToolsOpen?: boolean,\n toolsHide?: boolean\n) {\n let hasToolsForm = false;\n\n if (!isMobile) {\n // Both the Split Panel and Tools button are needed\n if (hasSplitPanel && !toolsHide) {\n hasToolsForm = true;\n }\n\n // The Split Panel button is needed\n if (hasSplitPanel && !isSplitPanelOpen && toolsHide) {\n hasToolsForm = true;\n }\n\n // The Tools button is needed\n if (!hasSplitPanel && !toolsHide && !isToolsOpen) {\n hasToolsForm = true;\n }\n }\n\n return hasToolsForm;\n}\n\n/**\n * Under two scenarios the Tools form that contains the triggers\n * for the Tools content and the Split Panel may be persistent\n * in the UI (as opposed to disappearing when one of the drawers\n * is open). This will also add a white background as opposed to the\n * default transparent background. The buttons will present and in a\n * selected / not selected state.\n */\nfunction getToolsFormPersistence(\n hasSplitPanel: boolean,\n isSplitPanelOpen?: boolean,\n isToolsOpen?: boolean,\n toolsHide?: boolean\n) {\n let hasToolsFormPersistence = false;\n\n // Both Tools and Split Panel exist and one or both is open\n if (hasSplitPanel && !toolsHide && (isSplitPanelOpen || isToolsOpen)) {\n hasToolsFormPersistence = true;\n }\n\n return hasToolsFormPersistence;\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/container/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAM9C,OAAO,EAAE,cAAc,EAAE,CAAC;AAE1B,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,OAAmB,EACnB,qBAA6B,EAC7B,sBAA8B,EAC9B,SAAiB,EACjB,GAAG,KAAK,EACT,EAAE,cAAc,eAmBhB"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/container/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAO9C,OAAO,EAAE,cAAc,EAAE,CAAC;AAE1B,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,OAAmB,EACnB,qBAA6B,EAC7B,sBAA8B,EAC9B,SAAiB,EACjB,GAAG,KAAK,EACT,EAAE,cAAc,eAwBhB"}
@@ -7,13 +7,15 @@ import { getExternalProps } from '../internal/utils/external-props';
7
7
  import { applyDisplayName } from '../internal/utils/apply-display-name';
8
8
  import useBaseComponent from '../internal/hooks/use-base-component';
9
9
  import { AnalyticsFunnelSubStep } from '../internal/analytics/components/analytics-funnel';
10
+ import { getAnalyticsMetadataProps } from '../internal/base-component';
10
11
  export default function Container(_a) {
11
12
  var { variant = 'default', disableHeaderPaddings = false, disableContentPaddings = false, fitHeight = false } = _a, props = __rest(_a, ["variant", "disableHeaderPaddings", "disableContentPaddings", "fitHeight"]);
13
+ const analyticsMetadata = getAnalyticsMetadataProps(props);
12
14
  const baseComponentProps = useBaseComponent('Container', {
13
15
  props: { disableContentPaddings, disableHeaderPaddings, fitHeight, variant },
14
- });
16
+ }, analyticsMetadata);
15
17
  const externalProps = getExternalProps(props);
16
- return (React.createElement(AnalyticsFunnelSubStep, null,
18
+ return (React.createElement(AnalyticsFunnelSubStep, { instanceId: analyticsMetadata === null || analyticsMetadata === void 0 ? void 0 : analyticsMetadata.instanceId, errorContext: analyticsMetadata === null || analyticsMetadata === void 0 ? void 0 : analyticsMetadata.errorContext },
17
19
  React.createElement(InternalContainerAsSubstep, Object.assign({ variant: variant, disableContentPaddings: disableContentPaddings, disableHeaderPaddings: disableHeaderPaddings, fitHeight: fitHeight }, props, externalProps, baseComponentProps))));
18
20
  }
19
21
  applyDisplayName(Container, 'Container');
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/container/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,0BAA0B,EAAE,MAAM,YAAY,CAAC;AAExD,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,sBAAsB,EAAE,MAAM,mDAAmD,CAAC;AAI3F,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAMjB;QANiB,EAChC,OAAO,GAAG,SAAS,EACnB,qBAAqB,GAAG,KAAK,EAC7B,sBAAsB,GAAG,KAAK,EAC9B,SAAS,GAAG,KAAK,OAEF,EADZ,KAAK,cALwB,2EAMjC,CADS;IAER,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,WAAW,EAAE;QACvD,KAAK,EAAE,EAAE,sBAAsB,EAAE,qBAAqB,EAAE,SAAS,EAAE,OAAO,EAAE;KAC7E,CAAC,CAAC;IACH,MAAM,aAAa,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAC;IAE9C,OAAO,CACL,oBAAC,sBAAsB;QACrB,oBAAC,0BAA0B,kBACzB,OAAO,EAAE,OAAO,EAChB,sBAAsB,EAAE,sBAAsB,EAC9C,qBAAqB,EAAE,qBAAqB,EAC5C,SAAS,EAAE,SAAS,IAChB,KAAK,EACL,aAAa,EACb,kBAAkB,EACtB,CACqB,CAC1B,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { InternalContainerAsSubstep } from './internal';\nimport { ContainerProps } from './interfaces';\nimport { getExternalProps } from '../internal/utils/external-props';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { AnalyticsFunnelSubStep } from '../internal/analytics/components/analytics-funnel';\n\nexport { ContainerProps };\n\nexport default function Container({\n variant = 'default',\n disableHeaderPaddings = false,\n disableContentPaddings = false,\n fitHeight = false,\n ...props\n}: ContainerProps) {\n const baseComponentProps = useBaseComponent('Container', {\n props: { disableContentPaddings, disableHeaderPaddings, fitHeight, variant },\n });\n const externalProps = getExternalProps(props);\n\n return (\n <AnalyticsFunnelSubStep>\n <InternalContainerAsSubstep\n variant={variant}\n disableContentPaddings={disableContentPaddings}\n disableHeaderPaddings={disableHeaderPaddings}\n fitHeight={fitHeight}\n {...props}\n {...externalProps}\n {...baseComponentProps}\n />\n </AnalyticsFunnelSubStep>\n );\n}\n\napplyDisplayName(Container, 'Container');\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/container/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,0BAA0B,EAAE,MAAM,YAAY,CAAC;AAExD,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,sBAAsB,EAAE,MAAM,mDAAmD,CAAC;AAC3F,OAAO,EAAkC,yBAAyB,EAAE,MAAM,4BAA4B,CAAC;AAIvG,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAMjB;QANiB,EAChC,OAAO,GAAG,SAAS,EACnB,qBAAqB,GAAG,KAAK,EAC7B,sBAAsB,GAAG,KAAK,EAC9B,SAAS,GAAG,KAAK,OAEF,EADZ,KAAK,cALwB,2EAMjC,CADS;IAER,MAAM,iBAAiB,GAAG,yBAAyB,CAAC,KAAuC,CAAC,CAAC;IAC7F,MAAM,kBAAkB,GAAG,gBAAgB,CACzC,WAAW,EACX;QACE,KAAK,EAAE,EAAE,sBAAsB,EAAE,qBAAqB,EAAE,SAAS,EAAE,OAAO,EAAE;KAC7E,EACD,iBAAiB,CAClB,CAAC;IACF,MAAM,aAAa,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAC;IAE9C,OAAO,CACL,oBAAC,sBAAsB,IAAC,UAAU,EAAE,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,UAAU,EAAE,YAAY,EAAE,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,YAAY;QAC9G,oBAAC,0BAA0B,kBACzB,OAAO,EAAE,OAAO,EAChB,sBAAsB,EAAE,sBAAsB,EAC9C,qBAAqB,EAAE,qBAAqB,EAC5C,SAAS,EAAE,SAAS,IAChB,KAAK,EACL,aAAa,EACb,kBAAkB,EACtB,CACqB,CAC1B,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { InternalContainerAsSubstep } from './internal';\nimport { ContainerProps } from './interfaces';\nimport { getExternalProps } from '../internal/utils/external-props';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { AnalyticsFunnelSubStep } from '../internal/analytics/components/analytics-funnel';\nimport { BasePropsWithAnalyticsMetadata, getAnalyticsMetadataProps } from '../internal/base-component';\n\nexport { ContainerProps };\n\nexport default function Container({\n variant = 'default',\n disableHeaderPaddings = false,\n disableContentPaddings = false,\n fitHeight = false,\n ...props\n}: ContainerProps) {\n const analyticsMetadata = getAnalyticsMetadataProps(props as BasePropsWithAnalyticsMetadata);\n const baseComponentProps = useBaseComponent(\n 'Container',\n {\n props: { disableContentPaddings, disableHeaderPaddings, fitHeight, variant },\n },\n analyticsMetadata\n );\n const externalProps = getExternalProps(props);\n\n return (\n <AnalyticsFunnelSubStep instanceId={analyticsMetadata?.instanceId} errorContext={analyticsMetadata?.errorContext}>\n <InternalContainerAsSubstep\n variant={variant}\n disableContentPaddings={disableContentPaddings}\n disableHeaderPaddings={disableHeaderPaddings}\n fitHeight={fitHeight}\n {...props}\n {...externalProps}\n {...baseComponentProps}\n />\n </AnalyticsFunnelSubStep>\n );\n}\n\napplyDisplayName(Container, 'Container');\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/form/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAWzC,OAAO,EAAE,SAAS,EAAE,CAAC;AAoBrB,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAAE,OAAqB,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,eAmB1E"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/form/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAYzC,OAAO,EAAE,SAAS,EAAE,CAAC;AAoBrB,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAAE,OAAqB,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,eAyB1E"}
package/form/index.js CHANGED
@@ -10,6 +10,7 @@ import { ButtonContext } from '../internal/context/button-context';
10
10
  import { useFunnel, useFunnelNameSelector, useFunnelStep } from '../internal/analytics/hooks/use-funnel';
11
11
  import formStyles from './styles.css.js';
12
12
  import headerStyles from '../header/styles.css.js';
13
+ import { getAnalyticsMetadataProps } from '../internal/base-component';
13
14
  const FormWithAnalytics = (_a) => {
14
15
  var { variant = 'full-page', actions } = _a, props = __rest(_a, ["variant", "actions"]);
15
16
  const { funnelProps, funnelSubmit, funnelNextOrSubmitAttempt } = useFunnel();
@@ -25,13 +26,12 @@ const FormWithAnalytics = (_a) => {
25
26
  };
26
27
  export default function Form(_a) {
27
28
  var { variant = 'full-page' } = _a, props = __rest(_a, ["variant"]);
28
- const baseComponentProps = useBaseComponent('Form', {
29
- props: { variant },
30
- });
29
+ const analyticsMetadata = getAnalyticsMetadataProps(props);
30
+ const baseComponentProps = useBaseComponent('Form', { props: { variant } }, analyticsMetadata);
31
31
  const inheritedFunnelNameSelector = useFunnelNameSelector();
32
32
  const funnelNameSelector = inheritedFunnelNameSelector || `.${headerStyles['heading-text']}`;
33
- return (React.createElement(AnalyticsFunnel, { funnelType: "single-page", optionalStepNumbers: [], totalFunnelSteps: 1, funnelNameSelectors: [funnelNameSelector, `.${formStyles.header}`] },
34
- React.createElement(AnalyticsFunnelStep, { stepNumber: 1 },
33
+ return (React.createElement(AnalyticsFunnel, { instanceId: analyticsMetadata === null || analyticsMetadata === void 0 ? void 0 : analyticsMetadata.instanceId, flowType: analyticsMetadata === null || analyticsMetadata === void 0 ? void 0 : analyticsMetadata.flowType, errorContext: analyticsMetadata === null || analyticsMetadata === void 0 ? void 0 : analyticsMetadata.errorContext, funnelType: "single-page", optionalStepNumbers: [], totalFunnelSteps: 1, funnelNameSelectors: [funnelNameSelector, `.${formStyles.header}`] },
34
+ React.createElement(AnalyticsFunnelStep, { instanceId: analyticsMetadata === null || analyticsMetadata === void 0 ? void 0 : analyticsMetadata.instanceId, errorContext: analyticsMetadata === null || analyticsMetadata === void 0 ? void 0 : analyticsMetadata.errorContext, stepNumber: 1 },
35
35
  React.createElement(FormWithAnalytics, Object.assign({ variant: variant }, props, baseComponentProps)))));
36
36
  }
37
37
  applyDisplayName(Form, 'Form');
package/form/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/form/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,YAAY,MAAM,YAAY,CAAC;AACtC,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAEpE,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,mDAAmD,CAAC;AACzG,OAAO,EAAE,aAAa,EAAsB,MAAM,oCAAoC,CAAC;AACvF,OAAO,EAAE,SAAS,EAAE,qBAAqB,EAAE,aAAa,EAAE,MAAM,wCAAwC,CAAC;AAEzG,OAAO,UAAU,MAAM,iBAAiB,CAAC;AACzC,OAAO,YAAY,MAAM,yBAAyB,CAAC;AAInD,MAAM,iBAAiB,GAAG,CAAC,EAAuD,EAAE,EAAE;QAA3D,EAAE,OAAO,GAAG,WAAW,EAAE,OAAO,OAAuB,EAAlB,KAAK,cAA1C,sBAA4C,CAAF;IACnE,MAAM,EAAE,WAAW,EAAE,YAAY,EAAE,yBAAyB,EAAE,GAAG,SAAS,EAAE,CAAC;IAC7E,MAAM,EAAE,eAAe,EAAE,GAAG,aAAa,EAAE,CAAC;IAE5C,MAAM,uBAAuB,GAAkC,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE;QAC7E,IAAI,OAAO,KAAK,SAAS,EAAE;YACzB,yBAAyB,EAAE,CAAC;YAC5B,YAAY,EAAE,CAAC;SAChB;IACH,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,aAAa,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,OAAO,EAAE,uBAAuB,EAAE;QACjE,oBAAC,YAAY,kBAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,IAAM,KAAK,EAAM,WAAW,EAAM,eAAe,EAAI,CAC9E,CAC1B,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAA8C;QAA9C,EAAE,OAAO,GAAG,WAAW,OAAuB,EAAlB,KAAK,cAAjC,WAAmC,CAAF;IAC5D,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,MAAM,EAAE;QAClD,KAAK,EAAE,EAAE,OAAO,EAAE;KACnB,CAAC,CAAC;IACH,MAAM,2BAA2B,GAAG,qBAAqB,EAAE,CAAC;IAC5D,MAAM,kBAAkB,GAAG,2BAA2B,IAAI,IAAI,YAAY,CAAC,cAAc,CAAC,EAAE,CAAC;IAE7F,OAAO,CACL,oBAAC,eAAe,IACd,UAAU,EAAC,aAAa,EACxB,mBAAmB,EAAE,EAAE,EACvB,gBAAgB,EAAE,CAAC,EACnB,mBAAmB,EAAE,CAAC,kBAAkB,EAAE,IAAI,UAAU,CAAC,MAAM,EAAE,CAAC;QAElE,oBAAC,mBAAmB,IAAC,UAAU,EAAE,CAAC;YAChC,oBAAC,iBAAiB,kBAAC,OAAO,EAAE,OAAO,IAAM,KAAK,EAAM,kBAAkB,EAAI,CACtD,CACN,CACnB,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { FormProps } from './interfaces';\nimport InternalForm from './internal';\nimport useBaseComponent from '../internal/hooks/use-base-component';\n\nimport { AnalyticsFunnel, AnalyticsFunnelStep } from '../internal/analytics/components/analytics-funnel';\nimport { ButtonContext, ButtonContextProps } from '../internal/context/button-context';\nimport { useFunnel, useFunnelNameSelector, useFunnelStep } from '../internal/analytics/hooks/use-funnel';\n\nimport formStyles from './styles.css.js';\nimport headerStyles from '../header/styles.css.js';\n\nexport { FormProps };\n\nconst FormWithAnalytics = ({ variant = 'full-page', actions, ...props }: FormProps) => {\n const { funnelProps, funnelSubmit, funnelNextOrSubmitAttempt } = useFunnel();\n const { funnelStepProps } = useFunnelStep();\n\n const handleActionButtonClick: ButtonContextProps['onClick'] = ({ variant }) => {\n if (variant === 'primary') {\n funnelNextOrSubmitAttempt();\n funnelSubmit();\n }\n };\n\n return (\n <ButtonContext.Provider value={{ onClick: handleActionButtonClick }}>\n <InternalForm variant={variant} actions={actions} {...props} {...funnelProps} {...funnelStepProps} />\n </ButtonContext.Provider>\n );\n};\n\nexport default function Form({ variant = 'full-page', ...props }: FormProps) {\n const baseComponentProps = useBaseComponent('Form', {\n props: { variant },\n });\n const inheritedFunnelNameSelector = useFunnelNameSelector();\n const funnelNameSelector = inheritedFunnelNameSelector || `.${headerStyles['heading-text']}`;\n\n return (\n <AnalyticsFunnel\n funnelType=\"single-page\"\n optionalStepNumbers={[]}\n totalFunnelSteps={1}\n funnelNameSelectors={[funnelNameSelector, `.${formStyles.header}`]}\n >\n <AnalyticsFunnelStep stepNumber={1}>\n <FormWithAnalytics variant={variant} {...props} {...baseComponentProps} />\n </AnalyticsFunnelStep>\n </AnalyticsFunnel>\n );\n}\n\napplyDisplayName(Form, 'Form');\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/form/index.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 from 'react';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { FormProps } from './interfaces';\nimport InternalForm from './internal';\nimport useBaseComponent from '../internal/hooks/use-base-component';\n\nimport { AnalyticsFunnel, AnalyticsFunnelStep } from '../internal/analytics/components/analytics-funnel';\nimport { ButtonContext, ButtonContextProps } from '../internal/context/button-context';\nimport { useFunnel, useFunnelNameSelector, useFunnelStep } from '../internal/analytics/hooks/use-funnel';\n\nimport formStyles from './styles.css.js';\nimport headerStyles from '../header/styles.css.js';\nimport { BasePropsWithAnalyticsMetadata, getAnalyticsMetadataProps } from '../internal/base-component';\n\nexport { FormProps };\n\nconst FormWithAnalytics = ({ variant = 'full-page', actions, ...props }: FormProps) => {\n const { funnelProps, funnelSubmit, funnelNextOrSubmitAttempt } = useFunnel();\n const { funnelStepProps } = useFunnelStep();\n\n const handleActionButtonClick: ButtonContextProps['onClick'] = ({ variant }) => {\n if (variant === 'primary') {\n funnelNextOrSubmitAttempt();\n funnelSubmit();\n }\n };\n\n return (\n <ButtonContext.Provider value={{ onClick: handleActionButtonClick }}>\n <InternalForm variant={variant} actions={actions} {...props} {...funnelProps} {...funnelStepProps} />\n </ButtonContext.Provider>\n );\n};\n\nexport default function Form({ variant = 'full-page', ...props }: FormProps) {\n const analyticsMetadata = getAnalyticsMetadataProps(props as BasePropsWithAnalyticsMetadata);\n const baseComponentProps = useBaseComponent('Form', { props: { variant } }, analyticsMetadata);\n const inheritedFunnelNameSelector = useFunnelNameSelector();\n const funnelNameSelector = inheritedFunnelNameSelector || `.${headerStyles['heading-text']}`;\n\n return (\n <AnalyticsFunnel\n instanceId={analyticsMetadata?.instanceId}\n flowType={analyticsMetadata?.flowType}\n errorContext={analyticsMetadata?.errorContext}\n funnelType=\"single-page\"\n optionalStepNumbers={[]}\n totalFunnelSteps={1}\n funnelNameSelectors={[funnelNameSelector, `.${formStyles.header}`]}\n >\n <AnalyticsFunnelStep\n instanceId={analyticsMetadata?.instanceId}\n errorContext={analyticsMetadata?.errorContext}\n stepNumber={1}\n >\n <FormWithAnalytics variant={variant} {...props} {...baseComponentProps} />\n </AnalyticsFunnelStep>\n </AnalyticsFunnel>\n );\n}\n\napplyDisplayName(Form, 'Form');\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/form-field/index.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAE9C,OAAO,EAAE,cAAc,EAAE,CAAC;AAE1B,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAAE,OAAe,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,eAG9E"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/form-field/index.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAE9C,OAAO,EAAE,cAAc,EAAE,CAAC;AAE1B,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAAE,OAAe,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,eAO9E"}
@@ -5,9 +5,10 @@ import React from 'react';
5
5
  import InternalFormField from './internal';
6
6
  import { applyDisplayName } from '../internal/utils/apply-display-name';
7
7
  import useBaseComponent from '../internal/hooks/use-base-component';
8
+ import { getAnalyticsMetadataProps } from '../internal/base-component';
8
9
  export default function FormField(_a) {
9
10
  var { stretch = false } = _a, props = __rest(_a, ["stretch"]);
10
- const baseComponentProps = useBaseComponent('FormField', { props: { stretch } });
11
+ const baseComponentProps = useBaseComponent('FormField', { props: { stretch } }, getAnalyticsMetadataProps(props));
11
12
  return React.createElement(InternalFormField, Object.assign({ stretch: stretch }, props, { __hideLabel: false }, baseComponentProps));
12
13
  }
13
14
  applyDisplayName(FormField, 'FormField');
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/form-field/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,iBAAiB,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAKpE,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAA6C;QAA7C,EAAE,OAAO,GAAG,KAAK,OAA4B,EAAvB,KAAK,cAA3B,WAA6B,CAAF;IAC3D,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,WAAW,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,CAAC,CAAC;IACjF,OAAO,oBAAC,iBAAiB,kBAAC,OAAO,EAAE,OAAO,IAAM,KAAK,IAAE,WAAW,EAAE,KAAK,IAAM,kBAAkB,EAAI,CAAC;AACxG,CAAC;AAED,gBAAgB,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport InternalFormField from './internal';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { FormFieldProps } from './interfaces';\n\nexport { FormFieldProps };\n\nexport default function FormField({ stretch = false, ...props }: FormFieldProps) {\n const baseComponentProps = useBaseComponent('FormField', { props: { stretch } });\n return <InternalFormField stretch={stretch} {...props} __hideLabel={false} {...baseComponentProps} />;\n}\n\napplyDisplayName(FormField, 'FormField');\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/form-field/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,iBAAiB,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAkC,yBAAyB,EAAE,MAAM,4BAA4B,CAAC;AAMvG,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAA6C;QAA7C,EAAE,OAAO,GAAG,KAAK,OAA4B,EAAvB,KAAK,cAA3B,WAA6B,CAAF;IAC3D,MAAM,kBAAkB,GAAG,gBAAgB,CACzC,WAAW,EACX,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,EACtB,yBAAyB,CAAC,KAAuC,CAAC,CACnE,CAAC;IACF,OAAO,oBAAC,iBAAiB,kBAAC,OAAO,EAAE,OAAO,IAAM,KAAK,IAAE,WAAW,EAAE,KAAK,IAAM,kBAAkB,EAAI,CAAC;AACxG,CAAC;AAED,gBAAgB,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport InternalFormField from './internal';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { BasePropsWithAnalyticsMetadata, getAnalyticsMetadataProps } from '../internal/base-component';\n\nimport { FormFieldProps } from './interfaces';\n\nexport { FormFieldProps };\n\nexport default function FormField({ stretch = false, ...props }: FormFieldProps) {\n const baseComponentProps = useBaseComponent(\n 'FormField',\n { props: { stretch } },\n getAnalyticsMetadataProps(props as BasePropsWithAnalyticsMetadata)\n );\n return <InternalFormField stretch={stretch} {...props} __hideLabel={false} {...baseComponentProps} />;\n}\n\napplyDisplayName(FormField, 'FormField');\n"]}
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import { FunnelStepContextValue, FunnelSubStepContextValue } from '../context/analytics-context';
3
- import { FunnelProps, FunnelStepProps, StepConfiguration } from '../interfaces';
3
+ import { AnalyticsMetadata, FunnelProps, FunnelStepProps, StepConfiguration } from '../interfaces';
4
4
  export declare const FUNNEL_VERSION = "1.4";
5
5
  interface AnalyticsFunnelProps {
6
6
  children?: React.ReactNode;
@@ -9,18 +9,25 @@ interface AnalyticsFunnelProps {
9
9
  funnelType: FunnelProps['funnelType'];
10
10
  optionalStepNumbers: FunnelProps['optionalStepNumbers'];
11
11
  totalFunnelSteps: FunnelProps['totalFunnelSteps'];
12
+ instanceId?: AnalyticsMetadata['instanceId'];
13
+ flowType?: AnalyticsMetadata['flowType'];
14
+ errorContext?: AnalyticsMetadata['errorContext'];
12
15
  }
13
16
  export declare const AnalyticsFunnel: (props: AnalyticsFunnelProps) => JSX.Element;
14
17
  export declare const CREATION_EDIT_FLOW_DONE_EVENT_NAME = "awsui-creation-edit-flow-done";
15
18
  interface AnalyticsFunnelStepProps {
19
+ instanceId?: AnalyticsMetadata['instanceId'];
20
+ errorContext?: AnalyticsMetadata['errorContext'];
16
21
  children?: React.ReactNode | ((props: FunnelStepContextValue) => React.ReactNode);
17
22
  stepNameSelector?: FunnelStepProps['stepNameSelector'];
18
23
  stepNumber: FunnelStepProps['stepNumber'];
19
24
  }
20
25
  export declare const AnalyticsFunnelStep: (props: AnalyticsFunnelStepProps) => JSX.Element;
21
26
  interface AnalyticsFunnelSubStepProps {
27
+ instanceId?: AnalyticsMetadata['instanceId'];
28
+ errorContext?: AnalyticsMetadata['errorContext'];
22
29
  children?: React.ReactNode | ((props: FunnelSubStepContextValue) => React.ReactNode);
23
30
  }
24
- export declare const AnalyticsFunnelSubStep: ({ children }: AnalyticsFunnelSubStepProps) => JSX.Element;
31
+ export declare const AnalyticsFunnelSubStep: ({ children, instanceId }: AnalyticsFunnelSubStepProps) => JSX.Element;
25
32
  export {};
26
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,EAAE,WAAW,EAAE,eAAe,EAAE,iBAAiB,EAAwB,MAAM,eAAe,CAAC;AAatG,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,WAAW,CAAC,YAAY,CAAC,CAAC;IACtC,mBAAmB,EAAE,WAAW,CAAC,qBAAqB,CAAC,CAAC;IACxD,gBAAgB,EAAE,WAAW,CAAC,kBAAkB,CAAC,CAAC;CACnD;AAED,eAAO,MAAM,eAAe,UAAW,oBAAoB,gBAa1D,CAAC;AACF,eAAO,MAAM,kCAAkC,kCAAkC,CAAC;AAgLlF,UAAU,wBAAwB;IAChC,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;AAuKF,UAAU,2BAA2B;IACnC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,KAAK,EAAE,yBAAyB,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;CACtF;AAED,eAAO,MAAM,sBAAsB,iBAAkB,2BAA2B,gBAiG/E,CAAC"}
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,WAAW,EACX,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,WAAW,CAAC,YAAY,CAAC,CAAC;IACtC,mBAAmB,EAAE,WAAW,CAAC,qBAAqB,CAAC,CAAC;IACxD,gBAAgB,EAAE,WAAW,CAAC,kBAAkB,CAAC,CAAC;IAClD,UAAU,CAAC,EAAE,iBAAiB,CAAC,YAAY,CAAC,CAAC;IAC7C,QAAQ,CAAC,EAAE,iBAAiB,CAAC,UAAU,CAAC,CAAC;IACzC,YAAY,CAAC,EAAE,iBAAiB,CAAC,cAAc,CAAC,CAAC;CAClD;AAED,eAAO,MAAM,eAAe,UAAW,oBAAoB,gBAa1D,CAAC;AACF,eAAO,MAAM,kCAAkC,kCAAkC,CAAC;AAkLlF,UAAU,wBAAwB;IAChC,UAAU,CAAC,EAAE,iBAAiB,CAAC,YAAY,CAAC,CAAC;IAC7C,YAAY,CAAC,EAAE,iBAAiB,CAAC,cAAc,CAAC,CAAC;IACjD,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;AA4KF,UAAU,2BAA2B;IACnC,UAAU,CAAC,EAAE,iBAAiB,CAAC,YAAY,CAAC,CAAC;IAC7C,YAAY,CAAC,EAAE,iBAAiB,CAAC,cAAc,CAAC,CAAC;IACjD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,KAAK,EAAE,yBAAyB,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;CACtF;AAED,eAAO,MAAM,sBAAsB,6BAA8B,2BAA2B,gBAkG3F,CAAC"}
@@ -91,6 +91,8 @@ const InnerAnalyticsFunnel = (_a) => {
91
91
  { number: 1, isOptional: false, name: (_a = getNameFromSelector(funnelNameSelector.current)) !== null && _a !== void 0 ? _a : '' },
92
92
  ];
93
93
  funnelInteractionId = FunnelMetrics.funnelStart({
94
+ instanceId: props.instanceId,
95
+ flowType: props.flowType,
94
96
  funnelNameSelector: funnelNameSelector.current,
95
97
  optionalStepNumbers: props.optionalStepNumbers,
96
98
  funnelType: props.funnelType,
@@ -236,7 +238,7 @@ function useStepChangeListener(stepNumber, handler) {
236
238
  return { onStepChange: stepChangeCallback, subStepConfiguration };
237
239
  }
238
240
  const InnerAnalyticsFunnelStep = (_a) => {
239
- var { children, stepNumber } = _a, rest = __rest(_a, ["children", "stepNumber"]);
241
+ var { children, stepNumber, instanceId } = _a, rest = __rest(_a, ["children", "stepNumber", "instanceId"]);
240
242
  const { funnelInteractionId, funnelNameSelector, funnelState, funnelType } = useFunnel();
241
243
  const parentStep = useFunnelStep();
242
244
  const parentStepExists = parentStep.isInStep;
@@ -251,6 +253,7 @@ const InnerAnalyticsFunnelStep = (_a) => {
251
253
  }
252
254
  const stepName = (_a = getNameFromSelector(stepNameSelector)) !== null && _a !== void 0 ? _a : '';
253
255
  FunnelMetrics.funnelStepChange({
256
+ instanceId,
254
257
  funnelInteractionId,
255
258
  stepNumber,
256
259
  stepName,
@@ -280,6 +283,7 @@ const InnerAnalyticsFunnelStep = (_a) => {
280
283
  const stepName = getNameFromSelector(stepNameSelector);
281
284
  if (funnelState.current === 'default') {
282
285
  FunnelMetrics.funnelStepStart({
286
+ instanceId,
283
287
  funnelInteractionId,
284
288
  stepNumber,
285
289
  stepName,
@@ -293,6 +297,7 @@ const InnerAnalyticsFunnelStep = (_a) => {
293
297
  // eslint-disable-next-line react-hooks/exhaustive-deps
294
298
  if (funnelState.current !== 'cancelled') {
295
299
  FunnelMetrics.funnelStepComplete({
300
+ instanceId,
296
301
  funnelInteractionId,
297
302
  stepNumber,
298
303
  stepName,
@@ -304,6 +309,7 @@ const InnerAnalyticsFunnelStep = (_a) => {
304
309
  }
305
310
  };
306
311
  }, [
312
+ instanceId,
307
313
  funnelInteractionId,
308
314
  stepNumber,
309
315
  stepNameSelector,
@@ -313,6 +319,7 @@ const InnerAnalyticsFunnelStep = (_a) => {
313
319
  parentStepFunnelInteractionId,
314
320
  ]);
315
321
  const contextValue = {
322
+ instanceId,
316
323
  stepNumber,
317
324
  stepNameSelector,
318
325
  funnelStepProps,
@@ -330,7 +337,7 @@ const InnerAnalyticsFunnelStep = (_a) => {
330
337
  const effectiveContextValue = parentStepExists && parentStepFunnelInteractionId ? parentStep : contextValue;
331
338
  return (React.createElement(FunnelStepContext.Provider, { value: effectiveContextValue }, typeof children === 'function' ? children(effectiveContextValue) : children));
332
339
  };
333
- export const AnalyticsFunnelSubStep = ({ children }) => {
340
+ export const AnalyticsFunnelSubStep = ({ children, instanceId }) => {
334
341
  const subStepId = useUniqueId('substep');
335
342
  const subStepSelector = getSubStepSelector(subStepId);
336
343
  const subStepNameSelector = getSubStepNameSelector(subStepId);
@@ -342,6 +349,7 @@ export const AnalyticsFunnelSubStep = ({ children }) => {
342
349
  const { funnelState, funnelInteractionId } = useFunnel();
343
350
  const { stepNumber, stepNameSelector } = useFunnelStep();
344
351
  const newContext = {
352
+ instanceId,
345
353
  subStepSelector,
346
354
  subStepNameSelector,
347
355
  subStepId,