@cloudscape-design/components-themeable 3.0.227 → 3.0.228

package/lib/internal/template/flashbar/flash.js

@@ -1,4 +1,3 @@
-import { __assign } from "tslib";
 import React from 'react';
 import InternalSpinner from '../spinner/internal';
 import InternalIcon from '../icon/internal';
@@ -12,11 +11,11 @@ import useFocusVisible from '../internal/hooks/focus-visible';
 import LiveRegion from '../internal/components/live-region';
 import { sendDismissMetric } from './internal/analytics';
 import { FOCUS_THROTTLE_DELAY } from './utils';
-var ICON_TYPES = {
+const ICON_TYPES = {
     success: 'status-positive',
     warning: 'status-warning',
     info: 'status-info',
-    error: 'status-negative'
+    error: 'status-negative',
 };
 function actionButton(buttonText, onButtonClick) {
     return (React.createElement(InternalButton, { onClick: onButtonClick, className: styles['action-button'], formAction: "none" }, buttonText));
@@ -25,45 +24,43 @@ function dismissButton(dismissLabel, onDismiss) {
     return (React.createElement("div", { className: styles['dismiss-button-wrapper'] },
         React.createElement(InternalButton, { onClick: onDismiss, className: styles['dismiss-button'], variant: "flashbar-icon", iconName: "close", formAction: "none", ariaLabel: dismissLabel })));
 }
-export var focusFlashById = throttle(function (element, itemId) {
+export const focusFlashById = throttle((element, itemId) => {
     var _a;
-    var selector = "[data-itemid=\"".concat(CSS.escape(itemId), "\"] .").concat(styles['flash-focus-container']);
+    const selector = `[data-itemid="${CSS.escape(itemId)}"] .${styles['flash-focus-container']}`;
     (_a = element === null || element === void 0 ? void 0 : element.querySelector(selector)) === null || _a === void 0 ? void 0 : _a.focus();
 }, FOCUS_THROTTLE_DELAY, { trailing: false });
-export var Flash = React.forwardRef(function (_a, ref) {
-    var _b;
-    var id = _a.id, header = _a.header, content = _a.content, dismissible = _a.dismissible, dismissLabel = _a.dismissLabel, statusIconAriaLabel = _a.statusIconAriaLabel, loading = _a.loading, action = _a.action, buttonText = _a.buttonText, onButtonClick = _a.onButtonClick, onDismiss = _a.onDismiss, className = _a.className, transitionState = _a.transitionState, ariaRole = _a.ariaRole, _c = _a.type, type = _c === void 0 ? 'info' : _c;
-    var focusVisible = useFocusVisible();
+export const Flash = React.forwardRef(({ id, header, content, dismissible, dismissLabel, statusIconAriaLabel, loading, action, buttonText, onButtonClick, onDismiss, className, transitionState, ariaRole, type = 'info', }, ref) => {
+    const focusVisible = useFocusVisible();
     if (isDevelopment) {
         if (buttonText && !onButtonClick) {
-            warnOnce('Flashbar', "You provided a `buttonText` prop without an `onButtonClick` handler. This will render a non-interactive action button.");
+            warnOnce('Flashbar', `You provided a \`buttonText\` prop without an \`onButtonClick\` handler. This will render a non-interactive action button.`);
         }
         if (dismissible && !onDismiss) {
-            warnOnce('Flashbar', "You have set the `dismissible` prop without an `onDismiss` handler. This will render a non-interactive dismiss button.");
+            warnOnce('Flashbar', `You have set the \`dismissible\` prop without an \`onDismiss\` handler. This will render a non-interactive dismiss button.`);
         }
     }
-    var button = action || (buttonText && actionButton(buttonText, onButtonClick));
-    var iconType = ICON_TYPES[type];
-    var icon = loading ? React.createElement(InternalSpinner, null) : React.createElement(InternalIcon, { name: iconType });
-    var effectiveType = loading ? 'info' : type;
-    var announcement = [statusIconAriaLabel, header, content].filter(Boolean).join(' ');
-    var handleDismiss = function (event) {
+    const button = action || (buttonText && actionButton(buttonText, onButtonClick));
+    const iconType = ICON_TYPES[type];
+    const icon = loading ? React.createElement(InternalSpinner, null) : React.createElement(InternalIcon, { name: iconType });
+    const effectiveType = loading ? 'info' : type;
+    const announcement = [statusIconAriaLabel, header, content].filter(Boolean).join(' ');
+    const handleDismiss = event => {
         sendDismissMetric(effectiveType);
         onDismiss && onDismiss(event);
     };
     return (
     // We're not using "polite" or "assertive" here, just turning default behavior off.
     // eslint-disable-next-line @cloudscape-design/prefer-live-region
-    React.createElement("div", { ref: ref, role: ariaRole, "aria-live": ariaRole ? 'off' : undefined, "data-itemid": id, className: clsx(styles.flash, styles["flash-type-".concat(effectiveType)], className, transitionState && (_b = {},
-            _b[styles.enter] = transitionState === 'enter',
-            _b[styles.entering] = transitionState === 'entering',
-            _b[styles.entered] = transitionState === 'entered',
-            _b[styles.exit] = transitionState === 'exit',
-            _b[styles.exiting] = transitionState === 'exiting',
-            _b[styles.exited] = transitionState === 'exited',
-            _b)) },
+    React.createElement("div", { ref: ref, role: ariaRole, "aria-live": ariaRole ? 'off' : undefined, "data-itemid": id, className: clsx(styles.flash, styles[`flash-type-${effectiveType}`], className, transitionState && {
+            [styles.enter]: transitionState === 'enter',
+            [styles.entering]: transitionState === 'entering',
+            [styles.entered]: transitionState === 'entered',
+            [styles.exit]: transitionState === 'exit',
+            [styles.exiting]: transitionState === 'exiting',
+            [styles.exited]: transitionState === 'exited',
+        }) },
         React.createElement("div", { className: styles['flash-body'] },
-            React.createElement("div", __assign({}, focusVisible, { className: styles['flash-focus-container'], tabIndex: -1 }),
+            React.createElement("div", Object.assign({}, focusVisible, { className: styles['flash-focus-container'], tabIndex: -1 }),
                 React.createElement("div", { className: clsx(styles['flash-icon'], styles['flash-text']), role: "img", "aria-label": statusIconAriaLabel }, icon),
                 React.createElement("div", { className: clsx(styles['flash-message'], styles['flash-text']) },
                     React.createElement("div", { className: styles['flash-header'] }, header),

package/lib/internal/template/flashbar/flash.js.map

@@ -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 { FlashbarProps } from './interfaces';\nimport React from 'react';\nimport InternalSpinner from '../spinner/internal';\nimport InternalIcon from '../icon/internal';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport { InternalButton } from '../button/internal';\nimport { warnOnce } from '../internal/logging';\nimport { isDevelopment } from '../internal/is-development';\nimport { throttle } from '../internal/utils/throttle';\nimport useFocusVisible from '../internal/hooks/focus-visible';\nimport LiveRegion from '../internal/components/live-region';\nimport { ButtonProps } from '../button/interfaces';\n\nimport { sendDismissMetric } from './internal/analytics';\n\nimport { FOCUS_THROTTLE_DELAY } from './utils';\n\nconst ICON_TYPES = {\n  success: 'status-positive',\n  warning: 'status-warning',\n  info: 'status-info',\n  error: 'status-negative',\n} as const;\n\nfunction actionButton(\n  buttonText: FlashbarProps.MessageDefinition['buttonText'],\n  onButtonClick: FlashbarProps.MessageDefinition['onButtonClick']\n) {\n  return (\n    <InternalButton onClick={onButtonClick} className={styles['action-button']} formAction=\"none\">\n      {buttonText}\n    </InternalButton>\n  );\n}\n\nfunction dismissButton(\n  dismissLabel: FlashbarProps.MessageDefinition['dismissLabel'],\n  onDismiss: FlashbarProps.MessageDefinition['onDismiss']\n) {\n  return (\n    <div className={styles['dismiss-button-wrapper']}>\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\nexport interface FlashProps extends FlashbarProps.MessageDefinition {\n  className: string;\n  transitionState?: string;\n}\n\nexport const Flash = React.forwardRef(\n  (\n    {\n      id,\n      header,\n      content,\n      dismissible,\n      dismissLabel,\n      statusIconAriaLabel,\n      loading,\n      action,\n      buttonText,\n      onButtonClick,\n      onDismiss,\n      className,\n      transitionState,\n      ariaRole,\n      type = 'info',\n    }: FlashProps,\n    ref: React.Ref<HTMLDivElement>\n  ) => {\n    const focusVisible = useFocusVisible();\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 button = action || (buttonText && actionButton(buttonText, onButtonClick));\n\n    const iconType = ICON_TYPES[type];\n\n    const icon = loading ? <InternalSpinner /> : <InternalIcon name={iconType} />;\n\n    const effectiveType = loading ? 'info' : type;\n\n    const announcement = [statusIconAriaLabel, header, content].filter(Boolean).join(' ');\n\n    const handleDismiss: ButtonProps['onClick'] = event => {\n      sendDismissMetric(effectiveType);\n      onDismiss && onDismiss(event);\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={ref}\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        )}\n      >\n        <div className={styles['flash-body']}>\n          <div {...focusVisible} className={styles['flash-focus-container']} tabIndex={-1}>\n            <div\n              className={clsx(styles['flash-icon'], styles['flash-text'])}\n              role=\"img\"\n              aria-label={statusIconAriaLabel}\n            >\n              {icon}\n            </div>\n            <div className={clsx(styles['flash-message'], styles['flash-text'])}>\n              <div className={styles['flash-header']}>{header}</div>\n              <div className={styles['flash-content']}>{content}</div>\n            </div>\n          </div>\n          {button && <div className={styles['action-button-wrapper']}>{button}</div>}\n        </div>\n        {dismissible && dismissButton(dismissLabel, handleDismiss)}\n        {ariaRole === 'status' && <LiveRegion>{announcement}</LiveRegion>}\n      </div>\n    );\n  }\n);\n"]}
+{"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 { FlashbarProps } from './interfaces';\nimport React from 'react';\nimport InternalSpinner from '../spinner/internal';\nimport InternalIcon from '../icon/internal';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport { InternalButton } from '../button/internal';\nimport { warnOnce } from '../internal/logging';\nimport { isDevelopment } from '../internal/is-development';\nimport { throttle } from '../internal/utils/throttle';\nimport useFocusVisible from '../internal/hooks/focus-visible';\nimport LiveRegion from '../internal/components/live-region';\nimport { ButtonProps } from '../button/interfaces';\n\nimport { sendDismissMetric } from './internal/analytics';\n\nimport { FOCUS_THROTTLE_DELAY } from './utils';\n\nconst ICON_TYPES = {\n  success: 'status-positive',\n  warning: 'status-warning',\n  info: 'status-info',\n  error: 'status-negative',\n} as const;\n\nfunction actionButton(\n  buttonText: FlashbarProps.MessageDefinition['buttonText'],\n  onButtonClick: FlashbarProps.MessageDefinition['onButtonClick']\n) {\n  return (\n    <InternalButton onClick={onButtonClick} className={styles['action-button']} formAction=\"none\">\n      {buttonText}\n    </InternalButton>\n  );\n}\n\nfunction dismissButton(\n  dismissLabel: FlashbarProps.MessageDefinition['dismissLabel'],\n  onDismiss: FlashbarProps.MessageDefinition['onDismiss']\n) {\n  return (\n    <div className={styles['dismiss-button-wrapper']}>\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\nexport interface FlashProps extends FlashbarProps.MessageDefinition {\n  className: string;\n  transitionState?: string;\n}\n\nexport const Flash = React.forwardRef(\n  (\n    {\n      id,\n      header,\n      content,\n      dismissible,\n      dismissLabel,\n      statusIconAriaLabel,\n      loading,\n      action,\n      buttonText,\n      onButtonClick,\n      onDismiss,\n      className,\n      transitionState,\n      ariaRole,\n      type = 'info',\n    }: FlashProps,\n    ref: React.Ref<HTMLDivElement>\n  ) => {\n    const focusVisible = useFocusVisible();\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 button = action || (buttonText && actionButton(buttonText, onButtonClick));\n\n    const iconType = ICON_TYPES[type];\n\n    const icon = loading ? <InternalSpinner /> : <InternalIcon name={iconType} />;\n\n    const effectiveType = loading ? 'info' : type;\n\n    const announcement = [statusIconAriaLabel, header, content].filter(Boolean).join(' ');\n\n    const handleDismiss: ButtonProps['onClick'] = event => {\n      sendDismissMetric(effectiveType);\n      onDismiss && onDismiss(event);\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={ref}\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        )}\n      >\n        <div className={styles['flash-body']}>\n          <div {...focusVisible} className={styles['flash-focus-container']} tabIndex={-1}>\n            <div\n              className={clsx(styles['flash-icon'], styles['flash-text'])}\n              role=\"img\"\n              aria-label={statusIconAriaLabel}\n            >\n              {icon}\n            </div>\n            <div className={clsx(styles['flash-message'], styles['flash-text'])}>\n              <div className={styles['flash-header']}>{header}</div>\n              <div className={styles['flash-content']}>{content}</div>\n            </div>\n          </div>\n          {button && <div className={styles['action-button-wrapper']}>{button}</div>}\n        </div>\n        {dismissible && dismissButton(dismissLabel, handleDismiss)}\n        {ariaRole === 'status' && <LiveRegion>{announcement}</LiveRegion>}\n      </div>\n    );\n  }\n);\n"]}

package/lib/internal/template/flashbar/index.js

@@ -1,4 +1,3 @@
-import { __assign } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React, { useEffect } from 'react';
@@ -7,16 +6,16 @@ import CollapsibleFlashbar from './collapsible-flashbar';
 import NonCollapsibleFlashbar from './non-collapsible-flashbar';
 import { sendRenderMetric } from './internal/analytics';
 export default function Flashbar(props) {
-    useEffect(function () {
+    useEffect(() => {
         if (props.items.length > 0) {
             sendRenderMetric(props.items);
         }
     }, [props.items]);
     if (props.stackItems) {
-        return React.createElement(CollapsibleFlashbar, __assign({}, props));
+        return React.createElement(CollapsibleFlashbar, Object.assign({}, props));
     }
     else {
-        return React.createElement(NonCollapsibleFlashbar, __assign({}, props));
+        return React.createElement(NonCollapsibleFlashbar, Object.assign({}, props));
     }
 }
 applyDisplayName(Flashbar, 'Flashbar');

package/lib/internal/template/flashbar/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/flashbar/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,mBAAmB,MAAM,wBAAwB,CAAC;AACzD,OAAO,sBAAsB,MAAM,4BAA4B,CAAC;AAEhE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAIxD,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,KAAoB;IACnD,SAAS,CAAC;QACR,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;YAC1B,gBAAgB,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;SAC/B;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IAElB,IAAI,KAAK,CAAC,UAAU,EAAE;QACpB,OAAO,oBAAC,mBAAmB,eAAK,KAAK,EAAI,CAAC;KAC3C;SAAM;QACL,OAAO,oBAAC,sBAAsB,eAAK,KAAK,EAAI,CAAC;KAC9C;AACH,CAAC;AAED,gBAAgB,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect } from 'react';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { FlashbarProps } from './interfaces';\nimport CollapsibleFlashbar from './collapsible-flashbar';\nimport NonCollapsibleFlashbar from './non-collapsible-flashbar';\n\nimport { sendRenderMetric } from './internal/analytics';\n\nexport { FlashbarProps };\n\nexport default function Flashbar(props: FlashbarProps) {\n  useEffect(() => {\n    if (props.items.length > 0) {\n      sendRenderMetric(props.items);\n    }\n  }, [props.items]);\n\n  if (props.stackItems) {\n    return <CollapsibleFlashbar {...props} />;\n  } else {\n    return <NonCollapsibleFlashbar {...props} />;\n  }\n}\n\napplyDisplayName(Flashbar, 'Flashbar');\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/flashbar/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,mBAAmB,MAAM,wBAAwB,CAAC;AACzD,OAAO,sBAAsB,MAAM,4BAA4B,CAAC;AAEhE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAIxD,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,KAAoB;IACnD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;YAC1B,gBAAgB,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;SAC/B;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IAElB,IAAI,KAAK,CAAC,UAAU,EAAE;QACpB,OAAO,oBAAC,mBAAmB,oBAAK,KAAK,EAAI,CAAC;KAC3C;SAAM;QACL,OAAO,oBAAC,sBAAsB,oBAAK,KAAK,EAAI,CAAC;KAC9C;AACH,CAAC;AAED,gBAAgB,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect } from 'react';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { FlashbarProps } from './interfaces';\nimport CollapsibleFlashbar from './collapsible-flashbar';\nimport NonCollapsibleFlashbar from './non-collapsible-flashbar';\n\nimport { sendRenderMetric } from './internal/analytics';\n\nexport { FlashbarProps };\n\nexport default function Flashbar(props: FlashbarProps) {\n  useEffect(() => {\n    if (props.items.length > 0) {\n      sendRenderMetric(props.items);\n    }\n  }, [props.items]);\n\n  if (props.stackItems) {\n    return <CollapsibleFlashbar {...props} />;\n  } else {\n    return <NonCollapsibleFlashbar {...props} />;\n  }\n}\n\napplyDisplayName(Flashbar, 'Flashbar');\n"]}

package/lib/internal/template/flashbar/internal/analytics.js

@@ -3,29 +3,29 @@
 import { PACKAGE_SOURCE, PACKAGE_VERSION } from '../../internal/environment';
 import { Metrics } from '../../internal/metrics';
 import { getFlashTypeCount } from '../utils';
-var metrics = new Metrics(PACKAGE_SOURCE, PACKAGE_VERSION);
-var eventContext = 'csa_flashbar';
-export var sendRenderMetric = function (items) {
-    var countByType = getFlashTypeCount(items);
+const metrics = new Metrics(PACKAGE_SOURCE, PACKAGE_VERSION);
+const eventContext = 'csa_flashbar';
+export const sendRenderMetric = (items) => {
+    const countByType = getFlashTypeCount(items);
     metrics.sendPanoramaMetric({
-        eventContext: eventContext,
+        eventContext,
         eventType: 'render',
         eventValue: items.length.toString(),
-        eventDetail: countByType
+        eventDetail: countByType,
     });
 };
-export var sendToggleMetric = function (itemsCount, expanded) {
+export const sendToggleMetric = (itemsCount, expanded) => {
     metrics.sendPanoramaMetric({
-        eventContext: eventContext,
+        eventContext,
         eventType: expanded ? 'expand' : 'collapse',
-        eventValue: itemsCount.toString()
+        eventValue: itemsCount.toString(),
     });
 };
-export var sendDismissMetric = function (itemType) {
+export const sendDismissMetric = (itemType) => {
     metrics.sendPanoramaMetric({
-        eventContext: eventContext,
+        eventContext,
         eventType: 'dismiss',
-        eventValue: itemType
+        eventValue: itemType,
     });
 };
 //# sourceMappingURL=analytics.js.map

package/lib/internal/template/flashbar/internal/analytics.js.map

@@ -1 +1 @@
-{"version":3,"file":"analytics.js","sourceRoot":"","sources":["../../../../src/flashbar/internal/analytics.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAC7E,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAEjD,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAE7C,IAAM,OAAO,GAAG,IAAI,OAAO,CAAC,cAAc,EAAE,eAAe,CAAC,CAAC;AAC7D,IAAM,YAAY,GAAG,cAAc,CAAC;AAEpC,MAAM,CAAC,IAAM,gBAAgB,GAAG,UAAC,KAA6B;IAC5D,IAAM,WAAW,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAE7C,OAAO,CAAC,kBAAkB,CAAC;QACzB,YAAY,cAAA;QACZ,SAAS,EAAE,QAAQ;QACnB,UAAU,EAAE,KAAK,CAAC,MAAM,CAAC,QAAQ,EAAE;QACnC,WAAW,EAAE,WAAW;KACzB,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,gBAAgB,GAAG,UAAC,UAAkB,EAAE,QAAiB;IACpE,OAAO,CAAC,kBAAkB,CAAC;QACzB,YAAY,cAAA;QACZ,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU;QAC3C,UAAU,EAAE,UAAU,CAAC,QAAQ,EAAE;KAClC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,iBAAiB,GAAG,UAAC,QAAgB;IAChD,OAAO,CAAC,kBAAkB,CAAC;QACzB,YAAY,cAAA;QACZ,SAAS,EAAE,SAAS;QACpB,UAAU,EAAE,QAAQ;KACrB,CAAC,CAAC;AACL,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { PACKAGE_SOURCE, PACKAGE_VERSION } from '../../internal/environment';\nimport { Metrics } from '../../internal/metrics';\nimport { FlashbarProps } from '../interfaces';\nimport { getFlashTypeCount } from '../utils';\n\nconst metrics = new Metrics(PACKAGE_SOURCE, PACKAGE_VERSION);\nconst eventContext = 'csa_flashbar';\n\nexport const sendRenderMetric = (items: FlashbarProps['items']) => {\n  const countByType = getFlashTypeCount(items);\n\n  metrics.sendPanoramaMetric({\n    eventContext,\n    eventType: 'render',\n    eventValue: items.length.toString(),\n    eventDetail: countByType,\n  });\n};\n\nexport const sendToggleMetric = (itemsCount: number, expanded: boolean) => {\n  metrics.sendPanoramaMetric({\n    eventContext,\n    eventType: expanded ? 'expand' : 'collapse',\n    eventValue: itemsCount.toString(),\n  });\n};\n\nexport const sendDismissMetric = (itemType: string) => {\n  metrics.sendPanoramaMetric({\n    eventContext,\n    eventType: 'dismiss',\n    eventValue: itemType,\n  });\n};\n"]}
+{"version":3,"file":"analytics.js","sourceRoot":"","sources":["../../../../src/flashbar/internal/analytics.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAC7E,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAEjD,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAE7C,MAAM,OAAO,GAAG,IAAI,OAAO,CAAC,cAAc,EAAE,eAAe,CAAC,CAAC;AAC7D,MAAM,YAAY,GAAG,cAAc,CAAC;AAEpC,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,KAA6B,EAAE,EAAE;IAChE,MAAM,WAAW,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAE7C,OAAO,CAAC,kBAAkB,CAAC;QACzB,YAAY;QACZ,SAAS,EAAE,QAAQ;QACnB,UAAU,EAAE,KAAK,CAAC,MAAM,CAAC,QAAQ,EAAE;QACnC,WAAW,EAAE,WAAW;KACzB,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,UAAkB,EAAE,QAAiB,EAAE,EAAE;IACxE,OAAO,CAAC,kBAAkB,CAAC;QACzB,YAAY;QACZ,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU;QAC3C,UAAU,EAAE,UAAU,CAAC,QAAQ,EAAE;KAClC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,QAAgB,EAAE,EAAE;IACpD,OAAO,CAAC,kBAAkB,CAAC;QACzB,YAAY;QACZ,SAAS,EAAE,SAAS;QACpB,UAAU,EAAE,QAAQ;KACrB,CAAC,CAAC;AACL,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { PACKAGE_SOURCE, PACKAGE_VERSION } from '../../internal/environment';\nimport { Metrics } from '../../internal/metrics';\nimport { FlashbarProps } from '../interfaces';\nimport { getFlashTypeCount } from '../utils';\n\nconst metrics = new Metrics(PACKAGE_SOURCE, PACKAGE_VERSION);\nconst eventContext = 'csa_flashbar';\n\nexport const sendRenderMetric = (items: FlashbarProps['items']) => {\n  const countByType = getFlashTypeCount(items);\n\n  metrics.sendPanoramaMetric({\n    eventContext,\n    eventType: 'render',\n    eventValue: items.length.toString(),\n    eventDetail: countByType,\n  });\n};\n\nexport const sendToggleMetric = (itemsCount: number, expanded: boolean) => {\n  metrics.sendPanoramaMetric({\n    eventContext,\n    eventType: expanded ? 'expand' : 'collapse',\n    eventValue: itemsCount.toString(),\n  });\n};\n\nexport const sendDismissMetric = (itemType: string) => {\n  metrics.sendPanoramaMetric({\n    eventContext,\n    eventType: 'dismiss',\n    eventValue: itemType,\n  });\n};\n"]}

package/lib/internal/template/flashbar/non-collapsible-flashbar.js

@@ -1,4 +1,4 @@
-import { __assign, __rest } from "tslib";
+import { __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import clsx from 'clsx';
@@ -11,15 +11,15 @@ import { getVisualContextClassname } from '../internal/components/visual-context
 import styles from './styles.css.js';
 import { useFlashbar } from './common';
 export default function NonCollapsibleFlashbar(_a) {
-    var items = _a.items, restProps = __rest(_a, ["items"]);
-    var _b = useFlashbar(__assign({ items: items }, restProps)), allItemsHaveId = _b.allItemsHaveId, ariaLabel = _b.ariaLabel, baseProps = _b.baseProps, breakpoint = _b.breakpoint, isReducedMotion = _b.isReducedMotion, isVisualRefresh = _b.isVisualRefresh, mergedRef = _b.mergedRef;
+    var { items } = _a, restProps = __rest(_a, ["items"]);
+    const { allItemsHaveId, ariaLabel, baseProps, breakpoint, isReducedMotion, isVisualRefresh, mergedRef } = useFlashbar(Object.assign({ items }, restProps));
     /**
      * All the flash items should have ids so we can identify which DOM element is being
      * removed from the DOM to animate it. Motion will be disabled if any of the provided
      * flash messages does not contain an `id`.
      */
-    var motionDisabled = isReducedMotion || !isVisualRefresh || !allItemsHaveId;
-    var animateFlash = !isReducedMotion && isVisualRefresh;
+    const motionDisabled = isReducedMotion || !isVisualRefresh || !allItemsHaveId;
+    const animateFlash = !isReducedMotion && isVisualRefresh;
     /**
      * If the flashbar is flat and motion is `enabled` then the adding and removing of items
      * from the flashbar will render with visual transitions.
@@ -31,9 +31,9 @@ export default function NonCollapsibleFlashbar(_a) {
         return (
         // This is a proxy for <ul>, so we're not applying a class to another actual component.
         // eslint-disable-next-line react/forbid-component-props
-        React.createElement(TransitionGroup, { component: "ul", className: styles['flash-list'], "aria-label": ariaLabel }, items.map(function (item, index) {
+        React.createElement(TransitionGroup, { component: "ul", className: styles['flash-list'], "aria-label": ariaLabel }, items.map((item, index) => {
             var _a;
-            return (React.createElement(Transition, { transitionChangeDelay: { entering: TIMEOUT_FOR_ENTERING_ANIMATION }, key: (_a = item.id) !== null && _a !== void 0 ? _a : index, "in": true }, function (state, transitionRootElement) {
+            return (React.createElement(Transition, { transitionChangeDelay: { entering: TIMEOUT_FOR_ENTERING_ANIMATION }, key: (_a = item.id) !== null && _a !== void 0 ? _a : index, in: true }, (state, transitionRootElement) => {
                 var _a;
                 return (React.createElement("li", { className: styles['flash-list-item'] }, renderItem(item, (_a = item.id) !== null && _a !== void 0 ? _a : index, transitionRootElement, state)));
             }));
@@ -47,7 +47,7 @@ export default function NonCollapsibleFlashbar(_a) {
         if (!motionDisabled || !items) {
             return;
         }
-        return (React.createElement("ul", { className: styles['flash-list'], "aria-label": ariaLabel }, items.map(function (item, index) {
+        return (React.createElement("ul", { className: styles['flash-list'], "aria-label": ariaLabel }, items.map((item, index) => {
             var _a, _b;
             return (React.createElement("li", { key: (_a = item.id) !== null && _a !== void 0 ? _a : index, className: styles['flash-list-item'] }, renderItem(item, (_b = item.id) !== null && _b !== void 0 ? _b : index)));
         })));
@@ -59,11 +59,11 @@ export default function NonCollapsibleFlashbar(_a) {
     function renderItem(item, key, transitionRootElement, transitionState) {
         return (React.createElement(Flash
         // eslint-disable-next-line react/forbid-component-props
-        , __assign({ 
+        , Object.assign({ 
             // eslint-disable-next-line react/forbid-component-props
             className: clsx(getVisualContextClassname('flashbar'), animateFlash && styles['flash-with-motion'], isVisualRefresh && styles['flash-refresh']), key: key, ref: transitionRootElement, transitionState: transitionState }, item)));
     }
-    return (React.createElement("div", __assign({}, baseProps, { className: clsx(baseProps.className, styles.flashbar, styles["breakpoint-".concat(breakpoint)]), ref: mergedRef }),
+    return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.flashbar, styles[`breakpoint-${breakpoint}`]), ref: mergedRef }),
         renderFlatItemsWithTransitions(),
         renderFlatItemsWithoutTransitions()));
 }

package/lib/internal/template/flashbar/non-collapsible-flashbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"non-collapsible-flashbar.js","sourceRoot":"","sources":["../../../src/flashbar/non-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 clsx from 'clsx';\nimport React from 'react';\nimport { Flash } from './flash';\nimport { FlashbarProps } from './interfaces';\nimport { TIMEOUT_FOR_ENTERING_ANIMATION } from './constant';\nimport { TransitionGroup } from 'react-transition-group';\nimport { Transition } from '../internal/components/transition';\nimport { getVisualContextClassname } from '../internal/components/visual-context';\n\nimport styles from './styles.css.js';\nimport { useFlashbar } from './common';\n\nexport { FlashbarProps };\n\nexport default function NonCollapsibleFlashbar({ items, ...restProps }: FlashbarProps) {\n  const { allItemsHaveId, ariaLabel, baseProps, breakpoint, isReducedMotion, isVisualRefresh, mergedRef } = useFlashbar(\n    {\n      items,\n      ...restProps,\n    }\n  );\n\n  /**\n   * All the flash items should have ids so we can identify which DOM element is being\n   * removed from the DOM to animate it. Motion will be disabled if any of the provided\n   * flash messages does not contain an `id`.\n   */\n  const motionDisabled = isReducedMotion || !isVisualRefresh || !allItemsHaveId;\n\n  const animateFlash = !isReducedMotion && isVisualRefresh;\n\n  /**\n   * If the flashbar is flat and motion is `enabled` then the adding and removing of items\n   * from the flashbar will render with visual transitions.\n   */\n  function renderFlatItemsWithTransitions() {\n    if (motionDisabled || !items) {\n      return;\n    }\n\n    return (\n      // This is a proxy for <ul>, so we're not applying a class to another actual component.\n      // eslint-disable-next-line react/forbid-component-props\n      <TransitionGroup component=\"ul\" className={styles['flash-list']} aria-label={ariaLabel}>\n        {items.map((item, index) => (\n          <Transition\n            transitionChangeDelay={{ entering: TIMEOUT_FOR_ENTERING_ANIMATION }}\n            key={item.id ?? index}\n            in={true}\n          >\n            {(state: string, transitionRootElement: React.Ref<HTMLDivElement> | undefined) => (\n              <li className={styles['flash-list-item']}>\n                {renderItem(item, item.id ?? index, transitionRootElement, state)}\n              </li>\n            )}\n          </Transition>\n        ))}\n      </TransitionGroup>\n    );\n  }\n\n  /**\n   * If the flashbar is flat and motion is `disabled` then the adding and removing of items\n   * from the flashbar will render without visual transitions.\n   */\n  function renderFlatItemsWithoutTransitions() {\n    if (!motionDisabled || !items) {\n      return;\n    }\n\n    return (\n      <ul className={styles['flash-list']} aria-label={ariaLabel}>\n        {items.map((item, index) => (\n          <li key={item.id ?? index} className={styles['flash-list-item']}>\n            {renderItem(item, item.id ?? index)}\n          </li>\n        ))}\n      </ul>\n    );\n  }\n\n  /**\n   * This is a shared render function for a single flashbar item to be used\n   * by the stacking, motion, and non-motion item group render functions.\n   */\n  function renderItem(\n    item: FlashbarProps.MessageDefinition,\n    key: string | number,\n    transitionRootElement?: React.Ref<HTMLDivElement> | undefined,\n    transitionState?: string | undefined\n  ) {\n    return (\n      <Flash\n        // eslint-disable-next-line react/forbid-component-props\n        className={clsx(\n          getVisualContextClassname('flashbar'),\n          animateFlash && styles['flash-with-motion'],\n          isVisualRefresh && styles['flash-refresh']\n        )}\n        key={key}\n        ref={transitionRootElement}\n        transitionState={transitionState}\n        {...item}\n      />\n    );\n  }\n\n  return (\n    <div\n      {...baseProps}\n      className={clsx(baseProps.className, styles.flashbar, styles[`breakpoint-${breakpoint}`])}\n      ref={mergedRef}\n    >\n      {renderFlatItemsWithTransitions()}\n      {renderFlatItemsWithoutTransitions()}\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"non-collapsible-flashbar.js","sourceRoot":"","sources":["../../../src/flashbar/non-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 clsx from 'clsx';\nimport React from 'react';\nimport { Flash } from './flash';\nimport { FlashbarProps } from './interfaces';\nimport { TIMEOUT_FOR_ENTERING_ANIMATION } from './constant';\nimport { TransitionGroup } from 'react-transition-group';\nimport { Transition } from '../internal/components/transition';\nimport { getVisualContextClassname } from '../internal/components/visual-context';\n\nimport styles from './styles.css.js';\nimport { useFlashbar } from './common';\n\nexport { FlashbarProps };\n\nexport default function NonCollapsibleFlashbar({ items, ...restProps }: FlashbarProps) {\n  const { allItemsHaveId, ariaLabel, baseProps, breakpoint, isReducedMotion, isVisualRefresh, mergedRef } = useFlashbar(\n    {\n      items,\n      ...restProps,\n    }\n  );\n\n  /**\n   * All the flash items should have ids so we can identify which DOM element is being\n   * removed from the DOM to animate it. Motion will be disabled if any of the provided\n   * flash messages does not contain an `id`.\n   */\n  const motionDisabled = isReducedMotion || !isVisualRefresh || !allItemsHaveId;\n\n  const animateFlash = !isReducedMotion && isVisualRefresh;\n\n  /**\n   * If the flashbar is flat and motion is `enabled` then the adding and removing of items\n   * from the flashbar will render with visual transitions.\n   */\n  function renderFlatItemsWithTransitions() {\n    if (motionDisabled || !items) {\n      return;\n    }\n\n    return (\n      // This is a proxy for <ul>, so we're not applying a class to another actual component.\n      // eslint-disable-next-line react/forbid-component-props\n      <TransitionGroup component=\"ul\" className={styles['flash-list']} aria-label={ariaLabel}>\n        {items.map((item, index) => (\n          <Transition\n            transitionChangeDelay={{ entering: TIMEOUT_FOR_ENTERING_ANIMATION }}\n            key={item.id ?? index}\n            in={true}\n          >\n            {(state: string, transitionRootElement: React.Ref<HTMLDivElement> | undefined) => (\n              <li className={styles['flash-list-item']}>\n                {renderItem(item, item.id ?? index, transitionRootElement, state)}\n              </li>\n            )}\n          </Transition>\n        ))}\n      </TransitionGroup>\n    );\n  }\n\n  /**\n   * If the flashbar is flat and motion is `disabled` then the adding and removing of items\n   * from the flashbar will render without visual transitions.\n   */\n  function renderFlatItemsWithoutTransitions() {\n    if (!motionDisabled || !items) {\n      return;\n    }\n\n    return (\n      <ul className={styles['flash-list']} aria-label={ariaLabel}>\n        {items.map((item, index) => (\n          <li key={item.id ?? index} className={styles['flash-list-item']}>\n            {renderItem(item, item.id ?? index)}\n          </li>\n        ))}\n      </ul>\n    );\n  }\n\n  /**\n   * This is a shared render function for a single flashbar item to be used\n   * by the stacking, motion, and non-motion item group render functions.\n   */\n  function renderItem(\n    item: FlashbarProps.MessageDefinition,\n    key: string | number,\n    transitionRootElement?: React.Ref<HTMLDivElement> | undefined,\n    transitionState?: string | undefined\n  ) {\n    return (\n      <Flash\n        // eslint-disable-next-line react/forbid-component-props\n        className={clsx(\n          getVisualContextClassname('flashbar'),\n          animateFlash && styles['flash-with-motion'],\n          isVisualRefresh && styles['flash-refresh']\n        )}\n        key={key}\n        ref={transitionRootElement}\n        transitionState={transitionState}\n        {...item}\n      />\n    );\n  }\n\n  return (\n    <div\n      {...baseProps}\n      className={clsx(baseProps.className, styles.flashbar, styles[`breakpoint-${breakpoint}`])}\n      ref={mergedRef}\n    >\n      {renderFlatItemsWithTransitions()}\n      {renderFlatItemsWithoutTransitions()}\n    </div>\n  );\n}\n"]}

package/lib/internal/template/flashbar/utils.js

@@ -1,14 +1,13 @@
-import { __assign } from "tslib";
-export var FOCUS_THROTTLE_DELAY = 2000;
-var typesToColors = {
+export const FOCUS_THROTTLE_DELAY = 2000;
+const typesToColors = {
     error: 'red',
     info: 'blue',
     progress: 'blue',
     success: 'green',
-    warning: 'blue'
+    warning: 'blue',
 };
 function getColorFromType(type) {
-    var defaultColor = 'blue';
+    const defaultColor = 'blue';
     return type ? typesToColors[type] || defaultColor : defaultColor;
 }
 export function getItemType(item) {
@@ -30,19 +29,19 @@ function getItemColor(item) {
 export function getVisibleCollapsedItems(items, desiredLength) {
     // First `desiredLength` items in the original array,
     // together with `isColorRepeated` to tell if they can be subject to be replaced later on if necessary
-    var itemsOnTop = [];
+    const itemsOnTop = [];
     // Items that fall outside `desiredIndexLength` but need to be "promoted" if possible
     // because they are of a different color which otherwise wouldn't be represented
-    var itemsToPromote = [];
-    var addedColors = new Set();
-    var allPossibleColors = Object.keys(typesToColors).length;
-    var finalLength = Math.min(items.length, desiredLength);
-    for (var i = 0; i < items.length; i++) {
-        var item = items[i];
-        var color = getItemColor(item);
-        var isColorRepeated = addedColors.has(color);
+    const itemsToPromote = [];
+    const addedColors = new Set();
+    const allPossibleColors = Object.keys(typesToColors).length;
+    const finalLength = Math.min(items.length, desiredLength);
+    for (let i = 0; i < items.length; i++) {
+        const item = items[i];
+        const color = getItemColor(item);
+        const isColorRepeated = addedColors.has(color);
         if (i < finalLength) {
-            itemsOnTop.push({ item: __assign(__assign({}, item), { expandedIndex: i }), isColorRepeated: isColorRepeated });
+            itemsOnTop.push({ item: Object.assign(Object.assign({}, item), { expandedIndex: i }), isColorRepeated });
         }
         else {
             if (addedColors.size === allPossibleColors) {
@@ -50,7 +49,7 @@ export function getVisibleCollapsedItems(items, desiredLength) {
                 break;
             }
             else if (!isColorRepeated) {
-                itemsToPromote.push(__assign(__assign({}, item), { expandedIndex: i }));
+                itemsToPromote.push(Object.assign(Object.assign({}, item), { expandedIndex: i }));
             }
         }
         addedColors.add(color);
@@ -58,10 +57,10 @@ export function getVisibleCollapsedItems(items, desiredLength) {
     // Generate the new array with the selected items, by picking from both arrays.
     // First, from the non-repeated items within the desired length...
     // We loop `itemsOnTop` starting from the end because we prefer to preserve the first ones rather than the old ones
-    var reversedInitialSelection = [];
-    var slotsReservedForPromotions = 0;
-    for (var j = itemsOnTop.length - 1; j >= 0; j--) {
-        var item = itemsOnTop[j];
+    const reversedInitialSelection = [];
+    let slotsReservedForPromotions = 0;
+    for (let j = itemsOnTop.length - 1; j >= 0; j--) {
+        const item = itemsOnTop[j];
         if (item.isColorRepeated && slotsReservedForPromotions < itemsToPromote.length) {
             slotsReservedForPromotions += 1;
         }
@@ -69,23 +68,22 @@ export function getVisibleCollapsedItems(items, desiredLength) {
             reversedInitialSelection.push(item.item);
         }
     }
-    var selectedItems = reversedInitialSelection.reverse();
+    const selectedItems = reversedInitialSelection.reverse();
     // ...and then complete the selection with as many promotable items as we can fit in the rest of the array
-    for (var k = 0; selectedItems.length < desiredLength; k++) {
+    for (let k = 0; selectedItems.length < desiredLength; k++) {
         selectedItems.push(itemsToPromote[k]);
     }
     return selectedItems;
 }
 export function getFlashTypeCount(items) {
-    var count = { error: 0, info: 0, progress: 0, success: 0, warning: 0 };
-    for (var _i = 0, items_1 = items; _i < items_1.length; _i++) {
-        var item = items_1[_i];
-        var type = getItemType(item);
+    const count = { error: 0, info: 0, progress: 0, success: 0, warning: 0 };
+    for (const item of items) {
+        const type = getItemType(item);
         count[type] += 1;
     }
     return count;
 }
-export var counterTypes = [
+export const counterTypes = [
     { type: 'error', labelName: 'errorIconAriaLabel', iconName: 'status-negative' },
     { type: 'warning', labelName: 'warningIconAriaLabel', iconName: 'status-warning' },
     { type: 'success', labelName: 'successIconAriaLabel', iconName: 'status-positive' },

package/lib/internal/template/flashbar/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/flashbar/utils.ts"],"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 { FlashbarProps, FlashType } from './interfaces';\nimport { IconProps } from '../icon/interfaces';\n\nexport const FOCUS_THROTTLE_DELAY = 2000;\n\n// Since the position of a notification changes when the Flashbar is collapsed,\n// it is useful on some situations (e.g, for animating) to know the original position of the item\n// in the non-collapsed state.\nexport interface StackableItem extends FlashbarProps.MessageDefinition {\n  expandedIndex: number;\n  collapsedIndex?: number;\n}\n\nconst typesToColors: Record<FlashType, string> = {\n  error: 'red',\n  info: 'blue',\n  progress: 'blue',\n  success: 'green',\n  warning: 'blue',\n};\n\nfunction getColorFromType(type?: FlashType): string {\n  const defaultColor = 'blue';\n  return type ? typesToColors[type] || defaultColor : defaultColor;\n}\n\nexport function getItemType(item: FlashbarProps.MessageDefinition) {\n  if (item.loading) {\n    return 'progress';\n  } else {\n    return item.type || 'info';\n  }\n}\n\nfunction getItemColor(item: FlashbarProps.MessageDefinition) {\n  return getColorFromType(getItemType(item));\n}\n\n/*\n Returns a selection of notifications, preserving the order when possible but making sure that all different colors in\n the stack are represented in the returned array.\n The order corresponds to how they are represented when using the collapsible feature (newest first, oldest last).\n */\nexport function getVisibleCollapsedItems(\n  items: ReadonlyArray<FlashbarProps.MessageDefinition>,\n  desiredLength: number\n): ReadonlyArray<StackableItem> {\n  // First `desiredLength` items in the original array,\n  // together with `isColorRepeated` to tell if they can be subject to be replaced later on if necessary\n  const itemsOnTop: { item: StackableItem; isColorRepeated: boolean }[] = [];\n\n  // Items that fall outside `desiredIndexLength` but need to be \"promoted\" if possible\n  // because they are of a different color which otherwise wouldn't be represented\n  const itemsToPromote: StackableItem[] = [];\n\n  const addedColors: Set<string> = new Set();\n  const allPossibleColors = Object.keys(typesToColors).length;\n  const finalLength = Math.min(items.length, desiredLength);\n\n  for (let i = 0; i < items.length; i++) {\n    const item = items[i];\n    const color = getItemColor(item);\n    const isColorRepeated = addedColors.has(color);\n    if (i < finalLength) {\n      itemsOnTop.push({ item: { ...item, expandedIndex: i }, isColorRepeated });\n    } else {\n      if (addedColors.size === allPossibleColors) {\n        // No need to keep looking for unrepresented colors, we can stop looping\n        break;\n      } else if (!isColorRepeated) {\n        itemsToPromote.push({ ...item, expandedIndex: i });\n      }\n    }\n    addedColors.add(color);\n  }\n  // Generate the new array with the selected items, by picking from both arrays.\n  // First, from the non-repeated items within the desired length...\n  // We loop `itemsOnTop` starting from the end because we prefer to preserve the first ones rather than the old ones\n  const reversedInitialSelection = [];\n  let slotsReservedForPromotions = 0;\n  for (let j = itemsOnTop.length - 1; j >= 0; j--) {\n    const item = itemsOnTop[j];\n    if (item.isColorRepeated && slotsReservedForPromotions < itemsToPromote.length) {\n      slotsReservedForPromotions += 1;\n    } else {\n      reversedInitialSelection.push(item.item);\n    }\n  }\n  const selectedItems = reversedInitialSelection.reverse();\n  // ...and then complete the selection with as many promotable items as we can fit in the rest of the array\n  for (let k = 0; selectedItems.length < desiredLength; k++) {\n    selectedItems.push(itemsToPromote[k]);\n  }\n  return selectedItems;\n}\n\nexport function getFlashTypeCount(items: readonly FlashbarProps.MessageDefinition[]): Record<FlashType, number> {\n  const count = { error: 0, info: 0, progress: 0, success: 0, warning: 0 };\n  for (const item of items) {\n    const type = getItemType(item);\n    count[type] += 1;\n  }\n  return count;\n}\n\nexport type LabelName =\n  | 'errorIconAriaLabel'\n  | 'warningIconAriaLabel'\n  | 'successIconAriaLabel'\n  | 'infoIconAriaLabel'\n  | 'inProgressIconAriaLabel';\n\nexport const counterTypes: {\n  type: FlashType;\n  labelName: LabelName;\n  iconName: IconProps.Name;\n}[] = [\n  { type: 'error', labelName: 'errorIconAriaLabel', iconName: 'status-negative' },\n  { type: 'warning', labelName: 'warningIconAriaLabel', iconName: 'status-warning' },\n  { type: 'success', labelName: 'successIconAriaLabel', iconName: 'status-positive' },\n  { type: 'info', labelName: 'infoIconAriaLabel', iconName: 'status-info' },\n  { type: 'progress', labelName: 'inProgressIconAriaLabel', iconName: 'status-in-progress' },\n];\n"]}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/flashbar/utils.ts"],"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 { FlashbarProps, FlashType } from './interfaces';\nimport { IconProps } from '../icon/interfaces';\n\nexport const FOCUS_THROTTLE_DELAY = 2000;\n\n// Since the position of a notification changes when the Flashbar is collapsed,\n// it is useful on some situations (e.g, for animating) to know the original position of the item\n// in the non-collapsed state.\nexport interface StackableItem extends FlashbarProps.MessageDefinition {\n  expandedIndex: number;\n  collapsedIndex?: number;\n}\n\nconst typesToColors: Record<FlashType, string> = {\n  error: 'red',\n  info: 'blue',\n  progress: 'blue',\n  success: 'green',\n  warning: 'blue',\n};\n\nfunction getColorFromType(type?: FlashType): string {\n  const defaultColor = 'blue';\n  return type ? typesToColors[type] || defaultColor : defaultColor;\n}\n\nexport function getItemType(item: FlashbarProps.MessageDefinition) {\n  if (item.loading) {\n    return 'progress';\n  } else {\n    return item.type || 'info';\n  }\n}\n\nfunction getItemColor(item: FlashbarProps.MessageDefinition) {\n  return getColorFromType(getItemType(item));\n}\n\n/*\n Returns a selection of notifications, preserving the order when possible but making sure that all different colors in\n the stack are represented in the returned array.\n The order corresponds to how they are represented when using the collapsible feature (newest first, oldest last).\n */\nexport function getVisibleCollapsedItems(\n  items: ReadonlyArray<FlashbarProps.MessageDefinition>,\n  desiredLength: number\n): ReadonlyArray<StackableItem> {\n  // First `desiredLength` items in the original array,\n  // together with `isColorRepeated` to tell if they can be subject to be replaced later on if necessary\n  const itemsOnTop: { item: StackableItem; isColorRepeated: boolean }[] = [];\n\n  // Items that fall outside `desiredIndexLength` but need to be \"promoted\" if possible\n  // because they are of a different color which otherwise wouldn't be represented\n  const itemsToPromote: StackableItem[] = [];\n\n  const addedColors: Set<string> = new Set();\n  const allPossibleColors = Object.keys(typesToColors).length;\n  const finalLength = Math.min(items.length, desiredLength);\n\n  for (let i = 0; i < items.length; i++) {\n    const item = items[i];\n    const color = getItemColor(item);\n    const isColorRepeated = addedColors.has(color);\n    if (i < finalLength) {\n      itemsOnTop.push({ item: { ...item, expandedIndex: i }, isColorRepeated });\n    } else {\n      if (addedColors.size === allPossibleColors) {\n        // No need to keep looking for unrepresented colors, we can stop looping\n        break;\n      } else if (!isColorRepeated) {\n        itemsToPromote.push({ ...item, expandedIndex: i });\n      }\n    }\n    addedColors.add(color);\n  }\n  // Generate the new array with the selected items, by picking from both arrays.\n  // First, from the non-repeated items within the desired length...\n  // We loop `itemsOnTop` starting from the end because we prefer to preserve the first ones rather than the old ones\n  const reversedInitialSelection = [];\n  let slotsReservedForPromotions = 0;\n  for (let j = itemsOnTop.length - 1; j >= 0; j--) {\n    const item = itemsOnTop[j];\n    if (item.isColorRepeated && slotsReservedForPromotions < itemsToPromote.length) {\n      slotsReservedForPromotions += 1;\n    } else {\n      reversedInitialSelection.push(item.item);\n    }\n  }\n  const selectedItems = reversedInitialSelection.reverse();\n  // ...and then complete the selection with as many promotable items as we can fit in the rest of the array\n  for (let k = 0; selectedItems.length < desiredLength; k++) {\n    selectedItems.push(itemsToPromote[k]);\n  }\n  return selectedItems;\n}\n\nexport function getFlashTypeCount(items: readonly FlashbarProps.MessageDefinition[]): Record<FlashType, number> {\n  const count = { error: 0, info: 0, progress: 0, success: 0, warning: 0 };\n  for (const item of items) {\n    const type = getItemType(item);\n    count[type] += 1;\n  }\n  return count;\n}\n\nexport type LabelName =\n  | 'errorIconAriaLabel'\n  | 'warningIconAriaLabel'\n  | 'successIconAriaLabel'\n  | 'infoIconAriaLabel'\n  | 'inProgressIconAriaLabel';\n\nexport const counterTypes: {\n  type: FlashType;\n  labelName: LabelName;\n  iconName: IconProps.Name;\n}[] = [\n  { type: 'error', labelName: 'errorIconAriaLabel', iconName: 'status-negative' },\n  { type: 'warning', labelName: 'warningIconAriaLabel', iconName: 'status-warning' },\n  { type: 'success', labelName: 'successIconAriaLabel', iconName: 'status-positive' },\n  { type: 'info', labelName: 'infoIconAriaLabel', iconName: 'status-info' },\n  { type: 'progress', labelName: 'inProgressIconAriaLabel', iconName: 'status-in-progress' },\n];\n"]}

package/lib/internal/template/form/index.js

@@ -1,4 +1,4 @@
-import { __assign, __rest } from "tslib";
+import { __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React from 'react';
@@ -6,9 +6,9 @@ import { applyDisplayName } from '../internal/utils/apply-display-name';
 import InternalForm from './internal';
 import useBaseComponent from '../internal/hooks/use-base-component';
 export default function Form(_a) {
-    var _b = _a.variant, variant = _b === void 0 ? 'full-page' : _b, props = __rest(_a, ["variant"]);
-    var baseComponentProps = useBaseComponent('Form');
-    return React.createElement(InternalForm, __assign({ variant: variant }, props, baseComponentProps));
+    var { variant = 'full-page' } = _a, props = __rest(_a, ["variant"]);
+    const baseComponentProps = useBaseComponent('Form');
+    return React.createElement(InternalForm, Object.assign({ variant: variant }, props, baseComponentProps));
 }
 applyDisplayName(Form, 'Form');
 //# sourceMappingURL=index.js.map

package/lib/internal/template/form/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/form/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,YAAY,MAAM,YAAY,CAAC;AACtC,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAIpE,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAA8C;IAA5C,IAAA,eAAqB,EAArB,OAAO,mBAAG,WAAW,KAAA,EAAK,KAAK,cAAjC,WAAmC,CAAF;IAC5D,IAAM,kBAAkB,GAAG,gBAAgB,CAAC,MAAM,CAAC,CAAC;IACpD,OAAO,oBAAC,YAAY,aAAC,OAAO,EAAE,OAAO,IAAM,KAAK,EAAM,kBAAkB,EAAI,CAAC;AAC/E,CAAC;AAED,gBAAgB,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { FormProps } from './interfaces';\nimport InternalForm from './internal';\nimport useBaseComponent from '../internal/hooks/use-base-component';\n\nexport { FormProps };\n\nexport default function Form({ variant = 'full-page', ...props }: FormProps) {\n  const baseComponentProps = useBaseComponent('Form');\n  return <InternalForm variant={variant} {...props} {...baseComponentProps} />;\n}\n\napplyDisplayName(Form, 'Form');\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/form/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,YAAY,MAAM,YAAY,CAAC;AACtC,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAIpE,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAA8C;QAA9C,EAAE,OAAO,GAAG,WAAW,OAAuB,EAAlB,KAAK,cAAjC,WAAmC,CAAF;IAC5D,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,MAAM,CAAC,CAAC;IACpD,OAAO,oBAAC,YAAY,kBAAC,OAAO,EAAE,OAAO,IAAM,KAAK,EAAM,kBAAkB,EAAI,CAAC;AAC/E,CAAC;AAED,gBAAgB,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { FormProps } from './interfaces';\nimport InternalForm from './internal';\nimport useBaseComponent from '../internal/hooks/use-base-component';\n\nexport { FormProps };\n\nexport default function Form({ variant = 'full-page', ...props }: FormProps) {\n  const baseComponentProps = useBaseComponent('Form');\n  return <InternalForm variant={variant} {...props} {...baseComponentProps} />;\n}\n\napplyDisplayName(Form, 'Form');\n"]}

package/lib/internal/template/form/internal.js

@@ -1,4 +1,4 @@
-import { __assign, __rest } from "tslib";
+import { __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React from 'react';
@@ -10,9 +10,9 @@ import InternalContentLayout from '../content-layout/internal';
 import styles from './styles.css.js';
 import LiveRegion from '../internal/components/live-region';
 export default function InternalForm(_a) {
-    var children = _a.children, header = _a.header, errorText = _a.errorText, errorIconAriaLabel = _a.errorIconAriaLabel, actions = _a.actions, secondaryActions = _a.secondaryActions, variant = _a.variant, __internalRootRef = _a.__internalRootRef, props = __rest(_a, ["children", "header", "errorText", "errorIconAriaLabel", "actions", "secondaryActions", "variant", "__internalRootRef"]);
-    var baseProps = getBaseProps(props);
-    return (React.createElement("div", __assign({}, baseProps, { ref: __internalRootRef, className: clsx(styles.root, baseProps.className) }),
+    var { children, header, errorText, errorIconAriaLabel, actions, secondaryActions, variant, __internalRootRef } = _a, props = __rest(_a, ["children", "header", "errorText", "errorIconAriaLabel", "actions", "secondaryActions", "variant", "__internalRootRef"]);
+    const baseProps = getBaseProps(props);
+    return (React.createElement("div", Object.assign({}, baseProps, { ref: __internalRootRef, className: clsx(styles.root, baseProps.className) }),
         React.createElement(FormLayout, { header: header && React.createElement("div", { className: clsx(styles.header, variant === 'full-page' && styles['full-page']) }, header), variant: variant },
             children && React.createElement("div", { className: styles.content }, children),
             errorText && (React.createElement(InternalBox, { margin: { top: 'l' } },
@@ -27,8 +27,7 @@ export default function InternalForm(_a) {
                 ", ",
                 errorText)))));
 }
-function FormLayout(_a) {
-    var children = _a.children, header = _a.header, variant = _a.variant;
+function FormLayout({ children, header, variant }) {
     return variant === 'full-page' && header ? (React.createElement(InternalContentLayout, { header: header }, children)) : (React.createElement(React.Fragment, null,
         header,
         children));

package/lib/internal/template/form/internal.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/form/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,aAAa,MAAM,mBAAmB,CAAC;AAC9C,OAAO,WAAW,MAAM,iBAAiB,CAAC;AAC1C,OAAO,qBAAqB,MAAM,4BAA4B,CAAC;AAC/D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAGrC,OAAO,UAAU,MAAM,oCAAoC,CAAC;AAI5D,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAUjB;IATlB,IAAA,QAAQ,cAAA,EACR,MAAM,YAAA,EACN,SAAS,eAAA,EACT,kBAAkB,wBAAA,EAClB,OAAO,aAAA,EACP,gBAAgB,sBAAA,EAChB,OAAO,aAAA,EACP,iBAAiB,uBAAA,EACd,KAAK,cAT2B,wHAUpC,CADS;IAER,IAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IAEtC,OAAO,CACL,wCAAS,SAAS,IAAE,GAAG,EAAE,iBAAiB,EAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,SAAS,CAAC;QAC3F,oBAAC,UAAU,IACT,MAAM,EACJ,MAAM,IAAI,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,KAAK,WAAW,IAAI,MAAM,CAAC,WAAW,CAAC,CAAC,IAAG,MAAM,CAAO,EAE/G,OAAO,EAAE,OAAO;YAEf,QAAQ,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,QAAQ,CAAO;YAC5D,SAAS,IAAI,CACZ,oBAAC,WAAW,IAAC,MAAM,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE;gBAC/B,oBAAC,aAAa,IAAC,IAAI,EAAC,OAAO,EAAC,mBAAmB,EAAE,kBAAkB;oBACjE,6BAAK,SAAS,EAAE,MAAM,CAAC,KAAK,IAAG,SAAS,CAAO,CACjC,CACJ,CACf;YACA,CAAC,OAAO,IAAI,gBAAgB,CAAC,IAAI,CAChC,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM;gBAC3B,6BAAK,SAAS,EAAE,MAAM,CAAC,iBAAiB,CAAC;oBACtC,OAAO,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,OAAO,CAAO;oBAC1D,gBAAgB,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,mBAAmB,CAAC,IAAG,gBAAgB,CAAO,CACtF,CACF,CACP;YACA,SAAS,IAAI,CACZ,oBAAC,UAAU,IAAC,SAAS,EAAE,IAAI;gBACxB,kBAAkB;;gBAAI,SAAS,CACrB,CACd,CACU,CACT,CACP,CAAC;AACJ,CAAC;AAED,SAAS,UAAU,CAAC,EAA8C;QAA5C,QAAQ,cAAA,EAAE,MAAM,YAAA,EAAE,OAAO,aAAA;IAC7C,OAAO,OAAO,KAAK,WAAW,IAAI,MAAM,CAAC,CAAC,CAAC,CACzC,oBAAC,qBAAqB,IAAC,MAAM,EAAE,MAAM,IAAG,QAAQ,CAAyB,CAC1E,CAAC,CAAC,CAAC,CACF;QACG,MAAM;QACN,QAAQ,CACR,CACJ,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\nimport { getBaseProps } from '../internal/base-component';\nimport InternalAlert from '../alert/internal';\nimport InternalBox from '../box/internal';\nimport InternalContentLayout from '../content-layout/internal';\nimport styles from './styles.css.js';\nimport { FormLayoutProps, FormProps } from './interfaces';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport LiveRegion from '../internal/components/live-region';\n\ntype InternalFormProps = FormProps & InternalBaseComponentProps;\n\nexport default function InternalForm({\n  children,\n  header,\n  errorText,\n  errorIconAriaLabel,\n  actions,\n  secondaryActions,\n  variant,\n  __internalRootRef,\n  ...props\n}: InternalFormProps) {\n  const baseProps = getBaseProps(props);\n\n  return (\n    <div {...baseProps} ref={__internalRootRef} className={clsx(styles.root, baseProps.className)}>\n      <FormLayout\n        header={\n          header && <div className={clsx(styles.header, variant === 'full-page' && styles['full-page'])}>{header}</div>\n        }\n        variant={variant}\n      >\n        {children && <div className={styles.content}>{children}</div>}\n        {errorText && (\n          <InternalBox margin={{ top: 'l' }}>\n            <InternalAlert type=\"error\" statusIconAriaLabel={errorIconAriaLabel}>\n              <div className={styles.error}>{errorText}</div>\n            </InternalAlert>\n          </InternalBox>\n        )}\n        {(actions || secondaryActions) && (\n          <div className={styles.footer}>\n            <div className={styles['actions-section']}>\n              {actions && <div className={styles.actions}>{actions}</div>}\n              {secondaryActions && <div className={styles['secondary-actions']}>{secondaryActions}</div>}\n            </div>\n          </div>\n        )}\n        {errorText && (\n          <LiveRegion assertive={true}>\n            {errorIconAriaLabel}, {errorText}\n          </LiveRegion>\n        )}\n      </FormLayout>\n    </div>\n  );\n}\n\nfunction FormLayout({ children, header, variant }: FormLayoutProps) {\n  return variant === 'full-page' && header ? (\n    <InternalContentLayout header={header}>{children}</InternalContentLayout>\n  ) : (\n    <>\n      {header}\n      {children}\n    </>\n  );\n}\n"]}
+{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/form/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,aAAa,MAAM,mBAAmB,CAAC;AAC9C,OAAO,WAAW,MAAM,iBAAiB,CAAC;AAC1C,OAAO,qBAAqB,MAAM,4BAA4B,CAAC;AAC/D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAGrC,OAAO,UAAU,MAAM,oCAAoC,CAAC;AAI5D,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAUjB;QAViB,EACnC,QAAQ,EACR,MAAM,EACN,SAAS,EACT,kBAAkB,EAClB,OAAO,EACP,gBAAgB,EAChB,OAAO,EACP,iBAAiB,OAEC,EADf,KAAK,cAT2B,wHAUpC,CADS;IAER,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IAEtC,OAAO,CACL,6CAAS,SAAS,IAAE,GAAG,EAAE,iBAAiB,EAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,SAAS,CAAC;QAC3F,oBAAC,UAAU,IACT,MAAM,EACJ,MAAM,IAAI,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,KAAK,WAAW,IAAI,MAAM,CAAC,WAAW,CAAC,CAAC,IAAG,MAAM,CAAO,EAE/G,OAAO,EAAE,OAAO;YAEf,QAAQ,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,QAAQ,CAAO;YAC5D,SAAS,IAAI,CACZ,oBAAC,WAAW,IAAC,MAAM,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE;gBAC/B,oBAAC,aAAa,IAAC,IAAI,EAAC,OAAO,EAAC,mBAAmB,EAAE,kBAAkB;oBACjE,6BAAK,SAAS,EAAE,MAAM,CAAC,KAAK,IAAG,SAAS,CAAO,CACjC,CACJ,CACf;YACA,CAAC,OAAO,IAAI,gBAAgB,CAAC,IAAI,CAChC,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM;gBAC3B,6BAAK,SAAS,EAAE,MAAM,CAAC,iBAAiB,CAAC;oBACtC,OAAO,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,OAAO,CAAO;oBAC1D,gBAAgB,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,mBAAmB,CAAC,IAAG,gBAAgB,CAAO,CACtF,CACF,CACP;YACA,SAAS,IAAI,CACZ,oBAAC,UAAU,IAAC,SAAS,EAAE,IAAI;gBACxB,kBAAkB;;gBAAI,SAAS,CACrB,CACd,CACU,CACT,CACP,CAAC;AACJ,CAAC;AAED,SAAS,UAAU,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAmB;IAChE,OAAO,OAAO,KAAK,WAAW,IAAI,MAAM,CAAC,CAAC,CAAC,CACzC,oBAAC,qBAAqB,IAAC,MAAM,EAAE,MAAM,IAAG,QAAQ,CAAyB,CAC1E,CAAC,CAAC,CAAC,CACF;QACG,MAAM;QACN,QAAQ,CACR,CACJ,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\nimport { getBaseProps } from '../internal/base-component';\nimport InternalAlert from '../alert/internal';\nimport InternalBox from '../box/internal';\nimport InternalContentLayout from '../content-layout/internal';\nimport styles from './styles.css.js';\nimport { FormLayoutProps, FormProps } from './interfaces';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport LiveRegion from '../internal/components/live-region';\n\ntype InternalFormProps = FormProps & InternalBaseComponentProps;\n\nexport default function InternalForm({\n  children,\n  header,\n  errorText,\n  errorIconAriaLabel,\n  actions,\n  secondaryActions,\n  variant,\n  __internalRootRef,\n  ...props\n}: InternalFormProps) {\n  const baseProps = getBaseProps(props);\n\n  return (\n    <div {...baseProps} ref={__internalRootRef} className={clsx(styles.root, baseProps.className)}>\n      <FormLayout\n        header={\n          header && <div className={clsx(styles.header, variant === 'full-page' && styles['full-page'])}>{header}</div>\n        }\n        variant={variant}\n      >\n        {children && <div className={styles.content}>{children}</div>}\n        {errorText && (\n          <InternalBox margin={{ top: 'l' }}>\n            <InternalAlert type=\"error\" statusIconAriaLabel={errorIconAriaLabel}>\n              <div className={styles.error}>{errorText}</div>\n            </InternalAlert>\n          </InternalBox>\n        )}\n        {(actions || secondaryActions) && (\n          <div className={styles.footer}>\n            <div className={styles['actions-section']}>\n              {actions && <div className={styles.actions}>{actions}</div>}\n              {secondaryActions && <div className={styles['secondary-actions']}>{secondaryActions}</div>}\n            </div>\n          </div>\n        )}\n        {errorText && (\n          <LiveRegion assertive={true}>\n            {errorIconAriaLabel}, {errorText}\n          </LiveRegion>\n        )}\n      </FormLayout>\n    </div>\n  );\n}\n\nfunction FormLayout({ children, header, variant }: FormLayoutProps) {\n  return variant === 'full-page' && header ? (\n    <InternalContentLayout header={header}>{children}</InternalContentLayout>\n  ) : (\n    <>\n      {header}\n      {children}\n    </>\n  );\n}\n"]}

package/lib/internal/template/form-field/index.js

@@ -1,4 +1,4 @@
-import { __assign, __rest } from "tslib";
+import { __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React from 'react';
@@ -6,9 +6,9 @@ import InternalFormField from './internal';
 import { applyDisplayName } from '../internal/utils/apply-display-name';
 import useBaseComponent from '../internal/hooks/use-base-component';
 export default function FormField(_a) {
-    var _b = _a.stretch, stretch = _b === void 0 ? false : _b, props = __rest(_a, ["stretch"]);
-    var baseComponentProps = useBaseComponent('FormField');
-    return React.createElement(InternalFormField, __assign({ stretch: stretch }, props, { __hideLabel: false }, baseComponentProps));
+    var { stretch = false } = _a, props = __rest(_a, ["stretch"]);
+    const baseComponentProps = useBaseComponent('FormField');
+    return React.createElement(InternalFormField, Object.assign({ stretch: stretch }, props, { __hideLabel: false }, baseComponentProps));
 }
 applyDisplayName(FormField, 'FormField');
 //# sourceMappingURL=index.js.map

package/lib/internal/template/form-field/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/form-field/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,iBAAiB,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAKpE,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAA6C;IAA3C,IAAA,eAAe,EAAf,OAAO,mBAAG,KAAK,KAAA,EAAK,KAAK,cAA3B,WAA6B,CAAF;IAC3D,IAAM,kBAAkB,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAC;IACzD,OAAO,oBAAC,iBAAiB,aAAC,OAAO,EAAE,OAAO,IAAM,KAAK,IAAE,WAAW,EAAE,KAAK,IAAM,kBAAkB,EAAI,CAAC;AACxG,CAAC;AAED,gBAAgB,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport InternalFormField from './internal';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { FormFieldProps } from './interfaces';\n\nexport { FormFieldProps };\n\nexport default function FormField({ stretch = false, ...props }: FormFieldProps) {\n  const baseComponentProps = useBaseComponent('FormField');\n  return <InternalFormField stretch={stretch} {...props} __hideLabel={false} {...baseComponentProps} />;\n}\n\napplyDisplayName(FormField, 'FormField');\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/form-field/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,iBAAiB,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAKpE,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAA6C;QAA7C,EAAE,OAAO,GAAG,KAAK,OAA4B,EAAvB,KAAK,cAA3B,WAA6B,CAAF;IAC3D,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAC;IACzD,OAAO,oBAAC,iBAAiB,kBAAC,OAAO,EAAE,OAAO,IAAM,KAAK,IAAE,WAAW,EAAE,KAAK,IAAM,kBAAkB,EAAI,CAAC;AACxG,CAAC;AAED,gBAAgB,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport InternalFormField from './internal';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { FormFieldProps } from './interfaces';\n\nexport { FormFieldProps };\n\nexport default function FormField({ stretch = false, ...props }: FormFieldProps) {\n  const baseComponentProps = useBaseComponent('FormField');\n  return <InternalFormField stretch={stretch} {...props} __hideLabel={false} {...baseComponentProps} />;\n}\n\napplyDisplayName(FormField, 'FormField');\n"]}