@cloudscape-design/components-themeable 3.0.348 → 3.0.350

package/lib/internal/template/attribute-editor/row.js.map

@@ -1 +1 @@
-{"version":3,"file":"row.js","sourceRoot":"lib/default/","sources":["attribute-editor/row.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 InternalBox from '../box/internal';\nimport styles from './styles.css.js';\nimport React, { useCallback } from 'react';\nimport InternalFormField from '../form-field/internal';\nimport InternalColumnLayout, { ColumnLayoutBreakpoint } from '../column-layout/internal';\nimport { AttributeEditorProps } from './interfaces';\nimport { ButtonProps } from '../button/interfaces';\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../internal/events';\nimport InternalGrid from '../grid/internal';\nimport { InternalButton } from '../button/internal';\nimport clsx from 'clsx';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useInternalI18n } from '../internal/i18n/context';\n\nconst Divider = () => <InternalBox className={styles.divider} padding={{ top: 'l' }} />;\n\nexport interface RowProps<T> {\n  breakpoint: ColumnLayoutBreakpoint | null;\n  item: T;\n  definition: ReadonlyArray<AttributeEditorProps.FieldDefinition<T>>;\n  i18nStrings: AttributeEditorProps.I18nStrings | undefined;\n  index: number;\n  removable: boolean;\n  removeButtonText?: string;\n  removeButtonRefs: Array<ButtonProps.Ref | undefined>;\n  onRemoveButtonClick?: NonCancelableEventHandler<AttributeEditorProps.RemoveButtonClickDetail>;\n}\n\nfunction render<T>(\n  item: T,\n  itemIndex: number,\n  slot: AttributeEditorProps.FieldRenderable<T> | React.ReactNode | undefined\n) {\n  return typeof slot === 'function' ? slot(item, itemIndex) : slot;\n}\n\nconst GRID_DEFINITION = [{ colspan: { default: 12, xs: 9 } }];\nconst REMOVABLE_GRID_DEFINITION = [{ colspan: { default: 12, xs: 9 } }, { colspan: { default: 12, xs: 3 } }];\nexport const Row = React.memo(\n  <T,>({\n    breakpoint,\n    item,\n    definition,\n    i18nStrings = {},\n    index,\n    removable,\n    removeButtonText,\n    removeButtonRefs,\n    onRemoveButtonClick,\n  }: RowProps<T>) => {\n    const i18n = useInternalI18n('attribute-editor');\n    const isNarrowViewport = breakpoint === 'default' || breakpoint === 'xxs';\n    const isWideViewport = !isNarrowViewport;\n\n    const handleRemoveClick = useCallback(() => {\n      fireNonCancelableEvent(onRemoveButtonClick, { itemIndex: index });\n    }, [onRemoveButtonClick, index]);\n\n    const firstControlId = useUniqueId('first-control-id-');\n\n    return (\n      <InternalBox className={styles.row} margin={{ bottom: 's' }}>\n        <div role=\"group\" aria-labelledby={`${firstControlId}-label ${firstControlId}`}>\n          <InternalGrid\n            __breakpoint={breakpoint}\n            gridDefinition={removable ? REMOVABLE_GRID_DEFINITION : GRID_DEFINITION}\n          >\n            <InternalColumnLayout\n              className={styles['row-control']}\n              columns={definition.length}\n              __breakpoint={breakpoint}\n            >\n              {definition.map(({ info, label, constraintText, errorText, control }, defIndex) => (\n                <InternalFormField\n                  key={defIndex}\n                  className={styles.field}\n                  label={label}\n                  info={info}\n                  constraintText={render(item, index, constraintText)}\n                  errorText={render(item, index, errorText)}\n                  stretch={true}\n                  i18nStrings={{ errorIconAriaLabel: i18nStrings.errorIconAriaLabel }}\n                  __hideLabel={isWideViewport && index > 0}\n                  controlId={defIndex === 0 ? firstControlId : undefined}\n                >\n                  {render(item, index, control)}\n                </InternalFormField>\n              ))}\n            </InternalColumnLayout>\n            {removable && (\n              <ButtonContainer\n                index={index}\n                isNarrowViewport={isNarrowViewport}\n                hasLabel={definition.some(row => row.label)}\n              >\n                <InternalButton\n                  className={styles['remove-button']}\n                  formAction=\"none\"\n                  ref={ref => {\n                    removeButtonRefs[index] = ref ?? undefined;\n                  }}\n                  ariaLabel={i18nStrings.removeButtonAriaLabel?.(item)}\n                  onClick={handleRemoveClick}\n                >\n                  {i18n('removeButtonText', removeButtonText)}\n                </InternalButton>\n              </ButtonContainer>\n            )}\n          </InternalGrid>\n        </div>\n        {isNarrowViewport && <Divider />}\n      </InternalBox>\n    );\n  }\n);\n\ninterface ButtonContainer {\n  index: number;\n  children: React.ReactNode;\n  isNarrowViewport: boolean;\n  hasLabel: boolean;\n}\n\nconst ButtonContainer = ({ index, children, isNarrowViewport, hasLabel }: ButtonContainer) => (\n  <div\n    className={clsx({\n      [styles['button-container-haslabel']]: !isNarrowViewport && index === 0 && hasLabel,\n      [styles['button-container-nolabel']]: !isNarrowViewport && index === 0 && !hasLabel,\n      [styles['right-align']]: isNarrowViewport,\n    })}\n  >\n    {children}\n  </div>\n);\n"]}
+{"version":3,"file":"row.js","sourceRoot":"lib/default/","sources":["attribute-editor/row.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 InternalBox from '../box/internal';\nimport styles from './styles.css.js';\nimport React, { useCallback } from 'react';\nimport InternalFormField from '../form-field/internal';\nimport InternalColumnLayout, { ColumnLayoutBreakpoint } from '../column-layout/internal';\nimport { AttributeEditorProps } from './interfaces';\nimport { ButtonProps } from '../button/interfaces';\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../internal/events';\nimport InternalGrid from '../grid/internal';\nimport { InternalButton } from '../button/internal';\nimport clsx from 'clsx';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useInternalI18n } from '../internal/i18n/context';\n\nconst Divider = () => <InternalBox className={styles.divider} padding={{ top: 'l' }} />;\n\nexport interface RowProps<T> {\n  breakpoint: ColumnLayoutBreakpoint | null;\n  item: T;\n  definition: ReadonlyArray<AttributeEditorProps.FieldDefinition<T>>;\n  i18nStrings: AttributeEditorProps.I18nStrings | undefined;\n  index: number;\n  removable: boolean;\n  removeButtonText?: string;\n  removeButtonRefs: Array<ButtonProps.Ref | undefined>;\n  onRemoveButtonClick?: NonCancelableEventHandler<AttributeEditorProps.RemoveButtonClickDetail>;\n  removeButtonAriaLabel?: (item: T) => string;\n}\n\nfunction render<T>(\n  item: T,\n  itemIndex: number,\n  slot: AttributeEditorProps.FieldRenderable<T> | React.ReactNode | undefined\n) {\n  return typeof slot === 'function' ? slot(item, itemIndex) : slot;\n}\n\nconst GRID_DEFINITION = [{ colspan: { default: 12, xs: 9 } }];\nconst REMOVABLE_GRID_DEFINITION = [{ colspan: { default: 12, xs: 9 } }, { colspan: { default: 12, xs: 3 } }];\nexport const Row = React.memo(\n  <T,>({\n    breakpoint,\n    item,\n    definition,\n    i18nStrings = {},\n    index,\n    removable,\n    removeButtonText,\n    removeButtonRefs,\n    onRemoveButtonClick,\n    removeButtonAriaLabel,\n  }: RowProps<T>) => {\n    const i18n = useInternalI18n('attribute-editor');\n    const isNarrowViewport = breakpoint === 'default' || breakpoint === 'xxs';\n    const isWideViewport = !isNarrowViewport;\n\n    const handleRemoveClick = useCallback(() => {\n      fireNonCancelableEvent(onRemoveButtonClick, { itemIndex: index });\n    }, [onRemoveButtonClick, index]);\n\n    const firstControlId = useUniqueId('first-control-id-');\n\n    return (\n      <InternalBox className={styles.row} margin={{ bottom: 's' }}>\n        <div role=\"group\" aria-labelledby={`${firstControlId}-label ${firstControlId}`}>\n          <InternalGrid\n            __breakpoint={breakpoint}\n            gridDefinition={removable ? REMOVABLE_GRID_DEFINITION : GRID_DEFINITION}\n          >\n            <InternalColumnLayout\n              className={styles['row-control']}\n              columns={definition.length}\n              __breakpoint={breakpoint}\n            >\n              {definition.map(({ info, label, constraintText, errorText, control }, defIndex) => (\n                <InternalFormField\n                  key={defIndex}\n                  className={styles.field}\n                  label={label}\n                  info={info}\n                  constraintText={render(item, index, constraintText)}\n                  errorText={render(item, index, errorText)}\n                  stretch={true}\n                  i18nStrings={{ errorIconAriaLabel: i18nStrings.errorIconAriaLabel }}\n                  __hideLabel={isWideViewport && index > 0}\n                  controlId={defIndex === 0 ? firstControlId : undefined}\n                >\n                  {render(item, index, control)}\n                </InternalFormField>\n              ))}\n            </InternalColumnLayout>\n            {removable && (\n              <ButtonContainer\n                index={index}\n                isNarrowViewport={isNarrowViewport}\n                hasLabel={definition.some(row => row.label)}\n              >\n                <InternalButton\n                  className={styles['remove-button']}\n                  formAction=\"none\"\n                  ref={ref => {\n                    removeButtonRefs[index] = ref ?? undefined;\n                  }}\n                  ariaLabel={(removeButtonAriaLabel ?? i18nStrings.removeButtonAriaLabel)?.(item)}\n                  onClick={handleRemoveClick}\n                >\n                  {i18n('removeButtonText', removeButtonText)}\n                </InternalButton>\n              </ButtonContainer>\n            )}\n          </InternalGrid>\n        </div>\n        {isNarrowViewport && <Divider />}\n      </InternalBox>\n    );\n  }\n) as <T>(props: RowProps<T>) => JSX.Element;\n\ninterface ButtonContainer {\n  index: number;\n  children: React.ReactNode;\n  isNarrowViewport: boolean;\n  hasLabel: boolean;\n}\n\nconst ButtonContainer = ({ index, children, isNarrowViewport, hasLabel }: ButtonContainer) => (\n  <div\n    className={clsx({\n      [styles['button-container-haslabel']]: !isNarrowViewport && index === 0 && hasLabel,\n      [styles['button-container-nolabel']]: !isNarrowViewport && index === 0 && !hasLabel,\n      [styles['right-align']]: isNarrowViewport,\n    })}\n  >\n    {children}\n  </div>\n);\n"]}

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

@@ -1,194 +1,194 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_18wu0_1jubt_93",
-  "box": "awsui_box_18wu0_1jubt_207",
-  "p-variant": "awsui_p-variant_18wu0_1jubt_207",
-  "color-default": "awsui_color-default_18wu0_1jubt_207",
-  "b-variant": "awsui_b-variant_18wu0_1jubt_207",
-  "strong-variant": "awsui_strong-variant_18wu0_1jubt_207",
-  "code-variant": "awsui_code-variant_18wu0_1jubt_207",
-  "pre-variant": "awsui_pre-variant_18wu0_1jubt_207",
-  "samp-variant": "awsui_samp-variant_18wu0_1jubt_207",
-  "h1-variant": "awsui_h1-variant_18wu0_1jubt_211",
-  "h2-variant": "awsui_h2-variant_18wu0_1jubt_211",
-  "h3-variant": "awsui_h3-variant_18wu0_1jubt_211",
-  "h4-variant": "awsui_h4-variant_18wu0_1jubt_211",
-  "h5-variant": "awsui_h5-variant_18wu0_1jubt_211",
-  "small-variant": "awsui_small-variant_18wu0_1jubt_215",
-  "a-variant": "awsui_a-variant_18wu0_1jubt_219",
-  "font-size-default": "awsui_font-size-default_18wu0_1jubt_223",
-  "font-weight-default": "awsui_font-weight-default_18wu0_1jubt_263",
-  "key-label-variant": "awsui_key-label-variant_18wu0_1jubt_303",
-  "value-large-variant": "awsui_value-large-variant_18wu0_1jubt_310",
-  "font-weight-heavy": "awsui_font-weight-heavy_18wu0_1jubt_317",
-  "color-inverted": "awsui_color-inverted_18wu0_1jubt_322",
-  "color-text-label": "awsui_color-text-label_18wu0_1jubt_325",
-  "color-text-body-secondary": "awsui_color-text-body-secondary_18wu0_1jubt_328",
-  "color-text-status-error": "awsui_color-text-status-error_18wu0_1jubt_331",
-  "color-text-status-success": "awsui_color-text-status-success_18wu0_1jubt_334",
-  "color-text-status-info": "awsui_color-text-status-info_18wu0_1jubt_337",
-  "color-text-status-inactive": "awsui_color-text-status-inactive_18wu0_1jubt_340",
-  "color-inherit": "awsui_color-inherit_18wu0_1jubt_343",
-  "font-size-body-s": "awsui_font-size-body-s_18wu0_1jubt_346",
-  "font-size-body-m": "awsui_font-size-body-m_18wu0_1jubt_351",
-  "font-size-heading-xs": "awsui_font-size-heading-xs_18wu0_1jubt_355",
-  "font-size-heading-s": "awsui_font-size-heading-s_18wu0_1jubt_359",
-  "font-size-heading-m": "awsui_font-size-heading-m_18wu0_1jubt_364",
-  "font-size-heading-l": "awsui_font-size-heading-l_18wu0_1jubt_369",
-  "font-size-heading-xl": "awsui_font-size-heading-xl_18wu0_1jubt_374",
-  "font-size-display-l": "awsui_font-size-display-l_18wu0_1jubt_379",
-  "font-weight-light": "awsui_font-weight-light_18wu0_1jubt_384",
-  "font-weight-normal": "awsui_font-weight-normal_18wu0_1jubt_387",
-  "font-weight-bold": "awsui_font-weight-bold_18wu0_1jubt_390",
-  "t-left": "awsui_t-left_18wu0_1jubt_397",
-  "t-right": "awsui_t-right_18wu0_1jubt_401",
-  "t-center": "awsui_t-center_18wu0_1jubt_405",
-  "p-n": "awsui_p-n_18wu0_1jubt_506",
-  "p-top-n": "awsui_p-top-n_18wu0_1jubt_510",
-  "p-vertical-n": "awsui_p-vertical-n_18wu0_1jubt_511",
-  "p-right-n": "awsui_p-right-n_18wu0_1jubt_515",
-  "p-horizontal-n": "awsui_p-horizontal-n_18wu0_1jubt_516",
-  "p-bottom-n": "awsui_p-bottom-n_18wu0_1jubt_520",
-  "p-left-n": "awsui_p-left-n_18wu0_1jubt_525",
-  "p-xxxs": "awsui_p-xxxs_18wu0_1jubt_530",
-  "p-top-xxxs": "awsui_p-top-xxxs_18wu0_1jubt_534",
-  "p-vertical-xxxs": "awsui_p-vertical-xxxs_18wu0_1jubt_535",
-  "p-right-xxxs": "awsui_p-right-xxxs_18wu0_1jubt_539",
-  "p-horizontal-xxxs": "awsui_p-horizontal-xxxs_18wu0_1jubt_540",
-  "p-bottom-xxxs": "awsui_p-bottom-xxxs_18wu0_1jubt_544",
-  "p-left-xxxs": "awsui_p-left-xxxs_18wu0_1jubt_549",
-  "p-xxs": "awsui_p-xxs_18wu0_1jubt_554",
-  "p-top-xxs": "awsui_p-top-xxs_18wu0_1jubt_558",
-  "p-vertical-xxs": "awsui_p-vertical-xxs_18wu0_1jubt_559",
-  "p-right-xxs": "awsui_p-right-xxs_18wu0_1jubt_563",
-  "p-horizontal-xxs": "awsui_p-horizontal-xxs_18wu0_1jubt_564",
-  "p-bottom-xxs": "awsui_p-bottom-xxs_18wu0_1jubt_568",
-  "p-left-xxs": "awsui_p-left-xxs_18wu0_1jubt_573",
-  "p-xs": "awsui_p-xs_18wu0_1jubt_578",
-  "p-top-xs": "awsui_p-top-xs_18wu0_1jubt_582",
-  "p-vertical-xs": "awsui_p-vertical-xs_18wu0_1jubt_583",
-  "p-right-xs": "awsui_p-right-xs_18wu0_1jubt_587",
-  "p-horizontal-xs": "awsui_p-horizontal-xs_18wu0_1jubt_588",
-  "p-bottom-xs": "awsui_p-bottom-xs_18wu0_1jubt_592",
-  "p-left-xs": "awsui_p-left-xs_18wu0_1jubt_597",
-  "p-s": "awsui_p-s_18wu0_1jubt_602",
-  "p-top-s": "awsui_p-top-s_18wu0_1jubt_606",
-  "p-vertical-s": "awsui_p-vertical-s_18wu0_1jubt_607",
-  "p-right-s": "awsui_p-right-s_18wu0_1jubt_611",
-  "p-horizontal-s": "awsui_p-horizontal-s_18wu0_1jubt_612",
-  "p-bottom-s": "awsui_p-bottom-s_18wu0_1jubt_616",
-  "p-left-s": "awsui_p-left-s_18wu0_1jubt_621",
-  "p-m": "awsui_p-m_18wu0_1jubt_626",
-  "p-top-m": "awsui_p-top-m_18wu0_1jubt_630",
-  "p-vertical-m": "awsui_p-vertical-m_18wu0_1jubt_631",
-  "p-right-m": "awsui_p-right-m_18wu0_1jubt_635",
-  "p-horizontal-m": "awsui_p-horizontal-m_18wu0_1jubt_636",
-  "p-bottom-m": "awsui_p-bottom-m_18wu0_1jubt_640",
-  "p-left-m": "awsui_p-left-m_18wu0_1jubt_645",
-  "p-l": "awsui_p-l_18wu0_1jubt_525",
-  "p-top-l": "awsui_p-top-l_18wu0_1jubt_654",
-  "p-vertical-l": "awsui_p-vertical-l_18wu0_1jubt_655",
-  "p-right-l": "awsui_p-right-l_18wu0_1jubt_659",
-  "p-horizontal-l": "awsui_p-horizontal-l_18wu0_1jubt_660",
-  "p-bottom-l": "awsui_p-bottom-l_18wu0_1jubt_664",
-  "p-left-l": "awsui_p-left-l_18wu0_1jubt_669",
-  "p-xl": "awsui_p-xl_18wu0_1jubt_674",
-  "p-top-xl": "awsui_p-top-xl_18wu0_1jubt_678",
-  "p-vertical-xl": "awsui_p-vertical-xl_18wu0_1jubt_679",
-  "p-right-xl": "awsui_p-right-xl_18wu0_1jubt_683",
-  "p-horizontal-xl": "awsui_p-horizontal-xl_18wu0_1jubt_684",
-  "p-bottom-xl": "awsui_p-bottom-xl_18wu0_1jubt_688",
-  "p-left-xl": "awsui_p-left-xl_18wu0_1jubt_693",
-  "p-xxl": "awsui_p-xxl_18wu0_1jubt_698",
-  "p-top-xxl": "awsui_p-top-xxl_18wu0_1jubt_702",
-  "p-vertical-xxl": "awsui_p-vertical-xxl_18wu0_1jubt_703",
-  "p-right-xxl": "awsui_p-right-xxl_18wu0_1jubt_707",
-  "p-horizontal-xxl": "awsui_p-horizontal-xxl_18wu0_1jubt_708",
-  "p-bottom-xxl": "awsui_p-bottom-xxl_18wu0_1jubt_712",
-  "p-left-xxl": "awsui_p-left-xxl_18wu0_1jubt_717",
-  "p-xxxl": "awsui_p-xxxl_18wu0_1jubt_722",
-  "p-top-xxxl": "awsui_p-top-xxxl_18wu0_1jubt_726",
-  "p-vertical-xxxl": "awsui_p-vertical-xxxl_18wu0_1jubt_727",
-  "p-right-xxxl": "awsui_p-right-xxxl_18wu0_1jubt_731",
-  "p-horizontal-xxxl": "awsui_p-horizontal-xxxl_18wu0_1jubt_732",
-  "p-bottom-xxxl": "awsui_p-bottom-xxxl_18wu0_1jubt_736",
-  "p-left-xxxl": "awsui_p-left-xxxl_18wu0_1jubt_741",
-  "m-n": "awsui_m-n_18wu0_1jubt_746",
-  "m-top-n": "awsui_m-top-n_18wu0_1jubt_750",
-  "m-vertical-n": "awsui_m-vertical-n_18wu0_1jubt_751",
-  "m-right-n": "awsui_m-right-n_18wu0_1jubt_755",
-  "m-horizontal-n": "awsui_m-horizontal-n_18wu0_1jubt_756",
-  "m-bottom-n": "awsui_m-bottom-n_18wu0_1jubt_760",
-  "m-left-n": "awsui_m-left-n_18wu0_1jubt_765",
-  "m-xxxs": "awsui_m-xxxs_18wu0_1jubt_770",
-  "m-top-xxxs": "awsui_m-top-xxxs_18wu0_1jubt_774",
-  "m-vertical-xxxs": "awsui_m-vertical-xxxs_18wu0_1jubt_775",
-  "m-right-xxxs": "awsui_m-right-xxxs_18wu0_1jubt_779",
-  "m-horizontal-xxxs": "awsui_m-horizontal-xxxs_18wu0_1jubt_780",
-  "m-bottom-xxxs": "awsui_m-bottom-xxxs_18wu0_1jubt_784",
-  "m-left-xxxs": "awsui_m-left-xxxs_18wu0_1jubt_789",
-  "m-xxs": "awsui_m-xxs_18wu0_1jubt_794",
-  "m-top-xxs": "awsui_m-top-xxs_18wu0_1jubt_798",
-  "m-vertical-xxs": "awsui_m-vertical-xxs_18wu0_1jubt_799",
-  "m-right-xxs": "awsui_m-right-xxs_18wu0_1jubt_803",
-  "m-horizontal-xxs": "awsui_m-horizontal-xxs_18wu0_1jubt_804",
-  "m-bottom-xxs": "awsui_m-bottom-xxs_18wu0_1jubt_808",
-  "m-left-xxs": "awsui_m-left-xxs_18wu0_1jubt_813",
-  "m-xs": "awsui_m-xs_18wu0_1jubt_818",
-  "m-top-xs": "awsui_m-top-xs_18wu0_1jubt_822",
-  "m-vertical-xs": "awsui_m-vertical-xs_18wu0_1jubt_823",
-  "m-right-xs": "awsui_m-right-xs_18wu0_1jubt_827",
-  "m-horizontal-xs": "awsui_m-horizontal-xs_18wu0_1jubt_828",
-  "m-bottom-xs": "awsui_m-bottom-xs_18wu0_1jubt_832",
-  "m-left-xs": "awsui_m-left-xs_18wu0_1jubt_837",
-  "m-s": "awsui_m-s_18wu0_1jubt_842",
-  "m-top-s": "awsui_m-top-s_18wu0_1jubt_846",
-  "m-vertical-s": "awsui_m-vertical-s_18wu0_1jubt_847",
-  "m-right-s": "awsui_m-right-s_18wu0_1jubt_851",
-  "m-horizontal-s": "awsui_m-horizontal-s_18wu0_1jubt_852",
-  "m-bottom-s": "awsui_m-bottom-s_18wu0_1jubt_856",
-  "m-left-s": "awsui_m-left-s_18wu0_1jubt_861",
-  "m-m": "awsui_m-m_18wu0_1jubt_866",
-  "m-top-m": "awsui_m-top-m_18wu0_1jubt_870",
-  "m-vertical-m": "awsui_m-vertical-m_18wu0_1jubt_871",
-  "m-right-m": "awsui_m-right-m_18wu0_1jubt_875",
-  "m-horizontal-m": "awsui_m-horizontal-m_18wu0_1jubt_876",
-  "m-bottom-m": "awsui_m-bottom-m_18wu0_1jubt_880",
-  "m-left-m": "awsui_m-left-m_18wu0_1jubt_885",
-  "m-l": "awsui_m-l_18wu0_1jubt_765",
-  "m-top-l": "awsui_m-top-l_18wu0_1jubt_894",
-  "m-vertical-l": "awsui_m-vertical-l_18wu0_1jubt_895",
-  "m-right-l": "awsui_m-right-l_18wu0_1jubt_899",
-  "m-horizontal-l": "awsui_m-horizontal-l_18wu0_1jubt_900",
-  "m-bottom-l": "awsui_m-bottom-l_18wu0_1jubt_904",
-  "m-left-l": "awsui_m-left-l_18wu0_1jubt_909",
-  "m-xl": "awsui_m-xl_18wu0_1jubt_914",
-  "m-top-xl": "awsui_m-top-xl_18wu0_1jubt_918",
-  "m-vertical-xl": "awsui_m-vertical-xl_18wu0_1jubt_919",
-  "m-right-xl": "awsui_m-right-xl_18wu0_1jubt_923",
-  "m-horizontal-xl": "awsui_m-horizontal-xl_18wu0_1jubt_924",
-  "m-bottom-xl": "awsui_m-bottom-xl_18wu0_1jubt_928",
-  "m-left-xl": "awsui_m-left-xl_18wu0_1jubt_933",
-  "m-xxl": "awsui_m-xxl_18wu0_1jubt_938",
-  "m-top-xxl": "awsui_m-top-xxl_18wu0_1jubt_942",
-  "m-vertical-xxl": "awsui_m-vertical-xxl_18wu0_1jubt_943",
-  "m-right-xxl": "awsui_m-right-xxl_18wu0_1jubt_947",
-  "m-horizontal-xxl": "awsui_m-horizontal-xxl_18wu0_1jubt_948",
-  "m-bottom-xxl": "awsui_m-bottom-xxl_18wu0_1jubt_952",
-  "m-left-xxl": "awsui_m-left-xxl_18wu0_1jubt_957",
-  "m-xxxl": "awsui_m-xxxl_18wu0_1jubt_962",
-  "m-top-xxxl": "awsui_m-top-xxxl_18wu0_1jubt_966",
-  "m-vertical-xxxl": "awsui_m-vertical-xxxl_18wu0_1jubt_967",
-  "m-right-xxxl": "awsui_m-right-xxxl_18wu0_1jubt_971",
-  "m-horizontal-xxxl": "awsui_m-horizontal-xxxl_18wu0_1jubt_972",
-  "m-bottom-xxxl": "awsui_m-bottom-xxxl_18wu0_1jubt_976",
-  "m-left-xxxl": "awsui_m-left-xxxl_18wu0_1jubt_981",
-  "d-block": "awsui_d-block_18wu0_1jubt_986",
-  "d-inline": "awsui_d-inline_18wu0_1jubt_989",
-  "d-inline-block": "awsui_d-inline-block_18wu0_1jubt_992",
-  "d-none": "awsui_d-none_18wu0_1jubt_995",
-  "f-left": "awsui_f-left_18wu0_1jubt_999",
-  "f-right": "awsui_f-right_18wu0_1jubt_1003"
+  "root": "awsui_root_18wu0_m97dv_93",
+  "box": "awsui_box_18wu0_m97dv_207",
+  "p-variant": "awsui_p-variant_18wu0_m97dv_207",
+  "color-default": "awsui_color-default_18wu0_m97dv_207",
+  "b-variant": "awsui_b-variant_18wu0_m97dv_207",
+  "strong-variant": "awsui_strong-variant_18wu0_m97dv_207",
+  "code-variant": "awsui_code-variant_18wu0_m97dv_207",
+  "pre-variant": "awsui_pre-variant_18wu0_m97dv_207",
+  "samp-variant": "awsui_samp-variant_18wu0_m97dv_207",
+  "h1-variant": "awsui_h1-variant_18wu0_m97dv_211",
+  "h2-variant": "awsui_h2-variant_18wu0_m97dv_211",
+  "h3-variant": "awsui_h3-variant_18wu0_m97dv_211",
+  "h4-variant": "awsui_h4-variant_18wu0_m97dv_211",
+  "h5-variant": "awsui_h5-variant_18wu0_m97dv_211",
+  "small-variant": "awsui_small-variant_18wu0_m97dv_215",
+  "a-variant": "awsui_a-variant_18wu0_m97dv_219",
+  "font-size-default": "awsui_font-size-default_18wu0_m97dv_223",
+  "font-weight-default": "awsui_font-weight-default_18wu0_m97dv_263",
+  "key-label-variant": "awsui_key-label-variant_18wu0_m97dv_303",
+  "value-large-variant": "awsui_value-large-variant_18wu0_m97dv_310",
+  "font-weight-heavy": "awsui_font-weight-heavy_18wu0_m97dv_317",
+  "color-inverted": "awsui_color-inverted_18wu0_m97dv_322",
+  "color-text-label": "awsui_color-text-label_18wu0_m97dv_325",
+  "color-text-body-secondary": "awsui_color-text-body-secondary_18wu0_m97dv_328",
+  "color-text-status-error": "awsui_color-text-status-error_18wu0_m97dv_331",
+  "color-text-status-success": "awsui_color-text-status-success_18wu0_m97dv_334",
+  "color-text-status-info": "awsui_color-text-status-info_18wu0_m97dv_337",
+  "color-text-status-inactive": "awsui_color-text-status-inactive_18wu0_m97dv_340",
+  "color-inherit": "awsui_color-inherit_18wu0_m97dv_343",
+  "font-size-body-s": "awsui_font-size-body-s_18wu0_m97dv_346",
+  "font-size-body-m": "awsui_font-size-body-m_18wu0_m97dv_351",
+  "font-size-heading-xs": "awsui_font-size-heading-xs_18wu0_m97dv_355",
+  "font-size-heading-s": "awsui_font-size-heading-s_18wu0_m97dv_359",
+  "font-size-heading-m": "awsui_font-size-heading-m_18wu0_m97dv_364",
+  "font-size-heading-l": "awsui_font-size-heading-l_18wu0_m97dv_369",
+  "font-size-heading-xl": "awsui_font-size-heading-xl_18wu0_m97dv_374",
+  "font-size-display-l": "awsui_font-size-display-l_18wu0_m97dv_379",
+  "font-weight-light": "awsui_font-weight-light_18wu0_m97dv_384",
+  "font-weight-normal": "awsui_font-weight-normal_18wu0_m97dv_387",
+  "font-weight-bold": "awsui_font-weight-bold_18wu0_m97dv_390",
+  "t-left": "awsui_t-left_18wu0_m97dv_397",
+  "t-right": "awsui_t-right_18wu0_m97dv_401",
+  "t-center": "awsui_t-center_18wu0_m97dv_405",
+  "p-n": "awsui_p-n_18wu0_m97dv_506",
+  "p-top-n": "awsui_p-top-n_18wu0_m97dv_510",
+  "p-vertical-n": "awsui_p-vertical-n_18wu0_m97dv_511",
+  "p-right-n": "awsui_p-right-n_18wu0_m97dv_515",
+  "p-horizontal-n": "awsui_p-horizontal-n_18wu0_m97dv_516",
+  "p-bottom-n": "awsui_p-bottom-n_18wu0_m97dv_520",
+  "p-left-n": "awsui_p-left-n_18wu0_m97dv_525",
+  "p-xxxs": "awsui_p-xxxs_18wu0_m97dv_530",
+  "p-top-xxxs": "awsui_p-top-xxxs_18wu0_m97dv_534",
+  "p-vertical-xxxs": "awsui_p-vertical-xxxs_18wu0_m97dv_535",
+  "p-right-xxxs": "awsui_p-right-xxxs_18wu0_m97dv_539",
+  "p-horizontal-xxxs": "awsui_p-horizontal-xxxs_18wu0_m97dv_540",
+  "p-bottom-xxxs": "awsui_p-bottom-xxxs_18wu0_m97dv_544",
+  "p-left-xxxs": "awsui_p-left-xxxs_18wu0_m97dv_549",
+  "p-xxs": "awsui_p-xxs_18wu0_m97dv_554",
+  "p-top-xxs": "awsui_p-top-xxs_18wu0_m97dv_558",
+  "p-vertical-xxs": "awsui_p-vertical-xxs_18wu0_m97dv_559",
+  "p-right-xxs": "awsui_p-right-xxs_18wu0_m97dv_563",
+  "p-horizontal-xxs": "awsui_p-horizontal-xxs_18wu0_m97dv_564",
+  "p-bottom-xxs": "awsui_p-bottom-xxs_18wu0_m97dv_568",
+  "p-left-xxs": "awsui_p-left-xxs_18wu0_m97dv_573",
+  "p-xs": "awsui_p-xs_18wu0_m97dv_578",
+  "p-top-xs": "awsui_p-top-xs_18wu0_m97dv_582",
+  "p-vertical-xs": "awsui_p-vertical-xs_18wu0_m97dv_583",
+  "p-right-xs": "awsui_p-right-xs_18wu0_m97dv_587",
+  "p-horizontal-xs": "awsui_p-horizontal-xs_18wu0_m97dv_588",
+  "p-bottom-xs": "awsui_p-bottom-xs_18wu0_m97dv_592",
+  "p-left-xs": "awsui_p-left-xs_18wu0_m97dv_597",
+  "p-s": "awsui_p-s_18wu0_m97dv_602",
+  "p-top-s": "awsui_p-top-s_18wu0_m97dv_606",
+  "p-vertical-s": "awsui_p-vertical-s_18wu0_m97dv_607",
+  "p-right-s": "awsui_p-right-s_18wu0_m97dv_611",
+  "p-horizontal-s": "awsui_p-horizontal-s_18wu0_m97dv_612",
+  "p-bottom-s": "awsui_p-bottom-s_18wu0_m97dv_616",
+  "p-left-s": "awsui_p-left-s_18wu0_m97dv_621",
+  "p-m": "awsui_p-m_18wu0_m97dv_626",
+  "p-top-m": "awsui_p-top-m_18wu0_m97dv_630",
+  "p-vertical-m": "awsui_p-vertical-m_18wu0_m97dv_631",
+  "p-right-m": "awsui_p-right-m_18wu0_m97dv_635",
+  "p-horizontal-m": "awsui_p-horizontal-m_18wu0_m97dv_636",
+  "p-bottom-m": "awsui_p-bottom-m_18wu0_m97dv_640",
+  "p-left-m": "awsui_p-left-m_18wu0_m97dv_645",
+  "p-l": "awsui_p-l_18wu0_m97dv_525",
+  "p-top-l": "awsui_p-top-l_18wu0_m97dv_654",
+  "p-vertical-l": "awsui_p-vertical-l_18wu0_m97dv_655",
+  "p-right-l": "awsui_p-right-l_18wu0_m97dv_659",
+  "p-horizontal-l": "awsui_p-horizontal-l_18wu0_m97dv_660",
+  "p-bottom-l": "awsui_p-bottom-l_18wu0_m97dv_664",
+  "p-left-l": "awsui_p-left-l_18wu0_m97dv_669",
+  "p-xl": "awsui_p-xl_18wu0_m97dv_674",
+  "p-top-xl": "awsui_p-top-xl_18wu0_m97dv_678",
+  "p-vertical-xl": "awsui_p-vertical-xl_18wu0_m97dv_679",
+  "p-right-xl": "awsui_p-right-xl_18wu0_m97dv_683",
+  "p-horizontal-xl": "awsui_p-horizontal-xl_18wu0_m97dv_684",
+  "p-bottom-xl": "awsui_p-bottom-xl_18wu0_m97dv_688",
+  "p-left-xl": "awsui_p-left-xl_18wu0_m97dv_693",
+  "p-xxl": "awsui_p-xxl_18wu0_m97dv_698",
+  "p-top-xxl": "awsui_p-top-xxl_18wu0_m97dv_702",
+  "p-vertical-xxl": "awsui_p-vertical-xxl_18wu0_m97dv_703",
+  "p-right-xxl": "awsui_p-right-xxl_18wu0_m97dv_707",
+  "p-horizontal-xxl": "awsui_p-horizontal-xxl_18wu0_m97dv_708",
+  "p-bottom-xxl": "awsui_p-bottom-xxl_18wu0_m97dv_712",
+  "p-left-xxl": "awsui_p-left-xxl_18wu0_m97dv_717",
+  "p-xxxl": "awsui_p-xxxl_18wu0_m97dv_722",
+  "p-top-xxxl": "awsui_p-top-xxxl_18wu0_m97dv_726",
+  "p-vertical-xxxl": "awsui_p-vertical-xxxl_18wu0_m97dv_727",
+  "p-right-xxxl": "awsui_p-right-xxxl_18wu0_m97dv_731",
+  "p-horizontal-xxxl": "awsui_p-horizontal-xxxl_18wu0_m97dv_732",
+  "p-bottom-xxxl": "awsui_p-bottom-xxxl_18wu0_m97dv_736",
+  "p-left-xxxl": "awsui_p-left-xxxl_18wu0_m97dv_741",
+  "m-n": "awsui_m-n_18wu0_m97dv_746",
+  "m-top-n": "awsui_m-top-n_18wu0_m97dv_750",
+  "m-vertical-n": "awsui_m-vertical-n_18wu0_m97dv_751",
+  "m-right-n": "awsui_m-right-n_18wu0_m97dv_755",
+  "m-horizontal-n": "awsui_m-horizontal-n_18wu0_m97dv_756",
+  "m-bottom-n": "awsui_m-bottom-n_18wu0_m97dv_760",
+  "m-left-n": "awsui_m-left-n_18wu0_m97dv_765",
+  "m-xxxs": "awsui_m-xxxs_18wu0_m97dv_770",
+  "m-top-xxxs": "awsui_m-top-xxxs_18wu0_m97dv_774",
+  "m-vertical-xxxs": "awsui_m-vertical-xxxs_18wu0_m97dv_775",
+  "m-right-xxxs": "awsui_m-right-xxxs_18wu0_m97dv_779",
+  "m-horizontal-xxxs": "awsui_m-horizontal-xxxs_18wu0_m97dv_780",
+  "m-bottom-xxxs": "awsui_m-bottom-xxxs_18wu0_m97dv_784",
+  "m-left-xxxs": "awsui_m-left-xxxs_18wu0_m97dv_789",
+  "m-xxs": "awsui_m-xxs_18wu0_m97dv_794",
+  "m-top-xxs": "awsui_m-top-xxs_18wu0_m97dv_798",
+  "m-vertical-xxs": "awsui_m-vertical-xxs_18wu0_m97dv_799",
+  "m-right-xxs": "awsui_m-right-xxs_18wu0_m97dv_803",
+  "m-horizontal-xxs": "awsui_m-horizontal-xxs_18wu0_m97dv_804",
+  "m-bottom-xxs": "awsui_m-bottom-xxs_18wu0_m97dv_808",
+  "m-left-xxs": "awsui_m-left-xxs_18wu0_m97dv_813",
+  "m-xs": "awsui_m-xs_18wu0_m97dv_818",
+  "m-top-xs": "awsui_m-top-xs_18wu0_m97dv_822",
+  "m-vertical-xs": "awsui_m-vertical-xs_18wu0_m97dv_823",
+  "m-right-xs": "awsui_m-right-xs_18wu0_m97dv_827",
+  "m-horizontal-xs": "awsui_m-horizontal-xs_18wu0_m97dv_828",
+  "m-bottom-xs": "awsui_m-bottom-xs_18wu0_m97dv_832",
+  "m-left-xs": "awsui_m-left-xs_18wu0_m97dv_837",
+  "m-s": "awsui_m-s_18wu0_m97dv_842",
+  "m-top-s": "awsui_m-top-s_18wu0_m97dv_846",
+  "m-vertical-s": "awsui_m-vertical-s_18wu0_m97dv_847",
+  "m-right-s": "awsui_m-right-s_18wu0_m97dv_851",
+  "m-horizontal-s": "awsui_m-horizontal-s_18wu0_m97dv_852",
+  "m-bottom-s": "awsui_m-bottom-s_18wu0_m97dv_856",
+  "m-left-s": "awsui_m-left-s_18wu0_m97dv_861",
+  "m-m": "awsui_m-m_18wu0_m97dv_866",
+  "m-top-m": "awsui_m-top-m_18wu0_m97dv_870",
+  "m-vertical-m": "awsui_m-vertical-m_18wu0_m97dv_871",
+  "m-right-m": "awsui_m-right-m_18wu0_m97dv_875",
+  "m-horizontal-m": "awsui_m-horizontal-m_18wu0_m97dv_876",
+  "m-bottom-m": "awsui_m-bottom-m_18wu0_m97dv_880",
+  "m-left-m": "awsui_m-left-m_18wu0_m97dv_885",
+  "m-l": "awsui_m-l_18wu0_m97dv_765",
+  "m-top-l": "awsui_m-top-l_18wu0_m97dv_894",
+  "m-vertical-l": "awsui_m-vertical-l_18wu0_m97dv_895",
+  "m-right-l": "awsui_m-right-l_18wu0_m97dv_899",
+  "m-horizontal-l": "awsui_m-horizontal-l_18wu0_m97dv_900",
+  "m-bottom-l": "awsui_m-bottom-l_18wu0_m97dv_904",
+  "m-left-l": "awsui_m-left-l_18wu0_m97dv_909",
+  "m-xl": "awsui_m-xl_18wu0_m97dv_914",
+  "m-top-xl": "awsui_m-top-xl_18wu0_m97dv_918",
+  "m-vertical-xl": "awsui_m-vertical-xl_18wu0_m97dv_919",
+  "m-right-xl": "awsui_m-right-xl_18wu0_m97dv_923",
+  "m-horizontal-xl": "awsui_m-horizontal-xl_18wu0_m97dv_924",
+  "m-bottom-xl": "awsui_m-bottom-xl_18wu0_m97dv_928",
+  "m-left-xl": "awsui_m-left-xl_18wu0_m97dv_933",
+  "m-xxl": "awsui_m-xxl_18wu0_m97dv_938",
+  "m-top-xxl": "awsui_m-top-xxl_18wu0_m97dv_942",
+  "m-vertical-xxl": "awsui_m-vertical-xxl_18wu0_m97dv_943",
+  "m-right-xxl": "awsui_m-right-xxl_18wu0_m97dv_947",
+  "m-horizontal-xxl": "awsui_m-horizontal-xxl_18wu0_m97dv_948",
+  "m-bottom-xxl": "awsui_m-bottom-xxl_18wu0_m97dv_952",
+  "m-left-xxl": "awsui_m-left-xxl_18wu0_m97dv_957",
+  "m-xxxl": "awsui_m-xxxl_18wu0_m97dv_962",
+  "m-top-xxxl": "awsui_m-top-xxxl_18wu0_m97dv_966",
+  "m-vertical-xxxl": "awsui_m-vertical-xxxl_18wu0_m97dv_967",
+  "m-right-xxxl": "awsui_m-right-xxxl_18wu0_m97dv_971",
+  "m-horizontal-xxxl": "awsui_m-horizontal-xxxl_18wu0_m97dv_972",
+  "m-bottom-xxxl": "awsui_m-bottom-xxxl_18wu0_m97dv_976",
+  "m-left-xxxl": "awsui_m-left-xxxl_18wu0_m97dv_981",
+  "d-block": "awsui_d-block_18wu0_m97dv_986",
+  "d-inline": "awsui_d-inline_18wu0_m97dv_989",
+  "d-inline-block": "awsui_d-inline-block_18wu0_m97dv_992",
+  "d-none": "awsui_d-none_18wu0_m97dv_995",
+  "f-left": "awsui_f-left_18wu0_m97dv_999",
+  "f-right": "awsui_f-right_18wu0_m97dv_1003"
 };