@cloudscape-design/components-themeable 3.0.1009 → 3.0.1011
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/lib/internal/manifest.json +1 -1
- package/lib/internal/scss/app-layout/visual-refresh-toolbar/drawer/styles.scss +0 -1
- package/lib/internal/scss/button/styles.scss +4 -1
- package/lib/internal/scss/flashbar/collapsible.scss +9 -6
- package/lib/internal/scss/flashbar/styles.scss +10 -1
- package/lib/internal/scss/internal/base-component/styles.scss +5 -0
- package/lib/internal/scss/internal/generated/custom-css-properties/index.scss +3 -0
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/styles.css.js +17 -17
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/styles.scoped.css +35 -36
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/styles.selectors.js +17 -17
- package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/index.js +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/index.js.map +1 -1
- package/lib/internal/template/button/styles.css.js +22 -22
- package/lib/internal/template/button/styles.scoped.css +74 -74
- package/lib/internal/template/button/styles.selectors.js +22 -22
- package/lib/internal/template/flashbar/collapsible-flashbar.d.ts +9 -1
- package/lib/internal/template/flashbar/collapsible-flashbar.d.ts.map +1 -1
- package/lib/internal/template/flashbar/collapsible-flashbar.js +54 -8
- package/lib/internal/template/flashbar/collapsible-flashbar.js.map +1 -1
- package/lib/internal/template/flashbar/flash.d.ts +1 -0
- package/lib/internal/template/flashbar/flash.d.ts.map +1 -1
- package/lib/internal/template/flashbar/flash.js +28 -5
- package/lib/internal/template/flashbar/flash.js.map +1 -1
- package/lib/internal/template/flashbar/interfaces.d.ts +71 -0
- package/lib/internal/template/flashbar/interfaces.d.ts.map +1 -1
- package/lib/internal/template/flashbar/interfaces.js.map +1 -1
- package/lib/internal/template/flashbar/non-collapsible-flashbar.d.ts +1 -1
- package/lib/internal/template/flashbar/non-collapsible-flashbar.d.ts.map +1 -1
- package/lib/internal/template/flashbar/non-collapsible-flashbar.js +2 -2
- package/lib/internal/template/flashbar/non-collapsible-flashbar.js.map +1 -1
- package/lib/internal/template/flashbar/styles.css.js +50 -50
- package/lib/internal/template/flashbar/styles.scoped.css +162 -158
- package/lib/internal/template/flashbar/styles.selectors.js +50 -50
- package/lib/internal/template/internal/base-component/styles.scoped.css +3 -0
- package/lib/internal/template/internal/environment.d.ts +1 -0
- package/lib/internal/template/internal/environment.js +2 -1
- package/lib/internal/template/internal/environment.json +2 -1
- package/lib/internal/template/internal/hooks/use-base-component/index.d.ts.map +1 -1
- package/lib/internal/template/internal/hooks/use-base-component/index.js +2 -0
- package/lib/internal/template/internal/hooks/use-base-component/index.js.map +1 -1
- package/lib/internal/template/internal/hooks/use-base-component/styles-check.d.ts +4 -0
- package/lib/internal/template/internal/hooks/use-base-component/styles-check.d.ts.map +1 -0
- package/lib/internal/template/internal/hooks/use-base-component/styles-check.js +46 -0
- package/lib/internal/template/internal/hooks/use-base-component/styles-check.js.map +1 -0
- package/lib/internal/template/internal/metrics.d.ts.map +1 -1
- package/lib/internal/template/internal/metrics.js +2 -2
- package/lib/internal/template/internal/metrics.js.map +1 -1
- package/lib/internal/template/prompt-input/internal.d.ts.map +1 -1
- package/lib/internal/template/prompt-input/internal.js +3 -3
- package/lib/internal/template/prompt-input/internal.js.map +1 -1
- package/lib/internal/template/segmented-control/interfaces.d.ts +2 -1
- package/lib/internal/template/segmented-control/interfaces.d.ts.map +1 -1
- package/lib/internal/template/segmented-control/interfaces.js.map +1 -1
- package/package.json +1 -1
|
@@ -26,7 +26,7 @@ import styles from './styles.css.js';
|
|
|
26
26
|
const maxNonCollapsibleItems = 1;
|
|
27
27
|
const resizeListenerThrottleDelay = 100;
|
|
28
28
|
export default function CollapsibleFlashbar(_a) {
|
|
29
|
-
var { items } = _a, restProps = __rest(_a, ["items"]);
|
|
29
|
+
var { items, style } = _a, restProps = __rest(_a, ["items", "style"]);
|
|
30
30
|
const [enteringItems, setEnteringItems] = useState([]);
|
|
31
31
|
const [exitingItems, setExitingItems] = useState([]);
|
|
32
32
|
const [isFlashbarStackExpanded, setIsFlashbarStackExpanded] = useState(false);
|
|
@@ -158,6 +158,28 @@ export default function CollapsibleFlashbar(_a) {
|
|
|
158
158
|
const showInnerContent = (item) => isFlashbarStackExpanded || hasLeft(item) || ('expandedIndex' in item && item.expandedIndex === 0);
|
|
159
159
|
const shouldUseStandardAnimation = (item, index) => index === 0 && hasEnteredOrLeft(item);
|
|
160
160
|
const getAnimationElementId = (item) => `flash-${getItemId(item)}`;
|
|
161
|
+
const getNotificationBarStyles = () => {
|
|
162
|
+
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;
|
|
163
|
+
return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ borderRadius: (_a = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _a === void 0 ? void 0 : _a.root.borderRadius, borderWidth: (_b = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _b === void 0 ? void 0 : _b.root.borderWidth }, (((_e = (_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.background) === null || _e === void 0 ? void 0 : _e.active) && {
|
|
164
|
+
[customCssProps.styleBackgroundActive]: style.notificationBar.root.background.active,
|
|
165
|
+
})), (((_h = (_g = (_f = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _f === void 0 ? void 0 : _f.root) === null || _g === void 0 ? void 0 : _g.background) === null || _h === void 0 ? void 0 : _h.default) && {
|
|
166
|
+
[customCssProps.styleBackgroundDefault]: style.notificationBar.root.background.default,
|
|
167
|
+
})), (((_l = (_k = (_j = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _j === void 0 ? void 0 : _j.root) === null || _k === void 0 ? void 0 : _k.background) === null || _l === void 0 ? void 0 : _l.hover) && {
|
|
168
|
+
[customCssProps.styleBackgroundHover]: style.notificationBar.root.background.hover,
|
|
169
|
+
})), (((_p = (_o = (_m = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _m === void 0 ? void 0 : _m.root) === null || _o === void 0 ? void 0 : _o.borderColor) === null || _p === void 0 ? void 0 : _p.active) && {
|
|
170
|
+
[customCssProps.styleBorderColorActive]: style.notificationBar.root.borderColor.active,
|
|
171
|
+
})), (((_s = (_r = (_q = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _q === void 0 ? void 0 : _q.root) === null || _r === void 0 ? void 0 : _r.borderColor) === null || _s === void 0 ? void 0 : _s.default) && {
|
|
172
|
+
[customCssProps.styleBorderColorDefault]: style.notificationBar.root.borderColor.default,
|
|
173
|
+
})), (((_v = (_u = (_t = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _t === void 0 ? void 0 : _t.root) === null || _u === void 0 ? void 0 : _u.borderColor) === null || _v === void 0 ? void 0 : _v.hover) && {
|
|
174
|
+
[customCssProps.styleBorderColorHover]: style.notificationBar.root.borderColor.hover,
|
|
175
|
+
})), (((_y = (_x = (_w = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _w === void 0 ? void 0 : _w.root) === null || _x === void 0 ? void 0 : _x.color) === null || _y === void 0 ? void 0 : _y.active) && {
|
|
176
|
+
[customCssProps.styleColorActive]: style.notificationBar.root.color.active,
|
|
177
|
+
})), (((_1 = (_0 = (_z = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _z === void 0 ? void 0 : _z.root) === null || _0 === void 0 ? void 0 : _0.color) === null || _1 === void 0 ? void 0 : _1.default) && {
|
|
178
|
+
[customCssProps.styleColorDefault]: style.notificationBar.root.color.default,
|
|
179
|
+
})), (((_4 = (_3 = (_2 = style === null || style === void 0 ? void 0 : style.notificationBar) === null || _2 === void 0 ? void 0 : _2.root) === null || _3 === void 0 ? void 0 : _3.color) === null || _4 === void 0 ? void 0 : _4.hover) && {
|
|
180
|
+
[customCssProps.styleColorHover]: style.notificationBar.root.color.hover,
|
|
181
|
+
}));
|
|
182
|
+
};
|
|
161
183
|
const renderList = () => (React.createElement("ul", { ref: listElementRef, className: clsx(styles['flash-list'], isFlashbarStackExpanded ? styles.expanded : styles.collapsed, transitioning && styles['animation-running'], initialAnimationState && styles['animation-ready'], isVisualRefresh && styles['visual-refresh']), id: flashbarElementId, "aria-label": ariaLabel, "aria-describedby": isCollapsible ? itemCountElementId : undefined, style: !isFlashbarStackExpanded || transitioning
|
|
162
184
|
? {
|
|
163
185
|
[customCssProps.flashbarStackDepth]: stackDepth,
|
|
@@ -181,20 +203,18 @@ export default function CollapsibleFlashbar(_a) {
|
|
|
181
203
|
else {
|
|
182
204
|
collapsedItemRefs.current[getAnimationElementId(item)] = element;
|
|
183
205
|
}
|
|
184
|
-
}, style: !isFlashbarStackExpanded || transitioning
|
|
185
|
-
?
|
|
186
|
-
|
|
187
|
-
}
|
|
188
|
-
: undefined, key: getItemId(item) }, getAnalyticsMetadataAttribute(getItemAnalyticsMetadata(index + 1, item.type || 'info', item.id))), showInnerContent(item) && (React.createElement(Flash
|
|
206
|
+
}, style: Object.assign(Object.assign({}, (index > 0 && !isFlashbarStackExpanded && style && getItemStyles(style, item.type))), ((!isFlashbarStackExpanded || transitioning) && {
|
|
207
|
+
[customCssProps.flashbarStackIndex]: (_c = (_b = item.collapsedIndex) !== null && _b !== void 0 ? _b : item.expandedIndex) !== null && _c !== void 0 ? _c : index,
|
|
208
|
+
})), key: getItemId(item) }, getAnalyticsMetadataAttribute(getItemAnalyticsMetadata(index + 1, item.type || 'info', item.id))), showInnerContent(item) && (React.createElement(Flash
|
|
189
209
|
// eslint-disable-next-line react/forbid-component-props
|
|
190
210
|
, Object.assign({
|
|
191
211
|
// eslint-disable-next-line react/forbid-component-props
|
|
192
|
-
className: clsx(animateFlash && styles['flash-with-motion'], isVisualRefresh && styles['flash-refresh']), key: getItemId(item), ref: shouldUseStandardAnimation(item, index) ? transitionRootElement : undefined, transitionState: shouldUseStandardAnimation(item, index) ? state : undefined, i18nStrings: iconAriaLabels }, item)))));
|
|
212
|
+
className: clsx(animateFlash && styles['flash-with-motion'], isVisualRefresh && styles['flash-refresh']), key: getItemId(item), ref: shouldUseStandardAnimation(item, index) ? transitionRootElement : undefined, transitionState: shouldUseStandardAnimation(item, index) ? state : undefined, i18nStrings: iconAriaLabels, style: style }, item)))));
|
|
193
213
|
}))))));
|
|
194
214
|
return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.flashbar, styles.stack, isCollapsible && styles.collapsible, items.length === 2 && styles['short-list'], isFlashbarStackExpanded && styles.expanded, isVisualRefresh && styles['visual-refresh']), ref: mergedRef }, getAnalyticsMetadataAttribute(getComponentsAnalyticsMetadata(items.length, true, isFlashbarStackExpanded))),
|
|
195
215
|
isFlashbarStackExpanded && renderList(),
|
|
196
216
|
isCollapsible && (React.createElement("div", Object.assign({ className: clsx(styles['notification-bar'], isVisualRefresh && styles['visual-refresh'], isFlashbarStackExpanded ? styles.expanded : styles.collapsed, transitioning && styles['animation-running'], items.length === 2 && styles['short-list'], getVisualContextClassname('flashbar') // Visual context is needed for focus ring to be white
|
|
197
|
-
), onClick: toggleCollapseExpand, ref: notificationBarRef }, getAnalyticsMetadataAttribute({
|
|
217
|
+
), onClick: toggleCollapseExpand, ref: notificationBarRef, style: Object.assign({}, getNotificationBarStyles()) }, getAnalyticsMetadataAttribute({
|
|
198
218
|
action: !isFlashbarStackExpanded ? 'expand' : 'collapse',
|
|
199
219
|
detail: {
|
|
200
220
|
label: 'h2',
|
|
@@ -207,6 +227,32 @@ export default function CollapsibleFlashbar(_a) {
|
|
|
207
227
|
React.createElement(InternalIcon, { className: styles.icon, size: "normal", name: "angle-down" })))),
|
|
208
228
|
!isFlashbarStackExpanded && renderList()));
|
|
209
229
|
}
|
|
230
|
+
export const getItemStyles = (style, type = 'info') => {
|
|
231
|
+
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;
|
|
232
|
+
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) &&
|
|
233
|
+
(type === 'in-progress'
|
|
234
|
+
? (_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
|
|
235
|
+
: (_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]);
|
|
236
|
+
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) &&
|
|
237
|
+
(type === 'in-progress'
|
|
238
|
+
? (_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
|
|
239
|
+
: (_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]);
|
|
240
|
+
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;
|
|
241
|
+
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;
|
|
242
|
+
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';
|
|
243
|
+
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) &&
|
|
244
|
+
(type === 'in-progress'
|
|
245
|
+
? (_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
|
|
246
|
+
: (_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]);
|
|
247
|
+
return {
|
|
248
|
+
background,
|
|
249
|
+
borderColor,
|
|
250
|
+
borderRadius,
|
|
251
|
+
borderStyle,
|
|
252
|
+
borderWidth,
|
|
253
|
+
color,
|
|
254
|
+
};
|
|
255
|
+
};
|
|
210
256
|
const NotificationTypeCount = ({ iconName, label, count, }) => {
|
|
211
257
|
return (React.createElement("span", { className: styles['type-count'] },
|
|
212
258
|
React.createElement("span", { title: label },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"collapsible-flashbar.js","sourceRoot":"","sources":["../../../src/flashbar/collapsible-flashbar.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, { ReactNode, useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport { TransitionGroup } from 'react-transition-group';\nimport clsx from 'clsx';\n\nimport { findUpUntil } from '@cloudscape-design/component-toolkit/dom';\nimport { useUniqueId } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { useInternalI18n } from '../i18n/context';\nimport { IconProps } from '../icon/interfaces';\nimport InternalIcon from '../icon/internal';\nimport { animate, getDOMRects } from '../internal/animate';\nimport { Transition } from '../internal/components/transition';\nimport { getVisualContextClassname } from '../internal/components/visual-context';\nimport customCssProps from '../internal/generated/custom-css-properties';\nimport { useEffectOnUpdate } from '../internal/hooks/use-effect-on-update';\nimport { scrollElementIntoView } from '../internal/utils/scrollable-containers';\nimport { throttle } from '../internal/utils/throttle';\nimport {\n GeneratedAnalyticsMetadataFlashbarCollapse,\n GeneratedAnalyticsMetadataFlashbarExpand,\n} from './analytics-metadata/interfaces';\nimport { getComponentsAnalyticsMetadata, getItemAnalyticsMetadata } from './analytics-metadata/utils';\nimport { useFlashbar } from './common';\nimport { Flash, focusFlashById } from './flash';\nimport { FlashbarProps } from './interfaces';\nimport { counterTypes, getFlashTypeCount, getItemColor, getVisibleCollapsedItems, StackableItem } from './utils';\n\nimport styles from './styles.css.js';\n\n// If the number of items is equal or less than this value,\n// the toggle element will not be displayed and the Flashbar will look like a regular single-item Flashbar.\nconst maxNonCollapsibleItems = 1;\n\nconst resizeListenerThrottleDelay = 100;\n\nexport default function CollapsibleFlashbar({ items, ...restProps }: FlashbarProps) {\n const [enteringItems, setEnteringItems] = useState<ReadonlyArray<FlashbarProps.MessageDefinition>>([]);\n const [exitingItems, setExitingItems] = useState<ReadonlyArray<FlashbarProps.MessageDefinition>>([]);\n const [isFlashbarStackExpanded, setIsFlashbarStackExpanded] = useState(false);\n\n const getElementsToAnimate = useCallback(() => {\n const flashElements = isFlashbarStackExpanded ? expandedItemRefs.current : collapsedItemRefs.current;\n return { ...flashElements, notificationBar: notificationBarRef.current };\n }, [isFlashbarStackExpanded]);\n\n const prepareAnimations = useCallback(() => {\n const rects = getDOMRects(getElementsToAnimate());\n setInitialAnimationState(rects);\n }, [getElementsToAnimate]);\n\n const { baseProps, isReducedMotion, isVisualRefresh, mergedRef, ref } = useFlashbar({\n items,\n ...restProps,\n onItemsAdded: newItems => {\n setEnteringItems([...enteringItems, ...newItems]);\n },\n onItemsChanged: options => {\n // If not all items have ID, we can still animate collapse/expand transitions\n // because we can rely on each item's index in the original array,\n // but we can't do that when elements are added or removed, since the index changes.\n if (options?.allItemsHaveId && !options?.isReducedMotion) {\n prepareAnimations();\n }\n },\n onItemsRemoved: removedItems => {\n setExitingItems([...exitingItems, ...removedItems]);\n },\n });\n\n const collapsedItemRefs = useRef<Record<string, HTMLElement | null>>({});\n const expandedItemRefs = useRef<Record<string, HTMLElement | null>>({});\n const [initialAnimationState, setInitialAnimationState] = useState<Record<string, DOMRect> | null>(null);\n const listElementRef = useRef<HTMLUListElement | null>(null);\n const notificationBarRef = useRef<HTMLDivElement | null>(null);\n const [transitioning, setTransitioning] = useState(false);\n const flashbarElementId = useUniqueId('flashbar');\n const itemCountElementId = useUniqueId('item-count');\n\n if (items.length <= maxNonCollapsibleItems && isFlashbarStackExpanded) {\n setIsFlashbarStackExpanded(false);\n }\n\n const animateFlash = !isReducedMotion;\n\n function toggleCollapseExpand() {\n if (!isReducedMotion) {\n prepareAnimations();\n }\n setIsFlashbarStackExpanded(prev => !prev);\n }\n\n useLayoutEffect(() => {\n if (isFlashbarStackExpanded && items?.length) {\n const mostRecentItem = items[0];\n if (mostRecentItem.id !== undefined) {\n focusFlashById(ref.current, mostRecentItem.id);\n }\n }\n // Run this after expanding, but not every time the items change.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isFlashbarStackExpanded]);\n\n // When collapsing, scroll up if necessary to avoid losing track of the focused button\n useEffectOnUpdate(() => {\n if (!isFlashbarStackExpanded && notificationBarRef.current) {\n scrollElementIntoView(notificationBarRef.current);\n }\n }, [isFlashbarStackExpanded]);\n\n const updateBottomSpacing = useMemo(\n () =>\n throttle(() => {\n // Allow vertical space between Flashbar and page bottom only when the Flashbar is reaching the end of the page,\n // otherwise avoid spacing with eventual sticky elements below.\n const listElement = listElementRef?.current;\n const flashbar = listElement?.parentElement;\n if (listElement && flashbar) {\n // Make sure the bottom padding is present when we make the calculations,\n // then we might decide to remove it or not.\n flashbar.classList.remove(styles.floating);\n const windowHeight = window.innerHeight;\n // Take the parent region into account if using the App Layout, because it might have additional margins.\n // Otherwise we use the Flashbar component for this calculation.\n const outerElement = findUpUntil(flashbar, element => element.getAttribute('role') === 'region') || flashbar;\n const applySpacing =\n isFlashbarStackExpanded && Math.ceil(outerElement.getBoundingClientRect().bottom) >= windowHeight;\n if (!applySpacing) {\n flashbar.classList.add(styles.floating);\n }\n }\n }, resizeListenerThrottleDelay),\n [isFlashbarStackExpanded]\n );\n\n useLayoutEffect(() => {\n window.addEventListener('resize', updateBottomSpacing);\n return () => {\n window.removeEventListener('resize', updateBottomSpacing);\n updateBottomSpacing.cancel();\n };\n }, [updateBottomSpacing]);\n\n const { i18nStrings } = restProps;\n\n const i18n = useInternalI18n('flashbar');\n const ariaLabel = i18n('i18nStrings.ariaLabel', i18nStrings?.ariaLabel);\n const notificationBarText = i18n('i18nStrings.notificationBarText', i18nStrings?.notificationBarText);\n const notificationBarAriaLabel = i18n('i18nStrings.notificationBarAriaLabel', i18nStrings?.notificationBarAriaLabel);\n const iconAriaLabels = {\n errorIconAriaLabel: i18n('i18nStrings.errorIconAriaLabel', i18nStrings?.errorIconAriaLabel),\n inProgressIconAriaLabel: i18n('i18nStrings.inProgressIconAriaLabel', i18nStrings?.inProgressIconAriaLabel),\n infoIconAriaLabel: i18n('i18nStrings.infoIconAriaLabel', i18nStrings?.infoIconAriaLabel),\n successIconAriaLabel: i18n('i18nStrings.successIconAriaLabel', i18nStrings?.successIconAriaLabel),\n warningIconAriaLabel: i18n('i18nStrings.warningIconAriaLabel', i18nStrings?.warningIconAriaLabel),\n };\n\n useLayoutEffect(() => {\n // When `useLayoutEffect` is called, the DOM is updated but has not been painted yet,\n // so it's a good moment to trigger animations that will make calculations based on old and new DOM state.\n // The old state is kept in `initialAnimationState`\n // and the new state can be retrieved from the current DOM elements.\n\n if (initialAnimationState) {\n updateBottomSpacing();\n\n animate({\n elements: getElementsToAnimate(),\n oldState: initialAnimationState,\n newElementInitialState: ({ top }) => ({ scale: 0.9, y: -0.2 * top }),\n onTransitionsEnd: () => setTransitioning(false),\n });\n\n setTransitioning(true);\n setInitialAnimationState(null);\n }\n }, [updateBottomSpacing, getElementsToAnimate, initialAnimationState, isFlashbarStackExpanded]);\n\n const isCollapsible = items.length > maxNonCollapsibleItems;\n\n const countByType = getFlashTypeCount(items);\n\n const numberOfColorsInStack = new Set(items.map(getItemColor)).size;\n const maxSlots = Math.max(numberOfColorsInStack, 3);\n const stackDepth = Math.min(maxSlots, items.length);\n\n const itemsToShow = isFlashbarStackExpanded\n ? items.map((item, index) => ({ ...item, expandedIndex: index }))\n : getVisibleCollapsedItems(items, stackDepth).map((item: StackableItem, index: number) => ({\n ...item,\n collapsedIndex: index,\n }));\n\n const getItemId = (item: StackableItem | FlashbarProps.MessageDefinition) =>\n item.id ?? (item as StackableItem).expandedIndex ?? 0;\n\n // This check allows us to use the standard \"enter\" Transition only when the notification was not existing before.\n // If instead it was moved to the top of the stack but was already present in the array\n // (e.g, after dismissing another notification),\n // we need to use different, more custom and more controlled animations.\n const hasEntered = (item: StackableItem | FlashbarProps.MessageDefinition) =>\n enteringItems.some(_item => _item.id && _item.id === item.id);\n const hasLeft = (item: StackableItem | FlashbarProps.MessageDefinition) => !('expandedIndex' in item);\n const hasEnteredOrLeft = (item: StackableItem | FlashbarProps.MessageDefinition) => hasEntered(item) || hasLeft(item);\n\n const showInnerContent = (item: StackableItem | FlashbarProps.MessageDefinition) =>\n isFlashbarStackExpanded || hasLeft(item) || ('expandedIndex' in item && item.expandedIndex === 0);\n\n const shouldUseStandardAnimation = (item: StackableItem, index: number) => index === 0 && hasEnteredOrLeft(item);\n\n const getAnimationElementId = (item: StackableItem) => `flash-${getItemId(item)}`;\n\n const renderList = () => (\n <ul\n ref={listElementRef}\n className={clsx(\n styles['flash-list'],\n isFlashbarStackExpanded ? styles.expanded : styles.collapsed,\n transitioning && styles['animation-running'],\n initialAnimationState && styles['animation-ready'],\n isVisualRefresh && styles['visual-refresh']\n )}\n id={flashbarElementId}\n aria-label={ariaLabel}\n aria-describedby={isCollapsible ? itemCountElementId : undefined}\n style={\n !isFlashbarStackExpanded || transitioning\n ? {\n [customCssProps.flashbarStackDepth]: stackDepth,\n }\n : undefined\n }\n >\n <ListWrapper withMotion={!isReducedMotion}>\n {itemsToShow.map((item: StackableItem, index: number) => (\n <Transition\n key={getItemId(item)}\n in={!hasLeft(item)}\n onStatusChange={status => {\n if (status === 'entered') {\n setEnteringItems([]);\n } else if (status === 'exited') {\n setExitingItems([]);\n }\n }}\n >\n {(state: string, transitionRootElement: React.Ref<HTMLDivElement> | undefined) => (\n <li\n aria-hidden={!showInnerContent(item)}\n className={\n showInnerContent(item)\n ? clsx(\n styles['flash-list-item'],\n !isFlashbarStackExpanded && styles.item,\n !collapsedItemRefs.current[getAnimationElementId(item)] && styles['expanded-only']\n )\n : clsx(styles.flash, styles[`flash-type-${item.type ?? 'info'}`], styles.item)\n }\n ref={element => {\n if (isFlashbarStackExpanded) {\n expandedItemRefs.current[getAnimationElementId(item)] = element;\n } else {\n collapsedItemRefs.current[getAnimationElementId(item)] = element;\n }\n }}\n style={\n !isFlashbarStackExpanded || transitioning\n ? {\n [customCssProps.flashbarStackIndex]:\n (item as StackableItem).collapsedIndex ?? (item as StackableItem).expandedIndex ?? index,\n }\n : undefined\n }\n key={getItemId(item)}\n {...getAnalyticsMetadataAttribute(getItemAnalyticsMetadata(index + 1, item.type || 'info', item.id))}\n >\n {showInnerContent(item) && (\n <Flash\n // eslint-disable-next-line react/forbid-component-props\n className={clsx(\n animateFlash && styles['flash-with-motion'],\n isVisualRefresh && styles['flash-refresh']\n )}\n key={getItemId(item)}\n ref={shouldUseStandardAnimation(item, index) ? transitionRootElement : undefined}\n transitionState={shouldUseStandardAnimation(item, index) ? state : undefined}\n i18nStrings={iconAriaLabels}\n {...item}\n />\n )}\n </li>\n )}\n </Transition>\n ))}\n </ListWrapper>\n </ul>\n );\n\n return (\n <div\n {...baseProps}\n className={clsx(\n baseProps.className,\n styles.flashbar,\n styles.stack,\n isCollapsible && styles.collapsible,\n items.length === 2 && styles['short-list'],\n isFlashbarStackExpanded && styles.expanded,\n isVisualRefresh && styles['visual-refresh']\n )}\n ref={mergedRef}\n {...getAnalyticsMetadataAttribute(getComponentsAnalyticsMetadata(items.length, true, isFlashbarStackExpanded))}\n >\n {isFlashbarStackExpanded && renderList()}\n {isCollapsible && (\n <div\n className={clsx(\n styles['notification-bar'],\n isVisualRefresh && styles['visual-refresh'],\n isFlashbarStackExpanded ? styles.expanded : styles.collapsed,\n transitioning && styles['animation-running'],\n items.length === 2 && styles['short-list'],\n getVisualContextClassname('flashbar') // Visual context is needed for focus ring to be white\n )}\n onClick={toggleCollapseExpand}\n ref={notificationBarRef}\n {...getAnalyticsMetadataAttribute({\n action: !isFlashbarStackExpanded ? 'expand' : 'collapse',\n detail: {\n label: 'h2',\n },\n } as GeneratedAnalyticsMetadataFlashbarExpand | GeneratedAnalyticsMetadataFlashbarCollapse)}\n >\n <span aria-live=\"polite\" className={styles.status} role=\"status\" id={itemCountElementId}>\n {notificationBarText && <h2 className={styles.header}>{notificationBarText}</h2>}\n <span className={styles['item-count']}>\n {counterTypes.map(({ type, labelName, iconName }) => (\n <NotificationTypeCount\n key={type}\n iconName={iconName}\n label={iconAriaLabels[labelName]}\n count={countByType[type]}\n />\n ))}\n </span>\n </span>\n <button\n aria-controls={flashbarElementId}\n aria-describedby={itemCountElementId}\n aria-expanded={isFlashbarStackExpanded}\n aria-label={notificationBarAriaLabel}\n className={clsx(styles.button, isFlashbarStackExpanded && styles.expanded)}\n >\n <InternalIcon className={styles.icon} size=\"normal\" name=\"angle-down\" />\n </button>\n </div>\n )}\n {!isFlashbarStackExpanded && renderList()}\n </div>\n );\n}\n\nconst NotificationTypeCount = ({\n iconName,\n label,\n count,\n}: {\n iconName: IconProps.Name;\n label?: string;\n count: number;\n}) => {\n return (\n <span className={styles['type-count']}>\n <span title={label}>\n <InternalIcon name={iconName} ariaLabel={label} />\n </span>\n <span className={styles['count-number']}>{count}</span>\n </span>\n );\n};\n\nconst ListWrapper = ({ children, withMotion }: { children: ReactNode; withMotion: boolean }) =>\n withMotion ? <TransitionGroup component={null}>{children}</TransitionGroup> : <>{children}</>;\n"]}
|
|
1
|
+
{"version":3,"file":"collapsible-flashbar.js","sourceRoot":"","sources":["../../../src/flashbar/collapsible-flashbar.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, { ReactNode, useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport { TransitionGroup } from 'react-transition-group';\nimport clsx from 'clsx';\n\nimport { findUpUntil } from '@cloudscape-design/component-toolkit/dom';\nimport { useUniqueId } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { useInternalI18n } from '../i18n/context';\nimport { IconProps } from '../icon/interfaces';\nimport InternalIcon from '../icon/internal';\nimport { animate, getDOMRects } from '../internal/animate';\nimport { Transition } from '../internal/components/transition';\nimport { getVisualContextClassname } from '../internal/components/visual-context';\nimport customCssProps from '../internal/generated/custom-css-properties';\nimport { useEffectOnUpdate } from '../internal/hooks/use-effect-on-update';\nimport { scrollElementIntoView } from '../internal/utils/scrollable-containers';\nimport { throttle } from '../internal/utils/throttle';\nimport {\n GeneratedAnalyticsMetadataFlashbarCollapse,\n GeneratedAnalyticsMetadataFlashbarExpand,\n} from './analytics-metadata/interfaces';\nimport { getComponentsAnalyticsMetadata, getItemAnalyticsMetadata } from './analytics-metadata/utils';\nimport { useFlashbar } from './common';\nimport { Flash, focusFlashById } from './flash';\nimport { FlashbarProps } from './interfaces';\nimport { counterTypes, getFlashTypeCount, getItemColor, getVisibleCollapsedItems, StackableItem } from './utils';\n\nimport styles from './styles.css.js';\n\n// If the number of items is equal or less than this value,\n// the toggle element will not be displayed and the Flashbar will look like a regular single-item Flashbar.\nconst maxNonCollapsibleItems = 1;\n\nconst resizeListenerThrottleDelay = 100;\n\nexport default function CollapsibleFlashbar({ items, style, ...restProps }: FlashbarProps) {\n const [enteringItems, setEnteringItems] = useState<ReadonlyArray<FlashbarProps.MessageDefinition>>([]);\n const [exitingItems, setExitingItems] = useState<ReadonlyArray<FlashbarProps.MessageDefinition>>([]);\n const [isFlashbarStackExpanded, setIsFlashbarStackExpanded] = useState(false);\n\n const getElementsToAnimate = useCallback(() => {\n const flashElements = isFlashbarStackExpanded ? expandedItemRefs.current : collapsedItemRefs.current;\n return { ...flashElements, notificationBar: notificationBarRef.current };\n }, [isFlashbarStackExpanded]);\n\n const prepareAnimations = useCallback(() => {\n const rects = getDOMRects(getElementsToAnimate());\n setInitialAnimationState(rects);\n }, [getElementsToAnimate]);\n\n const { baseProps, isReducedMotion, isVisualRefresh, mergedRef, ref } = useFlashbar({\n items,\n ...restProps,\n onItemsAdded: newItems => {\n setEnteringItems([...enteringItems, ...newItems]);\n },\n onItemsChanged: options => {\n // If not all items have ID, we can still animate collapse/expand transitions\n // because we can rely on each item's index in the original array,\n // but we can't do that when elements are added or removed, since the index changes.\n if (options?.allItemsHaveId && !options?.isReducedMotion) {\n prepareAnimations();\n }\n },\n onItemsRemoved: removedItems => {\n setExitingItems([...exitingItems, ...removedItems]);\n },\n });\n\n const collapsedItemRefs = useRef<Record<string, HTMLElement | null>>({});\n const expandedItemRefs = useRef<Record<string, HTMLElement | null>>({});\n const [initialAnimationState, setInitialAnimationState] = useState<Record<string, DOMRect> | null>(null);\n const listElementRef = useRef<HTMLUListElement | null>(null);\n const notificationBarRef = useRef<HTMLDivElement | null>(null);\n const [transitioning, setTransitioning] = useState(false);\n const flashbarElementId = useUniqueId('flashbar');\n const itemCountElementId = useUniqueId('item-count');\n\n if (items.length <= maxNonCollapsibleItems && isFlashbarStackExpanded) {\n setIsFlashbarStackExpanded(false);\n }\n\n const animateFlash = !isReducedMotion;\n\n function toggleCollapseExpand() {\n if (!isReducedMotion) {\n prepareAnimations();\n }\n setIsFlashbarStackExpanded(prev => !prev);\n }\n\n useLayoutEffect(() => {\n if (isFlashbarStackExpanded && items?.length) {\n const mostRecentItem = items[0];\n if (mostRecentItem.id !== undefined) {\n focusFlashById(ref.current, mostRecentItem.id);\n }\n }\n // Run this after expanding, but not every time the items change.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isFlashbarStackExpanded]);\n\n // When collapsing, scroll up if necessary to avoid losing track of the focused button\n useEffectOnUpdate(() => {\n if (!isFlashbarStackExpanded && notificationBarRef.current) {\n scrollElementIntoView(notificationBarRef.current);\n }\n }, [isFlashbarStackExpanded]);\n\n const updateBottomSpacing = useMemo(\n () =>\n throttle(() => {\n // Allow vertical space between Flashbar and page bottom only when the Flashbar is reaching the end of the page,\n // otherwise avoid spacing with eventual sticky elements below.\n const listElement = listElementRef?.current;\n const flashbar = listElement?.parentElement;\n if (listElement && flashbar) {\n // Make sure the bottom padding is present when we make the calculations,\n // then we might decide to remove it or not.\n flashbar.classList.remove(styles.floating);\n const windowHeight = window.innerHeight;\n // Take the parent region into account if using the App Layout, because it might have additional margins.\n // Otherwise we use the Flashbar component for this calculation.\n const outerElement = findUpUntil(flashbar, element => element.getAttribute('role') === 'region') || flashbar;\n const applySpacing =\n isFlashbarStackExpanded && Math.ceil(outerElement.getBoundingClientRect().bottom) >= windowHeight;\n if (!applySpacing) {\n flashbar.classList.add(styles.floating);\n }\n }\n }, resizeListenerThrottleDelay),\n [isFlashbarStackExpanded]\n );\n\n useLayoutEffect(() => {\n window.addEventListener('resize', updateBottomSpacing);\n return () => {\n window.removeEventListener('resize', updateBottomSpacing);\n updateBottomSpacing.cancel();\n };\n }, [updateBottomSpacing]);\n\n const { i18nStrings } = restProps;\n\n const i18n = useInternalI18n('flashbar');\n const ariaLabel = i18n('i18nStrings.ariaLabel', i18nStrings?.ariaLabel);\n const notificationBarText = i18n('i18nStrings.notificationBarText', i18nStrings?.notificationBarText);\n const notificationBarAriaLabel = i18n('i18nStrings.notificationBarAriaLabel', i18nStrings?.notificationBarAriaLabel);\n const iconAriaLabels = {\n errorIconAriaLabel: i18n('i18nStrings.errorIconAriaLabel', i18nStrings?.errorIconAriaLabel),\n inProgressIconAriaLabel: i18n('i18nStrings.inProgressIconAriaLabel', i18nStrings?.inProgressIconAriaLabel),\n infoIconAriaLabel: i18n('i18nStrings.infoIconAriaLabel', i18nStrings?.infoIconAriaLabel),\n successIconAriaLabel: i18n('i18nStrings.successIconAriaLabel', i18nStrings?.successIconAriaLabel),\n warningIconAriaLabel: i18n('i18nStrings.warningIconAriaLabel', i18nStrings?.warningIconAriaLabel),\n };\n\n useLayoutEffect(() => {\n // When `useLayoutEffect` is called, the DOM is updated but has not been painted yet,\n // so it's a good moment to trigger animations that will make calculations based on old and new DOM state.\n // The old state is kept in `initialAnimationState`\n // and the new state can be retrieved from the current DOM elements.\n\n if (initialAnimationState) {\n updateBottomSpacing();\n\n animate({\n elements: getElementsToAnimate(),\n oldState: initialAnimationState,\n newElementInitialState: ({ top }) => ({ scale: 0.9, y: -0.2 * top }),\n onTransitionsEnd: () => setTransitioning(false),\n });\n\n setTransitioning(true);\n setInitialAnimationState(null);\n }\n }, [updateBottomSpacing, getElementsToAnimate, initialAnimationState, isFlashbarStackExpanded]);\n\n const isCollapsible = items.length > maxNonCollapsibleItems;\n\n const countByType = getFlashTypeCount(items);\n\n const numberOfColorsInStack = new Set(items.map(getItemColor)).size;\n const maxSlots = Math.max(numberOfColorsInStack, 3);\n const stackDepth = Math.min(maxSlots, items.length);\n\n const itemsToShow = isFlashbarStackExpanded\n ? items.map((item, index) => ({ ...item, expandedIndex: index }))\n : getVisibleCollapsedItems(items, stackDepth).map((item: StackableItem, index: number) => ({\n ...item,\n collapsedIndex: index,\n }));\n\n const getItemId = (item: StackableItem | FlashbarProps.MessageDefinition) =>\n item.id ?? (item as StackableItem).expandedIndex ?? 0;\n\n // This check allows us to use the standard \"enter\" Transition only when the notification was not existing before.\n // If instead it was moved to the top of the stack but was already present in the array\n // (e.g, after dismissing another notification),\n // we need to use different, more custom and more controlled animations.\n const hasEntered = (item: StackableItem | FlashbarProps.MessageDefinition) =>\n enteringItems.some(_item => _item.id && _item.id === item.id);\n const hasLeft = (item: StackableItem | FlashbarProps.MessageDefinition) => !('expandedIndex' in item);\n const hasEnteredOrLeft = (item: StackableItem | FlashbarProps.MessageDefinition) => hasEntered(item) || hasLeft(item);\n\n const showInnerContent = (item: StackableItem | FlashbarProps.MessageDefinition) =>\n isFlashbarStackExpanded || hasLeft(item) || ('expandedIndex' in item && item.expandedIndex === 0);\n\n const shouldUseStandardAnimation = (item: StackableItem, index: number) => index === 0 && hasEnteredOrLeft(item);\n\n const getAnimationElementId = (item: StackableItem) => `flash-${getItemId(item)}`;\n\n const getNotificationBarStyles = () => {\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 };\n };\n\n const renderList = () => (\n <ul\n ref={listElementRef}\n className={clsx(\n styles['flash-list'],\n isFlashbarStackExpanded ? styles.expanded : styles.collapsed,\n transitioning && styles['animation-running'],\n initialAnimationState && styles['animation-ready'],\n isVisualRefresh && styles['visual-refresh']\n )}\n id={flashbarElementId}\n aria-label={ariaLabel}\n aria-describedby={isCollapsible ? itemCountElementId : undefined}\n style={\n !isFlashbarStackExpanded || transitioning\n ? {\n [customCssProps.flashbarStackDepth]: stackDepth,\n }\n : undefined\n }\n >\n <ListWrapper withMotion={!isReducedMotion}>\n {itemsToShow.map((item: StackableItem, index: number) => (\n <Transition\n key={getItemId(item)}\n in={!hasLeft(item)}\n onStatusChange={status => {\n if (status === 'entered') {\n setEnteringItems([]);\n } else if (status === 'exited') {\n setExitingItems([]);\n }\n }}\n >\n {(state: string, transitionRootElement: React.Ref<HTMLDivElement> | undefined) => (\n <li\n aria-hidden={!showInnerContent(item)}\n className={\n showInnerContent(item)\n ? clsx(\n styles['flash-list-item'],\n !isFlashbarStackExpanded && styles.item,\n !collapsedItemRefs.current[getAnimationElementId(item)] && styles['expanded-only']\n )\n : clsx(styles.flash, styles[`flash-type-${item.type ?? 'info'}`], styles.item)\n }\n ref={element => {\n if (isFlashbarStackExpanded) {\n expandedItemRefs.current[getAnimationElementId(item)] = element;\n } else {\n collapsedItemRefs.current[getAnimationElementId(item)] = element;\n }\n }}\n style={{\n ...(index > 0 && !isFlashbarStackExpanded && style && getItemStyles(style, item.type)),\n ...((!isFlashbarStackExpanded || transitioning) && {\n [customCssProps.flashbarStackIndex]:\n (item as StackableItem).collapsedIndex ?? (item as StackableItem).expandedIndex ?? index,\n }),\n }}\n key={getItemId(item)}\n {...getAnalyticsMetadataAttribute(getItemAnalyticsMetadata(index + 1, item.type || 'info', item.id))}\n >\n {showInnerContent(item) && (\n <Flash\n // eslint-disable-next-line react/forbid-component-props\n className={clsx(\n animateFlash && styles['flash-with-motion'],\n isVisualRefresh && styles['flash-refresh']\n )}\n key={getItemId(item)}\n ref={shouldUseStandardAnimation(item, index) ? transitionRootElement : undefined}\n transitionState={shouldUseStandardAnimation(item, index) ? state : undefined}\n i18nStrings={iconAriaLabels}\n style={style}\n {...item}\n />\n )}\n </li>\n )}\n </Transition>\n ))}\n </ListWrapper>\n </ul>\n );\n\n return (\n <div\n {...baseProps}\n className={clsx(\n baseProps.className,\n styles.flashbar,\n styles.stack,\n isCollapsible && styles.collapsible,\n items.length === 2 && styles['short-list'],\n isFlashbarStackExpanded && styles.expanded,\n isVisualRefresh && styles['visual-refresh']\n )}\n ref={mergedRef}\n {...getAnalyticsMetadataAttribute(getComponentsAnalyticsMetadata(items.length, true, isFlashbarStackExpanded))}\n >\n {isFlashbarStackExpanded && renderList()}\n {isCollapsible && (\n <div\n className={clsx(\n styles['notification-bar'],\n isVisualRefresh && styles['visual-refresh'],\n isFlashbarStackExpanded ? styles.expanded : styles.collapsed,\n transitioning && styles['animation-running'],\n items.length === 2 && styles['short-list'],\n getVisualContextClassname('flashbar') // Visual context is needed for focus ring to be white\n )}\n onClick={toggleCollapseExpand}\n ref={notificationBarRef}\n style={{ ...getNotificationBarStyles() }}\n {...getAnalyticsMetadataAttribute({\n action: !isFlashbarStackExpanded ? 'expand' : 'collapse',\n detail: {\n label: 'h2',\n },\n } as GeneratedAnalyticsMetadataFlashbarExpand | GeneratedAnalyticsMetadataFlashbarCollapse)}\n >\n <span aria-live=\"polite\" className={styles.status} role=\"status\" id={itemCountElementId}>\n {notificationBarText && <h2 className={styles.header}>{notificationBarText}</h2>}\n <span className={styles['item-count']}>\n {counterTypes.map(({ type, labelName, iconName }) => (\n <NotificationTypeCount\n key={type}\n iconName={iconName}\n label={iconAriaLabels[labelName]}\n count={countByType[type]}\n />\n ))}\n </span>\n </span>\n <button\n aria-controls={flashbarElementId}\n aria-describedby={itemCountElementId}\n aria-expanded={isFlashbarStackExpanded}\n aria-label={notificationBarAriaLabel}\n className={clsx(styles.button, isFlashbarStackExpanded && styles.expanded)}\n >\n <InternalIcon className={styles.icon} size=\"normal\" name=\"angle-down\" />\n </button>\n </div>\n )}\n {!isFlashbarStackExpanded && renderList()}\n </div>\n );\n}\n\nexport const getItemStyles = (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\nconst NotificationTypeCount = ({\n iconName,\n label,\n count,\n}: {\n iconName: IconProps.Name;\n label?: string;\n count: number;\n}) => {\n return (\n <span className={styles['type-count']}>\n <span title={label}>\n <InternalIcon name={iconName} ariaLabel={label} />\n </span>\n <span className={styles['count-number']}>{count}</span>\n </span>\n );\n};\n\nconst ListWrapper = ({ children, withMotion }: { children: ReactNode; withMotion: boolean }) =>\n withMotion ? <TransitionGroup component={null}>{children}</TransitionGroup> : <>{children}</>;\n"]}
|
|
@@ -5,6 +5,7 @@ interface FlashProps extends FlashbarProps.MessageDefinition {
|
|
|
5
5
|
className: string;
|
|
6
6
|
transitionState?: string;
|
|
7
7
|
i18nStrings?: FlashbarProps.I18nStrings;
|
|
8
|
+
style?: FlashbarProps.Style;
|
|
8
9
|
}
|
|
9
10
|
export declare const Flash: React.ForwardRefExoticComponent<FlashProps & React.RefAttributes<HTMLDivElement>>;
|
|
10
11
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"flash.d.ts","sourceRoot":"","sources":["../../../src/flashbar/flash.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"flash.d.ts","sourceRoot":"","sources":["../../../src/flashbar/flash.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AA+BtC,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAuD7C,eAAO,MAAM,cAAc,mEACf,WAAW,GAAG,IAAI,UAAU,MAAM,UAM7C,CAAC;AAEF,UAAU,UAAW,SAAQ,aAAa,CAAC,iBAAiB;IAC1D,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,aAAa,CAAC,WAAW,CAAC;IACxC,KAAK,CAAC,EAAE,aAAa,CAAC,KAAK,CAAC;CAC7B;AAED,eAAO,MAAM,KAAK,mFAuLjB,CAAC"}
|
|
@@ -11,6 +11,7 @@ import InternalIcon from '../icon/internal';
|
|
|
11
11
|
import { DATA_ATTR_ANALYTICS_FLASHBAR, DATA_ATTR_ANALYTICS_SUPPRESS_FLOW_EVENTS, } from '../internal/analytics/selectors';
|
|
12
12
|
import { getVisualContextClassname } from '../internal/components/visual-context';
|
|
13
13
|
import { PACKAGE_VERSION } from '../internal/environment';
|
|
14
|
+
import customCssProps from '../internal/generated/custom-css-properties';
|
|
14
15
|
import { isDevelopment } from '../internal/is-development';
|
|
15
16
|
import { awsuiPluginsInternal } from '../internal/plugins/api';
|
|
16
17
|
import { createUseDiscoveredAction, createUseDiscoveredContent } from '../internal/plugins/helpers';
|
|
@@ -18,6 +19,7 @@ import { throttle } from '../internal/utils/throttle';
|
|
|
18
19
|
import useContainerWidth from '../internal/utils/use-container-width';
|
|
19
20
|
import InternalLiveRegion from '../live-region/internal';
|
|
20
21
|
import InternalSpinner from '../spinner/internal';
|
|
22
|
+
import { getItemStyles } from './collapsible-flashbar';
|
|
21
23
|
import { FOCUS_THROTTLE_DELAY } from './utils';
|
|
22
24
|
import analyticsSelectors from './analytics-metadata/styles.css.js';
|
|
23
25
|
import styles from './styles.css.js';
|
|
@@ -30,11 +32,25 @@ const ICON_TYPES = {
|
|
|
30
32
|
};
|
|
31
33
|
const useDiscoveredAction = createUseDiscoveredAction(awsuiPluginsInternal.flashbar.onActionRegistered);
|
|
32
34
|
const useDiscoveredContent = createUseDiscoveredContent('flash', awsuiPluginsInternal.flashContent);
|
|
33
|
-
function dismissButton(dismissLabel, onDismiss) {
|
|
35
|
+
function dismissButton(dismissLabel, onDismiss, style) {
|
|
36
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
|
|
34
37
|
return (React.createElement("div", Object.assign({ className: styles['dismiss-button-wrapper'] }, getAnalyticsMetadataAttribute({
|
|
35
38
|
action: 'dismiss',
|
|
36
39
|
})),
|
|
37
|
-
React.createElement(InternalButton, { onClick: onDismiss, className: styles['dismiss-button'], variant: "flashbar-icon", iconName: "close", formAction: "none", ariaLabel: dismissLabel
|
|
40
|
+
React.createElement(InternalButton, { onClick: onDismiss, className: styles['dismiss-button'], variant: "flashbar-icon", iconName: "close", formAction: "none", ariaLabel: dismissLabel, style: {
|
|
41
|
+
root: {
|
|
42
|
+
color: {
|
|
43
|
+
active: (_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,
|
|
44
|
+
default: (_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,
|
|
45
|
+
hover: (_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,
|
|
46
|
+
},
|
|
47
|
+
focusRing: {
|
|
48
|
+
borderColor: (_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,
|
|
49
|
+
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,
|
|
50
|
+
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,
|
|
51
|
+
},
|
|
52
|
+
},
|
|
53
|
+
} })));
|
|
38
54
|
}
|
|
39
55
|
export const focusFlashById = throttle((element, itemId) => {
|
|
40
56
|
var _a;
|
|
@@ -42,7 +58,8 @@ export const focusFlashById = throttle((element, itemId) => {
|
|
|
42
58
|
(_a = element === null || element === void 0 ? void 0 : element.querySelector(selector)) === null || _a === void 0 ? void 0 : _a.focus();
|
|
43
59
|
}, FOCUS_THROTTLE_DELAY, { trailing: false });
|
|
44
60
|
export const Flash = React.forwardRef((_a, ref) => {
|
|
45
|
-
var
|
|
61
|
+
var _b, _c, _d, _e, _f, _g, _h, _j;
|
|
62
|
+
var { id, header, content, dismissible, dismissLabel, loading, action, buttonText, onButtonClick, onDismiss, className, transitionState, ariaRole, i18nStrings, type = 'info', analyticsMetadata, style } = _a, props = __rest(_a, ["id", "header", "content", "dismissible", "dismissLabel", "loading", "action", "buttonText", "onButtonClick", "onDismiss", "className", "transitionState", "ariaRole", "i18nStrings", "type", "analyticsMetadata", "style"]);
|
|
46
63
|
if (isDevelopment) {
|
|
47
64
|
if (buttonText && !onButtonClick) {
|
|
48
65
|
warnOnce('Flashbar', `You provided a \`buttonText\` prop without an \`onButtonClick\` handler. This will render a non-interactive action button.`);
|
|
@@ -84,7 +101,13 @@ export const Flash = React.forwardRef((_a, ref) => {
|
|
|
84
101
|
[styles.exit]: transitionState === 'exit',
|
|
85
102
|
[styles.exiting]: transitionState === 'exiting',
|
|
86
103
|
[styles.exited]: transitionState === 'exited',
|
|
87
|
-
}, getVisualContextClassname(type === 'warning' && !loading ? 'flashbar-warning' : 'flashbar'), initialHidden && styles['initial-hidden']) },
|
|
104
|
+
}, getVisualContextClassname(type === 'warning' && !loading ? 'flashbar-warning' : 'flashbar'), initialHidden && styles['initial-hidden']), style: Object.assign(Object.assign(Object.assign({}, (style && getItemStyles(style, effectiveType))), (((_c = (_b = style === null || style === void 0 ? void 0 : style.item) === null || _b === void 0 ? void 0 : _b.root) === null || _c === void 0 ? void 0 : _c.focusRing) && {
|
|
105
|
+
[customCssProps.styleFocusRingBorderColor]: (_d = style.item.root.focusRing) === null || _d === void 0 ? void 0 : _d.borderColor,
|
|
106
|
+
[customCssProps.styleFocusRingBorderRadius]: (_e = style.item.root.focusRing) === null || _e === void 0 ? void 0 : _e.borderRadius,
|
|
107
|
+
[customCssProps.styleFocusRingBorderWidth]: (_f = style.item.root.focusRing) === null || _f === void 0 ? void 0 : _f.borderWidth,
|
|
108
|
+
})), (((_j = (_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.focusRing) === null || _j === void 0 ? void 0 : _j.borderRadius) && {
|
|
109
|
+
[customCssProps.styleFocusRingBorderRadius]: style.item.root.focusRing.borderRadius,
|
|
110
|
+
})) }, analyticsAttributes),
|
|
88
111
|
React.createElement("div", { className: styles['flash-body'] },
|
|
89
112
|
React.createElement("div", { className: styles['flash-focus-container'], tabIndex: -1, role: "group", "aria-labelledby": `${flashIconId} ${flashMessageId}` },
|
|
90
113
|
React.createElement("div", { className: clsx(styles['flash-icon'], styles['flash-text']), id: flashIconId }, icon),
|
|
@@ -97,7 +120,7 @@ export const Flash = React.forwardRef((_a, ref) => {
|
|
|
97
120
|
actionSlot: styles['action-slot'],
|
|
98
121
|
actionButton: styles['action-button'],
|
|
99
122
|
}, action: action, discoveredActions: discoveredActions, buttonText: buttonText, onButtonClick: onButtonClick, containerWidth: containerWidth, wrappedClass: styles['action-wrapped'] })),
|
|
100
|
-
dismissible && dismissButton(dismissLabel, onDismiss),
|
|
123
|
+
dismissible && dismissButton(dismissLabel, onDismiss, style),
|
|
101
124
|
ariaRole === 'status' && (React.createElement(InternalLiveRegion, { sources: [statusIconAriaLabel, headerRefObject, contentRefObject] }))));
|
|
102
125
|
});
|
|
103
126
|
//# sourceMappingURL=flash.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"flash.js","sourceRoot":"","sources":["../../../src/flashbar/flash.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, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport {\n useComponentMetadata,\n useMergeRefs,\n useUniqueId,\n warnOnce,\n} from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\nimport { AnalyticsMetadata } from '@cloudscape-design/component-toolkit/internal/base-component/metrics/interfaces';\n\nimport { ActionsWrapper } from '../alert/actions-wrapper';\nimport { InternalButton } from '../button/internal';\nimport InternalIcon from '../icon/internal';\nimport {\n DATA_ATTR_ANALYTICS_FLASHBAR,\n DATA_ATTR_ANALYTICS_SUPPRESS_FLOW_EVENTS,\n} from '../internal/analytics/selectors';\nimport { getVisualContextClassname } from '../internal/components/visual-context';\nimport { PACKAGE_VERSION } from '../internal/environment';\nimport { isDevelopment } from '../internal/is-development';\nimport { awsuiPluginsInternal } from '../internal/plugins/api';\nimport { createUseDiscoveredAction, createUseDiscoveredContent } from '../internal/plugins/helpers';\nimport { throttle } from '../internal/utils/throttle';\nimport useContainerWidth from '../internal/utils/use-container-width';\nimport InternalLiveRegion from '../live-region/internal';\nimport InternalSpinner from '../spinner/internal';\nimport { GeneratedAnalyticsMetadataFlashbarDismiss } from './analytics-metadata/interfaces';\nimport { FlashbarProps } from './interfaces';\nimport { FOCUS_THROTTLE_DELAY } from './utils';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nconst ICON_TYPES = {\n success: 'status-positive',\n warning: 'status-warning',\n info: 'status-info',\n error: 'status-negative',\n 'in-progress': 'status-in-progress',\n} as const;\n\nconst useDiscoveredAction = createUseDiscoveredAction(awsuiPluginsInternal.flashbar.onActionRegistered);\nconst useDiscoveredContent = createUseDiscoveredContent('flash', awsuiPluginsInternal.flashContent);\n\nfunction dismissButton(\n dismissLabel: FlashbarProps.MessageDefinition['dismissLabel'],\n onDismiss: FlashbarProps.MessageDefinition['onDismiss']\n) {\n return (\n <div\n className={styles['dismiss-button-wrapper']}\n {...getAnalyticsMetadataAttribute({\n action: 'dismiss',\n } as Partial<GeneratedAnalyticsMetadataFlashbarDismiss>)}\n >\n <InternalButton\n onClick={onDismiss}\n className={styles['dismiss-button']}\n variant=\"flashbar-icon\"\n iconName=\"close\"\n formAction=\"none\"\n ariaLabel={dismissLabel}\n />\n </div>\n );\n}\n\nexport const focusFlashById = throttle(\n (element: HTMLElement | null, itemId: string) => {\n const selector = `[data-itemid=\"${CSS.escape(itemId)}\"] .${styles['flash-focus-container']}`;\n element?.querySelector<HTMLElement>(selector)?.focus();\n },\n FOCUS_THROTTLE_DELAY,\n { trailing: false }\n);\n\ninterface FlashProps extends FlashbarProps.MessageDefinition {\n className: string;\n transitionState?: string;\n i18nStrings?: FlashbarProps.I18nStrings;\n}\n\nexport const Flash = React.forwardRef(\n (\n {\n id,\n header,\n content,\n dismissible,\n dismissLabel,\n loading,\n action,\n buttonText,\n onButtonClick,\n onDismiss,\n className,\n transitionState,\n ariaRole,\n i18nStrings,\n type = 'info',\n analyticsMetadata,\n ...props\n }: FlashProps,\n ref: React.Ref<HTMLDivElement>\n ) => {\n if (isDevelopment) {\n if (buttonText && !onButtonClick) {\n warnOnce(\n 'Flashbar',\n `You provided a \\`buttonText\\` prop without an \\`onButtonClick\\` handler. This will render a non-interactive action button.`\n );\n }\n\n if (dismissible && !onDismiss) {\n warnOnce(\n 'Flashbar',\n `You have set the \\`dismissible\\` prop without an \\`onDismiss\\` handler. This will render a non-interactive dismiss button.`\n );\n }\n }\n\n const [containerWidth, containerMeasureRef] = useContainerWidth();\n\n const elementRef = useComponentMetadata('Flash', PACKAGE_VERSION, analyticsMetadata as AnalyticsMetadata);\n\n const mergedRef = useMergeRefs(ref, elementRef, containerMeasureRef);\n const flashIconId = useUniqueId('flash-icon');\n const flashMessageId = useUniqueId('flash-message');\n\n const headerRefObject = useRef<HTMLDivElement>(null);\n const contentRefObject = useRef<HTMLDivElement>(null);\n const { discoveredActions, headerRef: headerRefAction, contentRef: contentRefAction } = useDiscoveredAction(type);\n const {\n initialHidden,\n headerReplacementType,\n contentReplacementType,\n headerRef: headerRefContent,\n contentRef: contentRefContent,\n replacementHeaderRef,\n replacementContentRef,\n } = useDiscoveredContent({ type, header, children: content });\n\n const headerRef = useMergeRefs(headerRefAction, headerRefContent, headerRefObject);\n const contentRef = useMergeRefs(contentRefAction, contentRefContent, contentRefObject);\n\n const statusIconAriaLabel =\n props.statusIconAriaLabel ||\n i18nStrings?.[`${loading || type === 'in-progress' ? 'inProgress' : type}IconAriaLabel`];\n\n const iconType = ICON_TYPES[type];\n const icon = loading ? (\n <span role=\"img\" aria-label={statusIconAriaLabel}>\n <InternalSpinner />\n </span>\n ) : (\n <InternalIcon name={iconType} ariaLabel={statusIconAriaLabel} />\n );\n\n const effectiveType = loading ? 'info' : type;\n\n const analyticsAttributes: Record<string, string> = {\n [DATA_ATTR_ANALYTICS_FLASHBAR]: effectiveType,\n };\n\n if (analyticsMetadata?.suppressFlowMetricEvents) {\n analyticsAttributes[DATA_ATTR_ANALYTICS_SUPPRESS_FLOW_EVENTS] = 'true';\n }\n\n return (\n // We're not using \"polite\" or \"assertive\" here, just turning default behavior off.\n // eslint-disable-next-line @cloudscape-design/prefer-live-region\n <div\n ref={mergedRef}\n role={ariaRole}\n aria-live={ariaRole ? 'off' : undefined}\n data-itemid={id}\n className={clsx(\n styles.flash,\n styles[`flash-type-${effectiveType}`],\n className,\n transitionState && {\n [styles.enter]: transitionState === 'enter',\n [styles.entering]: transitionState === 'entering',\n [styles.entered]: transitionState === 'entered',\n [styles.exit]: transitionState === 'exit',\n [styles.exiting]: transitionState === 'exiting',\n [styles.exited]: transitionState === 'exited',\n },\n getVisualContextClassname(type === 'warning' && !loading ? 'flashbar-warning' : 'flashbar'),\n initialHidden && styles['initial-hidden']\n )}\n {...analyticsAttributes}\n >\n <div className={styles['flash-body']}>\n <div\n className={styles['flash-focus-container']}\n tabIndex={-1}\n role=\"group\"\n aria-labelledby={`${flashIconId} ${flashMessageId}`}\n >\n <div className={clsx(styles['flash-icon'], styles['flash-text'])} id={flashIconId}>\n {icon}\n </div>\n <div className={clsx(styles['flash-message'], styles['flash-text'])} id={flashMessageId}>\n <div\n className={clsx(\n styles['flash-header'],\n headerReplacementType !== 'original' ? styles.hidden : analyticsSelectors['flash-header']\n )}\n ref={headerRef}\n >\n {header}\n </div>\n <div\n className={clsx(styles['header-replacement'], headerReplacementType !== 'replaced' && styles.hidden)}\n ref={replacementHeaderRef}\n ></div>\n <div\n className={clsx(\n styles['flash-content'],\n contentReplacementType !== 'original' ? styles.hidden : analyticsSelectors['flash-header']\n )}\n ref={contentRef}\n >\n {content}\n </div>\n <div\n className={clsx(styles['content-replacement'], contentReplacementType !== 'replaced' && styles.hidden)}\n ref={replacementContentRef}\n ></div>\n </div>\n </div>\n <ActionsWrapper\n className={styles['action-button-wrapper']}\n testUtilClasses={{\n actionSlot: styles['action-slot'],\n actionButton: styles['action-button'],\n }}\n action={action}\n discoveredActions={discoveredActions}\n buttonText={buttonText}\n onButtonClick={onButtonClick}\n containerWidth={containerWidth}\n wrappedClass={styles['action-wrapped']}\n />\n </div>\n {dismissible && dismissButton(dismissLabel, onDismiss)}\n {ariaRole === 'status' && (\n <InternalLiveRegion sources={[statusIconAriaLabel, headerRefObject, contentRefObject]} />\n )}\n </div>\n );\n }\n);\n"]}
|
|
1
|
+
{"version":3,"file":"flash.js","sourceRoot":"","sources":["../../../src/flashbar/flash.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, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport {\n useComponentMetadata,\n useMergeRefs,\n useUniqueId,\n warnOnce,\n} from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\nimport { AnalyticsMetadata } from '@cloudscape-design/component-toolkit/internal/base-component/metrics/interfaces';\n\nimport { ActionsWrapper } from '../alert/actions-wrapper';\nimport { InternalButton } from '../button/internal';\nimport InternalIcon from '../icon/internal';\nimport {\n DATA_ATTR_ANALYTICS_FLASHBAR,\n DATA_ATTR_ANALYTICS_SUPPRESS_FLOW_EVENTS,\n} from '../internal/analytics/selectors';\nimport { getVisualContextClassname } from '../internal/components/visual-context';\nimport { PACKAGE_VERSION } from '../internal/environment';\nimport customCssProps from '../internal/generated/custom-css-properties';\nimport { isDevelopment } from '../internal/is-development';\nimport { awsuiPluginsInternal } from '../internal/plugins/api';\nimport { createUseDiscoveredAction, createUseDiscoveredContent } from '../internal/plugins/helpers';\nimport { throttle } from '../internal/utils/throttle';\nimport useContainerWidth from '../internal/utils/use-container-width';\nimport InternalLiveRegion from '../live-region/internal';\nimport InternalSpinner from '../spinner/internal';\nimport { GeneratedAnalyticsMetadataFlashbarDismiss } from './analytics-metadata/interfaces';\nimport { getItemStyles } from './collapsible-flashbar';\nimport { FlashbarProps } from './interfaces';\nimport { FOCUS_THROTTLE_DELAY } from './utils';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nconst ICON_TYPES = {\n success: 'status-positive',\n warning: 'status-warning',\n info: 'status-info',\n error: 'status-negative',\n 'in-progress': 'status-in-progress',\n} as const;\n\nconst useDiscoveredAction = createUseDiscoveredAction(awsuiPluginsInternal.flashbar.onActionRegistered);\nconst useDiscoveredContent = createUseDiscoveredContent('flash', awsuiPluginsInternal.flashContent);\n\nfunction dismissButton(\n dismissLabel: FlashbarProps.MessageDefinition['dismissLabel'],\n onDismiss: FlashbarProps.MessageDefinition['onDismiss'],\n style?: FlashbarProps.Style\n) {\n return (\n <div\n className={styles['dismiss-button-wrapper']}\n {...getAnalyticsMetadataAttribute({\n action: 'dismiss',\n } as Partial<GeneratedAnalyticsMetadataFlashbarDismiss>)}\n >\n <InternalButton\n onClick={onDismiss}\n className={styles['dismiss-button']}\n variant=\"flashbar-icon\"\n iconName=\"close\"\n formAction=\"none\"\n ariaLabel={dismissLabel}\n style={{\n root: {\n color: {\n active: style?.item?.dismissButton?.color?.active,\n default: style?.item?.dismissButton?.color?.default,\n hover: style?.item?.dismissButton?.color?.hover,\n },\n focusRing: {\n borderColor: style?.item?.dismissButton?.focusRing?.borderColor,\n borderRadius: style?.item?.dismissButton?.focusRing?.borderRadius,\n borderWidth: style?.item?.dismissButton?.focusRing?.borderWidth,\n },\n },\n }}\n />\n </div>\n );\n}\n\nexport const focusFlashById = throttle(\n (element: HTMLElement | null, itemId: string) => {\n const selector = `[data-itemid=\"${CSS.escape(itemId)}\"] .${styles['flash-focus-container']}`;\n element?.querySelector<HTMLElement>(selector)?.focus();\n },\n FOCUS_THROTTLE_DELAY,\n { trailing: false }\n);\n\ninterface FlashProps extends FlashbarProps.MessageDefinition {\n className: string;\n transitionState?: string;\n i18nStrings?: FlashbarProps.I18nStrings;\n style?: FlashbarProps.Style;\n}\n\nexport const Flash = React.forwardRef(\n (\n {\n id,\n header,\n content,\n dismissible,\n dismissLabel,\n loading,\n action,\n buttonText,\n onButtonClick,\n onDismiss,\n className,\n transitionState,\n ariaRole,\n i18nStrings,\n type = 'info',\n analyticsMetadata,\n style,\n ...props\n }: FlashProps,\n ref: React.Ref<HTMLDivElement>\n ) => {\n if (isDevelopment) {\n if (buttonText && !onButtonClick) {\n warnOnce(\n 'Flashbar',\n `You provided a \\`buttonText\\` prop without an \\`onButtonClick\\` handler. This will render a non-interactive action button.`\n );\n }\n\n if (dismissible && !onDismiss) {\n warnOnce(\n 'Flashbar',\n `You have set the \\`dismissible\\` prop without an \\`onDismiss\\` handler. This will render a non-interactive dismiss button.`\n );\n }\n }\n\n const [containerWidth, containerMeasureRef] = useContainerWidth();\n\n const elementRef = useComponentMetadata('Flash', PACKAGE_VERSION, analyticsMetadata as AnalyticsMetadata);\n\n const mergedRef = useMergeRefs(ref, elementRef, containerMeasureRef);\n const flashIconId = useUniqueId('flash-icon');\n const flashMessageId = useUniqueId('flash-message');\n\n const headerRefObject = useRef<HTMLDivElement>(null);\n const contentRefObject = useRef<HTMLDivElement>(null);\n const { discoveredActions, headerRef: headerRefAction, contentRef: contentRefAction } = useDiscoveredAction(type);\n const {\n initialHidden,\n headerReplacementType,\n contentReplacementType,\n headerRef: headerRefContent,\n contentRef: contentRefContent,\n replacementHeaderRef,\n replacementContentRef,\n } = useDiscoveredContent({ type, header, children: content });\n\n const headerRef = useMergeRefs(headerRefAction, headerRefContent, headerRefObject);\n const contentRef = useMergeRefs(contentRefAction, contentRefContent, contentRefObject);\n\n const statusIconAriaLabel =\n props.statusIconAriaLabel ||\n i18nStrings?.[`${loading || type === 'in-progress' ? 'inProgress' : type}IconAriaLabel`];\n\n const iconType = ICON_TYPES[type];\n const icon = loading ? (\n <span role=\"img\" aria-label={statusIconAriaLabel}>\n <InternalSpinner />\n </span>\n ) : (\n <InternalIcon name={iconType} ariaLabel={statusIconAriaLabel} />\n );\n\n const effectiveType = loading ? 'info' : type;\n\n const analyticsAttributes: Record<string, string> = {\n [DATA_ATTR_ANALYTICS_FLASHBAR]: effectiveType,\n };\n\n if (analyticsMetadata?.suppressFlowMetricEvents) {\n analyticsAttributes[DATA_ATTR_ANALYTICS_SUPPRESS_FLOW_EVENTS] = 'true';\n }\n\n return (\n // We're not using \"polite\" or \"assertive\" here, just turning default behavior off.\n // eslint-disable-next-line @cloudscape-design/prefer-live-region\n <div\n ref={mergedRef}\n role={ariaRole}\n aria-live={ariaRole ? 'off' : undefined}\n data-itemid={id}\n className={clsx(\n styles.flash,\n styles[`flash-type-${effectiveType}`],\n className,\n transitionState && {\n [styles.enter]: transitionState === 'enter',\n [styles.entering]: transitionState === 'entering',\n [styles.entered]: transitionState === 'entered',\n [styles.exit]: transitionState === 'exit',\n [styles.exiting]: transitionState === 'exiting',\n [styles.exited]: transitionState === 'exited',\n },\n getVisualContextClassname(type === 'warning' && !loading ? 'flashbar-warning' : 'flashbar'),\n initialHidden && styles['initial-hidden']\n )}\n style={{\n ...(style && getItemStyles(style, effectiveType)),\n ...(style?.item?.root?.focusRing && {\n [customCssProps.styleFocusRingBorderColor]: style.item.root.focusRing?.borderColor,\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 {...analyticsAttributes}\n >\n <div className={styles['flash-body']}>\n <div\n className={styles['flash-focus-container']}\n tabIndex={-1}\n role=\"group\"\n aria-labelledby={`${flashIconId} ${flashMessageId}`}\n >\n <div className={clsx(styles['flash-icon'], styles['flash-text'])} id={flashIconId}>\n {icon}\n </div>\n <div className={clsx(styles['flash-message'], styles['flash-text'])} id={flashMessageId}>\n <div\n className={clsx(\n styles['flash-header'],\n headerReplacementType !== 'original' ? styles.hidden : analyticsSelectors['flash-header']\n )}\n ref={headerRef}\n >\n {header}\n </div>\n <div\n className={clsx(styles['header-replacement'], headerReplacementType !== 'replaced' && styles.hidden)}\n ref={replacementHeaderRef}\n ></div>\n <div\n className={clsx(\n styles['flash-content'],\n contentReplacementType !== 'original' ? styles.hidden : analyticsSelectors['flash-header']\n )}\n ref={contentRef}\n >\n {content}\n </div>\n <div\n className={clsx(styles['content-replacement'], contentReplacementType !== 'replaced' && styles.hidden)}\n ref={replacementContentRef}\n ></div>\n </div>\n </div>\n <ActionsWrapper\n className={styles['action-button-wrapper']}\n testUtilClasses={{\n actionSlot: styles['action-slot'],\n actionButton: styles['action-button'],\n }}\n action={action}\n discoveredActions={discoveredActions}\n buttonText={buttonText}\n onButtonClick={onButtonClick}\n containerWidth={containerWidth}\n wrappedClass={styles['action-wrapped']}\n />\n </div>\n {dismissible && dismissButton(dismissLabel, onDismiss, style)}\n {ariaRole === 'status' && (\n <InternalLiveRegion sources={[statusIconAriaLabel, headerRefObject, contentRefObject]} />\n )}\n </div>\n );\n }\n);\n"]}
|
|
@@ -33,6 +33,73 @@ export declare namespace FlashbarProps {
|
|
|
33
33
|
successIconAriaLabel?: string;
|
|
34
34
|
warningIconAriaLabel?: string;
|
|
35
35
|
}
|
|
36
|
+
interface Style {
|
|
37
|
+
item?: {
|
|
38
|
+
root?: {
|
|
39
|
+
background?: {
|
|
40
|
+
error?: string;
|
|
41
|
+
info?: string;
|
|
42
|
+
inProgress?: string;
|
|
43
|
+
success?: string;
|
|
44
|
+
warning?: string;
|
|
45
|
+
};
|
|
46
|
+
borderColor?: {
|
|
47
|
+
error?: string;
|
|
48
|
+
info?: string;
|
|
49
|
+
inProgress?: string;
|
|
50
|
+
success?: string;
|
|
51
|
+
warning?: string;
|
|
52
|
+
};
|
|
53
|
+
borderRadius?: string;
|
|
54
|
+
borderWidth?: string;
|
|
55
|
+
color?: {
|
|
56
|
+
error?: string;
|
|
57
|
+
info?: string;
|
|
58
|
+
inProgress?: string;
|
|
59
|
+
success?: string;
|
|
60
|
+
warning?: string;
|
|
61
|
+
};
|
|
62
|
+
focusRing?: {
|
|
63
|
+
borderColor?: string;
|
|
64
|
+
borderRadius?: string;
|
|
65
|
+
borderWidth?: string;
|
|
66
|
+
};
|
|
67
|
+
};
|
|
68
|
+
dismissButton?: {
|
|
69
|
+
color?: {
|
|
70
|
+
active?: string;
|
|
71
|
+
default?: string;
|
|
72
|
+
hover?: string;
|
|
73
|
+
};
|
|
74
|
+
focusRing?: {
|
|
75
|
+
borderColor?: string;
|
|
76
|
+
borderRadius?: string;
|
|
77
|
+
borderWidth?: string;
|
|
78
|
+
};
|
|
79
|
+
};
|
|
80
|
+
};
|
|
81
|
+
notificationBar?: {
|
|
82
|
+
root: {
|
|
83
|
+
background?: {
|
|
84
|
+
active?: string;
|
|
85
|
+
default?: string;
|
|
86
|
+
hover?: string;
|
|
87
|
+
};
|
|
88
|
+
borderColor?: {
|
|
89
|
+
active?: string;
|
|
90
|
+
default?: string;
|
|
91
|
+
hover?: string;
|
|
92
|
+
};
|
|
93
|
+
borderRadius?: string;
|
|
94
|
+
borderWidth?: string;
|
|
95
|
+
color?: {
|
|
96
|
+
active?: string;
|
|
97
|
+
default?: string;
|
|
98
|
+
hover?: string;
|
|
99
|
+
};
|
|
100
|
+
};
|
|
101
|
+
};
|
|
102
|
+
}
|
|
36
103
|
type Type = 'success' | 'warning' | 'info' | 'error' | 'in-progress';
|
|
37
104
|
type AriaRole = 'alert' | 'status';
|
|
38
105
|
}
|
|
@@ -90,5 +157,9 @@ export interface FlashbarProps extends BaseComponentProps {
|
|
|
90
157
|
* @i18n
|
|
91
158
|
*/
|
|
92
159
|
i18nStrings?: FlashbarProps.I18nStrings;
|
|
160
|
+
/**
|
|
161
|
+
* @awsuiSystem core
|
|
162
|
+
*/
|
|
163
|
+
style?: FlashbarProps.Style;
|
|
93
164
|
}
|
|
94
165
|
//# sourceMappingURL=interfaces.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/flashbar/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE,yBAAiB,aAAa,CAAC;IAC7B,UAAiB,iBAAiB;QAChC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QACzB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;QACtB,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,IAAI,CAAC,EAAE,aAAa,CAAC,IAAI,CAAC;QAC1B,QAAQ,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC;QAClC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QACzB,EAAE,CAAC,EAAE,MAAM,CAAC;QACZ,UAAU,CAAC,EAAE,WAAW,CAAC,UAAU,CAAC,CAAC;QACrC,aAAa,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;QACvC,SAAS,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;QACnC,iBAAiB,CAAC,EAAE,aAAa,CAAC,qBAAqB,CAAC;KACzD;IAED,UAAiB,qBAAqB;QACpC,wBAAwB,CAAC,EAAE,OAAO,CAAC;QACnC,YAAY,CAAC,EAAE,YAAY,CAAC;KAC7B;IAED,UAAiB,WAAW;QAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,kBAAkB,CAAC,EAAE,MAAM,CAAC;QAC5B,iBAAiB,CAAC,EAAE,MAAM,CAAC;QAC3B,uBAAuB,CAAC,EAAE,MAAM,CAAC;QACjC,wBAAwB,CAAC,EAAE,MAAM,CAAC;QAClC,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAC9B,oBAAoB,CAAC,EAAE,MAAM,CAAC;KAC/B;IAED,KAAY,IAAI,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,aAAa,CAAC;IAC5E,KAAY,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAC;CAC3C;AAED,MAAM,WAAW,aAAc,SAAQ,kBAAkB;IACvD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA8BG;IACH,KAAK,EAAE,aAAa,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAEtD;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;;;;;;;;;;;;OAeG;IACH,WAAW,CAAC,EAAE,aAAa,CAAC,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/flashbar/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE,yBAAiB,aAAa,CAAC;IAC7B,UAAiB,iBAAiB;QAChC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QACzB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;QACtB,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,IAAI,CAAC,EAAE,aAAa,CAAC,IAAI,CAAC;QAC1B,QAAQ,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC;QAClC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QACzB,EAAE,CAAC,EAAE,MAAM,CAAC;QACZ,UAAU,CAAC,EAAE,WAAW,CAAC,UAAU,CAAC,CAAC;QACrC,aAAa,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;QACvC,SAAS,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;QACnC,iBAAiB,CAAC,EAAE,aAAa,CAAC,qBAAqB,CAAC;KACzD;IAED,UAAiB,qBAAqB;QACpC,wBAAwB,CAAC,EAAE,OAAO,CAAC;QACnC,YAAY,CAAC,EAAE,YAAY,CAAC;KAC7B;IAED,UAAiB,WAAW;QAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,kBAAkB,CAAC,EAAE,MAAM,CAAC;QAC5B,iBAAiB,CAAC,EAAE,MAAM,CAAC;QAC3B,uBAAuB,CAAC,EAAE,MAAM,CAAC;QACjC,wBAAwB,CAAC,EAAE,MAAM,CAAC;QAClC,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAC9B,oBAAoB,CAAC,EAAE,MAAM,CAAC;KAC/B;IAED,UAAiB,KAAK;QACpB,IAAI,CAAC,EAAE;YACL,IAAI,CAAC,EAAE;gBACL,UAAU,CAAC,EAAE;oBACX,KAAK,CAAC,EAAE,MAAM,CAAC;oBACf,IAAI,CAAC,EAAE,MAAM,CAAC;oBACd,UAAU,CAAC,EAAE,MAAM,CAAC;oBACpB,OAAO,CAAC,EAAE,MAAM,CAAC;oBACjB,OAAO,CAAC,EAAE,MAAM,CAAC;iBAClB,CAAC;gBACF,WAAW,CAAC,EAAE;oBACZ,KAAK,CAAC,EAAE,MAAM,CAAC;oBACf,IAAI,CAAC,EAAE,MAAM,CAAC;oBACd,UAAU,CAAC,EAAE,MAAM,CAAC;oBACpB,OAAO,CAAC,EAAE,MAAM,CAAC;oBACjB,OAAO,CAAC,EAAE,MAAM,CAAC;iBAClB,CAAC;gBACF,YAAY,CAAC,EAAE,MAAM,CAAC;gBACtB,WAAW,CAAC,EAAE,MAAM,CAAC;gBACrB,KAAK,CAAC,EAAE;oBACN,KAAK,CAAC,EAAE,MAAM,CAAC;oBACf,IAAI,CAAC,EAAE,MAAM,CAAC;oBACd,UAAU,CAAC,EAAE,MAAM,CAAC;oBACpB,OAAO,CAAC,EAAE,MAAM,CAAC;oBACjB,OAAO,CAAC,EAAE,MAAM,CAAC;iBAClB,CAAC;gBACF,SAAS,CAAC,EAAE;oBACV,WAAW,CAAC,EAAE,MAAM,CAAC;oBACrB,YAAY,CAAC,EAAE,MAAM,CAAC;oBACtB,WAAW,CAAC,EAAE,MAAM,CAAC;iBACtB,CAAC;aACH,CAAC;YACF,aAAa,CAAC,EAAE;gBACd,KAAK,CAAC,EAAE;oBACN,MAAM,CAAC,EAAE,MAAM,CAAC;oBAChB,OAAO,CAAC,EAAE,MAAM,CAAC;oBACjB,KAAK,CAAC,EAAE,MAAM,CAAC;iBAChB,CAAC;gBACF,SAAS,CAAC,EAAE;oBACV,WAAW,CAAC,EAAE,MAAM,CAAC;oBACrB,YAAY,CAAC,EAAE,MAAM,CAAC;oBACtB,WAAW,CAAC,EAAE,MAAM,CAAC;iBACtB,CAAC;aACH,CAAC;SACH,CAAC;QACF,eAAe,CAAC,EAAE;YAChB,IAAI,EAAE;gBACJ,UAAU,CAAC,EAAE;oBACX,MAAM,CAAC,EAAE,MAAM,CAAC;oBAChB,OAAO,CAAC,EAAE,MAAM,CAAC;oBACjB,KAAK,CAAC,EAAE,MAAM,CAAC;iBAChB,CAAC;gBACF,WAAW,CAAC,EAAE;oBACZ,MAAM,CAAC,EAAE,MAAM,CAAC;oBAChB,OAAO,CAAC,EAAE,MAAM,CAAC;oBACjB,KAAK,CAAC,EAAE,MAAM,CAAC;iBAChB,CAAC;gBACF,YAAY,CAAC,EAAE,MAAM,CAAC;gBACtB,WAAW,CAAC,EAAE,MAAM,CAAC;gBACrB,KAAK,CAAC,EAAE;oBACN,MAAM,CAAC,EAAE,MAAM,CAAC;oBAChB,OAAO,CAAC,EAAE,MAAM,CAAC;oBACjB,KAAK,CAAC,EAAE,MAAM,CAAC;iBAChB,CAAC;aACH,CAAC;SACH,CAAC;KACH;IAED,KAAY,IAAI,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,aAAa,CAAC;IAC5E,KAAY,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAC;CAC3C;AAED,MAAM,WAAW,aAAc,SAAQ,kBAAkB;IACvD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA8BG;IACH,KAAK,EAAE,aAAa,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAEtD;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;;;;;;;;;;;;OAeG;IACH,WAAW,CAAC,EAAE,aAAa,CAAC,WAAW,CAAC;IAExC;;OAEG;IACH,KAAK,CAAC,EAAE,aAAa,CAAC,KAAK,CAAC;CAC7B"}
|
|
@@ -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 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"]}
|
|
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 * @awsuiSystem core\n */\n style?: FlashbarProps.Style;\n}\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { FlashbarProps } from './interfaces';
|
|
3
|
-
export default function NonCollapsibleFlashbar({ items, i18nStrings, ...restProps }: FlashbarProps): JSX.Element;
|
|
3
|
+
export default function NonCollapsibleFlashbar({ items, i18nStrings, style, ...restProps }: FlashbarProps): JSX.Element;
|
|
4
4
|
//# sourceMappingURL=non-collapsible-flashbar.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"non-collapsible-flashbar.d.ts","sourceRoot":"","sources":["../../../src/flashbar/non-collapsible-flashbar.tsx"],"names":[],"mappings":";AAcA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAI7C,MAAM,CAAC,OAAO,UAAU,sBAAsB,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,SAAS,EAAE,EAAE,aAAa,
|
|
1
|
+
{"version":3,"file":"non-collapsible-flashbar.d.ts","sourceRoot":"","sources":["../../../src/flashbar/non-collapsible-flashbar.tsx"],"names":[],"mappings":";AAcA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAI7C,MAAM,CAAC,OAAO,UAAU,sBAAsB,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,SAAS,EAAE,EAAE,aAAa,eAiHxG"}
|