@cloudscape-design/components-themeable 3.0.3 → 3.0.6

package/lib/internal/template/tutorial-panel/components/tutorial-list/index.js

@@ -77,7 +77,7 @@ function Tutorial(_a) {
                 React.createElement("div", { className: clsx(styles['expandable-section'], expanded && styles.expanded), id: controlId },
                     React.createElement(InternalSpaceBetween, { size: "l" },
                         React.createElement(InternalSpaceBetween, { size: "m" },
-                            tutorial.prerequisitesNeeded && tutorial.prerequisitesAlert && (React.createElement(InternalAlert, { type: "info", className: styles['prerequisites-alert'], visible: true }, tutorial.prerequisitesAlert)),
+                            tutorial.prerequisitesNeeded && tutorial.prerequisitesAlert && (React.createElement(InternalAlert, { type: "info", className: styles['prerequisites-alert'] }, tutorial.prerequisitesAlert)),
                             React.createElement(InternalSpaceBetween, { size: "s" },
                                 React.createElement(InternalBox, { color: "text-body-secondary" },
                                     React.createElement("div", { className: clsx(styles['tutorial-description'], typeof tutorial.description === 'string' && styles['tutorial-description-plaintext']) }, tutorial.description)),

package/lib/internal/template/tutorial-panel/components/tutorial-list/index.js.map

@@ -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, useRef } from 'react';\nimport styles from './styles.css.js';\nimport { TutorialPanelProps } from '../../interfaces';\nimport InternalBox from '../../../box/internal';\nimport { InternalButton } from '../../../button/internal';\nimport InternalStatusIndicator from '../../../status-indicator/internal';\nimport InternalSpaceBetween from '../../../space-between/internal';\nimport { fireNonCancelableEvent } from '../../../internal/events/index.js';\nimport clsx from 'clsx';\nimport InternalAlert from '../../../alert/internal';\nimport InternalLink from '../../../link/internal';\nimport { useUniqueId } from '../../../internal/hooks/use-unique-id/index.js';\nimport { CSSTransition } from 'react-transition-group';\nimport { HotspotContext } from '../../../annotation-context/context.js';\nimport InternalIcon from '../../../icon/internal';\nimport useFocusVisible from '../../../internal/hooks/focus-visible/index.js';\nimport { useVisualRefresh } from '../../../internal/hooks/use-visual-mode';\nimport { checkSafeUrl } from '../../../internal/utils/check-safe-url';\n\nexport interface TutorialListProps {\n  loading?: boolean;\n  tutorials: TutorialPanelProps['tutorials'];\n  onStartTutorial: HotspotContext['onStartTutorial'];\n  filteringFunction: (tutorial: TutorialPanelProps.Tutorial, searchTerm: string) => boolean;\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  /*\n  // Filtering is not available in the Beta release.\n\n  const [searchTerm, setSearchTerm] = useState('');\n\n  const onSearchChangeCallback: InputProps['onChange'] = useCallback(event => setSearchTerm(event.detail.value), [\n    setSearchTerm\n  ]);\n\n  const filteredTutorials = tutorials.filter(tutorial => filteringFunction(tutorial, searchTerm))\n  */\n\n  const focusVisible = useFocusVisible();\n  const tutorialListRef = useRef(null);\n  const isRefresh = useVisualRefresh(tutorialListRef);\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          <a\n            {...focusVisible}\n            href={downloadUrl}\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            className={styles['download-link']}\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          {/*\n          <FormField label=\"Filter tutorials\">\n            <Input type=\"search\" value={searchTerm} placeholder=\"Filter tutorials\" onChange={onSearchChangeCallback} />\n          </FormField>\n        */}\n          {loading ? (\n            <InternalStatusIndicator type=\"loading\">{i18nStrings.loadingText}</InternalStatusIndicator>\n          ) : (\n            <>\n              <ul className={styles['tutorial-list']} role=\"list\" ref={tutorialListRef}>\n                {tutorials.map((tutorial, index) => (\n                  <Tutorial\n                    tutorial={tutorial}\n                    key={index}\n                    onStartTutorial={onStartTutorial}\n                    i18nStrings={i18nStrings}\n                  />\n                ))}\n              </ul>\n              {/* {filteredTutorials.length === 0 && searchTerm && <Box>No tutorials match this search filter.</Box>} */}\n            </>\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 tutorialRef = useRef(null);\n  const isRefresh = useVisualRefresh(tutorialRef);\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\" ref={tutorialRef}>\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']} visible={true}>\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                      external={true}\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"]}
+{"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, useRef } from 'react';\nimport styles from './styles.css.js';\nimport { TutorialPanelProps } from '../../interfaces';\nimport InternalBox from '../../../box/internal';\nimport { InternalButton } from '../../../button/internal';\nimport InternalStatusIndicator from '../../../status-indicator/internal';\nimport InternalSpaceBetween from '../../../space-between/internal';\nimport { fireNonCancelableEvent } from '../../../internal/events/index.js';\nimport clsx from 'clsx';\nimport InternalAlert from '../../../alert/internal';\nimport InternalLink from '../../../link/internal';\nimport { useUniqueId } from '../../../internal/hooks/use-unique-id/index.js';\nimport { CSSTransition } from 'react-transition-group';\nimport { HotspotContext } from '../../../annotation-context/context.js';\nimport InternalIcon from '../../../icon/internal';\nimport useFocusVisible from '../../../internal/hooks/focus-visible/index.js';\nimport { useVisualRefresh } from '../../../internal/hooks/use-visual-mode';\nimport { checkSafeUrl } from '../../../internal/utils/check-safe-url';\n\nexport interface TutorialListProps {\n  loading?: boolean;\n  tutorials: TutorialPanelProps['tutorials'];\n  onStartTutorial: HotspotContext['onStartTutorial'];\n  filteringFunction: (tutorial: TutorialPanelProps.Tutorial, searchTerm: string) => boolean;\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  /*\n  // Filtering is not available in the Beta release.\n\n  const [searchTerm, setSearchTerm] = useState('');\n\n  const onSearchChangeCallback: InputProps['onChange'] = useCallback(event => setSearchTerm(event.detail.value), [\n    setSearchTerm\n  ]);\n\n  const filteredTutorials = tutorials.filter(tutorial => filteringFunction(tutorial, searchTerm))\n  */\n\n  const focusVisible = useFocusVisible();\n  const tutorialListRef = useRef(null);\n  const isRefresh = useVisualRefresh(tutorialListRef);\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          <a\n            {...focusVisible}\n            href={downloadUrl}\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            className={styles['download-link']}\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          {/*\n          <FormField label=\"Filter tutorials\">\n            <Input type=\"search\" value={searchTerm} placeholder=\"Filter tutorials\" onChange={onSearchChangeCallback} />\n          </FormField>\n        */}\n          {loading ? (\n            <InternalStatusIndicator type=\"loading\">{i18nStrings.loadingText}</InternalStatusIndicator>\n          ) : (\n            <>\n              <ul className={styles['tutorial-list']} role=\"list\" ref={tutorialListRef}>\n                {tutorials.map((tutorial, index) => (\n                  <Tutorial\n                    tutorial={tutorial}\n                    key={index}\n                    onStartTutorial={onStartTutorial}\n                    i18nStrings={i18nStrings}\n                  />\n                ))}\n              </ul>\n              {/* {filteredTutorials.length === 0 && searchTerm && <Box>No tutorials match this search filter.</Box>} */}\n            </>\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 tutorialRef = useRef(null);\n  const isRefresh = useVisualRefresh(tutorialRef);\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\" ref={tutorialRef}>\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                      external={true}\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"]}

package/lib/internal/template/tutorial-panel/components/tutorial-list/styles.css.js

@@ -1,23 +1,23 @@
 
     import './styles.scoped.css';
     export default {
-  "content-enter": "awsui_content-enter_ig8mp_1dvzq_93",
-  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_ig8mp_1dvzq_1",
-  "tutorial-list": "awsui_tutorial-list_ig8mp_1dvzq_119",
-  "tutorial-box": "awsui_tutorial-box_ig8mp_1dvzq_132",
-  "tutorial-box-title": "awsui_tutorial-box-title_ig8mp_1dvzq_150",
-  "tutorial-description-plaintext": "awsui_tutorial-description-plaintext_ig8mp_1dvzq_156",
-  "tutorial-description": "awsui_tutorial-description_ig8mp_1dvzq_156",
-  "expandable-section": "awsui_expandable-section_ig8mp_1dvzq_168",
-  "expanded": "awsui_expanded_ig8mp_1dvzq_172",
-  "button-wrapper": "awsui_button-wrapper_ig8mp_1dvzq_176",
-  "start": "awsui_start_ig8mp_1dvzq_180",
-  "expand-button": "awsui_expand-button_ig8mp_1dvzq_184",
-  "collapse-button": "awsui_collapse-button_ig8mp_1dvzq_188",
-  "learn-more-link": "awsui_learn-more-link_ig8mp_1dvzq_192",
-  "title": "awsui_title_ig8mp_1dvzq_196",
-  "prerequisites-alert": "awsui_prerequisites-alert_ig8mp_1dvzq_200",
-  "completed": "awsui_completed_ig8mp_1dvzq_204",
-  "download-link": "awsui_download-link_ig8mp_1dvzq_208"
+  "content-enter": "awsui_content-enter_ig8mp_1sk9e_93",
+  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_ig8mp_1sk9e_1",
+  "tutorial-list": "awsui_tutorial-list_ig8mp_1sk9e_119",
+  "tutorial-box": "awsui_tutorial-box_ig8mp_1sk9e_132",
+  "tutorial-box-title": "awsui_tutorial-box-title_ig8mp_1sk9e_150",
+  "tutorial-description-plaintext": "awsui_tutorial-description-plaintext_ig8mp_1sk9e_156",
+  "tutorial-description": "awsui_tutorial-description_ig8mp_1sk9e_156",
+  "expandable-section": "awsui_expandable-section_ig8mp_1sk9e_168",
+  "expanded": "awsui_expanded_ig8mp_1sk9e_172",
+  "button-wrapper": "awsui_button-wrapper_ig8mp_1sk9e_176",
+  "start": "awsui_start_ig8mp_1sk9e_180",
+  "expand-button": "awsui_expand-button_ig8mp_1sk9e_184",
+  "collapse-button": "awsui_collapse-button_ig8mp_1sk9e_188",
+  "learn-more-link": "awsui_learn-more-link_ig8mp_1sk9e_192",
+  "title": "awsui_title_ig8mp_1sk9e_196",
+  "prerequisites-alert": "awsui_prerequisites-alert_ig8mp_1sk9e_200",
+  "completed": "awsui_completed_ig8mp_1sk9e_204",
+  "download-link": "awsui_download-link_ig8mp_1sk9e_208"
 };
   

package/lib/internal/template/tutorial-panel/components/tutorial-list/styles.scoped.css

@@ -90,11 +90,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_content-enter_ig8mp_1dvzq_93:not(#\9) {
-  animation: awsui_awsui-motion-fade-in_ig8mp_1dvzq_1 180ms ease-out;
-  animation: awsui_awsui-motion-fade-in_ig8mp_1dvzq_1 var(--motion-duration-show-paced-7wspqf, 180ms) var(--motion-easing-show-paced-wj4ybn, ease-out);
+.awsui_content-enter_ig8mp_1sk9e_93:not(#\9) {
+  animation: awsui_awsui-motion-fade-in_ig8mp_1sk9e_1 180ms ease-out;
+  animation: awsui_awsui-motion-fade-in_ig8mp_1sk9e_1 var(--motion-duration-show-paced-7wspqf, 180ms) var(--motion-easing-show-paced-wj4ybn, ease-out);
 }
-@keyframes awsui_awsui-motion-fade-in_ig8mp_1dvzq_1 {
+@keyframes awsui_awsui-motion-fade-in_ig8mp_1sk9e_1 {
   from {
     opacity: 0.2;
   }
@@ -103,12 +103,12 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_content-enter_ig8mp_1dvzq_93:not(#\9) {
+  .awsui_content-enter_ig8mp_1sk9e_93:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_content-enter_ig8mp_1dvzq_93:not(#\9), .awsui-mode-entering .awsui_content-enter_ig8mp_1dvzq_93:not(#\9) {
+.awsui-motion-disabled .awsui_content-enter_ig8mp_1sk9e_93:not(#\9), .awsui-mode-entering .awsui_content-enter_ig8mp_1sk9e_93:not(#\9) {
   animation: none;
   transition: none;
 }
@@ -117,7 +117,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_tutorial-list_ig8mp_1dvzq_119:not(#\9) {
+.awsui_tutorial-list_ig8mp_1sk9e_119:not(#\9) {
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   border-collapse: separate;
   border-spacing: 0;
@@ -161,7 +161,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin: 0;
 }
 
-.awsui_tutorial-box_ig8mp_1dvzq_132:not(#\9) {
+.awsui_tutorial-box_ig8mp_1sk9e_132:not(#\9) {
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   border-collapse: separate;
   border-spacing: 0;
@@ -209,72 +209,72 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   padding: 16px;
   padding: var(--space-m-17eucw, 16px);
 }
-.awsui_tutorial-box_ig8mp_1dvzq_132:not(#\9):not(:first-child) {
+.awsui_tutorial-box_ig8mp_1sk9e_132:not(#\9):not(:first-child) {
   margin-top: 20px;
   margin-top: var(--space-l-4vl6xu, 20px);
 }
 
-.awsui_tutorial-box-title_ig8mp_1dvzq_150:not(#\9) {
+.awsui_tutorial-box-title_ig8mp_1sk9e_150:not(#\9) {
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
 }
 
-.awsui_tutorial-description-plaintext_ig8mp_1dvzq_156:not(#\9) {
+.awsui_tutorial-description-plaintext_ig8mp_1sk9e_156:not(#\9) {
   white-space: pre-line;
 }
 
-.awsui_tutorial-description_ig8mp_1dvzq_156:not(#\9) {
+.awsui_tutorial-description_ig8mp_1sk9e_156:not(#\9) {
   /* stylelint-disable-next-line @cloudscape-design/no-implicit-descendant, selector-max-type -- Customers can nest their list items inside Box components. */
 }
-.awsui_tutorial-description_ig8mp_1dvzq_156 ul:not(#\9) {
+.awsui_tutorial-description_ig8mp_1sk9e_156 ul:not(#\9) {
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   list-style-type: disc;
 }
 
-.awsui_expandable-section_ig8mp_1dvzq_168:not(#\9) {
+.awsui_expandable-section_ig8mp_1sk9e_168:not(#\9) {
   display: none;
   margin-top: 16px;
   margin-top: var(--space-m-17eucw, 16px);
 }
-.awsui_expandable-section_ig8mp_1dvzq_168.awsui_expanded_ig8mp_1dvzq_172:not(#\9) {
+.awsui_expandable-section_ig8mp_1sk9e_168.awsui_expanded_ig8mp_1sk9e_172:not(#\9) {
   display: block;
 }
 
-.awsui_button-wrapper_ig8mp_1dvzq_176:not(#\9) {
+.awsui_button-wrapper_ig8mp_1sk9e_176:not(#\9) {
   margin: calc(-1 * 4px - 1px);
   margin: calc(-1 * var(--space-xxs-ynfts5, 4px) - var(--border-field-width-y6x4sn, 1px));
 }
 
-.awsui_start_ig8mp_1dvzq_180:not(#\9) {
+.awsui_start_ig8mp_1sk9e_180:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_expand-button_ig8mp_1dvzq_184:not(#\9) {
+.awsui_expand-button_ig8mp_1sk9e_184:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_collapse-button_ig8mp_1dvzq_188:not(#\9) {
+.awsui_collapse-button_ig8mp_1sk9e_188:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_learn-more-link_ig8mp_1dvzq_192:not(#\9) {
+.awsui_learn-more-link_ig8mp_1sk9e_192:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_title_ig8mp_1dvzq_196:not(#\9) {
+.awsui_title_ig8mp_1sk9e_196:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_prerequisites-alert_ig8mp_1dvzq_200:not(#\9) {
+.awsui_prerequisites-alert_ig8mp_1sk9e_200:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_completed_ig8mp_1dvzq_204:not(#\9) {
+.awsui_completed_ig8mp_1sk9e_204:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_download-link_ig8mp_1dvzq_208:not(#\9) {
+.awsui_download-link_ig8mp_1sk9e_208:not(#\9) {
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   border-collapse: separate;
   border-spacing: 0;
@@ -321,26 +321,26 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   color: #545b64;
   color: var(--color-text-body-secondary-u912t7, #545b64);
 }
-.awsui_download-link_ig8mp_1dvzq_208:not(#\9):hover {
+.awsui_download-link_ig8mp_1sk9e_208:not(#\9):hover {
   cursor: pointer;
 }
-.awsui_download-link_ig8mp_1dvzq_208:not(#\9):focus {
+.awsui_download-link_ig8mp_1sk9e_208:not(#\9):focus {
   outline: none;
 }
-.awsui_download-link_ig8mp_1dvzq_208:not(#\9):active, .awsui_download-link_ig8mp_1dvzq_208:not(#\9):focus, .awsui_download-link_ig8mp_1dvzq_208:not(#\9):hover {
+.awsui_download-link_ig8mp_1sk9e_208:not(#\9):active, .awsui_download-link_ig8mp_1sk9e_208:not(#\9):focus, .awsui_download-link_ig8mp_1sk9e_208:not(#\9):hover {
   text-decoration: underline;
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   text-decoration-color: currentColor;
 }
-.awsui_download-link_ig8mp_1dvzq_208[data-awsui-focus-visible=true]:not(#\9):focus {
+.awsui_download-link_ig8mp_1sk9e_208[data-awsui-focus-visible=true]:not(#\9):focus {
   outline: thin dotted;
   outline: 5px auto Highlight;
   outline: var(--border-link-focus-ring-outline-67z0xv, 5px auto Highlight);
   outline-offset: 2px;
-  outline-color: #00a1c9;
-  outline-color: var(--color-border-item-focused-bs10w5, #00a1c9);
+  outline-color: #0073bb;
+  outline-color: var(--color-border-item-focused-n5kd8g, #0073bb);
   border-radius: 2px;
   border-radius: var(--border-control-focus-ring-radius-default-9royjh, 2px);
-  box-shadow: 0 0 0 0px #00a1c9;
-  box-shadow: 0 0 0 var(--border-link-focus-ring-shadow-spread-e3dct9, 0px) var(--color-border-item-focused-bs10w5, #00a1c9);
+  box-shadow: 0 0 0 0px #0073bb;
+  box-shadow: 0 0 0 var(--border-link-focus-ring-shadow-spread-e3dct9, 0px) var(--color-border-item-focused-n5kd8g, #0073bb);
 }

package/lib/internal/template/tutorial-panel/components/tutorial-list/styles.selectors.js

@@ -2,23 +2,23 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "content-enter": "awsui_content-enter_ig8mp_1dvzq_93",
-  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_ig8mp_1dvzq_1",
-  "tutorial-list": "awsui_tutorial-list_ig8mp_1dvzq_119",
-  "tutorial-box": "awsui_tutorial-box_ig8mp_1dvzq_132",
-  "tutorial-box-title": "awsui_tutorial-box-title_ig8mp_1dvzq_150",
-  "tutorial-description-plaintext": "awsui_tutorial-description-plaintext_ig8mp_1dvzq_156",
-  "tutorial-description": "awsui_tutorial-description_ig8mp_1dvzq_156",
-  "expandable-section": "awsui_expandable-section_ig8mp_1dvzq_168",
-  "expanded": "awsui_expanded_ig8mp_1dvzq_172",
-  "button-wrapper": "awsui_button-wrapper_ig8mp_1dvzq_176",
-  "start": "awsui_start_ig8mp_1dvzq_180",
-  "expand-button": "awsui_expand-button_ig8mp_1dvzq_184",
-  "collapse-button": "awsui_collapse-button_ig8mp_1dvzq_188",
-  "learn-more-link": "awsui_learn-more-link_ig8mp_1dvzq_192",
-  "title": "awsui_title_ig8mp_1dvzq_196",
-  "prerequisites-alert": "awsui_prerequisites-alert_ig8mp_1dvzq_200",
-  "completed": "awsui_completed_ig8mp_1dvzq_204",
-  "download-link": "awsui_download-link_ig8mp_1dvzq_208"
+  "content-enter": "awsui_content-enter_ig8mp_1sk9e_93",
+  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_ig8mp_1sk9e_1",
+  "tutorial-list": "awsui_tutorial-list_ig8mp_1sk9e_119",
+  "tutorial-box": "awsui_tutorial-box_ig8mp_1sk9e_132",
+  "tutorial-box-title": "awsui_tutorial-box-title_ig8mp_1sk9e_150",
+  "tutorial-description-plaintext": "awsui_tutorial-description-plaintext_ig8mp_1sk9e_156",
+  "tutorial-description": "awsui_tutorial-description_ig8mp_1sk9e_156",
+  "expandable-section": "awsui_expandable-section_ig8mp_1sk9e_168",
+  "expanded": "awsui_expanded_ig8mp_1sk9e_172",
+  "button-wrapper": "awsui_button-wrapper_ig8mp_1sk9e_176",
+  "start": "awsui_start_ig8mp_1sk9e_180",
+  "expand-button": "awsui_expand-button_ig8mp_1sk9e_184",
+  "collapse-button": "awsui_collapse-button_ig8mp_1sk9e_188",
+  "learn-more-link": "awsui_learn-more-link_ig8mp_1sk9e_192",
+  "title": "awsui_title_ig8mp_1sk9e_196",
+  "prerequisites-alert": "awsui_prerequisites-alert_ig8mp_1sk9e_200",
+  "completed": "awsui_completed_ig8mp_1sk9e_204",
+  "download-link": "awsui_download-link_ig8mp_1sk9e_208"
 };
   

package/lib/internal/template/wizard/styles.css.js

@@ -1,36 +1,36 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_1xupv_1rsa9_94",
-  "wizard": "awsui_wizard_1xupv_1rsa9_105",
-  "refresh": "awsui_refresh_1xupv_1rsa9_105",
-  "small-container": "awsui_small-container_1xupv_1rsa9_112",
-  "navigation": "awsui_navigation_1xupv_1rsa9_120",
-  "number": "awsui_number_1xupv_1rsa9_148",
-  "circle": "awsui_circle_1xupv_1rsa9_164",
-  "title": "awsui_title_1xupv_1rsa9_172",
-  "active": "awsui_active_1xupv_1rsa9_201",
-  "disabled": "awsui_disabled_1xupv_1rsa9_212",
-  "enabled": "awsui_enabled_1xupv_1rsa9_222",
-  "form": "awsui_form_1xupv_1rsa9_261",
-  "form-header": "awsui_form-header_1xupv_1rsa9_267",
-  "background": "awsui_background_1xupv_1rsa9_278",
-  "form-header-content": "awsui_form-header-content_1xupv_1rsa9_288",
-  "form-component": "awsui_form-component_1xupv_1rsa9_292",
-  "hidden": "awsui_hidden_1xupv_1rsa9_306",
-  "collapsed-steps": "awsui_collapsed-steps_1xupv_1rsa9_310",
-  "collapsed-steps-extra-padding": "awsui_collapsed-steps-extra-padding_1xupv_1rsa9_315",
-  "collapsed-steps-hidden": "awsui_collapsed-steps-hidden_1xupv_1rsa9_318",
-  "form-header-component": "awsui_form-header-component_1xupv_1rsa9_322",
-  "navigation-link": "awsui_navigation-link_1xupv_1rsa9_323",
-  "navigation-link-item": "awsui_navigation-link-item_1xupv_1rsa9_324",
-  "navigation-link-label": "awsui_navigation-link-label_1xupv_1rsa9_325",
-  "navigation-link-active": "awsui_navigation-link-active_1xupv_1rsa9_329",
-  "navigation-link-disabled": "awsui_navigation-link-disabled_1xupv_1rsa9_334",
-  "cancel-button": "awsui_cancel-button_1xupv_1rsa9_338",
-  "previous-button": "awsui_previous-button_1xupv_1rsa9_339",
-  "primary-button": "awsui_primary-button_1xupv_1rsa9_340",
-  "skip-to-button": "awsui_skip-to-button_1xupv_1rsa9_341",
-  "action-buttons": "awsui_action-buttons_1xupv_1rsa9_345"
+  "root": "awsui_root_1xupv_ly7ly_94",
+  "wizard": "awsui_wizard_1xupv_ly7ly_105",
+  "refresh": "awsui_refresh_1xupv_ly7ly_105",
+  "small-container": "awsui_small-container_1xupv_ly7ly_112",
+  "navigation": "awsui_navigation_1xupv_ly7ly_120",
+  "number": "awsui_number_1xupv_ly7ly_148",
+  "circle": "awsui_circle_1xupv_ly7ly_164",
+  "title": "awsui_title_1xupv_ly7ly_172",
+  "active": "awsui_active_1xupv_ly7ly_201",
+  "disabled": "awsui_disabled_1xupv_ly7ly_212",
+  "enabled": "awsui_enabled_1xupv_ly7ly_222",
+  "form": "awsui_form_1xupv_ly7ly_261",
+  "form-header": "awsui_form-header_1xupv_ly7ly_267",
+  "background": "awsui_background_1xupv_ly7ly_278",
+  "form-header-content": "awsui_form-header-content_1xupv_ly7ly_288",
+  "form-component": "awsui_form-component_1xupv_ly7ly_292",
+  "hidden": "awsui_hidden_1xupv_ly7ly_306",
+  "collapsed-steps": "awsui_collapsed-steps_1xupv_ly7ly_310",
+  "collapsed-steps-extra-padding": "awsui_collapsed-steps-extra-padding_1xupv_ly7ly_315",
+  "collapsed-steps-hidden": "awsui_collapsed-steps-hidden_1xupv_ly7ly_318",
+  "form-header-component": "awsui_form-header-component_1xupv_ly7ly_322",
+  "navigation-link": "awsui_navigation-link_1xupv_ly7ly_323",
+  "navigation-link-item": "awsui_navigation-link-item_1xupv_ly7ly_324",
+  "navigation-link-label": "awsui_navigation-link-label_1xupv_ly7ly_325",
+  "navigation-link-active": "awsui_navigation-link-active_1xupv_ly7ly_329",
+  "navigation-link-disabled": "awsui_navigation-link-disabled_1xupv_ly7ly_334",
+  "cancel-button": "awsui_cancel-button_1xupv_ly7ly_338",
+  "previous-button": "awsui_previous-button_1xupv_ly7ly_339",
+  "primary-button": "awsui_primary-button_1xupv_ly7ly_340",
+  "skip-to-button": "awsui_skip-to-button_1xupv_ly7ly_341",
+  "action-buttons": "awsui_action-buttons_1xupv_ly7ly_345"
 };