@cloudscape-design/components 3.0.235 → 3.0.237

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 (139) hide show
  1. package/app-layout/drawer/index.d.ts +2 -5
  2. package/app-layout/drawer/index.d.ts.map +1 -1
  3. package/app-layout/drawer/index.js.map +1 -1
  4. package/app-layout/index.d.ts.map +1 -1
  5. package/app-layout/index.js +20 -15
  6. package/app-layout/index.js.map +1 -1
  7. package/app-layout/utils/use-focus-control.d.ts +8 -6
  8. package/app-layout/utils/use-focus-control.d.ts.map +1 -1
  9. package/app-layout/utils/use-focus-control.js +21 -10
  10. package/app-layout/utils/use-focus-control.js.map +1 -1
  11. package/app-layout/utils/use-split-panel-focus-control.d.ts +21 -0
  12. package/app-layout/utils/use-split-panel-focus-control.d.ts.map +1 -0
  13. package/app-layout/utils/use-split-panel-focus-control.js +32 -0
  14. package/app-layout/utils/use-split-panel-focus-control.js.map +1 -0
  15. package/app-layout/visual-refresh/app-bar.d.ts.map +1 -1
  16. package/app-layout/visual-refresh/app-bar.js +3 -6
  17. package/app-layout/visual-refresh/app-bar.js.map +1 -1
  18. package/app-layout/visual-refresh/context.d.ts +6 -2
  19. package/app-layout/visual-refresh/context.d.ts.map +1 -1
  20. package/app-layout/visual-refresh/context.js +24 -11
  21. package/app-layout/visual-refresh/context.js.map +1 -1
  22. package/app-layout/visual-refresh/navigation.d.ts.map +1 -1
  23. package/app-layout/visual-refresh/navigation.js +3 -5
  24. package/app-layout/visual-refresh/navigation.js.map +1 -1
  25. package/app-layout/visual-refresh/split-panel.d.ts.map +1 -1
  26. package/app-layout/visual-refresh/split-panel.js +4 -8
  27. package/app-layout/visual-refresh/split-panel.js.map +1 -1
  28. package/app-layout/visual-refresh/tools.js +5 -6
  29. package/app-layout/visual-refresh/tools.js.map +1 -1
  30. package/autosuggest/internal.d.ts.map +1 -1
  31. package/autosuggest/internal.js +10 -4
  32. package/autosuggest/internal.js.map +1 -1
  33. package/breadcrumb-group/internal.d.ts.map +1 -1
  34. package/breadcrumb-group/internal.js +2 -2
  35. package/breadcrumb-group/internal.js.map +1 -1
  36. package/breadcrumb-group/styles.css.js +7 -6
  37. package/breadcrumb-group/styles.scoped.css +14 -11
  38. package/breadcrumb-group/styles.selectors.js +7 -6
  39. package/button/index.d.ts.map +1 -1
  40. package/button/index.js +2 -2
  41. package/button/index.js.map +1 -1
  42. package/button/interfaces.d.ts +4 -0
  43. package/button/interfaces.d.ts.map +1 -1
  44. package/button/interfaces.js.map +1 -1
  45. package/calendar/grid/index.d.ts +1 -1
  46. package/calendar/grid/index.d.ts.map +1 -1
  47. package/calendar/grid/index.js.map +1 -1
  48. package/calendar/header/header-button.d.ts +1 -1
  49. package/calendar/header/header-button.d.ts.map +1 -1
  50. package/calendar/header/header-button.js.map +1 -1
  51. package/calendar/header/index.d.ts +2 -2
  52. package/calendar/header/index.d.ts.map +1 -1
  53. package/calendar/header/index.js.map +1 -1
  54. package/calendar/interfaces.d.ts +3 -3
  55. package/calendar/interfaces.d.ts.map +1 -1
  56. package/calendar/interfaces.js.map +1 -1
  57. package/calendar/internal.d.ts +1 -1
  58. package/calendar/internal.d.ts.map +1 -1
  59. package/calendar/internal.js +6 -1
  60. package/calendar/internal.js.map +1 -1
  61. package/date-picker/index.d.ts.map +1 -1
  62. package/date-picker/index.js +6 -4
  63. package/date-picker/index.js.map +1 -1
  64. package/internal/context/split-panel-context.d.ts +2 -8
  65. package/internal/context/split-panel-context.d.ts.map +1 -1
  66. package/internal/context/split-panel-context.js.map +1 -1
  67. package/internal/environment.js +1 -1
  68. package/internal/i18n/context.d.ts +6 -1
  69. package/internal/i18n/context.d.ts.map +1 -1
  70. package/internal/i18n/context.js +8 -2
  71. package/internal/i18n/context.js.map +1 -1
  72. package/internal/i18n/messages/all.all.js +219 -210
  73. package/internal/i18n/messages/all.all.json +231 -231
  74. package/internal/i18n/messages/all.de.js +20 -20
  75. package/internal/i18n/messages/all.de.json +20 -20
  76. package/internal/i18n/messages/all.en-GB.js +20 -20
  77. package/internal/i18n/messages/all.en-GB.json +20 -20
  78. package/internal/i18n/messages/all.en.js +20 -20
  79. package/internal/i18n/messages/all.en.json +20 -20
  80. package/internal/i18n/messages/all.es.js +20 -20
  81. package/internal/i18n/messages/all.es.json +20 -20
  82. package/internal/i18n/messages/all.fr.js +20 -20
  83. package/internal/i18n/messages/all.fr.json +20 -20
  84. package/internal/i18n/messages/all.id.js +20 -20
  85. package/internal/i18n/messages/all.id.json +20 -20
  86. package/internal/i18n/messages/all.it.js +20 -20
  87. package/internal/i18n/messages/all.it.json +20 -20
  88. package/internal/i18n/messages/all.ja.js +20 -20
  89. package/internal/i18n/messages/all.ja.json +20 -20
  90. package/internal/i18n/messages/all.ko.js +22 -19
  91. package/internal/i18n/messages/all.ko.json +20 -20
  92. package/internal/i18n/messages/all.pt-BR.js +20 -20
  93. package/internal/i18n/messages/all.pt-BR.json +20 -20
  94. package/internal/i18n/messages/all.zh-CN.js +24 -21
  95. package/internal/i18n/messages/all.zh-CN.json +22 -22
  96. package/internal/i18n/messages/all.zh-TW.js +23 -20
  97. package/internal/i18n/messages/all.zh-TW.json +21 -21
  98. package/internal/i18n/provider.js +1 -1
  99. package/internal/i18n/provider.js.map +1 -1
  100. package/internal/manifest.json +1 -1
  101. package/package.json +1 -1
  102. package/property-filter/index.js.map +1 -1
  103. package/select/parts/styles.css.js +9 -9
  104. package/select/parts/styles.scoped.css +9 -27
  105. package/select/parts/styles.selectors.js +9 -9
  106. package/split-panel/index.d.ts.map +1 -1
  107. package/split-panel/index.js +6 -24
  108. package/split-panel/index.js.map +1 -1
  109. package/table/body-cell/use-stable-scroll-position.d.ts.map +1 -1
  110. package/table/body-cell/use-stable-scroll-position.js +10 -4
  111. package/table/body-cell/use-stable-scroll-position.js.map +1 -1
  112. package/table/header-cell/index.js +2 -3
  113. package/table/header-cell/index.js.map +1 -1
  114. package/table/use-table-focus-navigation.d.ts +1 -1
  115. package/table/use-table-focus-navigation.d.ts.map +1 -1
  116. package/table/use-table-focus-navigation.js +4 -4
  117. package/table/use-table-focus-navigation.js.map +1 -1
  118. package/tutorial-panel/components/tutorial-list/index.d.ts +0 -1
  119. package/tutorial-panel/components/tutorial-list/index.d.ts.map +1 -1
  120. package/tutorial-panel/components/tutorial-list/index.js +3 -15
  121. package/tutorial-panel/components/tutorial-list/index.js.map +1 -1
  122. package/tutorial-panel/index.d.ts.map +1 -1
  123. package/tutorial-panel/index.js +2 -14
  124. package/tutorial-panel/index.js.map +1 -1
  125. package/tutorial-panel/interfaces.d.ts +1 -1
  126. package/tutorial-panel/interfaces.d.ts.map +1 -1
  127. package/tutorial-panel/interfaces.js.map +1 -1
  128. package/wizard/index.d.ts +1 -1
  129. package/wizard/index.d.ts.map +1 -1
  130. package/wizard/index.js +4 -1
  131. package/wizard/index.js.map +1 -1
  132. package/wizard/interfaces.d.ts +5 -5
  133. package/wizard/interfaces.d.ts.map +1 -1
  134. package/wizard/interfaces.js.map +1 -1
  135. package/wizard/wizard-actions.d.ts +3 -3
  136. package/wizard/wizard-actions.d.ts.map +1 -1
  137. package/wizard/wizard-actions.js.map +1 -1
  138. package/wizard/wizard-form.js +2 -1
  139. package/wizard/wizard-form.js.map +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"tools.js","sourceRoot":"","sources":["../../../../src/app-layout/visual-refresh/tools.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\nimport { InternalButton } from '../../button/internal';\nimport { useAppLayoutInternals } from './context';\nimport TriggerButton from './trigger-button';\nimport styles from './styles.css.js';\nimport splitPanelStyles from '../../split-panel/styles.css.js';\nimport testutilStyles from '../test-classes/styles.css.js';\nimport { Transition } from '../../internal/components/transition';\nimport customCssProps from '../../internal/generated/custom-css-properties';\n\ninterface ToolsProps {\n children: React.ReactNode;\n}\n\n/**\n * The Tools component consists of the following elements:\n * the container, or root element, that sits as a direct child to the Layout grid definition;\n * the split panel, which exists only if there is a split panel in side position;\n * the tools, or drawer, that contains the hide tools form and the children passed through the API;\n * the show tools form that contains the triggers for both the drawer and the\n * split panel in large viewports;\n */\nexport default function Tools({ children }: ToolsProps) {\n const {\n ariaLabels,\n handleSplitPanelClick,\n handleToolsClick,\n hasDefaultToolsWidth,\n isNavigationOpen,\n isMobile,\n isSplitPanelOpen,\n isToolsOpen,\n splitPanelDisplayed,\n tools,\n toolsHide,\n toolsWidth,\n isAnyPanelOpen,\n navigationHide,\n toolsFocusControl,\n splitPanelPosition,\n splitPanelToggle,\n } = useAppLayoutInternals();\n\n const hasSplitPanel = getSplitPanelStatus(splitPanelDisplayed, splitPanelPosition);\n const hasToolsForm = getToolsFormStatus(hasSplitPanel, isMobile, isSplitPanelOpen, isToolsOpen, toolsHide);\n const hasToolsFormPersistence = getToolsFormPersistence(hasSplitPanel, isSplitPanelOpen, isToolsOpen, toolsHide);\n\n const { refs: focusRefs } = toolsFocusControl;\n\n if (toolsHide && !hasSplitPanel) {\n return null;\n }\n\n const isUnfocusable = isMobile && isAnyPanelOpen && isNavigationOpen && !navigationHide;\n\n return (\n <Transition in={isToolsOpen ?? false}>\n {(state, transitionEventsRef) => (\n <div\n className={clsx(styles['tools-container'], {\n [testutilStyles['drawer-closed']]: !isToolsOpen,\n [styles.unfocusable]: isUnfocusable,\n })}\n style={{\n [customCssProps.toolsAnimationStartingOpacity]: `${hasSplitPanel && isSplitPanelOpen ? 1 : 0}`,\n // Overwrite the default tools width (depends on breakpoints) only when the `toolsWidth` property has been set.\n [customCssProps.toolsWidth]: hasDefaultToolsWidth ? '' : `${toolsWidth}px`,\n }}\n onBlur={e => {\n if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {\n toolsFocusControl.loseFocus();\n }\n }}\n >\n {children}\n\n {!toolsHide && (\n <aside\n aria-hidden={!isToolsOpen ? true : false}\n aria-label={ariaLabels?.tools ?? undefined}\n className={clsx(\n styles.tools,\n {\n [styles.animating]: state === 'entering',\n [styles['has-tools-form-persistence']]: hasToolsFormPersistence,\n [styles['is-tools-open']]: isToolsOpen,\n },\n testutilStyles.tools\n )}\n ref={state !== 'exiting' ? transitionEventsRef : undefined}\n >\n <div className={clsx(styles['animated-content'])}>\n <div className={clsx(styles['hide-tools'])}>\n <InternalButton\n ariaLabel={ariaLabels?.toolsClose ?? undefined}\n iconName={isMobile ? 'close' : 'angle-right'}\n onClick={() => handleToolsClick(false)}\n variant=\"icon\"\n formAction=\"none\"\n className={testutilStyles['tools-close']}\n ref={focusRefs.close}\n />\n </div>\n\n {tools}\n </div>\n </aside>\n )}\n\n {!isMobile && (\n <aside\n aria-hidden={!hasToolsForm ? true : false}\n aria-label={ariaLabels?.tools ?? undefined}\n className={clsx(styles['show-tools'], {\n [styles.animating]: state === 'exiting',\n [styles['has-tools-form']]: hasToolsForm,\n [styles['has-tools-form-persistence']]: hasToolsFormPersistence,\n })}\n ref={state === 'exiting' ? transitionEventsRef : undefined}\n >\n {!toolsHide && (\n <TriggerButton\n ariaLabel={ariaLabels?.toolsToggle}\n iconName=\"status-info\"\n onClick={() => handleToolsClick(!isToolsOpen)}\n selected={hasSplitPanel && isToolsOpen}\n className={testutilStyles['tools-toggle']}\n ref={focusRefs.toggle}\n />\n )}\n\n {hasSplitPanel && splitPanelToggle.displayed && (\n <TriggerButton\n ariaLabel={splitPanelToggle.ariaLabel}\n iconName=\"view-vertical\"\n onClick={() => handleSplitPanelClick()}\n selected={hasSplitPanel && isSplitPanelOpen}\n className={splitPanelStyles['open-button']}\n // TODO should this button also get focus handling? (i.e. when the split panel is toggled)\n />\n )}\n </aside>\n )}\n </div>\n )}\n </Transition>\n );\n}\n\n/**\n * Determine the default state of the Tools component. Mobile viewports should be\n * closed by default under all circumstances. If the toolsOpen prop has not been\n * set then it should be closed as well. Otherwise, default to the toolsOpen prop.\n */\nexport function getToolsDefaultState(isMobile: boolean, stateFromProps?: boolean) {\n let isToolsOpen;\n\n if (isMobile || stateFromProps === undefined) {\n isToolsOpen = false;\n } else {\n isToolsOpen = stateFromProps;\n }\n\n return isToolsOpen;\n}\n\n/**\n * This simple function returns the presence of the split panel as a child of the\n * Tools component. It must exist and be in side position.\n */\nfunction getSplitPanelStatus(splitPanelDisplayed: boolean, splitPanelPosition: string) {\n return splitPanelDisplayed && splitPanelPosition === 'side' ? true : false;\n}\n\n/**\n * By default the Tools form is styled as display: none; This behavior should\n * be unchanged in mobile viewports where the Tools form is always suppressed.\n * In large viewports, however the Tools form and its corresponding buttons\n * should be present in the UI under the below circumstances.\n */\nfunction getToolsFormStatus(\n hasSplitPanel: boolean,\n isMobile: boolean,\n isSplitPanelOpen?: boolean,\n isToolsOpen?: boolean,\n toolsHide?: boolean\n) {\n let hasToolsForm = false;\n\n if (!isMobile) {\n // Both the Split Panel and Tools button are needed\n if (hasSplitPanel && !toolsHide) {\n hasToolsForm = true;\n }\n\n // The Split Panel button is needed\n if (hasSplitPanel && !isSplitPanelOpen && toolsHide) {\n hasToolsForm = true;\n }\n\n // The Tools button is needed\n if (!hasSplitPanel && !toolsHide && !isToolsOpen) {\n hasToolsForm = true;\n }\n }\n\n return hasToolsForm;\n}\n\n/**\n * Under two scenarios the Tools form that contains the triggers\n * for the Tools content and the Split Panel may be persistent\n * in the UI (as opposed to disappearing when one of the drawers\n * is open). This will also add a white background as opposed to the\n * default transparent background. The buttons will present and in a\n * selected / not selected state.\n */\nfunction getToolsFormPersistence(\n hasSplitPanel: boolean,\n isSplitPanelOpen?: boolean,\n isToolsOpen?: boolean,\n toolsHide?: boolean\n) {\n let hasToolsFormPersistence = false;\n\n // Both Tools and Split Panel exist and one or both is open\n if (hasSplitPanel && !toolsHide && (isSplitPanelOpen || isToolsOpen)) {\n hasToolsFormPersistence = true;\n }\n\n return hasToolsFormPersistence;\n}\n"]}
1
+ {"version":3,"file":"tools.js","sourceRoot":"","sources":["../../../../src/app-layout/visual-refresh/tools.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\nimport { InternalButton } from '../../button/internal';\nimport { useAppLayoutInternals } from './context';\nimport TriggerButton from './trigger-button';\nimport styles from './styles.css.js';\nimport splitPanelStyles from '../../split-panel/styles.css.js';\nimport testutilStyles from '../test-classes/styles.css.js';\nimport { Transition } from '../../internal/components/transition';\nimport customCssProps from '../../internal/generated/custom-css-properties';\n\ninterface ToolsProps {\n children: React.ReactNode;\n}\n\n/**\n * The Tools component consists of the following elements:\n * the container, or root element, that sits as a direct child to the Layout grid definition;\n * the split panel, which exists only if there is a split panel in side position;\n * the tools, or drawer, that contains the hide tools form and the children passed through the API;\n * the show tools form that contains the triggers for both the drawer and the\n * split panel in large viewports;\n */\nexport default function Tools({ children }: ToolsProps) {\n const {\n ariaLabels,\n handleSplitPanelClick,\n handleToolsClick,\n hasDefaultToolsWidth,\n isNavigationOpen,\n isMobile,\n isSplitPanelOpen,\n isToolsOpen,\n splitPanelDisplayed,\n tools,\n toolsHide,\n toolsWidth,\n isAnyPanelOpen,\n navigationHide,\n toolsRefs,\n loseToolsFocus,\n splitPanelPosition,\n splitPanelToggle,\n splitPanelRefs,\n } = useAppLayoutInternals();\n\n const hasSplitPanel = getSplitPanelStatus(splitPanelDisplayed, splitPanelPosition);\n const hasToolsForm = getToolsFormStatus(hasSplitPanel, isMobile, isSplitPanelOpen, isToolsOpen, toolsHide);\n const hasToolsFormPersistence = getToolsFormPersistence(hasSplitPanel, isSplitPanelOpen, isToolsOpen, toolsHide);\n\n if (toolsHide && !hasSplitPanel) {\n return null;\n }\n\n const isUnfocusable = isMobile && isAnyPanelOpen && isNavigationOpen && !navigationHide;\n\n return (\n <Transition in={isToolsOpen ?? false}>\n {(state, transitionEventsRef) => (\n <div\n className={clsx(styles['tools-container'], {\n [testutilStyles['drawer-closed']]: !isToolsOpen,\n [styles.unfocusable]: isUnfocusable,\n })}\n style={{\n [customCssProps.toolsAnimationStartingOpacity]: `${hasSplitPanel && isSplitPanelOpen ? 1 : 0}`,\n // Overwrite the default tools width (depends on breakpoints) only when the `toolsWidth` property has been set.\n [customCssProps.toolsWidth]: hasDefaultToolsWidth ? '' : `${toolsWidth}px`,\n }}\n onBlur={e => {\n if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {\n loseToolsFocus();\n }\n }}\n >\n {children}\n\n {!toolsHide && (\n <aside\n aria-hidden={!isToolsOpen ? true : false}\n aria-label={ariaLabels?.tools ?? undefined}\n className={clsx(\n styles.tools,\n {\n [styles.animating]: state === 'entering',\n [styles['has-tools-form-persistence']]: hasToolsFormPersistence,\n [styles['is-tools-open']]: isToolsOpen,\n },\n testutilStyles.tools\n )}\n ref={state !== 'exiting' ? transitionEventsRef : undefined}\n >\n <div className={clsx(styles['animated-content'])}>\n <div className={clsx(styles['hide-tools'])}>\n <InternalButton\n ariaLabel={ariaLabels?.toolsClose ?? undefined}\n iconName={isMobile ? 'close' : 'angle-right'}\n onClick={() => handleToolsClick(false)}\n variant=\"icon\"\n formAction=\"none\"\n className={testutilStyles['tools-close']}\n ref={toolsRefs.close}\n />\n </div>\n\n {tools}\n </div>\n </aside>\n )}\n\n {!isMobile && (\n <aside\n aria-hidden={!hasToolsForm ? true : false}\n aria-label={ariaLabels?.tools ?? undefined}\n className={clsx(styles['show-tools'], {\n [styles.animating]: state === 'exiting',\n [styles['has-tools-form']]: hasToolsForm,\n [styles['has-tools-form-persistence']]: hasToolsFormPersistence,\n })}\n ref={state === 'exiting' ? transitionEventsRef : undefined}\n >\n {!toolsHide && (\n <TriggerButton\n ariaLabel={ariaLabels?.toolsToggle}\n iconName=\"status-info\"\n onClick={() => handleToolsClick(!isToolsOpen)}\n selected={hasSplitPanel && isToolsOpen}\n className={testutilStyles['tools-toggle']}\n ref={toolsRefs.toggle}\n />\n )}\n\n {hasSplitPanel && splitPanelToggle.displayed && (\n <TriggerButton\n ariaLabel={splitPanelToggle.ariaLabel}\n iconName=\"view-vertical\"\n onClick={() => handleSplitPanelClick()}\n selected={hasSplitPanel && isSplitPanelOpen}\n className={splitPanelStyles['open-button']}\n ref={splitPanelRefs.toggle}\n />\n )}\n </aside>\n )}\n </div>\n )}\n </Transition>\n );\n}\n\n/**\n * Determine the default state of the Tools component. Mobile viewports should be\n * closed by default under all circumstances. If the toolsOpen prop has not been\n * set then it should be closed as well. Otherwise, default to the toolsOpen prop.\n */\nexport function getToolsDefaultState(isMobile: boolean, stateFromProps?: boolean) {\n let isToolsOpen;\n\n if (isMobile || stateFromProps === undefined) {\n isToolsOpen = false;\n } else {\n isToolsOpen = stateFromProps;\n }\n\n return isToolsOpen;\n}\n\n/**\n * This simple function returns the presence of the split panel as a child of the\n * Tools component. It must exist and be in side position.\n */\nfunction getSplitPanelStatus(splitPanelDisplayed: boolean, splitPanelPosition: string) {\n return splitPanelDisplayed && splitPanelPosition === 'side' ? true : false;\n}\n\n/**\n * By default the Tools form is styled as display: none; This behavior should\n * be unchanged in mobile viewports where the Tools form is always suppressed.\n * In large viewports, however the Tools form and its corresponding buttons\n * should be present in the UI under the below circumstances.\n */\nfunction getToolsFormStatus(\n hasSplitPanel: boolean,\n isMobile: boolean,\n isSplitPanelOpen?: boolean,\n isToolsOpen?: boolean,\n toolsHide?: boolean\n) {\n let hasToolsForm = false;\n\n if (!isMobile) {\n // Both the Split Panel and Tools button are needed\n if (hasSplitPanel && !toolsHide) {\n hasToolsForm = true;\n }\n\n // The Split Panel button is needed\n if (hasSplitPanel && !isSplitPanelOpen && toolsHide) {\n hasToolsForm = true;\n }\n\n // The Tools button is needed\n if (!hasSplitPanel && !toolsHide && !isToolsOpen) {\n hasToolsForm = true;\n }\n }\n\n return hasToolsForm;\n}\n\n/**\n * Under two scenarios the Tools form that contains the triggers\n * for the Tools content and the Split Panel may be persistent\n * in the UI (as opposed to disappearing when one of the drawers\n * is open). This will also add a white background as opposed to the\n * default transparent background. The buttons will present and in a\n * selected / not selected state.\n */\nfunction getToolsFormPersistence(\n hasSplitPanel: boolean,\n isSplitPanelOpen?: boolean,\n isToolsOpen?: boolean,\n toolsHide?: boolean\n) {\n let hasToolsFormPersistence = false;\n\n // Both Tools and Split Panel exist and one or both is open\n if (hasSplitPanel && !toolsHide && (isSplitPanelOpen || isToolsOpen)) {\n hasToolsFormPersistence = true;\n }\n\n return hasToolsFormPersistence;\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/autosuggest/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAGhE,OAAO,EAAmB,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAgBjE,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAQlF,MAAM,WAAW,wBAAyB,SAAQ,gBAAgB,EAAE,0BAA0B;CAAG;AAEjG,QAAA,MAAM,mBAAmB,uGAsLvB,CAAC;AAEH,eAAe,mBAAmB,CAAC"}
1
+ {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/autosuggest/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAIhE,OAAO,EAAmB,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAejE,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAUlF,MAAM,WAAW,wBAAyB,SAAQ,gBAAgB,EAAE,0BAA0B;CAAG;AAEjG,QAAA,MAAM,mBAAmB,uGA+LvB,CAAC;AAEH,eAAe,mBAAmB,CAAC"}
@@ -2,22 +2,23 @@
2
2
  // SPDX-License-Identifier: Apache-2.0
3
3
  import { __rest } from "tslib";
4
4
  import React, { useImperativeHandle, useRef } from 'react';
5
+ import clsx from 'clsx';
5
6
  import { useAutosuggestItems } from './options-controller';
6
7
  import { useDropdownStatus } from '../internal/components/dropdown-status';
7
8
  import DropdownFooter from '../internal/components/dropdown-footer';
8
9
  import { generateUniqueId, useUniqueId } from '../internal/hooks/use-unique-id';
9
10
  import { fireCancelableEvent, fireNonCancelableEvent, } from '../internal/events';
10
- import styles from './styles.css.js';
11
11
  import { checkOptionValueField } from '../select/utils/check-option-value-field';
12
12
  import checkControlled from '../internal/hooks/check-controlled';
13
13
  import AutosuggestOptionsList from './options-list';
14
14
  import { useAutosuggestLoadMore } from './load-more-controller';
15
15
  import AutosuggestInput from '../internal/components/autosuggest-input';
16
16
  import { useFormFieldContext } from '../contexts/form-field';
17
- import clsx from 'clsx';
17
+ import { useInternalI18n } from '../internal/i18n/context';
18
+ import styles from './styles.css.js';
18
19
  const InternalAutosuggest = React.forwardRef((props, ref) => {
19
20
  var _a;
20
- const { value, onChange, onBlur, onFocus, onKeyUp, onLoadItems, options, filteringType = 'auto', statusType = 'finished', recoveryText, placeholder, clearAriaLabel, name, disabled, disableBrowserAutocorrect = false, autoFocus, readOnly, ariaLabel, ariaRequired, enteredTextLabel, onKeyDown, virtualScroll, expandToViewport, onSelect, selectedAriaLabel, renderHighlightedAriaLive, __internalRootRef } = props, restProps = __rest(props, ["value", "onChange", "onBlur", "onFocus", "onKeyUp", "onLoadItems", "options", "filteringType", "statusType", "recoveryText", "placeholder", "clearAriaLabel", "name", "disabled", "disableBrowserAutocorrect", "autoFocus", "readOnly", "ariaLabel", "ariaRequired", "enteredTextLabel", "onKeyDown", "virtualScroll", "expandToViewport", "onSelect", "selectedAriaLabel", "renderHighlightedAriaLive", "__internalRootRef"]);
21
+ const { value, onChange, onBlur, onFocus, onKeyUp, onLoadItems, options, filteringType = 'auto', statusType = 'finished', recoveryText, placeholder, clearAriaLabel, name, disabled, disableBrowserAutocorrect = false, autoFocus, readOnly, ariaLabel, ariaRequired, enteredTextLabel, onKeyDown, virtualScroll, expandToViewport, onSelect, renderHighlightedAriaLive, __internalRootRef } = props, restProps = __rest(props, ["value", "onChange", "onBlur", "onFocus", "onKeyUp", "onLoadItems", "options", "filteringType", "statusType", "recoveryText", "placeholder", "clearAriaLabel", "name", "disabled", "disableBrowserAutocorrect", "autoFocus", "readOnly", "ariaLabel", "ariaRequired", "enteredTextLabel", "onKeyDown", "virtualScroll", "expandToViewport", "onSelect", "renderHighlightedAriaLive", "__internalRootRef"]);
21
22
  checkControlled('Autosuggest', 'value', value, 'onChange', onChange);
22
23
  checkOptionValueField('Autosuggest', 'options', options);
23
24
  const autosuggestInputRef = useRef(null);
@@ -25,6 +26,9 @@ const InternalAutosuggest = React.forwardRef((props, ref) => {
25
26
  focus: () => { var _a; return (_a = autosuggestInputRef.current) === null || _a === void 0 ? void 0 : _a.focus(); },
26
27
  select: () => { var _a; return (_a = autosuggestInputRef.current) === null || _a === void 0 ? void 0 : _a.select(); },
27
28
  }), []);
29
+ const i18n = useInternalI18n('autosuggest');
30
+ const errorIconAriaLabel = i18n('errorIconAriaLabel', restProps.errorIconAriaLabel);
31
+ const selectedAriaLabel = i18n('selectedAriaLabel', restProps.selectedAriaLabel);
28
32
  const [autosuggestItemsState, autosuggestItemsHandlers] = useAutosuggestItems({
29
33
  options: options || [],
30
34
  filterValue: value,
@@ -92,7 +96,9 @@ const InternalAutosuggest = React.forwardRef((props, ref) => {
92
96
  const listId = useUniqueId('list');
93
97
  const highlightedOptionId = autosuggestItemsState.highlightedOption ? generateUniqueId() : undefined;
94
98
  const isEmpty = !value && !autosuggestItemsState.items.length;
95
- const dropdownStatus = useDropdownStatus(Object.assign(Object.assign({}, props), { isEmpty, recoveryText, onRecoveryClick: handleRecoveryClick }));
99
+ const dropdownStatus = useDropdownStatus(Object.assign(Object.assign({}, props), { isEmpty,
100
+ recoveryText,
101
+ errorIconAriaLabel, onRecoveryClick: handleRecoveryClick }));
96
102
  return (React.createElement(AutosuggestInput, Object.assign({}, restProps, { className: clsx(styles.root, restProps.className), ref: autosuggestInputRef, __internalRootRef: __internalRootRef, value: value, onChange: handleChange, onBlur: handleBlur, onFocus: handleFocus, onKeyUp: handleKeyUp, onKeyDown: handleKeyDown, name: name, controlId: controlId, placeholder: placeholder, disabled: disabled, readOnly: readOnly, autoFocus: autoFocus, ariaLabel: ariaLabel, ariaRequired: ariaRequired, clearAriaLabel: clearAriaLabel, disableBrowserAutocorrect: disableBrowserAutocorrect, expandToViewport: expandToViewport, ariaControls: listId, ariaActivedescendant: highlightedOptionId, dropdownExpanded: autosuggestItemsState.items.length > 1 || dropdownStatus.content !== null, dropdownContent: React.createElement(AutosuggestOptionsList, { autosuggestItemsState: autosuggestItemsState, autosuggestItemsHandlers: autosuggestItemsHandlers, highlightedOptionId: highlightedOptionId, highlightText: value, listId: listId, controlId: controlId, enteredTextLabel: enteredTextLabel, handleLoadMore: autosuggestLoadMoreHandlers.fireLoadMoreOnScroll, hasDropdownStatus: dropdownStatus.content !== null, virtualScroll: virtualScroll, selectedAriaLabel: selectedAriaLabel, renderHighlightedAriaLive: renderHighlightedAriaLive, listBottom: !dropdownStatus.isSticky ? React.createElement(DropdownFooter, { content: dropdownStatus.content }) : null }), dropdownFooter: dropdownStatus.isSticky ? (React.createElement(DropdownFooter, { content: dropdownStatus.content, hasItems: autosuggestItemsState.items.length >= 1 })) : null, loopFocus: statusType === 'error' && !!recoveryText, onCloseDropdown: handleCloseDropdown, onDelayedInput: handleDelayedInput, onPressArrowDown: handlePressArrowDown, onPressArrowUp: handlePressArrowUp, onPressEnter: handlePressEnter })));
97
103
  });
98
104
  export default InternalAutosuggest;
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/autosuggest/internal.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;;AAEtC,OAAO,KAAK,EAAE,EAAO,mBAAmB,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAG3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,wCAAwC,CAAC;AAC3E,OAAO,cAAc,MAAM,wCAAwC,CAAC;AAEpE,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAChF,OAAO,EAEL,mBAAmB,EACnB,sBAAsB,GAEvB,MAAM,oBAAoB,CAAC;AAE5B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,qBAAqB,EAAE,MAAM,0CAA0C,CAAC;AACjF,OAAO,eAAe,MAAM,oCAAoC,CAAC;AAEjE,OAAO,sBAAsB,MAAM,gBAAgB,CAAC;AACpD,OAAO,EAAE,sBAAsB,EAAE,MAAM,wBAAwB,CAAC;AAEhE,OAAO,gBAAyC,MAAM,0CAA0C,CAAC;AACjG,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,IAAI,MAAM,MAAM,CAAC;AAIxB,MAAM,mBAAmB,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,KAA+B,EAAE,GAA8B,EAAE,EAAE;;IAC/G,MAAM,EACJ,KAAK,EACL,QAAQ,EACR,MAAM,EACN,OAAO,EACP,OAAO,EACP,WAAW,EACX,OAAO,EACP,aAAa,GAAG,MAAM,EACtB,UAAU,GAAG,UAAU,EACvB,YAAY,EACZ,WAAW,EACX,cAAc,EACd,IAAI,EACJ,QAAQ,EACR,yBAAyB,GAAG,KAAK,EACjC,SAAS,EACT,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,gBAAgB,EAChB,SAAS,EACT,aAAa,EACb,gBAAgB,EAChB,QAAQ,EACR,iBAAiB,EACjB,yBAAyB,EACzB,iBAAiB,KAEf,KAAK,EADJ,SAAS,UACV,KAAK,EA7BH,+ZA6BL,CAAQ,CAAC;IAEV,eAAe,CAAC,aAAa,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,CAAC,CAAC;IACrE,qBAAqB,CAAC,aAAa,EAAE,SAAS,EAAE,OAAO,CAAC,CAAC;IAEzD,MAAM,mBAAmB,GAAG,MAAM,CAAsB,IAAI,CAAC,CAAC;IAC9D,mBAAmB,CACjB,GAAG,EACH,GAAG,EAAE,CAAC,CAAC;QACL,KAAK,EAAE,GAAG,EAAE,WAAC,OAAA,MAAA,mBAAmB,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAA,EAAA;QACjD,MAAM,EAAE,GAAG,EAAE,WAAC,OAAA,MAAA,mBAAmB,CAAC,OAAO,0CAAE,MAAM,EAAE,CAAA,EAAA;KACpD,CAAC,EACF,EAAE,CACH,CAAC;IAEF,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,mBAAmB,CAAC;QAC5E,OAAO,EAAE,OAAO,IAAI,EAAE;QACtB,WAAW,EAAE,KAAK;QAClB,UAAU,EAAE,KAAK;QACjB,aAAa;QACb,oBAAoB,EAAE,KAAK;QAC3B,YAAY,EAAE,CAAC,MAAuB,EAAE,EAAE;;YACxC,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,IAAI,EAAE,CAAC;YACjC,sBAAsB,CAAC,QAAQ,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC;YAC5C,sBAAsB,CAAC,QAAQ,EAAE;gBAC/B,KAAK;gBACL,cAAc,EAAE,MAAM,CAAC,IAAI,KAAK,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;aAC1E,CAAC,CAAC;YACH,MAAA,mBAAmB,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;QACvC,CAAC;KACF,CAAC,CAAC;IAEH,MAAM,2BAA2B,GAAG,sBAAsB,CAAC;QACzD,OAAO;QACP,UAAU;QACV,WAAW,EAAE,CAAC,MAA8B,EAAE,EAAE,CAAC,sBAAsB,CAAC,WAAW,EAAE,MAAM,CAAC;KAC7F,CAAC,CAAC;IAEH,MAAM,YAAY,GAAG,CAAC,KAAiD,EAAE,EAAE;QACzE,wBAAwB,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;QAC3C,wBAAwB,CAAC,0BAA0B,EAAE,CAAC;QACtD,sBAAsB,CAAC,QAAQ,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACjD,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAG,CAAC,KAAiD,EAAE,EAAE;QAC/E,2BAA2B,CAAC,yBAAyB,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAC5E,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,sBAAsB,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IACvC,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,wBAAwB,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QAC1C,2BAA2B,CAAC,wBAAwB,EAAE,CAAC;QACvD,sBAAsB,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;IACxC,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,CAAC,CAA6B,EAAE,EAAE;QACpD,mBAAmB,CAAC,OAAO,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC;IACzC,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,CAAC,CAA6B,EAAE,EAAE;QACtD,mBAAmB,CAAC,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC;IAC3C,CAAC,CAAC;IAEF,MAAM,oBAAoB,GAAG,GAAG,EAAE;QAChC,wBAAwB,CAAC,yBAAyB,CAAC,CAAC,CAAC,CAAC;IACxD,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAG,GAAG,EAAE;QAC9B,wBAAwB,CAAC,yBAAyB,CAAC,CAAC,CAAC,CAAC,CAAC;IACzD,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAG,GAAG,EAAE;QAC5B,OAAO,wBAAwB,CAAC,mCAAmC,EAAE,CAAC;IACxE,CAAC,CAAC;IAEF,MAAM,mBAAmB,GAAG,GAAG,EAAE;QAC/B,wBAAwB,CAAC,0BAA0B,EAAE,CAAC;IACxD,CAAC,CAAC;IAEF,MAAM,mBAAmB,GAAG,GAAG,EAAE;;QAC/B,2BAA2B,CAAC,2BAA2B,EAAE,CAAC;QAC1D,MAAA,mBAAmB,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;IACvC,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,SAAS,CAAC,CAAC;IACxD,MAAM,aAAa,GAAG,WAAW,CAAC,OAAO,CAAC,CAAC;IAC3C,MAAM,SAAS,GAAG,MAAA,gBAAgB,CAAC,SAAS,mCAAI,aAAa,CAAC;IAC9D,MAAM,MAAM,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC;IACnC,MAAM,mBAAmB,GAAG,qBAAqB,CAAC,iBAAiB,CAAC,CAAC,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;IAErG,MAAM,OAAO,GAAG,CAAC,KAAK,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,MAAM,CAAC;IAC9D,MAAM,cAAc,GAAG,iBAAiB,iCAAM,KAAK,KAAE,OAAO,EAAE,YAAY,EAAE,eAAe,EAAE,mBAAmB,IAAG,CAAC;IAEpH,OAAO,CACL,oBAAC,gBAAgB,oBACX,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,SAAS,CAAC,EACjD,GAAG,EAAE,mBAAmB,EACxB,iBAAiB,EAAE,iBAAiB,EACpC,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,YAAY,EACtB,MAAM,EAAE,UAAU,EAClB,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,YAAY,EAC1B,cAAc,EAAE,cAAc,EAC9B,yBAAyB,EAAE,yBAAyB,EACpD,gBAAgB,EAAE,gBAAgB,EAClC,YAAY,EAAE,MAAM,EACpB,oBAAoB,EAAE,mBAAmB,EACzC,gBAAgB,EAAE,qBAAqB,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,cAAc,CAAC,OAAO,KAAK,IAAI,EAC3F,eAAe,EACb,oBAAC,sBAAsB,IACrB,qBAAqB,EAAE,qBAAqB,EAC5C,wBAAwB,EAAE,wBAAwB,EAClD,mBAAmB,EAAE,mBAAmB,EACxC,aAAa,EAAE,KAAK,EACpB,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,EACpB,gBAAgB,EAAE,gBAAgB,EAClC,cAAc,EAAE,2BAA2B,CAAC,oBAAoB,EAChE,iBAAiB,EAAE,cAAc,CAAC,OAAO,KAAK,IAAI,EAClD,aAAa,EAAE,aAAa,EAC5B,iBAAiB,EAAE,iBAAiB,EACpC,yBAAyB,EAAE,yBAAyB,EACpD,UAAU,EAAE,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC,CAAC,oBAAC,cAAc,IAAC,OAAO,EAAE,cAAc,CAAC,OAAO,GAAI,CAAC,CAAC,CAAC,IAAI,GACjG,EAEJ,cAAc,EACZ,cAAc,CAAC,QAAQ,CAAC,CAAC,CAAC,CACxB,oBAAC,cAAc,IAAC,OAAO,EAAE,cAAc,CAAC,OAAO,EAAE,QAAQ,EAAE,qBAAqB,CAAC,KAAK,CAAC,MAAM,IAAI,CAAC,GAAI,CACvG,CAAC,CAAC,CAAC,IAAI,EAEV,SAAS,EAAE,UAAU,KAAK,OAAO,IAAI,CAAC,CAAC,YAAY,EACnD,eAAe,EAAE,mBAAmB,EACpC,cAAc,EAAE,kBAAkB,EAClC,gBAAgB,EAAE,oBAAoB,EACtC,cAAc,EAAE,kBAAkB,EAClC,YAAY,EAAE,gBAAgB,IAC9B,CACH,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,mBAAmB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { Ref, useImperativeHandle, useRef } from 'react';\n\nimport { useAutosuggestItems } from './options-controller';\nimport { AutosuggestItem, AutosuggestProps } from './interfaces';\n\nimport { useDropdownStatus } from '../internal/components/dropdown-status';\nimport DropdownFooter from '../internal/components/dropdown-footer';\n\nimport { generateUniqueId, useUniqueId } from '../internal/hooks/use-unique-id';\nimport {\n BaseKeyDetail,\n fireCancelableEvent,\n fireNonCancelableEvent,\n NonCancelableCustomEvent,\n} from '../internal/events';\nimport { BaseChangeDetail } from '../input/interfaces';\nimport styles from './styles.css.js';\nimport { checkOptionValueField } from '../select/utils/check-option-value-field';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport AutosuggestOptionsList from './options-list';\nimport { useAutosuggestLoadMore } from './load-more-controller';\nimport { OptionsLoadItemsDetail } from '../internal/components/dropdown/interfaces';\nimport AutosuggestInput, { AutosuggestInputRef } from '../internal/components/autosuggest-input';\nimport { useFormFieldContext } from '../contexts/form-field';\nimport clsx from 'clsx';\n\nexport interface InternalAutosuggestProps extends AutosuggestProps, InternalBaseComponentProps {}\n\nconst InternalAutosuggest = React.forwardRef((props: InternalAutosuggestProps, ref: Ref<AutosuggestProps.Ref>) => {\n const {\n value,\n onChange,\n onBlur,\n onFocus,\n onKeyUp,\n onLoadItems,\n options,\n filteringType = 'auto',\n statusType = 'finished',\n recoveryText,\n placeholder,\n clearAriaLabel,\n name,\n disabled,\n disableBrowserAutocorrect = false,\n autoFocus,\n readOnly,\n ariaLabel,\n ariaRequired,\n enteredTextLabel,\n onKeyDown,\n virtualScroll,\n expandToViewport,\n onSelect,\n selectedAriaLabel,\n renderHighlightedAriaLive,\n __internalRootRef,\n ...restProps\n } = props;\n\n checkControlled('Autosuggest', 'value', value, 'onChange', onChange);\n checkOptionValueField('Autosuggest', 'options', options);\n\n const autosuggestInputRef = useRef<AutosuggestInputRef>(null);\n useImperativeHandle(\n ref,\n () => ({\n focus: () => autosuggestInputRef.current?.focus(),\n select: () => autosuggestInputRef.current?.select(),\n }),\n []\n );\n\n const [autosuggestItemsState, autosuggestItemsHandlers] = useAutosuggestItems({\n options: options || [],\n filterValue: value,\n filterText: value,\n filteringType,\n hideEnteredTextLabel: false,\n onSelectItem: (option: AutosuggestItem) => {\n const value = option.value || '';\n fireNonCancelableEvent(onChange, { value });\n fireNonCancelableEvent(onSelect, {\n value,\n selectedOption: option.type !== 'use-entered' ? option.option : undefined,\n });\n autosuggestInputRef.current?.close();\n },\n });\n\n const autosuggestLoadMoreHandlers = useAutosuggestLoadMore({\n options,\n statusType,\n onLoadItems: (detail: OptionsLoadItemsDetail) => fireNonCancelableEvent(onLoadItems, detail),\n });\n\n const handleChange = (event: NonCancelableCustomEvent<BaseChangeDetail>) => {\n autosuggestItemsHandlers.setShowAll(false);\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n fireNonCancelableEvent(onChange, event.detail);\n };\n\n const handleDelayedInput = (event: NonCancelableCustomEvent<BaseChangeDetail>) => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnInputChange(event.detail.value);\n };\n\n const handleBlur = () => {\n fireNonCancelableEvent(onBlur, null);\n };\n\n const handleFocus = () => {\n autosuggestItemsHandlers.setShowAll(true);\n autosuggestLoadMoreHandlers.fireLoadMoreOnInputFocus();\n fireNonCancelableEvent(onFocus, null);\n };\n\n const handleKeyUp = (e: CustomEvent<BaseKeyDetail>) => {\n fireCancelableEvent(onKeyUp, e.detail);\n };\n\n const handleKeyDown = (e: CustomEvent<BaseKeyDetail>) => {\n fireCancelableEvent(onKeyDown, e.detail);\n };\n\n const handlePressArrowDown = () => {\n autosuggestItemsHandlers.moveHighlightWithKeyboard(1);\n };\n\n const handlePressArrowUp = () => {\n autosuggestItemsHandlers.moveHighlightWithKeyboard(-1);\n };\n\n const handlePressEnter = () => {\n return autosuggestItemsHandlers.selectHighlightedOptionWithKeyboard();\n };\n\n const handleCloseDropdown = () => {\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n };\n\n const handleRecoveryClick = () => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnRecoveryClick();\n autosuggestInputRef.current?.focus();\n };\n\n const formFieldContext = useFormFieldContext(restProps);\n const selfControlId = useUniqueId('input');\n const controlId = formFieldContext.controlId ?? selfControlId;\n const listId = useUniqueId('list');\n const highlightedOptionId = autosuggestItemsState.highlightedOption ? generateUniqueId() : undefined;\n\n const isEmpty = !value && !autosuggestItemsState.items.length;\n const dropdownStatus = useDropdownStatus({ ...props, isEmpty, recoveryText, onRecoveryClick: handleRecoveryClick });\n\n return (\n <AutosuggestInput\n {...restProps}\n className={clsx(styles.root, restProps.className)}\n ref={autosuggestInputRef}\n __internalRootRef={__internalRootRef}\n value={value}\n onChange={handleChange}\n onBlur={handleBlur}\n onFocus={handleFocus}\n onKeyUp={handleKeyUp}\n onKeyDown={handleKeyDown}\n name={name}\n controlId={controlId}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n autoFocus={autoFocus}\n ariaLabel={ariaLabel}\n ariaRequired={ariaRequired}\n clearAriaLabel={clearAriaLabel}\n disableBrowserAutocorrect={disableBrowserAutocorrect}\n expandToViewport={expandToViewport}\n ariaControls={listId}\n ariaActivedescendant={highlightedOptionId}\n dropdownExpanded={autosuggestItemsState.items.length > 1 || dropdownStatus.content !== null}\n dropdownContent={\n <AutosuggestOptionsList\n autosuggestItemsState={autosuggestItemsState}\n autosuggestItemsHandlers={autosuggestItemsHandlers}\n highlightedOptionId={highlightedOptionId}\n highlightText={value}\n listId={listId}\n controlId={controlId}\n enteredTextLabel={enteredTextLabel}\n handleLoadMore={autosuggestLoadMoreHandlers.fireLoadMoreOnScroll}\n hasDropdownStatus={dropdownStatus.content !== null}\n virtualScroll={virtualScroll}\n selectedAriaLabel={selectedAriaLabel}\n renderHighlightedAriaLive={renderHighlightedAriaLive}\n listBottom={!dropdownStatus.isSticky ? <DropdownFooter content={dropdownStatus.content} /> : null}\n />\n }\n dropdownFooter={\n dropdownStatus.isSticky ? (\n <DropdownFooter content={dropdownStatus.content} hasItems={autosuggestItemsState.items.length >= 1} />\n ) : null\n }\n loopFocus={statusType === 'error' && !!recoveryText}\n onCloseDropdown={handleCloseDropdown}\n onDelayedInput={handleDelayedInput}\n onPressArrowDown={handlePressArrowDown}\n onPressArrowUp={handlePressArrowUp}\n onPressEnter={handlePressEnter}\n />\n );\n});\n\nexport default InternalAutosuggest;\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/autosuggest/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\n\nimport React, { Ref, useImperativeHandle, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useAutosuggestItems } from './options-controller';\nimport { AutosuggestItem, AutosuggestProps } from './interfaces';\n\nimport { useDropdownStatus } from '../internal/components/dropdown-status';\nimport DropdownFooter from '../internal/components/dropdown-footer';\n\nimport { generateUniqueId, useUniqueId } from '../internal/hooks/use-unique-id';\nimport {\n BaseKeyDetail,\n fireCancelableEvent,\n fireNonCancelableEvent,\n NonCancelableCustomEvent,\n} from '../internal/events';\nimport { BaseChangeDetail } from '../input/interfaces';\nimport { checkOptionValueField } from '../select/utils/check-option-value-field';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport AutosuggestOptionsList from './options-list';\nimport { useAutosuggestLoadMore } from './load-more-controller';\nimport { OptionsLoadItemsDetail } from '../internal/components/dropdown/interfaces';\nimport AutosuggestInput, { AutosuggestInputRef } from '../internal/components/autosuggest-input';\nimport { useFormFieldContext } from '../contexts/form-field';\nimport { useInternalI18n } from '../internal/i18n/context';\n\nimport styles from './styles.css.js';\n\nexport interface InternalAutosuggestProps extends AutosuggestProps, InternalBaseComponentProps {}\n\nconst InternalAutosuggest = React.forwardRef((props: InternalAutosuggestProps, ref: Ref<AutosuggestProps.Ref>) => {\n const {\n value,\n onChange,\n onBlur,\n onFocus,\n onKeyUp,\n onLoadItems,\n options,\n filteringType = 'auto',\n statusType = 'finished',\n recoveryText,\n placeholder,\n clearAriaLabel,\n name,\n disabled,\n disableBrowserAutocorrect = false,\n autoFocus,\n readOnly,\n ariaLabel,\n ariaRequired,\n enteredTextLabel,\n onKeyDown,\n virtualScroll,\n expandToViewport,\n onSelect,\n renderHighlightedAriaLive,\n __internalRootRef,\n ...restProps\n } = props;\n\n checkControlled('Autosuggest', 'value', value, 'onChange', onChange);\n checkOptionValueField('Autosuggest', 'options', options);\n\n const autosuggestInputRef = useRef<AutosuggestInputRef>(null);\n useImperativeHandle(\n ref,\n () => ({\n focus: () => autosuggestInputRef.current?.focus(),\n select: () => autosuggestInputRef.current?.select(),\n }),\n []\n );\n\n const i18n = useInternalI18n('autosuggest');\n const errorIconAriaLabel = i18n('errorIconAriaLabel', restProps.errorIconAriaLabel);\n const selectedAriaLabel = i18n('selectedAriaLabel', restProps.selectedAriaLabel);\n\n const [autosuggestItemsState, autosuggestItemsHandlers] = useAutosuggestItems({\n options: options || [],\n filterValue: value,\n filterText: value,\n filteringType,\n hideEnteredTextLabel: false,\n onSelectItem: (option: AutosuggestItem) => {\n const value = option.value || '';\n fireNonCancelableEvent(onChange, { value });\n fireNonCancelableEvent(onSelect, {\n value,\n selectedOption: option.type !== 'use-entered' ? option.option : undefined,\n });\n autosuggestInputRef.current?.close();\n },\n });\n\n const autosuggestLoadMoreHandlers = useAutosuggestLoadMore({\n options,\n statusType,\n onLoadItems: (detail: OptionsLoadItemsDetail) => fireNonCancelableEvent(onLoadItems, detail),\n });\n\n const handleChange = (event: NonCancelableCustomEvent<BaseChangeDetail>) => {\n autosuggestItemsHandlers.setShowAll(false);\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n fireNonCancelableEvent(onChange, event.detail);\n };\n\n const handleDelayedInput = (event: NonCancelableCustomEvent<BaseChangeDetail>) => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnInputChange(event.detail.value);\n };\n\n const handleBlur = () => {\n fireNonCancelableEvent(onBlur, null);\n };\n\n const handleFocus = () => {\n autosuggestItemsHandlers.setShowAll(true);\n autosuggestLoadMoreHandlers.fireLoadMoreOnInputFocus();\n fireNonCancelableEvent(onFocus, null);\n };\n\n const handleKeyUp = (e: CustomEvent<BaseKeyDetail>) => {\n fireCancelableEvent(onKeyUp, e.detail);\n };\n\n const handleKeyDown = (e: CustomEvent<BaseKeyDetail>) => {\n fireCancelableEvent(onKeyDown, e.detail);\n };\n\n const handlePressArrowDown = () => {\n autosuggestItemsHandlers.moveHighlightWithKeyboard(1);\n };\n\n const handlePressArrowUp = () => {\n autosuggestItemsHandlers.moveHighlightWithKeyboard(-1);\n };\n\n const handlePressEnter = () => {\n return autosuggestItemsHandlers.selectHighlightedOptionWithKeyboard();\n };\n\n const handleCloseDropdown = () => {\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n };\n\n const handleRecoveryClick = () => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnRecoveryClick();\n autosuggestInputRef.current?.focus();\n };\n\n const formFieldContext = useFormFieldContext(restProps);\n const selfControlId = useUniqueId('input');\n const controlId = formFieldContext.controlId ?? selfControlId;\n const listId = useUniqueId('list');\n const highlightedOptionId = autosuggestItemsState.highlightedOption ? generateUniqueId() : undefined;\n\n const isEmpty = !value && !autosuggestItemsState.items.length;\n const dropdownStatus = useDropdownStatus({\n ...props,\n isEmpty,\n recoveryText,\n errorIconAriaLabel,\n onRecoveryClick: handleRecoveryClick,\n });\n\n return (\n <AutosuggestInput\n {...restProps}\n className={clsx(styles.root, restProps.className)}\n ref={autosuggestInputRef}\n __internalRootRef={__internalRootRef}\n value={value}\n onChange={handleChange}\n onBlur={handleBlur}\n onFocus={handleFocus}\n onKeyUp={handleKeyUp}\n onKeyDown={handleKeyDown}\n name={name}\n controlId={controlId}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n autoFocus={autoFocus}\n ariaLabel={ariaLabel}\n ariaRequired={ariaRequired}\n clearAriaLabel={clearAriaLabel}\n disableBrowserAutocorrect={disableBrowserAutocorrect}\n expandToViewport={expandToViewport}\n ariaControls={listId}\n ariaActivedescendant={highlightedOptionId}\n dropdownExpanded={autosuggestItemsState.items.length > 1 || dropdownStatus.content !== null}\n dropdownContent={\n <AutosuggestOptionsList\n autosuggestItemsState={autosuggestItemsState}\n autosuggestItemsHandlers={autosuggestItemsHandlers}\n highlightedOptionId={highlightedOptionId}\n highlightText={value}\n listId={listId}\n controlId={controlId}\n enteredTextLabel={enteredTextLabel}\n handleLoadMore={autosuggestLoadMoreHandlers.fireLoadMoreOnScroll}\n hasDropdownStatus={dropdownStatus.content !== null}\n virtualScroll={virtualScroll}\n selectedAriaLabel={selectedAriaLabel}\n renderHighlightedAriaLive={renderHighlightedAriaLive}\n listBottom={!dropdownStatus.isSticky ? <DropdownFooter content={dropdownStatus.content} /> : null}\n />\n }\n dropdownFooter={\n dropdownStatus.isSticky ? (\n <DropdownFooter content={dropdownStatus.content} hasItems={autosuggestItemsState.items.length >= 1} />\n ) : null\n }\n loopFocus={statusType === 'error' && !!recoveryText}\n onCloseDropdown={handleCloseDropdown}\n onDelayedInput={handleDelayedInput}\n onPressArrowDown={handlePressArrowDown}\n onPressArrowUp={handlePressArrowUp}\n onPressEnter={handlePressEnter}\n />\n );\n});\n\nexport default InternalAutosuggest;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/breadcrumb-group/internal.tsx"],"names":[],"mappings":";AAWA,OAAO,EAAE,oBAAoB,EAAyB,MAAM,cAAc,CAAC;AAI3E,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAkDjD,eAAO,MAAM,cAAc;;;;CAIzB,CAAC;AAEH,KAAK,4BAA4B,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,IAAI,IAAI,YAAY,CAC/G,oBAAoB,CAAC,CAAC,CAAC,EACvB,iBAAiB,CAClB,GACC,0BAA0B,CAAC;AAE7B,MAAM,CAAC,OAAO,UAAU,uBAAuB,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,IAAI,EAAE,EAC/G,KAAU,EACV,SAAS,EACT,eAAe,EACf,OAAO,EACP,QAAQ,EACR,iBAAiB,EACjB,GAAG,KAAK,EACT,EAAE,4BAA4B,CAAC,CAAC,CAAC,eA4DjC"}
1
+ {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/breadcrumb-group/internal.tsx"],"names":[],"mappings":";AAWA,OAAO,EAAE,oBAAoB,EAAyB,MAAM,cAAc,CAAC;AAI3E,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAkDjD,eAAO,MAAM,cAAc;;;;CAIzB,CAAC;AAEH,KAAK,4BAA4B,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,IAAI,IAAI,YAAY,CAC/G,oBAAoB,CAAC,CAAC,CAAC,EACvB,iBAAiB,CAClB,GACC,0BAA0B,CAAC;AAE7B,MAAM,CAAC,OAAO,UAAU,uBAAuB,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,IAAI,EAAE,EAC/G,KAAU,EACV,SAAS,EACT,eAAe,EACf,OAAO,EACP,QAAQ,EACR,iBAAiB,EACjB,GAAG,KAAK,EACT,EAAE,4BAA4B,CAAC,CAAC,CAAC,eAiEjC"}
@@ -45,7 +45,7 @@ export default function InternalBreadcrumbGroup(_a) {
45
45
  return items[parseInt(id)];
46
46
  };
47
47
  // Add ellipsis
48
- if (breadcrumbItems.length >= 3) {
48
+ if (breadcrumbItems.length >= 2) {
49
49
  const dropdownItems = items
50
50
  .slice(1, items.length - 1)
51
51
  .map((item, index) => ({
@@ -59,7 +59,7 @@ export default function InternalBreadcrumbGroup(_a) {
59
59
  ...breadcrumbItems.slice(1),
60
60
  ];
61
61
  }
62
- return (React.createElement("nav", Object.assign({}, baseProps, { className: clsx(styles['breadcrumb-group'], isMobile && styles.mobile, baseProps.className), "aria-label": ariaLabel || undefined, ref: __internalRootRef }),
62
+ return (React.createElement("nav", Object.assign({}, baseProps, { className: clsx(styles['breadcrumb-group'], isMobile && styles.mobile, items.length <= 2 && styles['mobile-short'], baseProps.className), "aria-label": ariaLabel || undefined, ref: __internalRootRef }),
63
63
  React.createElement("ol", { className: styles['breadcrumb-group-list'] }, breadcrumbItems)));
64
64
  }
65
65
  //# sourceMappingURL=internal.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/breadcrumb-group/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 styles from './styles.css.js';\nimport clsx from 'clsx';\nimport InternalIcon from '../icon/internal';\nimport InternalButtonDropdown from '../button-dropdown/internal';\nimport { LinkItem } from '../button-dropdown/interfaces';\nimport { InternalButton } from '../button/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { BreadcrumbItem } from './item/item';\nimport { BreadcrumbGroupProps, EllipsisDropdownProps } from './interfaces';\nimport { fireCancelableEvent } from '../internal/events';\nimport { getBaseProps } from '../internal/base-component';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { SomeRequired } from '../internal/types';\n\nconst DropdownTrigger = (\n clickHandler: () => void,\n ref: React.Ref<ButtonProps.Ref>,\n isDisabled: boolean,\n isExpanded: boolean,\n ariaLabel?: string\n) => {\n return (\n <InternalButton\n disabled={isDisabled}\n onClick={event => {\n event.preventDefault();\n clickHandler();\n }}\n ref={ref}\n ariaExpanded={isExpanded}\n aria-haspopup={true}\n ariaLabel={ariaLabel}\n variant=\"breadcrumb-group\"\n formAction=\"none\"\n >\n ...\n </InternalButton>\n );\n};\n\nconst EllipsisDropdown = ({\n ariaLabel,\n dropdownItems,\n onDropdownItemClick,\n onDropdownItemFollow,\n}: EllipsisDropdownProps) => {\n return (\n <li className={styles.ellipsis}>\n <InternalButtonDropdown\n ariaLabel={ariaLabel}\n items={dropdownItems}\n onItemClick={onDropdownItemClick}\n onItemFollow={onDropdownItemFollow}\n customTriggerBuilder={DropdownTrigger}\n />\n <span className={styles.icon}>\n <InternalIcon name=\"angle-right\" />\n </span>\n </li>\n );\n};\n\nexport const getEventDetail = <T extends BreadcrumbGroupProps.Item>(item: T) => ({\n item,\n text: item.text,\n href: item.href,\n});\n\ntype InternalBreadcrumbGroupProps<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item> = SomeRequired<\n BreadcrumbGroupProps<T>,\n 'expandAriaLabel'\n> &\n InternalBaseComponentProps;\n\nexport default function InternalBreadcrumbGroup<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item>({\n items = [],\n ariaLabel,\n expandAriaLabel,\n onClick,\n onFollow,\n __internalRootRef,\n ...props\n}: InternalBreadcrumbGroupProps<T>) {\n for (const item of items) {\n checkSafeUrl('BreadcrumbGroup', item.href);\n }\n const baseProps = getBaseProps(props);\n const isMobile = useMobile();\n\n let breadcrumbItems = items.map((item, index) => {\n return (\n <li className={styles.item} key={index}>\n <BreadcrumbItem\n item={item}\n onClick={onClick}\n onFollow={onFollow}\n isCompressed={isMobile}\n isLast={index === items.length - 1}\n isDisplayed={!isMobile || index === items.length - 1 || index === 0}\n />\n </li>\n );\n });\n\n const getEventItem = (e: CustomEvent<{ id: string }>) => {\n const { id } = e.detail;\n return items[parseInt(id)];\n };\n\n // Add ellipsis\n if (breadcrumbItems.length >= 3) {\n const dropdownItems: Array<LinkItem> = items\n .slice(1, items.length - 1)\n .map((item: BreadcrumbGroupProps.Item, index: number) => ({\n id: (index + 1).toString(), // the first item doesn't get inside dropdown\n text: item.text,\n href: item.href || '#',\n }));\n\n breadcrumbItems = [\n breadcrumbItems[0],\n <EllipsisDropdown\n key={'ellipsis'}\n ariaLabel={expandAriaLabel}\n dropdownItems={dropdownItems}\n onDropdownItemClick={e => fireCancelableEvent(onClick, getEventDetail(getEventItem(e)), e)}\n onDropdownItemFollow={e => fireCancelableEvent(onFollow, getEventDetail(getEventItem(e)), e)}\n />,\n ...breadcrumbItems.slice(1),\n ];\n }\n\n return (\n <nav\n {...baseProps}\n className={clsx(styles['breadcrumb-group'], isMobile && styles.mobile, baseProps.className)}\n aria-label={ariaLabel || undefined}\n ref={__internalRootRef}\n >\n <ol className={styles['breadcrumb-group-list']}>{breadcrumbItems}</ol>\n </nav>\n );\n}\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/breadcrumb-group/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 styles from './styles.css.js';\nimport clsx from 'clsx';\nimport InternalIcon from '../icon/internal';\nimport InternalButtonDropdown from '../button-dropdown/internal';\nimport { LinkItem } from '../button-dropdown/interfaces';\nimport { InternalButton } from '../button/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { BreadcrumbItem } from './item/item';\nimport { BreadcrumbGroupProps, EllipsisDropdownProps } from './interfaces';\nimport { fireCancelableEvent } from '../internal/events';\nimport { getBaseProps } from '../internal/base-component';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { SomeRequired } from '../internal/types';\n\nconst DropdownTrigger = (\n clickHandler: () => void,\n ref: React.Ref<ButtonProps.Ref>,\n isDisabled: boolean,\n isExpanded: boolean,\n ariaLabel?: string\n) => {\n return (\n <InternalButton\n disabled={isDisabled}\n onClick={event => {\n event.preventDefault();\n clickHandler();\n }}\n ref={ref}\n ariaExpanded={isExpanded}\n aria-haspopup={true}\n ariaLabel={ariaLabel}\n variant=\"breadcrumb-group\"\n formAction=\"none\"\n >\n ...\n </InternalButton>\n );\n};\n\nconst EllipsisDropdown = ({\n ariaLabel,\n dropdownItems,\n onDropdownItemClick,\n onDropdownItemFollow,\n}: EllipsisDropdownProps) => {\n return (\n <li className={styles.ellipsis}>\n <InternalButtonDropdown\n ariaLabel={ariaLabel}\n items={dropdownItems}\n onItemClick={onDropdownItemClick}\n onItemFollow={onDropdownItemFollow}\n customTriggerBuilder={DropdownTrigger}\n />\n <span className={styles.icon}>\n <InternalIcon name=\"angle-right\" />\n </span>\n </li>\n );\n};\n\nexport const getEventDetail = <T extends BreadcrumbGroupProps.Item>(item: T) => ({\n item,\n text: item.text,\n href: item.href,\n});\n\ntype InternalBreadcrumbGroupProps<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item> = SomeRequired<\n BreadcrumbGroupProps<T>,\n 'expandAriaLabel'\n> &\n InternalBaseComponentProps;\n\nexport default function InternalBreadcrumbGroup<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item>({\n items = [],\n ariaLabel,\n expandAriaLabel,\n onClick,\n onFollow,\n __internalRootRef,\n ...props\n}: InternalBreadcrumbGroupProps<T>) {\n for (const item of items) {\n checkSafeUrl('BreadcrumbGroup', item.href);\n }\n const baseProps = getBaseProps(props);\n const isMobile = useMobile();\n\n let breadcrumbItems = items.map((item, index) => {\n return (\n <li className={styles.item} key={index}>\n <BreadcrumbItem\n item={item}\n onClick={onClick}\n onFollow={onFollow}\n isCompressed={isMobile}\n isLast={index === items.length - 1}\n isDisplayed={!isMobile || index === items.length - 1 || index === 0}\n />\n </li>\n );\n });\n\n const getEventItem = (e: CustomEvent<{ id: string }>) => {\n const { id } = e.detail;\n return items[parseInt(id)];\n };\n\n // Add ellipsis\n if (breadcrumbItems.length >= 2) {\n const dropdownItems: Array<LinkItem> = items\n .slice(1, items.length - 1)\n .map((item: BreadcrumbGroupProps.Item, index: number) => ({\n id: (index + 1).toString(), // the first item doesn't get inside dropdown\n text: item.text,\n href: item.href || '#',\n }));\n\n breadcrumbItems = [\n breadcrumbItems[0],\n <EllipsisDropdown\n key={'ellipsis'}\n ariaLabel={expandAriaLabel}\n dropdownItems={dropdownItems}\n onDropdownItemClick={e => fireCancelableEvent(onClick, getEventDetail(getEventItem(e)), e)}\n onDropdownItemFollow={e => fireCancelableEvent(onFollow, getEventDetail(getEventItem(e)), e)}\n />,\n ...breadcrumbItems.slice(1),\n ];\n }\n\n return (\n <nav\n {...baseProps}\n className={clsx(\n styles['breadcrumb-group'],\n isMobile && styles.mobile,\n items.length <= 2 && styles['mobile-short'],\n baseProps.className\n )}\n aria-label={ariaLabel || undefined}\n ref={__internalRootRef}\n >\n <ol className={styles['breadcrumb-group-list']}>{breadcrumbItems}</ol>\n </nav>\n );\n}\n"]}
@@ -1,11 +1,12 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "breadcrumb-group": "awsui_breadcrumb-group_d19fg_1nxag_93",
5
- "item": "awsui_item_d19fg_1nxag_107",
6
- "breadcrumb-group-list": "awsui_breadcrumb-group-list_d19fg_1nxag_120",
7
- "ellipsis": "awsui_ellipsis_d19fg_1nxag_130",
8
- "icon": "awsui_icon_d19fg_1nxag_138",
9
- "mobile": "awsui_mobile_d19fg_1nxag_142"
4
+ "breadcrumb-group": "awsui_breadcrumb-group_d19fg_fzncg_93",
5
+ "item": "awsui_item_d19fg_fzncg_107",
6
+ "breadcrumb-group-list": "awsui_breadcrumb-group-list_d19fg_fzncg_120",
7
+ "ellipsis": "awsui_ellipsis_d19fg_fzncg_130",
8
+ "icon": "awsui_icon_d19fg_fzncg_138",
9
+ "mobile": "awsui_mobile_d19fg_fzncg_142",
10
+ "mobile-short": "awsui_mobile-short_d19fg_fzncg_155"
10
11
  };
11
12
 
@@ -90,7 +90,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
90
90
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
91
91
  SPDX-License-Identifier: Apache-2.0
92
92
  */
93
- .awsui_breadcrumb-group_d19fg_1nxag_93:not(#\9) {
93
+ .awsui_breadcrumb-group_d19fg_fzncg_93:not(#\9) {
94
94
  /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
95
95
  border-collapse: separate;
96
96
  border-spacing: 0;
@@ -130,7 +130,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
130
130
  margin: 0;
131
131
  padding: var(--space-xxs-ynfts5, 4px) 0;
132
132
  }
133
- .awsui_breadcrumb-group_d19fg_1nxag_93 > .awsui_item_d19fg_1nxag_107:not(#\9) {
133
+ .awsui_breadcrumb-group_d19fg_fzncg_93 > .awsui_item_d19fg_fzncg_107:not(#\9) {
134
134
  /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
135
135
  border-collapse: separate;
136
136
  border-spacing: 0;
@@ -169,7 +169,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
169
169
  -moz-osx-font-smoothing: auto;
170
170
  display: inline;
171
171
  }
172
- .awsui_breadcrumb-group_d19fg_1nxag_93 > .awsui_breadcrumb-group-list_d19fg_1nxag_120:not(#\9) {
172
+ .awsui_breadcrumb-group_d19fg_fzncg_93 > .awsui_breadcrumb-group-list_d19fg_fzncg_120:not(#\9) {
173
173
  display: flex;
174
174
  align-items: center;
175
175
  padding: 0;
@@ -178,29 +178,32 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
178
178
  width: 100%;
179
179
  flex-wrap: wrap;
180
180
  }
181
- .awsui_breadcrumb-group_d19fg_1nxag_93 > .awsui_breadcrumb-group-list_d19fg_1nxag_120 > .awsui_item_d19fg_1nxag_107:not(#\9),
182
- .awsui_breadcrumb-group_d19fg_1nxag_93 > .awsui_breadcrumb-group-list_d19fg_1nxag_120 > .awsui_ellipsis_d19fg_1nxag_130:not(#\9) {
181
+ .awsui_breadcrumb-group_d19fg_fzncg_93 > .awsui_breadcrumb-group-list_d19fg_fzncg_120 > .awsui_item_d19fg_fzncg_107:not(#\9),
182
+ .awsui_breadcrumb-group_d19fg_fzncg_93 > .awsui_breadcrumb-group-list_d19fg_fzncg_120 > .awsui_ellipsis_d19fg_fzncg_130:not(#\9) {
183
183
  display: inline-block;
184
184
  padding: 0;
185
185
  margin: 0;
186
186
  }
187
- .awsui_breadcrumb-group_d19fg_1nxag_93 > .awsui_breadcrumb-group-list_d19fg_1nxag_120 > .awsui_ellipsis_d19fg_1nxag_130:not(#\9) {
187
+ .awsui_breadcrumb-group_d19fg_fzncg_93 > .awsui_breadcrumb-group-list_d19fg_fzncg_120 > .awsui_ellipsis_d19fg_fzncg_130:not(#\9) {
188
188
  display: none;
189
189
  }
190
- .awsui_breadcrumb-group_d19fg_1nxag_93 > .awsui_breadcrumb-group-list_d19fg_1nxag_120 > .awsui_ellipsis_d19fg_1nxag_130 > .awsui_icon_d19fg_1nxag_138:not(#\9) {
190
+ .awsui_breadcrumb-group_d19fg_fzncg_93 > .awsui_breadcrumb-group-list_d19fg_fzncg_120 > .awsui_ellipsis_d19fg_fzncg_130 > .awsui_icon_d19fg_fzncg_138:not(#\9) {
191
191
  margin: 0 10px;
192
192
  color: var(--color-text-breadcrumb-icon-mlugp6, #7d8998);
193
193
  }
194
- .awsui_breadcrumb-group_d19fg_1nxag_93.awsui_mobile_d19fg_1nxag_142 > .awsui_breadcrumb-group-list_d19fg_1nxag_120:not(#\9) {
194
+ .awsui_breadcrumb-group_d19fg_fzncg_93.awsui_mobile_d19fg_fzncg_142 > .awsui_breadcrumb-group-list_d19fg_fzncg_120:not(#\9) {
195
195
  flex-wrap: nowrap;
196
196
  }
197
- .awsui_breadcrumb-group_d19fg_1nxag_93.awsui_mobile_d19fg_1nxag_142 > .awsui_breadcrumb-group-list_d19fg_1nxag_120 > .awsui_ellipsis_d19fg_1nxag_130:not(#\9) {
197
+ .awsui_breadcrumb-group_d19fg_fzncg_93.awsui_mobile_d19fg_fzncg_142 > .awsui_breadcrumb-group-list_d19fg_fzncg_120 > .awsui_ellipsis_d19fg_fzncg_130:not(#\9) {
198
198
  display: flex;
199
199
  flex-shrink: 0;
200
200
  }
201
- .awsui_breadcrumb-group_d19fg_1nxag_93.awsui_mobile_d19fg_1nxag_142 > .awsui_breadcrumb-group-list_d19fg_1nxag_120 > .awsui_item_d19fg_1nxag_107:not(#\9) {
201
+ .awsui_breadcrumb-group_d19fg_fzncg_93.awsui_mobile_d19fg_fzncg_142 > .awsui_breadcrumb-group-list_d19fg_fzncg_120 > .awsui_item_d19fg_fzncg_107:not(#\9) {
202
202
  min-width: 0;
203
203
  }
204
- .awsui_breadcrumb-group_d19fg_1nxag_93.awsui_mobile_d19fg_1nxag_142 > .awsui_breadcrumb-group-list_d19fg_1nxag_120 > .awsui_item_d19fg_1nxag_107:not(#\9):not(:first-child):not(:last-child) {
204
+ .awsui_breadcrumb-group_d19fg_fzncg_93.awsui_mobile_d19fg_fzncg_142 > .awsui_breadcrumb-group-list_d19fg_fzncg_120 > .awsui_item_d19fg_fzncg_107:not(#\9):not(:first-child):not(:last-child) {
205
+ display: none;
206
+ }
207
+ .awsui_breadcrumb-group_d19fg_fzncg_93.awsui_mobile-short_d19fg_fzncg_155 > .awsui_breadcrumb-group-list_d19fg_fzncg_120 > .awsui_ellipsis_d19fg_fzncg_130:not(#\9) {
205
208
  display: none;
206
209
  }
@@ -2,11 +2,12 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "breadcrumb-group": "awsui_breadcrumb-group_d19fg_1nxag_93",
6
- "item": "awsui_item_d19fg_1nxag_107",
7
- "breadcrumb-group-list": "awsui_breadcrumb-group-list_d19fg_1nxag_120",
8
- "ellipsis": "awsui_ellipsis_d19fg_1nxag_130",
9
- "icon": "awsui_icon_d19fg_1nxag_138",
10
- "mobile": "awsui_mobile_d19fg_1nxag_142"
5
+ "breadcrumb-group": "awsui_breadcrumb-group_d19fg_fzncg_93",
6
+ "item": "awsui_item_d19fg_fzncg_107",
7
+ "breadcrumb-group-list": "awsui_breadcrumb-group-list_d19fg_fzncg_120",
8
+ "ellipsis": "awsui_ellipsis_d19fg_fzncg_130",
9
+ "icon": "awsui_icon_d19fg_fzncg_138",
10
+ "mobile": "awsui_mobile_d19fg_fzncg_142",
11
+ "mobile-short": "awsui_mobile-short_d19fg_fzncg_155"
11
12
  };
12
13
 
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/button/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAK3C,OAAO,EAAE,WAAW,EAAE,CAAC;AAEvB,QAAA,MAAM,MAAM,qFA0DX,CAAC;AAGF,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/button/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAK3C,OAAO,EAAE,WAAW,EAAE,CAAC;AAEvB,QAAA,MAAM,MAAM,qFA4DX,CAAC;AAGF,eAAe,MAAM,CAAC"}
package/button/index.js CHANGED
@@ -7,10 +7,10 @@ import { InternalButton } from './internal';
7
7
  import { applyDisplayName } from '../internal/utils/apply-display-name';
8
8
  import useBaseComponent from '../internal/hooks/use-base-component';
9
9
  const Button = React.forwardRef((_a, ref) => {
10
- var { children, iconName, iconAlign = 'left', iconUrl, iconSvg, iconAlt, variant = 'normal', loading = false, loadingText, disabled = false, wrapText = true, href, target, rel, download, formAction = 'submit', ariaLabel, onClick, onFollow, ariaExpanded } = _a, props = __rest(_a, ["children", "iconName", "iconAlign", "iconUrl", "iconSvg", "iconAlt", "variant", "loading", "loadingText", "disabled", "wrapText", "href", "target", "rel", "download", "formAction", "ariaLabel", "onClick", "onFollow", "ariaExpanded"]);
10
+ var { children, iconName, iconAlign = 'left', iconUrl, iconSvg, iconAlt, variant = 'normal', loading = false, loadingText, disabled = false, wrapText = true, href, target, rel, download, formAction = 'submit', ariaLabel, onClick, onFollow, ariaExpanded, form } = _a, props = __rest(_a, ["children", "iconName", "iconAlign", "iconUrl", "iconSvg", "iconAlt", "variant", "loading", "loadingText", "disabled", "wrapText", "href", "target", "rel", "download", "formAction", "ariaLabel", "onClick", "onFollow", "ariaExpanded", "form"]);
11
11
  const baseComponentProps = useBaseComponent('Button');
12
12
  const baseProps = getBaseProps(props);
13
- return (React.createElement(InternalButton, Object.assign({}, baseProps, baseComponentProps, { ref: ref, iconName: iconName, iconAlign: iconAlign, iconUrl: iconUrl, iconSvg: iconSvg, iconAlt: iconAlt, variant: variant, loading: loading, loadingText: loadingText, disabled: disabled, wrapText: wrapText, href: href, target: target, rel: rel, download: download, formAction: formAction, ariaLabel: ariaLabel, onClick: onClick, onFollow: onFollow, ariaExpanded: ariaExpanded }), children));
13
+ return (React.createElement(InternalButton, Object.assign({}, baseProps, baseComponentProps, { ref: ref, iconName: iconName, iconAlign: iconAlign, iconUrl: iconUrl, iconSvg: iconSvg, iconAlt: iconAlt, variant: variant, loading: loading, loadingText: loadingText, disabled: disabled, wrapText: wrapText, href: href, target: target, rel: rel, download: download, formAction: formAction, ariaLabel: ariaLabel, onClick: onClick, onFollow: onFollow, ariaExpanded: ariaExpanded, form: form }), children));
14
14
  });
15
15
  applyDisplayName(Button, 'Button');
16
16
  export default Button;
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/button/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,OAAO,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAC5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAIpE,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAC7B,CACE,EAsBc,EACd,GAA+B,EAC/B,EAAE;QAxBF,EACE,QAAQ,EACR,QAAQ,EACR,SAAS,GAAG,MAAM,EAClB,OAAO,EACP,OAAO,EACP,OAAO,EACP,OAAO,GAAG,QAAQ,EAClB,OAAO,GAAG,KAAK,EACf,WAAW,EACX,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,IAAI,EACf,IAAI,EACJ,MAAM,EACN,GAAG,EACH,QAAQ,EACR,UAAU,GAAG,QAAQ,EACrB,SAAS,EACT,OAAO,EACP,QAAQ,EACR,YAAY,OAEA,EADT,KAAK,cArBV,0OAsBC,CADS;IAIV,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACtD,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IACtC,OAAO,CACL,oBAAC,cAAc,oBACT,SAAS,EACT,kBAAkB,IACtB,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,KAEzB,QAAQ,CACM,CAClB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,gBAAgB,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;AACnC,eAAe,MAAM,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { getBaseProps } from '../internal/base-component';\nimport { ButtonProps } from './interfaces';\nimport { InternalButton } from './internal';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\n\nexport { ButtonProps };\n\nconst Button = React.forwardRef(\n (\n {\n children,\n iconName,\n iconAlign = 'left',\n iconUrl,\n iconSvg,\n iconAlt,\n variant = 'normal',\n loading = false,\n loadingText,\n disabled = false,\n wrapText = true,\n href,\n target,\n rel,\n download,\n formAction = 'submit',\n ariaLabel,\n onClick,\n onFollow,\n ariaExpanded,\n ...props\n }: ButtonProps,\n ref: React.Ref<ButtonProps.Ref>\n ) => {\n const baseComponentProps = useBaseComponent('Button');\n const baseProps = getBaseProps(props);\n return (\n <InternalButton\n {...baseProps}\n {...baseComponentProps}\n ref={ref}\n iconName={iconName}\n iconAlign={iconAlign}\n iconUrl={iconUrl}\n iconSvg={iconSvg}\n iconAlt={iconAlt}\n variant={variant}\n loading={loading}\n loadingText={loadingText}\n disabled={disabled}\n wrapText={wrapText}\n href={href}\n target={target}\n rel={rel}\n download={download}\n formAction={formAction}\n ariaLabel={ariaLabel}\n onClick={onClick}\n onFollow={onFollow}\n ariaExpanded={ariaExpanded}\n >\n {children}\n </InternalButton>\n );\n }\n);\n\napplyDisplayName(Button, 'Button');\nexport default Button;\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/button/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,OAAO,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAC5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAIpE,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAC7B,CACE,EAuBc,EACd,GAA+B,EAC/B,EAAE;QAzBF,EACE,QAAQ,EACR,QAAQ,EACR,SAAS,GAAG,MAAM,EAClB,OAAO,EACP,OAAO,EACP,OAAO,EACP,OAAO,GAAG,QAAQ,EAClB,OAAO,GAAG,KAAK,EACf,WAAW,EACX,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,IAAI,EACf,IAAI,EACJ,MAAM,EACN,GAAG,EACH,QAAQ,EACR,UAAU,GAAG,QAAQ,EACrB,SAAS,EACT,OAAO,EACP,QAAQ,EACR,YAAY,EACZ,IAAI,OAEQ,EADT,KAAK,cAtBV,kPAuBC,CADS;IAIV,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACtD,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IACtC,OAAO,CACL,oBAAC,cAAc,oBACT,SAAS,EACT,kBAAkB,IACtB,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,IAAI,EAAE,IAAI,KAET,QAAQ,CACM,CAClB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,gBAAgB,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;AACnC,eAAe,MAAM,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { getBaseProps } from '../internal/base-component';\nimport { ButtonProps } from './interfaces';\nimport { InternalButton } from './internal';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\n\nexport { ButtonProps };\n\nconst Button = React.forwardRef(\n (\n {\n children,\n iconName,\n iconAlign = 'left',\n iconUrl,\n iconSvg,\n iconAlt,\n variant = 'normal',\n loading = false,\n loadingText,\n disabled = false,\n wrapText = true,\n href,\n target,\n rel,\n download,\n formAction = 'submit',\n ariaLabel,\n onClick,\n onFollow,\n ariaExpanded,\n form,\n ...props\n }: ButtonProps,\n ref: React.Ref<ButtonProps.Ref>\n ) => {\n const baseComponentProps = useBaseComponent('Button');\n const baseProps = getBaseProps(props);\n return (\n <InternalButton\n {...baseProps}\n {...baseComponentProps}\n ref={ref}\n iconName={iconName}\n iconAlign={iconAlign}\n iconUrl={iconUrl}\n iconSvg={iconSvg}\n iconAlt={iconAlt}\n variant={variant}\n loading={loading}\n loadingText={loadingText}\n disabled={disabled}\n wrapText={wrapText}\n href={href}\n target={target}\n rel={rel}\n download={download}\n formAction={formAction}\n ariaLabel={ariaLabel}\n onClick={onClick}\n onFollow={onFollow}\n ariaExpanded={ariaExpanded}\n form={form}\n >\n {children}\n </InternalButton>\n );\n }\n);\n\napplyDisplayName(Button, 'Button');\nexport default Button;\n"]}
@@ -99,6 +99,10 @@ export interface ButtonProps extends BaseComponentProps {
99
99
  * * `inline-icon` to display an icon-only (no text) button within a text context.
100
100
  */
101
101
  variant?: ButtonProps.Variant;
102
+ /** The id of the <form> element to associate with the button. The value of this attribute must be the id of a <form> in the same document.
103
+ * Use when a button is not the ancestor of a form element, such as when used in a modal.
104
+ */
105
+ form?: string;
102
106
  /**
103
107
  * Text displayed in the button element.
104
108
  * @displayname text
@@ -1 +1 @@
1
- {"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/button/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,sBAAsB,EAAE,WAAW,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAEzF,MAAM,WAAW,WAAY,SAAQ,kBAAkB;IACrD;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC;IAC1B;;OAEG;IACH,SAAS,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC;IAClC;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,UAAU,CAAC,EAAE,WAAW,CAAC,UAAU,CAAC;IACpC;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;;QAII;IACJ,QAAQ,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAE5B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC;IAE9B;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;OAEG;IACH,OAAO,CAAC,EAAE,sBAAsB,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC;IAE1D;;;OAGG;IACH,QAAQ,CAAC,EAAE,sBAAsB,CAAC,IAAI,CAAC,CAAC;IAExC;;OAEG;IAEH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,yBAAiB,WAAW,CAAC;IAC3B,KAAY,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,aAAa,CAAC;IAC7E,KAAY,WAAW,GAAG,YAAY,CAAC;IAEvC,KAAY,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAC;IAE3C,KAAY,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC;IAEzC,UAAiB,GAAG;QAClB;;WAEG;QACH,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY,GAAG,IAAI,CAAC;KACrC;CACF"}
1
+ {"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/button/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,sBAAsB,EAAE,WAAW,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAEzF,MAAM,WAAW,WAAY,SAAQ,kBAAkB;IACrD;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC;IAC1B;;OAEG;IACH,SAAS,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC;IAClC;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,UAAU,CAAC,EAAE,WAAW,CAAC,UAAU,CAAC;IACpC;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;;QAII;IACJ,QAAQ,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAE5B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC;IAE9B;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;OAEG;IACH,OAAO,CAAC,EAAE,sBAAsB,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC;IAE1D;;;OAGG;IACH,QAAQ,CAAC,EAAE,sBAAsB,CAAC,IAAI,CAAC,CAAC;IAExC;;OAEG;IAEH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,yBAAiB,WAAW,CAAC;IAC3B,KAAY,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,aAAa,CAAC;IAC7E,KAAY,WAAW,GAAG,YAAY,CAAC;IAEvC,KAAY,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAC;IAE3C,KAAY,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC;IAEzC,UAAiB,GAAG;QAClB;;WAEG;QACH,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY,GAAG,IAAI,CAAC;KACrC;CACF"}
@@ -1 +1 @@
1
- {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/button/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\nimport { IconProps } from '../icon/interfaces';\nimport React from 'react';\nimport { CancelableEventHandler, ClickDetail as _ClickDetail } from '../internal/events';\n\nexport interface ButtonProps extends BaseComponentProps {\n /**\n * Renders the button as disabled and prevents clicks.\n */\n disabled?: boolean;\n /**\n * Renders the button as being in a loading state. It takes precedence over the `disabled` if both are set to `true`.\n * It prevents users from clicking the button.\n */\n loading?: boolean;\n /**\n * Specifies the text that screen reader announces when the button is in a loading state.\n */\n loadingText?: string;\n /**\n * Displays an icon next to the text. You can use the `iconAlign` property to position the icon.\n */\n iconName?: IconProps.Name;\n /**\n * Specifies the alignment of the icon.\n */\n iconAlign?: ButtonProps.IconAlign;\n /**\n * Specifies the URL of a custom icon. Use this property if the icon you want isn't available.\n *\n * If you set both `iconUrl` and `iconSvg`, `iconSvg` will take precedence.\n */\n iconUrl?: string;\n /**\n * Specifies the SVG of a custom icon.\n *\n * Use this property if you want your custom icon to inherit colors dictated by variant or hover states.\n * When this property is set, the component will be decorated with `aria-hidden=\"true\"`. Ensure that the `svg` element:\n * - has attribute `focusable=\"false\"`.\n * - has `viewBox=\"0 0 16 16\"`.\n *\n * If you set the `svg` element as the root node of the slot, the component will automatically\n * - set `stroke=\"currentColor\"`, `fill=\"none\"`, and `vertical-align=\"top\"`.\n * - set the stroke width based on the size of the icon.\n * - set the width and height of the SVG element based on the size of the icon.\n *\n * If you don't want these styles to be automatically set, wrap the `svg` element into a `span`.\n * You can still set the stroke to `currentColor` to inherit the color of the surrounding elements.\n *\n * If you set both `iconUrl` and `iconSvg`, `iconSvg` will take precedence.\n *\n * *Note:* Remember to remove any additional elements (for example: `defs`) and related CSS classes from SVG files exported from design software.\n * In most cases, they aren't needed, as the `svg` element inherits styles from the icon component.\n */\n iconSvg?: React.ReactNode;\n /**\n * Specifies alternate text for a custom icon. We recommend that you provide this for accessibility.\n * This property is ignored if you use a predefined icon or if you set your custom icon using the `iconSvg` slot.\n */\n iconAlt?: string;\n /**\n * The form action that is performed by a button click.\n */\n formAction?: ButtonProps.FormAction;\n /**\n * Adds `aria-label` to the button element. It should be used in buttons that don't have text in order to make\n * them accessible.\n */\n ariaLabel?: string;\n /**\n * Applies button styling to a link. Use this property if you need a link styled as a button (`variant=link`).\n * For example, if you have a 'help' button that links to a documentation page.\n */\n href?: string;\n\n /**\n * Specifies where to open the linked URL (for example, to open in a new browser window or tab use `_blank`).\n * This property only applies when an `href` is provided.\n */\n target?: string;\n\n /**\n * Adds a `rel` attribute to the link. By default, the component sets the `rel` attribute to \"noopener noreferrer\" when `target` is `\"_blank\"`.\n * If the `rel` property is provided, it overrides the default behavior.\n */\n rel?: string;\n\n /**\n * Specifies whether the linked URL, when selected, will prompt the user to download instead of navigate.\n * You can specify a string value that will be suggested as the name of the downloaded file.\n * This property only applies when an `href` is provided.\n **/\n download?: boolean | string;\n\n /**\n * Specifies if the `text` content wraps. If you set it to `false`, it prevents the text from wrapping.\n */\n wrapText?: boolean;\n\n /** Determines the general styling of the button as follows:\n * * `primary` for primary buttons.\n * * `normal` for secondary buttons.\n * * `link` for tertiary buttons.\n * * `icon` to display an icon only (no text).\n * * `inline-icon` to display an icon-only (no text) button within a text context.\n */\n variant?: ButtonProps.Variant;\n\n /**\n * Text displayed in the button element.\n * @displayname text\n */\n children?: React.ReactNode;\n\n /**\n * Called when the user clicks on the button and the button is not disabled or in loading state.\n */\n onClick?: CancelableEventHandler<ButtonProps.ClickDetail>;\n\n /**\n * Called when the user clicks on the button with the left mouse button without pressing\n * modifier keys (that is, CTRL, ALT, SHIFT, META), and the button has an `href` set.\n */\n onFollow?: CancelableEventHandler<null>;\n\n /**\n * Adds aria-expanded to the button element. Use when the button controls an expandable element.\n */\n\n ariaExpanded?: boolean;\n}\n\nexport namespace ButtonProps {\n export type Variant = 'normal' | 'primary' | 'link' | 'icon' | 'inline-icon';\n export type ClickDetail = _ClickDetail;\n\n export type FormAction = 'submit' | 'none';\n\n export type IconAlign = 'left' | 'right';\n\n export interface Ref {\n /**\n * Focuses the underlying native button.\n */\n focus(options?: FocusOptions): void;\n }\n}\n"]}
1
+ {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/button/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\nimport { IconProps } from '../icon/interfaces';\nimport React from 'react';\nimport { CancelableEventHandler, ClickDetail as _ClickDetail } from '../internal/events';\n\nexport interface ButtonProps extends BaseComponentProps {\n /**\n * Renders the button as disabled and prevents clicks.\n */\n disabled?: boolean;\n /**\n * Renders the button as being in a loading state. It takes precedence over the `disabled` if both are set to `true`.\n * It prevents users from clicking the button.\n */\n loading?: boolean;\n /**\n * Specifies the text that screen reader announces when the button is in a loading state.\n */\n loadingText?: string;\n /**\n * Displays an icon next to the text. You can use the `iconAlign` property to position the icon.\n */\n iconName?: IconProps.Name;\n /**\n * Specifies the alignment of the icon.\n */\n iconAlign?: ButtonProps.IconAlign;\n /**\n * Specifies the URL of a custom icon. Use this property if the icon you want isn't available.\n *\n * If you set both `iconUrl` and `iconSvg`, `iconSvg` will take precedence.\n */\n iconUrl?: string;\n /**\n * Specifies the SVG of a custom icon.\n *\n * Use this property if you want your custom icon to inherit colors dictated by variant or hover states.\n * When this property is set, the component will be decorated with `aria-hidden=\"true\"`. Ensure that the `svg` element:\n * - has attribute `focusable=\"false\"`.\n * - has `viewBox=\"0 0 16 16\"`.\n *\n * If you set the `svg` element as the root node of the slot, the component will automatically\n * - set `stroke=\"currentColor\"`, `fill=\"none\"`, and `vertical-align=\"top\"`.\n * - set the stroke width based on the size of the icon.\n * - set the width and height of the SVG element based on the size of the icon.\n *\n * If you don't want these styles to be automatically set, wrap the `svg` element into a `span`.\n * You can still set the stroke to `currentColor` to inherit the color of the surrounding elements.\n *\n * If you set both `iconUrl` and `iconSvg`, `iconSvg` will take precedence.\n *\n * *Note:* Remember to remove any additional elements (for example: `defs`) and related CSS classes from SVG files exported from design software.\n * In most cases, they aren't needed, as the `svg` element inherits styles from the icon component.\n */\n iconSvg?: React.ReactNode;\n /**\n * Specifies alternate text for a custom icon. We recommend that you provide this for accessibility.\n * This property is ignored if you use a predefined icon or if you set your custom icon using the `iconSvg` slot.\n */\n iconAlt?: string;\n /**\n * The form action that is performed by a button click.\n */\n formAction?: ButtonProps.FormAction;\n /**\n * Adds `aria-label` to the button element. It should be used in buttons that don't have text in order to make\n * them accessible.\n */\n ariaLabel?: string;\n /**\n * Applies button styling to a link. Use this property if you need a link styled as a button (`variant=link`).\n * For example, if you have a 'help' button that links to a documentation page.\n */\n href?: string;\n\n /**\n * Specifies where to open the linked URL (for example, to open in a new browser window or tab use `_blank`).\n * This property only applies when an `href` is provided.\n */\n target?: string;\n\n /**\n * Adds a `rel` attribute to the link. By default, the component sets the `rel` attribute to \"noopener noreferrer\" when `target` is `\"_blank\"`.\n * If the `rel` property is provided, it overrides the default behavior.\n */\n rel?: string;\n\n /**\n * Specifies whether the linked URL, when selected, will prompt the user to download instead of navigate.\n * You can specify a string value that will be suggested as the name of the downloaded file.\n * This property only applies when an `href` is provided.\n **/\n download?: boolean | string;\n\n /**\n * Specifies if the `text` content wraps. If you set it to `false`, it prevents the text from wrapping.\n */\n wrapText?: boolean;\n\n /** Determines the general styling of the button as follows:\n * * `primary` for primary buttons.\n * * `normal` for secondary buttons.\n * * `link` for tertiary buttons.\n * * `icon` to display an icon only (no text).\n * * `inline-icon` to display an icon-only (no text) button within a text context.\n */\n variant?: ButtonProps.Variant;\n\n /** The id of the <form> element to associate with the button. The value of this attribute must be the id of a <form> in the same document.\n * Use when a button is not the ancestor of a form element, such as when used in a modal.\n */\n form?: string;\n\n /**\n * Text displayed in the button element.\n * @displayname text\n */\n children?: React.ReactNode;\n\n /**\n * Called when the user clicks on the button and the button is not disabled or in loading state.\n */\n onClick?: CancelableEventHandler<ButtonProps.ClickDetail>;\n\n /**\n * Called when the user clicks on the button with the left mouse button without pressing\n * modifier keys (that is, CTRL, ALT, SHIFT, META), and the button has an `href` set.\n */\n onFollow?: CancelableEventHandler<null>;\n\n /**\n * Adds aria-expanded to the button element. Use when the button controls an expandable element.\n */\n\n ariaExpanded?: boolean;\n}\n\nexport namespace ButtonProps {\n export type Variant = 'normal' | 'primary' | 'link' | 'icon' | 'inline-icon';\n export type ClickDetail = _ClickDetail;\n\n export type FormAction = 'submit' | 'none';\n\n export type IconAlign = 'left' | 'right';\n\n export interface Ref {\n /**\n * Focuses the underlying native button.\n */\n focus(options?: FocusOptions): void;\n }\n}\n"]}
@@ -25,7 +25,7 @@ export interface GridProps {
25
25
  onFocusDate: (date: null | Date) => void;
26
26
  onChangeMonth: (date: Date) => void;
27
27
  startOfWeek: DayIndex;
28
- todayAriaLabel: string;
28
+ todayAriaLabel?: string;
29
29
  selectedDate: Date | null;
30
30
  ariaLabelledby: string;
31
31
  }
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/calendar/grid/index.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAQ/D;;;;;;;;;;;;;GAaG;AAEH,MAAM,WAAW,SAAS;IACxB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,IAAI,CAAC;IACf,aAAa,EAAE,eAAe,CAAC,qBAAqB,CAAC;IACrD,WAAW,EAAE,IAAI,GAAG,IAAI,CAAC;IACzB,aAAa,EAAE,IAAI,GAAG,IAAI,CAAC;IAC3B,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,WAAW,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IACzC,aAAa,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACpC,WAAW,EAAE,QAAQ,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,EAAE,IAAI,GAAG,IAAI,CAAC;IAC1B,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAC3B,MAAM,EACN,QAAQ,EACR,aAAa,EACb,WAAW,EACX,aAAa,EACb,YAAY,EACZ,WAAW,EACX,aAAa,EACb,WAAW,EACX,cAAc,EACd,YAAY,EACZ,cAAc,GACf,EAAE,SAAS,eAoIX"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/calendar/grid/index.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAQ/D;;;;;;;;;;;;;GAaG;AAEH,MAAM,WAAW,SAAS;IACxB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,IAAI,CAAC;IACf,aAAa,EAAE,eAAe,CAAC,qBAAqB,CAAC;IACrD,WAAW,EAAE,IAAI,GAAG,IAAI,CAAC;IACzB,aAAa,EAAE,IAAI,GAAG,IAAI,CAAC;IAC3B,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,WAAW,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IACzC,aAAa,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACpC,WAAW,EAAE,QAAQ,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,EAAE,IAAI,GAAG,IAAI,CAAC;IAC1B,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAC3B,MAAM,EACN,QAAQ,EACR,aAAa,EACb,WAAW,EACX,aAAa,EACb,YAAY,EACZ,WAAW,EACX,aAAa,EACb,WAAW,EACX,cAAc,EACd,YAAY,EACZ,cAAc,GACf,EAAE,SAAS,eAoIX"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/calendar/grid/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useMemo, useRef } from 'react';\nimport styles from '../styles.css.js';\nimport { KeyCode } from '../../internal/keycode';\nimport { isSameDay, isSameMonth } from 'date-fns';\nimport { getCalendarMonth } from 'mnth';\nimport { DayIndex } from '../internal';\nimport { DatePickerProps } from '../../date-picker/interfaces';\nimport { getDateLabel, renderDayName } from '../utils/intl';\nimport useFocusVisible from '../../internal/hooks/focus-visible/index.js';\nimport clsx from 'clsx';\nimport { useEffectOnUpdate } from '../../internal/hooks/use-effect-on-update.js';\nimport ScreenreaderOnly from '../../internal/components/screenreader-only/index.js';\nimport { moveNextDay, movePrevDay, moveNextWeek, movePrevWeek } from '../utils/navigation';\n\n/**\n * Calendar grid supports two mechanisms of keyboard navigation:\n * - Native screen-reader table navigation (semantic table markup);\n * - Keyboard arrow-keys navigation (a custom key-down handler).\n *\n * The implementation largely follows the w3 example (https://www.w3.org/WAI/ARIA/apg/example-index/dialog-modal/datepicker-dialog) and shares the following issues:\n * - (table navigation) Chrome+VO - weekday is announced twice when navigating to the calendar's header;\n * - (table navigation) Safari+VO - \"dimmed\" state is announced twice;\n * - (table navigation) Firefox/Chrome+NVDA - cannot use table navigation if any cell has a focus;\n * - (keyboard navigation) Firefox+NVDA - every day is announced as \"not selected\";\n * - (keyboard navigation) Safari/Chrome+VO - weekdays are not announced;\n * - (keyboard navigation) Safari/Chrome+VO - days are not announced as interactive (clickable or selectable);\n * - (keyboard navigation) Safari/Chrome+VO - day announcements are not interruptive and can be missed if navigating fast.\n */\n\nexport interface GridProps {\n locale: string;\n baseDate: Date;\n isDateEnabled: DatePickerProps.IsDateEnabledFunction;\n focusedDate: Date | null;\n focusableDate: Date | null;\n onSelectDate: (date: Date) => void;\n onFocusDate: (date: null | Date) => void;\n onChangeMonth: (date: Date) => void;\n startOfWeek: DayIndex;\n todayAriaLabel: string;\n selectedDate: Date | null;\n ariaLabelledby: string;\n}\n\nexport default function Grid({\n locale,\n baseDate,\n isDateEnabled,\n focusedDate,\n focusableDate,\n onSelectDate,\n onFocusDate,\n onChangeMonth,\n startOfWeek,\n todayAriaLabel,\n selectedDate,\n ariaLabelledby,\n}: GridProps) {\n const focusedDateRef = useRef<HTMLTableCellElement>(null);\n\n const onGridKeyDownHandler = (event: React.KeyboardEvent) => {\n let updatedFocusDate;\n\n if (focusableDate === null) {\n return;\n }\n\n switch (event.keyCode) {\n case KeyCode.space:\n case KeyCode.enter:\n event.preventDefault();\n if (focusableDate) {\n onFocusDate(null);\n onSelectDate(focusableDate);\n }\n return;\n case KeyCode.right:\n event.preventDefault();\n updatedFocusDate = moveNextDay(focusableDate, isDateEnabled);\n break;\n case KeyCode.left:\n event.preventDefault();\n updatedFocusDate = movePrevDay(focusableDate, isDateEnabled);\n break;\n case KeyCode.up:\n event.preventDefault();\n updatedFocusDate = movePrevWeek(focusableDate, isDateEnabled);\n break;\n case KeyCode.down:\n event.preventDefault();\n updatedFocusDate = moveNextWeek(focusableDate, isDateEnabled);\n break;\n default:\n return;\n }\n\n if (!isSameMonth(updatedFocusDate, baseDate)) {\n onChangeMonth(updatedFocusDate);\n }\n onFocusDate(updatedFocusDate);\n };\n\n // The focused date changes as a feedback to keyboard navigation in the grid.\n // Once changed, the corresponding day button needs to receive the actual focus.\n useEffectOnUpdate(() => {\n if (focusedDate && focusedDateRef.current) {\n (focusedDateRef.current as HTMLDivElement).focus();\n }\n }, [focusedDate]);\n\n const weeks = useMemo<Date[][]>(\n () => getCalendarMonth(baseDate, { firstDayOfWeek: startOfWeek }),\n [baseDate, startOfWeek]\n );\n const weekdays = weeks[0].map(date => date.getDay());\n\n const focusVisible = useFocusVisible();\n\n return (\n <table role=\"grid\" className={styles['calendar-grid']} aria-labelledby={ariaLabelledby}>\n <thead>\n <tr>\n {weekdays.map(dayIndex => (\n <th\n key={dayIndex}\n scope=\"col\"\n className={clsx(styles['calendar-grid-cell'], styles['calendar-day-header'])}\n >\n <span aria-hidden=\"true\">{renderDayName(locale, dayIndex, 'short')}</span>\n <ScreenreaderOnly>{renderDayName(locale, dayIndex, 'long')}</ScreenreaderOnly>\n </th>\n ))}\n </tr>\n </thead>\n <tbody onKeyDown={onGridKeyDownHandler}>\n {weeks.map((week, weekIndex) => (\n <tr key={weekIndex} className={styles['calendar-week']}>\n {week.map((date, dateIndex) => {\n const isFocusable = !!focusableDate && isSameDay(date, focusableDate);\n const isSelected = !!selectedDate && isSameDay(date, selectedDate);\n const isEnabled = !isDateEnabled || isDateEnabled(date);\n const isDateOnSameDay = isSameDay(date, new Date());\n\n // Can't be focused.\n let tabIndex = undefined;\n if (isFocusable && isEnabled) {\n // Next focus target.\n tabIndex = 0;\n } else if (isEnabled) {\n // Can be focused programmatically.\n tabIndex = -1;\n }\n\n // Screen-reader announcement for the focused day.\n let dayAnnouncement = getDateLabel(locale, date, 'short');\n if (isDateOnSameDay) {\n dayAnnouncement += '. ' + todayAriaLabel;\n }\n\n return (\n <td\n key={`${weekIndex}:${dateIndex}`}\n ref={tabIndex === 0 ? focusedDateRef : undefined}\n tabIndex={tabIndex}\n aria-current={isDateOnSameDay ? 'date' : undefined}\n aria-selected={isEnabled ? isSelected : undefined}\n aria-disabled={!isEnabled}\n // Do not attach click event when the date is disabled, otherwise VO+safari announces clickable\n onClick={isEnabled ? () => onSelectDate(date) : undefined}\n className={clsx(styles['calendar-grid-cell'], styles['calendar-day'], {\n [styles['calendar-day-current-month']]: isSameMonth(date, baseDate),\n [styles['calendar-day-enabled']]: isEnabled,\n [styles['calendar-day-selected']]: isSelected,\n [styles['calendar-day-today']]: isDateOnSameDay,\n })}\n {...focusVisible}\n >\n <span className={styles['day-inner']} aria-hidden=\"true\">\n {date.getDate()}\n </span>\n <ScreenreaderOnly>{dayAnnouncement}</ScreenreaderOnly>\n </td>\n );\n })}\n </tr>\n ))}\n </tbody>\n </table>\n );\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/calendar/grid/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useMemo, useRef } from 'react';\nimport styles from '../styles.css.js';\nimport { KeyCode } from '../../internal/keycode';\nimport { isSameDay, isSameMonth } from 'date-fns';\nimport { getCalendarMonth } from 'mnth';\nimport { DayIndex } from '../internal';\nimport { DatePickerProps } from '../../date-picker/interfaces';\nimport { getDateLabel, renderDayName } from '../utils/intl';\nimport useFocusVisible from '../../internal/hooks/focus-visible/index.js';\nimport clsx from 'clsx';\nimport { useEffectOnUpdate } from '../../internal/hooks/use-effect-on-update.js';\nimport ScreenreaderOnly from '../../internal/components/screenreader-only/index.js';\nimport { moveNextDay, movePrevDay, moveNextWeek, movePrevWeek } from '../utils/navigation';\n\n/**\n * Calendar grid supports two mechanisms of keyboard navigation:\n * - Native screen-reader table navigation (semantic table markup);\n * - Keyboard arrow-keys navigation (a custom key-down handler).\n *\n * The implementation largely follows the w3 example (https://www.w3.org/WAI/ARIA/apg/example-index/dialog-modal/datepicker-dialog) and shares the following issues:\n * - (table navigation) Chrome+VO - weekday is announced twice when navigating to the calendar's header;\n * - (table navigation) Safari+VO - \"dimmed\" state is announced twice;\n * - (table navigation) Firefox/Chrome+NVDA - cannot use table navigation if any cell has a focus;\n * - (keyboard navigation) Firefox+NVDA - every day is announced as \"not selected\";\n * - (keyboard navigation) Safari/Chrome+VO - weekdays are not announced;\n * - (keyboard navigation) Safari/Chrome+VO - days are not announced as interactive (clickable or selectable);\n * - (keyboard navigation) Safari/Chrome+VO - day announcements are not interruptive and can be missed if navigating fast.\n */\n\nexport interface GridProps {\n locale: string;\n baseDate: Date;\n isDateEnabled: DatePickerProps.IsDateEnabledFunction;\n focusedDate: Date | null;\n focusableDate: Date | null;\n onSelectDate: (date: Date) => void;\n onFocusDate: (date: null | Date) => void;\n onChangeMonth: (date: Date) => void;\n startOfWeek: DayIndex;\n todayAriaLabel?: string;\n selectedDate: Date | null;\n ariaLabelledby: string;\n}\n\nexport default function Grid({\n locale,\n baseDate,\n isDateEnabled,\n focusedDate,\n focusableDate,\n onSelectDate,\n onFocusDate,\n onChangeMonth,\n startOfWeek,\n todayAriaLabel,\n selectedDate,\n ariaLabelledby,\n}: GridProps) {\n const focusedDateRef = useRef<HTMLTableCellElement>(null);\n\n const onGridKeyDownHandler = (event: React.KeyboardEvent) => {\n let updatedFocusDate;\n\n if (focusableDate === null) {\n return;\n }\n\n switch (event.keyCode) {\n case KeyCode.space:\n case KeyCode.enter:\n event.preventDefault();\n if (focusableDate) {\n onFocusDate(null);\n onSelectDate(focusableDate);\n }\n return;\n case KeyCode.right:\n event.preventDefault();\n updatedFocusDate = moveNextDay(focusableDate, isDateEnabled);\n break;\n case KeyCode.left:\n event.preventDefault();\n updatedFocusDate = movePrevDay(focusableDate, isDateEnabled);\n break;\n case KeyCode.up:\n event.preventDefault();\n updatedFocusDate = movePrevWeek(focusableDate, isDateEnabled);\n break;\n case KeyCode.down:\n event.preventDefault();\n updatedFocusDate = moveNextWeek(focusableDate, isDateEnabled);\n break;\n default:\n return;\n }\n\n if (!isSameMonth(updatedFocusDate, baseDate)) {\n onChangeMonth(updatedFocusDate);\n }\n onFocusDate(updatedFocusDate);\n };\n\n // The focused date changes as a feedback to keyboard navigation in the grid.\n // Once changed, the corresponding day button needs to receive the actual focus.\n useEffectOnUpdate(() => {\n if (focusedDate && focusedDateRef.current) {\n (focusedDateRef.current as HTMLDivElement).focus();\n }\n }, [focusedDate]);\n\n const weeks = useMemo<Date[][]>(\n () => getCalendarMonth(baseDate, { firstDayOfWeek: startOfWeek }),\n [baseDate, startOfWeek]\n );\n const weekdays = weeks[0].map(date => date.getDay());\n\n const focusVisible = useFocusVisible();\n\n return (\n <table role=\"grid\" className={styles['calendar-grid']} aria-labelledby={ariaLabelledby}>\n <thead>\n <tr>\n {weekdays.map(dayIndex => (\n <th\n key={dayIndex}\n scope=\"col\"\n className={clsx(styles['calendar-grid-cell'], styles['calendar-day-header'])}\n >\n <span aria-hidden=\"true\">{renderDayName(locale, dayIndex, 'short')}</span>\n <ScreenreaderOnly>{renderDayName(locale, dayIndex, 'long')}</ScreenreaderOnly>\n </th>\n ))}\n </tr>\n </thead>\n <tbody onKeyDown={onGridKeyDownHandler}>\n {weeks.map((week, weekIndex) => (\n <tr key={weekIndex} className={styles['calendar-week']}>\n {week.map((date, dateIndex) => {\n const isFocusable = !!focusableDate && isSameDay(date, focusableDate);\n const isSelected = !!selectedDate && isSameDay(date, selectedDate);\n const isEnabled = !isDateEnabled || isDateEnabled(date);\n const isDateOnSameDay = isSameDay(date, new Date());\n\n // Can't be focused.\n let tabIndex = undefined;\n if (isFocusable && isEnabled) {\n // Next focus target.\n tabIndex = 0;\n } else if (isEnabled) {\n // Can be focused programmatically.\n tabIndex = -1;\n }\n\n // Screen-reader announcement for the focused day.\n let dayAnnouncement = getDateLabel(locale, date, 'short');\n if (isDateOnSameDay) {\n dayAnnouncement += '. ' + todayAriaLabel;\n }\n\n return (\n <td\n key={`${weekIndex}:${dateIndex}`}\n ref={tabIndex === 0 ? focusedDateRef : undefined}\n tabIndex={tabIndex}\n aria-current={isDateOnSameDay ? 'date' : undefined}\n aria-selected={isEnabled ? isSelected : undefined}\n aria-disabled={!isEnabled}\n // Do not attach click event when the date is disabled, otherwise VO+safari announces clickable\n onClick={isEnabled ? () => onSelectDate(date) : undefined}\n className={clsx(styles['calendar-grid-cell'], styles['calendar-day'], {\n [styles['calendar-day-current-month']]: isSameMonth(date, baseDate),\n [styles['calendar-day-enabled']]: isEnabled,\n [styles['calendar-day-selected']]: isSelected,\n [styles['calendar-day-today']]: isDateOnSameDay,\n })}\n {...focusVisible}\n >\n <span className={styles['day-inner']} aria-hidden=\"true\">\n {date.getDate()}\n </span>\n <ScreenreaderOnly>{dayAnnouncement}</ScreenreaderOnly>\n </td>\n );\n })}\n </tr>\n ))}\n </tbody>\n </table>\n );\n}\n"]}
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  interface HeaderButtonProps {
3
- ariaLabel: string;
3
+ ariaLabel?: string;
4
4
  baseDate: Date;
5
5
  onChangeMonth: (date: Date) => void;
6
6
  }
@@ -1 +1 @@
1
- {"version":3,"file":"header-button.d.ts","sourceRoot":"","sources":["../../../../src/calendar/header/header-button.tsx"],"names":[],"mappings":";AAQA,UAAU,iBAAiB;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,IAAI,CAAC;IACf,aAAa,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CACrC;AAED,wBAAgB,eAAe,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,aAAa,EAAE,EAAE,iBAAiB,eAWxF;AAED,wBAAgB,eAAe,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,aAAa,EAAE,EAAE,iBAAiB,eAWxF"}
1
+ {"version":3,"file":"header-button.d.ts","sourceRoot":"","sources":["../../../../src/calendar/header/header-button.tsx"],"names":[],"mappings":";AAQA,UAAU,iBAAiB;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,IAAI,CAAC;IACf,aAAa,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CACrC;AAED,wBAAgB,eAAe,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,aAAa,EAAE,EAAE,iBAAiB,eAWxF;AAED,wBAAgB,eAAe,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,aAAa,EAAE,EAAE,iBAAiB,eAWxF"}
@@ -1 +1 @@
1
- {"version":3,"file":"header-button.js","sourceRoot":"","sources":["../../../../src/calendar/header/header-button.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,MAAM,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAQrC,MAAM,UAAU,eAAe,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,aAAa,EAAqB;IACvF,OAAO,CACL,oBAAC,cAAc,IACb,QAAQ,EAAC,YAAY,EACrB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAC,MAAM,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAC,EACrD,UAAU,EAAC,MAAM,EACjB,SAAS,EAAE,MAAM,CAAC,yBAAyB,CAAC,GAC5C,CACH,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,aAAa,EAAqB;IACvF,OAAO,CACL,oBAAC,cAAc,IACb,QAAQ,EAAC,aAAa,EACtB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAC,MAAM,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,EACpD,UAAU,EAAC,MAAM,EACjB,SAAS,EAAE,MAAM,CAAC,yBAAyB,CAAC,GAC5C,CACH,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React from 'react';\nimport { InternalButton } from '../../button/internal';\nimport styles from '../styles.css.js';\nimport { addMonths } from 'date-fns';\n\ninterface HeaderButtonProps {\n ariaLabel: string;\n baseDate: Date;\n onChangeMonth: (date: Date) => void;\n}\n\nexport function PrevMonthButton({ ariaLabel, baseDate, onChangeMonth }: HeaderButtonProps) {\n return (\n <InternalButton\n iconName=\"angle-left\"\n ariaLabel={ariaLabel}\n variant=\"icon\"\n onClick={() => onChangeMonth(addMonths(baseDate, -1))}\n formAction=\"none\"\n className={styles['calendar-prev-month-btn']}\n />\n );\n}\n\nexport function NextMonthButton({ ariaLabel, baseDate, onChangeMonth }: HeaderButtonProps) {\n return (\n <InternalButton\n iconName=\"angle-right\"\n ariaLabel={ariaLabel}\n variant=\"icon\"\n onClick={() => onChangeMonth(addMonths(baseDate, 1))}\n formAction=\"none\"\n className={styles['calendar-next-month-btn']}\n />\n );\n}\n"]}
1
+ {"version":3,"file":"header-button.js","sourceRoot":"","sources":["../../../../src/calendar/header/header-button.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,MAAM,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAQrC,MAAM,UAAU,eAAe,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,aAAa,EAAqB;IACvF,OAAO,CACL,oBAAC,cAAc,IACb,QAAQ,EAAC,YAAY,EACrB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAC,MAAM,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAC,EACrD,UAAU,EAAC,MAAM,EACjB,SAAS,EAAE,MAAM,CAAC,yBAAyB,CAAC,GAC5C,CACH,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,aAAa,EAAqB;IACvF,OAAO,CACL,oBAAC,cAAc,IACb,QAAQ,EAAC,aAAa,EACtB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAC,MAAM,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,EACpD,UAAU,EAAC,MAAM,EACjB,SAAS,EAAE,MAAM,CAAC,yBAAyB,CAAC,GAC5C,CACH,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React from 'react';\nimport { InternalButton } from '../../button/internal';\nimport styles from '../styles.css.js';\nimport { addMonths } from 'date-fns';\n\ninterface HeaderButtonProps {\n ariaLabel?: string;\n baseDate: Date;\n onChangeMonth: (date: Date) => void;\n}\n\nexport function PrevMonthButton({ ariaLabel, baseDate, onChangeMonth }: HeaderButtonProps) {\n return (\n <InternalButton\n iconName=\"angle-left\"\n ariaLabel={ariaLabel}\n variant=\"icon\"\n onClick={() => onChangeMonth(addMonths(baseDate, -1))}\n formAction=\"none\"\n className={styles['calendar-prev-month-btn']}\n />\n );\n}\n\nexport function NextMonthButton({ ariaLabel, baseDate, onChangeMonth }: HeaderButtonProps) {\n return (\n <InternalButton\n iconName=\"angle-right\"\n ariaLabel={ariaLabel}\n variant=\"icon\"\n onClick={() => onChangeMonth(addMonths(baseDate, 1))}\n formAction=\"none\"\n className={styles['calendar-next-month-btn']}\n />\n );\n}\n"]}