@cloudscape-design/components 3.0.979 → 3.0.980

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 (205) hide show
  1. package/alert/internal.d.ts.map +1 -1
  2. package/alert/internal.js +1 -1
  3. package/alert/internal.js.map +1 -1
  4. package/app-layout/index.d.ts.map +1 -1
  5. package/app-layout/index.js +1 -2
  6. package/app-layout/index.js.map +1 -1
  7. package/app-layout/visual-refresh-toolbar/drawer/styles.css.js +17 -17
  8. package/app-layout/visual-refresh-toolbar/drawer/styles.scoped.css +36 -35
  9. package/app-layout/visual-refresh-toolbar/drawer/styles.selectors.js +17 -17
  10. package/app-layout/visual-refresh-toolbar/index.d.ts.map +1 -1
  11. package/app-layout/visual-refresh-toolbar/index.js +1 -2
  12. package/app-layout/visual-refresh-toolbar/index.js.map +1 -1
  13. package/app-layout/visual-refresh-toolbar/toolbar/index.js +1 -1
  14. package/app-layout/visual-refresh-toolbar/toolbar/index.js.map +1 -1
  15. package/app-layout-toolbar/index.d.ts.map +1 -1
  16. package/app-layout-toolbar/index.js +1 -2
  17. package/app-layout-toolbar/index.js.map +1 -1
  18. package/area-chart/chart-container.d.ts.map +1 -1
  19. package/area-chart/chart-container.js +1 -1
  20. package/area-chart/chart-container.js.map +1 -1
  21. package/area-chart/internal.d.ts.map +1 -1
  22. package/area-chart/internal.js +1 -2
  23. package/area-chart/internal.js.map +1 -1
  24. package/attribute-editor/internal.d.ts.map +1 -1
  25. package/attribute-editor/internal.js +1 -1
  26. package/attribute-editor/internal.js.map +1 -1
  27. package/breadcrumb-group/implementation.d.ts.map +1 -1
  28. package/breadcrumb-group/implementation.js +1 -2
  29. package/breadcrumb-group/implementation.js.map +1 -1
  30. package/button/internal.d.ts.map +1 -1
  31. package/button/internal.js +1 -2
  32. package/button/internal.js.map +1 -1
  33. package/button-group/internal.d.ts.map +1 -1
  34. package/button-group/internal.js +1 -2
  35. package/button-group/internal.js.map +1 -1
  36. package/calendar/grid/index.d.ts.map +1 -1
  37. package/calendar/grid/index.js +1 -1
  38. package/calendar/grid/index.js.map +1 -1
  39. package/cards/index.js +1 -1
  40. package/cards/index.js.map +1 -1
  41. package/code-editor/index.d.ts.map +1 -1
  42. package/code-editor/index.js +1 -2
  43. package/code-editor/index.js.map +1 -1
  44. package/container/internal.d.ts.map +1 -1
  45. package/container/internal.js +1 -1
  46. package/container/internal.js.map +1 -1
  47. package/content-layout/internal.d.ts.map +1 -1
  48. package/content-layout/internal.js +1 -2
  49. package/content-layout/internal.js.map +1 -1
  50. package/date-picker/index.d.ts.map +1 -1
  51. package/date-picker/index.js +1 -1
  52. package/date-picker/index.js.map +1 -1
  53. package/date-range-picker/calendar/grids/grid-cell.d.ts.map +1 -1
  54. package/date-range-picker/calendar/grids/grid-cell.js +1 -1
  55. package/date-range-picker/calendar/grids/grid-cell.js.map +1 -1
  56. package/date-range-picker/index.d.ts.map +1 -1
  57. package/date-range-picker/index.js +1 -2
  58. package/date-range-picker/index.js.map +1 -1
  59. package/file-input/internal.d.ts.map +1 -1
  60. package/file-input/internal.js +1 -2
  61. package/file-input/internal.js.map +1 -1
  62. package/file-token-group/internal.d.ts.map +1 -1
  63. package/file-token-group/internal.js +1 -1
  64. package/file-token-group/internal.js.map +1 -1
  65. package/file-upload/internal.d.ts.map +1 -1
  66. package/file-upload/internal.js +1 -2
  67. package/file-upload/internal.js.map +1 -1
  68. package/flashbar/common.d.ts.map +1 -1
  69. package/flashbar/common.js +1 -2
  70. package/flashbar/common.js.map +1 -1
  71. package/flashbar/flash.d.ts.map +1 -1
  72. package/flashbar/flash.js +1 -2
  73. package/flashbar/flash.js.map +1 -1
  74. package/grid/internal.d.ts.map +1 -1
  75. package/grid/internal.js +1 -2
  76. package/grid/internal.js.map +1 -1
  77. package/icon/internal.d.ts.map +1 -1
  78. package/icon/internal.js +1 -2
  79. package/icon/internal.js.map +1 -1
  80. package/input/internal.d.ts.map +1 -1
  81. package/input/internal.js +1 -1
  82. package/input/internal.js.map +1 -1
  83. package/internal/components/chart-popover/index.d.ts.map +1 -1
  84. package/internal/components/chart-popover/index.js +1 -1
  85. package/internal/components/chart-popover/index.js.map +1 -1
  86. package/internal/components/chart-series-details/index.d.ts.map +1 -1
  87. package/internal/components/chart-series-details/index.js +1 -1
  88. package/internal/components/chart-series-details/index.js.map +1 -1
  89. package/internal/components/drag-handle/button.d.ts.map +1 -1
  90. package/internal/components/drag-handle/button.js +1 -1
  91. package/internal/components/drag-handle/button.js.map +1 -1
  92. package/internal/components/drag-handle-wrapper/styles.css.js +21 -21
  93. package/internal/components/drag-handle-wrapper/styles.scoped.css +36 -36
  94. package/internal/components/drag-handle-wrapper/styles.selectors.js +21 -21
  95. package/internal/components/dropdown/index.d.ts.map +1 -1
  96. package/internal/components/dropdown/index.js +1 -2
  97. package/internal/components/dropdown/index.js.map +1 -1
  98. package/internal/components/focus-lock/index.d.ts.map +1 -1
  99. package/internal/components/focus-lock/index.js +1 -1
  100. package/internal/components/focus-lock/index.js.map +1 -1
  101. package/internal/components/masked-input/index.d.ts.map +1 -1
  102. package/internal/components/masked-input/index.js +1 -1
  103. package/internal/components/masked-input/index.js.map +1 -1
  104. package/internal/components/options-list/index.d.ts.map +1 -1
  105. package/internal/components/options-list/index.js +1 -2
  106. package/internal/components/options-list/index.js.map +1 -1
  107. package/internal/environment.js +1 -1
  108. package/internal/environment.json +1 -1
  109. package/internal/manifest.json +1 -1
  110. package/link/internal.d.ts.map +1 -1
  111. package/link/internal.js +1 -1
  112. package/link/internal.js.map +1 -1
  113. package/live-region/internal.d.ts.map +1 -1
  114. package/live-region/internal.js +1 -1
  115. package/live-region/internal.js.map +1 -1
  116. package/mixed-line-bar-chart/chart-container.d.ts.map +1 -1
  117. package/mixed-line-bar-chart/chart-container.js +1 -2
  118. package/mixed-line-bar-chart/chart-container.js.map +1 -1
  119. package/mixed-line-bar-chart/internal.d.ts.map +1 -1
  120. package/mixed-line-bar-chart/internal.js +1 -2
  121. package/mixed-line-bar-chart/internal.js.map +1 -1
  122. package/modal/internal.d.ts.map +1 -1
  123. package/modal/internal.js +1 -2
  124. package/modal/internal.js.map +1 -1
  125. package/package.json +1 -1
  126. package/pie-chart/index.d.ts.map +1 -1
  127. package/pie-chart/index.js +1 -1
  128. package/pie-chart/index.js.map +1 -1
  129. package/popover/internal.d.ts.map +1 -1
  130. package/popover/internal.js +1 -2
  131. package/popover/internal.js.map +1 -1
  132. package/property-filter/filtering-token/index.d.ts.map +1 -1
  133. package/property-filter/filtering-token/index.js +1 -2
  134. package/property-filter/filtering-token/index.js.map +1 -1
  135. package/property-filter/internal.d.ts.map +1 -1
  136. package/property-filter/internal.js +1 -1
  137. package/property-filter/internal.js.map +1 -1
  138. package/property-filter/property-filter-autosuggest.d.ts.map +1 -1
  139. package/property-filter/property-filter-autosuggest.js +1 -1
  140. package/property-filter/property-filter-autosuggest.js.map +1 -1
  141. package/radio-group/radio-button.d.ts.map +1 -1
  142. package/radio-group/radio-button.js +1 -1
  143. package/radio-group/radio-button.js.map +1 -1
  144. package/segmented-control/segment.d.ts.map +1 -1
  145. package/segmented-control/segment.js +1 -1
  146. package/segmented-control/segment.js.map +1 -1
  147. package/select/internal.d.ts.map +1 -1
  148. package/select/internal.js +1 -2
  149. package/select/internal.js.map +1 -1
  150. package/select/parts/item.d.ts.map +1 -1
  151. package/select/parts/item.js +1 -1
  152. package/select/parts/item.js.map +1 -1
  153. package/select/parts/multiselect-item.d.ts.map +1 -1
  154. package/select/parts/multiselect-item.js +1 -1
  155. package/select/parts/multiselect-item.js.map +1 -1
  156. package/select/parts/plain-list.d.ts.map +1 -1
  157. package/select/parts/plain-list.js +1 -1
  158. package/select/parts/plain-list.js.map +1 -1
  159. package/select/parts/trigger.d.ts.map +1 -1
  160. package/select/parts/trigger.js +1 -1
  161. package/select/parts/trigger.js.map +1 -1
  162. package/select/parts/virtual-list.js +1 -1
  163. package/select/parts/virtual-list.js.map +1 -1
  164. package/space-between/internal.d.ts.map +1 -1
  165. package/space-between/internal.js +1 -1
  166. package/space-between/internal.js.map +1 -1
  167. package/split-panel/implementation.d.ts.map +1 -1
  168. package/split-panel/implementation.js +1 -1
  169. package/split-panel/implementation.js.map +1 -1
  170. package/table/body-cell/td-element.js +1 -1
  171. package/table/body-cell/td-element.js.map +1 -1
  172. package/table/header-cell/index.d.ts.map +1 -1
  173. package/table/header-cell/index.js +1 -2
  174. package/table/header-cell/index.js.map +1 -1
  175. package/table/header-cell/th-element.js +1 -1
  176. package/table/header-cell/th-element.js.map +1 -1
  177. package/table/internal.d.ts.map +1 -1
  178. package/table/internal.js +4 -3
  179. package/table/internal.js.map +1 -1
  180. package/table/sticky-scrollbar/sticky-scrollbar.d.ts.map +1 -1
  181. package/table/sticky-scrollbar/sticky-scrollbar.js +1 -1
  182. package/table/sticky-scrollbar/sticky-scrollbar.js.map +1 -1
  183. package/tabs/tab-header-bar.d.ts.map +1 -1
  184. package/tabs/tab-header-bar.js +13 -1
  185. package/tabs/tab-header-bar.js.map +1 -1
  186. package/tiles/internal.d.ts.map +1 -1
  187. package/tiles/internal.js +1 -1
  188. package/tiles/internal.js.map +1 -1
  189. package/tiles/tile.d.ts.map +1 -1
  190. package/tiles/tile.js +1 -1
  191. package/tiles/tile.js.map +1 -1
  192. package/token-group/internal.d.ts.map +1 -1
  193. package/token-group/internal.js +1 -1
  194. package/token-group/internal.js.map +1 -1
  195. package/top-navigation/1.0-beta/use-top-navigation.js +1 -1
  196. package/top-navigation/1.0-beta/use-top-navigation.js.map +1 -1
  197. package/top-navigation/use-top-navigation.js +1 -1
  198. package/top-navigation/use-top-navigation.js.map +1 -1
  199. package/wizard/internal.d.ts.map +1 -1
  200. package/wizard/internal.js +1 -2
  201. package/wizard/internal.js.map +1 -1
  202. package/internal/hooks/use-merge-refs/index.d.ts +0 -10
  203. package/internal/hooks/use-merge-refs/index.d.ts.map +0 -1
  204. package/internal/hooks/use-merge-refs/index.js +0 -30
  205. package/internal/hooks/use-merge-refs/index.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"use-top-navigation.js","sourceRoot":"","sources":["../../../src/top-navigation/use-top-navigation.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\n\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { TopNavigationProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\ninterface UseTopNavigationParams {\n identity: TopNavigationProps['identity'];\n search: TopNavigationProps['search'];\n utilities: NonNullable<TopNavigationProps['utilities']>;\n}\n\ninterface ResponsiveState {\n hideUtilityText?: boolean;\n hideSearch?: boolean;\n hideUtilities?: number[];\n hideTitle?: boolean;\n}\n\nexport interface TopNavigationSizeConfiguration {\n hasSearch: boolean;\n availableWidth: number;\n utilitiesLeftPadding: number;\n fullIdentityWidth: number;\n titleWidth: number;\n searchSlotWidth: number;\n searchUtilityWidth: number;\n utilityWithLabelWidths: number[];\n utilityWithoutLabelWidths: number[];\n menuTriggerUtilityWidth: number;\n}\n\ninterface UseTopNavigation {\n mainRef: React.Ref<HTMLDivElement>;\n virtualRef: React.Ref<HTMLDivElement>;\n\n responsiveState: ResponsiveState;\n breakpoint: 'default' | 'xxs' | 's';\n isSearchExpanded: boolean;\n onSearchUtilityClick: () => void;\n}\n\n// A small buffer to make calculations more lenient against browser lag or padding adjustments.\nconst RESPONSIVENESS_BUFFER = 20;\n\nexport function useTopNavigation({ identity, search, utilities }: UseTopNavigationParams): UseTopNavigation {\n // Refs and breakpoints\n const mainRef = useRef<HTMLElement | null>(null);\n const virtualRef = useRef<HTMLDivElement | null>(null);\n const [breakpoint, breakpointRef] = useContainerBreakpoints(['xxs', 's']);\n\n // Responsiveness state\n // The component works by calculating the possible resize states that it can\n // be in, and having a state variable to track which state we're currently in.\n const hasSearch = !!search;\n const hasTitleWithLogo = identity && !!identity.logo && !!identity.title;\n const responsiveStates = useMemo<ReadonlyArray<ResponsiveState>>(() => {\n return generateResponsiveStateKeys(utilities, hasSearch, hasTitleWithLogo);\n }, [utilities, hasSearch, hasTitleWithLogo]);\n\n // To hide/show elements dynamically, we need to know how much space they take up,\n // even if they're not being rendered. The top navigation elements are hidden/resized\n // based on the available size or if a search bar is open, and they need to be available\n // for calculations so we know where to toggle them. So we render a second, more stable\n // top-nav off screen to do these calculations against.\n //\n // We can't \"affix\" these values to pixels because they can depend on spacing tokens.\n // It's easier to render all of these utilities separately rather than figuring out\n // spacing token values, icon sizes, text widths, etc.\n const [responsiveState, setResponsiveState] = useState<ResponsiveState | undefined>();\n const recalculateFit = useCallback(() => {\n if (!mainRef?.current || !virtualRef.current) {\n setResponsiveState(responsiveStates[0]);\n return;\n }\n\n // Get available width from the visible top navigation.\n const availableWidth = getContentBoxWidth(mainRef.current.querySelector(`.${styles['padding-box']}`)!);\n if (availableWidth === 0) {\n // Likely in an SSR or Jest situation.\n setResponsiveState(responsiveStates[0]);\n return;\n }\n\n const sizeConfiguration = {\n hasSearch,\n availableWidth,\n\n // Get widths from the hidden top navigation\n fullIdentityWidth: virtualRef.current.querySelector(`.${styles.identity}`)!.getBoundingClientRect().width,\n titleWidth: virtualRef.current.querySelector(`.${styles.title}`)?.getBoundingClientRect().width ?? 0,\n searchSlotWidth: virtualRef.current.querySelector(`.${styles.search}`)?.getBoundingClientRect().width ?? 0,\n searchUtilityWidth: virtualRef.current.querySelector('[data-utility-special=\"search\"]')!.getBoundingClientRect()\n .width,\n utilitiesLeftPadding: parseFloat(\n getComputedStyle(virtualRef.current.querySelector(`.${styles.utilities}`)!).paddingLeft || '0px'\n ),\n utilityWithLabelWidths: Array.prototype.slice\n .call(virtualRef.current.querySelectorAll(`[data-utility-hide=\"false\"]`))\n .map((element: Element) => element.getBoundingClientRect().width),\n utilityWithoutLabelWidths: Array.prototype.slice\n .call(virtualRef.current.querySelectorAll(`[data-utility-hide=\"true\"]`))\n .map((element: Element) => element.getBoundingClientRect().width),\n menuTriggerUtilityWidth: virtualRef.current\n .querySelector('[data-utility-special=\"menu-trigger\"]')!\n .getBoundingClientRect().width,\n };\n setResponsiveState(determineBestResponsiveState(responsiveStates, sizeConfiguration));\n }, [responsiveStates, hasSearch]);\n\n const [, containerQueryRef] = useContainerQuery(() => {\n recalculateFit();\n }, [recalculateFit]);\n\n // Due to being rendered in a portal, the virtual navigation isn't rendered\n // at the same time as the main one.\n const onVirtualMount = useCallback(\n (element: HTMLDivElement | null) => {\n virtualRef.current = element;\n recalculateFit();\n },\n [recalculateFit]\n );\n\n // Search slot expansion on small screens\n const [isSearchMinimized, setSearchMinimized] = useState(true);\n const isSearchExpanded = !isSearchMinimized && hasSearch && responsiveState?.hideSearch;\n\n // If the search was expanded, and then the screen resized so that the\n // expansion is no longer necessary. So we implicitly minimize it.\n useEffect(() => {\n if (!responsiveState?.hideSearch) {\n setSearchMinimized(true);\n }\n }, [responsiveState]);\n\n // If the search is expanded after clicking on the search utility, move\n // the focus to the input. Since this is a user-controlled slot, we're just\n // assuming that it contains an input, though it's a pretty safe guess.\n useEffect(() => {\n if (isSearchExpanded) {\n mainRef?.current?.querySelector<HTMLInputElement>(`.${styles.search} input`)?.focus();\n }\n }, [isSearchExpanded, mainRef]);\n\n const mergedMainRef = useMergeRefs(mainRef, containerQueryRef, breakpointRef);\n\n return {\n mainRef: mergedMainRef,\n virtualRef: onVirtualMount,\n responsiveState: responsiveState ?? responsiveStates[0],\n breakpoint: breakpoint ?? 'default',\n isSearchExpanded: !!isSearchExpanded,\n onSearchUtilityClick: () => setSearchMinimized(isSearchMinimized => !isSearchMinimized),\n };\n}\n\n/**\n * Get the width of the content box (assuming the element's box-sizing is border-box).\n */\nfunction getContentBoxWidth(element: Element): number {\n const style = getComputedStyle(element);\n return (\n parseFloat(style.width || '0px') - parseFloat(style.paddingLeft || '0px') - parseFloat(style.paddingRight || '0px')\n );\n}\n\n/**\n * Generates the series of responsive steps that can be performed on the header in order.\n */\nexport function generateResponsiveStateKeys(\n utilities: ReadonlyArray<TopNavigationProps.Utility>,\n canHideSearch: boolean,\n canHideTitle: boolean\n): ReadonlyArray<ResponsiveState> {\n const states: ResponsiveState[] = [{}];\n if (utilities.some(utility => utility.text)) {\n states.push({ hideUtilityText: true });\n }\n if (canHideSearch) {\n states.push({\n hideUtilityText: true,\n hideSearch: true,\n });\n }\n const hiddenUtilties = [];\n for (let i = 0; i < utilities.length; i++) {\n if (!utilities[i].disableUtilityCollapse) {\n hiddenUtilties.push(i);\n states.push({\n hideUtilityText: true,\n hideSearch: canHideSearch || undefined,\n hideUtilities: hiddenUtilties.length > 0 ? hiddenUtilties.slice() : undefined,\n });\n }\n }\n if (canHideTitle) {\n states.push({\n hideUtilityText: true,\n hideSearch: canHideSearch || undefined,\n hideUtilities: hiddenUtilties.length > 0 ? hiddenUtilties.slice() : undefined,\n hideTitle: true,\n });\n }\n return states;\n}\n\n/**\n * Determines the best responsive state configuration of the top navigation, based on the given list of possible responsive states\n * and the current sizes of all elements inside the navigation bar.\n */\nexport function determineBestResponsiveState(\n possibleStates: ReadonlyArray<ResponsiveState>,\n sizes: TopNavigationSizeConfiguration\n): ResponsiveState {\n const {\n hasSearch,\n availableWidth,\n utilitiesLeftPadding,\n fullIdentityWidth,\n titleWidth,\n searchSlotWidth,\n searchUtilityWidth,\n utilityWithLabelWidths,\n utilityWithoutLabelWidths,\n menuTriggerUtilityWidth,\n } = sizes;\n // Iterate through each state and calculate its expected required width.\n for (const state of possibleStates) {\n const searchWidth = hasSearch ? (state.hideSearch ? searchUtilityWidth : searchSlotWidth) : 0;\n const utilitiesWidth: number = (state.hideUtilityText ? utilityWithoutLabelWidths : utilityWithLabelWidths)\n .filter((_width, i) => !state.hideUtilities || state.hideUtilities.indexOf(i) === -1)\n .reduce((sum, width) => sum + width, 0);\n const menuTriggerWidth = state.hideUtilities ? menuTriggerUtilityWidth : 0;\n const identityWidth = state.hideTitle ? fullIdentityWidth - titleWidth : fullIdentityWidth;\n const expectedInnerWidth = identityWidth + searchWidth + utilitiesLeftPadding + utilitiesWidth + menuTriggerWidth;\n if (expectedInnerWidth <= availableWidth - RESPONSIVENESS_BUFFER) {\n return state;\n }\n }\n\n // If nothing matches, pick the smallest possible state.\n return possibleStates[possibleStates.length - 1];\n}\n"]}
1
+ {"version":3,"file":"use-top-navigation.js","sourceRoot":"","sources":["../../../src/top-navigation/use-top-navigation.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\nimport { useMergeRefs } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport { TopNavigationProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\ninterface UseTopNavigationParams {\n identity: TopNavigationProps['identity'];\n search: TopNavigationProps['search'];\n utilities: NonNullable<TopNavigationProps['utilities']>;\n}\n\ninterface ResponsiveState {\n hideUtilityText?: boolean;\n hideSearch?: boolean;\n hideUtilities?: number[];\n hideTitle?: boolean;\n}\n\nexport interface TopNavigationSizeConfiguration {\n hasSearch: boolean;\n availableWidth: number;\n utilitiesLeftPadding: number;\n fullIdentityWidth: number;\n titleWidth: number;\n searchSlotWidth: number;\n searchUtilityWidth: number;\n utilityWithLabelWidths: number[];\n utilityWithoutLabelWidths: number[];\n menuTriggerUtilityWidth: number;\n}\n\ninterface UseTopNavigation {\n mainRef: React.Ref<HTMLDivElement>;\n virtualRef: React.Ref<HTMLDivElement>;\n\n responsiveState: ResponsiveState;\n breakpoint: 'default' | 'xxs' | 's';\n isSearchExpanded: boolean;\n onSearchUtilityClick: () => void;\n}\n\n// A small buffer to make calculations more lenient against browser lag or padding adjustments.\nconst RESPONSIVENESS_BUFFER = 20;\n\nexport function useTopNavigation({ identity, search, utilities }: UseTopNavigationParams): UseTopNavigation {\n // Refs and breakpoints\n const mainRef = useRef<HTMLElement | null>(null);\n const virtualRef = useRef<HTMLDivElement | null>(null);\n const [breakpoint, breakpointRef] = useContainerBreakpoints(['xxs', 's']);\n\n // Responsiveness state\n // The component works by calculating the possible resize states that it can\n // be in, and having a state variable to track which state we're currently in.\n const hasSearch = !!search;\n const hasTitleWithLogo = identity && !!identity.logo && !!identity.title;\n const responsiveStates = useMemo<ReadonlyArray<ResponsiveState>>(() => {\n return generateResponsiveStateKeys(utilities, hasSearch, hasTitleWithLogo);\n }, [utilities, hasSearch, hasTitleWithLogo]);\n\n // To hide/show elements dynamically, we need to know how much space they take up,\n // even if they're not being rendered. The top navigation elements are hidden/resized\n // based on the available size or if a search bar is open, and they need to be available\n // for calculations so we know where to toggle them. So we render a second, more stable\n // top-nav off screen to do these calculations against.\n //\n // We can't \"affix\" these values to pixels because they can depend on spacing tokens.\n // It's easier to render all of these utilities separately rather than figuring out\n // spacing token values, icon sizes, text widths, etc.\n const [responsiveState, setResponsiveState] = useState<ResponsiveState | undefined>();\n const recalculateFit = useCallback(() => {\n if (!mainRef?.current || !virtualRef.current) {\n setResponsiveState(responsiveStates[0]);\n return;\n }\n\n // Get available width from the visible top navigation.\n const availableWidth = getContentBoxWidth(mainRef.current.querySelector(`.${styles['padding-box']}`)!);\n if (availableWidth === 0) {\n // Likely in an SSR or Jest situation.\n setResponsiveState(responsiveStates[0]);\n return;\n }\n\n const sizeConfiguration = {\n hasSearch,\n availableWidth,\n\n // Get widths from the hidden top navigation\n fullIdentityWidth: virtualRef.current.querySelector(`.${styles.identity}`)!.getBoundingClientRect().width,\n titleWidth: virtualRef.current.querySelector(`.${styles.title}`)?.getBoundingClientRect().width ?? 0,\n searchSlotWidth: virtualRef.current.querySelector(`.${styles.search}`)?.getBoundingClientRect().width ?? 0,\n searchUtilityWidth: virtualRef.current.querySelector('[data-utility-special=\"search\"]')!.getBoundingClientRect()\n .width,\n utilitiesLeftPadding: parseFloat(\n getComputedStyle(virtualRef.current.querySelector(`.${styles.utilities}`)!).paddingLeft || '0px'\n ),\n utilityWithLabelWidths: Array.prototype.slice\n .call(virtualRef.current.querySelectorAll(`[data-utility-hide=\"false\"]`))\n .map((element: Element) => element.getBoundingClientRect().width),\n utilityWithoutLabelWidths: Array.prototype.slice\n .call(virtualRef.current.querySelectorAll(`[data-utility-hide=\"true\"]`))\n .map((element: Element) => element.getBoundingClientRect().width),\n menuTriggerUtilityWidth: virtualRef.current\n .querySelector('[data-utility-special=\"menu-trigger\"]')!\n .getBoundingClientRect().width,\n };\n setResponsiveState(determineBestResponsiveState(responsiveStates, sizeConfiguration));\n }, [responsiveStates, hasSearch]);\n\n const [, containerQueryRef] = useContainerQuery(() => {\n recalculateFit();\n }, [recalculateFit]);\n\n // Due to being rendered in a portal, the virtual navigation isn't rendered\n // at the same time as the main one.\n const onVirtualMount = useCallback(\n (element: HTMLDivElement | null) => {\n virtualRef.current = element;\n recalculateFit();\n },\n [recalculateFit]\n );\n\n // Search slot expansion on small screens\n const [isSearchMinimized, setSearchMinimized] = useState(true);\n const isSearchExpanded = !isSearchMinimized && hasSearch && responsiveState?.hideSearch;\n\n // If the search was expanded, and then the screen resized so that the\n // expansion is no longer necessary. So we implicitly minimize it.\n useEffect(() => {\n if (!responsiveState?.hideSearch) {\n setSearchMinimized(true);\n }\n }, [responsiveState]);\n\n // If the search is expanded after clicking on the search utility, move\n // the focus to the input. Since this is a user-controlled slot, we're just\n // assuming that it contains an input, though it's a pretty safe guess.\n useEffect(() => {\n if (isSearchExpanded) {\n mainRef?.current?.querySelector<HTMLInputElement>(`.${styles.search} input`)?.focus();\n }\n }, [isSearchExpanded, mainRef]);\n\n const mergedMainRef = useMergeRefs(mainRef, containerQueryRef, breakpointRef);\n\n return {\n mainRef: mergedMainRef,\n virtualRef: onVirtualMount,\n responsiveState: responsiveState ?? responsiveStates[0],\n breakpoint: breakpoint ?? 'default',\n isSearchExpanded: !!isSearchExpanded,\n onSearchUtilityClick: () => setSearchMinimized(isSearchMinimized => !isSearchMinimized),\n };\n}\n\n/**\n * Get the width of the content box (assuming the element's box-sizing is border-box).\n */\nfunction getContentBoxWidth(element: Element): number {\n const style = getComputedStyle(element);\n return (\n parseFloat(style.width || '0px') - parseFloat(style.paddingLeft || '0px') - parseFloat(style.paddingRight || '0px')\n );\n}\n\n/**\n * Generates the series of responsive steps that can be performed on the header in order.\n */\nexport function generateResponsiveStateKeys(\n utilities: ReadonlyArray<TopNavigationProps.Utility>,\n canHideSearch: boolean,\n canHideTitle: boolean\n): ReadonlyArray<ResponsiveState> {\n const states: ResponsiveState[] = [{}];\n if (utilities.some(utility => utility.text)) {\n states.push({ hideUtilityText: true });\n }\n if (canHideSearch) {\n states.push({\n hideUtilityText: true,\n hideSearch: true,\n });\n }\n const hiddenUtilties = [];\n for (let i = 0; i < utilities.length; i++) {\n if (!utilities[i].disableUtilityCollapse) {\n hiddenUtilties.push(i);\n states.push({\n hideUtilityText: true,\n hideSearch: canHideSearch || undefined,\n hideUtilities: hiddenUtilties.length > 0 ? hiddenUtilties.slice() : undefined,\n });\n }\n }\n if (canHideTitle) {\n states.push({\n hideUtilityText: true,\n hideSearch: canHideSearch || undefined,\n hideUtilities: hiddenUtilties.length > 0 ? hiddenUtilties.slice() : undefined,\n hideTitle: true,\n });\n }\n return states;\n}\n\n/**\n * Determines the best responsive state configuration of the top navigation, based on the given list of possible responsive states\n * and the current sizes of all elements inside the navigation bar.\n */\nexport function determineBestResponsiveState(\n possibleStates: ReadonlyArray<ResponsiveState>,\n sizes: TopNavigationSizeConfiguration\n): ResponsiveState {\n const {\n hasSearch,\n availableWidth,\n utilitiesLeftPadding,\n fullIdentityWidth,\n titleWidth,\n searchSlotWidth,\n searchUtilityWidth,\n utilityWithLabelWidths,\n utilityWithoutLabelWidths,\n menuTriggerUtilityWidth,\n } = sizes;\n // Iterate through each state and calculate its expected required width.\n for (const state of possibleStates) {\n const searchWidth = hasSearch ? (state.hideSearch ? searchUtilityWidth : searchSlotWidth) : 0;\n const utilitiesWidth: number = (state.hideUtilityText ? utilityWithoutLabelWidths : utilityWithLabelWidths)\n .filter((_width, i) => !state.hideUtilities || state.hideUtilities.indexOf(i) === -1)\n .reduce((sum, width) => sum + width, 0);\n const menuTriggerWidth = state.hideUtilities ? menuTriggerUtilityWidth : 0;\n const identityWidth = state.hideTitle ? fullIdentityWidth - titleWidth : fullIdentityWidth;\n const expectedInnerWidth = identityWidth + searchWidth + utilitiesLeftPadding + utilitiesWidth + menuTriggerWidth;\n if (expectedInnerWidth <= availableWidth - RESPONSIVENESS_BUFFER) {\n return state;\n }\n }\n\n // If nothing matches, pick the smallest possible state.\n return possibleStates[possibleStates.length - 1];\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/wizard/internal.tsx"],"names":[],"mappings":";AAqBA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAMlF,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAM3C,KAAK,mBAAmB,GAAG,WAAW,GACpC,0BAA0B,GAAG;IAC3B,kCAAkC,CAAC,EAAE,OAAO,CAAC;CAC9C,CAAC;AAEJ,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,KAAK,EACL,eAAe,EAAE,yBAAyB,EAC1C,gBAAgB,EAChB,iBAAyB,EACzB,WAAmB,EACnB,gBAAgB,EAChB,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,iBAAiB,EACjB,kCAA0C,EAC1C,GAAG,IAAI,EACR,EAAE,mBAAmB,eAmKrB"}
1
+ {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/wizard/internal.tsx"],"names":[],"mappings":";AAqBA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAKlF,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAM3C,KAAK,mBAAmB,GAAG,WAAW,GACpC,0BAA0B,GAAG;IAC3B,kCAAkC,CAAC,EAAE,OAAO,CAAC;CAC9C,CAAC;AAEJ,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,KAAK,EACL,eAAe,EAAE,yBAAyB,EAC1C,gBAAgB,EAChB,iBAAyB,EACzB,WAAmB,EACnB,gBAAgB,EAChB,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,iBAAiB,EACjB,kCAA0C,EAC1C,GAAG,IAAI,EACR,EAAE,mBAAmB,eAmKrB"}
@@ -3,7 +3,7 @@ import { __rest } from "tslib";
3
3
  // SPDX-License-Identifier: Apache-2.0
4
4
  import React, { useRef } from 'react';
5
5
  import clsx from 'clsx';
6
- import { warnOnce } from '@cloudscape-design/component-toolkit/internal';
6
+ import { useMergeRefs, warnOnce } from '@cloudscape-design/component-toolkit/internal';
7
7
  import { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';
8
8
  import { useInternalI18n } from '../i18n/context';
9
9
  import { FunnelMetrics } from '../internal/analytics';
@@ -13,7 +13,6 @@ import { getBaseProps } from '../internal/base-component';
13
13
  import { fireNonCancelableEvent } from '../internal/events';
14
14
  import { useContainerBreakpoints } from '../internal/hooks/container-queries';
15
15
  import { useControllable } from '../internal/hooks/use-controllable';
16
- import { useMergeRefs } from '../internal/hooks/use-merge-refs';
17
16
  import { useVisualRefresh } from '../internal/hooks/use-visual-mode';
18
17
  import { useFunnelChangeEvent } from './analytics';
19
18
  import WizardForm, { STEP_NAME_SELECTOR } from './wizard-form';
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/wizard/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,QAAQ,EAAE,MAAM,+CAA+C,CAAC;AACzE,OAAO,EAAE,6BAA6B,EAAE,MAAM,kEAAkE,CAAC;AAEjH,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EACL,oBAAoB,EACpB,sBAAsB,EACtB,oBAAoB,EACpB,qBAAqB,EACrB,mBAAmB,GACpB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,OAAO,EAAE,uBAAuB,EAAE,MAAM,qCAAqC,CAAC;AAE9E,OAAO,EAAE,eAAe,EAAE,MAAM,oCAAoC,CAAC;AACrE,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AACrE,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAGnD,OAAO,UAAU,EAAE,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AAC/D,OAAO,gBAAgB,MAAM,qBAAqB,CAAC;AAEnD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAOrC,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EAajB;;QAbiB,EACrC,KAAK,EACL,eAAe,EAAE,yBAAyB,EAC1C,gBAAgB,EAChB,iBAAiB,GAAG,KAAK,EACzB,WAAW,GAAG,KAAK,EACnB,gBAAgB,EAChB,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,iBAAiB,EACjB,kCAAkC,GAAG,KAAK,OAEtB,EADjB,IAAI,cAZ8B,yMAatC,CADQ;IAEP,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IAErC,MAAM,CAAC,UAAU,EAAE,cAAc,CAAC,GAAG,uBAAuB,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;IACrE,MAAM,GAAG,GAAG,YAAY,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;IAE5D,MAAM,cAAc,GAAG,UAAU,KAAK,SAAS,CAAC;IAEhD,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,eAAe,CAAC,yBAAyB,EAAE,UAAU,EAAE,CAAC,EAAE;QACtG,aAAa,EAAE,QAAQ;QACvB,cAAc,EAAE,iBAAiB;QACjC,aAAa,EAAE,YAAY;KAC5B,CAAC,CAAC;IACH,MAAM,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,yBAAyB,EAAE,GACjH,SAAS,EAAE,CAAC;IACd,MAAM,qBAAqB,GAAG,eAAe,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,eAAe,EAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAEhG,MAAM,iBAAiB,GAAG,MAAM,CAAS,qBAAqB,CAAC,CAAC;IAChE,iBAAiB,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,OAAO,EAAE,qBAAqB,CAAC,CAAC;IAEvF,MAAM,eAAe,GAAG,gBAAgB,EAAE,CAAC;IAC3C,MAAM,UAAU,GAAG,qBAAqB,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;IAE7D,MAAM,eAAe,GAAG,CAAC,kBAA0B,EAAE,MAAoC,EAAE,EAAE;QAC3F,IAAI,mBAAmB,EAAE;YACvB,MAAM,QAAQ,GAAG,mBAAmB,CAAC,kBAAkB,CAAC,CAAC;YAEzD,aAAa,CAAC,oBAAoB,CAAC;gBACjC,cAAc,EAAE,MAAM;gBACtB,mBAAmB;gBACnB,UAAU,EAAE,qBAAqB,GAAG,CAAC;gBACrC,QAAQ;gBACR,gBAAgB,EAAE,kBAAkB;gBACpC,qBAAqB,EAAE,kBAAkB,GAAG,CAAC;gBAC7C,kBAAkB,EAAE,qBAAqB,EAAE;aAC5C,CAAC,CAAC;SACJ;QAED,kBAAkB,CAAC,kBAAkB,CAAC,CAAC;QACvC,sBAAsB,CAAC,UAAU,EAAE,EAAE,kBAAkB,EAAE,MAAM,EAAE,CAAC,CAAC;IACrE,CAAC,CAAC;IACF,MAAM,WAAW,GAAG,CAAC,SAAiB,EAAE,EAAE,CAAC,eAAe,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;IAC9E,MAAM,aAAa,GAAG,CAAC,SAAiB,EAAE,EAAE,CAAC,eAAe,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;IAChF,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,YAAY,EAAE,CAAC;QACf,sBAAsB,CAAC,QAAQ,CAAC,CAAC;IACnC,CAAC,CAAC;IACF,MAAM,eAAe,GAAG,GAAG,EAAE,CAAC,eAAe,CAAC,qBAAqB,GAAG,CAAC,EAAE,UAAU,CAAC,CAAC;IACrF,MAAM,cAAc,GAAG,GAAG,EAAE;QAC1B,yBAAyB,EAAE,CAAC;QAE5B,IAAI,UAAU,EAAE;YACd,YAAY,EAAE,CAAC;YACf,sBAAsB,CAAC,QAAQ,CAAC,CAAC;SAClC;aAAM;YACL,eAAe,CAAC,qBAAqB,GAAG,CAAC,EAAE,MAAM,CAAC,CAAC;SACpD;IACH,CAAC,CAAC;IAEF,oBAAoB,CAAC,mBAAmB,EAAE,gBAAgB,EAAE,KAAK,CAAC,CAAC;IAEnE,MAAM,IAAI,GAAG,eAAe,CAAC,QAAQ,CAAC,CAAC;IACvC,MAAM,iBAAiB,GAAG,IAAI,CAC5B,+BAA+B,EAC/B,MAAA,IAAI,CAAC,WAAW,0CAAE,iBAAiB,EACnC,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,WAAW,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,CACtD,CAAC;IAEF,MAAM,WAAW,mCACZ,IAAI,CAAC,WAAW,KACnB,iBAAiB,EACjB,eAAe,EAAE,IAAI,CACnB,6BAA6B,EAC7B,MAAA,IAAI,CAAC,WAAW,0CAAE,eAAe,EACjC,MAAM,CAAC,EAAE,CAAC,UAAU,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,UAAU,EAAE,CAAC,CAC/C,EACD,mBAAmB,EAAE,IAAI,CACvB,iCAAiC,EACjC,MAAA,IAAI,CAAC,WAAW,0CAAE,mBAAmB,EACrC,MAAM,CAAC,EAAE,CAAC,CAAC,UAAU,EAAE,UAAU,EAAE,EAAE,CAAC,MAAM,CAAC,EAAE,UAAU,EAAE,UAAU,EAAE,CAAC,CACzE,EACD,mBAAmB,EAAE,IAAI,CAAC,iCAAiC,EAAE,MAAA,IAAI,CAAC,WAAW,0CAAE,mBAAmB,CAAC,EACnG,YAAY,EAAE,IAAI,CAAC,0BAA0B,EAAE,MAAA,IAAI,CAAC,WAAW,0CAAE,YAAY,CAAC,EAC9E,cAAc,EAAE,IAAI,CAAC,4BAA4B,EAAE,MAAA,IAAI,CAAC,WAAW,0CAAE,cAAc,CAAC,EACpF,UAAU,EAAE,IAAI,CAAC,wBAAwB,EAAE,MAAA,IAAI,CAAC,WAAW,0CAAE,UAAU,CAAC,EACxE,QAAQ,EAAE,IAAI,CAAC,sBAAsB,EAAE,MAAA,IAAI,CAAC,WAAW,0CAAE,QAAQ,CAAC,GACnE,CAAC;IAEF,IAAI,eAAe,IAAI,eAAe,IAAI,KAAK,CAAC,MAAM,EAAE;QACtD,QAAQ,CACN,QAAQ,EACR,uCAAuC,eAAe,+BACpD,KAAK,CAAC,MACR,uDAAuD,KAAK,CAAC,MAAM,GAAG,CAAC,WAAW,CACnF,CAAC;KACH;IAED,IAAI,WAAW,IAAI,CAAC,iBAAiB,EAAE;QACrC,QAAQ,CACN,QAAQ,EACR,oIAAoI,CACrI,CAAC;KACH;IAED,MAAM,0BAA0B,GAA8C;QAC5E,IAAI,EAAE,cAAc;QACpB,KAAK,EAAE;YACL,IAAI,EAAE,MAAM;YACZ,QAAQ,EAAE,IAAI,oBAAoB,KAAK,sBAAsB,IAAI;SAClE;QACD,UAAU,kBACR,UAAU,EAAE,GAAG,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,MAAM,EAAE,EACrC,eAAe,EAAE,GAAG,eAAe,EAAE,EACrC,eAAe,EAAE,IAAI,oBAAoB,KAAK,oBAAoB,IAAI,IACnE,CAAC,IAAI,CAAC,iBAAiB,IAAI,EAAE,CAAC,CAClC;KACF,CAAC;IAEF,OAAO,CACL,6CACM,SAAS,EACT,WAAW,IACf,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,SAAS,CAAC,IAC7C,CAAC,kCAAkC;QACrC,CAAC,CAAC,6BAA6B,CAAC,EAAE,SAAS,EAAE,0BAA0B,EAAE,CAAC;QAC1E,CAAC,CAAC,EAAE,CAAC;QAEP,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,eAAe,IAAI,MAAM,CAAC,OAAO,EAAE,cAAc,IAAI,MAAM,CAAC,iBAAiB,CAAC,CAAC;YAE9G,oBAAC,gBAAgB,IACf,eAAe,EAAE,qBAAqB,EACtC,iBAAiB,EAAE,iBAAiB,CAAC,OAAO,EAC5C,WAAW,EAAE,WAAW,EACxB,MAAM,EAAE,cAAc,EACtB,WAAW,EAAE,WAAW,EACxB,iBAAiB,EAAE,iBAAiB,EACpC,WAAW,EAAE,WAAW,EACxB,aAAa,EAAE,aAAa,EAC5B,KAAK,EAAE,KAAK,GACZ;YACF,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,eAAe,IAAI,MAAM,CAAC,OAAO,EAAE,cAAc,IAAI,MAAM,CAAC,iBAAiB,CAAC,CAAC;gBAE5G,oBAAC,UAAU,IACT,KAAK,EAAE,KAAK,EACZ,kBAAkB,EAAE,cAAc,EAClC,WAAW,EAAE,WAAW,EACxB,gBAAgB,EAAE,gBAAgB,EAClC,eAAe,EAAE,qBAAqB,EACtC,gBAAgB,EAAE,iBAAiB,EACnC,WAAW,EAAE,WAAW,EACxB,gBAAgB,EAAE,gBAAgB,EAClC,aAAa,EAAE,aAAa,EAC5B,eAAe,EAAE,eAAe,EAChC,aAAa,EAAE,aAAa,EAC5B,cAAc,EAAE,cAAc,GAC9B,CACE,CACF,CACF,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { useInternalI18n } from '../i18n/context';\nimport { FunnelMetrics } from '../internal/analytics';\nimport { useFunnel } from '../internal/analytics/hooks/use-funnel';\nimport {\n DATA_ATTR_FUNNEL_KEY,\n FUNNEL_KEY_FUNNEL_NAME,\n FUNNEL_KEY_STEP_NAME,\n getSubStepAllSelector,\n getTextFromSelector,\n} from '../internal/analytics/selectors';\nimport { getBaseProps } from '../internal/base-component';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useControllable } from '../internal/hooks/use-controllable';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { useFunnelChangeEvent } from './analytics';\nimport { GeneratedAnalyticsMetadataWizardComponent } from './analytics-metadata/interfaces';\nimport { WizardProps } from './interfaces';\nimport WizardForm, { STEP_NAME_SELECTOR } from './wizard-form';\nimport WizardNavigation from './wizard-navigation';\n\nimport styles from './styles.css.js';\n\ntype InternalWizardProps = WizardProps &\n InternalBaseComponentProps & {\n __injectAnalyticsComponentMetadata?: boolean;\n };\n\nexport default function InternalWizard({\n steps,\n activeStepIndex: controlledActiveStepIndex,\n submitButtonText,\n isLoadingNextStep = false,\n allowSkipTo = false,\n secondaryActions,\n onCancel,\n onSubmit,\n onNavigate,\n __internalRootRef,\n __injectAnalyticsComponentMetadata = false,\n ...rest\n}: InternalWizardProps) {\n const baseProps = getBaseProps(rest);\n\n const [breakpoint, breakpointsRef] = useContainerBreakpoints(['xs']);\n const ref = useMergeRefs(breakpointsRef, __internalRootRef);\n\n const smallContainer = breakpoint === 'default';\n\n const [activeStepIndex, setActiveStepIndex] = useControllable(controlledActiveStepIndex, onNavigate, 0, {\n componentName: 'Wizard',\n controlledProp: 'activeStepIndex',\n changeHandler: 'onNavigate',\n });\n const { funnelIdentifier, funnelInteractionId, funnelSubmit, funnelCancel, funnelProps, funnelNextOrSubmitAttempt } =\n useFunnel();\n const actualActiveStepIndex = activeStepIndex ? Math.min(activeStepIndex, steps.length - 1) : 0;\n\n const farthestStepIndex = useRef<number>(actualActiveStepIndex);\n farthestStepIndex.current = Math.max(farthestStepIndex.current, actualActiveStepIndex);\n\n const isVisualRefresh = useVisualRefresh();\n const isLastStep = actualActiveStepIndex >= steps.length - 1;\n\n const navigationEvent = (requestedStepIndex: number, reason: WizardProps.NavigationReason) => {\n if (funnelInteractionId) {\n const stepName = getTextFromSelector(STEP_NAME_SELECTOR);\n\n FunnelMetrics.funnelStepNavigation({\n navigationType: reason,\n funnelInteractionId,\n stepNumber: actualActiveStepIndex + 1,\n stepName,\n stepNameSelector: STEP_NAME_SELECTOR,\n destinationStepNumber: requestedStepIndex + 1,\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n\n setActiveStepIndex(requestedStepIndex);\n fireNonCancelableEvent(onNavigate, { requestedStepIndex, reason });\n };\n const onStepClick = (stepIndex: number) => navigationEvent(stepIndex, 'step');\n const onSkipToClick = (stepIndex: number) => navigationEvent(stepIndex, 'skip');\n const onCancelClick = () => {\n funnelCancel();\n fireNonCancelableEvent(onCancel);\n };\n const onPreviousClick = () => navigationEvent(actualActiveStepIndex - 1, 'previous');\n const onPrimaryClick = () => {\n funnelNextOrSubmitAttempt();\n\n if (isLastStep) {\n funnelSubmit();\n fireNonCancelableEvent(onSubmit);\n } else {\n navigationEvent(actualActiveStepIndex + 1, 'next');\n }\n };\n\n useFunnelChangeEvent(funnelInteractionId, funnelIdentifier, steps);\n\n const i18n = useInternalI18n('wizard');\n const skipToButtonLabel = i18n(\n 'i18nStrings.skipToButtonLabel',\n rest.i18nStrings?.skipToButtonLabel,\n format => task => format({ task__title: task.title })\n );\n\n const i18nStrings: WizardProps.I18nStrings = {\n ...rest.i18nStrings,\n skipToButtonLabel,\n stepNumberLabel: i18n(\n 'i18nStrings.stepNumberLabel',\n rest.i18nStrings?.stepNumberLabel,\n format => stepNumber => format({ stepNumber })\n ),\n collapsedStepsLabel: i18n(\n 'i18nStrings.collapsedStepsLabel',\n rest.i18nStrings?.collapsedStepsLabel,\n format => (stepNumber, stepsCount) => format({ stepNumber, stepsCount })\n ),\n navigationAriaLabel: i18n('i18nStrings.navigationAriaLabel', rest.i18nStrings?.navigationAriaLabel),\n cancelButton: i18n('i18nStrings.cancelButton', rest.i18nStrings?.cancelButton),\n previousButton: i18n('i18nStrings.previousButton', rest.i18nStrings?.previousButton),\n nextButton: i18n('i18nStrings.nextButton', rest.i18nStrings?.nextButton),\n optional: i18n('i18nStrings.optional', rest.i18nStrings?.optional),\n };\n\n if (activeStepIndex && activeStepIndex >= steps.length) {\n warnOnce(\n 'Wizard',\n `You have set \\`activeStepIndex\\` to ${activeStepIndex} but you have provided only ${\n steps.length\n } steps. Its value is ignored and the component uses ${steps.length - 1} instead.`\n );\n }\n\n if (allowSkipTo && !skipToButtonLabel) {\n warnOnce(\n 'Wizard',\n `You have set \\`allowSkipTo\\` but you have not provided \\`i18nStrings.skipToButtonLabel\\`. The skip-to button will not be rendered.`\n );\n }\n\n const componentAnalyticsMetadata: GeneratedAnalyticsMetadataWizardComponent = {\n name: 'awsui.Wizard',\n label: {\n root: 'body',\n selector: `[${DATA_ATTR_FUNNEL_KEY}=\"${FUNNEL_KEY_FUNNEL_NAME}\"]`,\n },\n properties: {\n stepsCount: `${(steps || []).length}`,\n activeStepIndex: `${activeStepIndex}`,\n activeStepLabel: `[${DATA_ATTR_FUNNEL_KEY}=\"${FUNNEL_KEY_STEP_NAME}\"]`,\n ...(rest.analyticsMetadata || {}),\n },\n };\n\n return (\n <div\n {...baseProps}\n {...funnelProps}\n ref={ref}\n className={clsx(styles.root, baseProps.className)}\n {...(__injectAnalyticsComponentMetadata\n ? getAnalyticsMetadataAttribute({ component: componentAnalyticsMetadata })\n : {})}\n >\n <div\n className={clsx(styles.wizard, isVisualRefresh && styles.refresh, smallContainer && styles['small-container'])}\n >\n <WizardNavigation\n activeStepIndex={actualActiveStepIndex}\n farthestStepIndex={farthestStepIndex.current}\n allowSkipTo={allowSkipTo}\n hidden={smallContainer}\n i18nStrings={i18nStrings}\n isLoadingNextStep={isLoadingNextStep}\n onStepClick={onStepClick}\n onSkipToClick={onSkipToClick}\n steps={steps}\n />\n <div\n className={clsx(styles.form, isVisualRefresh && styles.refresh, smallContainer && styles['small-container'])}\n >\n <WizardForm\n steps={steps}\n showCollapsedSteps={smallContainer}\n i18nStrings={i18nStrings}\n submitButtonText={submitButtonText}\n activeStepIndex={actualActiveStepIndex}\n isPrimaryLoading={isLoadingNextStep}\n allowSkipTo={allowSkipTo}\n secondaryActions={secondaryActions}\n onCancelClick={onCancelClick}\n onPreviousClick={onPreviousClick}\n onSkipToClick={onSkipToClick}\n onPrimaryClick={onPrimaryClick}\n />\n </div>\n </div>\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/wizard/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, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useMergeRefs, warnOnce } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { useInternalI18n } from '../i18n/context';\nimport { FunnelMetrics } from '../internal/analytics';\nimport { useFunnel } from '../internal/analytics/hooks/use-funnel';\nimport {\n DATA_ATTR_FUNNEL_KEY,\n FUNNEL_KEY_FUNNEL_NAME,\n FUNNEL_KEY_STEP_NAME,\n getSubStepAllSelector,\n getTextFromSelector,\n} from '../internal/analytics/selectors';\nimport { getBaseProps } from '../internal/base-component';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useControllable } from '../internal/hooks/use-controllable';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { useFunnelChangeEvent } from './analytics';\nimport { GeneratedAnalyticsMetadataWizardComponent } from './analytics-metadata/interfaces';\nimport { WizardProps } from './interfaces';\nimport WizardForm, { STEP_NAME_SELECTOR } from './wizard-form';\nimport WizardNavigation from './wizard-navigation';\n\nimport styles from './styles.css.js';\n\ntype InternalWizardProps = WizardProps &\n InternalBaseComponentProps & {\n __injectAnalyticsComponentMetadata?: boolean;\n };\n\nexport default function InternalWizard({\n steps,\n activeStepIndex: controlledActiveStepIndex,\n submitButtonText,\n isLoadingNextStep = false,\n allowSkipTo = false,\n secondaryActions,\n onCancel,\n onSubmit,\n onNavigate,\n __internalRootRef,\n __injectAnalyticsComponentMetadata = false,\n ...rest\n}: InternalWizardProps) {\n const baseProps = getBaseProps(rest);\n\n const [breakpoint, breakpointsRef] = useContainerBreakpoints(['xs']);\n const ref = useMergeRefs(breakpointsRef, __internalRootRef);\n\n const smallContainer = breakpoint === 'default';\n\n const [activeStepIndex, setActiveStepIndex] = useControllable(controlledActiveStepIndex, onNavigate, 0, {\n componentName: 'Wizard',\n controlledProp: 'activeStepIndex',\n changeHandler: 'onNavigate',\n });\n const { funnelIdentifier, funnelInteractionId, funnelSubmit, funnelCancel, funnelProps, funnelNextOrSubmitAttempt } =\n useFunnel();\n const actualActiveStepIndex = activeStepIndex ? Math.min(activeStepIndex, steps.length - 1) : 0;\n\n const farthestStepIndex = useRef<number>(actualActiveStepIndex);\n farthestStepIndex.current = Math.max(farthestStepIndex.current, actualActiveStepIndex);\n\n const isVisualRefresh = useVisualRefresh();\n const isLastStep = actualActiveStepIndex >= steps.length - 1;\n\n const navigationEvent = (requestedStepIndex: number, reason: WizardProps.NavigationReason) => {\n if (funnelInteractionId) {\n const stepName = getTextFromSelector(STEP_NAME_SELECTOR);\n\n FunnelMetrics.funnelStepNavigation({\n navigationType: reason,\n funnelInteractionId,\n stepNumber: actualActiveStepIndex + 1,\n stepName,\n stepNameSelector: STEP_NAME_SELECTOR,\n destinationStepNumber: requestedStepIndex + 1,\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n\n setActiveStepIndex(requestedStepIndex);\n fireNonCancelableEvent(onNavigate, { requestedStepIndex, reason });\n };\n const onStepClick = (stepIndex: number) => navigationEvent(stepIndex, 'step');\n const onSkipToClick = (stepIndex: number) => navigationEvent(stepIndex, 'skip');\n const onCancelClick = () => {\n funnelCancel();\n fireNonCancelableEvent(onCancel);\n };\n const onPreviousClick = () => navigationEvent(actualActiveStepIndex - 1, 'previous');\n const onPrimaryClick = () => {\n funnelNextOrSubmitAttempt();\n\n if (isLastStep) {\n funnelSubmit();\n fireNonCancelableEvent(onSubmit);\n } else {\n navigationEvent(actualActiveStepIndex + 1, 'next');\n }\n };\n\n useFunnelChangeEvent(funnelInteractionId, funnelIdentifier, steps);\n\n const i18n = useInternalI18n('wizard');\n const skipToButtonLabel = i18n(\n 'i18nStrings.skipToButtonLabel',\n rest.i18nStrings?.skipToButtonLabel,\n format => task => format({ task__title: task.title })\n );\n\n const i18nStrings: WizardProps.I18nStrings = {\n ...rest.i18nStrings,\n skipToButtonLabel,\n stepNumberLabel: i18n(\n 'i18nStrings.stepNumberLabel',\n rest.i18nStrings?.stepNumberLabel,\n format => stepNumber => format({ stepNumber })\n ),\n collapsedStepsLabel: i18n(\n 'i18nStrings.collapsedStepsLabel',\n rest.i18nStrings?.collapsedStepsLabel,\n format => (stepNumber, stepsCount) => format({ stepNumber, stepsCount })\n ),\n navigationAriaLabel: i18n('i18nStrings.navigationAriaLabel', rest.i18nStrings?.navigationAriaLabel),\n cancelButton: i18n('i18nStrings.cancelButton', rest.i18nStrings?.cancelButton),\n previousButton: i18n('i18nStrings.previousButton', rest.i18nStrings?.previousButton),\n nextButton: i18n('i18nStrings.nextButton', rest.i18nStrings?.nextButton),\n optional: i18n('i18nStrings.optional', rest.i18nStrings?.optional),\n };\n\n if (activeStepIndex && activeStepIndex >= steps.length) {\n warnOnce(\n 'Wizard',\n `You have set \\`activeStepIndex\\` to ${activeStepIndex} but you have provided only ${\n steps.length\n } steps. Its value is ignored and the component uses ${steps.length - 1} instead.`\n );\n }\n\n if (allowSkipTo && !skipToButtonLabel) {\n warnOnce(\n 'Wizard',\n `You have set \\`allowSkipTo\\` but you have not provided \\`i18nStrings.skipToButtonLabel\\`. The skip-to button will not be rendered.`\n );\n }\n\n const componentAnalyticsMetadata: GeneratedAnalyticsMetadataWizardComponent = {\n name: 'awsui.Wizard',\n label: {\n root: 'body',\n selector: `[${DATA_ATTR_FUNNEL_KEY}=\"${FUNNEL_KEY_FUNNEL_NAME}\"]`,\n },\n properties: {\n stepsCount: `${(steps || []).length}`,\n activeStepIndex: `${activeStepIndex}`,\n activeStepLabel: `[${DATA_ATTR_FUNNEL_KEY}=\"${FUNNEL_KEY_STEP_NAME}\"]`,\n ...(rest.analyticsMetadata || {}),\n },\n };\n\n return (\n <div\n {...baseProps}\n {...funnelProps}\n ref={ref}\n className={clsx(styles.root, baseProps.className)}\n {...(__injectAnalyticsComponentMetadata\n ? getAnalyticsMetadataAttribute({ component: componentAnalyticsMetadata })\n : {})}\n >\n <div\n className={clsx(styles.wizard, isVisualRefresh && styles.refresh, smallContainer && styles['small-container'])}\n >\n <WizardNavigation\n activeStepIndex={actualActiveStepIndex}\n farthestStepIndex={farthestStepIndex.current}\n allowSkipTo={allowSkipTo}\n hidden={smallContainer}\n i18nStrings={i18nStrings}\n isLoadingNextStep={isLoadingNextStep}\n onStepClick={onStepClick}\n onSkipToClick={onSkipToClick}\n steps={steps}\n />\n <div\n className={clsx(styles.form, isVisualRefresh && styles.refresh, smallContainer && styles['small-container'])}\n >\n <WizardForm\n steps={steps}\n showCollapsedSteps={smallContainer}\n i18nStrings={i18nStrings}\n submitButtonText={submitButtonText}\n activeStepIndex={actualActiveStepIndex}\n isPrimaryLoading={isLoadingNextStep}\n allowSkipTo={allowSkipTo}\n secondaryActions={secondaryActions}\n onCancelClick={onCancelClick}\n onPreviousClick={onPreviousClick}\n onSkipToClick={onSkipToClick}\n onPrimaryClick={onPrimaryClick}\n />\n </div>\n </div>\n </div>\n );\n}\n"]}
@@ -1,10 +0,0 @@
1
- import React from 'react';
2
- /**
3
- * useMergeRefs merges multiple refs into single ref callback.
4
- *
5
- * For example
6
- * const mergedRef = useMergeRefs(ref1, ref2, ref3)
7
- * <div ref={refs}>...</div>
8
- */
9
- export declare function useMergeRefs<T = any>(...refs: Array<React.RefCallback<T> | React.MutableRefObject<T> | null | undefined>): React.RefCallback<T> | null;
10
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-merge-refs/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC;;;;;;GAMG;AACH,wBAAgB,YAAY,CAAC,CAAC,GAAG,GAAG,EAClC,GAAG,IAAI,EAAE,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC,GAClF,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,GAAG,IAAI,CAiB7B"}
@@ -1,30 +0,0 @@
1
- // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
- // SPDX-License-Identifier: Apache-2.0
3
- import { useMemo } from 'react';
4
- /**
5
- * useMergeRefs merges multiple refs into single ref callback.
6
- *
7
- * For example
8
- * const mergedRef = useMergeRefs(ref1, ref2, ref3)
9
- * <div ref={refs}>...</div>
10
- */
11
- export function useMergeRefs(...refs) {
12
- return useMemo(() => {
13
- if (refs.every(ref => ref === null || ref === undefined)) {
14
- return null;
15
- }
16
- return (value) => {
17
- refs.forEach(ref => {
18
- if (typeof ref === 'function') {
19
- ref(value);
20
- }
21
- else if (ref !== null && ref !== undefined) {
22
- ref.current = value;
23
- }
24
- });
25
- };
26
- // ESLint expects an array literal which we can not provide here
27
- // eslint-disable-next-line react-hooks/exhaustive-deps
28
- }, refs);
29
- }
30
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-merge-refs/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAc,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEvC;;;;;;GAMG;AACH,MAAM,UAAU,YAAY,CAC1B,GAAG,IAAgF;IAEnF,OAAO,OAAO,CAAC,GAAG,EAAE;QAClB,IAAI,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,IAAI,IAAI,GAAG,KAAK,SAAS,CAAC,EAAE;YACxD,OAAO,IAAI,CAAC;SACb;QACD,OAAO,CAAC,KAAe,EAAE,EAAE;YACzB,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE;gBACjB,IAAI,OAAO,GAAG,KAAK,UAAU,EAAE;oBAC7B,GAAG,CAAC,KAAK,CAAC,CAAC;iBACZ;qBAAM,IAAI,GAAG,KAAK,IAAI,IAAI,GAAG,KAAK,SAAS,EAAE;oBAC3C,GAAmC,CAAC,OAAO,GAAG,KAAK,CAAC;iBACtD;YACH,CAAC,CAAC,CAAC;QACL,CAAC,CAAC;QACF,gEAAgE;QAChE,uDAAuD;IACzD,CAAC,EAAE,IAAI,CAAC,CAAC;AACX,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useMemo } from 'react';\n\n/**\n * useMergeRefs merges multiple refs into single ref callback.\n *\n * For example\n * const mergedRef = useMergeRefs(ref1, ref2, ref3)\n * <div ref={refs}>...</div>\n */\nexport function useMergeRefs<T = any>(\n ...refs: Array<React.RefCallback<T> | React.MutableRefObject<T> | null | undefined>\n): React.RefCallback<T> | null {\n return useMemo(() => {\n if (refs.every(ref => ref === null || ref === undefined)) {\n return null;\n }\n return (value: T | null) => {\n refs.forEach(ref => {\n if (typeof ref === 'function') {\n ref(value);\n } else if (ref !== null && ref !== undefined) {\n (ref as React.MutableRefObject<any>).current = value;\n }\n });\n };\n // ESLint expects an array literal which we can not provide here\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, refs);\n}\n"]}