@pega/cosmos-react-core 9.0.0-build.18.8 → 9.0.0-build.19.0

package/lib/components/Banner/Banner.d.ts

@@ -1,5 +1,7 @@
 import type { Ref, MouseEventHandler } from 'react';
 import type { HeadingTag, NoChildrenProp, TestIdProp, WithAttributes } from '../../types';
+import { StyledBanner, StyledBannerMessageList } from './Banner.styles';
+export { StyledBanner, StyledBannerMessageList };
 export interface BannerHandleValue {
     /** Used to apply focus to the banner via an imperative handle. */
     focus: () => void;
@@ -26,7 +28,7 @@ export type BannerProps = WithAttributes<'div', TestIdProp & NoChildrenProp & {
     headingText?: string;
     /**
      * The heading tag to render the provided heading as. This is agnostic to the styling of the heading.
-     * @default 'h2'
+     * @default 'h3'
      */
     headingTag?: HeadingTag;
     /**
@@ -41,16 +43,6 @@ export type BannerProps = WithAttributes<'div', TestIdProp & NoChildrenProp & {
     /** Ref that can be used to access the imperative handle. */
     handle?: Ref<BannerHandleValue>;
 }>;
-export declare const StyledBanner: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
-    headingTag: BannerProps["headingTag"];
-}, never>;
-export declare const StyledBannerStatus: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Pick<BannerProps, "variant">, never>;
-export declare const StyledBannerHeader: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledBannerContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
-    expandable?: boolean;
-}, never>;
-export declare const StyledBannerMessageList: import("styled-components").StyledComponent<import("../../types").ForwardRefForwardPropsComponent<import("../List").UnorderedListProps>, import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledBannerMessage: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
 declare const _default: import("react").ForwardRefExoticComponent<Omit<BannerProps, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
     getTestIds: (testIdProp?: TestIdProp["testId"]) => import("../../types").TestIdsRecord<readonly ["heading", "expand-collapse", "dismiss", "message-label", "message-description", "message-action"]>;
 };

package/lib/components/Banner/Banner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../../src/components/Banner/Banner.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,GAAG,EAAE,iBAAiB,EAAa,MAAM,OAAO,CAAC;AAKhF,OAAO,KAAK,EAEV,UAAU,EACV,cAAc,EAGd,UAAU,EACV,cAAc,EACf,MAAM,aAAa,CAAC;AAkCrB,MAAM,WAAW,iBAAiB;IAChC,kEAAkE;IAClE,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,KAAK,KAAK,GACN,MAAM,GACN;IACE,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;IACnE,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEN,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,KAAK,GAAG,KAAK,EAAE,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE;QACP,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;QACnE,IAAI,CAAC,EAAE,MAAM,CAAC;KACf,CAAC;IACF,KAAK,CAAC,EAAE,CAAC,aAAa,GAAG,MAAM,CAAC,EAAE,CAAC;CACpC;AAED,MAAM,MAAM,WAAW,GAAG,cAAc,CACtC,KAAK,EACL,UAAU,GACR,cAAc,GAAG;IACf,0CAA0C;IAC1C,OAAO,EAAE,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,IAAI,CAAC;IAC1D,sDAAsD;IACtD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,MAAM,GAAG,aAAa,CAAC,EAAE,CAAC;IACtC,iDAAiD;IACjD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,0DAA0D;IAC1D,SAAS,CAAC,EAAE,iBAAiB,CAAC;IAC9B,4DAA4D;IAC5D,MAAM,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CACjC,CACJ,CAAC;AAEF,eAAO,MAAM,YAAY;gBAA4B,WAAW,CAAC,YAAY,CAAC;SAgB7E,CAAC;AAIF,eAAO,MAAM,kBAAkB,mIAiB7B,CAAC;AAIH,eAAO,MAAM,kBAAkB,yGAkB7B,CAAC;AAIH,eAAO,MAAM,mBAAmB;iBAA6B,OAAO;SAWlE,CAAC;AAIH,eAAO,MAAM,uBAAuB,+LAEnC,CAAC;AAEF,eAAO,MAAM,mBAAmB,0GAG/B,CAAC;;;;AA0EF,wBAoME"}
+{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../../src/components/Banner/Banner.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,GAAG,EAAE,iBAAiB,EAAa,MAAM,OAAO,CAAC;AAEhF,OAAO,KAAK,EAEV,UAAU,EACV,cAAc,EAGd,UAAU,EACV,cAAc,EACf,MAAM,aAAa,CAAC;AAqBrB,OAAO,EACL,YAAY,EAEZ,uBAAuB,EAGxB,MAAM,iBAAiB,CAAC;AAazB,OAAO,EAAE,YAAY,EAAE,uBAAuB,EAAE,CAAC;AAEjD,MAAM,WAAW,iBAAiB;IAChC,kEAAkE;IAClE,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,KAAK,KAAK,GACN,MAAM,GACN;IACE,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;IACnE,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEN,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,KAAK,GAAG,KAAK,EAAE,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE;QACP,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;QACnE,IAAI,CAAC,EAAE,MAAM,CAAC;KACf,CAAC;IACF,KAAK,CAAC,EAAE,CAAC,aAAa,GAAG,MAAM,CAAC,EAAE,CAAC;CACpC;AAED,MAAM,MAAM,WAAW,GAAG,cAAc,CACtC,KAAK,EACL,UAAU,GACR,cAAc,GAAG;IACf,0CAA0C;IAC1C,OAAO,EAAE,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,IAAI,CAAC;IAC1D,sDAAsD;IACtD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,MAAM,GAAG,aAAa,CAAC,EAAE,CAAC;IACtC,iDAAiD;IACjD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,0DAA0D;IAC1D,SAAS,CAAC,EAAE,iBAAiB,CAAC;IAC9B,4DAA4D;IAC5D,MAAM,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CACjC,CACJ,CAAC;;;;AAwEF,wBAwNE"}

package/lib/components/Banner/Banner.js

@@ -1,106 +1,32 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, forwardRef, useMemo, useImperativeHandle, useRef, Fragment } from 'react';
-import styled, { css } from 'styled-components';
-import { getContrast } from 'polished';
-import { defaultThemeProp } from '../../theme';
-import Button, { StyledButton } from '../Button';
-import { focusHeadingOrContainer, tryCatch, withTestIds } from '../../utils';
-import { useConsolidatedRef, useDirection, useI18n, useTestIds } from '../../hooks';
+import Button from '../Button';
+import { focusHeadingOrContainer, withTestIds } from '../../utils';
+import { useConsolidatedRef, useI18n, useTestIds, useTheme } from '../../hooks';
 import Flex from '../Flex';
-import Text, { StyledText } from '../Text';
+import Text from '../Text';
 import Grid from '../Grid';
-import ExpandCollapse from '../ExpandCollapse';
+import ExpandCollapse, { ExpandCollapseButton } from '../ExpandCollapse';
 import { Count } from '../Badges';
-import Icon, { StyledIcon, registerIcon } from '../Icon';
+import Icon, { registerIcon } from '../Icon';
 import * as timesIcon from '../Icon/icons/times.icon';
 import * as caretRightIcon from '../Icon/icons/caret-right.icon';
 import * as warnSolidIcon from '../Icon/icons/warn-solid.icon';
 import * as diamondMinusIcon from '../Icon/icons/diamond-solid.icon';
 import * as informationSolidIcon from '../Icon/icons/information-solid.icon';
-import * as checkIcon from '../Icon/icons/check.icon';
+import * as checkSolidIcon from '../Icon/icons/check-solid.icon';
 import * as aiIcon from '../Icon/icons/polaris-solid.icon';
 import VisuallyHiddenText from '../VisuallyHiddenText';
-import { UnorderedList } from '../List';
-import { readableColor } from '../../styles';
 import HTML from '../HTML';
 import { getBannerTestIds } from './Banner.test-ids';
-registerIcon(timesIcon, caretRightIcon, warnSolidIcon, diamondMinusIcon, informationSolidIcon, checkIcon, aiIcon);
-export const StyledBanner = styled.div(({ headingTag, theme }) => {
-    return css `
-      border-radius: var(--border-radius, ${theme.components.card['border-radius']});
-      min-inline-size: 100%;
-      inline-size: 0;
-
-      &:has(${headingTag}:focus) {
-        box-shadow: ${theme.base.shadow.focus};
-      }
-
-      ${headingTag}${StyledText} {
-        word-break: break-word;
-      }
-    `;
-});
-StyledBanner.defaultProps = defaultThemeProp;
-export const StyledBannerStatus = styled.div(({ variant, theme }) => {
-    const { background } = theme.components.banner[variant];
-    const color = tryCatch(() => getContrast(background, theme.base.palette['primary-background']) >= 3
-        ? theme.base.palette['primary-background']
-        : readableColor(background));
-    return css `
-    background-color: ${background};
-    color: ${color};
-    border-start-start-radius: inherit;
-    border-end-start-radius: inherit;
-    border: 0.0625rem solid ${theme.base.palette['border-line']};
-    border-inline-end: none;
-    font-size: 1.25rem;
-  `;
-});
-StyledBannerStatus.defaultProps = defaultThemeProp;
-export const StyledBannerHeader = styled.div(({ theme }) => {
-    const { rtl } = useDirection();
-    return css `
-    ${StyledButton}[aria-expanded] {
-      ${StyledIcon} {
-        transition: rotate ${theme.base.animation.speed} ${theme.base.animation.timing.ease};
-      }
-
-      &[aria-expanded='true'] ${StyledIcon} {
-        rotate: 90deg;
-      }
-
-      &[aria-expanded='false'] ${StyledIcon} {
-        rotate: ${rtl ? 180 : 0}deg;
-      }
-    }
-  `;
-});
-StyledBannerHeader.defaultProps = defaultThemeProp;
-export const StyledBannerContent = styled.div(({ expandable, theme }) => {
-    return css `
-    background: ${theme.components.card.background};
-    padding-block: calc(0.5 * ${theme.base.spacing});
-    padding-inline-start: calc(${expandable ? 0.5 : 2} * ${theme.base.spacing});
-    padding-inline-end: calc(0.5 * ${theme.base.spacing});
-    border: 0.0625rem solid ${theme.base.palette['border-line']};
-    border-inline-start: none;
-    border-start-end-radius: inherit;
-    border-end-end-radius: inherit;
-  `;
-});
-StyledBannerContent.defaultProps = defaultThemeProp;
-export const StyledBannerMessageList = styled(UnorderedList) `
-  padding: 0;
-`;
-export const StyledBannerMessage = styled.span `
-  overflow-wrap: break-word;
-  list-style: none;
-`;
-StyledBannerMessage.defaultProps = defaultThemeProp;
+import { StyledBanner, StyledBannerStatus, StyledBannerMessageList, StyledBannerMessage, StyledBannerMessageLabel } from './Banner.styles';
+registerIcon(timesIcon, caretRightIcon, warnSolidIcon, diamondMinusIcon, informationSolidIcon, checkSolidIcon, aiIcon);
+// FIXME: Temporarily re-exporting for backward compatibility.
+export { StyledBanner, StyledBannerMessageList };
 const BannerMessageItem = forwardRef(function BannerMessageItem({ testId, label, description, action, ...restProps }, ref) {
     const testIds = useTestIds(testId, getBannerTestIds);
     const labelArray = Array.isArray(label) ? label : [label];
-    return (_jsxs(StyledBannerMessage, { ...restProps, ref: ref, children: [_jsx("span", { "data-testid": testIds.messageLabel, children: labelArray.map((item, idx) => typeof item === 'string' ? (
+    return (_jsxs(StyledBannerMessage, { ...restProps, ref: ref, children: [_jsx(StyledBannerMessageLabel, { "data-testid": testIds.messageLabel, children: labelArray.map((item, idx) => typeof item === 'string' ? (
                 // eslint-disable-next-line react/no-array-index-key
                 _jsx(Fragment, { children: item }, idx)) : (
                 // eslint-disable-next-line react/no-array-index-key
@@ -119,7 +45,7 @@ const prepareMessages = (messages, testId) => {
         return [_jsx(BannerMessageItem, { ...msg, testId: testId })];
     });
 };
-export default withTestIds(forwardRef(function Banner({ testId, variant, headingText, headingTag = 'h2', messages = [], content, onDismiss, handle, ...restProps }, ref) {
+export default withTestIds(forwardRef(function Banner({ testId, variant, headingText, headingTag = 'h3', messages = [], content, onDismiss, handle, ...restProps }, ref) {
     const testIds = useTestIds(testId, getBannerTestIds);
     const messagesToRender = useMemo(() => prepareMessages(messages, testId), [messages]);
     const firstMessageHasChildren = messages.length > 0 &&
@@ -128,11 +54,13 @@ export default withTestIds(forwardRef(function Banner({ testId, variant, heading
         messages[0].items.length > 0;
     const count = messages.length;
     const t = useI18n();
-    const [collapsed, setCollapsed] = useState(count > 2);
+    const theme = useTheme();
+    const [collapsed, setCollapsed] = useState(false);
     const bannerRef = useConsolidatedRef(ref);
     const expandCollapseBtnRef = useRef(null);
     const showHeader = headingText !== undefined || (content ? count !== 0 : count !== 1 || firstMessageHasChildren);
     const expandable = showHeader && (count !== 0 || !!content);
+    const showCount = count > 0;
     let heading = headingText;
     let icon;
     let role;
@@ -152,7 +80,7 @@ export default withTestIds(forwardRef(function Banner({ testId, variant, heading
             break;
         case 'success':
             heading ??= t('success');
-            icon = 'check';
+            icon = theme.base['icon-set'] === 'budicon' ? 'check-solid' : 'check';
             role = 'none';
             ariaLive = 'polite';
             break;
@@ -183,25 +111,33 @@ export default withTestIds(forwardRef(function Banner({ testId, variant, heading
             });
         }
     }), []);
+    const iconRegion = (_jsx(Flex, { as: StyledBannerStatus, container: { alignItems: 'center' }, variant: variant, children: _jsx(Icon, { name: icon }) }));
     const dismissButton = onDismiss ? (_jsx(Button, { "data-testid": testIds.dismiss, onClick: onDismiss, label: t('dismiss'), "aria-label": t('banner_dismiss_button_label_a11y'), variant: 'simple', icon: true, children: _jsx(Icon, { name: 'times' }) })) : null;
-    return (_jsxs(Grid, { "data-testid": testIds.root, ...restProps, as: StyledBanner, container: { cols: '2rem minmax(0, 1fr)' }, role: role, "aria-live": ariaLive, headingTag: headingTag, ref: bannerRef, children: [_jsx(Flex, { as: StyledBannerStatus, container: { justify: 'center', alignItems: 'start', pad: [1.5, 0] }, variant: variant, children: _jsx(Icon, { name: icon }) }), !showHeader ? (_jsxs(Flex, { as: StyledBannerContent, container: { alignItems: 'start' }, children: [_jsx(VisuallyHiddenText, { as: headingTag, children: `${heading} ${count}` }), _jsx(Flex, { item: { alignSelf: 'center', grow: 1 }, as: content ? undefined : 'ul', children: (() => {
-                            if (content) {
-                                return _jsx(HTML, { content: content });
-                            }
-                            if (typeof messages[0] === 'string') {
-                                return _jsx(BannerMessageItem, { testId: testId, label: messages[0], as: 'li' });
-                            }
-                            return _jsx(BannerMessageItem, { ...messages[0], testId: testId, as: 'li' });
-                        })() }), dismissButton] })) : (_jsxs(StyledBannerContent, { expandable: expandable, children: [_jsxs(Grid, { as: StyledBannerHeader, container: {
-                            cols: expandable ? 'auto 1fr auto' : '1fr auto',
-                            areas: expandable ? '"toggle heading dismiss"' : '"heading dismiss"',
-                            gap: 0.5
-                        }, children: [_jsxs(Grid, { "data-testid": testIds.heading, container: {
-                                    cols: `fit-content(100%)${count ? ' max-content' : ''}`,
-                                    gap: 0.5,
-                                    alignItems: 'center'
-                                }, item: { area: 'heading', alignSelf: 'center' }, as: Text, forwardedAs: headingTag, variant: 'h2', children: [heading, " ", count > 0 && _jsx(Count, { children: count })] }), expandable && (_jsx(Grid, { item: { area: 'toggle', alignSelf: 'center' }, children: _jsx(Button, { "data-testid": testIds.expandCollapse, onClick: () => {
-                                        setCollapsed(cur => !cur);
-                                    }, label: t(collapsed ? 'expand' : 'collapse'), "aria-label": t(collapsed ? 'expand_noun' : 'collapse_noun', [heading]), "aria-expanded": !collapsed, variant: 'simple', icon: true, ref: expandCollapseBtnRef, children: _jsx(Icon, { name: 'caret-right' }) }) })), _jsx(Grid, { item: { area: 'dismiss', alignSelf: 'center' }, children: dismissButton })] }), expandable && (_jsx(ExpandCollapse, { collapsed: collapsed, children: _jsxs(Flex, { container: { direction: 'column', gap: 1, pad: [undefined, 2, 0.5, 5] }, children: [_jsx(StyledBannerMessageList, { items: messagesToRender }), content && _jsx(HTML, { content: content })] }) }))] }))] }));
+    return (_jsx(Grid, { "data-testid": testIds.root, ...restProps, as: StyledBanner, container: showHeader
+            ? { cols: 'minmax(0, 1fr)' }
+            : { cols: 'min-content minmax(0, 1fr) auto', gap: 1, alignItems: 'start' }, role: role, "aria-live": ariaLive, headingTag: headingTag, variant: variant, ref: bannerRef, children: !showHeader ? (_jsxs(_Fragment, { children: [iconRegion, _jsx(VisuallyHiddenText, { as: headingTag, children: `${heading} ${showCount ? count : ''}` }), _jsx(Flex, { item: { alignSelf: 'center', grow: 1 }, as: content ? undefined : 'ul', children: (() => {
+                        if (content) {
+                            return _jsx(HTML, { content: content });
+                        }
+                        if (typeof messages[0] === 'string') {
+                            return _jsx(BannerMessageItem, { testId: testId, label: messages[0], as: 'li' });
+                        }
+                        return _jsx(BannerMessageItem, { ...messages[0], testId: testId, as: 'li' });
+                    })() }), dismissButton] })) : (_jsxs(Flex, { container: { direction: 'column', justify: 'center' }, children: [_jsxs(Grid, { container: {
+                        cols: expandable ? 'auto 1fr auto' : '1fr auto',
+                        areas: expandable ? '"toggle heading dismiss"' : '"heading dismiss"',
+                        gap: 0.5,
+                        alignItems: 'start'
+                    }, children: [_jsxs(Grid, { container: { cols: 'min-content auto', gap: 1 }, item: { area: 'heading', alignSelf: 'center' }, children: [iconRegion, _jsxs(Grid, { "data-testid": testIds.heading, container: {
+                                        cols: `fit-content(100%) ${showCount ? 'max-content' : ''}`,
+                                        gap: 0.5,
+                                        alignItems: 'center'
+                                    }, as: Text, forwardedAs: headingTag, variant: 'h3', children: [heading, " ", showCount && _jsx(Count, { children: count })] })] }), expandable && (_jsx(Grid, { item: { area: 'toggle' }, children: _jsx(ExpandCollapseButton, { "data-testid": testIds.expandCollapse, onToggle: () => {
+                                    setCollapsed(cur => !cur);
+                                }, label: t(collapsed ? 'expand' : 'collapse'), "aria-label": t(collapsed ? 'expand_noun' : 'collapse_noun', [heading]), "aria-expanded": !collapsed, iconOnly: true, ref: expandCollapseBtnRef, expanded: !collapsed }) })), _jsx(Grid, { item: { area: 'dismiss' }, children: dismissButton })] }), expandable && (_jsx(ExpandCollapse, { collapsed: collapsed, children: _jsxs(Flex, { container: {
+                            direction: 'column',
+                            gap: 1,
+                            pad: [1, 2]
+                        }, children: [messagesToRender.length > 0 ? (_jsx(StyledBannerMessageList, { items: messagesToRender })) : null, content && _jsx(HTML, { content: content })] }) }))] })) }));
 }), getBannerTestIds);
 //# sourceMappingURL=Banner.js.map

package/lib/components/Banner/Banner.js.map

@@ -1 +1 @@
-{"version":3,"file":"Banner.js","sourceRoot":"","sources":["../../../src/components/Banner/Banner.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, forwardRef, useMemo, useImperativeHandle, useRef, Fragment } from 'react';\nimport type { PropsWithoutRef, Ref, MouseEventHandler, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\nimport { getContrast } from 'polished';\n\nimport { defaultThemeProp } from '../../theme';\nimport type {\n  ForwardProps,\n  HeadingTag,\n  NoChildrenProp,\n  OmitStrict,\n  RefElement,\n  TestIdProp,\n  WithAttributes\n} from '../../types';\nimport Button, { StyledButton } from '../Button';\nimport { focusHeadingOrContainer, tryCatch, withTestIds } from '../../utils';\nimport { useConsolidatedRef, useDirection, useI18n, useTestIds } from '../../hooks';\nimport Flex from '../Flex';\nimport Text, { StyledText } from '../Text';\nimport Grid from '../Grid';\nimport ExpandCollapse from '../ExpandCollapse';\nimport { Count } from '../Badges';\nimport Icon, { StyledIcon, registerIcon } from '../Icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as caretRightIcon from '../Icon/icons/caret-right.icon';\nimport * as warnSolidIcon from '../Icon/icons/warn-solid.icon';\nimport * as diamondMinusIcon from '../Icon/icons/diamond-solid.icon';\nimport * as informationSolidIcon from '../Icon/icons/information-solid.icon';\nimport * as checkIcon from '../Icon/icons/check.icon';\nimport * as aiIcon from '../Icon/icons/polaris-solid.icon';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport { UnorderedList } from '../List';\nimport { readableColor } from '../../styles';\nimport HTML from '../HTML';\n\nimport { getBannerTestIds } from './Banner.test-ids';\n\nregisterIcon(\n  timesIcon,\n  caretRightIcon,\n  warnSolidIcon,\n  diamondMinusIcon,\n  informationSolidIcon,\n  checkIcon,\n  aiIcon\n);\n\nexport interface BannerHandleValue {\n  /** Used to apply focus to the banner via an imperative handle. */\n  focus: () => void;\n}\n\ntype Label =\n  | string\n  | {\n      text: string;\n      onClick?: MouseEventHandler<HTMLButtonElement | HTMLAnchorElement>;\n      href?: string;\n    };\n\nexport interface BannerMessage {\n  label: Label | Label[];\n  description?: string;\n  action?: {\n    text: string;\n    onClick?: MouseEventHandler<HTMLButtonElement | HTMLAnchorElement>;\n    href?: string;\n  };\n  items?: (BannerMessage | string)[];\n}\n\nexport type BannerProps = WithAttributes<\n  'div',\n  TestIdProp &\n    NoChildrenProp & {\n      /** Controls the styling of the Banner. */\n      variant: 'urgent' | 'warning' | 'success' | 'info' | 'ai';\n      /** Custom heading text. Default varies by variant. */\n      headingText?: string;\n      /**\n       * The heading tag to render the provided heading as. This is agnostic to the styling of the heading.\n       * @default 'h2'\n       */\n      headingTag?: HeadingTag;\n      /**\n       * Pass one or more descriptive messages to inform the user\n       * @default []\n       */\n      messages?: (string | BannerMessage)[];\n      /** Rich text content to render within banner. */\n      content?: string;\n      /** Callback when user explicitly dismisses the Banner. */\n      onDismiss?: MouseEventHandler;\n      /** Ref that can be used to access the imperative handle. */\n      handle?: Ref<BannerHandleValue>;\n    }\n>;\n\nexport const StyledBanner = styled.div<{ headingTag: BannerProps['headingTag'] }>(\n  ({ headingTag, theme }) => {\n    return css`\n      border-radius: var(--border-radius, ${theme.components.card['border-radius']});\n      min-inline-size: 100%;\n      inline-size: 0;\n\n      &:has(${headingTag}:focus) {\n        box-shadow: ${theme.base.shadow.focus};\n      }\n\n      ${headingTag}${StyledText} {\n        word-break: break-word;\n      }\n    `;\n  }\n);\n\nStyledBanner.defaultProps = defaultThemeProp;\n\nexport const StyledBannerStatus = styled.div<Pick<BannerProps, 'variant'>>(({ variant, theme }) => {\n  const { background } = theme.components.banner[variant];\n  const color = tryCatch(() =>\n    getContrast(background, theme.base.palette['primary-background']) >= 3\n      ? theme.base.palette['primary-background']\n      : readableColor(background)\n  );\n\n  return css`\n    background-color: ${background};\n    color: ${color};\n    border-start-start-radius: inherit;\n    border-end-start-radius: inherit;\n    border: 0.0625rem solid ${theme.base.palette['border-line']};\n    border-inline-end: none;\n    font-size: 1.25rem;\n  `;\n});\n\nStyledBannerStatus.defaultProps = defaultThemeProp;\n\nexport const StyledBannerHeader = styled.div(({ theme }) => {\n  const { rtl } = useDirection();\n\n  return css`\n    ${StyledButton}[aria-expanded] {\n      ${StyledIcon} {\n        transition: rotate ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n      }\n\n      &[aria-expanded='true'] ${StyledIcon} {\n        rotate: 90deg;\n      }\n\n      &[aria-expanded='false'] ${StyledIcon} {\n        rotate: ${rtl ? 180 : 0}deg;\n      }\n    }\n  `;\n});\n\nStyledBannerHeader.defaultProps = defaultThemeProp;\n\nexport const StyledBannerContent = styled.div<{ expandable?: boolean }>(({ expandable, theme }) => {\n  return css`\n    background: ${theme.components.card.background};\n    padding-block: calc(0.5 * ${theme.base.spacing});\n    padding-inline-start: calc(${expandable ? 0.5 : 2} * ${theme.base.spacing});\n    padding-inline-end: calc(0.5 * ${theme.base.spacing});\n    border: 0.0625rem solid ${theme.base.palette['border-line']};\n    border-inline-start: none;\n    border-start-end-radius: inherit;\n    border-end-end-radius: inherit;\n  `;\n});\n\nStyledBannerContent.defaultProps = defaultThemeProp;\n\nexport const StyledBannerMessageList = styled(UnorderedList)`\n  padding: 0;\n`;\n\nexport const StyledBannerMessage = styled.span`\n  overflow-wrap: break-word;\n  list-style: none;\n`;\n\nStyledBannerMessage.defaultProps = defaultThemeProp;\n\nconst BannerMessageItem = forwardRef<\n  HTMLLIElement,\n  TestIdProp & OmitStrict<BannerMessage, 'items'> & ForwardProps\n>(function BannerMessageItem({ testId, label, description, action, ...restProps }, ref) {\n  const testIds = useTestIds(testId, getBannerTestIds);\n\n  const labelArray = Array.isArray(label) ? label : [label];\n\n  return (\n    <StyledBannerMessage {...restProps} ref={ref}>\n      <span data-testid={testIds.messageLabel}>\n        {labelArray.map((item, idx) =>\n          typeof item === 'string' ? (\n            // eslint-disable-next-line react/no-array-index-key\n            <Fragment key={idx}>{item}</Fragment>\n          ) : (\n            // eslint-disable-next-line react/no-array-index-key\n            <Button variant='link' href={item.href} onClick={item.onClick} key={idx}>\n              {item.text}\n            </Button>\n          )\n        )}\n      </span>\n      {description && (\n        <>\n          {' '}\n          <Text data-testid={testIds.messageDescription} variant='secondary'>\n            {description}\n          </Text>\n        </>\n      )}\n      {action && (\n        <>\n          {' '}\n          <Text variant='secondary'>\n            <Button\n              data-testid={testIds.messageAction}\n              variant='link'\n              href={action.href}\n              onClick={action.onClick}\n              {...action}\n            >\n              {action.text}\n            </Button>\n          </Text>\n        </>\n      )}\n    </StyledBannerMessage>\n  );\n});\n\nconst prepareMessages = (\n  messages: (string | BannerMessage)[],\n  testId: TestIdProp['testId']\n): ReactNode[] => {\n  return messages.flatMap(msg => {\n    if (typeof msg === 'string') {\n      return [<BannerMessageItem label={msg} />];\n    }\n\n    if (msg.items && msg.items.length > 0) {\n      const { items, ...restMsg } = msg;\n      const subMessages = prepareMessages(items, testId);\n      return [<BannerMessageItem {...restMsg} testId={testId} />, subMessages];\n    }\n\n    return [<BannerMessageItem {...msg} testId={testId} />];\n  });\n};\n\nexport default withTestIds(\n  forwardRef<RefElement<BannerProps>, PropsWithoutRef<BannerProps>>(function Banner(\n    {\n      testId,\n      variant,\n      headingText,\n      headingTag = 'h2',\n      messages = [],\n      content,\n      onDismiss,\n      handle,\n      ...restProps\n    },\n    ref\n  ) {\n    const testIds = useTestIds(testId, getBannerTestIds);\n    const messagesToRender = useMemo(() => prepareMessages(messages, testId), [messages]);\n    const firstMessageHasChildren =\n      messages.length > 0 &&\n      typeof messages[0] === 'object' &&\n      Array.isArray(messages[0].items) &&\n      messages[0].items.length > 0;\n    const count = messages.length;\n    const t = useI18n();\n    const [collapsed, setCollapsed] = useState(count > 2);\n\n    const bannerRef = useConsolidatedRef(ref);\n    const expandCollapseBtnRef = useRef<HTMLButtonElement>(null);\n\n    const showHeader =\n      headingText !== undefined || (content ? count !== 0 : count !== 1 || firstMessageHasChildren);\n    const expandable = showHeader && (count !== 0 || !!content);\n\n    let heading = headingText;\n    let icon: string;\n    let role: string;\n    let ariaLive: string;\n\n    switch (variant) {\n      case 'urgent':\n        heading ??= t('error');\n        icon = 'warn-solid';\n        role = 'alert';\n        ariaLive = 'assertive';\n        break;\n      case 'warning':\n        heading ??= t('warning');\n        icon = 'diamond-minus';\n        role = 'alert';\n        ariaLive = 'assertive';\n        break;\n      case 'success':\n        heading ??= t('success');\n        icon = 'check';\n        role = 'none';\n        ariaLive = 'polite';\n        break;\n      case 'ai':\n        heading ??= t('ai_generated');\n        icon = 'polaris-solid';\n        role = 'none';\n        ariaLive = 'polite';\n        break;\n      case 'info':\n      default:\n        heading ??= t('information');\n        icon = 'information-solid';\n        role = 'none';\n        ariaLive = 'polite';\n        break;\n    }\n\n    useImperativeHandle(\n      handle,\n      () => ({\n        focus: () => {\n          // Empty timeout ensures that the banner will take focus after any other programmatic focus events\n          setTimeout(() => {\n            if (expandCollapseBtnRef.current) {\n              expandCollapseBtnRef.current.focus();\n            } else if (bannerRef.current) {\n              focusHeadingOrContainer(bannerRef.current, heading);\n            }\n          });\n        }\n      }),\n      []\n    );\n\n    const dismissButton = onDismiss ? (\n      <Button\n        data-testid={testIds.dismiss}\n        onClick={onDismiss}\n        label={t('dismiss')}\n        aria-label={t('banner_dismiss_button_label_a11y')}\n        variant='simple'\n        icon\n      >\n        <Icon name='times' />\n      </Button>\n    ) : null;\n\n    return (\n      <Grid\n        data-testid={testIds.root}\n        {...restProps}\n        as={StyledBanner}\n        container={{ cols: '2rem minmax(0, 1fr)' }}\n        role={role}\n        aria-live={ariaLive}\n        headingTag={headingTag}\n        ref={bannerRef}\n      >\n        <Flex\n          as={StyledBannerStatus}\n          container={{ justify: 'center', alignItems: 'start', pad: [1.5, 0] }}\n          variant={variant}\n        >\n          <Icon name={icon} />\n        </Flex>\n        {!showHeader ? (\n          <Flex as={StyledBannerContent} container={{ alignItems: 'start' }}>\n            <VisuallyHiddenText as={headingTag}>{`${heading} ${count}`}</VisuallyHiddenText>\n            <Flex item={{ alignSelf: 'center', grow: 1 }} as={content ? undefined : 'ul'}>\n              {(() => {\n                if (content) {\n                  return <HTML content={content} />;\n                }\n\n                if (typeof messages[0] === 'string') {\n                  return <BannerMessageItem testId={testId} label={messages[0]} as='li' />;\n                }\n\n                return <BannerMessageItem {...messages[0]} testId={testId} as='li' />;\n              })()}\n            </Flex>\n            {dismissButton}\n          </Flex>\n        ) : (\n          <StyledBannerContent expandable={expandable}>\n            <Grid\n              as={StyledBannerHeader}\n              container={{\n                cols: expandable ? 'auto 1fr auto' : '1fr auto',\n                areas: expandable ? '\"toggle heading dismiss\"' : '\"heading dismiss\"',\n                gap: 0.5\n              }}\n            >\n              <Grid\n                data-testid={testIds.heading}\n                container={{\n                  cols: `fit-content(100%)${count ? ' max-content' : ''}`,\n                  gap: 0.5,\n                  alignItems: 'center'\n                }}\n                item={{ area: 'heading', alignSelf: 'center' }}\n                as={Text}\n                forwardedAs={headingTag}\n                variant='h2'\n              >\n                {heading} {count > 0 && <Count>{count}</Count>}\n              </Grid>\n              {expandable && (\n                <Grid item={{ area: 'toggle', alignSelf: 'center' }}>\n                  <Button\n                    data-testid={testIds.expandCollapse}\n                    onClick={() => {\n                      setCollapsed(cur => !cur);\n                    }}\n                    label={t(collapsed ? 'expand' : 'collapse')}\n                    aria-label={t(collapsed ? 'expand_noun' : 'collapse_noun', [heading])}\n                    aria-expanded={!collapsed}\n                    variant='simple'\n                    icon\n                    ref={expandCollapseBtnRef}\n                  >\n                    <Icon name='caret-right' />\n                  </Button>\n                </Grid>\n              )}\n              <Grid item={{ area: 'dismiss', alignSelf: 'center' }}>{dismissButton}</Grid>\n            </Grid>\n            {expandable && (\n              <ExpandCollapse collapsed={collapsed}>\n                <Flex container={{ direction: 'column', gap: 1, pad: [undefined, 2, 0.5, 5] }}>\n                  <StyledBannerMessageList items={messagesToRender} />\n                  {content && <HTML content={content} />}\n                </Flex>\n              </ExpandCollapse>\n            )}\n          </StyledBannerContent>\n        )}\n      </Grid>\n    );\n  }),\n  getBannerTestIds\n);\n"]}
+{"version":3,"file":"Banner.js","sourceRoot":"","sources":["../../../src/components/Banner/Banner.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, forwardRef, useMemo, useImperativeHandle, useRef, Fragment } from 'react';\nimport type { PropsWithoutRef, Ref, MouseEventHandler, ReactNode } from 'react';\n\nimport type {\n  ForwardProps,\n  HeadingTag,\n  NoChildrenProp,\n  OmitStrict,\n  RefElement,\n  TestIdProp,\n  WithAttributes\n} from '../../types';\nimport Button from '../Button';\nimport { focusHeadingOrContainer, withTestIds } from '../../utils';\nimport { useConsolidatedRef, useI18n, useTestIds, useTheme } from '../../hooks';\nimport Flex from '../Flex';\nimport Text from '../Text';\nimport Grid from '../Grid';\nimport ExpandCollapse, { ExpandCollapseButton } from '../ExpandCollapse';\nimport { Count } from '../Badges';\nimport Icon, { registerIcon } from '../Icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as caretRightIcon from '../Icon/icons/caret-right.icon';\nimport * as warnSolidIcon from '../Icon/icons/warn-solid.icon';\nimport * as diamondMinusIcon from '../Icon/icons/diamond-solid.icon';\nimport * as informationSolidIcon from '../Icon/icons/information-solid.icon';\nimport * as checkSolidIcon from '../Icon/icons/check-solid.icon';\nimport * as aiIcon from '../Icon/icons/polaris-solid.icon';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport HTML from '../HTML';\n\nimport { getBannerTestIds } from './Banner.test-ids';\nimport {\n  StyledBanner,\n  StyledBannerStatus,\n  StyledBannerMessageList,\n  StyledBannerMessage,\n  StyledBannerMessageLabel\n} from './Banner.styles';\n\nregisterIcon(\n  timesIcon,\n  caretRightIcon,\n  warnSolidIcon,\n  diamondMinusIcon,\n  informationSolidIcon,\n  checkSolidIcon,\n  aiIcon\n);\n\n// FIXME: Temporarily re-exporting for backward compatibility.\nexport { StyledBanner, StyledBannerMessageList };\n\nexport interface BannerHandleValue {\n  /** Used to apply focus to the banner via an imperative handle. */\n  focus: () => void;\n}\n\ntype Label =\n  | string\n  | {\n      text: string;\n      onClick?: MouseEventHandler<HTMLButtonElement | HTMLAnchorElement>;\n      href?: string;\n    };\n\nexport interface BannerMessage {\n  label: Label | Label[];\n  description?: string;\n  action?: {\n    text: string;\n    onClick?: MouseEventHandler<HTMLButtonElement | HTMLAnchorElement>;\n    href?: string;\n  };\n  items?: (BannerMessage | string)[];\n}\n\nexport type BannerProps = WithAttributes<\n  'div',\n  TestIdProp &\n    NoChildrenProp & {\n      /** Controls the styling of the Banner. */\n      variant: 'urgent' | 'warning' | 'success' | 'info' | 'ai';\n      /** Custom heading text. Default varies by variant. */\n      headingText?: string;\n      /**\n       * The heading tag to render the provided heading as. This is agnostic to the styling of the heading.\n       * @default 'h3'\n       */\n      headingTag?: HeadingTag;\n      /**\n       * Pass one or more descriptive messages to inform the user\n       * @default []\n       */\n      messages?: (string | BannerMessage)[];\n      /** Rich text content to render within banner. */\n      content?: string;\n      /** Callback when user explicitly dismisses the Banner. */\n      onDismiss?: MouseEventHandler;\n      /** Ref that can be used to access the imperative handle. */\n      handle?: Ref<BannerHandleValue>;\n    }\n>;\n\nconst BannerMessageItem = forwardRef<\n  HTMLLIElement,\n  TestIdProp & OmitStrict<BannerMessage, 'items'> & ForwardProps\n>(function BannerMessageItem({ testId, label, description, action, ...restProps }, ref) {\n  const testIds = useTestIds(testId, getBannerTestIds);\n\n  const labelArray = Array.isArray(label) ? label : [label];\n\n  return (\n    <StyledBannerMessage {...restProps} ref={ref}>\n      <StyledBannerMessageLabel data-testid={testIds.messageLabel}>\n        {labelArray.map((item, idx) =>\n          typeof item === 'string' ? (\n            // eslint-disable-next-line react/no-array-index-key\n            <Fragment key={idx}>{item}</Fragment>\n          ) : (\n            // eslint-disable-next-line react/no-array-index-key\n            <Button variant='link' href={item.href} onClick={item.onClick} key={idx}>\n              {item.text}\n            </Button>\n          )\n        )}\n      </StyledBannerMessageLabel>\n      {description && (\n        <>\n          {' '}\n          <Text data-testid={testIds.messageDescription} variant='secondary'>\n            {description}\n          </Text>\n        </>\n      )}\n      {action && (\n        <>\n          {' '}\n          <Text variant='secondary'>\n            <Button\n              data-testid={testIds.messageAction}\n              variant='link'\n              href={action.href}\n              onClick={action.onClick}\n              {...action}\n            >\n              {action.text}\n            </Button>\n          </Text>\n        </>\n      )}\n    </StyledBannerMessage>\n  );\n});\n\nconst prepareMessages = (\n  messages: (string | BannerMessage)[],\n  testId: TestIdProp['testId']\n): ReactNode[] => {\n  return messages.flatMap(msg => {\n    if (typeof msg === 'string') {\n      return [<BannerMessageItem label={msg} />];\n    }\n\n    if (msg.items && msg.items.length > 0) {\n      const { items, ...restMsg } = msg;\n      const subMessages = prepareMessages(items, testId);\n      return [<BannerMessageItem {...restMsg} testId={testId} />, subMessages];\n    }\n\n    return [<BannerMessageItem {...msg} testId={testId} />];\n  });\n};\n\nexport default withTestIds(\n  forwardRef<RefElement<BannerProps>, PropsWithoutRef<BannerProps>>(function Banner(\n    {\n      testId,\n      variant,\n      headingText,\n      headingTag = 'h3',\n      messages = [],\n      content,\n      onDismiss,\n      handle,\n      ...restProps\n    },\n    ref\n  ) {\n    const testIds = useTestIds(testId, getBannerTestIds);\n    const messagesToRender = useMemo(() => prepareMessages(messages, testId), [messages]);\n    const firstMessageHasChildren =\n      messages.length > 0 &&\n      typeof messages[0] === 'object' &&\n      Array.isArray(messages[0].items) &&\n      messages[0].items.length > 0;\n    const count = messages.length;\n    const t = useI18n();\n    const theme = useTheme();\n    const [collapsed, setCollapsed] = useState(false);\n\n    const bannerRef = useConsolidatedRef(ref);\n    const expandCollapseBtnRef = useRef<HTMLButtonElement>(null);\n\n    const showHeader =\n      headingText !== undefined || (content ? count !== 0 : count !== 1 || firstMessageHasChildren);\n    const expandable = showHeader && (count !== 0 || !!content);\n    const showCount = count > 0;\n\n    let heading = headingText;\n    let icon: string;\n    let role: string;\n    let ariaLive: string;\n\n    switch (variant) {\n      case 'urgent':\n        heading ??= t('error');\n        icon = 'warn-solid';\n        role = 'alert';\n        ariaLive = 'assertive';\n        break;\n      case 'warning':\n        heading ??= t('warning');\n        icon = 'diamond-minus';\n        role = 'alert';\n        ariaLive = 'assertive';\n        break;\n      case 'success':\n        heading ??= t('success');\n        icon = theme.base['icon-set'] === 'budicon' ? 'check-solid' : 'check';\n        role = 'none';\n        ariaLive = 'polite';\n        break;\n      case 'ai':\n        heading ??= t('ai_generated');\n        icon = 'polaris-solid';\n        role = 'none';\n        ariaLive = 'polite';\n        break;\n      case 'info':\n      default:\n        heading ??= t('information');\n        icon = 'information-solid';\n        role = 'none';\n        ariaLive = 'polite';\n        break;\n    }\n\n    useImperativeHandle(\n      handle,\n      () => ({\n        focus: () => {\n          // Empty timeout ensures that the banner will take focus after any other programmatic focus events\n          setTimeout(() => {\n            if (expandCollapseBtnRef.current) {\n              expandCollapseBtnRef.current.focus();\n            } else if (bannerRef.current) {\n              focusHeadingOrContainer(bannerRef.current, heading);\n            }\n          });\n        }\n      }),\n      []\n    );\n\n    const iconRegion = (\n      <Flex as={StyledBannerStatus} container={{ alignItems: 'center' }} variant={variant}>\n        <Icon name={icon} />\n      </Flex>\n    );\n\n    const dismissButton = onDismiss ? (\n      <Button\n        data-testid={testIds.dismiss}\n        onClick={onDismiss}\n        label={t('dismiss')}\n        aria-label={t('banner_dismiss_button_label_a11y')}\n        variant='simple'\n        icon\n      >\n        <Icon name='times' />\n      </Button>\n    ) : null;\n\n    return (\n      <Grid\n        data-testid={testIds.root}\n        {...restProps}\n        as={StyledBanner}\n        container={\n          showHeader\n            ? { cols: 'minmax(0, 1fr)' }\n            : { cols: 'min-content minmax(0, 1fr) auto', gap: 1, alignItems: 'start' }\n        }\n        role={role}\n        aria-live={ariaLive}\n        headingTag={headingTag}\n        variant={variant}\n        ref={bannerRef}\n      >\n        {!showHeader ? (\n          <>\n            {iconRegion}\n            <VisuallyHiddenText\n              as={headingTag}\n            >{`${heading} ${showCount ? count : ''}`}</VisuallyHiddenText>\n            <Flex item={{ alignSelf: 'center', grow: 1 }} as={content ? undefined : 'ul'}>\n              {(() => {\n                if (content) {\n                  return <HTML content={content} />;\n                }\n\n                if (typeof messages[0] === 'string') {\n                  return <BannerMessageItem testId={testId} label={messages[0]} as='li' />;\n                }\n\n                return <BannerMessageItem {...messages[0]} testId={testId} as='li' />;\n              })()}\n            </Flex>\n            {dismissButton}\n          </>\n        ) : (\n          <Flex container={{ direction: 'column', justify: 'center' }}>\n            <Grid\n              container={{\n                cols: expandable ? 'auto 1fr auto' : '1fr auto',\n                areas: expandable ? '\"toggle heading dismiss\"' : '\"heading dismiss\"',\n                gap: 0.5,\n                alignItems: 'start'\n              }}\n            >\n              <Grid\n                container={{ cols: 'min-content auto', gap: 1 }}\n                item={{ area: 'heading', alignSelf: 'center' }}\n              >\n                {iconRegion}\n                <Grid\n                  data-testid={testIds.heading}\n                  container={{\n                    cols: `fit-content(100%) ${showCount ? 'max-content' : ''}`,\n                    gap: 0.5,\n                    alignItems: 'center'\n                  }}\n                  as={Text}\n                  forwardedAs={headingTag}\n                  variant='h3'\n                >\n                  {heading} {showCount && <Count>{count}</Count>}\n                </Grid>\n              </Grid>\n              {expandable && (\n                <Grid item={{ area: 'toggle' }}>\n                  <ExpandCollapseButton\n                    data-testid={testIds.expandCollapse}\n                    onToggle={() => {\n                      setCollapsed(cur => !cur);\n                    }}\n                    label={t(collapsed ? 'expand' : 'collapse')}\n                    aria-label={t(collapsed ? 'expand_noun' : 'collapse_noun', [heading])}\n                    aria-expanded={!collapsed}\n                    iconOnly\n                    ref={expandCollapseBtnRef}\n                    expanded={!collapsed}\n                  />\n                </Grid>\n              )}\n              <Grid item={{ area: 'dismiss' }}>{dismissButton}</Grid>\n            </Grid>\n            {expandable && (\n              <ExpandCollapse collapsed={collapsed}>\n                <Flex\n                  container={{\n                    direction: 'column',\n                    gap: 1,\n                    pad: [1, 2]\n                  }}\n                >\n                  {messagesToRender.length > 0 ? (\n                    <StyledBannerMessageList items={messagesToRender} />\n                  ) : null}\n                  {content && <HTML content={content} />}\n                </Flex>\n              </ExpandCollapse>\n            )}\n          </Flex>\n        )}\n      </Grid>\n    );\n  }),\n  getBannerTestIds\n);\n"]}

package/lib/components/Banner/Banner.styles.d.ts

@@ -0,0 +1,20 @@
+import type { DefaultTheme } from 'styled-components';
+import type { PropsWithDefaults } from '../../types';
+import type { BannerProps } from './Banner';
+export declare const getVariantColors: (variant: BannerProps["variant"], theme: DefaultTheme) => {
+    background: string;
+    borderColor: string;
+    iconColor: string;
+    textColor: string;
+};
+interface StyledBannerProps extends Pick<PropsWithDefaults<BannerProps, 'headingTag'>, 'headingTag' | 'variant'> {
+}
+export declare const StyledBanner: import("styled-components").StyledComponent<"div", DefaultTheme, StyledBannerProps, never>;
+export declare const StyledBannerStatus: import("styled-components").StyledComponent<"div", DefaultTheme, {
+    variant: BannerProps["variant"];
+}, never>;
+export declare const StyledBannerMessageList: import("styled-components").StyledComponent<import("../../types").ForwardRefForwardPropsComponent<import("../List").UnorderedListProps>, DefaultTheme, {}, never>;
+export declare const StyledBannerMessage: import("styled-components").StyledComponent<"span", DefaultTheme, {}, never>;
+export declare const StyledBannerMessageLabel: import("styled-components").StyledComponent<"span", DefaultTheme, {}, never>;
+export {};
+//# sourceMappingURL=Banner.styles.d.ts.map

package/lib/components/Banner/Banner.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Banner.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Banner/Banner.styles.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAOrD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,eAAO,MAAM,gBAAgB,GAAI,SAAS,WAAW,CAAC,SAAS,CAAC,EAAE,OAAO,YAAY;;;;;CAuBpF,CAAC;AAEF,UAAU,iBACR,SAAQ,IAAI,CAAC,iBAAiB,CAAC,WAAW,EAAE,YAAY,CAAC,EAAE,YAAY,GAAG,SAAS,CAAC;CAAG;AAEzF,eAAO,MAAM,YAAY,4FA4BvB,CAAC;AAIH,eAAO,MAAM,kBAAkB;aAAyB,WAAW,CAAC,SAAS,CAAC;SAkB7E,CAAC;AAIF,eAAO,MAAM,uBAAuB,mKAEnC,CAAC;AAIF,eAAO,MAAM,mBAAmB,8EAG/B,CAAC;AAIF,eAAO,MAAM,wBAAwB,8EAIpC,CAAC"}

package/lib/components/Banner/Banner.styles.js

@@ -0,0 +1,84 @@
+import { mix } from 'polished';
+import styled, { css } from 'styled-components';
+import { readableColor, readableHue } from '../../styles';
+import { defaultThemeProp } from '../../theme';
+import { StyledText } from '../Text';
+import { StyledIcon } from '../Icon';
+import { UnorderedList } from '../List';
+import { StyledCard } from '../Card';
+import { StyledModal } from '../Modal/Modal.styles';
+export const getVariantColors = (variant, theme) => {
+    const variantBackground = theme.components.banner[variant].background;
+    const background = mix(theme.components.banner[variant]['background-mix'], variantBackground, theme.base.palette['primary-background']);
+    const iconColor = readableHue(variantBackground, background, {
+        level: 'AANonText'
+    });
+    const borderColor = mix(0.7, iconColor, theme.base.palette['primary-background']);
+    const textColor = readableColor(background);
+    return {
+        background,
+        borderColor,
+        iconColor,
+        textColor
+    };
+};
+export const StyledBanner = styled.div(({ theme, headingTag, variant }) => {
+    const colors = getVariantColors(variant, theme);
+    return css `
+    padding: ${theme.base.spacing};
+    color: ${colors.textColor};
+    background: ${colors.background};
+    border: 0.0625rem solid ${colors.borderColor};
+    min-inline-size: 100%;
+    inline-size: 0;
+    min-block-size: 2.25rem;
+    border-radius: ${theme.components.card['border-radius']};
+
+    ${StyledCard} &,
+    ${StyledModal} & {
+      border-radius: calc(
+        ${theme.components['form-control']['border-radius']} * ${theme.base['border-radius']}
+      );
+    }
+
+    &:has(${headingTag}${StyledText}:focus) {
+      box-shadow: ${theme.base.shadow.focus};
+    }
+
+    ${headingTag}${StyledText} {
+      word-break: break-word;
+    }
+  `;
+});
+StyledBanner.defaultProps = defaultThemeProp;
+export const StyledBannerStatus = styled.div(({ theme, variant }) => {
+    const colors = getVariantColors(variant, theme);
+    return css `
+      block-size: ${theme.base['hit-area']['mouse-min']};
+
+      @media (pointer: coarse) {
+        & {
+          block-size: ${theme.base['hit-area']['finger-min']};
+        }
+      }
+
+      ${StyledIcon} {
+        color: ${colors.iconColor};
+      }
+    `;
+});
+StyledBannerStatus.defaultProps = defaultThemeProp;
+export const StyledBannerMessageList = styled(UnorderedList) `
+  padding-inline-start: 0;
+`;
+StyledBannerMessageList.defaultProps = defaultThemeProp;
+export const StyledBannerMessage = styled.span `
+  overflow-wrap: break-word;
+  list-style: none;
+`;
+StyledBannerMessage.defaultProps = defaultThemeProp;
+export const StyledBannerMessageLabel = styled.span(({ theme }) => css `
+    font-weight: ${theme.base['font-weight']['semi-bold']};
+  `);
+StyledBannerMessageLabel.defaultProps = defaultThemeProp;
+//# sourceMappingURL=Banner.styles.js.map

package/lib/components/Banner/Banner.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Banner.styles.js","sourceRoot":"","sources":["../../../src/components/Banner/Banner.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAC/B,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAGhD,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAIpD,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,OAA+B,EAAE,KAAmB,EAAE,EAAE;IACvF,MAAM,iBAAiB,GAAG,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAEtE,MAAM,UAAU,GAAG,GAAG,CACpB,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,gBAAgB,CAAC,EAClD,iBAAiB,EACjB,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC,CACzC,CAAC;IAEF,MAAM,SAAS,GAAG,WAAW,CAAC,iBAAiB,EAAE,UAAU,EAAE;QAC3D,KAAK,EAAE,WAAW;KACnB,CAAC,CAAC;IAEH,MAAM,WAAW,GAAG,GAAG,CAAC,GAAG,EAAE,SAAS,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC,CAAC,CAAC;IAElF,MAAM,SAAS,GAAG,aAAa,CAAC,UAAU,CAAC,CAAC;IAE5C,OAAO;QACL,UAAU;QACV,WAAW;QACX,SAAS;QACT,SAAS;KACV,CAAC;AACJ,CAAC,CAAC;AAKF,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAAoB,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,EAAE,EAAE;IAC3F,MAAM,MAAM,GAAG,gBAAgB,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;IAEhD,OAAO,GAAG,CAAA;eACG,KAAK,CAAC,IAAI,CAAC,OAAO;aACpB,MAAM,CAAC,SAAS;kBACX,MAAM,CAAC,UAAU;8BACL,MAAM,CAAC,WAAW;;;;qBAI3B,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,eAAe,CAAC;;MAErD,UAAU;MACV,WAAW;;UAEP,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,eAAe,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;;;;YAIhF,UAAU,GAAG,UAAU;oBACf,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK;;;MAGrC,UAAU,GAAG,UAAU;;;GAG1B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,YAAY,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE7C,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAC1C,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE;IACrB,MAAM,MAAM,GAAG,gBAAgB,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;IAEhD,OAAO,GAAG,CAAA;oBACM,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC;;;;wBAI/B,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,YAAY,CAAC;;;;QAIpD,UAAU;iBACD,MAAM,CAAC,SAAS;;KAE5B,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,aAAa,CAAC,CAAA;;CAE3D,CAAC;AAEF,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAExD,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,IAAI,CAAA;;;CAG7C,CAAC;AAEF,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,CAAC,MAAM,wBAAwB,GAAG,MAAM,CAAC,IAAI,CACjD,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;mBACD,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,WAAW,CAAC;GACtD,CACF,CAAC;AAEF,wBAAwB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import { mix } from 'polished';\nimport styled, { css } from 'styled-components';\nimport type { DefaultTheme } from 'styled-components';\n\nimport { readableColor, readableHue } from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport type { PropsWithDefaults } from '../../types';\nimport { StyledText } from '../Text';\nimport { StyledIcon } from '../Icon';\nimport { UnorderedList } from '../List';\nimport { StyledCard } from '../Card';\nimport { StyledModal } from '../Modal/Modal.styles';\n\nimport type { BannerProps } from './Banner';\n\nexport const getVariantColors = (variant: BannerProps['variant'], theme: DefaultTheme) => {\n  const variantBackground = theme.components.banner[variant].background;\n\n  const background = mix(\n    theme.components.banner[variant]['background-mix'],\n    variantBackground,\n    theme.base.palette['primary-background']\n  );\n\n  const iconColor = readableHue(variantBackground, background, {\n    level: 'AANonText'\n  });\n\n  const borderColor = mix(0.7, iconColor, theme.base.palette['primary-background']);\n\n  const textColor = readableColor(background);\n\n  return {\n    background,\n    borderColor,\n    iconColor,\n    textColor\n  };\n};\n\ninterface StyledBannerProps\n  extends Pick<PropsWithDefaults<BannerProps, 'headingTag'>, 'headingTag' | 'variant'> {}\n\nexport const StyledBanner = styled.div<StyledBannerProps>(({ theme, headingTag, variant }) => {\n  const colors = getVariantColors(variant, theme);\n\n  return css`\n    padding: ${theme.base.spacing};\n    color: ${colors.textColor};\n    background: ${colors.background};\n    border: 0.0625rem solid ${colors.borderColor};\n    min-inline-size: 100%;\n    inline-size: 0;\n    min-block-size: 2.25rem;\n    border-radius: ${theme.components.card['border-radius']};\n\n    ${StyledCard} &,\n    ${StyledModal} & {\n      border-radius: calc(\n        ${theme.components['form-control']['border-radius']} * ${theme.base['border-radius']}\n      );\n    }\n\n    &:has(${headingTag}${StyledText}:focus) {\n      box-shadow: ${theme.base.shadow.focus};\n    }\n\n    ${headingTag}${StyledText} {\n      word-break: break-word;\n    }\n  `;\n});\n\nStyledBanner.defaultProps = defaultThemeProp;\n\nexport const StyledBannerStatus = styled.div<{ variant: BannerProps['variant'] }>(\n  ({ theme, variant }) => {\n    const colors = getVariantColors(variant, theme);\n\n    return css`\n      block-size: ${theme.base['hit-area']['mouse-min']};\n\n      @media (pointer: coarse) {\n        & {\n          block-size: ${theme.base['hit-area']['finger-min']};\n        }\n      }\n\n      ${StyledIcon} {\n        color: ${colors.iconColor};\n      }\n    `;\n  }\n);\n\nStyledBannerStatus.defaultProps = defaultThemeProp;\n\nexport const StyledBannerMessageList = styled(UnorderedList)`\n  padding-inline-start: 0;\n`;\n\nStyledBannerMessageList.defaultProps = defaultThemeProp;\n\nexport const StyledBannerMessage = styled.span`\n  overflow-wrap: break-word;\n  list-style: none;\n`;\n\nStyledBannerMessage.defaultProps = defaultThemeProp;\n\nexport const StyledBannerMessageLabel = styled.span(\n  ({ theme }) => css`\n    font-weight: ${theme.base['font-weight']['semi-bold']};\n  `\n);\n\nStyledBannerMessageLabel.defaultProps = defaultThemeProp;\n"]}

package/lib/components/DateTime/Input/DateRangeInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateRangeInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAwB,MAAM,OAAO,CAAC;AAIrE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAEnD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAI1D,OAAO,KAAK,aAAa,MAAM,mBAAmB,CAAC;AACnD,OAAO,KAAK,EACV,0BAA0B,EAE1B,kBAAkB,EACnB,MAAM,mBAAmB,CAAC;AAW3B,MAAM,WAAW,mBAAoB,SAAQ,kBAAkB;IAC7D,kCAAkC;IAClC,KAAK,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;QAAC,GAAG,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;KAAE,CAAC;IACzE;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,4FAA4F;IAC5F,SAAS,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACtC,6FAA6F;IAC7F,OAAO,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACpC,uHAAuH;IACvH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACtD,sHAAsH;IACtH,kBAAkB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACxD,+CAA+C;IAC/C,QAAQ,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACtD,sDAAsD;IACtD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACtD,qDAAqD;IACrD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACrD,iDAAiD;IACjD,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;;;;AAwQD,wBAAqE"}
+{"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateRangeInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAwB,MAAM,OAAO,CAAC;AAIrE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAEnD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAI1D,OAAO,KAAK,aAAa,MAAM,mBAAmB,CAAC;AACnD,OAAO,KAAK,EACV,0BAA0B,EAE1B,kBAAkB,EACnB,MAAM,mBAAmB,CAAC;AAW3B,MAAM,WAAW,mBAAoB,SAAQ,kBAAkB;IAC7D,kCAAkC;IAClC,KAAK,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;QAAC,GAAG,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;KAAE,CAAC;IACzE;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,4FAA4F;IAC5F,SAAS,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACtC,6FAA6F;IAC7F,OAAO,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACpC,uHAAuH;IACvH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACtD,sHAAsH;IACtH,kBAAkB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACxD,+CAA+C;IAC/C,QAAQ,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACtD,sDAAsD;IACtD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACtD,qDAAqD;IACrD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACrD,iDAAiD;IACjD,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;;;;AAyQD,wBAAqE"}

package/lib/components/DateTime/Input/DateRangeInput.js

@@ -133,7 +133,8 @@ const DateRangeInput = forwardRef(function DateRangeInput({ testId, value = {},
         disabled,
         min,
         max,
-        status
+        status,
+        showWeekNumber
     };
     const descriptionId = useUID();
     return (_jsxs(_Fragment, { children: [_jsx(FormField, { testId: testIds, as: StyledDateRangeInput, ...restProps, ref: containerRef, container: { wrap: 'nowrap' }, labelHidden: labelHidden, label: label, labelAs: 'legend', required: required, readOnly: readOnly, status: status, disabled: disabled, "aria-describedby": descriptionId, children: _jsxs(Flex, { container: true, as: StyledRangeInputContainer, className: createClassName('date-range-input', className, { status }), children: [_jsx(DateInput, { testId: testIds.fromDate, ...commonProps, value: value.start, picker: {

package/lib/components/DateTime/Input/DateRangeInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateRangeInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateRangeInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef, forwardRef, useCallback } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useConsolidatedRef, useFocusWithin, useI18n, useTestIds, useUID } from '../../../hooks';\nimport type { ForwardProps } from '../../../types';\nimport { defaultThemeProp } from '../../../theme';\nimport type { FormControlProps } from '../../FormControl';\nimport Flex from '../../Flex';\nimport FormField, { StyledFormField } from '../../FormField/FormField';\nimport DateRangePicker from '../Picker/DateRangePicker';\nimport type DateTimeProps from '../DateTime.types';\nimport type {\n  DateRangeCallbackParameter,\n  DateTimeCallbackParameter,\n  DateTimeProperties\n} from '../DateTime.types';\nimport { StyledRangeInputContainer } from '../../Input/Input.styles';\nimport { getDateRangeInputTestIds } from '../DateTime.test-ids';\nimport { createClassName, withTestIds } from '../../../utils';\nimport HiddenText from '../../HiddenText';\n\nimport DateInput from './DateInput';\nimport type { DateInputHandleValue } from './DateInput';\nimport { parseToDate } from './utils';\nimport StyledDateInput from './DateTime.styles';\n\nexport interface DateRangeInputProps extends DateTimeProperties {\n  /** Object of range boundaries. */\n  value?: { start?: DateTimeProps['value']; end?: DateTimeProps['value'] };\n  /**\n   * Display additional column with week number in date picker popover.\n   * @default false\n   */\n  showWeekNumber?: boolean;\n  /** Pass a string or a fragment with an Icon and string for first part of DataRangeInput. */\n  fromLabel?: FormControlProps['label'];\n  /** Pass a string or a fragment with an Icon and string for second part of DataRangeInput. */\n  toLabel?: FormControlProps['label'];\n  /** Pass an object with \"heading\" and \"content\" properties to show AdditionalInfo for second part of DataRangeInput. */\n  toAdditionalInfo?: FormControlProps['additionalInfo'];\n  /** Pass an object with \"heading\" and \"content\" properties to show AdditionalInfo for first part of DataRangeInput. */\n  fromAdditionalInfo?: FormControlProps['additionalInfo'];\n  /** Callback fired when input value changes. */\n  onChange: (value: DateRangeCallbackParameter) => void;\n  /** Callback fired when the component gets focused. */\n  onFocus?: (value: DateRangeCallbackParameter) => void;\n  /** Callback fired when the component loses focus. */\n  onBlur?: (value: DateRangeCallbackParameter) => void;\n  /** Automatically focuses the input on render. */\n  autoFocus?: boolean;\n}\n\nconst StyledDateRangeInput = styled.fieldset<DateRangeInputProps>(props => {\n  const {\n    theme: {\n      components: { input }\n    }\n  } = props;\n\n  return css`\n    border: 0;\n    min-width: min-content;\n\n    ${StyledFormField} {\n      &:last-child > ${StyledDateInput} {\n        margin-inline-start: -${input['border-width']};\n      }\n\n      & legend {\n        align-self: center;\n      }\n\n      &:focus,\n      &:hover,\n      &:focus-within {\n        z-index: 2;\n      }\n    }\n  `;\n});\n\nStyledDateRangeInput.defaultProps = defaultThemeProp;\n\ntype DateRepresentable = string | number | Date;\n\nconst convertToCallbackParameter = (v?: number): DateTimeCallbackParameter => {\n  return {\n    valueAsISOString: v === undefined || Number.isNaN(v) ? undefined : new Date(v).toISOString(),\n    valueAsTimestamp: v\n  };\n};\n\nconst prepareValue = (v: number | undefined, type: 'start' | 'end') => {\n  if (v === undefined || Number.isNaN(v)) {\n    return v;\n  }\n  return type === 'start'\n    ? new Date(v).setUTCHours(0, 0, 0, 0)\n    : new Date(v).setUTCHours(23, 59, 59, 999);\n};\n\nconst getSelected = (first: number | undefined, second: number | undefined) => {\n  const selected = first ?? second;\n  return selected ? parseToDate(selected) : undefined;\n};\n\nconst parseValueToDate = (value: DateRepresentable | undefined) => {\n  return value ? parseToDate(value) : undefined;\n};\n\nconst DateRangeInput: FunctionComponent<DateRangeInputProps & ForwardProps> = forwardRef(\n  function DateRangeInput(\n    {\n      testId,\n      value = {},\n      min,\n      max,\n      label,\n      fromLabel,\n      toLabel,\n      labelHidden,\n      status,\n      required,\n      readOnly,\n      disabled,\n      onChange,\n      onFocus,\n      onBlur,\n      showWeekNumber,\n      autoFocus,\n      fromAdditionalInfo,\n      toAdditionalInfo,\n      className,\n      ...restProps\n    }: PropsWithoutRef<DateRangeInputProps>,\n    ref: Ref<HTMLDivElement>\n  ) {\n    const testIds = useTestIds(testId, getDateRangeInputTestIds);\n    const t = useI18n();\n    const endDateHandle = useRef<DateInputHandleValue>(null);\n\n    const start =\n      value.start === undefined || value.start === ''\n        ? undefined\n        : prepareValue(parseToDate(value.start).getTime(), 'start');\n    const end =\n      value.end === undefined || value.end === ''\n        ? undefined\n        : prepareValue(parseToDate(value.end).getTime(), 'end');\n\n    const startDateRef = useRef<DateTimeCallbackParameter>(convertToCallbackParameter(start));\n    const endDateRef = useRef<DateTimeCallbackParameter>(convertToCallbackParameter(end));\n\n    const onFocusChange = useCallback(\n      (focused: boolean) => {\n        (focused ? onFocus : onBlur)?.({\n          start: startDateRef.current,\n          end: endDateRef.current\n        });\n      },\n      [onFocus, onBlur]\n    );\n\n    const containerRef = useConsolidatedRef(ref);\n    useFocusWithin([containerRef], onFocusChange);\n\n    const onStartDateChange = (selectedDate?: Date) => {\n      const selected = selectedDate?.getTime();\n      if (end && selected && selected > end) {\n        startDateRef.current = convertToCallbackParameter(prepareValue(end, 'start'));\n        endDateRef.current = convertToCallbackParameter(prepareValue(selected, 'end'));\n        onChange({\n          start: convertToCallbackParameter(prepareValue(end, 'start')),\n          end: convertToCallbackParameter(prepareValue(selected, 'end'))\n        });\n      } else {\n        startDateRef.current = convertToCallbackParameter(prepareValue(selected, 'start'));\n        endDateRef.current = convertToCallbackParameter(end);\n        onChange({\n          start: convertToCallbackParameter(prepareValue(selected, 'start')),\n          end: convertToCallbackParameter(end)\n        });\n      }\n      endDateHandle.current?.setOpen(true);\n    };\n\n    const onEndDateChange = (selectedDate?: Date) => {\n      const selected = selectedDate?.getTime();\n      if (start && selected && selected < start) {\n        endDateRef.current = convertToCallbackParameter(prepareValue(start, 'end'));\n        startDateRef.current = convertToCallbackParameter(prepareValue(selected, 'start'));\n        onChange({\n          end: convertToCallbackParameter(prepareValue(start, 'end')),\n          start: convertToCallbackParameter(prepareValue(selected, 'start'))\n        });\n      } else {\n        endDateRef.current = convertToCallbackParameter(prepareValue(selected, 'end'));\n        startDateRef.current = convertToCallbackParameter(start);\n        onChange({\n          start: convertToCallbackParameter(start),\n          end: convertToCallbackParameter(prepareValue(selected, 'end'))\n        });\n      }\n    };\n\n    const getSelectedRange = () => {\n      const startDate = parseValueToDate(start);\n      const endDate = parseValueToDate(end);\n\n      if (startDate && endDate && startDate > endDate) return undefined;\n\n      return {\n        startDate,\n        endDate\n      };\n    };\n\n    const commonProps = {\n      required,\n      readOnly,\n      disabled,\n      min,\n      max,\n      status\n    };\n\n    const descriptionId = useUID();\n\n    return (\n      <>\n        <FormField\n          testId={testIds}\n          as={StyledDateRangeInput}\n          {...restProps}\n          ref={containerRef}\n          container={{ wrap: 'nowrap' }}\n          labelHidden={labelHidden}\n          label={label}\n          labelAs='legend'\n          required={required}\n          readOnly={readOnly}\n          status={status}\n          disabled={disabled}\n          aria-describedby={descriptionId}\n        >\n          <Flex\n            container\n            as={StyledRangeInputContainer}\n            className={createClassName('date-range-input', className, { status })}\n          >\n            <DateInput\n              testId={testIds.fromDate}\n              {...commonProps}\n              value={value.start}\n              picker={{\n                renderer: DateRangePicker,\n                rendererProps: {\n                  selected: getSelected(start, end),\n                  selectedRange: getSelectedRange(),\n                  onChange: onStartDateChange\n                }\n              }}\n              onBlur={changedValue => {\n                const newValue = changedValue.state\n                  ? changedValue\n                  : convertToCallbackParameter(\n                      prepareValue(changedValue.valueAsTimestamp, 'start')\n                    );\n                startDateRef.current = newValue;\n                onChange({\n                  start: newValue,\n                  end: convertToCallbackParameter(prepareValue(end, 'end'))\n                });\n              }}\n              additionalInfo={fromAdditionalInfo}\n              label={fromLabel}\n              aria-label={`${t('range_from_datetime') + (label ? ` - ${label}` : '')}`}\n              autoFocus={autoFocus}\n            />\n            <DateInput\n              testId={testIds.toDate}\n              {...commonProps}\n              value={value.end}\n              handle={endDateHandle}\n              picker={{\n                renderer: DateRangePicker,\n                rendererProps: {\n                  selected: getSelected(end, start),\n                  selectedRange: getSelectedRange(),\n                  onChange: onEndDateChange\n                }\n              }}\n              onBlur={changedValue => {\n                const newValue = changedValue.state\n                  ? changedValue\n                  : convertToCallbackParameter(prepareValue(changedValue.valueAsTimestamp, 'end'));\n                endDateRef.current = newValue;\n                onChange({\n                  start: convertToCallbackParameter(prepareValue(start, 'start')),\n                  end: newValue\n                });\n              }}\n              additionalInfo={toAdditionalInfo}\n              label={toLabel}\n              aria-label={`${t('range_to_datetime') + (label ? ` - ${label}` : '')}`}\n            />\n          </Flex>\n        </FormField>\n        <HiddenText id={descriptionId}>{t('range_input')}</HiddenText>\n      </>\n    );\n  }\n);\n\nexport default withTestIds(DateRangeInput, getDateRangeInputTestIds);\n"]}
+{"version":3,"file":"DateRangeInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateRangeInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef, forwardRef, useCallback } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useConsolidatedRef, useFocusWithin, useI18n, useTestIds, useUID } from '../../../hooks';\nimport type { ForwardProps } from '../../../types';\nimport { defaultThemeProp } from '../../../theme';\nimport type { FormControlProps } from '../../FormControl';\nimport Flex from '../../Flex';\nimport FormField, { StyledFormField } from '../../FormField/FormField';\nimport DateRangePicker from '../Picker/DateRangePicker';\nimport type DateTimeProps from '../DateTime.types';\nimport type {\n  DateRangeCallbackParameter,\n  DateTimeCallbackParameter,\n  DateTimeProperties\n} from '../DateTime.types';\nimport { StyledRangeInputContainer } from '../../Input/Input.styles';\nimport { getDateRangeInputTestIds } from '../DateTime.test-ids';\nimport { createClassName, withTestIds } from '../../../utils';\nimport HiddenText from '../../HiddenText';\n\nimport DateInput from './DateInput';\nimport type { DateInputHandleValue } from './DateInput';\nimport { parseToDate } from './utils';\nimport StyledDateInput from './DateTime.styles';\n\nexport interface DateRangeInputProps extends DateTimeProperties {\n  /** Object of range boundaries. */\n  value?: { start?: DateTimeProps['value']; end?: DateTimeProps['value'] };\n  /**\n   * Display additional column with week number in date picker popover.\n   * @default false\n   */\n  showWeekNumber?: boolean;\n  /** Pass a string or a fragment with an Icon and string for first part of DataRangeInput. */\n  fromLabel?: FormControlProps['label'];\n  /** Pass a string or a fragment with an Icon and string for second part of DataRangeInput. */\n  toLabel?: FormControlProps['label'];\n  /** Pass an object with \"heading\" and \"content\" properties to show AdditionalInfo for second part of DataRangeInput. */\n  toAdditionalInfo?: FormControlProps['additionalInfo'];\n  /** Pass an object with \"heading\" and \"content\" properties to show AdditionalInfo for first part of DataRangeInput. */\n  fromAdditionalInfo?: FormControlProps['additionalInfo'];\n  /** Callback fired when input value changes. */\n  onChange: (value: DateRangeCallbackParameter) => void;\n  /** Callback fired when the component gets focused. */\n  onFocus?: (value: DateRangeCallbackParameter) => void;\n  /** Callback fired when the component loses focus. */\n  onBlur?: (value: DateRangeCallbackParameter) => void;\n  /** Automatically focuses the input on render. */\n  autoFocus?: boolean;\n}\n\nconst StyledDateRangeInput = styled.fieldset<DateRangeInputProps>(props => {\n  const {\n    theme: {\n      components: { input }\n    }\n  } = props;\n\n  return css`\n    border: 0;\n    min-width: min-content;\n\n    ${StyledFormField} {\n      &:last-child > ${StyledDateInput} {\n        margin-inline-start: -${input['border-width']};\n      }\n\n      & legend {\n        align-self: center;\n      }\n\n      &:focus,\n      &:hover,\n      &:focus-within {\n        z-index: 2;\n      }\n    }\n  `;\n});\n\nStyledDateRangeInput.defaultProps = defaultThemeProp;\n\ntype DateRepresentable = string | number | Date;\n\nconst convertToCallbackParameter = (v?: number): DateTimeCallbackParameter => {\n  return {\n    valueAsISOString: v === undefined || Number.isNaN(v) ? undefined : new Date(v).toISOString(),\n    valueAsTimestamp: v\n  };\n};\n\nconst prepareValue = (v: number | undefined, type: 'start' | 'end') => {\n  if (v === undefined || Number.isNaN(v)) {\n    return v;\n  }\n  return type === 'start'\n    ? new Date(v).setUTCHours(0, 0, 0, 0)\n    : new Date(v).setUTCHours(23, 59, 59, 999);\n};\n\nconst getSelected = (first: number | undefined, second: number | undefined) => {\n  const selected = first ?? second;\n  return selected ? parseToDate(selected) : undefined;\n};\n\nconst parseValueToDate = (value: DateRepresentable | undefined) => {\n  return value ? parseToDate(value) : undefined;\n};\n\nconst DateRangeInput: FunctionComponent<DateRangeInputProps & ForwardProps> = forwardRef(\n  function DateRangeInput(\n    {\n      testId,\n      value = {},\n      min,\n      max,\n      label,\n      fromLabel,\n      toLabel,\n      labelHidden,\n      status,\n      required,\n      readOnly,\n      disabled,\n      onChange,\n      onFocus,\n      onBlur,\n      showWeekNumber,\n      autoFocus,\n      fromAdditionalInfo,\n      toAdditionalInfo,\n      className,\n      ...restProps\n    }: PropsWithoutRef<DateRangeInputProps>,\n    ref: Ref<HTMLDivElement>\n  ) {\n    const testIds = useTestIds(testId, getDateRangeInputTestIds);\n    const t = useI18n();\n    const endDateHandle = useRef<DateInputHandleValue>(null);\n\n    const start =\n      value.start === undefined || value.start === ''\n        ? undefined\n        : prepareValue(parseToDate(value.start).getTime(), 'start');\n    const end =\n      value.end === undefined || value.end === ''\n        ? undefined\n        : prepareValue(parseToDate(value.end).getTime(), 'end');\n\n    const startDateRef = useRef<DateTimeCallbackParameter>(convertToCallbackParameter(start));\n    const endDateRef = useRef<DateTimeCallbackParameter>(convertToCallbackParameter(end));\n\n    const onFocusChange = useCallback(\n      (focused: boolean) => {\n        (focused ? onFocus : onBlur)?.({\n          start: startDateRef.current,\n          end: endDateRef.current\n        });\n      },\n      [onFocus, onBlur]\n    );\n\n    const containerRef = useConsolidatedRef(ref);\n    useFocusWithin([containerRef], onFocusChange);\n\n    const onStartDateChange = (selectedDate?: Date) => {\n      const selected = selectedDate?.getTime();\n      if (end && selected && selected > end) {\n        startDateRef.current = convertToCallbackParameter(prepareValue(end, 'start'));\n        endDateRef.current = convertToCallbackParameter(prepareValue(selected, 'end'));\n        onChange({\n          start: convertToCallbackParameter(prepareValue(end, 'start')),\n          end: convertToCallbackParameter(prepareValue(selected, 'end'))\n        });\n      } else {\n        startDateRef.current = convertToCallbackParameter(prepareValue(selected, 'start'));\n        endDateRef.current = convertToCallbackParameter(end);\n        onChange({\n          start: convertToCallbackParameter(prepareValue(selected, 'start')),\n          end: convertToCallbackParameter(end)\n        });\n      }\n      endDateHandle.current?.setOpen(true);\n    };\n\n    const onEndDateChange = (selectedDate?: Date) => {\n      const selected = selectedDate?.getTime();\n      if (start && selected && selected < start) {\n        endDateRef.current = convertToCallbackParameter(prepareValue(start, 'end'));\n        startDateRef.current = convertToCallbackParameter(prepareValue(selected, 'start'));\n        onChange({\n          end: convertToCallbackParameter(prepareValue(start, 'end')),\n          start: convertToCallbackParameter(prepareValue(selected, 'start'))\n        });\n      } else {\n        endDateRef.current = convertToCallbackParameter(prepareValue(selected, 'end'));\n        startDateRef.current = convertToCallbackParameter(start);\n        onChange({\n          start: convertToCallbackParameter(start),\n          end: convertToCallbackParameter(prepareValue(selected, 'end'))\n        });\n      }\n    };\n\n    const getSelectedRange = () => {\n      const startDate = parseValueToDate(start);\n      const endDate = parseValueToDate(end);\n\n      if (startDate && endDate && startDate > endDate) return undefined;\n\n      return {\n        startDate,\n        endDate\n      };\n    };\n\n    const commonProps = {\n      required,\n      readOnly,\n      disabled,\n      min,\n      max,\n      status,\n      showWeekNumber\n    };\n\n    const descriptionId = useUID();\n\n    return (\n      <>\n        <FormField\n          testId={testIds}\n          as={StyledDateRangeInput}\n          {...restProps}\n          ref={containerRef}\n          container={{ wrap: 'nowrap' }}\n          labelHidden={labelHidden}\n          label={label}\n          labelAs='legend'\n          required={required}\n          readOnly={readOnly}\n          status={status}\n          disabled={disabled}\n          aria-describedby={descriptionId}\n        >\n          <Flex\n            container\n            as={StyledRangeInputContainer}\n            className={createClassName('date-range-input', className, { status })}\n          >\n            <DateInput\n              testId={testIds.fromDate}\n              {...commonProps}\n              value={value.start}\n              picker={{\n                renderer: DateRangePicker,\n                rendererProps: {\n                  selected: getSelected(start, end),\n                  selectedRange: getSelectedRange(),\n                  onChange: onStartDateChange\n                }\n              }}\n              onBlur={changedValue => {\n                const newValue = changedValue.state\n                  ? changedValue\n                  : convertToCallbackParameter(\n                      prepareValue(changedValue.valueAsTimestamp, 'start')\n                    );\n                startDateRef.current = newValue;\n                onChange({\n                  start: newValue,\n                  end: convertToCallbackParameter(prepareValue(end, 'end'))\n                });\n              }}\n              additionalInfo={fromAdditionalInfo}\n              label={fromLabel}\n              aria-label={`${t('range_from_datetime') + (label ? ` - ${label}` : '')}`}\n              autoFocus={autoFocus}\n            />\n            <DateInput\n              testId={testIds.toDate}\n              {...commonProps}\n              value={value.end}\n              handle={endDateHandle}\n              picker={{\n                renderer: DateRangePicker,\n                rendererProps: {\n                  selected: getSelected(end, start),\n                  selectedRange: getSelectedRange(),\n                  onChange: onEndDateChange\n                }\n              }}\n              onBlur={changedValue => {\n                const newValue = changedValue.state\n                  ? changedValue\n                  : convertToCallbackParameter(prepareValue(changedValue.valueAsTimestamp, 'end'));\n                endDateRef.current = newValue;\n                onChange({\n                  start: convertToCallbackParameter(prepareValue(start, 'start')),\n                  end: newValue\n                });\n              }}\n              additionalInfo={toAdditionalInfo}\n              label={toLabel}\n              aria-label={`${t('range_to_datetime') + (label ? ` - ${label}` : '')}`}\n            />\n          </Flex>\n        </FormField>\n        <HiddenText id={descriptionId}>{t('range_input')}</HiddenText>\n      </>\n    );\n  }\n);\n\nexport default withTestIds(DateRangeInput, getDateRangeInputTestIds);\n"]}