@cloudscape-design/components-themeable 3.0.304 → 3.0.306

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 (158) hide show
  1. package/lib/internal/manifest.json +1 -1
  2. package/lib/internal/scss/table/styles.scss +15 -4
  3. package/lib/internal/template/alert/internal.d.ts.map +1 -1
  4. package/lib/internal/template/alert/internal.js +1 -1
  5. package/lib/internal/template/alert/internal.js.map +1 -1
  6. package/lib/internal/template/area-chart/elements/use-highlight-details.d.ts.map +1 -1
  7. package/lib/internal/template/area-chart/elements/use-highlight-details.js +3 -1
  8. package/lib/internal/template/area-chart/elements/use-highlight-details.js.map +1 -1
  9. package/lib/internal/template/area-chart/interfaces.d.ts +1 -0
  10. package/lib/internal/template/area-chart/interfaces.d.ts.map +1 -1
  11. package/lib/internal/template/area-chart/interfaces.js.map +1 -1
  12. package/lib/internal/template/breadcrumb-group/index.d.ts +1 -1
  13. package/lib/internal/template/breadcrumb-group/index.d.ts.map +1 -1
  14. package/lib/internal/template/breadcrumb-group/index.js +2 -2
  15. package/lib/internal/template/breadcrumb-group/index.js.map +1 -1
  16. package/lib/internal/template/breadcrumb-group/internal.d.ts +1 -2
  17. package/lib/internal/template/breadcrumb-group/internal.d.ts.map +1 -1
  18. package/lib/internal/template/breadcrumb-group/internal.js +8 -1
  19. package/lib/internal/template/breadcrumb-group/internal.js.map +1 -1
  20. package/lib/internal/template/breadcrumb-group/item/item.d.ts.map +1 -1
  21. package/lib/internal/template/breadcrumb-group/item/item.js +9 -6
  22. package/lib/internal/template/breadcrumb-group/item/item.js.map +1 -1
  23. package/lib/internal/template/button/internal.d.ts.map +1 -1
  24. package/lib/internal/template/button/internal.js +6 -1
  25. package/lib/internal/template/button/internal.js.map +1 -1
  26. package/lib/internal/template/cards/index.d.ts.map +1 -1
  27. package/lib/internal/template/cards/index.js +6 -1
  28. package/lib/internal/template/cards/index.js.map +1 -1
  29. package/lib/internal/template/code-editor/index.d.ts.map +1 -1
  30. package/lib/internal/template/code-editor/index.js +18 -16
  31. package/lib/internal/template/code-editor/index.js.map +1 -1
  32. package/lib/internal/template/code-editor/interfaces.d.ts +1 -1
  33. package/lib/internal/template/code-editor/interfaces.d.ts.map +1 -1
  34. package/lib/internal/template/code-editor/interfaces.js.map +1 -1
  35. package/lib/internal/template/code-editor/pane.d.ts +2 -2
  36. package/lib/internal/template/code-editor/pane.d.ts.map +1 -1
  37. package/lib/internal/template/code-editor/pane.js +8 -5
  38. package/lib/internal/template/code-editor/pane.js.map +1 -1
  39. package/lib/internal/template/code-editor/preferences-modal.d.ts +7 -7
  40. package/lib/internal/template/code-editor/preferences-modal.d.ts.map +1 -1
  41. package/lib/internal/template/code-editor/preferences-modal.js.map +1 -1
  42. package/lib/internal/template/code-editor/status-bar.d.ts +2 -2
  43. package/lib/internal/template/code-editor/status-bar.d.ts.map +1 -1
  44. package/lib/internal/template/code-editor/status-bar.js +5 -3
  45. package/lib/internal/template/code-editor/status-bar.js.map +1 -1
  46. package/lib/internal/template/container/index.d.ts.map +1 -1
  47. package/lib/internal/template/container/index.js +3 -1
  48. package/lib/internal/template/container/index.js.map +1 -1
  49. package/lib/internal/template/container/internal.d.ts.map +1 -1
  50. package/lib/internal/template/container/internal.js +4 -2
  51. package/lib/internal/template/container/internal.js.map +1 -1
  52. package/lib/internal/template/form/index.d.ts.map +1 -1
  53. package/lib/internal/template/form/index.js +5 -1
  54. package/lib/internal/template/form/index.js.map +1 -1
  55. package/lib/internal/template/form/internal.d.ts.map +1 -1
  56. package/lib/internal/template/form/internal.js +11 -2
  57. package/lib/internal/template/form/internal.js.map +1 -1
  58. package/lib/internal/template/form-field/internal.d.ts.map +1 -1
  59. package/lib/internal/template/form-field/internal.js +28 -2
  60. package/lib/internal/template/form-field/internal.js.map +1 -1
  61. package/lib/internal/template/header/internal.d.ts.map +1 -1
  62. package/lib/internal/template/header/internal.js +1 -1
  63. package/lib/internal/template/header/internal.js.map +1 -1
  64. package/lib/internal/template/help-panel/index.d.ts.map +1 -1
  65. package/lib/internal/template/help-panel/index.js +3 -1
  66. package/lib/internal/template/help-panel/index.js.map +1 -1
  67. package/lib/internal/template/internal/analytics/hooks/use-funnel.d.ts.map +1 -1
  68. package/lib/internal/template/internal/analytics/hooks/use-funnel.js +17 -11
  69. package/lib/internal/template/internal/analytics/hooks/use-funnel.js.map +1 -1
  70. package/lib/internal/template/internal/components/cartesian-chart/bottom-labels.d.ts.map +1 -1
  71. package/lib/internal/template/internal/components/cartesian-chart/bottom-labels.js +3 -1
  72. package/lib/internal/template/internal/components/cartesian-chart/bottom-labels.js.map +1 -1
  73. package/lib/internal/template/internal/components/cartesian-chart/interfaces.d.ts +4 -0
  74. package/lib/internal/template/internal/components/cartesian-chart/interfaces.d.ts.map +1 -1
  75. package/lib/internal/template/internal/components/cartesian-chart/interfaces.js.map +1 -1
  76. package/lib/internal/template/internal/components/cartesian-chart/left-labels.d.ts.map +1 -1
  77. package/lib/internal/template/internal/components/cartesian-chart/left-labels.js +3 -1
  78. package/lib/internal/template/internal/components/cartesian-chart/left-labels.js.map +1 -1
  79. package/lib/internal/template/internal/components/chart-filter/index.d.ts.map +1 -1
  80. package/lib/internal/template/internal/components/chart-filter/index.js +4 -2
  81. package/lib/internal/template/internal/components/chart-filter/index.js.map +1 -1
  82. package/lib/internal/template/internal/components/chart-legend/index.d.ts.map +1 -1
  83. package/lib/internal/template/internal/components/chart-legend/index.js +3 -1
  84. package/lib/internal/template/internal/components/chart-legend/index.js.map +1 -1
  85. package/lib/internal/template/internal/components/chart-plot/index.d.ts.map +1 -1
  86. package/lib/internal/template/internal/components/chart-plot/index.js +3 -1
  87. package/lib/internal/template/internal/components/chart-plot/index.js.map +1 -1
  88. package/lib/internal/template/internal/components/chart-status-container/index.d.ts.map +1 -1
  89. package/lib/internal/template/internal/components/chart-status-container/index.js +7 -4
  90. package/lib/internal/template/internal/components/chart-status-container/index.js.map +1 -1
  91. package/lib/internal/template/internal/components/token-list/token-limit-toggle.d.ts.map +1 -1
  92. package/lib/internal/template/internal/components/token-list/token-limit-toggle.js +4 -2
  93. package/lib/internal/template/internal/components/token-list/token-limit-toggle.js.map +1 -1
  94. package/lib/internal/template/internal/environment.js +1 -1
  95. package/lib/internal/template/internal/generated/theming/index.cjs.d.ts +2 -2
  96. package/lib/internal/template/internal/generated/theming/index.d.ts +2 -2
  97. package/lib/internal/template/internal/i18n/testing.d.ts +8 -0
  98. package/lib/internal/template/internal/i18n/testing.d.ts.map +1 -0
  99. package/lib/internal/template/internal/i18n/testing.js +8 -0
  100. package/lib/internal/template/internal/i18n/testing.js.map +1 -0
  101. package/lib/internal/template/link/internal.d.ts.map +1 -1
  102. package/lib/internal/template/link/internal.js +39 -2
  103. package/lib/internal/template/link/internal.js.map +1 -1
  104. package/lib/internal/template/multiselect/internal.d.ts.map +1 -1
  105. package/lib/internal/template/multiselect/internal.js +3 -1
  106. package/lib/internal/template/multiselect/internal.js.map +1 -1
  107. package/lib/internal/template/pie-chart/interfaces.d.ts +4 -0
  108. package/lib/internal/template/pie-chart/interfaces.d.ts.map +1 -1
  109. package/lib/internal/template/pie-chart/interfaces.js.map +1 -1
  110. package/lib/internal/template/pie-chart/pie-chart.d.ts.map +1 -1
  111. package/lib/internal/template/pie-chart/pie-chart.js +3 -1
  112. package/lib/internal/template/pie-chart/pie-chart.js.map +1 -1
  113. package/lib/internal/template/pie-chart/segments.d.ts.map +1 -1
  114. package/lib/internal/template/pie-chart/segments.js +3 -1
  115. package/lib/internal/template/pie-chart/segments.js.map +1 -1
  116. package/lib/internal/template/pie-chart/utils.d.ts +2 -1
  117. package/lib/internal/template/pie-chart/utils.d.ts.map +1 -1
  118. package/lib/internal/template/pie-chart/utils.js +3 -3
  119. package/lib/internal/template/pie-chart/utils.js.map +1 -1
  120. package/lib/internal/template/popover/body.d.ts.map +1 -1
  121. package/lib/internal/template/popover/body.js +3 -1
  122. package/lib/internal/template/popover/body.js.map +1 -1
  123. package/lib/internal/template/popover/interfaces.d.ts +1 -0
  124. package/lib/internal/template/popover/interfaces.d.ts.map +1 -1
  125. package/lib/internal/template/popover/interfaces.js.map +1 -1
  126. package/lib/internal/template/table/styles.css.js +35 -33
  127. package/lib/internal/template/table/styles.scoped.css +49 -43
  128. package/lib/internal/template/table/styles.selectors.js +35 -33
  129. package/lib/internal/template/table/use-sticky-scrollbar.d.ts +1 -0
  130. package/lib/internal/template/table/use-sticky-scrollbar.d.ts.map +1 -1
  131. package/lib/internal/template/table/use-sticky-scrollbar.js +10 -36
  132. package/lib/internal/template/table/use-sticky-scrollbar.js.map +1 -1
  133. package/lib/internal/template/tabs/interfaces.d.ts +2 -2
  134. package/lib/internal/template/tabs/interfaces.d.ts.map +1 -1
  135. package/lib/internal/template/tabs/interfaces.js.map +1 -1
  136. package/lib/internal/template/tabs/tab-header-bar.d.ts.map +1 -1
  137. package/lib/internal/template/tabs/tab-header-bar.js +4 -2
  138. package/lib/internal/template/tabs/tab-header-bar.js.map +1 -1
  139. package/lib/internal/template/tiles/interfaces.d.ts +4 -0
  140. package/lib/internal/template/tiles/interfaces.d.ts.map +1 -1
  141. package/lib/internal/template/tiles/interfaces.js.map +1 -1
  142. package/lib/internal/template/tiles/internal.d.ts.map +1 -1
  143. package/lib/internal/template/tiles/internal.js +2 -2
  144. package/lib/internal/template/tiles/internal.js.map +1 -1
  145. package/lib/internal/template/top-navigation/interfaces.d.ts +2 -0
  146. package/lib/internal/template/top-navigation/interfaces.d.ts.map +1 -1
  147. package/lib/internal/template/top-navigation/interfaces.js.map +1 -1
  148. package/lib/internal/template/top-navigation/parts/overflow-menu/menu-item.d.ts +1 -0
  149. package/lib/internal/template/top-navigation/parts/overflow-menu/menu-item.d.ts.map +1 -1
  150. package/lib/internal/template/top-navigation/parts/overflow-menu/menu-item.js +2 -0
  151. package/lib/internal/template/top-navigation/parts/overflow-menu/menu-item.js.map +1 -1
  152. package/lib/internal/template/top-navigation/parts/overflow-menu/views/submenu.d.ts.map +1 -1
  153. package/lib/internal/template/top-navigation/parts/overflow-menu/views/submenu.js +1 -0
  154. package/lib/internal/template/top-navigation/parts/overflow-menu/views/submenu.js.map +1 -1
  155. package/lib/internal/template/top-navigation/parts/overflow-menu/views/utilities.d.ts.map +1 -1
  156. package/lib/internal/template/top-navigation/parts/overflow-menu/views/utilities.js +1 -1
  157. package/lib/internal/template/top-navigation/parts/overflow-menu/views/utilities.js.map +1 -1
  158. package/package.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"status-bar.js","sourceRoot":"lib/default/","sources":["code-editor/status-bar.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 styles from './styles.css.js';\nimport LiveRegion from '../internal/components/live-region/index';\nimport { TabButton } from './tab-button';\nimport { InternalButton } from '../button/internal';\nimport { useContainerQuery } from '../internal/hooks/container-queries/use-container-query';\nimport { CodeEditorProps } from './interfaces';\n\ninterface StatusBarProps {\n languageLabel: string;\n cursorPosition: string;\n paneStatus: string;\n isTabFocused: boolean;\n paneId?: string;\n i18nStrings: CodeEditorProps.I18nStrings;\n errorCount: number;\n warningCount: number;\n isRefresh: boolean;\n\n errorsTabRef?: React.RefObject<HTMLButtonElement>;\n warningsTabRef?: React.RefObject<HTMLButtonElement>;\n\n onErrorPaneToggle: () => void;\n onWarningPaneToggle: () => void;\n onTabFocus?: React.FocusEventHandler<HTMLButtonElement>;\n onTabBlur?: React.FocusEventHandler<HTMLButtonElement>;\n onPreferencesOpen: () => void;\n onHeightChange?: (height: number | null) => void;\n}\n\ntype InternalStatusBarProps = StatusBarProps & {\n leftBarRef: React.Ref<HTMLDivElement>;\n isVirtual: boolean;\n minifyCounters: boolean;\n};\n\nfunction InternalStatusBar({\n languageLabel,\n cursorPosition,\n paneStatus,\n onErrorPaneToggle,\n onWarningPaneToggle,\n onTabFocus,\n onTabBlur,\n errorsTabRef,\n warningsTabRef,\n isTabFocused,\n paneId,\n onPreferencesOpen,\n i18nStrings,\n errorCount,\n warningCount,\n leftBarRef,\n isVirtual,\n minifyCounters,\n isRefresh,\n}: InternalStatusBarProps) {\n const errorText = `${i18nStrings.errorsTab}: ${errorCount}`;\n const warningText = `${i18nStrings.warningsTab}: ${warningCount}`;\n\n // Virtual status bar is inaccessible for screen readers and keyboard interactions.\n\n return (\n <div\n className={clsx(styles['status-bar'], {\n [styles['status-bar-with-hidden-pane']]: paneStatus === 'hidden',\n [styles['status-bar-virtual']]: isVirtual,\n })}\n aria-hidden={isVirtual}\n >\n <div\n className={clsx(styles['status-bar__left'], {\n [styles['status-bar__left-virtual']]: isVirtual,\n })}\n ref={leftBarRef}\n >\n <span className={styles['status-bar__language-mode']}>{languageLabel}</span>\n <span className={styles['status-bar__cursor-position']}>{cursorPosition}</span>\n\n <div role=\"tablist\">\n <TabButton\n text={minifyCounters ? ` ${errorCount}` : errorText}\n className={styles['tab-button--errors']}\n iconName=\"status-negative\"\n disabled={errorCount === 0 || isVirtual}\n active={paneStatus === 'error'}\n onClick={onErrorPaneToggle}\n onFocus={onTabFocus}\n onBlur={onTabBlur}\n ref={errorsTabRef}\n ariaLabel={errorText}\n paneId={paneId}\n isRefresh={isRefresh}\n />\n <span className={styles['tab-button--divider']}></span>\n <TabButton\n text={minifyCounters ? ` ${warningCount}` : warningText}\n className={styles['tab-button--warnings']}\n iconName=\"status-warning\"\n disabled={warningCount === 0 || isVirtual}\n active={paneStatus === 'warning'}\n onClick={onWarningPaneToggle}\n onFocus={onTabFocus}\n onBlur={onTabBlur}\n ref={warningsTabRef}\n tabIndex={paneStatus === 'error' && isTabFocused ? -1 : undefined}\n ariaHidden={paneStatus === 'error' && isTabFocused ? true : undefined}\n ariaLabel={warningText}\n paneId={paneId}\n isRefresh={isRefresh}\n />\n </div>\n <LiveRegion assertive={true}>\n <span>{errorText} </span>\n <span>{warningText}</span>\n </LiveRegion>\n </div>\n\n <div className={styles['status-bar__right']}>\n <div className={styles['status-bar__cog-button']}>\n <InternalButton\n disabled={isVirtual}\n formAction=\"none\"\n variant=\"icon\"\n iconName=\"settings\"\n iconAlt=\"Settings\"\n ariaLabel={i18nStrings.preferencesButtonAriaLabel}\n onClick={onPreferencesOpen}\n __nativeAttributes={{\n tabIndex: paneStatus !== 'hidden' && isTabFocused ? -1 : undefined,\n 'aria-hidden': paneStatus !== 'hidden' && isTabFocused ? true : undefined,\n }}\n />\n </div>\n </div>\n </div>\n );\n}\n\nexport const StatusBar = ({ errorsTabRef, warningsTabRef, ...restProps }: StatusBarProps) => {\n // create a virtual status bar, in order to calculate the width with full tab button text\n // and decide if tab button text needs to be reduced\n const [realWidth, statusLeftBarRef] = useContainerQuery(rect => rect.width);\n const [virtualWidth, virtualStatusLeftBarRef] = useContainerQuery(rect => rect.width);\n\n const minifyCounters = virtualWidth !== null && realWidth !== null && virtualWidth > realWidth;\n\n return (\n <>\n <InternalStatusBar\n {...restProps}\n isVirtual={false}\n leftBarRef={statusLeftBarRef}\n errorsTabRef={errorsTabRef}\n warningsTabRef={warningsTabRef}\n minifyCounters={minifyCounters}\n />\n <InternalStatusBar {...restProps} isVirtual={true} leftBarRef={virtualStatusLeftBarRef} minifyCounters={false} />\n </>\n );\n};\n"]}
1
+ {"version":3,"file":"status-bar.js","sourceRoot":"lib/default/","sources":["code-editor/status-bar.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 styles from './styles.css.js';\nimport LiveRegion from '../internal/components/live-region/index';\nimport { TabButton } from './tab-button';\nimport { InternalButton } from '../button/internal';\nimport { useContainerQuery } from '../internal/hooks/container-queries/use-container-query';\nimport { CodeEditorProps } from './interfaces';\nimport { useInternalI18n } from '../internal/i18n/context.js';\n\ninterface StatusBarProps {\n languageLabel: string;\n cursorPosition?: string;\n paneStatus: string;\n isTabFocused: boolean;\n paneId?: string;\n i18nStrings?: CodeEditorProps.I18nStrings;\n errorCount: number;\n warningCount: number;\n isRefresh: boolean;\n\n errorsTabRef?: React.RefObject<HTMLButtonElement>;\n warningsTabRef?: React.RefObject<HTMLButtonElement>;\n\n onErrorPaneToggle: () => void;\n onWarningPaneToggle: () => void;\n onTabFocus?: React.FocusEventHandler<HTMLButtonElement>;\n onTabBlur?: React.FocusEventHandler<HTMLButtonElement>;\n onPreferencesOpen: () => void;\n onHeightChange?: (height: number | null) => void;\n}\n\ntype InternalStatusBarProps = StatusBarProps & {\n leftBarRef: React.Ref<HTMLDivElement>;\n isVirtual: boolean;\n minifyCounters: boolean;\n};\n\nfunction InternalStatusBar({\n languageLabel,\n cursorPosition,\n paneStatus,\n onErrorPaneToggle,\n onWarningPaneToggle,\n onTabFocus,\n onTabBlur,\n errorsTabRef,\n warningsTabRef,\n isTabFocused,\n paneId,\n onPreferencesOpen,\n i18nStrings,\n errorCount,\n warningCount,\n leftBarRef,\n isVirtual,\n minifyCounters,\n isRefresh,\n}: InternalStatusBarProps) {\n const i18n = useInternalI18n('code-editor');\n const errorText = `${i18n('i18nStrings.errorsTab', i18nStrings?.errorsTab)}: ${errorCount}`;\n const warningText = `${i18n('i18nStrings.warningsTab', i18nStrings?.warningsTab)}: ${warningCount}`;\n\n // Virtual status bar is inaccessible for screen readers and keyboard interactions.\n\n return (\n <div\n className={clsx(styles['status-bar'], {\n [styles['status-bar-with-hidden-pane']]: paneStatus === 'hidden',\n [styles['status-bar-virtual']]: isVirtual,\n })}\n aria-hidden={isVirtual}\n >\n <div\n className={clsx(styles['status-bar__left'], {\n [styles['status-bar__left-virtual']]: isVirtual,\n })}\n ref={leftBarRef}\n >\n <span className={styles['status-bar__language-mode']}>{languageLabel}</span>\n <span className={styles['status-bar__cursor-position']}>{cursorPosition}</span>\n\n <div role=\"tablist\">\n <TabButton\n text={minifyCounters ? ` ${errorCount}` : errorText}\n className={styles['tab-button--errors']}\n iconName=\"status-negative\"\n disabled={errorCount === 0 || isVirtual}\n active={paneStatus === 'error'}\n onClick={onErrorPaneToggle}\n onFocus={onTabFocus}\n onBlur={onTabBlur}\n ref={errorsTabRef}\n ariaLabel={errorText}\n paneId={paneId}\n isRefresh={isRefresh}\n />\n <span className={styles['tab-button--divider']}></span>\n <TabButton\n text={minifyCounters ? ` ${warningCount}` : warningText}\n className={styles['tab-button--warnings']}\n iconName=\"status-warning\"\n disabled={warningCount === 0 || isVirtual}\n active={paneStatus === 'warning'}\n onClick={onWarningPaneToggle}\n onFocus={onTabFocus}\n onBlur={onTabBlur}\n ref={warningsTabRef}\n tabIndex={paneStatus === 'error' && isTabFocused ? -1 : undefined}\n ariaHidden={paneStatus === 'error' && isTabFocused ? true : undefined}\n ariaLabel={warningText}\n paneId={paneId}\n isRefresh={isRefresh}\n />\n </div>\n <LiveRegion assertive={true}>\n <span>{errorText} </span>\n <span>{warningText}</span>\n </LiveRegion>\n </div>\n\n <div className={styles['status-bar__right']}>\n <div className={styles['status-bar__cog-button']}>\n <InternalButton\n disabled={isVirtual}\n formAction=\"none\"\n variant=\"icon\"\n iconName=\"settings\"\n iconAlt=\"Settings\"\n ariaLabel={i18n('i18nStrings.preferencesButtonAriaLabel', i18nStrings?.preferencesButtonAriaLabel)}\n onClick={onPreferencesOpen}\n __nativeAttributes={{\n tabIndex: paneStatus !== 'hidden' && isTabFocused ? -1 : undefined,\n 'aria-hidden': paneStatus !== 'hidden' && isTabFocused ? true : undefined,\n }}\n />\n </div>\n </div>\n </div>\n );\n}\n\nexport const StatusBar = ({ errorsTabRef, warningsTabRef, ...restProps }: StatusBarProps) => {\n // create a virtual status bar, in order to calculate the width with full tab button text\n // and decide if tab button text needs to be reduced\n const [realWidth, statusLeftBarRef] = useContainerQuery(rect => rect.width);\n const [virtualWidth, virtualStatusLeftBarRef] = useContainerQuery(rect => rect.width);\n\n const minifyCounters = virtualWidth !== null && realWidth !== null && virtualWidth > realWidth;\n\n return (\n <>\n <InternalStatusBar\n {...restProps}\n isVirtual={false}\n leftBarRef={statusLeftBarRef}\n errorsTabRef={errorsTabRef}\n warningsTabRef={warningsTabRef}\n minifyCounters={minifyCounters}\n />\n <InternalStatusBar {...restProps} isVirtual={true} leftBarRef={virtualStatusLeftBarRef} minifyCounters={false} />\n </>\n );\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["container/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAK9C,OAAO,EAAE,cAAc,EAAE,CAAC;AAE1B,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,OAAmB,EACnB,qBAA6B,EAC7B,sBAA8B,EAC9B,GAAG,KAAK,EACT,EAAE,cAAc,eAYhB"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["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,GAAG,KAAK,EACT,EAAE,cAAc,eAchB"}
@@ -6,11 +6,13 @@ import InternalContainer from './internal';
6
6
  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
+ import { AnalyticsFunnelSubStep } from '../internal/analytics/components/analytics-funnel';
9
10
  export default function Container(_a) {
10
11
  var { variant = 'default', disableHeaderPaddings = false, disableContentPaddings = false } = _a, props = __rest(_a, ["variant", "disableHeaderPaddings", "disableContentPaddings"]);
11
12
  const baseComponentProps = useBaseComponent('Container');
12
13
  const externalProps = getExternalProps(props);
13
- return (React.createElement(InternalContainer, Object.assign({ variant: variant, disableHeaderPaddings: disableHeaderPaddings, disableContentPaddings: disableContentPaddings }, externalProps, baseComponentProps)));
14
+ return (React.createElement(AnalyticsFunnelSubStep, null,
15
+ React.createElement(InternalContainer, Object.assign({ variant: variant, disableHeaderPaddings: disableHeaderPaddings, disableContentPaddings: disableContentPaddings }, externalProps, baseComponentProps))));
14
16
  }
15
17
  applyDisplayName(Container, 'Container');
16
18
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["container/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,iBAAiB,MAAM,YAAY,CAAC;AAE3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAIpE,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAKjB;QALiB,EAChC,OAAO,GAAG,SAAS,EACnB,qBAAqB,GAAG,KAAK,EAC7B,sBAAsB,GAAG,KAAK,OAEf,EADZ,KAAK,cAJwB,8DAKjC,CADS;IAER,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAC;IACzD,MAAM,aAAa,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAC;IAC9C,OAAO,CACL,oBAAC,iBAAiB,kBAChB,OAAO,EAAE,OAAO,EAChB,qBAAqB,EAAE,qBAAqB,EAC5C,sBAAsB,EAAE,sBAAsB,IAC1C,aAAa,EACb,kBAAkB,EACtB,CACH,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 InternalContainer 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';\n\nexport { ContainerProps };\n\nexport default function Container({\n variant = 'default',\n disableHeaderPaddings = false,\n disableContentPaddings = false,\n ...props\n}: ContainerProps) {\n const baseComponentProps = useBaseComponent('Container');\n const externalProps = getExternalProps(props);\n return (\n <InternalContainer\n variant={variant}\n disableHeaderPaddings={disableHeaderPaddings}\n disableContentPaddings={disableContentPaddings}\n {...externalProps}\n {...baseComponentProps}\n />\n );\n}\n\napplyDisplayName(Container, 'Container');\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["container/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,iBAAiB,MAAM,YAAY,CAAC;AAE3C,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,EAKjB;QALiB,EAChC,OAAO,GAAG,SAAS,EACnB,qBAAqB,GAAG,KAAK,EAC7B,sBAAsB,GAAG,KAAK,OAEf,EADZ,KAAK,cAJwB,8DAKjC,CADS;IAER,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAC;IACzD,MAAM,aAAa,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAC;IAC9C,OAAO,CACL,oBAAC,sBAAsB;QACrB,oBAAC,iBAAiB,kBAChB,OAAO,EAAE,OAAO,EAChB,qBAAqB,EAAE,qBAAqB,EAC5C,sBAAsB,EAAE,sBAAsB,IAC1C,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 InternalContainer 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 ...props\n}: ContainerProps) {\n const baseComponentProps = useBaseComponent('Container');\n const externalProps = getExternalProps(props);\n return (\n <AnalyticsFunnelSubStep>\n <InternalContainer\n variant={variant}\n disableHeaderPaddings={disableHeaderPaddings}\n disableContentPaddings={disableContentPaddings}\n {...externalProps}\n {...baseComponentProps}\n />\n </AnalyticsFunnelSubStep>\n );\n}\n\napplyDisplayName(Container, 'Container');\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["container/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA4B,MAAM,OAAO,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAG9C,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAQlF,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC,EAAE,0BAA0B;IACzG,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC9C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,GAAG,UAAU,GAAG,WAAW,GAAG,OAAO,CAAC;CAC1E;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAmB,EACnB,qBAA6B,EAC7B,sBAA8B,EAC9B,SAAS,EACT,cAAc,EACd,oBAAoB,EACpB,cAAsB,EACtB,iBAAwB,EACxB,sBAA8B,EAC9B,uBAA+B,EAC/B,eAAuB,EACvB,WAAW,EACX,UAAU,EACV,YAAoB,EACpB,qBAA4B,EAC5B,GAAG,SAAS,EACb,EAAE,sBAAsB,eAmGxB"}
1
+ {"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["container/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA4B,MAAM,OAAO,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAG9C,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AASlF,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC,EAAE,0BAA0B;IACzG,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC9C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,GAAG,UAAU,GAAG,WAAW,GAAG,OAAO,CAAC;CAC1E;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAmB,EACnB,qBAA6B,EAC7B,sBAA8B,EAC9B,SAAS,EACT,cAAc,EACd,oBAAoB,EACpB,cAAsB,EACtB,iBAAwB,EACxB,sBAA8B,EAC9B,uBAA+B,EAC/B,eAAuB,EACvB,WAAW,EACX,UAAU,EACV,YAAoB,EACpB,qBAA4B,EAC5B,GAAG,SAAS,EACb,EAAE,sBAAsB,eAqGxB"}
@@ -11,6 +11,7 @@ import { useMergeRefs } from '../internal/hooks/use-merge-refs';
11
11
  import { useMobile } from '../internal/hooks/use-mobile';
12
12
  import { useVisualRefresh } from '../internal/hooks/use-visual-mode';
13
13
  import styles from './styles.css.js';
14
+ import { useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';
14
15
  export default function InternalContainer(_a) {
15
16
  var { header, footer, children, variant = 'default', disableHeaderPaddings = false, disableContentPaddings = false, fitHeight, __stickyOffset, __mobileStickyOffset, __stickyHeader = false, __internalRootRef = null, __disableFooterDivider = false, __disableFooterPaddings = false, __hiddenContent = false, __headerRef, __headerId, __darkHeader = false, __disableStickyMobile = true } = _a, restProps = __rest(_a, ["header", "footer", "children", "variant", "disableHeaderPaddings", "disableContentPaddings", "fitHeight", "__stickyOffset", "__mobileStickyOffset", "__stickyHeader", "__internalRootRef", "__disableFooterDivider", "__disableFooterPaddings", "__hiddenContent", "__headerRef", "__headerId", "__darkHeader", "__disableStickyMobile"]);
16
17
  const isMobile = useMobile();
@@ -20,9 +21,10 @@ export default function InternalContainer(_a) {
20
21
  const { isSticky, isStuck, stickyStyles } = useStickyHeader(rootRef, headerRef, __stickyHeader, __stickyOffset, __mobileStickyOffset, __disableStickyMobile);
21
22
  const { setHasStickyBackground } = useAppLayoutContext();
22
23
  const isRefresh = useVisualRefresh();
24
+ const { subStepRef, funnelSubStepProps } = useFunnelSubStep();
23
25
  const hasDynamicHeight = isRefresh && variant === 'full-page';
24
26
  const overlapElement = useDynamicOverlap({ disabled: !hasDynamicHeight || !__darkHeader });
25
- const mergedRef = useMergeRefs(rootRef, __internalRootRef);
27
+ const mergedRef = useMergeRefs(rootRef, subStepRef, __internalRootRef);
26
28
  const headerMergedRef = useMergeRefs(headerRef, overlapElement, __headerRef);
27
29
  const headerIdProp = __headerId ? { id: __headerId } : {};
28
30
  /**
@@ -44,7 +46,7 @@ export default function InternalContainer(_a) {
44
46
  // The container is only sticky on mobile if it is the header for the table.
45
47
  // In this case we don't want the container to have sticky styles, as only the table header row will show as stuck on scroll.
46
48
  const shouldHaveStickyStyles = isSticky && !isMobile;
47
- return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.root, styles[`variant-${variant}`], fitHeight && styles['fit-height'], shouldHaveStickyStyles && [styles['sticky-enabled']]), ref: mergedRef }),
49
+ return (React.createElement("div", Object.assign({}, baseProps, funnelSubStepProps, { className: clsx(baseProps.className, styles.root, styles[`variant-${variant}`], fitHeight && styles['fit-height'], shouldHaveStickyStyles && [styles['sticky-enabled']]), ref: mergedRef }),
48
50
  header && (React.createElement(StickyHeaderContext.Provider, { value: { isStuck } },
49
51
  React.createElement("div", Object.assign({ className: clsx(styles.header, styles[`header-variant-${variant}`], {
50
52
  [styles['header-sticky-disabled']]: __stickyHeader && !isSticky,
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["container/internal.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 clsx from 'clsx';\nimport React, { useEffect, useRef } from 'react';\nimport { ContainerProps } from './interfaces';\nimport { getBaseProps } from '../internal/base-component';\nimport { useAppLayoutContext } from '../internal/context/app-layout-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { StickyHeaderContext, useStickyHeader } from './use-sticky-header';\nimport { useDynamicOverlap } from '../internal/hooks/use-dynamic-overlap';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport styles from './styles.css.js';\n\nexport interface InternalContainerProps extends Omit<ContainerProps, 'variant'>, InternalBaseComponentProps {\n __stickyHeader?: boolean;\n __stickyOffset?: number;\n __mobileStickyOffset?: number;\n __disableFooterDivider?: boolean;\n __disableFooterPaddings?: boolean;\n __hiddenContent?: boolean;\n __headerRef?: React.RefObject<HTMLDivElement>;\n __headerId?: string;\n __darkHeader?: boolean;\n __disableStickyMobile?: boolean;\n /**\n * Additional internal variant:\n * * `embedded` - Use this variant within a parent container (such as a modal,\n * expandable section, container or split panel).\n * * `full-page` – Only for internal use in table, cards and other components\n */\n variant?: ContainerProps['variant'] | 'embedded' | 'full-page' | 'cards';\n}\n\nexport default function InternalContainer({\n header,\n footer,\n children,\n variant = 'default',\n disableHeaderPaddings = false,\n disableContentPaddings = false,\n fitHeight,\n __stickyOffset,\n __mobileStickyOffset,\n __stickyHeader = false,\n __internalRootRef = null,\n __disableFooterDivider = false,\n __disableFooterPaddings = false,\n __hiddenContent = false,\n __headerRef,\n __headerId,\n __darkHeader = false,\n __disableStickyMobile = true,\n ...restProps\n}: InternalContainerProps) {\n const isMobile = useMobile();\n const baseProps = getBaseProps(restProps);\n const rootRef = useRef<HTMLDivElement>(null);\n const headerRef = useRef<HTMLDivElement>(null);\n const { isSticky, isStuck, stickyStyles } = useStickyHeader(\n rootRef,\n headerRef,\n __stickyHeader,\n __stickyOffset,\n __mobileStickyOffset,\n __disableStickyMobile\n );\n const { setHasStickyBackground } = useAppLayoutContext();\n const isRefresh = useVisualRefresh();\n\n const hasDynamicHeight = isRefresh && variant === 'full-page';\n const overlapElement = useDynamicOverlap({ disabled: !hasDynamicHeight || !__darkHeader });\n\n const mergedRef = useMergeRefs(rootRef, __internalRootRef);\n const headerMergedRef = useMergeRefs(headerRef, overlapElement, __headerRef);\n const headerIdProp = __headerId ? { id: __headerId } : {};\n\n /**\n * The visual refresh AppLayout component needs to know if a child component\n * has a high contrast sticky header. This is to make sure the background element\n * stays in the same vertical position as the header content.\n */\n useEffect(() => {\n const shouldUpdateStickyBackground = isSticky && variant === 'full-page' && setHasStickyBackground;\n if (shouldUpdateStickyBackground) {\n setHasStickyBackground(true);\n }\n\n return () => {\n if (shouldUpdateStickyBackground) {\n setHasStickyBackground(false);\n }\n };\n }, [isSticky, setHasStickyBackground, variant]);\n\n // The container is only sticky on mobile if it is the header for the table.\n // In this case we don't want the container to have sticky styles, as only the table header row will show as stuck on scroll.\n const shouldHaveStickyStyles = isSticky && !isMobile;\n\n return (\n <div\n {...baseProps}\n className={clsx(\n baseProps.className,\n styles.root,\n styles[`variant-${variant}`],\n fitHeight && styles['fit-height'],\n shouldHaveStickyStyles && [styles['sticky-enabled']]\n )}\n ref={mergedRef}\n >\n {header && (\n <StickyHeaderContext.Provider value={{ isStuck }}>\n <div\n className={clsx(styles.header, styles[`header-variant-${variant}`], {\n [styles['header-sticky-disabled']]: __stickyHeader && !isSticky,\n [styles['header-sticky-enabled']]: isSticky,\n [styles['header-dynamic-height']]: hasDynamicHeight,\n [styles['header-stuck']]: isStuck,\n [styles['with-paddings']]: !disableHeaderPaddings,\n [styles['with-hidden-content']]: !children || __hiddenContent,\n })}\n {...headerIdProp}\n {...stickyStyles}\n ref={headerMergedRef}\n >\n {__darkHeader ? (\n <div className={clsx(styles['dark-header'], 'awsui-context-content-header')}>{header}</div>\n ) : (\n header\n )}\n </div>\n </StickyHeaderContext.Provider>\n )}\n <div\n className={clsx(styles.content, {\n [styles['with-paddings']]: !disableContentPaddings,\n })}\n >\n {children}\n </div>\n {footer && (\n <div\n className={clsx(styles.footer, {\n [styles['with-divider']]: !__disableFooterDivider,\n [styles['with-paddings']]: !__disableFooterPaddings,\n })}\n >\n {footer}\n </div>\n )}\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["container/internal.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 clsx from 'clsx';\nimport React, { useEffect, useRef } from 'react';\nimport { ContainerProps } from './interfaces';\nimport { getBaseProps } from '../internal/base-component';\nimport { useAppLayoutContext } from '../internal/context/app-layout-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { StickyHeaderContext, useStickyHeader } from './use-sticky-header';\nimport { useDynamicOverlap } from '../internal/hooks/use-dynamic-overlap';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport styles from './styles.css.js';\nimport { useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\n\nexport interface InternalContainerProps extends Omit<ContainerProps, 'variant'>, InternalBaseComponentProps {\n __stickyHeader?: boolean;\n __stickyOffset?: number;\n __mobileStickyOffset?: number;\n __disableFooterDivider?: boolean;\n __disableFooterPaddings?: boolean;\n __hiddenContent?: boolean;\n __headerRef?: React.RefObject<HTMLDivElement>;\n __headerId?: string;\n __darkHeader?: boolean;\n __disableStickyMobile?: boolean;\n /**\n * Additional internal variant:\n * * `embedded` - Use this variant within a parent container (such as a modal,\n * expandable section, container or split panel).\n * * `full-page` – Only for internal use in table, cards and other components\n */\n variant?: ContainerProps['variant'] | 'embedded' | 'full-page' | 'cards';\n}\n\nexport default function InternalContainer({\n header,\n footer,\n children,\n variant = 'default',\n disableHeaderPaddings = false,\n disableContentPaddings = false,\n fitHeight,\n __stickyOffset,\n __mobileStickyOffset,\n __stickyHeader = false,\n __internalRootRef = null,\n __disableFooterDivider = false,\n __disableFooterPaddings = false,\n __hiddenContent = false,\n __headerRef,\n __headerId,\n __darkHeader = false,\n __disableStickyMobile = true,\n ...restProps\n}: InternalContainerProps) {\n const isMobile = useMobile();\n const baseProps = getBaseProps(restProps);\n const rootRef = useRef<HTMLDivElement>(null);\n const headerRef = useRef<HTMLDivElement>(null);\n const { isSticky, isStuck, stickyStyles } = useStickyHeader(\n rootRef,\n headerRef,\n __stickyHeader,\n __stickyOffset,\n __mobileStickyOffset,\n __disableStickyMobile\n );\n const { setHasStickyBackground } = useAppLayoutContext();\n const isRefresh = useVisualRefresh();\n const { subStepRef, funnelSubStepProps } = useFunnelSubStep();\n\n const hasDynamicHeight = isRefresh && variant === 'full-page';\n const overlapElement = useDynamicOverlap({ disabled: !hasDynamicHeight || !__darkHeader });\n\n const mergedRef = useMergeRefs(rootRef, subStepRef, __internalRootRef);\n const headerMergedRef = useMergeRefs(headerRef, overlapElement, __headerRef);\n const headerIdProp = __headerId ? { id: __headerId } : {};\n\n /**\n * The visual refresh AppLayout component needs to know if a child component\n * has a high contrast sticky header. This is to make sure the background element\n * stays in the same vertical position as the header content.\n */\n useEffect(() => {\n const shouldUpdateStickyBackground = isSticky && variant === 'full-page' && setHasStickyBackground;\n if (shouldUpdateStickyBackground) {\n setHasStickyBackground(true);\n }\n\n return () => {\n if (shouldUpdateStickyBackground) {\n setHasStickyBackground(false);\n }\n };\n }, [isSticky, setHasStickyBackground, variant]);\n\n // The container is only sticky on mobile if it is the header for the table.\n // In this case we don't want the container to have sticky styles, as only the table header row will show as stuck on scroll.\n const shouldHaveStickyStyles = isSticky && !isMobile;\n\n return (\n <div\n {...baseProps}\n {...funnelSubStepProps}\n className={clsx(\n baseProps.className,\n styles.root,\n styles[`variant-${variant}`],\n fitHeight && styles['fit-height'],\n shouldHaveStickyStyles && [styles['sticky-enabled']]\n )}\n ref={mergedRef}\n >\n {header && (\n <StickyHeaderContext.Provider value={{ isStuck }}>\n <div\n className={clsx(styles.header, styles[`header-variant-${variant}`], {\n [styles['header-sticky-disabled']]: __stickyHeader && !isSticky,\n [styles['header-sticky-enabled']]: isSticky,\n [styles['header-dynamic-height']]: hasDynamicHeight,\n [styles['header-stuck']]: isStuck,\n [styles['with-paddings']]: !disableHeaderPaddings,\n [styles['with-hidden-content']]: !children || __hiddenContent,\n })}\n {...headerIdProp}\n {...stickyStyles}\n ref={headerMergedRef}\n >\n {__darkHeader ? (\n <div className={clsx(styles['dark-header'], 'awsui-context-content-header')}>{header}</div>\n ) : (\n header\n )}\n </div>\n </StickyHeaderContext.Provider>\n )}\n <div\n className={clsx(styles.content, {\n [styles['with-paddings']]: !disableContentPaddings,\n })}\n >\n {children}\n </div>\n {footer && (\n <div\n className={clsx(styles.footer, {\n [styles['with-divider']]: !__disableFooterDivider,\n [styles['with-paddings']]: !__disableFooterPaddings,\n })}\n >\n {footer}\n </div>\n )}\n </div>\n );\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["form/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAIzC,OAAO,EAAE,SAAS,EAAE,CAAC;AAErB,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAAE,OAAqB,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,eAG1E"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["form/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAOzC,OAAO,EAAE,SAAS,EAAE,CAAC;AAErB,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAAE,OAAqB,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,eAU1E"}
@@ -5,10 +5,14 @@ import React from 'react';
5
5
  import { applyDisplayName } from '../internal/utils/apply-display-name';
6
6
  import InternalForm from './internal';
7
7
  import useBaseComponent from '../internal/hooks/use-base-component';
8
+ import { AnalyticsFunnel, AnalyticsFunnelStep } from '../internal/analytics/components/analytics-funnel';
9
+ import { getFunnelNameSelector } from '../internal/analytics/selectors';
8
10
  export default function Form(_a) {
9
11
  var { variant = 'full-page' } = _a, props = __rest(_a, ["variant"]);
10
12
  const baseComponentProps = useBaseComponent('Form');
11
- return React.createElement(InternalForm, Object.assign({ variant: variant }, props, baseComponentProps));
13
+ return (React.createElement(AnalyticsFunnel, { funnelType: "single-page", optionalStepNumbers: [], totalFunnelSteps: 1 },
14
+ React.createElement(AnalyticsFunnelStep, { stepNumber: 1, stepNameSelector: getFunnelNameSelector() },
15
+ React.createElement(InternalForm, Object.assign({ variant: variant }, props, baseComponentProps)))));
12
16
  }
13
17
  applyDisplayName(Form, 'Form');
14
18
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["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;AAIpE,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,CAAC,CAAC;IACpD,OAAO,oBAAC,YAAY,kBAAC,OAAO,EAAE,OAAO,IAAM,KAAK,EAAM,kBAAkB,EAAI,CAAC;AAC/E,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\nexport { FormProps };\n\nexport default function Form({ variant = 'full-page', ...props }: FormProps) {\n const baseComponentProps = useBaseComponent('Form');\n return <InternalForm variant={variant} {...props} {...baseComponentProps} />;\n}\n\napplyDisplayName(Form, 'Form');\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["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,qBAAqB,EAAE,MAAM,iCAAiC,CAAC;AAIxE,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,CAAC,CAAC;IAEpD,OAAO,CACL,oBAAC,eAAe,IAAC,UAAU,EAAC,aAAa,EAAC,mBAAmB,EAAE,EAAE,EAAE,gBAAgB,EAAE,CAAC;QACpF,oBAAC,mBAAmB,IAAC,UAAU,EAAE,CAAC,EAAE,gBAAgB,EAAE,qBAAqB,EAAE;YAC3E,oBAAC,YAAY,kBAAC,OAAO,EAAE,OAAO,IAAM,KAAK,EAAM,kBAAkB,EAAI,CACjD,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 { getFunnelNameSelector } from '../internal/analytics/selectors';\n\nexport { FormProps };\n\nexport default function Form({ variant = 'full-page', ...props }: FormProps) {\n const baseComponentProps = useBaseComponent('Form');\n\n return (\n <AnalyticsFunnel funnelType=\"single-page\" optionalStepNumbers={[]} totalFunnelSteps={1}>\n <AnalyticsFunnelStep stepNumber={1} stepNameSelector={getFunnelNameSelector()}>\n <InternalForm variant={variant} {...props} {...baseComponentProps} />\n </AnalyticsFunnelStep>\n </AnalyticsFunnel>\n );\n}\n\napplyDisplayName(Form, 'Form');\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["form/internal.tsx"],"names":[],"mappings":";AASA,OAAO,EAAmB,SAAS,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAIlF,KAAK,iBAAiB,GAAG,SAAS,GAAG,0BAA0B,CAAC;AAEhE,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,QAAQ,EACR,MAAM,EACN,SAAS,EACT,kBAAkB,EAAE,0BAA0B,EAC9C,OAAO,EACP,gBAAgB,EAChB,OAAO,EACP,iBAAiB,EACjB,GAAG,KAAK,EACT,EAAE,iBAAiB,eAqCnB"}
1
+ {"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["form/internal.tsx"],"names":[],"mappings":";AASA,OAAO,EAAmB,SAAS,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAOlF,KAAK,iBAAiB,GAAG,SAAS,GAAG,0BAA0B,CAAC;AAEhE,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,QAAQ,EACR,MAAM,EACN,SAAS,EACT,kBAAkB,EAAE,0BAA0B,EAC9C,OAAO,EACP,gBAAgB,EAChB,OAAO,EACP,iBAAiB,EACjB,GAAG,KAAK,EACT,EAAE,iBAAiB,eAmDnB"}
@@ -1,7 +1,7 @@
1
1
  import { __rest } from "tslib";
2
2
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
3
3
  // SPDX-License-Identifier: Apache-2.0
4
- import React from 'react';
4
+ import React, { useEffect } from 'react';
5
5
  import clsx from 'clsx';
6
6
  import { getBaseProps } from '../internal/base-component';
7
7
  import InternalAlert from '../alert/internal';
@@ -10,12 +10,21 @@ import InternalContentLayout from '../content-layout/internal';
10
10
  import styles from './styles.css.js';
11
11
  import LiveRegion from '../internal/components/live-region';
12
12
  import { useInternalI18n } from '../internal/i18n/context';
13
+ import { FunnelMetrics } from '../internal/analytics';
14
+ import { useFunnel, useFunnelStep } from '../internal/analytics/hooks/use-funnel';
13
15
  export default function InternalForm(_a) {
14
16
  var { children, header, errorText, errorIconAriaLabel: errorIconAriaLabelOverride, actions, secondaryActions, variant, __internalRootRef } = _a, props = __rest(_a, ["children", "header", "errorText", "errorIconAriaLabel", "actions", "secondaryActions", "variant", "__internalRootRef"]);
15
17
  const baseProps = getBaseProps(props);
16
18
  const i18n = useInternalI18n('form');
17
19
  const errorIconAriaLabel = i18n('errorIconAriaLabel', errorIconAriaLabelOverride);
18
- return (React.createElement("div", Object.assign({}, baseProps, { ref: __internalRootRef, className: clsx(styles.root, baseProps.className) }),
20
+ const { funnelInteractionId, funnelProps } = useFunnel();
21
+ const { funnelStepProps } = useFunnelStep();
22
+ useEffect(() => {
23
+ if (funnelInteractionId && errorText) {
24
+ FunnelMetrics.funnelError({ funnelInteractionId });
25
+ }
26
+ }, [funnelInteractionId, errorText]);
27
+ return (React.createElement("div", Object.assign({}, baseProps, funnelProps, funnelStepProps, { ref: __internalRootRef, className: clsx(styles.root, baseProps.className) }),
19
28
  React.createElement(FormLayout, { header: header && React.createElement("div", { className: clsx(styles.header, variant === 'full-page' && styles['full-page']) }, header), variant: variant },
20
29
  children && React.createElement("div", { className: styles.content }, children),
21
30
  errorText && (React.createElement(InternalBox, { margin: { top: 'l' } },
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["form/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,aAAa,MAAM,mBAAmB,CAAC;AAC9C,OAAO,WAAW,MAAM,iBAAiB,CAAC;AAC1C,OAAO,qBAAqB,MAAM,4BAA4B,CAAC;AAC/D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAGrC,OAAO,UAAU,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAI3D,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAUjB;QAViB,EACnC,QAAQ,EACR,MAAM,EACN,SAAS,EACT,kBAAkB,EAAE,0BAA0B,EAC9C,OAAO,EACP,gBAAgB,EAChB,OAAO,EACP,iBAAiB,OAEC,EADf,KAAK,cAT2B,wHAUpC,CADS;IAER,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IACtC,MAAM,IAAI,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC;IACrC,MAAM,kBAAkB,GAAG,IAAI,CAAC,oBAAoB,EAAE,0BAA0B,CAAC,CAAC;IAElF,OAAO,CACL,6CAAS,SAAS,IAAE,GAAG,EAAE,iBAAiB,EAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,SAAS,CAAC;QAC3F,oBAAC,UAAU,IACT,MAAM,EACJ,MAAM,IAAI,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,KAAK,WAAW,IAAI,MAAM,CAAC,WAAW,CAAC,CAAC,IAAG,MAAM,CAAO,EAE/G,OAAO,EAAE,OAAO;YAEf,QAAQ,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,QAAQ,CAAO;YAC5D,SAAS,IAAI,CACZ,oBAAC,WAAW,IAAC,MAAM,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE;gBAC/B,oBAAC,aAAa,IAAC,IAAI,EAAC,OAAO,EAAC,mBAAmB,EAAE,kBAAkB;oBACjE,6BAAK,SAAS,EAAE,MAAM,CAAC,KAAK,IAAG,SAAS,CAAO,CACjC,CACJ,CACf;YACA,CAAC,OAAO,IAAI,gBAAgB,CAAC,IAAI,CAChC,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM;gBAC3B,6BAAK,SAAS,EAAE,MAAM,CAAC,iBAAiB,CAAC;oBACtC,OAAO,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,OAAO,CAAO;oBAC1D,gBAAgB,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,mBAAmB,CAAC,IAAG,gBAAgB,CAAO,CACtF,CACF,CACP;YACA,SAAS,IAAI,CACZ,oBAAC,UAAU,IAAC,SAAS,EAAE,IAAI;gBACxB,kBAAkB;;gBAAI,SAAS,CACrB,CACd,CACU,CACT,CACP,CAAC;AACJ,CAAC;AAED,SAAS,UAAU,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAmB;IAChE,OAAO,OAAO,KAAK,WAAW,IAAI,MAAM,CAAC,CAAC,CAAC,CACzC,oBAAC,qBAAqB,IAAC,MAAM,EAAE,MAAM,IAAG,QAAQ,CAAyB,CAC1E,CAAC,CAAC,CAAC,CACF;QACG,MAAM;QACN,QAAQ,CACR,CACJ,CAAC;AACJ,CAAC","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 { getBaseProps } from '../internal/base-component';\nimport InternalAlert from '../alert/internal';\nimport InternalBox from '../box/internal';\nimport InternalContentLayout from '../content-layout/internal';\nimport styles from './styles.css.js';\nimport { FormLayoutProps, FormProps } from './interfaces';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport LiveRegion from '../internal/components/live-region';\nimport { useInternalI18n } from '../internal/i18n/context';\n\ntype InternalFormProps = FormProps & InternalBaseComponentProps;\n\nexport default function InternalForm({\n children,\n header,\n errorText,\n errorIconAriaLabel: errorIconAriaLabelOverride,\n actions,\n secondaryActions,\n variant,\n __internalRootRef,\n ...props\n}: InternalFormProps) {\n const baseProps = getBaseProps(props);\n const i18n = useInternalI18n('form');\n const errorIconAriaLabel = i18n('errorIconAriaLabel', errorIconAriaLabelOverride);\n\n return (\n <div {...baseProps} ref={__internalRootRef} className={clsx(styles.root, baseProps.className)}>\n <FormLayout\n header={\n header && <div className={clsx(styles.header, variant === 'full-page' && styles['full-page'])}>{header}</div>\n }\n variant={variant}\n >\n {children && <div className={styles.content}>{children}</div>}\n {errorText && (\n <InternalBox margin={{ top: 'l' }}>\n <InternalAlert type=\"error\" statusIconAriaLabel={errorIconAriaLabel}>\n <div className={styles.error}>{errorText}</div>\n </InternalAlert>\n </InternalBox>\n )}\n {(actions || secondaryActions) && (\n <div className={styles.footer}>\n <div className={styles['actions-section']}>\n {actions && <div className={styles.actions}>{actions}</div>}\n {secondaryActions && <div className={styles['secondary-actions']}>{secondaryActions}</div>}\n </div>\n </div>\n )}\n {errorText && (\n <LiveRegion assertive={true}>\n {errorIconAriaLabel}, {errorText}\n </LiveRegion>\n )}\n </FormLayout>\n </div>\n );\n}\n\nfunction FormLayout({ children, header, variant }: FormLayoutProps) {\n return variant === 'full-page' && header ? (\n <InternalContentLayout header={header}>{children}</InternalContentLayout>\n ) : (\n <>\n {header}\n {children}\n </>\n );\n}\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["form/internal.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, { useEffect } from 'react';\nimport clsx from 'clsx';\nimport { getBaseProps } from '../internal/base-component';\nimport InternalAlert from '../alert/internal';\nimport InternalBox from '../box/internal';\nimport InternalContentLayout from '../content-layout/internal';\nimport styles from './styles.css.js';\nimport { FormLayoutProps, FormProps } from './interfaces';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport LiveRegion from '../internal/components/live-region';\nimport { useInternalI18n } from '../internal/i18n/context';\n\nimport { FunnelMetrics } from '../internal/analytics';\nimport { useFunnel, useFunnelStep } from '../internal/analytics/hooks/use-funnel';\n\ntype InternalFormProps = FormProps & InternalBaseComponentProps;\n\nexport default function InternalForm({\n children,\n header,\n errorText,\n errorIconAriaLabel: errorIconAriaLabelOverride,\n actions,\n secondaryActions,\n variant,\n __internalRootRef,\n ...props\n}: InternalFormProps) {\n const baseProps = getBaseProps(props);\n const i18n = useInternalI18n('form');\n const errorIconAriaLabel = i18n('errorIconAriaLabel', errorIconAriaLabelOverride);\n const { funnelInteractionId, funnelProps } = useFunnel();\n const { funnelStepProps } = useFunnelStep();\n\n useEffect(() => {\n if (funnelInteractionId && errorText) {\n FunnelMetrics.funnelError({ funnelInteractionId });\n }\n }, [funnelInteractionId, errorText]);\n\n return (\n <div\n {...baseProps}\n {...funnelProps}\n {...funnelStepProps}\n ref={__internalRootRef}\n className={clsx(styles.root, baseProps.className)}\n >\n <FormLayout\n header={\n header && <div className={clsx(styles.header, variant === 'full-page' && styles['full-page'])}>{header}</div>\n }\n variant={variant}\n >\n {children && <div className={styles.content}>{children}</div>}\n {errorText && (\n <InternalBox margin={{ top: 'l' }}>\n <InternalAlert type=\"error\" statusIconAriaLabel={errorIconAriaLabel}>\n <div className={styles.error}>{errorText}</div>\n </InternalAlert>\n </InternalBox>\n )}\n {(actions || secondaryActions) && (\n <div className={styles.footer}>\n <div className={styles['actions-section']}>\n {actions && <div className={styles.actions}>{actions}</div>}\n {secondaryActions && <div className={styles['secondary-actions']}>{secondaryActions}</div>}\n </div>\n </div>\n )}\n {errorText && (\n <LiveRegion assertive={true}>\n {errorIconAriaLabel}, {errorText}\n </LiveRegion>\n )}\n </FormLayout>\n </div>\n );\n}\n\nfunction FormLayout({ children, header, variant }: FormLayoutProps) {\n return variant === 'full-page' && header ? (\n <InternalContentLayout header={header}>{children}</InternalContentLayout>\n ) : (\n <>\n {header}\n {children}\n </>\n );\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["form-field/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAItD,UAAU,mBAAmB;IAC3B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,wBAAgB,cAAc,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,kBAAkB,EAAE,EAAE,mBAAmB,eAiBvF;AAED,wBAAgB,cAAc,CAAC,EAC7B,EAAE,EACF,QAAQ,EACR,QAAQ,GACT,EAAE;IACD,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,eAMA;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,SAAS,EACT,OAAe,EACf,KAAK,EACL,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,gBAAgB,EAChB,WAAW,EACX,cAAc,EACd,SAAS,EACT,WAAW,EACX,iBAAwB,EACxB,gBAAwB,EACxB,GAAG,IAAI,EACR,EAAE,sBAAsB,eA8ExB"}
1
+ {"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["form-field/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAoB,MAAM,OAAO,CAAC;AAazC,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAQtD,UAAU,mBAAmB;IAC3B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,wBAAgB,cAAc,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,kBAAkB,EAAE,EAAE,mBAAmB,eAiBvF;AAED,wBAAgB,cAAc,CAAC,EAC7B,EAAE,EACF,QAAQ,EACR,QAAQ,GACT,EAAE;IACD,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,eAMA;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,SAAS,EACT,OAAe,EACf,KAAK,EACL,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,gBAAgB,EAChB,WAAW,EACX,cAAc,EACd,SAAS,EACT,WAAW,EACX,iBAAwB,EACxB,gBAAwB,EACxB,GAAG,IAAI,EACR,EAAE,sBAAsB,eAiHxB"}
@@ -1,7 +1,7 @@
1
1
  import { __rest } from "tslib";
2
2
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
3
3
  // SPDX-License-Identifier: Apache-2.0
4
- import React from 'react';
4
+ import React, { useEffect } from 'react';
5
5
  import clsx from 'clsx';
6
6
  import { getBaseProps } from '../internal/base-component';
7
7
  import { FormFieldContext, useFormFieldContext } from '../internal/context/form-field-context';
@@ -13,6 +13,9 @@ import { getAriaDescribedBy, getGridDefinition, getSlotIds } from './util';
13
13
  import styles from './styles.css.js';
14
14
  import { joinStrings } from '../internal/utils/strings';
15
15
  import { useInternalI18n } from '../internal/i18n/context';
16
+ import { FunnelMetrics } from '../internal/analytics';
17
+ import { useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';
18
+ import { getSubStepAllSelector } from '../internal/analytics/selectors';
16
19
  export function FormFieldError({ id, children, errorIconAriaLabel }) {
17
20
  const i18n = useInternalI18n('form-field');
18
21
  return (React.createElement("div", { id: id, className: styles.error },
@@ -31,6 +34,7 @@ export default function InternalFormField(_a) {
31
34
  const instanceUniqueId = useUniqueId('formField');
32
35
  const generatedControlId = controlId || instanceUniqueId;
33
36
  const formFieldId = controlId || generatedControlId;
37
+ const { funnelInteractionId, stepNumber, stepNameSelector, subStepSelector, subStepNameSelector } = useFunnelSubStep();
34
38
  const slotIds = getSlotIds(formFieldId, label, description, constraintText, errorText);
35
39
  const ariaDescribedBy = getAriaDescribedBy(slotIds);
36
40
  const gridDefinition = getGridDefinition(stretch, !!secondaryControl, isRefresh);
@@ -40,7 +44,29 @@ export default function InternalFormField(_a) {
40
44
  ariaDescribedby: joinStrings(parentAriaDescribedby, ariaDescribedBy) || undefined,
41
45
  invalid: !!errorText || !!parentInvalid,
42
46
  };
43
- return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.root), ref: __internalRootRef }),
47
+ const analyticsAttributes = {};
48
+ if (slotIds.label) {
49
+ analyticsAttributes['data-analytics-field-label-selector'] = `[id="${slotIds.label}"]`;
50
+ }
51
+ if (slotIds.error) {
52
+ analyticsAttributes['data-analytics-field-error-selector'] = `[id="${slotIds.error}"]`;
53
+ }
54
+ useEffect(() => {
55
+ if (funnelInteractionId && errorText) {
56
+ FunnelMetrics.funnelSubStepError({
57
+ funnelInteractionId,
58
+ subStepSelector,
59
+ subStepNameSelector,
60
+ stepNumber,
61
+ stepNameSelector,
62
+ fieldErrorSelector: `[id="${slotIds.error}"]`,
63
+ fieldLabelSelector: `[id="${slotIds.label}"]`,
64
+ subStepAllSelector: getSubStepAllSelector(),
65
+ });
66
+ }
67
+ // eslint-disable-next-line react-hooks/exhaustive-deps
68
+ }, [funnelInteractionId, errorText]);
69
+ return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.root), ref: __internalRootRef }, analyticsAttributes),
44
70
  React.createElement("div", { className: clsx(__hideLabel && styles['visually-hidden']) },
45
71
  label && (React.createElement("label", { className: styles.label, id: slotIds.label, htmlFor: generatedControlId }, label)),
46
72
  !__hideLabel && info && React.createElement("span", { className: styles.info }, info)),
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["form-field/internal.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';\n\nimport { getBaseProps } from '../internal/base-component';\nimport { FormFieldContext, useFormFieldContext } from '../internal/context/form-field-context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\n\nimport InternalGrid from '../grid/internal';\nimport InternalIcon from '../icon/internal';\nimport { getAriaDescribedBy, getGridDefinition, getSlotIds } from './util';\n\nimport styles from './styles.css.js';\nimport { InternalFormFieldProps } from './interfaces';\nimport { joinStrings } from '../internal/utils/strings';\nimport { useInternalI18n } from '../internal/i18n/context';\n\ninterface FormFieldErrorProps {\n id?: string;\n children?: React.ReactNode;\n errorIconAriaLabel?: string;\n}\n\nexport function FormFieldError({ id, children, errorIconAriaLabel }: FormFieldErrorProps) {\n const i18n = useInternalI18n('form-field');\n\n return (\n <div id={id} className={styles.error}>\n <div className={styles['error-icon-shake-wrapper']}>\n <div\n role=\"img\"\n aria-label={i18n('i18nStrings.errorIconAriaLabel', errorIconAriaLabel)}\n className={styles['error-icon-scale-wrapper']}\n >\n <InternalIcon name=\"status-warning\" size=\"small\" />\n </div>\n </div>\n <span className={styles.error__message}>{children}</span>\n </div>\n );\n}\n\nexport function ConstraintText({\n id,\n hasError,\n children,\n}: {\n id?: string;\n hasError: boolean;\n children: React.ReactNode;\n}) {\n return (\n <div id={id} className={clsx(styles.constraint, hasError && styles['constraint-has-error'])}>\n {children}\n </div>\n );\n}\n\nexport default function InternalFormField({\n controlId,\n stretch = false,\n label,\n info,\n i18nStrings,\n children,\n secondaryControl,\n description,\n constraintText,\n errorText,\n __hideLabel,\n __internalRootRef = null,\n __disableGutters = false,\n ...rest\n}: InternalFormFieldProps) {\n const baseProps = getBaseProps(rest);\n const isRefresh = useVisualRefresh();\n\n const instanceUniqueId = useUniqueId('formField');\n const generatedControlId = controlId || instanceUniqueId;\n const formFieldId = controlId || generatedControlId;\n\n const slotIds = getSlotIds(formFieldId, label, description, constraintText, errorText);\n\n const ariaDescribedBy = getAriaDescribedBy(slotIds);\n\n const gridDefinition = getGridDefinition(stretch, !!secondaryControl, isRefresh);\n\n const {\n ariaLabelledby: parentAriaLabelledby,\n ariaDescribedby: parentAriaDescribedby,\n invalid: parentInvalid,\n } = useFormFieldContext({});\n\n const contextValuesWithoutControlId = {\n ariaLabelledby: joinStrings(parentAriaLabelledby, slotIds.label) || undefined,\n ariaDescribedby: joinStrings(parentAriaDescribedby, ariaDescribedBy) || undefined,\n invalid: !!errorText || !!parentInvalid,\n };\n\n return (\n <div {...baseProps} className={clsx(baseProps.className, styles.root)} ref={__internalRootRef}>\n <div className={clsx(__hideLabel && styles['visually-hidden'])}>\n {label && (\n <label className={styles.label} id={slotIds.label} htmlFor={generatedControlId}>\n {label}\n </label>\n )}\n {!__hideLabel && info && <span className={styles.info}>{info}</span>}\n </div>\n\n {description && (\n <div className={styles.description} id={slotIds.description}>\n {description}\n </div>\n )}\n\n <div className={clsx(styles.controls, __hideLabel && styles['label-hidden'])}>\n <InternalGrid gridDefinition={gridDefinition} disableGutters={__disableGutters}>\n <FormFieldContext.Provider\n value={{\n controlId: generatedControlId,\n ...contextValuesWithoutControlId,\n }}\n >\n {children && <div className={styles.control}>{children}</div>}\n </FormFieldContext.Provider>\n\n {secondaryControl && (\n <FormFieldContext.Provider value={contextValuesWithoutControlId}>\n <div className={styles['secondary-control']}>{secondaryControl}</div>\n </FormFieldContext.Provider>\n )}\n </InternalGrid>\n </div>\n\n {(constraintText || errorText) && (\n <div className={styles.hints}>\n {errorText && (\n <FormFieldError id={slotIds.error} errorIconAriaLabel={i18nStrings?.errorIconAriaLabel}>\n {errorText}\n </FormFieldError>\n )}\n {constraintText && (\n <ConstraintText id={slotIds.constraint} hasError={!!errorText}>\n {constraintText}\n </ConstraintText>\n )}\n </div>\n )}\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["form-field/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,MAAM,wCAAwC,CAAC;AAC/F,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAC9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAErE,OAAO,YAAY,MAAM,kBAAkB,CAAC;AAC5C,OAAO,YAAY,MAAM,kBAAkB,CAAC;AAC5C,OAAO,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AAE3E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAE3D,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAC1E,OAAO,EAAE,qBAAqB,EAAE,MAAM,iCAAiC,CAAC;AAQxE,MAAM,UAAU,cAAc,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,kBAAkB,EAAuB;IACtF,MAAM,IAAI,GAAG,eAAe,CAAC,YAAY,CAAC,CAAC;IAE3C,OAAO,CACL,6BAAK,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,CAAC,KAAK;QAClC,6BAAK,SAAS,EAAE,MAAM,CAAC,0BAA0B,CAAC;YAChD,6BACE,IAAI,EAAC,KAAK,gBACE,IAAI,CAAC,gCAAgC,EAAE,kBAAkB,CAAC,EACtE,SAAS,EAAE,MAAM,CAAC,0BAA0B,CAAC;gBAE7C,oBAAC,YAAY,IAAC,IAAI,EAAC,gBAAgB,EAAC,IAAI,EAAC,OAAO,GAAG,CAC/C,CACF;QACN,8BAAM,SAAS,EAAE,MAAM,CAAC,cAAc,IAAG,QAAQ,CAAQ,CACrD,CACP,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,cAAc,CAAC,EAC7B,EAAE,EACF,QAAQ,EACR,QAAQ,GAKT;IACC,OAAO,CACL,6BAAK,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,UAAU,EAAE,QAAQ,IAAI,MAAM,CAAC,sBAAsB,CAAC,CAAC,IACxF,QAAQ,CACL,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EAejB;QAfiB,EACxC,SAAS,EACT,OAAO,GAAG,KAAK,EACf,KAAK,EACL,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,gBAAgB,EAChB,WAAW,EACX,cAAc,EACd,SAAS,EACT,WAAW,EACX,iBAAiB,GAAG,IAAI,EACxB,gBAAgB,GAAG,KAAK,OAED,EADpB,IAAI,cAdiC,8LAezC,CADQ;IAEP,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IACrC,MAAM,SAAS,GAAG,gBAAgB,EAAE,CAAC;IAErC,MAAM,gBAAgB,GAAG,WAAW,CAAC,WAAW,CAAC,CAAC;IAClD,MAAM,kBAAkB,GAAG,SAAS,IAAI,gBAAgB,CAAC;IACzD,MAAM,WAAW,GAAG,SAAS,IAAI,kBAAkB,CAAC;IAEpD,MAAM,EAAE,mBAAmB,EAAE,UAAU,EAAE,gBAAgB,EAAE,eAAe,EAAE,mBAAmB,EAAE,GAC/F,gBAAgB,EAAE,CAAC;IAErB,MAAM,OAAO,GAAG,UAAU,CAAC,WAAW,EAAE,KAAK,EAAE,WAAW,EAAE,cAAc,EAAE,SAAS,CAAC,CAAC;IAEvF,MAAM,eAAe,GAAG,kBAAkB,CAAC,OAAO,CAAC,CAAC;IAEpD,MAAM,cAAc,GAAG,iBAAiB,CAAC,OAAO,EAAE,CAAC,CAAC,gBAAgB,EAAE,SAAS,CAAC,CAAC;IAEjF,MAAM,EACJ,cAAc,EAAE,oBAAoB,EACpC,eAAe,EAAE,qBAAqB,EACtC,OAAO,EAAE,aAAa,GACvB,GAAG,mBAAmB,CAAC,EAAE,CAAC,CAAC;IAE5B,MAAM,6BAA6B,GAAG;QACpC,cAAc,EAAE,WAAW,CAAC,oBAAoB,EAAE,OAAO,CAAC,KAAK,CAAC,IAAI,SAAS;QAC7E,eAAe,EAAE,WAAW,CAAC,qBAAqB,EAAE,eAAe,CAAC,IAAI,SAAS;QACjF,OAAO,EAAE,CAAC,CAAC,SAAS,IAAI,CAAC,CAAC,aAAa;KACxC,CAAC;IAEF,MAAM,mBAAmB,GAA2B,EAAE,CAAC;IAEvD,IAAI,OAAO,CAAC,KAAK,EAAE;QACjB,mBAAmB,CAAC,qCAAqC,CAAC,GAAG,QAAQ,OAAO,CAAC,KAAK,IAAI,CAAC;KACxF;IAED,IAAI,OAAO,CAAC,KAAK,EAAE;QACjB,mBAAmB,CAAC,qCAAqC,CAAC,GAAG,QAAQ,OAAO,CAAC,KAAK,IAAI,CAAC;KACxF;IAED,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,mBAAmB,IAAI,SAAS,EAAE;YACpC,aAAa,CAAC,kBAAkB,CAAC;gBAC/B,mBAAmB;gBACnB,eAAe;gBACf,mBAAmB;gBACnB,UAAU;gBACV,gBAAgB;gBAChB,kBAAkB,EAAE,QAAQ,OAAO,CAAC,KAAK,IAAI;gBAC7C,kBAAkB,EAAE,QAAQ,OAAO,CAAC,KAAK,IAAI;gBAC7C,kBAAkB,EAAE,qBAAqB,EAAE;aAC5C,CAAC,CAAC;SACJ;QAED,uDAAuD;IACzD,CAAC,EAAE,CAAC,mBAAmB,EAAE,SAAS,CAAC,CAAC,CAAC;IAErC,OAAO,CACL,6CACM,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,EACjD,GAAG,EAAE,iBAAiB,IAClB,mBAAmB;QAEvB,6BAAK,SAAS,EAAE,IAAI,CAAC,WAAW,IAAI,MAAM,CAAC,iBAAiB,CAAC,CAAC;YAC3D,KAAK,IAAI,CACR,+BAAO,SAAS,EAAE,MAAM,CAAC,KAAK,EAAE,EAAE,EAAE,OAAO,CAAC,KAAK,EAAE,OAAO,EAAE,kBAAkB,IAC3E,KAAK,CACA,CACT;YACA,CAAC,WAAW,IAAI,IAAI,IAAI,8BAAM,SAAS,EAAE,MAAM,CAAC,IAAI,IAAG,IAAI,CAAQ,CAChE;QAEL,WAAW,IAAI,CACd,6BAAK,SAAS,EAAE,MAAM,CAAC,WAAW,EAAE,EAAE,EAAE,OAAO,CAAC,WAAW,IACxD,WAAW,CACR,CACP;QAED,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,WAAW,IAAI,MAAM,CAAC,cAAc,CAAC,CAAC;YAC1E,oBAAC,YAAY,IAAC,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,gBAAgB;gBAC5E,oBAAC,gBAAgB,CAAC,QAAQ,IACxB,KAAK,kBACH,SAAS,EAAE,kBAAkB,IAC1B,6BAA6B,KAGjC,QAAQ,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,QAAQ,CAAO,CACnC;gBAE3B,gBAAgB,IAAI,CACnB,oBAAC,gBAAgB,CAAC,QAAQ,IAAC,KAAK,EAAE,6BAA6B;oBAC7D,6BAAK,SAAS,EAAE,MAAM,CAAC,mBAAmB,CAAC,IAAG,gBAAgB,CAAO,CAC3C,CAC7B,CACY,CACX;QAEL,CAAC,cAAc,IAAI,SAAS,CAAC,IAAI,CAChC,6BAAK,SAAS,EAAE,MAAM,CAAC,KAAK;YACzB,SAAS,IAAI,CACZ,oBAAC,cAAc,IAAC,EAAE,EAAE,OAAO,CAAC,KAAK,EAAE,kBAAkB,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,kBAAkB,IACnF,SAAS,CACK,CAClB;YACA,cAAc,IAAI,CACjB,oBAAC,cAAc,IAAC,EAAE,EAAE,OAAO,CAAC,UAAU,EAAE,QAAQ,EAAE,CAAC,CAAC,SAAS,IAC1D,cAAc,CACA,CAClB,CACG,CACP,CACG,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect } from 'react';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../internal/base-component';\nimport { FormFieldContext, useFormFieldContext } from '../internal/context/form-field-context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\n\nimport InternalGrid from '../grid/internal';\nimport InternalIcon from '../icon/internal';\nimport { getAriaDescribedBy, getGridDefinition, getSlotIds } from './util';\n\nimport styles from './styles.css.js';\nimport { InternalFormFieldProps } from './interfaces';\nimport { joinStrings } from '../internal/utils/strings';\nimport { useInternalI18n } from '../internal/i18n/context';\n\nimport { FunnelMetrics } from '../internal/analytics';\nimport { useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport { getSubStepAllSelector } from '../internal/analytics/selectors';\n\ninterface FormFieldErrorProps {\n id?: string;\n children?: React.ReactNode;\n errorIconAriaLabel?: string;\n}\n\nexport function FormFieldError({ id, children, errorIconAriaLabel }: FormFieldErrorProps) {\n const i18n = useInternalI18n('form-field');\n\n return (\n <div id={id} className={styles.error}>\n <div className={styles['error-icon-shake-wrapper']}>\n <div\n role=\"img\"\n aria-label={i18n('i18nStrings.errorIconAriaLabel', errorIconAriaLabel)}\n className={styles['error-icon-scale-wrapper']}\n >\n <InternalIcon name=\"status-warning\" size=\"small\" />\n </div>\n </div>\n <span className={styles.error__message}>{children}</span>\n </div>\n );\n}\n\nexport function ConstraintText({\n id,\n hasError,\n children,\n}: {\n id?: string;\n hasError: boolean;\n children: React.ReactNode;\n}) {\n return (\n <div id={id} className={clsx(styles.constraint, hasError && styles['constraint-has-error'])}>\n {children}\n </div>\n );\n}\n\nexport default function InternalFormField({\n controlId,\n stretch = false,\n label,\n info,\n i18nStrings,\n children,\n secondaryControl,\n description,\n constraintText,\n errorText,\n __hideLabel,\n __internalRootRef = null,\n __disableGutters = false,\n ...rest\n}: InternalFormFieldProps) {\n const baseProps = getBaseProps(rest);\n const isRefresh = useVisualRefresh();\n\n const instanceUniqueId = useUniqueId('formField');\n const generatedControlId = controlId || instanceUniqueId;\n const formFieldId = controlId || generatedControlId;\n\n const { funnelInteractionId, stepNumber, stepNameSelector, subStepSelector, subStepNameSelector } =\n useFunnelSubStep();\n\n const slotIds = getSlotIds(formFieldId, label, description, constraintText, errorText);\n\n const ariaDescribedBy = getAriaDescribedBy(slotIds);\n\n const gridDefinition = getGridDefinition(stretch, !!secondaryControl, isRefresh);\n\n const {\n ariaLabelledby: parentAriaLabelledby,\n ariaDescribedby: parentAriaDescribedby,\n invalid: parentInvalid,\n } = useFormFieldContext({});\n\n const contextValuesWithoutControlId = {\n ariaLabelledby: joinStrings(parentAriaLabelledby, slotIds.label) || undefined,\n ariaDescribedby: joinStrings(parentAriaDescribedby, ariaDescribedBy) || undefined,\n invalid: !!errorText || !!parentInvalid,\n };\n\n const analyticsAttributes: Record<string, string> = {};\n\n if (slotIds.label) {\n analyticsAttributes['data-analytics-field-label-selector'] = `[id=\"${slotIds.label}\"]`;\n }\n\n if (slotIds.error) {\n analyticsAttributes['data-analytics-field-error-selector'] = `[id=\"${slotIds.error}\"]`;\n }\n\n useEffect(() => {\n if (funnelInteractionId && errorText) {\n FunnelMetrics.funnelSubStepError({\n funnelInteractionId,\n subStepSelector,\n subStepNameSelector,\n stepNumber,\n stepNameSelector,\n fieldErrorSelector: `[id=\"${slotIds.error}\"]`,\n fieldLabelSelector: `[id=\"${slotIds.label}\"]`,\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [funnelInteractionId, errorText]);\n\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.root)}\n ref={__internalRootRef}\n {...analyticsAttributes}\n >\n <div className={clsx(__hideLabel && styles['visually-hidden'])}>\n {label && (\n <label className={styles.label} id={slotIds.label} htmlFor={generatedControlId}>\n {label}\n </label>\n )}\n {!__hideLabel && info && <span className={styles.info}>{info}</span>}\n </div>\n\n {description && (\n <div className={styles.description} id={slotIds.description}>\n {description}\n </div>\n )}\n\n <div className={clsx(styles.controls, __hideLabel && styles['label-hidden'])}>\n <InternalGrid gridDefinition={gridDefinition} disableGutters={__disableGutters}>\n <FormFieldContext.Provider\n value={{\n controlId: generatedControlId,\n ...contextValuesWithoutControlId,\n }}\n >\n {children && <div className={styles.control}>{children}</div>}\n </FormFieldContext.Provider>\n\n {secondaryControl && (\n <FormFieldContext.Provider value={contextValuesWithoutControlId}>\n <div className={styles['secondary-control']}>{secondaryControl}</div>\n </FormFieldContext.Provider>\n )}\n </InternalGrid>\n </div>\n\n {(constraintText || errorText) && (\n <div className={styles.hints}>\n {errorText && (\n <FormFieldError id={slotIds.error} errorIconAriaLabel={i18nStrings?.errorIconAriaLabel}>\n {errorText}\n </FormFieldError>\n )}\n {constraintText && (\n <ConstraintText id={slotIds.constraint} hasError={!!errorText}>\n {constraintText}\n </ConstraintText>\n )}\n </div>\n )}\n </div>\n );\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["header/internal.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAE3C,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAGjD,UAAU,mBAAoB,SAAQ,YAAY,CAAC,WAAW,EAAE,SAAS,CAAC,EAAE,0BAA0B;IACpG,wBAAwB,CAAC,EAAE,OAAO,CAAC;CACpC;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,OAAO,EACP,kBAAkB,EAClB,QAAQ,EACR,OAAO,EACP,OAAO,EACP,WAAW,EACX,IAAI,EACJ,iBAAwB,EACxB,wBAAwB,EACxB,GAAG,SAAS,EACb,EAAE,mBAAmB,eAsErB"}
1
+ {"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["header/internal.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAE3C,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAGjD,UAAU,mBAAoB,SAAQ,YAAY,CAAC,WAAW,EAAE,SAAS,CAAC,EAAE,0BAA0B;IACpG,wBAAwB,CAAC,EAAE,OAAO,CAAC;CACpC;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,OAAO,EACP,kBAAkB,EAClB,QAAQ,EACR,OAAO,EACP,OAAO,EACP,WAAW,EACX,IAAI,EACJ,iBAAwB,EACxB,wBAAwB,EACxB,GAAG,SAAS,EACb,EAAE,mBAAmB,eAyErB"}
@@ -22,7 +22,7 @@ export default function InternalHeader(_a) {
22
22
  React.createElement("div", { className: clsx(styles.main, styles[`main-variant-${variantOverride}`], isRefresh && styles[`main-variant-${variantOverride}-refresh`]) },
23
23
  React.createElement("div", { className: clsx(styles.title, styles[`title-variant-${variantOverride}`], isRefresh && styles[`title-variant-${variantOverride}-refresh`]) },
24
24
  React.createElement(HeadingTag, { className: clsx(styles.heading, styles[`heading-variant-${variantOverride}`]) },
25
- React.createElement("span", { className: clsx(styles['heading-text'], styles[`heading-text-variant-${variantOverride}`]) }, children),
25
+ React.createElement("span", { "data-analytics": "heading-text", className: clsx(styles['heading-text'], styles[`heading-text-variant-${variantOverride}`]) }, children),
26
26
  counter !== undefined && React.createElement("span", { className: styles.counter },
27
27
  " ",
28
28
  counter)),
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["header/internal.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 clsx from 'clsx';\nimport React, { useContext } from 'react';\nimport { getBaseProps } from '../internal/base-component';\nimport { StickyHeaderContext } from '../container/use-sticky-header';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { HeaderProps } from './interfaces';\nimport styles from './styles.css.js';\nimport { SomeRequired } from '../internal/types';\nimport { useMobile } from '../internal/hooks/use-mobile';\n\ninterface InternalHeaderProps extends SomeRequired<HeaderProps, 'variant'>, InternalBaseComponentProps {\n __disableActionsWrapping?: boolean;\n}\n\nexport default function InternalHeader({\n variant,\n headingTagOverride,\n children,\n actions,\n counter,\n description,\n info,\n __internalRootRef = null,\n __disableActionsWrapping,\n ...restProps\n}: InternalHeaderProps) {\n const isMobile = useMobile();\n const HeadingTag = headingTagOverride ?? (variant === 'awsui-h1-sticky' ? 'h1' : variant);\n const { isStuck } = useContext(StickyHeaderContext);\n const baseProps = getBaseProps(restProps);\n const isRefresh = useVisualRefresh();\n // If is mobile there is no need to have the dynamic variant because it's scrolled out of view\n const dynamicVariant = !isMobile && isStuck ? 'h2' : 'h1';\n const variantOverride = variant === 'awsui-h1-sticky' ? (isRefresh ? dynamicVariant : 'h2') : variant;\n return (\n <div\n {...baseProps}\n className={clsx(\n styles.root,\n baseProps.className,\n styles[`root-variant-${variantOverride}`],\n isRefresh && styles[`root-variant-${variantOverride}-refresh`],\n !actions && [styles[`root-no-actions`]],\n description && [styles[`root-has-description`]],\n __disableActionsWrapping && [styles['root-no-wrap']]\n )}\n ref={__internalRootRef}\n >\n <div\n className={clsx(\n styles.main,\n styles[`main-variant-${variantOverride}`],\n isRefresh && styles[`main-variant-${variantOverride}-refresh`]\n )}\n >\n <div\n className={clsx(\n styles.title,\n styles[`title-variant-${variantOverride}`],\n isRefresh && styles[`title-variant-${variantOverride}-refresh`]\n )}\n >\n <HeadingTag className={clsx(styles.heading, styles[`heading-variant-${variantOverride}`])}>\n <span className={clsx(styles['heading-text'], styles[`heading-text-variant-${variantOverride}`])}>\n {children}\n </span>\n {counter !== undefined && <span className={styles.counter}> {counter}</span>}\n </HeadingTag>\n {info && <span className={styles.info}>{info}</span>}\n </div>\n {description && (\n <p\n className={clsx(\n styles.description,\n styles[`description-variant-${variantOverride}`],\n isRefresh && styles[`description-variant-${variantOverride}-refresh`]\n )}\n >\n {description}\n </p>\n )}\n </div>\n {actions && (\n <div\n className={clsx(\n styles.actions,\n styles[`actions-variant-${variantOverride}`],\n isRefresh && styles[`actions-variant-${variantOverride}-refresh`]\n )}\n >\n {actions}\n </div>\n )}\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["header/internal.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 clsx from 'clsx';\nimport React, { useContext } from 'react';\nimport { getBaseProps } from '../internal/base-component';\nimport { StickyHeaderContext } from '../container/use-sticky-header';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { HeaderProps } from './interfaces';\nimport styles from './styles.css.js';\nimport { SomeRequired } from '../internal/types';\nimport { useMobile } from '../internal/hooks/use-mobile';\n\ninterface InternalHeaderProps extends SomeRequired<HeaderProps, 'variant'>, InternalBaseComponentProps {\n __disableActionsWrapping?: boolean;\n}\n\nexport default function InternalHeader({\n variant,\n headingTagOverride,\n children,\n actions,\n counter,\n description,\n info,\n __internalRootRef = null,\n __disableActionsWrapping,\n ...restProps\n}: InternalHeaderProps) {\n const isMobile = useMobile();\n const HeadingTag = headingTagOverride ?? (variant === 'awsui-h1-sticky' ? 'h1' : variant);\n const { isStuck } = useContext(StickyHeaderContext);\n const baseProps = getBaseProps(restProps);\n const isRefresh = useVisualRefresh();\n // If is mobile there is no need to have the dynamic variant because it's scrolled out of view\n const dynamicVariant = !isMobile && isStuck ? 'h2' : 'h1';\n const variantOverride = variant === 'awsui-h1-sticky' ? (isRefresh ? dynamicVariant : 'h2') : variant;\n return (\n <div\n {...baseProps}\n className={clsx(\n styles.root,\n baseProps.className,\n styles[`root-variant-${variantOverride}`],\n isRefresh && styles[`root-variant-${variantOverride}-refresh`],\n !actions && [styles[`root-no-actions`]],\n description && [styles[`root-has-description`]],\n __disableActionsWrapping && [styles['root-no-wrap']]\n )}\n ref={__internalRootRef}\n >\n <div\n className={clsx(\n styles.main,\n styles[`main-variant-${variantOverride}`],\n isRefresh && styles[`main-variant-${variantOverride}-refresh`]\n )}\n >\n <div\n className={clsx(\n styles.title,\n styles[`title-variant-${variantOverride}`],\n isRefresh && styles[`title-variant-${variantOverride}-refresh`]\n )}\n >\n <HeadingTag className={clsx(styles.heading, styles[`heading-variant-${variantOverride}`])}>\n <span\n data-analytics=\"heading-text\"\n className={clsx(styles['heading-text'], styles[`heading-text-variant-${variantOverride}`])}\n >\n {children}\n </span>\n {counter !== undefined && <span className={styles.counter}> {counter}</span>}\n </HeadingTag>\n {info && <span className={styles.info}>{info}</span>}\n </div>\n {description && (\n <p\n className={clsx(\n styles.description,\n styles[`description-variant-${variantOverride}`],\n isRefresh && styles[`description-variant-${variantOverride}-refresh`]\n )}\n >\n {description}\n </p>\n )}\n </div>\n {actions && (\n <div\n className={clsx(\n styles.actions,\n styles[`actions-variant-${variantOverride}`],\n isRefresh && styles[`actions-variant-${variantOverride}-refresh`]\n )}\n >\n {actions}\n </div>\n )}\n </div>\n );\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["help-panel/index.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAG9C,OAAO,EAAE,cAAc,EAAE,CAAC;AAE1B,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,SAAS,EAAE,EAAE,cAAc,eAoBjH"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["help-panel/index.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAI9C,OAAO,EAAE,cAAc,EAAE,CAAC;AAE1B,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,SAAS,EAAE,EAAE,cAAc,eAqBjH"}
@@ -9,14 +9,16 @@ import styles from './styles.css.js';
9
9
  import { applyDisplayName } from '../internal/utils/apply-display-name';
10
10
  import useBaseComponent from '../internal/hooks/use-base-component';
11
11
  import LiveRegion from '../internal/components/live-region';
12
+ import { useInternalI18n } from '../internal/i18n/context';
12
13
  export default function HelpPanel(_a) {
13
14
  var { header, footer, children, loading, loadingText } = _a, restProps = __rest(_a, ["header", "footer", "children", "loading", "loadingText"]);
14
15
  const { __internalRootRef } = useBaseComponent('HelpPanel');
15
16
  const baseProps = getBaseProps(restProps);
17
+ const i18n = useInternalI18n('help-panel');
16
18
  const containerProps = Object.assign(Object.assign({}, baseProps), { className: clsx(baseProps.className, styles['help-panel']) });
17
19
  return loading ? (React.createElement("div", Object.assign({}, containerProps, { ref: __internalRootRef }),
18
20
  React.createElement(InternalStatusIndicator, { type: "loading" },
19
- React.createElement(LiveRegion, { visible: true }, loadingText)))) : (React.createElement("div", Object.assign({}, containerProps, { ref: __internalRootRef }),
21
+ React.createElement(LiveRegion, { visible: true }, i18n('loadingText', loadingText))))) : (React.createElement("div", Object.assign({}, containerProps, { ref: __internalRootRef }),
20
22
  header && React.createElement("div", { className: clsx(styles.header) }, header),
21
23
  React.createElement("div", { className: clsx(styles.content) }, children),
22
24
  footer && React.createElement("div", { className: styles.footer }, footer)));
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["help-panel/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,uBAAuB,MAAM,8BAA8B,CAAC;AACnE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAEpE,OAAO,UAAU,MAAM,oCAAoC,CAAC;AAI5D,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAAgF;QAAhF,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,OAAgC,EAA3B,SAAS,cAA9D,0DAAgE,CAAF;IAC9F,MAAM,EAAE,iBAAiB,EAAE,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAC;IAC5D,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,cAAc,mCACf,SAAS,KACZ,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,YAAY,CAAC,CAAC,GAC3D,CAAC;IACF,OAAO,OAAO,CAAC,CAAC,CAAC,CACf,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC7C,oBAAC,uBAAuB,IAAC,IAAI,EAAC,SAAS;YACrC,oBAAC,UAAU,IAAC,OAAO,EAAE,IAAI,IAAG,WAAW,CAAc,CAC7B,CACtB,CACP,CAAC,CAAC,CAAC,CACF,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC5C,MAAM,IAAI,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,IAAG,MAAM,CAAO;QAC9D,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAG,QAAQ,CAAO;QACrD,MAAM,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM,IAAG,MAAM,CAAO,CACpD,CACP,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 clsx from 'clsx';\nimport React from 'react';\nimport { getBaseProps } from '../internal/base-component';\nimport InternalStatusIndicator from '../status-indicator/internal';\nimport styles from './styles.css.js';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { HelpPanelProps } from './interfaces';\nimport LiveRegion from '../internal/components/live-region';\n\nexport { HelpPanelProps };\n\nexport default function HelpPanel({ header, footer, children, loading, loadingText, ...restProps }: HelpPanelProps) {\n const { __internalRootRef } = useBaseComponent('HelpPanel');\n const baseProps = getBaseProps(restProps);\n const containerProps = {\n ...baseProps,\n className: clsx(baseProps.className, styles['help-panel']),\n };\n return loading ? (\n <div {...containerProps} ref={__internalRootRef}>\n <InternalStatusIndicator type=\"loading\">\n <LiveRegion visible={true}>{loadingText}</LiveRegion>\n </InternalStatusIndicator>\n </div>\n ) : (\n <div {...containerProps} ref={__internalRootRef}>\n {header && <div className={clsx(styles.header)}>{header}</div>}\n <div className={clsx(styles.content)}>{children}</div>\n {footer && <div className={styles.footer}>{footer}</div>}\n </div>\n );\n}\n\napplyDisplayName(HelpPanel, 'HelpPanel');\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["help-panel/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,uBAAuB,MAAM,8BAA8B,CAAC;AACnE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAEpE,OAAO,UAAU,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAI3D,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAAgF;QAAhF,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,OAAgC,EAA3B,SAAS,cAA9D,0DAAgE,CAAF;IAC9F,MAAM,EAAE,iBAAiB,EAAE,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAC;IAC5D,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,IAAI,GAAG,eAAe,CAAC,YAAY,CAAC,CAAC;IAC3C,MAAM,cAAc,mCACf,SAAS,KACZ,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,YAAY,CAAC,CAAC,GAC3D,CAAC;IACF,OAAO,OAAO,CAAC,CAAC,CAAC,CACf,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC7C,oBAAC,uBAAuB,IAAC,IAAI,EAAC,SAAS;YACrC,oBAAC,UAAU,IAAC,OAAO,EAAE,IAAI,IAAG,IAAI,CAAC,aAAa,EAAE,WAAW,CAAC,CAAc,CAClD,CACtB,CACP,CAAC,CAAC,CAAC,CACF,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC5C,MAAM,IAAI,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,IAAG,MAAM,CAAO;QAC9D,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAG,QAAQ,CAAO;QACrD,MAAM,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM,IAAG,MAAM,CAAO,CACpD,CACP,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 clsx from 'clsx';\nimport React from 'react';\nimport { getBaseProps } from '../internal/base-component';\nimport InternalStatusIndicator from '../status-indicator/internal';\nimport styles from './styles.css.js';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { HelpPanelProps } from './interfaces';\nimport LiveRegion from '../internal/components/live-region';\nimport { useInternalI18n } from '../internal/i18n/context';\n\nexport { HelpPanelProps };\n\nexport default function HelpPanel({ header, footer, children, loading, loadingText, ...restProps }: HelpPanelProps) {\n const { __internalRootRef } = useBaseComponent('HelpPanel');\n const baseProps = getBaseProps(restProps);\n const i18n = useInternalI18n('help-panel');\n const containerProps = {\n ...baseProps,\n className: clsx(baseProps.className, styles['help-panel']),\n };\n return loading ? (\n <div {...containerProps} ref={__internalRootRef}>\n <InternalStatusIndicator type=\"loading\">\n <LiveRegion visible={true}>{i18n('loadingText', loadingText)}</LiveRegion>\n </InternalStatusIndicator>\n </div>\n ) : (\n <div {...containerProps} ref={__internalRootRef}>\n {header && <div className={clsx(styles.header)}>{header}</div>}\n <div className={clsx(styles.content)}>{children}</div>\n {footer && <div className={styles.footer}>{footer}</div>}\n </div>\n );\n}\n\napplyDisplayName(HelpPanel, 'HelpPanel');\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"use-funnel.d.ts","sourceRoot":"lib/default/","sources":["internal/analytics/hooks/use-funnel.ts"],"names":[],"mappings":";AAQA;;;;;;;;;GASG;AACH,eAAO,MAAM,gBAAgB;;;;;;;;;CA2C5B,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,aAAa;;;;;CAOzB,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,SAAS;;;;;;;;;CAOrB,CAAC"}
1
+ {"version":3,"file":"use-funnel.d.ts","sourceRoot":"lib/default/","sources":["internal/analytics/hooks/use-funnel.ts"],"names":[],"mappings":";AAQA;;;;;;;;;GASG;AACH,eAAO,MAAM,gBAAgB;;;;;;;;;CA6C5B,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,aAAa;;;;;CASzB,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,SAAS;;;;;;;;;CASrB,CAAC"}
@@ -44,11 +44,13 @@ export const useFunnelSubStep = () => {
44
44
  });
45
45
  }
46
46
  };
47
- const funnelSubStepProps = {
48
- 'data-analytics-funnel-substep': subStepId,
49
- onFocus,
50
- onBlur,
51
- };
47
+ const funnelSubStepProps = funnelInteractionId
48
+ ? {
49
+ 'data-analytics-funnel-substep': subStepId,
50
+ onFocus,
51
+ onBlur,
52
+ }
53
+ : {};
52
54
  return Object.assign({ funnelSubStepProps, subStepRef }, context);
53
55
  };
54
56
  /**
@@ -61,9 +63,11 @@ export const useFunnelSubStep = () => {
61
63
  */
62
64
  export const useFunnelStep = () => {
63
65
  const context = useContext(FunnelStepContext);
64
- const funnelStepProps = {
65
- 'data-analytics-funnel-step-index': context.stepNumber,
66
- };
66
+ const funnelStepProps = context.funnelInteractionId
67
+ ? {
68
+ 'data-analytics-funnel-step-index': context.stepNumber,
69
+ }
70
+ : {};
67
71
  return Object.assign({ funnelStepProps }, context);
68
72
  };
69
73
  /**
@@ -75,9 +79,11 @@ export const useFunnelStep = () => {
75
79
  */
76
80
  export const useFunnel = () => {
77
81
  const context = useContext(FunnelContext);
78
- const funnelProps = {
79
- 'data-analytics-funnel-interaction-id': context.funnelInteractionId,
80
- };
82
+ const funnelProps = context.funnelInteractionId
83
+ ? {
84
+ 'data-analytics-funnel-interaction-id': context.funnelInteractionId,
85
+ }
86
+ : {};
81
87
  return Object.assign({ funnelProps }, context);
82
88
  };
83
89
  //# sourceMappingURL=use-funnel.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"use-funnel.js","sourceRoot":"lib/default/","sources":["internal/analytics/hooks/use-funnel.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AACtG,OAAO,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,KAAK,CAAC;AAEpC;;;;;;;;;GASG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,EAAE;IACnC,MAAM,UAAU,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IACvD,MAAM,OAAO,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IACjD,MAAM,EAAE,mBAAmB,EAAE,SAAS,EAAE,eAAe,EAAE,mBAAmB,EAAE,UAAU,EAAE,gBAAgB,EAAE,GAC1G,OAAO,CAAC;IAEV,MAAM,OAAO,GAAG,CAAC,KAAuC,EAAE,EAAE;QAC1D,IACE,mBAAmB;YACnB,UAAU,CAAC,OAAO;YAClB,CAAC,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,aAAqB,CAAC,CAAC,EACnF;YACA,aAAa,CAAC,kBAAkB,CAAC;gBAC/B,mBAAmB;gBACnB,eAAe;gBACf,mBAAmB;gBACnB,UAAU;gBACV,gBAAgB;gBAChB,kBAAkB,EAAE,qBAAqB,EAAE;aAC5C,CAAC,CAAC;SACJ;IACH,CAAC,CAAC;IAEF,MAAM,MAAM,GAAG,CAAC,KAAuC,EAAE,EAAE;QACzD,IAAI,mBAAmB,IAAI,UAAU,CAAC,OAAO,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,aAAa,CAAC,EAAE;YAClG,aAAa,CAAC,qBAAqB,CAAC;gBAClC,mBAAmB;gBACnB,eAAe;gBACf,mBAAmB;gBACnB,UAAU;gBACV,gBAAgB;gBAChB,kBAAkB,EAAE,qBAAqB,EAAE;aAC5C,CAAC,CAAC;SACJ;IACH,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAwB;QAC9C,+BAA+B,EAAE,SAAS;QAC1C,OAAO;QACP,MAAM;KACP,CAAC;IAEF,uBAAS,kBAAkB,EAAE,UAAU,IAAK,OAAO,EAAG;AACxD,CAAC,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,EAAE;IAChC,MAAM,OAAO,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC;IAC9C,MAAM,eAAe,GAA0D;QAC7E,kCAAkC,EAAE,OAAO,CAAC,UAAU;KACvD,CAAC;IAEF,uBAAS,eAAe,IAAK,OAAO,EAAG;AACzC,CAAC,CAAC;AAEF;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,EAAE;IAC5B,MAAM,OAAO,GAAG,UAAU,CAAC,aAAa,CAAC,CAAC;IAC1C,MAAM,WAAW,GAA0D;QACzE,sCAAsC,EAAE,OAAO,CAAC,mBAAmB;KACpE,CAAC;IAEF,uBAAS,WAAW,IAAK,OAAO,EAAG;AACrC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useContext, useRef } from 'react';\nimport { FunnelContext, FunnelStepContext, FunnelSubStepContext } from '../context/analytics-context';\nimport { getSubStepAllSelector } from '../selectors';\nimport { FunnelMetrics } from '../';\n\n/**\n * Custom React Hook to manage and interact with FunnelSubStep.\n * This hook will provide necessary properties and methods required\n * to track and manage interactions with a FunnelSubStep component.\n *\n * The `onFocus` method is used to track the beginning of interaction with the FunnelSubStep.\n * The `onBlur` method is used to track the completion of interaction with the FunnelSubStep.\n * The subStepId is a unique identifier for the funnel sub-step.\n * The subStepRef is a reference to the DOM element of the funnel sub-step.\n */\nexport const useFunnelSubStep = () => {\n const subStepRef = useRef<HTMLDivElement | null>(null);\n const context = useContext(FunnelSubStepContext);\n const { funnelInteractionId, subStepId, subStepSelector, subStepNameSelector, stepNumber, stepNameSelector } =\n context;\n\n const onFocus = (event: React.FocusEvent<HTMLDivElement>) => {\n if (\n funnelInteractionId &&\n subStepRef.current &&\n (!event.relatedTarget || !subStepRef.current.contains(event.relatedTarget as Node))\n ) {\n FunnelMetrics.funnelSubStepStart({\n funnelInteractionId,\n subStepSelector,\n subStepNameSelector,\n stepNumber,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n };\n\n const onBlur = (event: React.FocusEvent<HTMLDivElement>) => {\n if (funnelInteractionId && subStepRef.current && !subStepRef.current.contains(event.relatedTarget)) {\n FunnelMetrics.funnelSubStepComplete({\n funnelInteractionId,\n subStepSelector,\n subStepNameSelector,\n stepNumber,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n };\n\n const funnelSubStepProps: Record<string, any> = {\n 'data-analytics-funnel-substep': subStepId,\n onFocus,\n onBlur,\n };\n\n return { funnelSubStepProps, subStepRef, ...context };\n};\n\n/**\n * Custom React Hook to manage and interact with FunnelStep.\n * This hook will provide necessary properties required to track\n * and manage interactions with a FunnelStep component.\n *\n * The 'data-analytics-funnel-step-index' property of funnelStepProps is used to track the index of the current step in the funnel.\n * The context contains additional properties of the FunnelStep.\n */\nexport const useFunnelStep = () => {\n const context = useContext(FunnelStepContext);\n const funnelStepProps: Record<string, string | number | boolean | undefined> = {\n 'data-analytics-funnel-step-index': context.stepNumber,\n };\n\n return { funnelStepProps, ...context };\n};\n\n/**\n * Custom React Hook to manage and interact with Funnel.\n * This hook will provide necessary properties required to track\n * and manage interactions with a Funnel component.\n *\n * The 'data-analytics-funnel-interaction-id' property of funnelProps is used to track the unique identifier of the current interaction with the funnel.\n */\nexport const useFunnel = () => {\n const context = useContext(FunnelContext);\n const funnelProps: Record<string, string | number | boolean | undefined> = {\n 'data-analytics-funnel-interaction-id': context.funnelInteractionId,\n };\n\n return { funnelProps, ...context };\n};\n"]}
1
+ {"version":3,"file":"use-funnel.js","sourceRoot":"lib/default/","sources":["internal/analytics/hooks/use-funnel.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AACtG,OAAO,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,KAAK,CAAC;AAEpC;;;;;;;;;GASG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,EAAE;IACnC,MAAM,UAAU,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IACvD,MAAM,OAAO,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IACjD,MAAM,EAAE,mBAAmB,EAAE,SAAS,EAAE,eAAe,EAAE,mBAAmB,EAAE,UAAU,EAAE,gBAAgB,EAAE,GAC1G,OAAO,CAAC;IAEV,MAAM,OAAO,GAAG,CAAC,KAAuC,EAAE,EAAE;QAC1D,IACE,mBAAmB;YACnB,UAAU,CAAC,OAAO;YAClB,CAAC,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,aAAqB,CAAC,CAAC,EACnF;YACA,aAAa,CAAC,kBAAkB,CAAC;gBAC/B,mBAAmB;gBACnB,eAAe;gBACf,mBAAmB;gBACnB,UAAU;gBACV,gBAAgB;gBAChB,kBAAkB,EAAE,qBAAqB,EAAE;aAC5C,CAAC,CAAC;SACJ;IACH,CAAC,CAAC;IAEF,MAAM,MAAM,GAAG,CAAC,KAAuC,EAAE,EAAE;QACzD,IAAI,mBAAmB,IAAI,UAAU,CAAC,OAAO,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,aAAa,CAAC,EAAE;YAClG,aAAa,CAAC,qBAAqB,CAAC;gBAClC,mBAAmB;gBACnB,eAAe;gBACf,mBAAmB;gBACnB,UAAU;gBACV,gBAAgB;gBAChB,kBAAkB,EAAE,qBAAqB,EAAE;aAC5C,CAAC,CAAC;SACJ;IACH,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAwB,mBAAmB;QACjE,CAAC,CAAC;YACE,+BAA+B,EAAE,SAAS;YAC1C,OAAO;YACP,MAAM;SACP;QACH,CAAC,CAAC,EAAE,CAAC;IAEP,uBAAS,kBAAkB,EAAE,UAAU,IAAK,OAAO,EAAG;AACxD,CAAC,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,EAAE;IAChC,MAAM,OAAO,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC;IAC9C,MAAM,eAAe,GAA0D,OAAO,CAAC,mBAAmB;QACxG,CAAC,CAAC;YACE,kCAAkC,EAAE,OAAO,CAAC,UAAU;SACvD;QACH,CAAC,CAAC,EAAE,CAAC;IAEP,uBAAS,eAAe,IAAK,OAAO,EAAG;AACzC,CAAC,CAAC;AAEF;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,EAAE;IAC5B,MAAM,OAAO,GAAG,UAAU,CAAC,aAAa,CAAC,CAAC;IAC1C,MAAM,WAAW,GAA0D,OAAO,CAAC,mBAAmB;QACpG,CAAC,CAAC;YACE,sCAAsC,EAAE,OAAO,CAAC,mBAAmB;SACpE;QACH,CAAC,CAAC,EAAE,CAAC;IAEP,uBAAS,WAAW,IAAK,OAAO,EAAG;AACrC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useContext, useRef } from 'react';\nimport { FunnelContext, FunnelStepContext, FunnelSubStepContext } from '../context/analytics-context';\nimport { getSubStepAllSelector } from '../selectors';\nimport { FunnelMetrics } from '../';\n\n/**\n * Custom React Hook to manage and interact with FunnelSubStep.\n * This hook will provide necessary properties and methods required\n * to track and manage interactions with a FunnelSubStep component.\n *\n * The `onFocus` method is used to track the beginning of interaction with the FunnelSubStep.\n * The `onBlur` method is used to track the completion of interaction with the FunnelSubStep.\n * The subStepId is a unique identifier for the funnel sub-step.\n * The subStepRef is a reference to the DOM element of the funnel sub-step.\n */\nexport const useFunnelSubStep = () => {\n const subStepRef = useRef<HTMLDivElement | null>(null);\n const context = useContext(FunnelSubStepContext);\n const { funnelInteractionId, subStepId, subStepSelector, subStepNameSelector, stepNumber, stepNameSelector } =\n context;\n\n const onFocus = (event: React.FocusEvent<HTMLDivElement>) => {\n if (\n funnelInteractionId &&\n subStepRef.current &&\n (!event.relatedTarget || !subStepRef.current.contains(event.relatedTarget as Node))\n ) {\n FunnelMetrics.funnelSubStepStart({\n funnelInteractionId,\n subStepSelector,\n subStepNameSelector,\n stepNumber,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n };\n\n const onBlur = (event: React.FocusEvent<HTMLDivElement>) => {\n if (funnelInteractionId && subStepRef.current && !subStepRef.current.contains(event.relatedTarget)) {\n FunnelMetrics.funnelSubStepComplete({\n funnelInteractionId,\n subStepSelector,\n subStepNameSelector,\n stepNumber,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n };\n\n const funnelSubStepProps: Record<string, any> = funnelInteractionId\n ? {\n 'data-analytics-funnel-substep': subStepId,\n onFocus,\n onBlur,\n }\n : {};\n\n return { funnelSubStepProps, subStepRef, ...context };\n};\n\n/**\n * Custom React Hook to manage and interact with FunnelStep.\n * This hook will provide necessary properties required to track\n * and manage interactions with a FunnelStep component.\n *\n * The 'data-analytics-funnel-step-index' property of funnelStepProps is used to track the index of the current step in the funnel.\n * The context contains additional properties of the FunnelStep.\n */\nexport const useFunnelStep = () => {\n const context = useContext(FunnelStepContext);\n const funnelStepProps: Record<string, string | number | boolean | undefined> = context.funnelInteractionId\n ? {\n 'data-analytics-funnel-step-index': context.stepNumber,\n }\n : {};\n\n return { funnelStepProps, ...context };\n};\n\n/**\n * Custom React Hook to manage and interact with Funnel.\n * This hook will provide necessary properties required to track\n * and manage interactions with a Funnel component.\n *\n * The 'data-analytics-funnel-interaction-id' property of funnelProps is used to track the unique identifier of the current interaction with the funnel.\n */\nexport const useFunnel = () => {\n const context = useContext(FunnelContext);\n const funnelProps: Record<string, string | number | boolean | undefined> = context.funnelInteractionId\n ? {\n 'data-analytics-funnel-interaction-id': context.funnelInteractionId,\n }\n : {};\n\n return { funnelProps, ...context };\n};\n"]}