@cloudscape-design/components 3.0.1013 → 3.0.1014
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/flashbar/collapsible-flashbar.d.ts +1 -9
- package/flashbar/collapsible-flashbar.d.ts.map +1 -1
- package/flashbar/collapsible-flashbar.js +3 -50
- package/flashbar/collapsible-flashbar.js.map +1 -1
- package/flashbar/flash.d.ts.map +1 -1
- package/flashbar/flash.js +5 -27
- package/flashbar/flash.js.map +1 -1
- package/flashbar/interfaces.d.ts +51 -9
- package/flashbar/interfaces.d.ts.map +1 -1
- package/flashbar/interfaces.js.map +1 -1
- package/flashbar/style.d.ts +35 -0
- package/flashbar/style.d.ts.map +1 -0
- package/flashbar/style.js +105 -0
- package/flashbar/style.js.map +1 -0
- package/flashbar/styles.css.js +50 -50
- package/flashbar/styles.scoped.css +153 -152
- package/flashbar/styles.selectors.js +50 -50
- package/internal/base-component/styles.scoped.css +1 -1
- package/internal/environment.js +2 -2
- package/internal/environment.json +2 -2
- package/internal/manifest.json +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/flashbar/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { ButtonProps } from '../button/interfaces';\nimport { ErrorContext } from '../internal/analytics/interfaces';\nimport { BaseComponentProps } from '../internal/base-component';\n\nexport namespace FlashbarProps {\n export interface MessageDefinition {\n header?: React.ReactNode;\n content?: React.ReactNode;\n dismissible?: boolean;\n dismissLabel?: string;\n statusIconAriaLabel?: string;\n loading?: boolean;\n type?: FlashbarProps.Type;\n ariaRole?: FlashbarProps.AriaRole;\n action?: React.ReactNode;\n id?: string;\n buttonText?: ButtonProps['children'];\n onButtonClick?: ButtonProps['onClick'];\n onDismiss?: ButtonProps['onClick'];\n analyticsMetadata?: FlashbarProps.ItemAnalyticsMetadata;\n }\n\n export interface ItemAnalyticsMetadata {\n suppressFlowMetricEvents?: boolean;\n errorContext?: ErrorContext;\n }\n\n export interface I18nStrings {\n ariaLabel?: string;\n errorIconAriaLabel?: string;\n infoIconAriaLabel?: string;\n inProgressIconAriaLabel?: string;\n notificationBarAriaLabel?: string;\n notificationBarText?: string;\n successIconAriaLabel?: string;\n warningIconAriaLabel?: string;\n }\n\n export interface Style {\n item?: {\n root?: {\n background?: {\n error?: string;\n info?: string;\n inProgress?: string;\n success?: string;\n warning?: string;\n };\n borderColor?: {\n error?: string;\n info?: string;\n inProgress?: string;\n success?: string;\n warning?: string;\n };\n borderRadius?: string;\n borderWidth?: string;\n color?: {\n error?: string;\n info?: string;\n inProgress?: string;\n success?: string;\n warning?: string;\n };\n focusRing?: {\n borderColor?: string;\n borderRadius?: string;\n borderWidth?: string;\n };\n };\n dismissButton?: {\n color?: {\n active?: string;\n default?: string;\n hover?: string;\n };\n focusRing?: {\n borderColor?: string;\n borderRadius?: string;\n borderWidth?: string;\n };\n };\n };\n notificationBar?: {\n root: {\n background?: {\n active?: string;\n default?: string;\n hover?: string;\n };\n borderColor?: {\n active?: string;\n default?: string;\n hover?: string;\n };\n borderRadius?: string;\n borderWidth?: string;\n color?: {\n active?: string;\n default?: string;\n hover?: string;\n };\n };\n };\n }\n\n export type Type = 'success' | 'warning' | 'info' | 'error' | 'in-progress';\n export type AriaRole = 'alert' | 'status';\n}\n\nexport interface FlashbarProps extends BaseComponentProps {\n /**\n * Specifies flash messages that appear in the same order that they are listed.\n * The value is an array of flash message definition objects.\n *\n * A flash message object contains the following properties:\n * * `header` (ReactNode) - Specifies the heading text.\n * * `content` (ReactNode) - Specifies the primary text displayed in the flash element.\n * * `type` (string) - Indicates the type of the message to be displayed. Allowed values are as follows: `success, error, warning, info, in-progress`. The default is `info`.\n * * `loading` (boolean) - Replaces the status icon with a spinner and forces the type to `info`.\n * * `dismissible` (boolean) - Determines whether the component includes a close button icon. By default, the close button is not included.\n * When a user clicks on this button the `onDismiss` handler is called.\n * * `dismissLabel` (string) - Specifies an `aria-label` for to the dismiss icon button for improved accessibility.\n * * `statusIconAriaLabel` (string) - Specifies an `aria-label` for to the status icon for improved accessibility.\n * If not provided, `i18nStrings.{type}IconAriaLabel` will be used as a fallback.\n * * `ariaRole` (string) - For flash messages added after page load, specifies how this message is communicated to assistive\n * technology. Use \"status\" for status updates or informational content. Use \"alert\" for important messages that need the\n * user's attention.\n * * `action` (ReactNode) - Specifies an action for the flash message. Although it is technically possible to insert any content,\n * our UX guidelines only allow you to add a button.\n * * `buttonText` (string) - Specifies that an action button should be displayed, with the specified text.\n * When a user clicks on this button the `onButtonClick` handler is called.\n * If the `action` property is set, this property is ignored. **Deprecated**, replaced by `action`.\n * * `onButtonClick` (event => void) - Called when a user clicks on the action button. This is not called if you create a custom button\n * using the `action` property. **Deprecated**, replaced by `action`.\n * * `id` (string) - Specifies a unique flash message identifier. This property is used in two ways:\n * 1. As a [keys](https://reactjs.org/docs/lists-and-keys.html#keys) source for React rendering.\n * 2. To identify which flash message will be removed from the DOM when it is dismissed, to animate it out.\n * * `analyticsMetadata` (FlashbarProps.ItemAnalyticsMetadata) - (Optional) Specifies additional analytics-related metadata.\n * * `suppressFlowMetricEvents` - Prevent this item from generating events related to flow metrics.\n * @analytics\n */\n items: ReadonlyArray<FlashbarProps.MessageDefinition>;\n\n /**\n * Specifies whether flash messages should be stacked.\n */\n stackItems?: boolean;\n\n /**\n * An object containing all the necessary localized strings required by the component. The object should contain:\n *\n * * `ariaLabel` - Specifies the ARIA label for the list of notifications.\n *\n * If `stackItems` is set to `true`, it should also contain:\n *\n * * `notificationBarAriaLabel` - (optional) Specifies the ARIA label for the notification bar\n * * `notificationBarText` - (optional) Specifies the text shown in the notification bar\n * * `errorIconAriaLabel` - (optional) Specifies the ARIA label for the icon displayed next to the number of items of type `error`.\n * * `warningIconAriaLabel` - (optional) Specifies the ARIA label for the icon displayed next to the number of items of type `warning`.\n * * `infoIconAriaLabel` - (optional) Specifies the ARIA label for the icon displayed next to the number of items of type `info`.\n * * `successIconAriaLabel` - (optional) Specifies the ARIA label for the icon displayed next to the number of items of type `success`.\n * * `inProgressIconAriaLabel` - (optional) Specifies the ARIA label for the icon displayed next to the number of items of type `in-progress` or with `loading` set to `true`.\n * @i18n\n */\n i18nStrings?: FlashbarProps.I18nStrings;\n\n /**\n * Specifies an object of selectors and properties that are used to apply custom styles.\n *\n * - `item.root.background` {error, info, inProgress, success, warning} - (Optional) Background for item types.\n * - `item.root.borderColor` {error, info, inProgress, success, warning} - (Optional) Border color for item types.\n * - `item.root.borderRadius` (string) - (Optional) Item border radius.\n * - `item.root.borderWidth` (string) - (Optional) Item border width.\n * - `item.root.color` {error, info, inProgress, success, warning} - (Optional) Color for item types.\n * - `item.root.focusRing.borderColor` (string) - (Optional) Item focus ring border color.\n * - `item.root.focusRing.borderRadius` (string) - (Optional) Item focus ring border radius.\n * - `item.root.focusRing.borderWidth` (string) - (Optional) Item focus ring border width.\n * - `item.dismissButton.color` {active, default, hover} - (Optional) Color for dismiss button states.\n * - `item.dismissButton.focusRing.borderColor` (string) - (Optional) Dismiss button focus ring border color.\n * - `item.dismissButton.focusRing.borderRadius` (string) - (Optional) Dismiss button focus ring border radius.\n * - `item.dismissButton.focusRing.borderWidth` (string) - (Optional) Dismiss button focus ring border width.\n * - `notificationBar.root.background` {active, default, hover} - (Optional) Background for notification bar states.\n * - `notificationBar.root.borderColor` {active, default, hover} - (Optional) Border color for notification bar states.\n * - `notificationBar.root.borderRadius` (string) - (Optional) Notification bar border radius.\n * - `notificationBar.root.borderWidth` (string) - (Optional) Notification bar border width.\n * - `notificationBar.root.color` {active, default, hover} - (Optional) Color for notification bar states.\n * @awsuiSystem core\n */\n style?: FlashbarProps.Style;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/flashbar/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { ButtonProps } from '../button/interfaces';\nimport { ErrorContext } from '../internal/analytics/interfaces';\nimport { BaseComponentProps } from '../internal/base-component';\n\nexport namespace FlashbarProps {\n export interface MessageDefinition {\n header?: React.ReactNode;\n content?: React.ReactNode;\n dismissible?: boolean;\n dismissLabel?: string;\n statusIconAriaLabel?: string;\n loading?: boolean;\n type?: FlashbarProps.Type;\n ariaRole?: FlashbarProps.AriaRole;\n action?: React.ReactNode;\n id?: string;\n buttonText?: ButtonProps['children'];\n onButtonClick?: ButtonProps['onClick'];\n onDismiss?: ButtonProps['onClick'];\n analyticsMetadata?: FlashbarProps.ItemAnalyticsMetadata;\n }\n\n export interface ItemAnalyticsMetadata {\n suppressFlowMetricEvents?: boolean;\n errorContext?: ErrorContext;\n }\n\n export interface I18nStrings {\n ariaLabel?: string;\n errorIconAriaLabel?: string;\n infoIconAriaLabel?: string;\n inProgressIconAriaLabel?: string;\n notificationBarAriaLabel?: string;\n notificationBarText?: string;\n successIconAriaLabel?: string;\n warningIconAriaLabel?: string;\n }\n\n export interface Style {\n item?: {\n root?: {\n background?: {\n error?: string;\n info?: string;\n inProgress?: string;\n success?: string;\n warning?: string;\n };\n borderColor?: {\n error?: string;\n info?: string;\n inProgress?: string;\n success?: string;\n warning?: string;\n };\n borderRadius?: string;\n borderWidth?: string;\n color?: {\n error?: string;\n info?: string;\n inProgress?: string;\n success?: string;\n warning?: string;\n };\n focusRing?: {\n borderColor?: {\n error?: string;\n info?: string;\n inProgress?: string;\n success?: string;\n warning?: string;\n };\n borderRadius?: string;\n borderWidth?: string;\n };\n };\n dismissButton?: {\n color?: {\n active?: {\n error?: string;\n info?: string;\n inProgress?: string;\n success?: string;\n warning?: string;\n };\n default?: {\n error?: string;\n info?: string;\n inProgress?: string;\n success?: string;\n warning?: string;\n };\n hover?: {\n error?: string;\n info?: string;\n inProgress?: string;\n success?: string;\n warning?: string;\n };\n };\n focusRing?: {\n borderColor?: {\n error?: string;\n info?: string;\n inProgress?: string;\n success?: string;\n warning?: string;\n };\n borderRadius?: string;\n borderWidth?: string;\n };\n };\n };\n notificationBar?: {\n root?: {\n background?: {\n active?: string;\n default?: string;\n hover?: string;\n };\n borderColor?: {\n active?: string;\n default?: string;\n hover?: string;\n };\n borderRadius?: string;\n borderWidth?: string;\n color?: {\n active?: string;\n default?: string;\n hover?: string;\n };\n };\n expandButton?: {\n focusRing?: {\n borderColor?: string;\n borderRadius?: string;\n borderWidth?: string;\n };\n };\n };\n }\n\n export type Type = 'success' | 'warning' | 'info' | 'error' | 'in-progress';\n export type AriaRole = 'alert' | 'status';\n}\n\nexport interface FlashbarProps extends BaseComponentProps {\n /**\n * Specifies flash messages that appear in the same order that they are listed.\n * The value is an array of flash message definition objects.\n *\n * A flash message object contains the following properties:\n * * `header` (ReactNode) - Specifies the heading text.\n * * `content` (ReactNode) - Specifies the primary text displayed in the flash element.\n * * `type` (string) - Indicates the type of the message to be displayed. Allowed values are as follows: `success, error, warning, info, in-progress`. The default is `info`.\n * * `loading` (boolean) - Replaces the status icon with a spinner and forces the type to `info`.\n * * `dismissible` (boolean) - Determines whether the component includes a close button icon. By default, the close button is not included.\n * When a user clicks on this button the `onDismiss` handler is called.\n * * `dismissLabel` (string) - Specifies an `aria-label` for to the dismiss icon button for improved accessibility.\n * * `statusIconAriaLabel` (string) - Specifies an `aria-label` for to the status icon for improved accessibility.\n * If not provided, `i18nStrings.{type}IconAriaLabel` will be used as a fallback.\n * * `ariaRole` (string) - For flash messages added after page load, specifies how this message is communicated to assistive\n * technology. Use \"status\" for status updates or informational content. Use \"alert\" for important messages that need the\n * user's attention.\n * * `action` (ReactNode) - Specifies an action for the flash message. Although it is technically possible to insert any content,\n * our UX guidelines only allow you to add a button.\n * * `buttonText` (string) - Specifies that an action button should be displayed, with the specified text.\n * When a user clicks on this button the `onButtonClick` handler is called.\n * If the `action` property is set, this property is ignored. **Deprecated**, replaced by `action`.\n * * `onButtonClick` (event => void) - Called when a user clicks on the action button. This is not called if you create a custom button\n * using the `action` property. **Deprecated**, replaced by `action`.\n * * `id` (string) - Specifies a unique flash message identifier. This property is used in two ways:\n * 1. As a [keys](https://reactjs.org/docs/lists-and-keys.html#keys) source for React rendering.\n * 2. To identify which flash message will be removed from the DOM when it is dismissed, to animate it out.\n * * `analyticsMetadata` (FlashbarProps.ItemAnalyticsMetadata) - (Optional) Specifies additional analytics-related metadata.\n * * `suppressFlowMetricEvents` - Prevent this item from generating events related to flow metrics.\n * @analytics\n */\n items: ReadonlyArray<FlashbarProps.MessageDefinition>;\n\n /**\n * Specifies whether flash messages should be stacked.\n */\n stackItems?: boolean;\n\n /**\n * An object containing all the necessary localized strings required by the component. The object should contain:\n *\n * * `ariaLabel` - Specifies the ARIA label for the list of notifications.\n *\n * If `stackItems` is set to `true`, it should also contain:\n *\n * * `notificationBarAriaLabel` - (optional) Specifies the ARIA label for the notification bar\n * * `notificationBarText` - (optional) Specifies the text shown in the notification bar\n * * `errorIconAriaLabel` - (optional) Specifies the ARIA label for the icon displayed next to the number of items of type `error`.\n * * `warningIconAriaLabel` - (optional) Specifies the ARIA label for the icon displayed next to the number of items of type `warning`.\n * * `infoIconAriaLabel` - (optional) Specifies the ARIA label for the icon displayed next to the number of items of type `info`.\n * * `successIconAriaLabel` - (optional) Specifies the ARIA label for the icon displayed next to the number of items of type `success`.\n * * `inProgressIconAriaLabel` - (optional) Specifies the ARIA label for the icon displayed next to the number of items of type `in-progress` or with `loading` set to `true`.\n * @i18n\n */\n i18nStrings?: FlashbarProps.I18nStrings;\n\n /**\n * Specifies an object of selectors and properties that are used to apply custom styles.\n *\n * - `item.root.background` {error, info, inProgress, success, warning} - (Optional) Background for item types.\n * - `item.root.borderColor` {error, info, inProgress, success, warning} - (Optional) Border color for item types.\n * - `item.root.borderRadius` (string) - (Optional) Item border radius.\n * - `item.root.borderWidth` (string) - (Optional) Item border width.\n * - `item.root.color` {error, info, inProgress, success, warning} - (Optional) Color for item types.\n * - `item.root.focusRing.borderColor` {error, info, inProgress, success, warning} - (Optional) Item focus ring border color.\n * - `item.root.focusRing.borderRadius` (string) - (Optional) Item focus ring border radius.\n * - `item.root.focusRing.borderWidth` (string) - (Optional) Item focus ring border width.\n * - `item.dismissButton.color.active` {error, info, inProgress, success, warning} - (Optional) Color for dismiss button active state.\n * - `item.dismissButton.color.default` {error, info, inProgress, success, warning} - (Optional) Color for dismiss button default state.\n * - `item.dismissButton.color.hover` {error, info, inProgress, success, warning} - (Optional) Color for dismiss button hover state.\n * - `item.dismissButton.focusRing.borderColor` {error, info, inProgress, success, warning} - (Optional) Dismiss button focus ring border color.\n * - `item.dismissButton.focusRing.borderRadius` (string) - (Optional) Dismiss button focus ring border radius.\n * - `item.dismissButton.focusRing.borderWidth` (string) - (Optional) Dismiss button focus ring border width.\n * - `notificationBar.root.background` {active, default, hover} - (Optional) Background for notification bar states.\n * - `notificationBar.root.borderColor` {active, default, hover} - (Optional) Border color for notification bar states.\n * - `notificationBar.root.borderRadius` (string) - (Optional) Notification bar border radius.\n * - `notificationBar.root.borderWidth` (string) - (Optional) Notification bar border width.\n * - `notificationBar.root.color` {active, default, hover} - (Optional) Color for notification bar states.\n * - `notificationBar.expandButton.focusRing.borderColor` (string) - (Optional) Border color for the expand button.\n * - `notificationBar.expandButton.focusRing.borderRadius` (string) - (Optional) Border radius for the expand button.\n * - `notificationBar.expandButton.focusRing.borderWidth` (string) - (Optional) Border width for the expand button.\n * @awsuiSystem core\n */\n style?: FlashbarProps.Style;\n}\n"]}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { FlashbarProps } from './interfaces';
|
|
2
|
+
export declare function getCollapsibleFlashStyles(style: FlashbarProps.Style, type?: string): {
|
|
3
|
+
background: string | undefined;
|
|
4
|
+
borderColor: string | undefined;
|
|
5
|
+
borderRadius: string | undefined;
|
|
6
|
+
borderStyle: string | undefined;
|
|
7
|
+
borderWidth: string | undefined;
|
|
8
|
+
color: string | undefined;
|
|
9
|
+
};
|
|
10
|
+
export declare function getFlashStyles(style: FlashbarProps.Style, type?: string): {
|
|
11
|
+
background: string | undefined;
|
|
12
|
+
borderColor: string | undefined;
|
|
13
|
+
borderRadius: string | undefined;
|
|
14
|
+
borderStyle: string | undefined;
|
|
15
|
+
borderWidth: string | undefined;
|
|
16
|
+
color: string | undefined;
|
|
17
|
+
};
|
|
18
|
+
export declare function getDismissButtonStyles(style: FlashbarProps.Style, type?: string): {
|
|
19
|
+
root: {
|
|
20
|
+
color: {
|
|
21
|
+
active: string | undefined;
|
|
22
|
+
default: string | undefined;
|
|
23
|
+
hover: string | undefined;
|
|
24
|
+
};
|
|
25
|
+
focusRing: {
|
|
26
|
+
borderColor: string | undefined;
|
|
27
|
+
borderRadius: string | undefined;
|
|
28
|
+
borderWidth: string | undefined;
|
|
29
|
+
};
|
|
30
|
+
};
|
|
31
|
+
};
|
|
32
|
+
export declare function getNotificationBarStyles(style: FlashbarProps.Style): {
|
|
33
|
+
borderRadius: string | undefined;
|
|
34
|
+
borderWidth: string | undefined;
|
|
35
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"style.d.ts","sourceRoot":"","sources":["../../../src/flashbar/style.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7C,wBAAgB,yBAAyB,CAAC,KAAK,EAAE,aAAa,CAAC,KAAK,EAAE,IAAI,GAAE,MAAe;;;;;;;EAiC1F;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,aAAa,CAAC,KAAK,EAAE,IAAI,GAAE,MAAe;;;;;;;EAkB/E;AAED,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,aAAa,CAAC,KAAK,EAAE,IAAI,GAAE,MAAe;;;;;;;;;;;;;EAyCvF;AAED,wBAAgB,wBAAwB,CAAC,KAAK,EAAE,aAAa,CAAC,KAAK;;;EAwClE"}
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
+
import customCssProps from '../internal/generated/custom-css-properties';
|
|
4
|
+
export function getCollapsibleFlashStyles(style, type = 'info') {
|
|
5
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
|
|
6
|
+
const background = ((_b = (_a = style === null || style === void 0 ? void 0 : style.item) === null || _a === void 0 ? void 0 : _a.root) === null || _b === void 0 ? void 0 : _b.background) &&
|
|
7
|
+
(type === 'in-progress'
|
|
8
|
+
? (_d = (_c = style === null || style === void 0 ? void 0 : style.item) === null || _c === void 0 ? void 0 : _c.root) === null || _d === void 0 ? void 0 : _d.background.inProgress
|
|
9
|
+
: (_f = (_e = style === null || style === void 0 ? void 0 : style.item) === null || _e === void 0 ? void 0 : _e.root) === null || _f === void 0 ? void 0 : _f.background[type]);
|
|
10
|
+
const borderColor = ((_h = (_g = style === null || style === void 0 ? void 0 : style.item) === null || _g === void 0 ? void 0 : _g.root) === null || _h === void 0 ? void 0 : _h.borderColor) &&
|
|
11
|
+
(type === 'in-progress'
|
|
12
|
+
? (_k = (_j = style === null || style === void 0 ? void 0 : style.item) === null || _j === void 0 ? void 0 : _j.root) === null || _k === void 0 ? void 0 : _k.borderColor.inProgress
|
|
13
|
+
: (_m = (_l = style === null || style === void 0 ? void 0 : style.item) === null || _l === void 0 ? void 0 : _l.root) === null || _m === void 0 ? void 0 : _m.borderColor[type]);
|
|
14
|
+
const borderRadius = (_p = (_o = style === null || style === void 0 ? void 0 : style.item) === null || _o === void 0 ? void 0 : _o.root) === null || _p === void 0 ? void 0 : _p.borderRadius;
|
|
15
|
+
const borderWidth = (_r = (_q = style === null || style === void 0 ? void 0 : style.item) === null || _q === void 0 ? void 0 : _q.root) === null || _r === void 0 ? void 0 : _r.borderWidth;
|
|
16
|
+
const borderStyle = ((_t = (_s = style === null || style === void 0 ? void 0 : style.item) === null || _s === void 0 ? void 0 : _s.root) === null || _t === void 0 ? void 0 : _t.borderWidth) && 'solid';
|
|
17
|
+
const color = ((_v = (_u = style === null || style === void 0 ? void 0 : style.item) === null || _u === void 0 ? void 0 : _u.root) === null || _v === void 0 ? void 0 : _v.color) &&
|
|
18
|
+
(type === 'in-progress'
|
|
19
|
+
? (_x = (_w = style === null || style === void 0 ? void 0 : style.item) === null || _w === void 0 ? void 0 : _w.root) === null || _x === void 0 ? void 0 : _x.color.inProgress
|
|
20
|
+
: (_z = (_y = style === null || style === void 0 ? void 0 : style.item) === null || _y === void 0 ? void 0 : _y.root) === null || _z === void 0 ? void 0 : _z.color[type]);
|
|
21
|
+
return {
|
|
22
|
+
background,
|
|
23
|
+
borderColor,
|
|
24
|
+
borderRadius,
|
|
25
|
+
borderStyle,
|
|
26
|
+
borderWidth,
|
|
27
|
+
color,
|
|
28
|
+
};
|
|
29
|
+
}
|
|
30
|
+
export function getFlashStyles(style, type = 'info') {
|
|
31
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
32
|
+
const focusRingBorderColor = ((_c = (_b = (_a = style === null || style === void 0 ? void 0 : style.item) === null || _a === void 0 ? void 0 : _a.root) === null || _b === void 0 ? void 0 : _b.focusRing) === null || _c === void 0 ? void 0 : _c.borderColor) &&
|
|
33
|
+
(type === 'in-progress'
|
|
34
|
+
? style.item.root.focusRing.borderColor.inProgress
|
|
35
|
+
: style.item.root.focusRing.borderColor[type]);
|
|
36
|
+
return Object.assign(Object.assign(Object.assign({}, (style && getCollapsibleFlashStyles(style, type))), (((_e = (_d = style === null || style === void 0 ? void 0 : style.item) === null || _d === void 0 ? void 0 : _d.root) === null || _e === void 0 ? void 0 : _e.focusRing) && {
|
|
37
|
+
[customCssProps.styleFocusRingBorderColor]: focusRingBorderColor,
|
|
38
|
+
[customCssProps.styleFocusRingBorderRadius]: (_f = style.item.root.focusRing) === null || _f === void 0 ? void 0 : _f.borderRadius,
|
|
39
|
+
[customCssProps.styleFocusRingBorderWidth]: (_g = style.item.root.focusRing) === null || _g === void 0 ? void 0 : _g.borderWidth,
|
|
40
|
+
})), (((_k = (_j = (_h = style === null || style === void 0 ? void 0 : style.item) === null || _h === void 0 ? void 0 : _h.root) === null || _j === void 0 ? void 0 : _j.focusRing) === null || _k === void 0 ? void 0 : _k.borderRadius) && {
|
|
41
|
+
[customCssProps.styleFocusRingBorderRadius]: style.item.root.focusRing.borderRadius,
|
|
42
|
+
}));
|
|
43
|
+
}
|
|
44
|
+
export function getDismissButtonStyles(style, type = 'info') {
|
|
45
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
|
|
46
|
+
const activeColor = ((_c = (_b = (_a = style === null || style === void 0 ? void 0 : style.item) === null || _a === void 0 ? void 0 : _a.dismissButton) === null || _b === void 0 ? void 0 : _b.color) === null || _c === void 0 ? void 0 : _c.active) &&
|
|
47
|
+
(type === 'in-progress'
|
|
48
|
+
? style.item.dismissButton.color.active.inProgress
|
|
49
|
+
: style.item.dismissButton.color.active[type]);
|
|
50
|
+
const defaultColor = ((_f = (_e = (_d = style === null || style === void 0 ? void 0 : style.item) === null || _d === void 0 ? void 0 : _d.dismissButton) === null || _e === void 0 ? void 0 : _e.color) === null || _f === void 0 ? void 0 : _f.default) &&
|
|
51
|
+
(type === 'in-progress'
|
|
52
|
+
? style.item.dismissButton.color.default.inProgress
|
|
53
|
+
: style.item.dismissButton.color.default[type]);
|
|
54
|
+
const hoverColor = ((_j = (_h = (_g = style === null || style === void 0 ? void 0 : style.item) === null || _g === void 0 ? void 0 : _g.dismissButton) === null || _h === void 0 ? void 0 : _h.color) === null || _j === void 0 ? void 0 : _j.hover) &&
|
|
55
|
+
(type === 'in-progress'
|
|
56
|
+
? style.item.dismissButton.color.hover.inProgress
|
|
57
|
+
: style.item.dismissButton.color.hover[type]);
|
|
58
|
+
const focusRingBorderColor = ((_m = (_l = (_k = style === null || style === void 0 ? void 0 : style.item) === null || _k === void 0 ? void 0 : _k.dismissButton) === null || _l === void 0 ? void 0 : _l.focusRing) === null || _m === void 0 ? void 0 : _m.borderColor) &&
|
|
59
|
+
(type === 'in-progress'
|
|
60
|
+
? style.item.dismissButton.focusRing.borderColor.inProgress
|
|
61
|
+
: style.item.dismissButton.focusRing.borderColor[type]);
|
|
62
|
+
return {
|
|
63
|
+
root: {
|
|
64
|
+
color: {
|
|
65
|
+
active: activeColor,
|
|
66
|
+
default: defaultColor,
|
|
67
|
+
hover: hoverColor,
|
|
68
|
+
},
|
|
69
|
+
focusRing: {
|
|
70
|
+
borderColor: focusRingBorderColor,
|
|
71
|
+
borderRadius: (_q = (_p = (_o = style === null || style === void 0 ? void 0 : style.item) === null || _o === void 0 ? void 0 : _o.dismissButton) === null || _p === void 0 ? void 0 : _p.focusRing) === null || _q === void 0 ? void 0 : _q.borderRadius,
|
|
72
|
+
borderWidth: (_t = (_s = (_r = style === null || style === void 0 ? void 0 : style.item) === null || _r === void 0 ? void 0 : _r.dismissButton) === null || _s === void 0 ? void 0 : _s.focusRing) === null || _t === void 0 ? void 0 : _t.borderWidth,
|
|
73
|
+
},
|
|
74
|
+
},
|
|
75
|
+
};
|
|
76
|
+
}
|
|
77
|
+
export function getNotificationBarStyles(style) {
|
|
78
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20;
|
|
79
|
+
return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ borderRadius: (_b = (_a = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _a === void 0 ? void 0 : _a.root) === null || _b === void 0 ? void 0 : _b.borderRadius, borderWidth: (_d = (_c = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _c === void 0 ? void 0 : _c.root) === null || _d === void 0 ? void 0 : _d.borderWidth }, (((_g = (_f = (_e = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _e === void 0 ? void 0 : _e.root) === null || _f === void 0 ? void 0 : _f.background) === null || _g === void 0 ? void 0 : _g.active) && {
|
|
80
|
+
[customCssProps.styleBackgroundActive]: style.notificationBar.root.background.active,
|
|
81
|
+
})), (((_k = (_j = (_h = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _h === void 0 ? void 0 : _h.root) === null || _j === void 0 ? void 0 : _j.background) === null || _k === void 0 ? void 0 : _k.default) && {
|
|
82
|
+
[customCssProps.styleBackgroundDefault]: style.notificationBar.root.background.default,
|
|
83
|
+
})), (((_o = (_m = (_l = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _l === void 0 ? void 0 : _l.root) === null || _m === void 0 ? void 0 : _m.background) === null || _o === void 0 ? void 0 : _o.hover) && {
|
|
84
|
+
[customCssProps.styleBackgroundHover]: style.notificationBar.root.background.hover,
|
|
85
|
+
})), (((_r = (_q = (_p = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _p === void 0 ? void 0 : _p.root) === null || _q === void 0 ? void 0 : _q.borderColor) === null || _r === void 0 ? void 0 : _r.active) && {
|
|
86
|
+
[customCssProps.styleBorderColorActive]: style.notificationBar.root.borderColor.active,
|
|
87
|
+
})), (((_u = (_t = (_s = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _s === void 0 ? void 0 : _s.root) === null || _t === void 0 ? void 0 : _t.borderColor) === null || _u === void 0 ? void 0 : _u.default) && {
|
|
88
|
+
[customCssProps.styleBorderColorDefault]: style.notificationBar.root.borderColor.default,
|
|
89
|
+
})), (((_x = (_w = (_v = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _v === void 0 ? void 0 : _v.root) === null || _w === void 0 ? void 0 : _w.borderColor) === null || _x === void 0 ? void 0 : _x.hover) && {
|
|
90
|
+
[customCssProps.styleBorderColorHover]: style.notificationBar.root.borderColor.hover,
|
|
91
|
+
})), (((_0 = (_z = (_y = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _y === void 0 ? void 0 : _y.root) === null || _z === void 0 ? void 0 : _z.color) === null || _0 === void 0 ? void 0 : _0.active) && {
|
|
92
|
+
[customCssProps.styleColorActive]: style.notificationBar.root.color.active,
|
|
93
|
+
})), (((_3 = (_2 = (_1 = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _1 === void 0 ? void 0 : _1.root) === null || _2 === void 0 ? void 0 : _2.color) === null || _3 === void 0 ? void 0 : _3.default) && {
|
|
94
|
+
[customCssProps.styleColorDefault]: style.notificationBar.root.color.default,
|
|
95
|
+
})), (((_6 = (_5 = (_4 = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _4 === void 0 ? void 0 : _4.root) === null || _5 === void 0 ? void 0 : _5.color) === null || _6 === void 0 ? void 0 : _6.hover) && {
|
|
96
|
+
[customCssProps.styleColorHover]: style.notificationBar.root.color.hover,
|
|
97
|
+
})), (((_8 = (_7 = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _7 === void 0 ? void 0 : _7.expandButton) === null || _8 === void 0 ? void 0 : _8.focusRing) && {
|
|
98
|
+
[customCssProps.styleFocusRingBorderColor]: (_11 = (_10 = (_9 = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _9 === void 0 ? void 0 : _9.expandButton) === null || _10 === void 0 ? void 0 : _10.focusRing) === null || _11 === void 0 ? void 0 : _11.borderColor,
|
|
99
|
+
[customCssProps.styleFocusRingBorderRadius]: (_14 = (_13 = (_12 = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _12 === void 0 ? void 0 : _12.expandButton) === null || _13 === void 0 ? void 0 : _13.focusRing) === null || _14 === void 0 ? void 0 : _14.borderRadius,
|
|
100
|
+
[customCssProps.styleFocusRingBorderWidth]: (_17 = (_16 = (_15 = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _15 === void 0 ? void 0 : _15.expandButton) === null || _16 === void 0 ? void 0 : _16.focusRing) === null || _17 === void 0 ? void 0 : _17.borderWidth,
|
|
101
|
+
})), (((_20 = (_19 = (_18 = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _18 === void 0 ? void 0 : _18.expandButton) === null || _19 === void 0 ? void 0 : _19.focusRing) === null || _20 === void 0 ? void 0 : _20.borderRadius) && {
|
|
102
|
+
[customCssProps.styleFocusRingBorderRadius]: style.notificationBar.expandButton.focusRing.borderRadius,
|
|
103
|
+
}));
|
|
104
|
+
}
|
|
105
|
+
//# sourceMappingURL=style.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"style.js","sourceRoot":"","sources":["../../../src/flashbar/style.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 customCssProps from '../internal/generated/custom-css-properties';\nimport { FlashbarProps } from './interfaces';\n\nexport function getCollapsibleFlashStyles(style: FlashbarProps.Style, type: string = 'info') {\n const background =\n style?.item?.root?.background &&\n (type === 'in-progress'\n ? style?.item?.root?.background.inProgress\n : style?.item?.root?.background[type as keyof typeof style.item.root.background]);\n\n const borderColor =\n style?.item?.root?.borderColor &&\n (type === 'in-progress'\n ? style?.item?.root?.borderColor.inProgress\n : style?.item?.root?.borderColor[type as keyof typeof style.item.root.borderColor]);\n\n const borderRadius = style?.item?.root?.borderRadius;\n\n const borderWidth = style?.item?.root?.borderWidth;\n\n const borderStyle = style?.item?.root?.borderWidth && 'solid';\n\n const color =\n style?.item?.root?.color &&\n (type === 'in-progress'\n ? style?.item?.root?.color.inProgress\n : style?.item?.root?.color[type as keyof typeof style.item.root.color]);\n\n return {\n background,\n borderColor,\n borderRadius,\n borderStyle,\n borderWidth,\n color,\n };\n}\n\nexport function getFlashStyles(style: FlashbarProps.Style, type: string = 'info') {\n const focusRingBorderColor =\n style?.item?.root?.focusRing?.borderColor &&\n (type === 'in-progress'\n ? style.item.root.focusRing.borderColor.inProgress\n : style.item.root.focusRing.borderColor[type as keyof typeof style.item.root.focusRing.borderColor]);\n\n return {\n ...(style && getCollapsibleFlashStyles(style, type)),\n ...(style?.item?.root?.focusRing && {\n [customCssProps.styleFocusRingBorderColor]: focusRingBorderColor,\n [customCssProps.styleFocusRingBorderRadius]: style.item.root.focusRing?.borderRadius,\n [customCssProps.styleFocusRingBorderWidth]: style.item.root.focusRing?.borderWidth,\n }),\n ...(style?.item?.root?.focusRing?.borderRadius && {\n [customCssProps.styleFocusRingBorderRadius]: style.item.root.focusRing.borderRadius,\n }),\n };\n}\n\nexport function getDismissButtonStyles(style: FlashbarProps.Style, type: string = 'info') {\n const activeColor =\n style?.item?.dismissButton?.color?.active &&\n (type === 'in-progress'\n ? style.item.dismissButton.color.active.inProgress\n : style.item.dismissButton.color.active[type as keyof typeof style.item.dismissButton.color.active]);\n\n const defaultColor =\n style?.item?.dismissButton?.color?.default &&\n (type === 'in-progress'\n ? style.item.dismissButton.color.default.inProgress\n : style.item.dismissButton.color.default[type as keyof typeof style.item.dismissButton.color.default]);\n\n const hoverColor =\n style?.item?.dismissButton?.color?.hover &&\n (type === 'in-progress'\n ? style.item.dismissButton.color.hover.inProgress\n : style.item.dismissButton.color.hover[type as keyof typeof style.item.dismissButton.color.hover]);\n\n const focusRingBorderColor =\n style?.item?.dismissButton?.focusRing?.borderColor &&\n (type === 'in-progress'\n ? style.item.dismissButton.focusRing.borderColor.inProgress\n : style.item.dismissButton.focusRing.borderColor[\n type as keyof typeof style.item.dismissButton.focusRing.borderColor\n ]);\n\n return {\n root: {\n color: {\n active: activeColor,\n default: defaultColor,\n hover: hoverColor,\n },\n focusRing: {\n borderColor: focusRingBorderColor,\n borderRadius: style?.item?.dismissButton?.focusRing?.borderRadius,\n borderWidth: style?.item?.dismissButton?.focusRing?.borderWidth,\n },\n },\n };\n}\n\nexport function getNotificationBarStyles(style: FlashbarProps.Style) {\n return {\n borderRadius: style?.notificationBar?.root?.borderRadius,\n borderWidth: style?.notificationBar?.root?.borderWidth,\n ...(style?.notificationBar?.root?.background?.active && {\n [customCssProps.styleBackgroundActive]: style.notificationBar.root.background.active,\n }),\n ...(style?.notificationBar?.root?.background?.default && {\n [customCssProps.styleBackgroundDefault]: style.notificationBar.root.background.default,\n }),\n ...(style?.notificationBar?.root?.background?.hover && {\n [customCssProps.styleBackgroundHover]: style.notificationBar.root.background.hover,\n }),\n ...(style?.notificationBar?.root?.borderColor?.active && {\n [customCssProps.styleBorderColorActive]: style.notificationBar.root.borderColor.active,\n }),\n ...(style?.notificationBar?.root?.borderColor?.default && {\n [customCssProps.styleBorderColorDefault]: style.notificationBar.root.borderColor.default,\n }),\n ...(style?.notificationBar?.root?.borderColor?.hover && {\n [customCssProps.styleBorderColorHover]: style.notificationBar.root.borderColor.hover,\n }),\n ...(style?.notificationBar?.root?.color?.active && {\n [customCssProps.styleColorActive]: style.notificationBar.root.color.active,\n }),\n ...(style?.notificationBar?.root?.color?.default && {\n [customCssProps.styleColorDefault]: style.notificationBar.root.color.default,\n }),\n ...(style?.notificationBar?.root?.color?.hover && {\n [customCssProps.styleColorHover]: style.notificationBar.root.color.hover,\n }),\n ...(style?.notificationBar?.expandButton?.focusRing && {\n [customCssProps.styleFocusRingBorderColor]: style?.notificationBar?.expandButton?.focusRing?.borderColor,\n [customCssProps.styleFocusRingBorderRadius]: style?.notificationBar?.expandButton?.focusRing?.borderRadius,\n [customCssProps.styleFocusRingBorderWidth]: style?.notificationBar?.expandButton?.focusRing?.borderWidth,\n }),\n ...(style?.notificationBar?.expandButton?.focusRing?.borderRadius && {\n [customCssProps.styleFocusRingBorderRadius]: style.notificationBar.expandButton.focusRing.borderRadius,\n }),\n };\n}\n"]}
|
package/flashbar/styles.css.js
CHANGED
|
@@ -1,55 +1,55 @@
|
|
|
1
1
|
|
|
2
2
|
import './styles.scoped.css';
|
|
3
3
|
export default {
|
|
4
|
-
"flash-with-motion": "awsui_flash-with-
|
|
5
|
-
"enter": "
|
|
6
|
-
"flash-body": "awsui_flash-
|
|
7
|
-
"flash-message": "awsui_flash-
|
|
8
|
-
"flash-header": "awsui_flash-
|
|
9
|
-
"flash-content": "awsui_flash-
|
|
10
|
-
"action-button-wrapper": "awsui_action-button-
|
|
11
|
-
"dismiss-button-wrapper": "awsui_dismiss-button-
|
|
12
|
-
"flash-icon": "awsui_flash-
|
|
13
|
-
"entering": "
|
|
14
|
-
"entered": "
|
|
15
|
-
"exiting": "
|
|
16
|
-
"stack": "
|
|
17
|
-
"animation-running": "awsui_animation-
|
|
18
|
-
"item": "
|
|
19
|
-
"flash-list-item": "awsui_flash-list-
|
|
20
|
-
"notification-bar": "awsui_notification-
|
|
21
|
-
"collapsed": "
|
|
22
|
-
"animation-ready": "awsui_animation-
|
|
23
|
-
"expanded-only": "awsui_expanded-
|
|
24
|
-
"expanded": "
|
|
25
|
-
"flash": "
|
|
26
|
-
"collapsible": "
|
|
27
|
-
"short-list": "awsui_short-
|
|
28
|
-
"visual-refresh": "awsui_visual-
|
|
29
|
-
"status": "
|
|
30
|
-
"header": "
|
|
31
|
-
"item-count": "awsui_item-
|
|
32
|
-
"button": "
|
|
33
|
-
"type-count": "awsui_type-
|
|
34
|
-
"count-number": "awsui_count-
|
|
35
|
-
"icon": "
|
|
36
|
-
"floating": "
|
|
37
|
-
"flashbar": "
|
|
38
|
-
"initial-hidden": "awsui_initial-
|
|
39
|
-
"flash-list": "awsui_flash-
|
|
40
|
-
"flash-focus-container": "awsui_flash-focus-
|
|
41
|
-
"flash-text": "awsui_flash-
|
|
42
|
-
"hidden": "
|
|
43
|
-
"header-replacement": "awsui_header-
|
|
44
|
-
"content-replacement": "awsui_content-
|
|
45
|
-
"dismiss-button": "awsui_dismiss-
|
|
46
|
-
"action-wrapped": "awsui_action-
|
|
47
|
-
"action-button": "awsui_action-
|
|
48
|
-
"action-slot": "awsui_action-
|
|
49
|
-
"flash-type-success": "awsui_flash-type-
|
|
50
|
-
"flash-type-error": "awsui_flash-type-
|
|
51
|
-
"flash-type-info": "awsui_flash-type-
|
|
52
|
-
"flash-type-in-progress": "awsui_flash-type-in-
|
|
53
|
-
"flash-type-warning": "awsui_flash-type-
|
|
4
|
+
"flash-with-motion": "awsui_flash-with-motion_1q84n_1iiuy_157",
|
|
5
|
+
"enter": "awsui_enter_1q84n_1iiuy_157",
|
|
6
|
+
"flash-body": "awsui_flash-body_1q84n_1iiuy_171",
|
|
7
|
+
"flash-message": "awsui_flash-message_1q84n_1iiuy_171",
|
|
8
|
+
"flash-header": "awsui_flash-header_1q84n_1iiuy_171",
|
|
9
|
+
"flash-content": "awsui_flash-content_1q84n_1iiuy_172",
|
|
10
|
+
"action-button-wrapper": "awsui_action-button-wrapper_1q84n_1iiuy_173",
|
|
11
|
+
"dismiss-button-wrapper": "awsui_dismiss-button-wrapper_1q84n_1iiuy_174",
|
|
12
|
+
"flash-icon": "awsui_flash-icon_1q84n_1iiuy_197",
|
|
13
|
+
"entering": "awsui_entering_1q84n_1iiuy_210",
|
|
14
|
+
"entered": "awsui_entered_1q84n_1iiuy_231",
|
|
15
|
+
"exiting": "awsui_exiting_1q84n_1iiuy_336",
|
|
16
|
+
"stack": "awsui_stack_1q84n_1iiuy_370",
|
|
17
|
+
"animation-running": "awsui_animation-running_1q84n_1iiuy_370",
|
|
18
|
+
"item": "awsui_item_1q84n_1iiuy_370",
|
|
19
|
+
"flash-list-item": "awsui_flash-list-item_1q84n_1iiuy_371",
|
|
20
|
+
"notification-bar": "awsui_notification-bar_1q84n_1iiuy_372",
|
|
21
|
+
"collapsed": "awsui_collapsed_1q84n_1iiuy_392",
|
|
22
|
+
"animation-ready": "awsui_animation-ready_1q84n_1iiuy_392",
|
|
23
|
+
"expanded-only": "awsui_expanded-only_1q84n_1iiuy_392",
|
|
24
|
+
"expanded": "awsui_expanded_1q84n_1iiuy_392",
|
|
25
|
+
"flash": "awsui_flash_1q84n_1iiuy_157",
|
|
26
|
+
"collapsible": "awsui_collapsible_1q84n_1iiuy_448",
|
|
27
|
+
"short-list": "awsui_short-list_1q84n_1iiuy_454",
|
|
28
|
+
"visual-refresh": "awsui_visual-refresh_1q84n_1iiuy_454",
|
|
29
|
+
"status": "awsui_status_1q84n_1iiuy_601",
|
|
30
|
+
"header": "awsui_header_1q84n_1iiuy_601",
|
|
31
|
+
"item-count": "awsui_item-count_1q84n_1iiuy_602",
|
|
32
|
+
"button": "awsui_button_1q84n_1iiuy_603",
|
|
33
|
+
"type-count": "awsui_type-count_1q84n_1iiuy_636",
|
|
34
|
+
"count-number": "awsui_count-number_1q84n_1iiuy_636",
|
|
35
|
+
"icon": "awsui_icon_1q84n_1iiuy_674",
|
|
36
|
+
"floating": "awsui_floating_1q84n_1iiuy_715",
|
|
37
|
+
"flashbar": "awsui_flashbar_1q84n_1iiuy_719",
|
|
38
|
+
"initial-hidden": "awsui_initial-hidden_1q84n_1iiuy_778",
|
|
39
|
+
"flash-list": "awsui_flash-list_1q84n_1iiuy_371",
|
|
40
|
+
"flash-focus-container": "awsui_flash-focus-container_1q84n_1iiuy_802",
|
|
41
|
+
"flash-text": "awsui_flash-text_1q84n_1iiuy_832",
|
|
42
|
+
"hidden": "awsui_hidden_1q84n_1iiuy_851",
|
|
43
|
+
"header-replacement": "awsui_header-replacement_1q84n_1iiuy_856",
|
|
44
|
+
"content-replacement": "awsui_content-replacement_1q84n_1iiuy_861",
|
|
45
|
+
"dismiss-button": "awsui_dismiss-button_1q84n_1iiuy_174",
|
|
46
|
+
"action-wrapped": "awsui_action-wrapped_1q84n_1iiuy_879",
|
|
47
|
+
"action-button": "awsui_action-button_1q84n_1iiuy_173",
|
|
48
|
+
"action-slot": "awsui_action-slot_1q84n_1iiuy_886",
|
|
49
|
+
"flash-type-success": "awsui_flash-type-success_1q84n_1iiuy_890",
|
|
50
|
+
"flash-type-error": "awsui_flash-type-error_1q84n_1iiuy_894",
|
|
51
|
+
"flash-type-info": "awsui_flash-type-info_1q84n_1iiuy_898",
|
|
52
|
+
"flash-type-in-progress": "awsui_flash-type-in-progress_1q84n_1iiuy_899",
|
|
53
|
+
"flash-type-warning": "awsui_flash-type-warning_1q84n_1iiuy_903"
|
|
54
54
|
};
|
|
55
55
|
|