@cloudscape-design/components 3.0.799 → 3.0.800

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 (109) hide show
  1. package/attribute-editor/additional-info.js +2 -2
  2. package/attribute-editor/additional-info.js.map +1 -1
  3. package/attribute-editor/internal.d.ts.map +1 -1
  4. package/attribute-editor/internal.js +2 -2
  5. package/attribute-editor/internal.js.map +1 -1
  6. package/button/internal.d.ts.map +1 -1
  7. package/button/internal.js +3 -3
  8. package/button/internal.js.map +1 -1
  9. package/button-group/icon-button-item.d.ts.map +1 -1
  10. package/button-group/icon-button-item.js +3 -2
  11. package/button-group/icon-button-item.js.map +1 -1
  12. package/cards/index.js +3 -3
  13. package/cards/index.js.map +1 -1
  14. package/code-editor/index.d.ts.map +1 -1
  15. package/code-editor/index.js +2 -2
  16. package/code-editor/index.js.map +1 -1
  17. package/code-editor/status-bar.js +2 -2
  18. package/code-editor/status-bar.js.map +1 -1
  19. package/date-picker/index.js +2 -2
  20. package/date-picker/index.js.map +1 -1
  21. package/date-range-picker/calendar/header/index.js +2 -2
  22. package/date-range-picker/calendar/header/index.js.map +1 -1
  23. package/date-range-picker/calendar/index.d.ts.map +1 -1
  24. package/date-range-picker/calendar/index.js +2 -2
  25. package/date-range-picker/calendar/index.js.map +1 -1
  26. package/date-range-picker/dropdown.d.ts.map +1 -1
  27. package/date-range-picker/dropdown.js +2 -2
  28. package/date-range-picker/dropdown.js.map +1 -1
  29. package/drawer/implementation.d.ts.map +1 -1
  30. package/drawer/implementation.js +2 -2
  31. package/drawer/implementation.js.map +1 -1
  32. package/flashbar/flash.d.ts.map +1 -1
  33. package/flashbar/flash.js +2 -2
  34. package/flashbar/flash.js.map +1 -1
  35. package/form/internal.js +2 -2
  36. package/form/internal.js.map +1 -1
  37. package/form-field/internal.js +3 -3
  38. package/form-field/internal.js.map +1 -1
  39. package/help-panel/implementation.js +2 -2
  40. package/help-panel/implementation.js.map +1 -1
  41. package/internal/components/chart-plot/index.js +2 -2
  42. package/internal/components/chart-plot/index.js.map +1 -1
  43. package/internal/components/chart-status-container/index.d.ts.map +1 -1
  44. package/internal/components/chart-status-container/index.js +3 -1
  45. package/internal/components/chart-status-container/index.js.map +1 -1
  46. package/internal/components/dropdown-footer/index.d.ts.map +1 -1
  47. package/internal/components/dropdown-footer/index.js +2 -2
  48. package/internal/components/dropdown-footer/index.js.map +1 -1
  49. package/internal/components/live-region/controller.d.ts +35 -0
  50. package/internal/components/live-region/controller.d.ts.map +1 -0
  51. package/internal/components/live-region/controller.js +77 -0
  52. package/internal/components/live-region/controller.js.map +1 -0
  53. package/internal/components/live-region/index.d.ts +5 -64
  54. package/internal/components/live-region/index.d.ts.map +1 -1
  55. package/internal/components/live-region/index.js +11 -122
  56. package/internal/components/live-region/index.js.map +1 -1
  57. package/internal/components/live-region/interfaces.d.ts +34 -0
  58. package/internal/components/live-region/interfaces.d.ts.map +1 -0
  59. package/internal/components/live-region/interfaces.js +4 -0
  60. package/internal/components/live-region/interfaces.js.map +1 -0
  61. package/internal/components/live-region/internal.d.ts +31 -0
  62. package/internal/components/live-region/internal.d.ts.map +1 -0
  63. package/internal/components/live-region/internal.js +80 -0
  64. package/internal/components/live-region/internal.js.map +1 -0
  65. package/internal/components/live-region/styles.css.js +2 -2
  66. package/internal/components/live-region/styles.scoped.css +146 -4
  67. package/internal/components/live-region/styles.selectors.js +2 -2
  68. package/internal/environment.js +1 -1
  69. package/internal/environment.json +1 -1
  70. package/internal/manifest.json +1 -1
  71. package/package.json +1 -1
  72. package/pie-chart/pie-chart.js +2 -2
  73. package/pie-chart/pie-chart.js.map +1 -1
  74. package/progress-bar/index.js +2 -2
  75. package/progress-bar/index.js.map +1 -1
  76. package/s3-resource-selector/s3-in-context/index.d.ts.map +1 -1
  77. package/s3-resource-selector/s3-in-context/index.js +2 -3
  78. package/s3-resource-selector/s3-in-context/index.js.map +1 -1
  79. package/s3-resource-selector/s3-modal/basic-table.js +2 -2
  80. package/s3-resource-selector/s3-modal/basic-table.js.map +1 -1
  81. package/select/parts/filter.d.ts +1 -1
  82. package/table/body-cell/disabled-inline-editor.d.ts.map +1 -1
  83. package/table/body-cell/disabled-inline-editor.js +2 -1
  84. package/table/body-cell/disabled-inline-editor.js.map +1 -1
  85. package/table/body-cell/index.d.ts.map +1 -1
  86. package/table/body-cell/index.js +2 -2
  87. package/table/body-cell/index.js.map +1 -1
  88. package/table/body-cell/inline-editor.d.ts.map +1 -1
  89. package/table/body-cell/inline-editor.js +4 -4
  90. package/table/body-cell/inline-editor.js.map +1 -1
  91. package/table/internal.js +2 -2
  92. package/table/internal.js.map +1 -1
  93. package/table/no-data-cell.js +2 -2
  94. package/table/no-data-cell.js.map +1 -1
  95. package/table/progressive-loading/items-loader.js +3 -3
  96. package/table/progressive-loading/items-loader.js.map +1 -1
  97. package/tag-editor/index.js +2 -2
  98. package/tag-editor/index.js.map +1 -1
  99. package/test-utils/dom/internal/live-region.d.ts +4 -0
  100. package/test-utils/dom/internal/live-region.js +11 -0
  101. package/test-utils/dom/internal/live-region.js.map +1 -0
  102. package/test-utils/selectors/internal/live-region.d.ts +4 -0
  103. package/test-utils/selectors/internal/live-region.js +11 -0
  104. package/test-utils/selectors/internal/live-region.js.map +1 -0
  105. package/test-utils/tsconfig.tsbuildinfo +1 -1
  106. package/text-filter/search-results.js +2 -2
  107. package/text-filter/search-results.js.map +1 -1
  108. package/tutorial-panel/components/tutorial-list/index.js +2 -2
  109. package/tutorial-panel/components/tutorial-list/index.js.map +1 -1
@@ -1,13 +1,13 @@
1
1
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
2
  // SPDX-License-Identifier: Apache-2.0
3
3
  import React from 'react';
4
- import LiveRegion from '../internal/components/live-region';
4
+ import InternalLiveRegion from '../internal/components/live-region/internal';
5
5
  import styles from './styles.css.js';
6
6
  // Debounce delay for live region (based on testing with VoiceOver)
7
7
  const LIVE_REGION_DELAY = 2000;
8
8
  export function SearchResults({ id, children }) {
9
9
  return (React.createElement("span", { className: styles.results },
10
- React.createElement(LiveRegion, { delay: LIVE_REGION_DELAY, visible: true },
10
+ React.createElement(InternalLiveRegion, { delay: LIVE_REGION_DELAY, tagName: "span" },
11
11
  React.createElement("span", { id: id }, children))));
12
12
  }
13
13
  //# sourceMappingURL=search-results.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"search-results.js","sourceRoot":"","sources":["../../../src/text-filter/search-results.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,UAAU,MAAM,oCAAoC,CAAC;AAE5D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,mEAAmE;AACnE,MAAM,iBAAiB,GAAG,IAAI,CAAC;AAO/B,MAAM,UAAU,aAAa,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAsB;IAChE,OAAO,CACL,8BAAM,SAAS,EAAE,MAAM,CAAC,OAAO;QAC7B,oBAAC,UAAU,IAAC,KAAK,EAAE,iBAAiB,EAAE,OAAO,EAAE,IAAI;YACjD,8BAAM,EAAE,EAAE,EAAE,IAAG,QAAQ,CAAQ,CACpB,CACR,CACR,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';\n\nimport LiveRegion from '../internal/components/live-region';\n\nimport styles from './styles.css.js';\n\n// Debounce delay for live region (based on testing with VoiceOver)\nconst LIVE_REGION_DELAY = 2000;\n\ninterface SearchResultsProps {\n id: string;\n children: string;\n}\n\nexport function SearchResults({ id, children }: SearchResultsProps) {\n return (\n <span className={styles.results}>\n <LiveRegion delay={LIVE_REGION_DELAY} visible={true}>\n <span id={id}>{children}</span>\n </LiveRegion>\n </span>\n );\n}\n"]}
1
+ {"version":3,"file":"search-results.js","sourceRoot":"","sources":["../../../src/text-filter/search-results.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,kBAAkB,MAAM,6CAA6C,CAAC;AAE7E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,mEAAmE;AACnE,MAAM,iBAAiB,GAAG,IAAI,CAAC;AAO/B,MAAM,UAAU,aAAa,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAsB;IAChE,OAAO,CACL,8BAAM,SAAS,EAAE,MAAM,CAAC,OAAO;QAC7B,oBAAC,kBAAkB,IAAC,KAAK,EAAE,iBAAiB,EAAE,OAAO,EAAC,MAAM;YAC1D,8BAAM,EAAE,EAAE,EAAE,IAAG,QAAQ,CAAQ,CACZ,CAChB,CACR,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';\n\nimport InternalLiveRegion from '../internal/components/live-region/internal';\n\nimport styles from './styles.css.js';\n\n// Debounce delay for live region (based on testing with VoiceOver)\nconst LIVE_REGION_DELAY = 2000;\n\ninterface SearchResultsProps {\n id: string;\n children: string;\n}\n\nexport function SearchResults({ id, children }: SearchResultsProps) {\n return (\n <span className={styles.results}>\n <InternalLiveRegion delay={LIVE_REGION_DELAY} tagName=\"span\">\n <span id={id}>{children}</span>\n </InternalLiveRegion>\n </span>\n );\n}\n"]}
@@ -7,7 +7,7 @@ import InternalAlert from '../../../alert/internal';
7
7
  import InternalBox from '../../../box/internal';
8
8
  import { InternalButton } from '../../../button/internal';
9
9
  import InternalIcon from '../../../icon/internal';
10
- import LiveRegion from '../../../internal/components/live-region/index.js';
10
+ import InternalLiveRegion from '../../../internal/components/live-region/internal';
11
11
  import { fireNonCancelableEvent } from '../../../internal/events/index.js';
12
12
  import { useUniqueId } from '../../../internal/hooks/use-unique-id/index.js';
13
13
  import { useVisualRefresh } from '../../../internal/hooks/use-visual-mode';
@@ -29,7 +29,7 @@ export default function TutorialList({ i18nStrings, tutorials, loading = false,
29
29
  React.createElement(InternalIcon, { name: "download" }),
30
30
  React.createElement(InternalBox, { padding: { left: 'xs' }, color: "inherit", fontWeight: "bold", display: "inline" }, i18nStrings.tutorialListDownloadLinkText))),
31
31
  loading ? (React.createElement(InternalStatusIndicator, { type: "loading" },
32
- React.createElement(LiveRegion, { visible: true }, i18nStrings.loadingText))) : (React.createElement("ul", { className: styles['tutorial-list'], role: "list" }, tutorials.map((tutorial, index) => (React.createElement(Tutorial, { tutorial: tutorial, key: index, onStartTutorial: onStartTutorial, i18nStrings: i18nStrings })))))))));
32
+ React.createElement(InternalLiveRegion, { tagName: "span" }, i18nStrings.loadingText))) : (React.createElement("ul", { className: styles['tutorial-list'], role: "list" }, tutorials.map((tutorial, index) => (React.createElement(Tutorial, { tutorial: tutorial, key: index, onStartTutorial: onStartTutorial, i18nStrings: i18nStrings })))))))));
33
33
  }
34
34
  function Tutorial({ tutorial, onStartTutorial: onStartTutorialEventHandler, i18nStrings, }) {
35
35
  var _a;
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/tutorial-panel/components/tutorial-list/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, { useCallback, useState } from 'react';\nimport { CSSTransition } from 'react-transition-group';\nimport clsx from 'clsx';\n\nimport InternalAlert from '../../../alert/internal';\nimport { HotspotContext } from '../../../annotation-context/context.js';\nimport InternalBox from '../../../box/internal';\nimport { InternalButton } from '../../../button/internal';\nimport InternalIcon from '../../../icon/internal';\nimport LiveRegion from '../../../internal/components/live-region/index.js';\nimport { fireNonCancelableEvent } from '../../../internal/events/index.js';\nimport { useUniqueId } from '../../../internal/hooks/use-unique-id/index.js';\nimport { useVisualRefresh } from '../../../internal/hooks/use-visual-mode';\nimport { checkSafeUrl } from '../../../internal/utils/check-safe-url';\nimport InternalLink from '../../../link/internal';\nimport InternalSpaceBetween from '../../../space-between/internal';\nimport InternalStatusIndicator from '../../../status-indicator/internal';\nimport { TutorialPanelProps } from '../../interfaces';\n\nimport styles from './styles.css.js';\n\nexport interface TutorialListProps {\n loading?: boolean;\n tutorials: TutorialPanelProps['tutorials'];\n onStartTutorial: HotspotContext['onStartTutorial'];\n i18nStrings: TutorialPanelProps['i18nStrings'];\n downloadUrl: TutorialPanelProps['downloadUrl'];\n}\n\nexport default function TutorialList({\n i18nStrings,\n tutorials,\n loading = false,\n onStartTutorial,\n downloadUrl,\n}: TutorialListProps) {\n checkSafeUrl('TutorialPanel', downloadUrl);\n\n const isRefresh = useVisualRefresh();\n\n return (\n <>\n <InternalSpaceBetween size=\"s\">\n <InternalSpaceBetween size=\"m\">\n <InternalBox variant=\"h2\" fontSize={isRefresh ? 'heading-m' : 'heading-l'} padding={{ bottom: 'n' }}>\n {i18nStrings.tutorialListTitle}\n </InternalBox>\n <InternalBox variant=\"p\" color=\"text-body-secondary\" padding=\"n\">\n {i18nStrings.tutorialListDescription}\n </InternalBox>\n </InternalSpaceBetween>\n <InternalSpaceBetween size=\"l\">\n {downloadUrl && (\n <a\n href={downloadUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className={styles['download-link']}\n aria-label={i18nStrings.labelTutorialListDownloadLink}\n >\n <InternalIcon name=\"download\" />\n <InternalBox padding={{ left: 'xs' }} color=\"inherit\" fontWeight=\"bold\" display=\"inline\">\n {i18nStrings.tutorialListDownloadLinkText}\n </InternalBox>\n </a>\n )}\n {loading ? (\n <InternalStatusIndicator type=\"loading\">\n <LiveRegion visible={true}>{i18nStrings.loadingText}</LiveRegion>\n </InternalStatusIndicator>\n ) : (\n <ul className={styles['tutorial-list']} role=\"list\">\n {tutorials.map((tutorial, index) => (\n <Tutorial tutorial={tutorial} key={index} onStartTutorial={onStartTutorial} i18nStrings={i18nStrings} />\n ))}\n </ul>\n )}\n </InternalSpaceBetween>\n </InternalSpaceBetween>\n </>\n );\n}\n\nfunction Tutorial({\n tutorial,\n onStartTutorial: onStartTutorialEventHandler,\n i18nStrings,\n}: {\n tutorial: TutorialPanelProps.Tutorial;\n onStartTutorial: HotspotContext['onStartTutorial'];\n i18nStrings: TutorialPanelProps['i18nStrings'];\n}) {\n checkSafeUrl('TutorialPanel', tutorial.learnMoreUrl);\n const controlId = useUniqueId();\n const triggerControldId = useUniqueId();\n const headerId = useUniqueId();\n\n const isRefresh = useVisualRefresh();\n\n const onStartTutorial = useCallback(() => {\n fireNonCancelableEvent(onStartTutorialEventHandler, { tutorial });\n }, [onStartTutorialEventHandler, tutorial]);\n\n const [expanded, setExpanded] = useState(!tutorial.prerequisitesNeeded && !tutorial.completed);\n\n const onClick = useCallback(() => {\n setExpanded(expanded => !expanded);\n }, []);\n\n return (\n <li className={styles['tutorial-box']} role=\"listitem\">\n <InternalSpaceBetween size=\"xs\">\n <div className={styles['tutorial-box-title']}>\n <InternalBox\n variant=\"h3\"\n fontSize={isRefresh ? 'heading-s' : 'heading-m'}\n id={headerId}\n margin={{ right: 'xs' }}\n padding=\"n\"\n className={styles.title}\n >\n {tutorial.title}\n </InternalBox>\n <div className={styles['button-wrapper']}>\n <InternalButton\n id={triggerControldId}\n variant=\"icon\"\n ariaExpanded={expanded}\n __nativeAttributes={{\n 'aria-controls': controlId,\n 'aria-labelledby': headerId,\n }}\n formAction=\"none\"\n onClick={onClick}\n className={expanded ? styles['collapse-button'] : styles['expand-button']}\n iconName={expanded ? 'angle-up' : 'angle-down'}\n />\n </div>\n </div>\n\n {tutorial.completed ? (\n <InternalStatusIndicator __size=\"inherit\" type=\"success\" className={styles.completed} wrapText={true}>\n {i18nStrings.tutorialCompletedText}\n </InternalStatusIndicator>\n ) : null}\n </InternalSpaceBetween>\n\n <div aria-live=\"polite\">\n <CSSTransition in={expanded} timeout={30} classNames={{ enter: styles['content-enter'] }}>\n <div className={clsx(styles['expandable-section'], expanded && styles.expanded)} id={controlId}>\n <InternalSpaceBetween size=\"l\">\n <InternalSpaceBetween size=\"m\">\n {tutorial.prerequisitesNeeded && tutorial.prerequisitesAlert && (\n <InternalAlert type=\"info\" className={styles['prerequisites-alert']}>\n {tutorial.prerequisitesAlert}\n </InternalAlert>\n )}\n <InternalSpaceBetween size=\"s\">\n <InternalBox color=\"text-body-secondary\">\n <div\n className={clsx(\n styles['tutorial-description'],\n typeof tutorial.description === 'string' && styles['tutorial-description-plaintext']\n )}\n >\n {tutorial.description}\n </div>\n </InternalBox>\n {tutorial.learnMoreUrl && (\n <InternalLink\n href={tutorial.learnMoreUrl}\n className={styles['learn-more-link']}\n externalIconAriaLabel={i18nStrings.labelLearnMoreExternalIcon}\n ariaLabel={i18nStrings.labelLearnMoreLink}\n external={true}\n variant=\"primary\"\n >\n {i18nStrings.learnMoreLinkText}\n </InternalLink>\n )}\n </InternalSpaceBetween>\n </InternalSpaceBetween>\n\n <InternalBox margin={{ bottom: 'xxs' }}>\n <InternalButton\n onClick={onStartTutorial}\n disabled={tutorial.prerequisitesNeeded ?? false}\n formAction=\"none\"\n className={styles.start}\n >\n {tutorial.completed ? i18nStrings.restartTutorialButtonText : i18nStrings.startTutorialButtonText}\n </InternalButton>\n </InternalBox>\n </InternalSpaceBetween>\n </div>\n </CSSTransition>\n </div>\n </li>\n );\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/tutorial-panel/components/tutorial-list/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, { useCallback, useState } from 'react';\nimport { CSSTransition } from 'react-transition-group';\nimport clsx from 'clsx';\n\nimport InternalAlert from '../../../alert/internal';\nimport { HotspotContext } from '../../../annotation-context/context.js';\nimport InternalBox from '../../../box/internal';\nimport { InternalButton } from '../../../button/internal';\nimport InternalIcon from '../../../icon/internal';\nimport InternalLiveRegion from '../../../internal/components/live-region/internal';\nimport { fireNonCancelableEvent } from '../../../internal/events/index.js';\nimport { useUniqueId } from '../../../internal/hooks/use-unique-id/index.js';\nimport { useVisualRefresh } from '../../../internal/hooks/use-visual-mode';\nimport { checkSafeUrl } from '../../../internal/utils/check-safe-url';\nimport InternalLink from '../../../link/internal';\nimport InternalSpaceBetween from '../../../space-between/internal';\nimport InternalStatusIndicator from '../../../status-indicator/internal';\nimport { TutorialPanelProps } from '../../interfaces';\n\nimport styles from './styles.css.js';\n\nexport interface TutorialListProps {\n loading?: boolean;\n tutorials: TutorialPanelProps['tutorials'];\n onStartTutorial: HotspotContext['onStartTutorial'];\n i18nStrings: TutorialPanelProps['i18nStrings'];\n downloadUrl: TutorialPanelProps['downloadUrl'];\n}\n\nexport default function TutorialList({\n i18nStrings,\n tutorials,\n loading = false,\n onStartTutorial,\n downloadUrl,\n}: TutorialListProps) {\n checkSafeUrl('TutorialPanel', downloadUrl);\n\n const isRefresh = useVisualRefresh();\n\n return (\n <>\n <InternalSpaceBetween size=\"s\">\n <InternalSpaceBetween size=\"m\">\n <InternalBox variant=\"h2\" fontSize={isRefresh ? 'heading-m' : 'heading-l'} padding={{ bottom: 'n' }}>\n {i18nStrings.tutorialListTitle}\n </InternalBox>\n <InternalBox variant=\"p\" color=\"text-body-secondary\" padding=\"n\">\n {i18nStrings.tutorialListDescription}\n </InternalBox>\n </InternalSpaceBetween>\n <InternalSpaceBetween size=\"l\">\n {downloadUrl && (\n <a\n href={downloadUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className={styles['download-link']}\n aria-label={i18nStrings.labelTutorialListDownloadLink}\n >\n <InternalIcon name=\"download\" />\n <InternalBox padding={{ left: 'xs' }} color=\"inherit\" fontWeight=\"bold\" display=\"inline\">\n {i18nStrings.tutorialListDownloadLinkText}\n </InternalBox>\n </a>\n )}\n {loading ? (\n <InternalStatusIndicator type=\"loading\">\n <InternalLiveRegion tagName=\"span\">{i18nStrings.loadingText}</InternalLiveRegion>\n </InternalStatusIndicator>\n ) : (\n <ul className={styles['tutorial-list']} role=\"list\">\n {tutorials.map((tutorial, index) => (\n <Tutorial tutorial={tutorial} key={index} onStartTutorial={onStartTutorial} i18nStrings={i18nStrings} />\n ))}\n </ul>\n )}\n </InternalSpaceBetween>\n </InternalSpaceBetween>\n </>\n );\n}\n\nfunction Tutorial({\n tutorial,\n onStartTutorial: onStartTutorialEventHandler,\n i18nStrings,\n}: {\n tutorial: TutorialPanelProps.Tutorial;\n onStartTutorial: HotspotContext['onStartTutorial'];\n i18nStrings: TutorialPanelProps['i18nStrings'];\n}) {\n checkSafeUrl('TutorialPanel', tutorial.learnMoreUrl);\n const controlId = useUniqueId();\n const triggerControldId = useUniqueId();\n const headerId = useUniqueId();\n\n const isRefresh = useVisualRefresh();\n\n const onStartTutorial = useCallback(() => {\n fireNonCancelableEvent(onStartTutorialEventHandler, { tutorial });\n }, [onStartTutorialEventHandler, tutorial]);\n\n const [expanded, setExpanded] = useState(!tutorial.prerequisitesNeeded && !tutorial.completed);\n\n const onClick = useCallback(() => {\n setExpanded(expanded => !expanded);\n }, []);\n\n return (\n <li className={styles['tutorial-box']} role=\"listitem\">\n <InternalSpaceBetween size=\"xs\">\n <div className={styles['tutorial-box-title']}>\n <InternalBox\n variant=\"h3\"\n fontSize={isRefresh ? 'heading-s' : 'heading-m'}\n id={headerId}\n margin={{ right: 'xs' }}\n padding=\"n\"\n className={styles.title}\n >\n {tutorial.title}\n </InternalBox>\n <div className={styles['button-wrapper']}>\n <InternalButton\n id={triggerControldId}\n variant=\"icon\"\n ariaExpanded={expanded}\n __nativeAttributes={{\n 'aria-controls': controlId,\n 'aria-labelledby': headerId,\n }}\n formAction=\"none\"\n onClick={onClick}\n className={expanded ? styles['collapse-button'] : styles['expand-button']}\n iconName={expanded ? 'angle-up' : 'angle-down'}\n />\n </div>\n </div>\n\n {tutorial.completed ? (\n <InternalStatusIndicator __size=\"inherit\" type=\"success\" className={styles.completed} wrapText={true}>\n {i18nStrings.tutorialCompletedText}\n </InternalStatusIndicator>\n ) : null}\n </InternalSpaceBetween>\n\n <div aria-live=\"polite\">\n <CSSTransition in={expanded} timeout={30} classNames={{ enter: styles['content-enter'] }}>\n <div className={clsx(styles['expandable-section'], expanded && styles.expanded)} id={controlId}>\n <InternalSpaceBetween size=\"l\">\n <InternalSpaceBetween size=\"m\">\n {tutorial.prerequisitesNeeded && tutorial.prerequisitesAlert && (\n <InternalAlert type=\"info\" className={styles['prerequisites-alert']}>\n {tutorial.prerequisitesAlert}\n </InternalAlert>\n )}\n <InternalSpaceBetween size=\"s\">\n <InternalBox color=\"text-body-secondary\">\n <div\n className={clsx(\n styles['tutorial-description'],\n typeof tutorial.description === 'string' && styles['tutorial-description-plaintext']\n )}\n >\n {tutorial.description}\n </div>\n </InternalBox>\n {tutorial.learnMoreUrl && (\n <InternalLink\n href={tutorial.learnMoreUrl}\n className={styles['learn-more-link']}\n externalIconAriaLabel={i18nStrings.labelLearnMoreExternalIcon}\n ariaLabel={i18nStrings.labelLearnMoreLink}\n external={true}\n variant=\"primary\"\n >\n {i18nStrings.learnMoreLinkText}\n </InternalLink>\n )}\n </InternalSpaceBetween>\n </InternalSpaceBetween>\n\n <InternalBox margin={{ bottom: 'xxs' }}>\n <InternalButton\n onClick={onStartTutorial}\n disabled={tutorial.prerequisitesNeeded ?? false}\n formAction=\"none\"\n className={styles.start}\n >\n {tutorial.completed ? i18nStrings.restartTutorialButtonText : i18nStrings.startTutorialButtonText}\n </InternalButton>\n </InternalBox>\n </InternalSpaceBetween>\n </div>\n </CSSTransition>\n </div>\n </li>\n );\n}\n"]}