@cloudscape-design/components 3.0.244 → 3.0.246

package/button/styles.selectors.js

@@ -2,23 +2,24 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "content": "awsui_content_vjswe_qgmad_97",
-  "button": "awsui_button_vjswe_qgmad_101",
-  "variant-normal": "awsui_variant-normal_vjswe_qgmad_126",
-  "is-activated": "awsui_is-activated_vjswe_qgmad_139",
-  "variant-icon": "awsui_variant-icon_vjswe_qgmad_166",
-  "variant-modal-dismiss": "awsui_variant-modal-dismiss_vjswe_qgmad_166",
-  "variant-flashbar-icon": "awsui_variant-flashbar-icon_vjswe_qgmad_166",
-  "variant-inline-icon": "awsui_variant-inline-icon_vjswe_qgmad_184",
-  "disabled": "awsui_disabled_vjswe_qgmad_202",
-  "variant-primary": "awsui_variant-primary_vjswe_qgmad_210",
-  "variant-link": "awsui_variant-link_vjswe_qgmad_294",
-  "variant-breadcrumb-group": "awsui_variant-breadcrumb-group_vjswe_qgmad_714",
-  "variant-menu-trigger": "awsui_variant-menu-trigger_vjswe_qgmad_801",
-  "button-no-text": "awsui_button-no-text_vjswe_qgmad_885",
-  "button-no-wrap": "awsui_button-no-wrap_vjswe_qgmad_889",
-  "icon-left": "awsui_icon-left_vjswe_qgmad_905",
-  "icon-right": "awsui_icon-right_vjswe_qgmad_910",
-  "icon": "awsui_icon_vjswe_qgmad_905"
+  "content": "awsui_content_vjswe_1himx_97",
+  "button": "awsui_button_vjswe_1himx_101",
+  "variant-normal": "awsui_variant-normal_vjswe_1himx_126",
+  "is-activated": "awsui_is-activated_vjswe_1himx_139",
+  "hide-focus-outline": "awsui_hide-focus-outline_vjswe_1himx_148",
+  "variant-icon": "awsui_variant-icon_vjswe_1himx_166",
+  "variant-modal-dismiss": "awsui_variant-modal-dismiss_vjswe_1himx_166",
+  "variant-flashbar-icon": "awsui_variant-flashbar-icon_vjswe_1himx_166",
+  "variant-inline-icon": "awsui_variant-inline-icon_vjswe_1himx_184",
+  "disabled": "awsui_disabled_vjswe_1himx_202",
+  "variant-primary": "awsui_variant-primary_vjswe_1himx_210",
+  "variant-link": "awsui_variant-link_vjswe_1himx_294",
+  "variant-breadcrumb-group": "awsui_variant-breadcrumb-group_vjswe_1himx_714",
+  "variant-menu-trigger": "awsui_variant-menu-trigger_vjswe_1himx_801",
+  "button-no-text": "awsui_button-no-text_vjswe_1himx_885",
+  "button-no-wrap": "awsui_button-no-wrap_vjswe_1himx_889",
+  "icon-left": "awsui_icon-left_vjswe_1himx_905",
+  "icon-right": "awsui_icon-right_vjswe_1himx_910",
+  "icon": "awsui_icon_vjswe_1himx_905"
 };
   

package/calendar/grid/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["calendar/grid/index.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAO/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,eAiIX"}

package/calendar/grid/index.js

@@ -6,7 +6,6 @@ import { KeyCode } from '../../internal/keycode';
 import { isSameDay, isSameMonth } from 'date-fns';
 import { getCalendarMonth } from 'mnth';
 import { getDateLabel, renderDayName } from '../utils/intl';
-import useFocusVisible from '../../internal/hooks/focus-visible/index.js';
 import clsx from 'clsx';
 import { useEffectOnUpdate } from '../../internal/hooks/use-effect-on-update.js';
 import ScreenreaderOnly from '../../internal/components/screenreader-only/index.js';
@@ -60,7 +59,6 @@ export default function Grid({ locale, baseDate, isDateEnabled, focusedDate, foc
     }, [focusedDate]);
     const weeks = useMemo(() => getCalendarMonth(baseDate, { firstDayOfWeek: startOfWeek }), [baseDate, startOfWeek]);
     const weekdays = weeks[0].map(date => date.getDay());
-    const focusVisible = useFocusVisible();
     return (React.createElement("table", { role: "grid", className: styles['calendar-grid'], "aria-labelledby": ariaLabelledby },
         React.createElement("thead", null,
             React.createElement("tr", null, weekdays.map(dayIndex => (React.createElement("th", { key: dayIndex, scope: "col", className: clsx(styles['calendar-grid-cell'], styles['calendar-day-header']) },
@@ -86,14 +84,14 @@ export default function Grid({ locale, baseDate, isDateEnabled, focusedDate, foc
             if (isDateOnSameDay) {
                 dayAnnouncement += '. ' + todayAriaLabel;
             }
-            return (React.createElement("td", Object.assign({ key: `${weekIndex}:${dateIndex}`, ref: tabIndex === 0 ? focusedDateRef : undefined, tabIndex: tabIndex, "aria-current": isDateOnSameDay ? 'date' : undefined, "aria-selected": isEnabled ? isSelected : undefined, "aria-disabled": !isEnabled, 
+            return (React.createElement("td", { key: `${weekIndex}:${dateIndex}`, ref: tabIndex === 0 ? focusedDateRef : undefined, tabIndex: tabIndex, "aria-current": isDateOnSameDay ? 'date' : undefined, "aria-selected": isEnabled ? isSelected : undefined, "aria-disabled": !isEnabled, 
                 // Do not attach click event when the date is disabled, otherwise VO+safari announces clickable
                 onClick: isEnabled ? () => onSelectDate(date) : undefined, className: clsx(styles['calendar-grid-cell'], styles['calendar-day'], {
                     [styles['calendar-day-current-month']]: isSameMonth(date, baseDate),
                     [styles['calendar-day-enabled']]: isEnabled,
                     [styles['calendar-day-selected']]: isSelected,
                     [styles['calendar-day-today']]: isDateOnSameDay,
-                }) }, focusVisible),
+                }) },
                 React.createElement("span", { className: styles['day-inner'], "aria-hidden": "true" }, date.getDate()),
                 React.createElement(ScreenreaderOnly, null, dayAnnouncement)));
         })))))));

package/calendar/grid/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["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"]}
+{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["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 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  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                >\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"]}

package/calendar/styles.css.js

@@ -1,23 +1,23 @@
 
     import './styles.scoped.css';
     export default {
-  "calendar": "awsui_calendar_1ykar_bfmdu_93",
-  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1ykar_bfmdu_1",
-  "root": "awsui_root_1ykar_bfmdu_124",
-  "calendar-inner": "awsui_calendar-inner_1ykar_bfmdu_143",
-  "calendar-header": "awsui_calendar-header_1ykar_bfmdu_146",
-  "calendar-header-month": "awsui_calendar-header-month_1ykar_bfmdu_151",
-  "calendar-next-month-btn": "awsui_calendar-next-month-btn_1ykar_bfmdu_158",
-  "calendar-prev-month-btn": "awsui_calendar-prev-month-btn_1ykar_bfmdu_161",
-  "calendar-grid": "awsui_calendar-grid_1ykar_bfmdu_164",
-  "calendar-grid-cell": "awsui_calendar-grid-cell_1ykar_bfmdu_168",
-  "calendar-day-header": "awsui_calendar-day-header_1ykar_bfmdu_174",
-  "calendar-day": "awsui_calendar-day_1ykar_bfmdu_174",
-  "calendar-day-enabled": "awsui_calendar-day-enabled_1ykar_bfmdu_191",
-  "calendar-day-current-month": "awsui_calendar-day-current-month_1ykar_bfmdu_198",
-  "calendar-day-selected": "awsui_calendar-day-selected_1ykar_bfmdu_205",
-  "calendar-day-today": "awsui_calendar-day-today_1ykar_bfmdu_208",
-  "day-inner": "awsui_day-inner_1ykar_bfmdu_223",
-  "calendar-week": "awsui_calendar-week_1ykar_bfmdu_288"
+  "calendar": "awsui_calendar_1ykar_n08o2_93",
+  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1ykar_n08o2_1",
+  "root": "awsui_root_1ykar_n08o2_124",
+  "calendar-inner": "awsui_calendar-inner_1ykar_n08o2_143",
+  "calendar-header": "awsui_calendar-header_1ykar_n08o2_146",
+  "calendar-header-month": "awsui_calendar-header-month_1ykar_n08o2_151",
+  "calendar-next-month-btn": "awsui_calendar-next-month-btn_1ykar_n08o2_158",
+  "calendar-prev-month-btn": "awsui_calendar-prev-month-btn_1ykar_n08o2_161",
+  "calendar-grid": "awsui_calendar-grid_1ykar_n08o2_164",
+  "calendar-grid-cell": "awsui_calendar-grid-cell_1ykar_n08o2_168",
+  "calendar-day-header": "awsui_calendar-day-header_1ykar_n08o2_174",
+  "calendar-day": "awsui_calendar-day_1ykar_n08o2_174",
+  "calendar-day-enabled": "awsui_calendar-day-enabled_1ykar_n08o2_191",
+  "calendar-day-current-month": "awsui_calendar-day-current-month_1ykar_n08o2_198",
+  "calendar-day-selected": "awsui_calendar-day-selected_1ykar_n08o2_205",
+  "calendar-day-today": "awsui_calendar-day-today_1ykar_n08o2_208",
+  "day-inner": "awsui_day-inner_1ykar_n08o2_223",
+  "calendar-week": "awsui_calendar-week_1ykar_n08o2_288"
 };
   

package/calendar/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_calendar_1ykar_bfmdu_93:not(#\9) {
-  animation: awsui_awsui-motion-fade-in-0_1ykar_bfmdu_1 var(--motion-duration-show-quick-tyaalm, 135ms) var(--motion-easing-show-quick-1fcgbv, ease-out);
+.awsui_calendar_1ykar_n08o2_93:not(#\9) {
+  animation: awsui_awsui-motion-fade-in-0_1ykar_n08o2_1 var(--motion-duration-show-quick-tyaalm, 135ms) var(--motion-easing-show-quick-1fcgbv, ease-out);
   animation-fill-mode: both;
 }
-@keyframes awsui_awsui-motion-fade-in-0_1ykar_bfmdu_1 {
+@keyframes awsui_awsui-motion-fade-in-0_1ykar_n08o2_1 {
   from {
     opacity: 0;
   }
@@ -103,12 +103,12 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_calendar_1ykar_bfmdu_93:not(#\9) {
+  .awsui_calendar_1ykar_n08o2_93:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_calendar_1ykar_bfmdu_93:not(#\9), .awsui-mode-entering .awsui_calendar_1ykar_bfmdu_93:not(#\9) {
+.awsui-motion-disabled .awsui_calendar_1ykar_n08o2_93:not(#\9), .awsui-mode-entering .awsui_calendar_1ykar_n08o2_93:not(#\9) {
   animation: none;
   transition: none;
 }
@@ -121,11 +121,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_root_1ykar_bfmdu_124:not(#\9) {
+.awsui_root_1ykar_n08o2_124:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_calendar_1ykar_bfmdu_93:not(#\9) {
+.awsui_calendar_1ykar_n08o2_93:not(#\9) {
   display: block;
   width: var(--size-calendar-grid-width-lxsx0p, 238px);
   overflow: auto;
@@ -166,77 +166,77 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   -webkit-font-smoothing: auto;
   -moz-osx-font-smoothing: auto;
 }
-.awsui_calendar-inner_1ykar_bfmdu_143:not(#\9) {
+.awsui_calendar-inner_1ykar_n08o2_143:not(#\9) {
   margin: var(--space-xs-rsr2qu, 8px);
 }
-.awsui_calendar-header_1ykar_bfmdu_146:not(#\9) {
+.awsui_calendar-header_1ykar_n08o2_146:not(#\9) {
   display: flex;
   justify-content: space-between;
   align-items: center;
 }
-.awsui_calendar-header-month_1ykar_bfmdu_151:not(#\9) {
+.awsui_calendar-header-month_1ykar_n08o2_151:not(#\9) {
   font-size: var(--font-body-m-size-sregvd, 14px);
   line-height: var(--font-body-m-line-height-i7xxvv, 22px);
   font-weight: 700;
   color: var(--color-text-dropdown-item-default-7tg9p2, #000716);
   margin: 0;
 }
-.awsui_calendar-next-month-btn_1ykar_bfmdu_158:not(#\9) {
+.awsui_calendar-next-month-btn_1ykar_n08o2_158:not(#\9) {
   /* used for identifying element */
 }
-.awsui_calendar-prev-month-btn_1ykar_bfmdu_161:not(#\9) {
+.awsui_calendar-prev-month-btn_1ykar_n08o2_161:not(#\9) {
   /* used for identifying element */
 }
-.awsui_calendar-grid_1ykar_bfmdu_164:not(#\9) {
+.awsui_calendar-grid_1ykar_n08o2_164:not(#\9) {
   width: 100%;
   border-spacing: 0;
 }
-.awsui_calendar-grid-cell_1ykar_bfmdu_168:not(#\9) {
+.awsui_calendar-grid-cell_1ykar_n08o2_168:not(#\9) {
   width: 14.2857142857%;
   word-break: break-word;
   text-align: center;
   font-weight: unset;
 }
-.awsui_calendar-day-header_1ykar_bfmdu_174:not(#\9) {
+.awsui_calendar-day-header_1ykar_n08o2_174:not(#\9) {
   padding: var(--space-s-hv8c1d, 12px) 0 var(--space-xxs-ynfts5, 4px);
   color: var(--color-text-calendar-month-elf7e9, #5f6b7a);
   font-size: var(--font-body-s-size-ukw2p9, 12px);
   line-height: var(--font-body-s-line-height-kdsbrl, 16px);
   letter-spacing: var(--font-body-s-letter-spacing-cy0oxj, 0.005em);
 }
-.awsui_calendar-day_1ykar_bfmdu_174:not(#\9) {
+.awsui_calendar-day_1ykar_n08o2_174:not(#\9) {
   border-bottom: 1px solid var(--color-border-calendar-grid-sshunw, transparent);
   border-right: 1px solid var(--color-border-calendar-grid-sshunw, transparent);
   padding: var(--space-xxs-ynfts5, 4px) 0;
   color: var(--color-text-dropdown-item-disabled-varol7, #9ba7b6);
   position: relative;
 }
-.awsui_calendar-day_1ykar_bfmdu_174:not(#\9):first-child {
+.awsui_calendar-day_1ykar_n08o2_174:not(#\9):first-child {
   border-left: 1px solid var(--color-border-calendar-grid-sshunw, transparent);
 }
-.awsui_calendar-day-enabled_1ykar_bfmdu_191:not(#\9) {
+.awsui_calendar-day-enabled_1ykar_n08o2_191:not(#\9) {
   cursor: pointer;
   color: var(--color-text-dropdown-item-secondary-0me7js, #5f6b7a);
 }
-.awsui_calendar-day-enabled_1ykar_bfmdu_191:not(#\9)::after {
+.awsui_calendar-day-enabled_1ykar_n08o2_191:not(#\9)::after {
   border-radius: var(--border-radius-item-u2ibpi, 8px);
 }
-.awsui_calendar-day-enabled_1ykar_bfmdu_191.awsui_calendar-day-current-month_1ykar_bfmdu_198:not(#\9) {
+.awsui_calendar-day-enabled_1ykar_n08o2_191.awsui_calendar-day-current-month_1ykar_n08o2_198:not(#\9) {
   color: var(--color-text-dropdown-item-default-7tg9p2, #000716);
 }
-.awsui_calendar-day-enabled_1ykar_bfmdu_191.awsui_calendar-day-current-month_1ykar_bfmdu_198:not(#\9):hover {
+.awsui_calendar-day-enabled_1ykar_n08o2_191.awsui_calendar-day-current-month_1ykar_n08o2_198:not(#\9):hover {
   color: var(--color-text-calendar-day-hover-graajh, #000716);
   background-color: var(--color-background-dropdown-item-hover-mqsxkv, #f4f4f4);
 }
-.awsui_calendar-day-enabled_1ykar_bfmdu_191.awsui_calendar-day-current-month_1ykar_bfmdu_198:not(#\9):hover:not(.awsui_calendar-day-selected_1ykar_bfmdu_205)::after {
+.awsui_calendar-day-enabled_1ykar_n08o2_191.awsui_calendar-day-current-month_1ykar_n08o2_198:not(#\9):hover:not(.awsui_calendar-day-selected_1ykar_n08o2_205)::after {
   border: var(--border-item-width-qbbbsa, 2px) solid var(--color-border-dropdown-item-hover-tyzq9m, #7d8998);
 }
-.awsui_calendar-day-today_1ykar_bfmdu_208:not(#\9) {
+.awsui_calendar-day-today_1ykar_n08o2_208:not(#\9) {
   background-color: var(--color-background-calendar-today-762czq, #f4f4f4);
   border-radius: var(--border-radius-item-u2ibpi, 8px);
   font-weight: 700;
 }
-.awsui_calendar-day_1ykar_bfmdu_174:not(#\9)::after {
+.awsui_calendar-day_1ykar_n08o2_174:not(#\9)::after {
   content: "";
   position: absolute;
   z-index: 1;
@@ -246,21 +246,21 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   right: calc(-1 * var(--border-item-width-qbbbsa, 2px));
   background-color: transparent;
 }
-.awsui_calendar-day_1ykar_bfmdu_174 > .awsui_day-inner_1ykar_bfmdu_223:not(#\9) {
+.awsui_calendar-day_1ykar_n08o2_174 > .awsui_day-inner_1ykar_n08o2_223:not(#\9) {
   position: relative;
   z-index: 1;
 }
-.awsui_calendar-day_1ykar_bfmdu_174:not(#\9):focus {
+.awsui_calendar-day_1ykar_n08o2_174:not(#\9):focus {
   outline: none;
 }
-.awsui_calendar-day_1ykar_bfmdu_174:not(#\9):focus[data-awsui-focus-visible=true]:focus {
+body[data-awsui-focus-visible=true] .awsui_calendar-day_1ykar_n08o2_174:not(#\9):focus:focus {
   position: relative;
 }
-.awsui_calendar-day_1ykar_bfmdu_174:not(#\9):focus[data-awsui-focus-visible=true]:focus {
+body[data-awsui-focus-visible=true] .awsui_calendar-day_1ykar_n08o2_174:not(#\9):focus:focus {
   outline: 2px dotted transparent;
   outline-offset: calc(var(--space-calendar-grid-focus-outline-gutter-v3dwvl, -5px) - 1px);
 }
-.awsui_calendar-day_1ykar_bfmdu_174:not(#\9):focus[data-awsui-focus-visible=true]:focus::before {
+body[data-awsui-focus-visible=true] .awsui_calendar-day_1ykar_n08o2_174:not(#\9):focus:focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -271,23 +271,23 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-radius: var(--border-radius-calendar-day-focus-ring-a8mlqd, 3px);
   box-shadow: 0 0 0 2px var(--color-border-item-focused-ap3b6s, #0972d3);
 }
-.awsui_calendar-day_1ykar_bfmdu_174:not(#\9):focus[data-awsui-focus-visible=true]:focus::before {
+body[data-awsui-focus-visible=true] .awsui_calendar-day_1ykar_n08o2_174:not(#\9):focus:focus::before {
   z-index: 2;
 }
-.awsui_calendar-day-selected_1ykar_bfmdu_205:not(#\9) {
+.awsui_calendar-day-selected_1ykar_n08o2_205:not(#\9) {
   border-color: transparent;
   position: relative;
   z-index: 2;
   font-weight: 700;
 }
-.awsui_calendar-day-selected_1ykar_bfmdu_205:not(#\9):focus[data-awsui-focus-visible=true]:focus {
+body[data-awsui-focus-visible=true] .awsui_calendar-day-selected_1ykar_n08o2_205:not(#\9):focus:focus {
   position: relative;
 }
-.awsui_calendar-day-selected_1ykar_bfmdu_205:not(#\9):focus[data-awsui-focus-visible=true]:focus {
+body[data-awsui-focus-visible=true] .awsui_calendar-day-selected_1ykar_n08o2_205:not(#\9):focus:focus {
   outline: 2px dotted transparent;
   outline-offset: calc(var(--space-calendar-grid-focus-outline-gutter-v3dwvl, -5px) - 1px);
 }
-.awsui_calendar-day-selected_1ykar_bfmdu_205:not(#\9):focus[data-awsui-focus-visible=true]:focus::before {
+body[data-awsui-focus-visible=true] .awsui_calendar-day-selected_1ykar_n08o2_205:not(#\9):focus:focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -298,19 +298,19 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-radius: var(--border-radius-calendar-day-focus-ring-a8mlqd, 3px);
   box-shadow: 0 0 0 2px var(--color-border-calendar-grid-selected-focus-ring-cxqa0s, #fbfbfb);
 }
-.awsui_calendar-day-selected_1ykar_bfmdu_205:not(#\9):focus[data-awsui-focus-visible=true]:focus::before {
+body[data-awsui-focus-visible=true] .awsui_calendar-day-selected_1ykar_n08o2_205:not(#\9):focus:focus::before {
   z-index: 2;
 }
-.awsui_calendar-day-selected_1ykar_bfmdu_205:not(#\9)::after {
+.awsui_calendar-day-selected_1ykar_n08o2_205:not(#\9)::after {
   background-color: var(--color-background-control-checked-9admlu, #0972d3);
   border: var(--border-item-width-qbbbsa, 2px) solid var(--color-background-control-checked-9admlu, #0972d3);
   border-radius: var(--border-radius-item-u2ibpi, 8px);
 }
-.awsui_calendar-day-selected_1ykar_bfmdu_205 > .awsui_day-inner_1ykar_bfmdu_223:not(#\9) {
+.awsui_calendar-day-selected_1ykar_n08o2_205 > .awsui_day-inner_1ykar_n08o2_223:not(#\9) {
   z-index: 2;
   color: var(--color-background-control-default-4pa05r, #ffffff);
   position: relative;
 }
-.awsui_calendar-week_1ykar_bfmdu_288:not(#\9):first-child > .awsui_calendar-day_1ykar_bfmdu_174 {
+.awsui_calendar-week_1ykar_n08o2_288:not(#\9):first-child > .awsui_calendar-day_1ykar_n08o2_174 {
   border-top: 1px solid var(--color-border-calendar-grid-sshunw, transparent);
 }

package/calendar/styles.selectors.js

@@ -2,23 +2,23 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "calendar": "awsui_calendar_1ykar_bfmdu_93",
-  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1ykar_bfmdu_1",
-  "root": "awsui_root_1ykar_bfmdu_124",
-  "calendar-inner": "awsui_calendar-inner_1ykar_bfmdu_143",
-  "calendar-header": "awsui_calendar-header_1ykar_bfmdu_146",
-  "calendar-header-month": "awsui_calendar-header-month_1ykar_bfmdu_151",
-  "calendar-next-month-btn": "awsui_calendar-next-month-btn_1ykar_bfmdu_158",
-  "calendar-prev-month-btn": "awsui_calendar-prev-month-btn_1ykar_bfmdu_161",
-  "calendar-grid": "awsui_calendar-grid_1ykar_bfmdu_164",
-  "calendar-grid-cell": "awsui_calendar-grid-cell_1ykar_bfmdu_168",
-  "calendar-day-header": "awsui_calendar-day-header_1ykar_bfmdu_174",
-  "calendar-day": "awsui_calendar-day_1ykar_bfmdu_174",
-  "calendar-day-enabled": "awsui_calendar-day-enabled_1ykar_bfmdu_191",
-  "calendar-day-current-month": "awsui_calendar-day-current-month_1ykar_bfmdu_198",
-  "calendar-day-selected": "awsui_calendar-day-selected_1ykar_bfmdu_205",
-  "calendar-day-today": "awsui_calendar-day-today_1ykar_bfmdu_208",
-  "day-inner": "awsui_day-inner_1ykar_bfmdu_223",
-  "calendar-week": "awsui_calendar-week_1ykar_bfmdu_288"
+  "calendar": "awsui_calendar_1ykar_n08o2_93",
+  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1ykar_n08o2_1",
+  "root": "awsui_root_1ykar_n08o2_124",
+  "calendar-inner": "awsui_calendar-inner_1ykar_n08o2_143",
+  "calendar-header": "awsui_calendar-header_1ykar_n08o2_146",
+  "calendar-header-month": "awsui_calendar-header-month_1ykar_n08o2_151",
+  "calendar-next-month-btn": "awsui_calendar-next-month-btn_1ykar_n08o2_158",
+  "calendar-prev-month-btn": "awsui_calendar-prev-month-btn_1ykar_n08o2_161",
+  "calendar-grid": "awsui_calendar-grid_1ykar_n08o2_164",
+  "calendar-grid-cell": "awsui_calendar-grid-cell_1ykar_n08o2_168",
+  "calendar-day-header": "awsui_calendar-day-header_1ykar_n08o2_174",
+  "calendar-day": "awsui_calendar-day_1ykar_n08o2_174",
+  "calendar-day-enabled": "awsui_calendar-day-enabled_1ykar_n08o2_191",
+  "calendar-day-current-month": "awsui_calendar-day-current-month_1ykar_n08o2_198",
+  "calendar-day-selected": "awsui_calendar-day-selected_1ykar_n08o2_205",
+  "calendar-day-today": "awsui_calendar-day-today_1ykar_n08o2_208",
+  "day-inner": "awsui_day-inner_1ykar_n08o2_223",
+  "calendar-week": "awsui_calendar-week_1ykar_n08o2_288"
 };
   

package/code-editor/styles.css.js

@@ -1,37 +1,37 @@
 
     import './styles.scoped.css';
     export default {
-  "code-editor": "awsui_code-editor_1gl9c_171ac_98",
-  "code-editor-refresh": "awsui_code-editor-refresh_1gl9c_171ac_342",
-  "pane": "awsui_pane_1gl9c_171ac_354",
-  "pane__close-container": "awsui_pane__close-container_1gl9c_171ac_365",
-  "pane__list": "awsui_pane__list_1gl9c_171ac_370",
-  "pane__table": "awsui_pane__table_1gl9c_171ac_377",
-  "pane__item": "awsui_pane__item_1gl9c_171ac_382",
-  "pane__cell": "awsui_pane__cell_1gl9c_171ac_382",
-  "pane__item--highlighted": "awsui_pane__item--highlighted_1gl9c_171ac_396",
-  "pane__location": "awsui_pane__location_1gl9c_171ac_417",
-  "pane__description": "awsui_pane__description_1gl9c_171ac_417",
-  "focus-lock": "awsui_focus-lock_1gl9c_171ac_432",
-  "editor": "awsui_editor_1gl9c_171ac_457",
-  "editor-refresh": "awsui_editor-refresh_1gl9c_171ac_485",
-  "status-bar": "awsui_status-bar_1gl9c_171ac_490",
-  "status-bar-with-hidden-pane": "awsui_status-bar-with-hidden-pane_1gl9c_171ac_499",
-  "status-bar__left": "awsui_status-bar__left_1gl9c_171ac_503",
-  "status-bar__left-virtual": "awsui_status-bar__left-virtual_1gl9c_171ac_510",
-  "status-bar__right": "awsui_status-bar__right_1gl9c_171ac_514",
-  "status-bar__language-mode": "awsui_status-bar__language-mode_1gl9c_171ac_518",
-  "status-bar__cursor-position": "awsui_status-bar__cursor-position_1gl9c_171ac_518",
-  "status-bar__cog-button": "awsui_status-bar__cog-button_1gl9c_171ac_523",
-  "status-bar-virtual": "awsui_status-bar-virtual_1gl9c_171ac_527",
-  "tab-button": "awsui_tab-button_1gl9c_171ac_533",
-  "tab-button--refresh": "awsui_tab-button--refresh_1gl9c_171ac_546",
-  "tab-button--active": "awsui_tab-button--active_1gl9c_171ac_560",
-  "tab-button--disabled": "awsui_tab-button--disabled_1gl9c_171ac_580",
-  "tab-button--divider": "awsui_tab-button--divider_1gl9c_171ac_610",
-  "tab-button--errors": "awsui_tab-button--errors_1gl9c_171ac_617",
-  "tab-button--warnings": "awsui_tab-button--warnings_1gl9c_171ac_617",
-  "loading-screen": "awsui_loading-screen_1gl9c_171ac_621",
-  "error-screen": "awsui_error-screen_1gl9c_171ac_622"
+  "code-editor": "awsui_code-editor_1gl9c_kh6mt_98",
+  "code-editor-refresh": "awsui_code-editor-refresh_1gl9c_kh6mt_342",
+  "pane": "awsui_pane_1gl9c_kh6mt_354",
+  "pane__close-container": "awsui_pane__close-container_1gl9c_kh6mt_365",
+  "pane__list": "awsui_pane__list_1gl9c_kh6mt_370",
+  "pane__table": "awsui_pane__table_1gl9c_kh6mt_377",
+  "pane__item": "awsui_pane__item_1gl9c_kh6mt_382",
+  "pane__cell": "awsui_pane__cell_1gl9c_kh6mt_382",
+  "pane__item--highlighted": "awsui_pane__item--highlighted_1gl9c_kh6mt_396",
+  "pane__location": "awsui_pane__location_1gl9c_kh6mt_417",
+  "pane__description": "awsui_pane__description_1gl9c_kh6mt_417",
+  "focus-lock": "awsui_focus-lock_1gl9c_kh6mt_432",
+  "editor": "awsui_editor_1gl9c_kh6mt_457",
+  "editor-refresh": "awsui_editor-refresh_1gl9c_kh6mt_485",
+  "status-bar": "awsui_status-bar_1gl9c_kh6mt_490",
+  "status-bar-with-hidden-pane": "awsui_status-bar-with-hidden-pane_1gl9c_kh6mt_499",
+  "status-bar__left": "awsui_status-bar__left_1gl9c_kh6mt_503",
+  "status-bar__left-virtual": "awsui_status-bar__left-virtual_1gl9c_kh6mt_510",
+  "status-bar__right": "awsui_status-bar__right_1gl9c_kh6mt_514",
+  "status-bar__language-mode": "awsui_status-bar__language-mode_1gl9c_kh6mt_518",
+  "status-bar__cursor-position": "awsui_status-bar__cursor-position_1gl9c_kh6mt_518",
+  "status-bar__cog-button": "awsui_status-bar__cog-button_1gl9c_kh6mt_523",
+  "status-bar-virtual": "awsui_status-bar-virtual_1gl9c_kh6mt_527",
+  "tab-button": "awsui_tab-button_1gl9c_kh6mt_533",
+  "tab-button--refresh": "awsui_tab-button--refresh_1gl9c_kh6mt_546",
+  "tab-button--active": "awsui_tab-button--active_1gl9c_kh6mt_560",
+  "tab-button--disabled": "awsui_tab-button--disabled_1gl9c_kh6mt_580",
+  "tab-button--divider": "awsui_tab-button--divider_1gl9c_kh6mt_610",
+  "tab-button--errors": "awsui_tab-button--errors_1gl9c_kh6mt_617",
+  "tab-button--warnings": "awsui_tab-button--warnings_1gl9c_kh6mt_617",
+  "loading-screen": "awsui_loading-screen_1gl9c_kh6mt_621",
+  "error-screen": "awsui_error-screen_1gl9c_kh6mt_622"
 };