@cloudscape-design/components 3.0.337 → 3.0.339
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/alert/index.d.ts.map +1 -1
- package/alert/index.js +36 -1
- package/alert/index.js.map +1 -1
- package/app-layout/styles.css.js +17 -17
- package/app-layout/styles.scoped.css +21 -21
- package/app-layout/styles.selectors.js +17 -17
- package/app-layout/visual-refresh/styles.css.js +69 -69
- package/app-layout/visual-refresh/styles.scoped.css +173 -169
- package/app-layout/visual-refresh/styles.selectors.js +69 -69
- package/area-chart/chart-container.d.ts +2 -2
- package/area-chart/chart-container.d.ts.map +1 -1
- package/area-chart/chart-container.js +1 -1
- package/area-chart/chart-container.js.map +1 -1
- package/area-chart/interfaces.d.ts +5 -1
- package/area-chart/interfaces.d.ts.map +1 -1
- package/area-chart/interfaces.js.map +1 -1
- package/area-chart/internal.d.ts +1 -1
- package/area-chart/internal.d.ts.map +1 -1
- package/area-chart/internal.js +2 -2
- package/area-chart/internal.js.map +1 -1
- package/attribute-editor/interfaces.d.ts +7 -0
- package/attribute-editor/interfaces.d.ts.map +1 -1
- package/attribute-editor/interfaces.js.map +1 -1
- package/attribute-editor/internal.d.ts.map +1 -1
- package/attribute-editor/internal.js +2 -2
- package/attribute-editor/internal.js.map +1 -1
- package/attribute-editor/row.d.ts +3 -2
- package/attribute-editor/row.d.ts.map +1 -1
- package/attribute-editor/row.js +2 -2
- package/attribute-editor/row.js.map +1 -1
- package/box/styles.css.js +189 -189
- package/box/styles.scoped.css +257 -257
- package/box/styles.selectors.js +189 -189
- package/button/styles.css.js +20 -20
- package/button/styles.scoped.css +154 -154
- package/button/styles.selectors.js +20 -20
- package/button-dropdown/category-elements/styles.css.js +13 -13
- package/button-dropdown/category-elements/styles.scoped.css +25 -25
- package/button-dropdown/category-elements/styles.selectors.js +13 -13
- package/button-dropdown/item-element/styles.css.js +14 -14
- package/button-dropdown/item-element/styles.scoped.css +20 -20
- package/button-dropdown/item-element/styles.selectors.js +14 -14
- package/cards/styles.css.js +38 -38
- package/cards/styles.scoped.css +57 -62
- package/cards/styles.selectors.js +38 -38
- package/container/styles.css.js +28 -28
- package/container/styles.scoped.css +57 -54
- package/container/styles.selectors.js +28 -28
- package/content-layout/styles.css.js +7 -7
- package/content-layout/styles.scoped.css +13 -13
- package/content-layout/styles.selectors.js +7 -7
- package/expandable-section/styles.css.js +29 -29
- package/expandable-section/styles.scoped.css +61 -61
- package/expandable-section/styles.selectors.js +29 -29
- package/flashbar/styles.css.js +46 -46
- package/flashbar/styles.scoped.css +146 -146
- package/flashbar/styles.selectors.js +46 -46
- package/form-field/internal.js +3 -2
- package/form-field/internal.js.map +1 -1
- package/header/internal.d.ts.map +1 -1
- package/header/internal.js +5 -5
- package/header/internal.js.map +1 -1
- package/header/styles.css.js +33 -44
- package/header/styles.scoped.css +85 -91
- package/header/styles.selectors.js +33 -44
- package/help-panel/styles.css.js +4 -4
- package/help-panel/styles.scoped.css +80 -80
- package/help-panel/styles.selectors.js +4 -4
- package/icon/styles.css.js +21 -21
- package/icon/styles.scoped.css +54 -54
- package/icon/styles.selectors.js +21 -21
- package/internal/analytics/components/analytics-funnel.d.ts.map +1 -1
- package/internal/analytics/components/analytics-funnel.js +16 -15
- package/internal/analytics/components/analytics-funnel.js.map +1 -1
- package/internal/analytics/context/analytics-context.d.ts +6 -7
- package/internal/analytics/context/analytics-context.d.ts.map +1 -1
- package/internal/analytics/context/analytics-context.js +2 -6
- package/internal/analytics/context/analytics-context.js.map +1 -1
- package/internal/analytics/hooks/use-funnel.d.ts +4 -7
- package/internal/analytics/hooks/use-funnel.d.ts.map +1 -1
- package/internal/analytics/hooks/use-funnel.js +10 -8
- package/internal/analytics/hooks/use-funnel.js.map +1 -1
- package/internal/base-component/styles.scoped.css +45 -35
- package/internal/components/button-trigger/index.d.ts +2 -1
- package/internal/components/button-trigger/index.d.ts.map +1 -1
- package/internal/components/button-trigger/index.js +2 -2
- package/internal/components/button-trigger/index.js.map +1 -1
- package/internal/components/cartesian-chart/interfaces.d.ts +10 -2
- package/internal/components/cartesian-chart/interfaces.d.ts.map +1 -1
- package/internal/components/cartesian-chart/interfaces.js.map +1 -1
- package/internal/components/dropdown/index.d.ts +1 -1
- package/internal/components/dropdown/index.d.ts.map +1 -1
- package/internal/components/dropdown/index.js +4 -4
- package/internal/components/dropdown/index.js.map +1 -1
- package/internal/components/dropdown/interfaces.d.ts +8 -0
- package/internal/components/dropdown/interfaces.d.ts.map +1 -1
- package/internal/components/dropdown/interfaces.js.map +1 -1
- package/internal/components/menu-dropdown/styles.css.js +7 -7
- package/internal/components/menu-dropdown/styles.scoped.css +14 -14
- package/internal/components/menu-dropdown/styles.selectors.js +7 -7
- package/internal/environment.js +1 -1
- package/internal/generated/theming/index.cjs +153 -120
- package/internal/generated/theming/index.js +153 -120
- package/internal/manifest.json +1 -1
- package/link/internal.d.ts.map +1 -1
- package/link/internal.js +3 -2
- package/link/internal.js.map +1 -1
- package/link/styles.css.js +20 -20
- package/link/styles.scoped.css +83 -83
- package/link/styles.selectors.js +20 -20
- package/mixed-line-bar-chart/internal.d.ts +1 -1
- package/mixed-line-bar-chart/internal.d.ts.map +1 -1
- package/mixed-line-bar-chart/internal.js +2 -2
- package/mixed-line-bar-chart/internal.js.map +1 -1
- package/modal/styles.css.js +23 -23
- package/modal/styles.scoped.css +40 -40
- package/modal/styles.selectors.js +23 -23
- package/package.json +1 -1
- package/pagination/styles.css.js +9 -9
- package/pagination/styles.scoped.css +24 -24
- package/pagination/styles.selectors.js +9 -9
- package/popover/styles.css.js +50 -50
- package/popover/styles.scoped.css +65 -65
- package/popover/styles.selectors.js +50 -50
- package/property-filter/index.d.ts.map +1 -1
- package/property-filter/index.js +4 -3
- package/property-filter/index.js.map +1 -1
- package/property-filter/interfaces.d.ts +16 -5
- package/property-filter/interfaces.d.ts.map +1 -1
- package/property-filter/interfaces.js.map +1 -1
- package/s3-resource-selector/index.d.ts.map +1 -1
- package/s3-resource-selector/index.js +2 -2
- package/s3-resource-selector/index.js.map +1 -1
- package/s3-resource-selector/interfaces.d.ts +7 -0
- package/s3-resource-selector/interfaces.d.ts.map +1 -1
- package/s3-resource-selector/interfaces.js.map +1 -1
- package/s3-resource-selector/s3-in-context/index.d.ts +1 -0
- package/s3-resource-selector/s3-in-context/index.d.ts.map +1 -1
- package/s3-resource-selector/s3-in-context/index.js +2 -2
- package/s3-resource-selector/s3-in-context/index.js.map +1 -1
- package/segmented-control/styles.css.js +14 -14
- package/segmented-control/styles.scoped.css +35 -35
- package/segmented-control/styles.selectors.js +14 -14
- package/select/utils/use-select.d.ts +5 -7
- package/select/utils/use-select.d.ts.map +1 -1
- package/select/utils/use-select.js +6 -0
- package/select/utils/use-select.js.map +1 -1
- package/side-navigation/styles.css.js +28 -28
- package/side-navigation/styles.scoped.css +49 -49
- package/side-navigation/styles.selectors.js +28 -28
- package/spinner/styles.css.js +13 -13
- package/spinner/styles.scoped.css +22 -22
- package/spinner/styles.selectors.js +13 -13
- package/split-panel/styles.css.js +56 -56
- package/split-panel/styles.scoped.css +80 -80
- package/split-panel/styles.selectors.js +56 -56
- package/table/body-cell/index.d.ts.map +1 -1
- package/table/body-cell/index.js +22 -3
- package/table/body-cell/index.js.map +1 -1
- package/table/body-cell/styles.css.js +28 -28
- package/table/body-cell/styles.scoped.css +93 -77
- package/table/body-cell/styles.selectors.js +28 -28
- package/table/header-cell/styles.css.js +24 -24
- package/table/header-cell/styles.scoped.css +41 -41
- package/table/header-cell/styles.selectors.js +24 -24
- package/table/styles.css.js +34 -34
- package/table/styles.scoped.css +45 -52
- package/table/styles.selectors.js +34 -34
- package/tabs/styles.css.js +21 -21
- package/tabs/styles.scoped.css +41 -41
- package/tabs/styles.selectors.js +21 -21
- package/tag-editor/styles.css.js +3 -3
- package/tag-editor/styles.scoped.css +11 -11
- package/tag-editor/styles.selectors.js +3 -3
- package/text-content/styles.css.js +1 -1
- package/text-content/styles.scoped.css +71 -71
- package/text-content/styles.selectors.js +1 -1
- package/top-navigation/1.0-beta/styles.css.js +25 -25
- package/top-navigation/1.0-beta/styles.scoped.css +45 -45
- package/top-navigation/1.0-beta/styles.selectors.js +25 -25
- package/top-navigation/styles.css.js +47 -47
- package/top-navigation/styles.scoped.css +74 -74
- package/top-navigation/styles.selectors.js +47 -47
- package/tutorial-panel/components/tutorial-detail-view/styles.css.js +20 -20
- package/tutorial-panel/components/tutorial-detail-view/styles.scoped.css +22 -22
- package/tutorial-panel/components/tutorial-detail-view/styles.selectors.js +20 -20
- package/wizard/interfaces.d.ts +10 -3
- package/wizard/interfaces.d.ts.map +1 -1
- package/wizard/interfaces.js.map +1 -1
- package/wizard/internal.d.ts +1 -1
- package/wizard/internal.d.ts.map +1 -1
- package/wizard/internal.js +5 -5
- package/wizard/internal.js.map +1 -1
- package/wizard/wizard-form.d.ts +2 -1
- package/wizard/wizard-form.d.ts.map +1 -1
- package/wizard/wizard-form.js +2 -2
- package/wizard/wizard-form.js.map +1 -1
|
@@ -2,51 +2,51 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"flash-with-motion": "awsui_flash-with-
|
|
6
|
-
"enter": "
|
|
7
|
-
"flash-body": "awsui_flash-
|
|
8
|
-
"flash-message": "awsui_flash-
|
|
9
|
-
"flash-header": "awsui_flash-
|
|
10
|
-
"flash-content": "awsui_flash-
|
|
11
|
-
"action-button-wrapper": "awsui_action-button-
|
|
12
|
-
"dismiss-button-wrapper": "awsui_dismiss-button-
|
|
13
|
-
"flash-icon": "awsui_flash-
|
|
14
|
-
"entering": "
|
|
15
|
-
"entered": "
|
|
16
|
-
"exiting": "
|
|
17
|
-
"stack": "
|
|
18
|
-
"animation-running": "awsui_animation-
|
|
19
|
-
"item": "
|
|
20
|
-
"flash-list-item": "awsui_flash-list-
|
|
21
|
-
"notification-bar": "awsui_notification-
|
|
22
|
-
"collapsed": "
|
|
23
|
-
"animation-ready": "awsui_animation-
|
|
24
|
-
"expanded-only": "awsui_expanded-
|
|
25
|
-
"expanded": "
|
|
26
|
-
"flash": "
|
|
27
|
-
"collapsible": "
|
|
28
|
-
"short-list": "awsui_short-
|
|
29
|
-
"visual-refresh": "awsui_visual-
|
|
30
|
-
"status": "
|
|
31
|
-
"header": "
|
|
32
|
-
"item-count": "awsui_item-
|
|
33
|
-
"button": "
|
|
34
|
-
"type-count": "awsui_type-
|
|
35
|
-
"count-number": "awsui_count-
|
|
36
|
-
"icon": "
|
|
37
|
-
"floating": "
|
|
38
|
-
"flashbar": "
|
|
39
|
-
"flash-refresh": "awsui_flash-
|
|
40
|
-
"flash-list": "awsui_flash-
|
|
41
|
-
"flash-focus-container": "awsui_flash-focus-
|
|
42
|
-
"flash-text": "awsui_flash-
|
|
43
|
-
"dismiss-button": "awsui_dismiss-
|
|
44
|
-
"breakpoint-default": "awsui_breakpoint-
|
|
45
|
-
"action-button": "awsui_action-
|
|
46
|
-
"flash-type-success": "awsui_flash-type-
|
|
47
|
-
"flash-type-error": "awsui_flash-type-
|
|
48
|
-
"flash-type-info": "awsui_flash-type-
|
|
49
|
-
"flash-type-in-progress": "awsui_flash-type-in-
|
|
50
|
-
"flash-type-warning": "awsui_flash-type-
|
|
5
|
+
"flash-with-motion": "awsui_flash-with-motion_1q84n_15ujq_93",
|
|
6
|
+
"enter": "awsui_enter_1q84n_15ujq_93",
|
|
7
|
+
"flash-body": "awsui_flash-body_1q84n_15ujq_107",
|
|
8
|
+
"flash-message": "awsui_flash-message_1q84n_15ujq_107",
|
|
9
|
+
"flash-header": "awsui_flash-header_1q84n_15ujq_107",
|
|
10
|
+
"flash-content": "awsui_flash-content_1q84n_15ujq_108",
|
|
11
|
+
"action-button-wrapper": "awsui_action-button-wrapper_1q84n_15ujq_109",
|
|
12
|
+
"dismiss-button-wrapper": "awsui_dismiss-button-wrapper_1q84n_15ujq_110",
|
|
13
|
+
"flash-icon": "awsui_flash-icon_1q84n_15ujq_133",
|
|
14
|
+
"entering": "awsui_entering_1q84n_15ujq_146",
|
|
15
|
+
"entered": "awsui_entered_1q84n_15ujq_167",
|
|
16
|
+
"exiting": "awsui_exiting_1q84n_15ujq_272",
|
|
17
|
+
"stack": "awsui_stack_1q84n_15ujq_294",
|
|
18
|
+
"animation-running": "awsui_animation-running_1q84n_15ujq_294",
|
|
19
|
+
"item": "awsui_item_1q84n_15ujq_294",
|
|
20
|
+
"flash-list-item": "awsui_flash-list-item_1q84n_15ujq_295",
|
|
21
|
+
"notification-bar": "awsui_notification-bar_1q84n_15ujq_296",
|
|
22
|
+
"collapsed": "awsui_collapsed_1q84n_15ujq_316",
|
|
23
|
+
"animation-ready": "awsui_animation-ready_1q84n_15ujq_316",
|
|
24
|
+
"expanded-only": "awsui_expanded-only_1q84n_15ujq_316",
|
|
25
|
+
"expanded": "awsui_expanded_1q84n_15ujq_316",
|
|
26
|
+
"flash": "awsui_flash_1q84n_15ujq_93",
|
|
27
|
+
"collapsible": "awsui_collapsible_1q84n_15ujq_380",
|
|
28
|
+
"short-list": "awsui_short-list_1q84n_15ujq_386",
|
|
29
|
+
"visual-refresh": "awsui_visual-refresh_1q84n_15ujq_386",
|
|
30
|
+
"status": "awsui_status_1q84n_15ujq_603",
|
|
31
|
+
"header": "awsui_header_1q84n_15ujq_603",
|
|
32
|
+
"item-count": "awsui_item-count_1q84n_15ujq_604",
|
|
33
|
+
"button": "awsui_button_1q84n_15ujq_605",
|
|
34
|
+
"type-count": "awsui_type-count_1q84n_15ujq_640",
|
|
35
|
+
"count-number": "awsui_count-number_1q84n_15ujq_640",
|
|
36
|
+
"icon": "awsui_icon_1q84n_15ujq_674",
|
|
37
|
+
"floating": "awsui_floating_1q84n_15ujq_712",
|
|
38
|
+
"flashbar": "awsui_flashbar_1q84n_15ujq_720",
|
|
39
|
+
"flash-refresh": "awsui_flash-refresh_1q84n_15ujq_766",
|
|
40
|
+
"flash-list": "awsui_flash-list_1q84n_15ujq_295",
|
|
41
|
+
"flash-focus-container": "awsui_flash-focus-container_1q84n_15ujq_785",
|
|
42
|
+
"flash-text": "awsui_flash-text_1q84n_15ujq_812",
|
|
43
|
+
"dismiss-button": "awsui_dismiss-button_1q84n_15ujq_110",
|
|
44
|
+
"breakpoint-default": "awsui_breakpoint-default_1q84n_15ujq_853",
|
|
45
|
+
"action-button": "awsui_action-button_1q84n_15ujq_109",
|
|
46
|
+
"flash-type-success": "awsui_flash-type-success_1q84n_15ujq_866",
|
|
47
|
+
"flash-type-error": "awsui_flash-type-error_1q84n_15ujq_870",
|
|
48
|
+
"flash-type-info": "awsui_flash-type-info_1q84n_15ujq_874",
|
|
49
|
+
"flash-type-in-progress": "awsui_flash-type-in-progress_1q84n_15ujq_875",
|
|
50
|
+
"flash-type-warning": "awsui_flash-type-warning_1q84n_15ujq_876"
|
|
51
51
|
};
|
|
52
52
|
|
package/form-field/internal.js
CHANGED
|
@@ -15,7 +15,7 @@ import { joinStrings } from '../internal/utils/strings';
|
|
|
15
15
|
import { useInternalI18n } from '../internal/i18n/context';
|
|
16
16
|
import { InfoLinkLabelContext } from '../internal/context/info-link-label-context';
|
|
17
17
|
import { FunnelMetrics } from '../internal/analytics';
|
|
18
|
-
import { useFunnel, useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';
|
|
18
|
+
import { useFunnel, useFunnelStep, useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';
|
|
19
19
|
import { DATA_ATTR_FIELD_ERROR, DATA_ATTR_FIELD_LABEL, getFieldSlotSeletor, getNameFromSelector, getSubStepAllSelector, } from '../internal/analytics/selectors';
|
|
20
20
|
export function FormFieldError({ id, children, errorIconAriaLabel }) {
|
|
21
21
|
const i18n = useInternalI18n('form-field');
|
|
@@ -36,7 +36,8 @@ export default function InternalFormField(_a) {
|
|
|
36
36
|
const generatedControlId = controlId || instanceUniqueId;
|
|
37
37
|
const formFieldId = controlId || generatedControlId;
|
|
38
38
|
const { funnelInteractionId, submissionAttempt, funnelState, errorCount } = useFunnel();
|
|
39
|
-
const { stepNumber, stepNameSelector
|
|
39
|
+
const { stepNumber, stepNameSelector } = useFunnelStep();
|
|
40
|
+
const { subStepSelector, subStepNameSelector } = useFunnelSubStep();
|
|
40
41
|
const slotIds = getSlotIds(formFieldId, label, description, constraintText, errorText);
|
|
41
42
|
const ariaDescribedBy = getAriaDescribedBy(slotIds);
|
|
42
43
|
const gridDefinition = getGridDefinition(stretch, !!secondaryControl, isRefresh);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["form-field/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect } from 'react';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../internal/base-component';\nimport { FormFieldContext, useFormFieldContext } from '../internal/context/form-field-context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\n\nimport InternalGrid from '../grid/internal';\nimport InternalIcon from '../icon/internal';\nimport { getAriaDescribedBy, getGridDefinition, getSlotIds } from './util';\n\nimport styles from './styles.css.js';\nimport { InternalFormFieldProps } from './interfaces';\nimport { joinStrings } from '../internal/utils/strings';\nimport { useInternalI18n } from '../internal/i18n/context';\nimport { InfoLinkLabelContext } from '../internal/context/info-link-label-context';\n\nimport { FunnelMetrics } from '../internal/analytics';\nimport { useFunnel, useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport {\n DATA_ATTR_FIELD_ERROR,\n DATA_ATTR_FIELD_LABEL,\n getFieldSlotSeletor,\n getNameFromSelector,\n getSubStepAllSelector,\n} from '../internal/analytics/selectors';\n\ninterface FormFieldErrorProps {\n id?: string;\n children?: React.ReactNode;\n errorIconAriaLabel?: string;\n}\n\nexport function FormFieldError({ id, children, errorIconAriaLabel }: FormFieldErrorProps) {\n const i18n = useInternalI18n('form-field');\n\n return (\n <div id={id} className={styles.error}>\n <div className={styles['error-icon-shake-wrapper']}>\n <div\n role=\"img\"\n aria-label={i18n('i18nStrings.errorIconAriaLabel', errorIconAriaLabel)}\n className={styles['error-icon-scale-wrapper']}\n >\n <InternalIcon name=\"status-warning\" size=\"small\" />\n </div>\n </div>\n <span className={styles.error__message}>{children}</span>\n </div>\n );\n}\n\nexport function ConstraintText({\n id,\n hasError,\n children,\n}: {\n id?: string;\n hasError: boolean;\n children: React.ReactNode;\n}) {\n return (\n <div id={id} className={clsx(styles.constraint, hasError && styles['constraint-has-error'])}>\n {children}\n </div>\n );\n}\n\nexport default function InternalFormField({\n controlId,\n stretch = false,\n label,\n info,\n i18nStrings,\n children,\n secondaryControl,\n description,\n constraintText,\n errorText,\n __hideLabel,\n __internalRootRef = null,\n __disableGutters = false,\n ...rest\n}: InternalFormFieldProps) {\n const baseProps = getBaseProps(rest);\n const isRefresh = useVisualRefresh();\n\n const instanceUniqueId = useUniqueId('formField');\n const generatedControlId = controlId || instanceUniqueId;\n const formFieldId = controlId || generatedControlId;\n\n const { funnelInteractionId, submissionAttempt, funnelState, errorCount } = useFunnel();\n\n const { stepNumber, stepNameSelector, subStepSelector, subStepNameSelector } = useFunnelSubStep();\n\n const slotIds = getSlotIds(formFieldId, label, description, constraintText, errorText);\n\n const ariaDescribedBy = getAriaDescribedBy(slotIds);\n\n const gridDefinition = getGridDefinition(stretch, !!secondaryControl, isRefresh);\n\n const {\n ariaLabelledby: parentAriaLabelledby,\n ariaDescribedby: parentAriaDescribedby,\n invalid: parentInvalid,\n } = useFormFieldContext({});\n\n const contextValuesWithoutControlId = {\n ariaLabelledby: joinStrings(parentAriaLabelledby, slotIds.label) || undefined,\n ariaDescribedby: joinStrings(parentAriaDescribedby, ariaDescribedBy) || undefined,\n invalid: !!errorText || !!parentInvalid,\n };\n\n const analyticsAttributes = {\n [DATA_ATTR_FIELD_LABEL]: slotIds.label ? getFieldSlotSeletor(slotIds.label) : undefined,\n [DATA_ATTR_FIELD_ERROR]: slotIds.error ? getFieldSlotSeletor(slotIds.error) : undefined,\n };\n\n useEffect(() => {\n if (funnelInteractionId && errorText && funnelState.current !== 'complete') {\n const stepName = getNameFromSelector(stepNameSelector);\n const subStepName = getNameFromSelector(subStepNameSelector);\n\n errorCount.current++;\n\n FunnelMetrics.funnelSubStepError({\n funnelInteractionId,\n subStepSelector,\n subStepName,\n subStepNameSelector,\n stepNumber,\n stepName,\n stepNameSelector,\n fieldErrorSelector: getFieldSlotSeletor(slotIds.error),\n fieldLabelSelector: getFieldSlotSeletor(slotIds.label),\n subStepAllSelector: getSubStepAllSelector(),\n });\n\n return () => {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n errorCount.current--;\n };\n }\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [funnelInteractionId, errorText, submissionAttempt, errorCount]);\n\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.root)}\n ref={__internalRootRef}\n {...analyticsAttributes}\n >\n <div className={clsx(__hideLabel && styles['visually-hidden'])}>\n {label && (\n <label className={styles.label} id={slotIds.label} htmlFor={generatedControlId}>\n {label}\n </label>\n )}\n <InfoLinkLabelContext.Provider value={slotIds.label}>\n {!__hideLabel && info && <span className={styles.info}>{info}</span>}\n </InfoLinkLabelContext.Provider>\n </div>\n\n {description && (\n <div className={styles.description} id={slotIds.description}>\n {description}\n </div>\n )}\n\n <div className={clsx(styles.controls, __hideLabel && styles['label-hidden'])}>\n <InternalGrid gridDefinition={gridDefinition} disableGutters={__disableGutters}>\n <FormFieldContext.Provider\n value={{\n controlId: generatedControlId,\n ...contextValuesWithoutControlId,\n }}\n >\n {children && <div className={styles.control}>{children}</div>}\n </FormFieldContext.Provider>\n\n {secondaryControl && (\n <FormFieldContext.Provider value={contextValuesWithoutControlId}>\n <div className={styles['secondary-control']}>{secondaryControl}</div>\n </FormFieldContext.Provider>\n )}\n </InternalGrid>\n </div>\n\n {(constraintText || errorText) && (\n <div className={styles.hints}>\n {errorText && (\n <FormFieldError id={slotIds.error} errorIconAriaLabel={i18nStrings?.errorIconAriaLabel}>\n {errorText}\n </FormFieldError>\n )}\n {constraintText && (\n <ConstraintText id={slotIds.constraint} hasError={!!errorText}>\n {constraintText}\n </ConstraintText>\n )}\n </div>\n )}\n </div>\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["form-field/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect } from 'react';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../internal/base-component';\nimport { FormFieldContext, useFormFieldContext } from '../internal/context/form-field-context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\n\nimport InternalGrid from '../grid/internal';\nimport InternalIcon from '../icon/internal';\nimport { getAriaDescribedBy, getGridDefinition, getSlotIds } from './util';\n\nimport styles from './styles.css.js';\nimport { InternalFormFieldProps } from './interfaces';\nimport { joinStrings } from '../internal/utils/strings';\nimport { useInternalI18n } from '../internal/i18n/context';\nimport { InfoLinkLabelContext } from '../internal/context/info-link-label-context';\n\nimport { FunnelMetrics } from '../internal/analytics';\nimport { useFunnel, useFunnelStep, useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport {\n DATA_ATTR_FIELD_ERROR,\n DATA_ATTR_FIELD_LABEL,\n getFieldSlotSeletor,\n getNameFromSelector,\n getSubStepAllSelector,\n} from '../internal/analytics/selectors';\n\ninterface FormFieldErrorProps {\n id?: string;\n children?: React.ReactNode;\n errorIconAriaLabel?: string;\n}\n\nexport function FormFieldError({ id, children, errorIconAriaLabel }: FormFieldErrorProps) {\n const i18n = useInternalI18n('form-field');\n\n return (\n <div id={id} className={styles.error}>\n <div className={styles['error-icon-shake-wrapper']}>\n <div\n role=\"img\"\n aria-label={i18n('i18nStrings.errorIconAriaLabel', errorIconAriaLabel)}\n className={styles['error-icon-scale-wrapper']}\n >\n <InternalIcon name=\"status-warning\" size=\"small\" />\n </div>\n </div>\n <span className={styles.error__message}>{children}</span>\n </div>\n );\n}\n\nexport function ConstraintText({\n id,\n hasError,\n children,\n}: {\n id?: string;\n hasError: boolean;\n children: React.ReactNode;\n}) {\n return (\n <div id={id} className={clsx(styles.constraint, hasError && styles['constraint-has-error'])}>\n {children}\n </div>\n );\n}\n\nexport default function InternalFormField({\n controlId,\n stretch = false,\n label,\n info,\n i18nStrings,\n children,\n secondaryControl,\n description,\n constraintText,\n errorText,\n __hideLabel,\n __internalRootRef = null,\n __disableGutters = false,\n ...rest\n}: InternalFormFieldProps) {\n const baseProps = getBaseProps(rest);\n const isRefresh = useVisualRefresh();\n\n const instanceUniqueId = useUniqueId('formField');\n const generatedControlId = controlId || instanceUniqueId;\n const formFieldId = controlId || generatedControlId;\n\n const { funnelInteractionId, submissionAttempt, funnelState, errorCount } = useFunnel();\n const { stepNumber, stepNameSelector } = useFunnelStep();\n const { subStepSelector, subStepNameSelector } = useFunnelSubStep();\n\n const slotIds = getSlotIds(formFieldId, label, description, constraintText, errorText);\n\n const ariaDescribedBy = getAriaDescribedBy(slotIds);\n\n const gridDefinition = getGridDefinition(stretch, !!secondaryControl, isRefresh);\n\n const {\n ariaLabelledby: parentAriaLabelledby,\n ariaDescribedby: parentAriaDescribedby,\n invalid: parentInvalid,\n } = useFormFieldContext({});\n\n const contextValuesWithoutControlId = {\n ariaLabelledby: joinStrings(parentAriaLabelledby, slotIds.label) || undefined,\n ariaDescribedby: joinStrings(parentAriaDescribedby, ariaDescribedBy) || undefined,\n invalid: !!errorText || !!parentInvalid,\n };\n\n const analyticsAttributes = {\n [DATA_ATTR_FIELD_LABEL]: slotIds.label ? getFieldSlotSeletor(slotIds.label) : undefined,\n [DATA_ATTR_FIELD_ERROR]: slotIds.error ? getFieldSlotSeletor(slotIds.error) : undefined,\n };\n\n useEffect(() => {\n if (funnelInteractionId && errorText && funnelState.current !== 'complete') {\n const stepName = getNameFromSelector(stepNameSelector);\n const subStepName = getNameFromSelector(subStepNameSelector);\n\n errorCount.current++;\n\n FunnelMetrics.funnelSubStepError({\n funnelInteractionId,\n subStepSelector,\n subStepName,\n subStepNameSelector,\n stepNumber,\n stepName,\n stepNameSelector,\n fieldErrorSelector: getFieldSlotSeletor(slotIds.error),\n fieldLabelSelector: getFieldSlotSeletor(slotIds.label),\n subStepAllSelector: getSubStepAllSelector(),\n });\n\n return () => {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n errorCount.current--;\n };\n }\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [funnelInteractionId, errorText, submissionAttempt, errorCount]);\n\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.root)}\n ref={__internalRootRef}\n {...analyticsAttributes}\n >\n <div className={clsx(__hideLabel && styles['visually-hidden'])}>\n {label && (\n <label className={styles.label} id={slotIds.label} htmlFor={generatedControlId}>\n {label}\n </label>\n )}\n <InfoLinkLabelContext.Provider value={slotIds.label}>\n {!__hideLabel && info && <span className={styles.info}>{info}</span>}\n </InfoLinkLabelContext.Provider>\n </div>\n\n {description && (\n <div className={styles.description} id={slotIds.description}>\n {description}\n </div>\n )}\n\n <div className={clsx(styles.controls, __hideLabel && styles['label-hidden'])}>\n <InternalGrid gridDefinition={gridDefinition} disableGutters={__disableGutters}>\n <FormFieldContext.Provider\n value={{\n controlId: generatedControlId,\n ...contextValuesWithoutControlId,\n }}\n >\n {children && <div className={styles.control}>{children}</div>}\n </FormFieldContext.Provider>\n\n {secondaryControl && (\n <FormFieldContext.Provider value={contextValuesWithoutControlId}>\n <div className={styles['secondary-control']}>{secondaryControl}</div>\n </FormFieldContext.Provider>\n )}\n </InternalGrid>\n </div>\n\n {(constraintText || errorText) && (\n <div className={styles.hints}>\n {errorText && (\n <FormFieldError id={slotIds.error} errorIconAriaLabel={i18nStrings?.errorIconAriaLabel}>\n {errorText}\n </FormFieldError>\n )}\n {constraintText && (\n <ConstraintText id={slotIds.constraint} hasError={!!errorText}>\n {constraintText}\n </ConstraintText>\n )}\n </div>\n )}\n </div>\n );\n}\n"]}
|
package/header/internal.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["header/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAG1C,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAE3C,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAMjD,UAAU,mBAAoB,SAAQ,YAAY,CAAC,WAAW,EAAE,SAAS,CAAC,EAAE,0BAA0B;IACpG,wBAAwB,CAAC,EAAE,OAAO,CAAC;CACpC;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,OAAO,EACP,kBAAkB,EAClB,QAAQ,EACR,OAAO,EACP,OAAO,EACP,WAAW,EACX,IAAI,EACJ,iBAAwB,EACxB,wBAAwB,EACxB,GAAG,SAAS,EACb,EAAE,mBAAmB,
|
|
1
|
+
{"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["header/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAG1C,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAE3C,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAMjD,UAAU,mBAAoB,SAAQ,YAAY,CAAC,WAAW,EAAE,SAAS,CAAC,EAAE,0BAA0B;IACpG,wBAAwB,CAAC,EAAE,OAAO,CAAC;CACpC;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,OAAO,EACP,kBAAkB,EAClB,QAAQ,EACR,OAAO,EACP,OAAO,EACP,WAAW,EACX,IAAI,EACJ,iBAAwB,EACxB,wBAAwB,EACxB,GAAG,SAAS,EACb,EAAE,mBAAmB,eA2DrB;AAED,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,eAAe,EAAE,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAAC,eAAe,EAAE,MAAM,CAAA;CAAE,sBAgBhH"}
|
package/header/internal.js
CHANGED
|
@@ -22,9 +22,9 @@ export default function InternalHeader(_a) {
|
|
|
22
22
|
// If is mobile there is no need to have the dynamic variant because it's scrolled out of view
|
|
23
23
|
const dynamicVariant = !isMobile && isStuck ? 'h2' : 'h1';
|
|
24
24
|
const variantOverride = variant === 'awsui-h1-sticky' ? (isRefresh ? dynamicVariant : 'h2') : variant;
|
|
25
|
-
return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(styles.root, baseProps.className, styles[`root-variant-${variantOverride}`], isRefresh && styles
|
|
26
|
-
React.createElement("div", { className: clsx(styles.main, styles[`main-variant-${variantOverride}`], isRefresh && styles
|
|
27
|
-
React.createElement("div", { className: clsx(styles.title, styles[`title-variant-${variantOverride}`], isRefresh && styles[`
|
|
25
|
+
return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(styles.root, baseProps.className, styles[`root-variant-${variantOverride}`], isRefresh && styles.refresh, !actions && [styles[`root-no-actions`]], description && [styles[`root-has-description`]], __disableActionsWrapping && [styles['root-no-wrap']]), ref: __internalRootRef }),
|
|
26
|
+
React.createElement("div", { className: clsx(styles.main, styles[`main-variant-${variantOverride}`], isRefresh && styles.refresh) },
|
|
27
|
+
React.createElement("div", { className: clsx(styles.title, styles[`title-variant-${variantOverride}`], isRefresh && styles.refresh, description && [styles[`root-has-description`]]) },
|
|
28
28
|
React.createElement(HeadingTag, { className: clsx(styles.heading, styles[`heading-variant-${variantOverride}`]) },
|
|
29
29
|
React.createElement("span", Object.assign({}, { [DATA_ATTR_FUNNEL_KEY]: FUNNEL_KEY_SUBSTEP_NAME }, { className: clsx(styles['heading-text'], styles[`heading-text-variant-${variantOverride}`]), id: headingId }), children),
|
|
30
30
|
counter !== undefined && React.createElement("span", { className: styles.counter },
|
|
@@ -32,11 +32,11 @@ export default function InternalHeader(_a) {
|
|
|
32
32
|
counter)),
|
|
33
33
|
React.createElement(InfoLinkLabelContext.Provider, { value: headingId }, info && React.createElement("span", { className: styles.info }, info))),
|
|
34
34
|
React.createElement(Description, { variantOverride: variantOverride }, description)),
|
|
35
|
-
actions && (React.createElement("div", { className: clsx(styles.actions, styles[`actions-variant-${variantOverride}`], isRefresh && styles
|
|
35
|
+
actions && (React.createElement("div", { className: clsx(styles.actions, styles[`actions-variant-${variantOverride}`], isRefresh && styles.refresh) }, actions))));
|
|
36
36
|
}
|
|
37
37
|
export function Description({ children, variantOverride }) {
|
|
38
38
|
const isRefresh = useVisualRefresh();
|
|
39
|
-
return ((children && (React.createElement("p", { className: clsx(styles.description, styles[`description-variant-${variantOverride}`], isRefresh && styles
|
|
39
|
+
return ((children && (React.createElement("p", { className: clsx(styles.description, styles[`description-variant-${variantOverride}`], isRefresh && styles.refresh) }, children))) ||
|
|
40
40
|
null);
|
|
41
41
|
}
|
|
42
42
|
//# sourceMappingURL=internal.js.map
|
package/header/internal.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["header/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,mBAAmB,EAAE,MAAM,gCAAgC,CAAC;AAErE,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAErE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,oBAAoB,EAAE,MAAM,6CAA6C,CAAC;AACnF,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAC9D,OAAO,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,MAAM,iCAAiC,CAAC;AAMhG,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EAWjB;QAXiB,EACrC,OAAO,EACP,kBAAkB,EAClB,QAAQ,EACR,OAAO,EACP,OAAO,EACP,WAAW,EACX,IAAI,EACJ,iBAAiB,GAAG,IAAI,EACxB,wBAAwB,OAEJ,EADjB,SAAS,cAVyB,2IAWtC,CADa;IAEZ,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAC7B,MAAM,UAAU,GAAG,kBAAkB,aAAlB,kBAAkB,cAAlB,kBAAkB,GAAI,CAAC,OAAO,KAAK,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC;IAC1F,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IACpD,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,SAAS,GAAG,gBAAgB,EAAE,CAAC;IACrC,MAAM,SAAS,GAAG,WAAW,CAAC,SAAS,CAAC,CAAC;IACzC,8FAA8F;IAC9F,MAAM,cAAc,GAAG,CAAC,QAAQ,IAAI,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;IAC1D,MAAM,eAAe,GAAG,OAAO,KAAK,iBAAiB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;IAEtG,OAAO,CACL,6CACM,SAAS,IACb,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,IAAI,EACX,SAAS,CAAC,SAAS,EACnB,MAAM,CAAC,gBAAgB,eAAe,EAAE,CAAC,EACzC,SAAS,IAAI,MAAM,CAAC,
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["header/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { useContext } from 'react';\nimport { getBaseProps } from '../internal/base-component';\nimport { StickyHeaderContext } from '../container/use-sticky-header';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { HeaderProps } from './interfaces';\nimport styles from './styles.css.js';\nimport { SomeRequired } from '../internal/types';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { InfoLinkLabelContext } from '../internal/context/info-link-label-context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { DATA_ATTR_FUNNEL_KEY, FUNNEL_KEY_SUBSTEP_NAME } from '../internal/analytics/selectors';\n\ninterface InternalHeaderProps extends SomeRequired<HeaderProps, 'variant'>, InternalBaseComponentProps {\n __disableActionsWrapping?: boolean;\n}\n\nexport default function InternalHeader({\n variant,\n headingTagOverride,\n children,\n actions,\n counter,\n description,\n info,\n __internalRootRef = null,\n __disableActionsWrapping,\n ...restProps\n}: InternalHeaderProps) {\n const isMobile = useMobile();\n const HeadingTag = headingTagOverride ?? (variant === 'awsui-h1-sticky' ? 'h1' : variant);\n const { isStuck } = useContext(StickyHeaderContext);\n const baseProps = getBaseProps(restProps);\n const isRefresh = useVisualRefresh();\n const headingId = useUniqueId('heading');\n // If is mobile there is no need to have the dynamic variant because it's scrolled out of view\n const dynamicVariant = !isMobile && isStuck ? 'h2' : 'h1';\n const variantOverride = variant === 'awsui-h1-sticky' ? (isRefresh ? dynamicVariant : 'h2') : variant;\n\n return (\n <div\n {...baseProps}\n className={clsx(\n styles.root,\n baseProps.className,\n styles[`root-variant-${variantOverride}`],\n isRefresh && styles.refresh,\n !actions && [styles[`root-no-actions`]],\n description && [styles[`root-has-description`]],\n __disableActionsWrapping && [styles['root-no-wrap']]\n )}\n ref={__internalRootRef}\n >\n <div className={clsx(styles.main, styles[`main-variant-${variantOverride}`], isRefresh && styles.refresh)}>\n <div\n className={clsx(\n styles.title,\n styles[`title-variant-${variantOverride}`],\n isRefresh && styles.refresh,\n description && [styles[`root-has-description`]]\n )}\n >\n <HeadingTag className={clsx(styles.heading, styles[`heading-variant-${variantOverride}`])}>\n <span\n {...{ [DATA_ATTR_FUNNEL_KEY]: FUNNEL_KEY_SUBSTEP_NAME }}\n className={clsx(styles['heading-text'], styles[`heading-text-variant-${variantOverride}`])}\n id={headingId}\n >\n {children}\n </span>\n {counter !== undefined && <span className={styles.counter}> {counter}</span>}\n </HeadingTag>\n <InfoLinkLabelContext.Provider value={headingId}>\n {info && <span className={styles.info}>{info}</span>}\n </InfoLinkLabelContext.Provider>\n </div>\n <Description variantOverride={variantOverride}>{description}</Description>\n </div>\n {actions && (\n <div\n className={clsx(styles.actions, styles[`actions-variant-${variantOverride}`], isRefresh && styles.refresh)}\n >\n {actions}\n </div>\n )}\n </div>\n );\n}\n\nexport function Description({ children, variantOverride }: { children: React.ReactNode; variantOverride: string }) {\n const isRefresh = useVisualRefresh();\n return (\n (children && (\n <p\n className={clsx(\n styles.description,\n styles[`description-variant-${variantOverride}`],\n isRefresh && styles.refresh\n )}\n >\n {children}\n </p>\n )) ||\n null\n );\n}\n"]}
|
package/header/styles.css.js
CHANGED
|
@@ -1,49 +1,38 @@
|
|
|
1
1
|
|
|
2
2
|
import './styles.scoped.css';
|
|
3
3
|
export default {
|
|
4
|
-
"root": "
|
|
5
|
-
"
|
|
6
|
-
"root-
|
|
7
|
-
"root-variant-
|
|
8
|
-
"root-variant-
|
|
9
|
-
"root-has-description": "awsui_root-has-
|
|
10
|
-
"root-
|
|
11
|
-
"
|
|
12
|
-
"
|
|
13
|
-
"
|
|
14
|
-
"main": "
|
|
15
|
-
"
|
|
16
|
-
"
|
|
17
|
-
"
|
|
18
|
-
"
|
|
19
|
-
"
|
|
20
|
-
"
|
|
21
|
-
"
|
|
22
|
-
"
|
|
23
|
-
"
|
|
24
|
-
"
|
|
25
|
-
"
|
|
26
|
-
"
|
|
27
|
-
"
|
|
28
|
-
"
|
|
29
|
-
"
|
|
30
|
-
"
|
|
31
|
-
"
|
|
32
|
-
"
|
|
33
|
-
"
|
|
34
|
-
"
|
|
35
|
-
"
|
|
36
|
-
"
|
|
37
|
-
"description-variant-h3": "awsui_description-variant-h3_2qdw9_zkfib_228",
|
|
38
|
-
"description-variant-h3-refresh": "awsui_description-variant-h3-refresh_2qdw9_zkfib_234",
|
|
39
|
-
"heading": "awsui_heading_2qdw9_zkfib_238",
|
|
40
|
-
"heading-variant-h1": "awsui_heading-variant-h1_2qdw9_zkfib_247",
|
|
41
|
-
"heading-variant-h2": "awsui_heading-variant-h2_2qdw9_zkfib_252",
|
|
42
|
-
"heading-variant-h3": "awsui_heading-variant-h3_2qdw9_zkfib_257",
|
|
43
|
-
"heading-text": "awsui_heading-text_2qdw9_zkfib_263",
|
|
44
|
-
"heading-text-variant-h1": "awsui_heading-text-variant-h1_2qdw9_zkfib_266",
|
|
45
|
-
"heading-text-variant-h2": "awsui_heading-text-variant-h2_2qdw9_zkfib_274",
|
|
46
|
-
"heading-text-variant-h3": "awsui_heading-text-variant-h3_2qdw9_zkfib_282",
|
|
47
|
-
"counter": "awsui_counter_2qdw9_zkfib_291"
|
|
4
|
+
"root": "awsui_root_2qdw9_1iosj_93",
|
|
5
|
+
"refresh": "awsui_refresh_2qdw9_1iosj_111",
|
|
6
|
+
"root-no-actions": "awsui_root-no-actions_2qdw9_1iosj_114",
|
|
7
|
+
"root-variant-h2": "awsui_root-variant-h2_2qdw9_1iosj_114",
|
|
8
|
+
"root-variant-h3": "awsui_root-variant-h3_2qdw9_1iosj_114",
|
|
9
|
+
"root-has-description": "awsui_root-has-description_2qdw9_1iosj_114",
|
|
10
|
+
"root-no-wrap": "awsui_root-no-wrap_2qdw9_1iosj_120",
|
|
11
|
+
"main": "awsui_main_2qdw9_1iosj_124",
|
|
12
|
+
"main-variant-h1": "awsui_main-variant-h1_2qdw9_1iosj_132",
|
|
13
|
+
"main-variant-h2": "awsui_main-variant-h2_2qdw9_1iosj_139",
|
|
14
|
+
"main-variant-h3": "awsui_main-variant-h3_2qdw9_1iosj_139",
|
|
15
|
+
"actions": "awsui_actions_2qdw9_1iosj_149",
|
|
16
|
+
"actions-variant-h1": "awsui_actions-variant-h1_2qdw9_1iosj_153",
|
|
17
|
+
"actions-variant-h2": "awsui_actions-variant-h2_2qdw9_1iosj_156",
|
|
18
|
+
"actions-variant-h3": "awsui_actions-variant-h3_2qdw9_1iosj_159",
|
|
19
|
+
"title": "awsui_title_2qdw9_1iosj_172",
|
|
20
|
+
"title-variant-h1": "awsui_title-variant-h1_2qdw9_1iosj_178",
|
|
21
|
+
"title-variant-h2": "awsui_title-variant-h2_2qdw9_1iosj_184",
|
|
22
|
+
"title-variant-h3": "awsui_title-variant-h3_2qdw9_1iosj_190",
|
|
23
|
+
"info": "awsui_info_2qdw9_1iosj_200",
|
|
24
|
+
"description": "awsui_description_2qdw9_1iosj_204",
|
|
25
|
+
"description-variant-h1": "awsui_description-variant-h1_2qdw9_1iosj_209",
|
|
26
|
+
"description-variant-h2": "awsui_description-variant-h2_2qdw9_1iosj_216",
|
|
27
|
+
"description-variant-h3": "awsui_description-variant-h3_2qdw9_1iosj_223",
|
|
28
|
+
"heading": "awsui_heading_2qdw9_1iosj_232",
|
|
29
|
+
"heading-variant-h1": "awsui_heading-variant-h1_2qdw9_1iosj_241",
|
|
30
|
+
"heading-variant-h2": "awsui_heading-variant-h2_2qdw9_1iosj_246",
|
|
31
|
+
"heading-variant-h3": "awsui_heading-variant-h3_2qdw9_1iosj_251",
|
|
32
|
+
"heading-text": "awsui_heading-text_2qdw9_1iosj_257",
|
|
33
|
+
"heading-text-variant-h1": "awsui_heading-text-variant-h1_2qdw9_1iosj_260",
|
|
34
|
+
"heading-text-variant-h2": "awsui_heading-text-variant-h2_2qdw9_1iosj_268",
|
|
35
|
+
"heading-text-variant-h3": "awsui_heading-text-variant-h3_2qdw9_1iosj_276",
|
|
36
|
+
"counter": "awsui_counter_2qdw9_1iosj_285"
|
|
48
37
|
};
|
|
49
38
|
|