npm - @pega/cosmos-react-core - Versions diffs - 4.0.0-dev.18.0 → 4.0.0-dev.18.2 - Mend

@pega/cosmos-react-core 4.0.0-dev.18.0 → 4.0.0-dev.18.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (69) hide show

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

@@ -37,7 +37,9 @@ export declare const StyledBanner: import("styled-components").StyledComponent<"
 }, 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, {}, never>;
+export declare const StyledBannerContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+    expandable?: boolean | undefined;
+}, never>;
 export declare const StyledBannerMessageList: typeof UnorderedList;
 export declare const StyledBannerMessage: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
 declare const Banner: FunctionComponent<BannerProps & ForwardProps>;

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../../src/components/Banner/Banner.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EAEjB,GAAG,EACH,iBAAiB,EAIlB,MAAM,OAAO,CAAC;AAKf,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,UAAU,EAAE,cAAc,EAAc,MAAM,aAAa,CAAC;AAiB9F,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAWxC,MAAM,WAAW,iBAAiB;IAChC,kEAAkE;IAClE,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,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,WAAW,WAAY,SAAQ,SAAS,EAAE,cAAc;IAC5D,0CAA0C;IAC1C,OAAO,EAAE,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;IACnD;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,gEAAgE;IAChE,QAAQ,EAAE,CAAC,MAAM,GAAG,aAAa,CAAC,EAAE,CAAC;IACrC,0DAA0D;IAC1D,SAAS,CAAC,EAAE,iBAAiB,CAAC;IAC9B,4DAA4D;IAC5D,MAAM,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;IAChC,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,YAAY;gBAA4B,WAAW,CAAC,YAAY,CAAC;SAU7E,CAAC;AAIF,eAAO,MAAM,kBAAkB,mIAiB7B,CAAC;AAIH,eAAO,MAAM,kBAAkB,yGAoB7B,CAAC;AAIH,eAAO,MAAM,mBAAmB,~~yGAY9B,~~CAAC;AAIH,eAAO,MAAM,uBAAuB,EAAE,OAAO,~~aAK5C~~,CAAC;AAIF,eAAO,MAAM,mBAAmB,0GAG/B,CAAC;AAyDF,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,CAuJzD,CAAC;AAEF,eAAe,MAAM,CAAC"}
1	+ {"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../../src/components/Banner/Banner.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EAEjB,GAAG,EACH,iBAAiB,EAIlB,MAAM,OAAO,CAAC;AAKf,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,UAAU,EAAE,cAAc,EAAc,MAAM,aAAa,CAAC;AAiB9F,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAWxC,MAAM,WAAW,iBAAiB;IAChC,kEAAkE;IAClE,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,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,WAAW,WAAY,SAAQ,SAAS,EAAE,cAAc;IAC5D,0CAA0C;IAC1C,OAAO,EAAE,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;IACnD;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,gEAAgE;IAChE,QAAQ,EAAE,CAAC,MAAM,GAAG,aAAa,CAAC,EAAE,CAAC;IACrC,0DAA0D;IAC1D,SAAS,CAAC,EAAE,iBAAiB,CAAC;IAC9B,4DAA4D;IAC5D,MAAM,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;IAChC,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,YAAY;gBAA4B,WAAW,CAAC,YAAY,CAAC;SAU7E,CAAC;AAIF,eAAO,MAAM,kBAAkB,mIAiB7B,CAAC;AAIH,eAAO,MAAM,kBAAkB,yGAoB7B,CAAC;AAIH,eAAO,MAAM,mBAAmB;;SAY9B,CAAC;AAIH,eAAO,MAAM,uBAAuB,EAAE,OAAO,aAM5C,CAAC;AAIF,eAAO,MAAM,mBAAmB,0GAG/B,CAAC;AAyDF,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,CAuJzD,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/lib/components/Banner/Banner.js CHANGED Viewed

@@ -50,7 +50,7 @@ StyledBannerStatus.defaultProps = defaultThemeProp;
 export const StyledBannerHeader = styled.div(({ theme }) => {
     const { rtl } = useDirection();
     return css `
-    min-height: 2rem;
+    min-height: 2.125rem;
     ${StyledButton}[aria-expanded] {
       ${StyledIcon} {
@@ -68,12 +68,12 @@ export const StyledBannerHeader = styled.div(({ theme }) => {
   `;
 });
 StyledBannerHeader.defaultProps = defaultThemeProp;
-export const StyledBannerContent = styled.div(({ theme }) => {
+export const StyledBannerContent = styled.div(({ expandable, theme }) => {
     return css `
     height: 100%;
     background: ${theme.components.card.background};
     padding-block: calc(0.5 * ${theme.base.spacing});
-    padding-inline-start: calc(2 * ${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;
@@ -84,6 +84,7 @@ export const StyledBannerContent = styled.div(({ theme }) => {
 StyledBannerContent.defaultProps = defaultThemeProp;
 export const StyledBannerMessageList = styled(UnorderedList)(({ theme }) => css `
     padding-block-end: calc(0.5 * ${theme.base.spacing});
+    padding-inline-start: calc(5 * ${theme.base.spacing});
     padding-inline-end: calc(2 * ${theme.base.spacing});
   `);
 StyledBannerMessageList.defaultProps = defaultThemeProp;
@@ -156,7 +157,7 @@ const Banner = forwardRef(({ variant, headingTag = 'h2', messages, onDismiss, ha
                 focusHeadingOrContainer(bannerRef.current, heading);
         }
     }), []);
-    return (_jsxs(Grid, { ...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 }) }), count === 1 ? (_jsxs(Flex, { container: { alignItems: 'start' }, as: StyledBannerContent, children: [_jsx(VisuallyHiddenText, { as: headingTag, children: `${heading} ${count}` }), _jsx(Flex, { item: { alignSelf: 'center', grow: 1 }, as: 'ul', children: typeof messages[0] === 'string' ? (_jsx(BannerMessageItem, { label: messages[0], as: 'li' })) : (_jsx(BannerMessageItem, { ...messages[0], as: 'li' })) }), onDismiss && (_jsx(Button, { onClick: onDismiss, label: t('dismiss'), "aria-label": t('banner_dismiss_button_label_a11y'), variant: 'simple', icon: true, children: _jsx(Icon, { name: 'times' }) }))] })) : (_jsxs(StyledBannerContent, { children: [_jsxs(Grid, { as: StyledBannerHeader, container: { cols: 'auto 1fr auto', areas: '"toggle heading dismiss"', gap: 1 }, children: [_jsxs(Grid, { container: { cols: 'min-content min-content', gap: 0.5, alignItems: 'center' }, item: { area: 'heading', alignSelf: 'center' }, as: Text, forwardedAs: headingTag, variant: 'h2', children: [heading, " ", _jsx(Count, { children: count })] }), _jsx(Grid, { item: { area: 'toggle', alignSelf: 'center' }, children: _jsx(Button, { onClick: () => {
+    return (_jsxs(Grid, { ...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 }) }), count === 1 ? (_jsxs(Flex, { container: { alignItems: 'start' }, as: StyledBannerContent, children: [_jsx(VisuallyHiddenText, { as: headingTag, children: `${heading} ${count}` }), _jsx(Flex, { item: { alignSelf: 'center', grow: 1 }, as: 'ul', children: typeof messages[0] === 'string' ? (_jsx(BannerMessageItem, { label: messages[0], as: 'li' })) : (_jsx(BannerMessageItem, { ...messages[0], as: 'li' })) }), onDismiss && (_jsx(Button, { onClick: onDismiss, label: t('dismiss'), "aria-label": t('banner_dismiss_button_label_a11y'), variant: 'simple', icon: true, children: _jsx(Icon, { name: 'times' }) }))] })) : (_jsxs(StyledBannerContent, { expandable: true, children: [_jsxs(Grid, { as: StyledBannerHeader, container: { cols: 'auto 1fr auto', areas: '"toggle heading dismiss"', gap: 0.5 }, children: [_jsxs(Grid, { container: { cols: 'min-content min-content', gap: 0.5, alignItems: 'center' }, item: { area: 'heading', alignSelf: 'center' }, as: Text, forwardedAs: headingTag, variant: 'h2', children: [heading, " ", _jsx(Count, { children: count })] }), _jsx(Grid, { item: { area: 'toggle', alignSelf: 'center' }, children: _jsx(Button, { onClick: () => {
                                         setCollapsed(cur => !cur);
                                     }, label: t(collapsed ? 'expand' : 'collapse'), "aria-expanded": collapsed ? 'false' : 'true', variant: 'simple', icon: true, children: _jsx(Icon, { name: 'caret-right' }) }) }), _jsx(Grid, { item: { area: 'dismiss', alignSelf: 'center' }, children: onDismiss && (_jsx(Button, { onClick: onDismiss, label: t('dismiss'), "aria-label": t('banner_dismiss_button_label_a11y'), variant: 'simple', icon: true, children: _jsx(Icon, { name: 'times' }) })) })] }), _jsx(ExpandCollapse, { collapsed: collapsed, children: _jsx(StyledBannerMessageList, { items: messagesToRender }) })] }))] }));
 });

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Banner.js","sourceRoot":"","sources":["../../../src/components/Banner/Banner.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n useState,\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n MouseEventHandler,\n useMemo,\n ReactNode,\n useImperativeHandle\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { getContrast, readableColor } from 'polished';\n\nimport { defaultThemeProp } from '../../theme';\nimport { BaseProps, ForwardProps, HeadingTag, NoChildrenProp, OmitStrict } from '../../types';\nimport Button, { StyledButton } from '../Button';\nimport { focusHeadingOrContainer, tryCatch } from '../../utils';\nimport { useConsolidatedRef, useDirection, useI18n } from '../../hooks';\nimport Flex from '../Flex';\nimport Text 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 flagWaveSolidIcon from '../Icon/icons/flag-wave-solid.icon';\nimport * as informationSolidIcon from '../Icon/icons/information-solid.icon';\nimport * as checkIcon from '../Icon/icons/check.icon';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport { UnorderedList } from '../List';\n\nregisterIcon(\n timesIcon,\n caretRightIcon,\n warnSolidIcon,\n flagWaveSolidIcon,\n informationSolidIcon,\n checkIcon\n);\n\nexport interface BannerHandleValue {\n /** Used to apply focus to the banner via an imperative handle. /\n focus: () => void;\n}\n\nexport interface BannerMessage {\n label: string;\n description?: string;\n action?: {\n text: string;\n onClick?: MouseEventHandler<HTMLButtonElement \| HTMLAnchorElement>;\n href?: string;\n };\n items?: (BannerMessage \| string)[];\n}\n\nexport interface BannerProps extends BaseProps, NoChildrenProp {\n /* Controls the styling of the Banner. /\n variant: 'urgent' \| 'warning' \| 'success' \| 'info';\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 /* Pass one or more descriptive messages to inform the user. /\n messages: (string \| BannerMessage)[];\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 /* Ref forwarded to the wrapping element. /\n ref?: Ref<HTMLDivElement>;\n}\n\nexport const StyledBanner = styled.div<{ headingTag: BannerProps['headingTag'] }>(\n ({ headingTag, theme }) => {\n return css`\n border-radius: ${theme.components.card['border-radius']};\n\n &:has(${headingTag}:focus) {\n box-shadow: ${theme.base.shadow.focus};\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 min-height: 2rem;\n\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(({ theme }) => {\n return css`\n height: 100%;\n background: ${theme.components.card.background};\n padding-block: calc(0.5 ${theme.base.spacing});\n padding-inline-start: calc(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: typeof UnorderedList = styled(UnorderedList)(\n ({ theme }) => css`\n padding-block-end: calc(0.5 * ${theme.base.spacing});\n padding-inline-end: calc(2 * ${theme.base.spacing});\n `\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\nconst BannerMessageItem = forwardRef<\n HTMLLIElement,\n OmitStrict<BannerMessage, 'items'> & ForwardProps\n>(({ label, description, action, ...restProps }, ref) => {\n return (\n <StyledBannerMessage {...restProps} ref={ref}>\n <span>{label}</span>\n {description && (\n <>\n {' '}\n <Text variant='secondary'>{description}</Text>\n </>\n )}\n {action && (\n <>\n {' '}\n <Text variant='secondary'>\n <Button variant='link' href={action.href} onClick={action.onClick} {...action}>\n {action.text}\n </Button>\n </Text>\n </>\n )}\n </StyledBannerMessage>\n );\n});\n\nconst prepareMessages = (\n messages: (string \| BannerMessage)[]\n): [messages: ReactNode[], count: number] => {\n let count = 0;\n\n return [\n messages.flatMap(msg => {\n count += 1;\n\n if (typeof msg === 'string') {\n return [<BannerMessageItem label={msg} />];\n }\n\n if (msg.items) {\n const { items, ...restMsg } = msg;\n const [subMessages, subCount] = prepareMessages(items);\n count += subCount;\n return [<BannerMessageItem {...restMsg} />, subMessages];\n }\n\n return [<BannerMessageItem {...msg} />];\n }),\n count\n ];\n};\n\nconst Banner: FunctionComponent<BannerProps & ForwardProps> = forwardRef(\n (\n {\n variant,\n headingTag = 'h2',\n messages,\n onDismiss,\n handle,\n ...restProps\n }: PropsWithoutRef<BannerProps>,\n ref: BannerProps['ref']\n ) => {\n const [messagesToRender, count] = useMemo(() => prepareMessages(messages), [messages]);\n\n const t = useI18n();\n const [collapsed, setCollapsed] = useState(count > 2);\n\n const bannerRef = useConsolidatedRef(ref);\n\n let role: string;\n let icon: string;\n let heading: 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 = 'flag-wave-solid';\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 '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 if (bannerRef.current) focusHeadingOrContainer(bannerRef.current, heading);\n }\n }),\n []\n );\n\n return (\n <Grid\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 {count === 1 ? (\n <Flex container={{ alignItems: 'start' }} as={StyledBannerContent}>\n <VisuallyHiddenText as={headingTag}>{`${heading} ${count}`}</VisuallyHiddenText>\n <Flex item={{ alignSelf: 'center', grow: 1 }} as='ul'>\n {typeof messages[0] === 'string' ? (\n <BannerMessageItem label={messages[0]} as='li' />\n ) : (\n <BannerMessageItem {...messages[0]} as='li' />\n )}\n </Flex>\n {onDismiss && (\n <Button\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 )}\n </Flex>\n ) : (\n <StyledBannerContent>\n <Grid\n as={StyledBannerHeader}\n container={{ cols: 'auto 1fr auto', areas: '\"toggle heading dismiss\"', gap: 1 }}\n >\n <Grid\n container={{ cols: 'min-content min-content', gap: 0.5, alignItems: 'center' }}\n item={{ area: 'heading', alignSelf: 'center' }}\n as={Text}\n forwardedAs={headingTag}\n variant='h2'\n >\n {heading} <Count>{count}</Count>\n </Grid>\n <Grid item={{ area: 'toggle', alignSelf: 'center' }}>\n <Button\n onClick={() => {\n setCollapsed(cur => !cur);\n }}\n label={t(collapsed ? 'expand' : 'collapse')}\n aria-expanded={collapsed ? 'false' : 'true'}\n variant='simple'\n icon\n >\n <Icon name='caret-right' />\n </Button>\n </Grid>\n <Grid item={{ area: 'dismiss', alignSelf: 'center' }}>\n {onDismiss && (\n <Button\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 )}\n </Grid>\n </Grid>\n <ExpandCollapse collapsed={collapsed}>\n <StyledBannerMessageList items={messagesToRender} />\n </ExpandCollapse>\n </StyledBannerContent>\n )}\n </Grid>\n );\n }\n);\n\nexport default Banner;\n"]}
1	+ {"version":3,"file":"Banner.js","sourceRoot":"","sources":["../../../src/components/Banner/Banner.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n useState,\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n MouseEventHandler,\n useMemo,\n ReactNode,\n useImperativeHandle\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { getContrast, readableColor } from 'polished';\n\nimport { defaultThemeProp } from '../../theme';\nimport { BaseProps, ForwardProps, HeadingTag, NoChildrenProp, OmitStrict } from '../../types';\nimport Button, { StyledButton } from '../Button';\nimport { focusHeadingOrContainer, tryCatch } from '../../utils';\nimport { useConsolidatedRef, useDirection, useI18n } from '../../hooks';\nimport Flex from '../Flex';\nimport Text 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 flagWaveSolidIcon from '../Icon/icons/flag-wave-solid.icon';\nimport * as informationSolidIcon from '../Icon/icons/information-solid.icon';\nimport * as checkIcon from '../Icon/icons/check.icon';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport { UnorderedList } from '../List';\n\nregisterIcon(\n timesIcon,\n caretRightIcon,\n warnSolidIcon,\n flagWaveSolidIcon,\n informationSolidIcon,\n checkIcon\n);\n\nexport interface BannerHandleValue {\n /** Used to apply focus to the banner via an imperative handle. /\n focus: () => void;\n}\n\nexport interface BannerMessage {\n label: string;\n description?: string;\n action?: {\n text: string;\n onClick?: MouseEventHandler<HTMLButtonElement \| HTMLAnchorElement>;\n href?: string;\n };\n items?: (BannerMessage \| string)[];\n}\n\nexport interface BannerProps extends BaseProps, NoChildrenProp {\n /* Controls the styling of the Banner. /\n variant: 'urgent' \| 'warning' \| 'success' \| 'info';\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 /* Pass one or more descriptive messages to inform the user. /\n messages: (string \| BannerMessage)[];\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 /* Ref forwarded to the wrapping element. /\n ref?: Ref<HTMLDivElement>;\n}\n\nexport const StyledBanner = styled.div<{ headingTag: BannerProps['headingTag'] }>(\n ({ headingTag, theme }) => {\n return css`\n border-radius: ${theme.components.card['border-radius']};\n\n &:has(${headingTag}:focus) {\n box-shadow: ${theme.base.shadow.focus};\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 min-height: 2.125rem;\n\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 height: 100%;\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: typeof UnorderedList = styled(UnorderedList)(\n ({ theme }) => css`\n padding-block-end: calc(0.5 * ${theme.base.spacing});\n padding-inline-start: calc(5 * ${theme.base.spacing});\n padding-inline-end: calc(2 * ${theme.base.spacing});\n `\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\nconst BannerMessageItem = forwardRef<\n HTMLLIElement,\n OmitStrict<BannerMessage, 'items'> & ForwardProps\n>(({ label, description, action, ...restProps }, ref) => {\n return (\n <StyledBannerMessage {...restProps} ref={ref}>\n <span>{label}</span>\n {description && (\n <>\n {' '}\n <Text variant='secondary'>{description}</Text>\n </>\n )}\n {action && (\n <>\n {' '}\n <Text variant='secondary'>\n <Button variant='link' href={action.href} onClick={action.onClick} {...action}>\n {action.text}\n </Button>\n </Text>\n </>\n )}\n </StyledBannerMessage>\n );\n});\n\nconst prepareMessages = (\n messages: (string \| BannerMessage)[]\n): [messages: ReactNode[], count: number] => {\n let count = 0;\n\n return [\n messages.flatMap(msg => {\n count += 1;\n\n if (typeof msg === 'string') {\n return [<BannerMessageItem label={msg} />];\n }\n\n if (msg.items) {\n const { items, ...restMsg } = msg;\n const [subMessages, subCount] = prepareMessages(items);\n count += subCount;\n return [<BannerMessageItem {...restMsg} />, subMessages];\n }\n\n return [<BannerMessageItem {...msg} />];\n }),\n count\n ];\n};\n\nconst Banner: FunctionComponent<BannerProps & ForwardProps> = forwardRef(\n (\n {\n variant,\n headingTag = 'h2',\n messages,\n onDismiss,\n handle,\n ...restProps\n }: PropsWithoutRef<BannerProps>,\n ref: BannerProps['ref']\n ) => {\n const [messagesToRender, count] = useMemo(() => prepareMessages(messages), [messages]);\n\n const t = useI18n();\n const [collapsed, setCollapsed] = useState(count > 2);\n\n const bannerRef = useConsolidatedRef(ref);\n\n let role: string;\n let icon: string;\n let heading: 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 = 'flag-wave-solid';\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 '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 if (bannerRef.current) focusHeadingOrContainer(bannerRef.current, heading);\n }\n }),\n []\n );\n\n return (\n <Grid\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 {count === 1 ? (\n <Flex container={{ alignItems: 'start' }} as={StyledBannerContent}>\n <VisuallyHiddenText as={headingTag}>{`${heading} ${count}`}</VisuallyHiddenText>\n <Flex item={{ alignSelf: 'center', grow: 1 }} as='ul'>\n {typeof messages[0] === 'string' ? (\n <BannerMessageItem label={messages[0]} as='li' />\n ) : (\n <BannerMessageItem {...messages[0]} as='li' />\n )}\n </Flex>\n {onDismiss && (\n <Button\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 )}\n </Flex>\n ) : (\n <StyledBannerContent expandable>\n <Grid\n as={StyledBannerHeader}\n container={{ cols: 'auto 1fr auto', areas: '\"toggle heading dismiss\"', gap: 0.5 }}\n >\n <Grid\n container={{ cols: 'min-content min-content', gap: 0.5, alignItems: 'center' }}\n item={{ area: 'heading', alignSelf: 'center' }}\n as={Text}\n forwardedAs={headingTag}\n variant='h2'\n >\n {heading} <Count>{count}</Count>\n </Grid>\n <Grid item={{ area: 'toggle', alignSelf: 'center' }}>\n <Button\n onClick={() => {\n setCollapsed(cur => !cur);\n }}\n label={t(collapsed ? 'expand' : 'collapse')}\n aria-expanded={collapsed ? 'false' : 'true'}\n variant='simple'\n icon\n >\n <Icon name='caret-right' />\n </Button>\n </Grid>\n <Grid item={{ area: 'dismiss', alignSelf: 'center' }}>\n {onDismiss && (\n <Button\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 )}\n </Grid>\n </Grid>\n <ExpandCollapse collapsed={collapsed}>\n <StyledBannerMessageList items={messagesToRender} />\n </ExpandCollapse>\n </StyledBannerContent>\n )}\n </Grid>\n );\n }\n);\n\nexport default Banner;\n"]}

package/lib/components/ComboBox/ComboBox.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ComboBox.d.ts","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EASlB,MAAM,OAAO,CAAC;AAKf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAqB3C,OAAO,aAAa,MAAM,kBAAkB,CAAC;;;;~~AAsT7C~~,wBAAyD"}
1	+ {"version":3,"file":"ComboBox.d.ts","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EASlB,MAAM,OAAO,CAAC;AAKf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAqB3C,OAAO,aAAa,MAAM,kBAAkB,CAAC;;;;AAwT7C,wBAAyD"}

package/lib/components/ComboBox/ComboBox.js CHANGED Viewed

@@ -144,9 +144,9 @@ const ComboBox = forwardRef((props, ref) => {
                     toggleSelectedDescendantsActive(true);
                 }, onSelectedBlur: () => {
                     toggleSelectedDescendantsActive(false);
-                }, ...restProps }), _jsx(Popover, { show: open && menu !== undefined, target: containerRef.current, placement: 'bottom-start', modifiers: [sameWidth],
+                }, ...restProps }), _jsx(Popover, { show: open && menu !== undefined, target: containerRef.current, placement: 'bottom-start', portal: false, modifiers: [sameWidth],
                 // FIXME: Removed absolute strategy for mobile to avoid overflow issues.
-                strategy: 'fixed', onMouseDown: (e) => e.preventDefault(), children: menu && (_jsx(Menu, { ref: menuRef, listId: listId, id: menuComponentId, role: 'listbox', mode: mode, ...menu, items: menu.items, focusControlEl: inputRef.current || undefined, onItemClick: (itemId, e) => {
+                strategy: 'fixed', onMouseDown: (e) => e.preventDefault(), hideOnTargetHidden: true, children: menu && (_jsx(Menu, { ref: menuRef, listId: listId, id: menuComponentId, role: 'listbox', mode: mode, ...menu, items: menu.items, focusControlEl: inputRef.current || undefined, onItemClick: (itemId, e) => {
                         if (mode === 'single-select') {
                             setOpen(false);
                             toggleMenuDescendantsActive(true);

package/lib/components/ComboBox/ComboBox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ComboBox.js","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n KeyboardEvent as ReactKeyboardEvent,\n PropsWithoutRef,\n Ref,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState\n} from 'react';\n\nimport Icon, { registerIcon } from '../Icon';\nimport * as caretDownIcon from '../Icon/icons/caret-down.icon';\nimport * as caretUpIcon from '../Icon/icons/caret-up.icon';\nimport { ForwardProps } from '../../types';\nimport {\n useConsolidatedRef,\n useFocusWithin,\n useI18n,\n useUID,\n useElement,\n useDirection,\n useTestIds\n} from '../../hooks';\nimport Popover from '../Popover';\nimport FormField from '../FormField';\nimport { StyledFormControl } from '../FormControl';\nimport Menu, { MenuProps } from '../Menu';\nimport Button from '../Button';\nimport { navigatorIsAvailable, withTestIds } from '../../utils';\nimport menuHelpers from '../Menu/helpers';\nimport { sameWidth } from '../Popover/modifiers';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\n\nimport ComboBoxInput from './ComboBoxInput';\nimport ComboBoxProps from './ComboBox.types';\nimport { StyledComboBox } from './ComboBox.styles';\nimport { getComboBoxTestIds } from './ComboxBox.test-ids';\n\nregisterIcon(caretDownIcon, caretUpIcon);\n\nconst isMobile = navigatorIsAvailable && navigator.userAgent.includes('Mobile');\n\nconst ComboBox: FunctionComponent<ComboBoxProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<ComboBoxProps>, ref: Ref<HTMLDivElement>) => {\n const uid = useUID();\n const {\n testId,\n additionalInfo,\n value,\n required,\n id = uid,\n label,\n labelHidden,\n info,\n status,\n readOnly,\n disabled,\n mode = 'single-select',\n selected,\n onChange,\n actions,\n onFocus,\n onBlur,\n onResolveSuggestion,\n onDropdownButtonClick: onDropdownButtonClickProp,\n onClick,\n onKeyDown,\n menu,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getComboBoxTestIds);\n\n const [pauseMenuDescendantEvaluation, setPauseMenuDescendantEvaluation] = useState(true);\n const [pauseSelectedDescendantEvaluation, setPauseSelectedDescendantEvaluation] =\n useState(false);\n const t = useI18n();\n const listId = `${id}-list`;\n const inputRef = useRef<HTMLInputElement>(null);\n const [open, setOpen] = useState(false);\n const menuRef: MenuProps['ref'] = useRef(null);\n const menuComponentId = `${id}-listbox`;\n const { start } = useDirection();\n\n // Force a re-render to make sure useFocusWithin has valid elements to set listeners on.\n const [, setContainerEl] = useElement();\n const containerRef = useConsolidatedRef<HTMLDivElement>(ref, setContainerEl);\n\n const toggleMenuDescendantsActive = useCallback((bool: boolean) => {\n setPauseMenuDescendantEvaluation(!bool);\n setPauseSelectedDescendantEvaluation(bool);\n }, []);\n\n const toggleSelectedDescendantsActive = useCallback((bool: boolean) => {\n setPauseSelectedDescendantEvaluation(!bool);\n setPauseMenuDescendantEvaluation(bool);\n }, []);\n\n const focus = useFocusWithin([containerRef], focused => {\n if (!focused) {\n setOpen(false);\n toggleMenuDescendantsActive(false);\n onBlur?.(selected?.items);\n } else {\n onFocus?.(selected?.items);\n if (isMobile) {\n setTimeout(() => {\n containerRef.current?.scrollIntoView({ behavior: 'smooth', block: 'start' });\n }, 150); // delay it to let keyboard expand first\n }\n }\n });\n\n const onInputKeyDown = useCallback(\n (e: ReactKeyboardEvent<HTMLInputElement>) => {\n if (!menu \|\| readOnly) return;\n if (onKeyDown?.(e) === false) {\n return;\n }\n\n switch (e.key) {\n case 'ArrowUp':\n if (e.altKey) {\n e.preventDefault();\n if (open) {\n setOpen(false);\n toggleMenuDescendantsActive(false);\n }\n }\n break;\n case 'ArrowDown':\n e.preventDefault();\n if (!open) {\n setOpen(true);\n toggleMenuDescendantsActive(true);\n }\n break;\n case 'Escape':\n case 'Tab':\n if (e.key === 'Escape') {\n e.preventDefault();\n if (open) e.stopPropagation();\n }\n setOpen(false);\n toggleMenuDescendantsActive(false);\n break;\n default:\n }\n },\n [open, readOnly, menu, value, onKeyDown]\n );\n\n const onDropdownButtonClick = useCallback(() => {\n onDropdownButtonClickProp?.(!open);\n setOpen(!open);\n }, [open, onDropdownButtonClickProp]);\n\n const dropdownButton = useMemo(() => {\n return (menu?.items?.length \|\| onDropdownButtonClickProp \|\| !onChange) && !readOnly ? (\n <Button\n aria-label={t(\n open ? 'combobox_close_list_button_a11y' : 'combobox_open_list_button_a11y'\n )}\n icon\n variant='simple'\n onClick={onDropdownButtonClick}\n onMouseDown={(e: MouseEvent) => {\n e.preventDefault();\n inputRef.current?.focus();\n }}\n disabled={disabled}\n tabIndex='-1'\n >\n <Icon name={open ? 'caret-up' : 'caret-down'} />\n </Button>\n ) : null;\n }, [onDropdownButtonClick, onChange, readOnly, open, disabled]);\n\n const ariaDescribedBy = useMemo(() => {\n let idString = `${id}-inputDescription`;\n\n if (info) {\n idString = idString.concat(` ${id}-info`);\n }\n if (onChange) {\n idString = idString.concat(` ${id}-searchDescription`);\n }\n if (mode === 'multi-select') {\n idString = idString.concat(` ${id}-multiselectDescription`);\n }\n\n return idString;\n }, [info, id, mode, onChange]);\n\n const onInputClick = useCallback(\n (e: MouseEvent) => {\n if (readOnly) return;\n setOpen(true);\n toggleMenuDescendantsActive(true);\n onClick?.(e);\n },\n [readOnly, onClick]\n );\n\n useEffect(() => {\n if (focus && menu && value && value.length > 0) {\n setOpen(true);\n toggleMenuDescendantsActive(true);\n }\n }, [menu, value, focus]);\n\n // Workaround for the following error from jsx-ast-utils, fixed in version 3.5.0.\n // The prop value with an expression type of JSXFragment could not be resolved. Please file issue to get this fixed immediately.\n const inputActions = (\n <>\n {dropdownButton}\n {actions}\n </>\n );\n\n const Comp = (\n <StyledComboBox\n ref={containerRef}\n as={StyledFormControl}\n id={`${id}-combobox`}\n role='combobox'\n aria-haspopup='listbox'\n aria-expanded={!readOnly && !disabled && open}\n aria-owns={\n open && menu !== undefined && !pauseMenuDescendantEvaluation ? listId : undefined\n }\n >\n <ComboBoxInput\n data-testid={testIds.control}\n ref={inputRef}\n role='searchbox'\n aria-autocomplete='list'\n aria-controls={\n open && menu !== undefined && !pauseMenuDescendantEvaluation ? listId : undefined\n }\n aria-describedby={ariaDescribedBy}\n selected={selected?.items}\n spellCheck={false}\n {...{\n id,\n readOnly,\n disabled,\n onChange,\n value,\n mode,\n status\n }}\n actions={inputActions}\n onRemove={selected?.onRemove}\n onClick={onInputClick}\n onKeyDown={onInputKeyDown}\n required={required}\n pauseDescendantEvaluation={pauseSelectedDescendantEvaluation}\n onSelectedFocus={() => {\n toggleSelectedDescendantsActive(true);\n }}\n onSelectedBlur={() => {\n toggleSelectedDescendantsActive(false);\n }}\n {...restProps}\n />\n\n <Popover\n show={open && menu !== undefined}\n target={containerRef.current}\n placement='bottom-start'\n modifiers={[sameWidth]}\n // FIXME: Removed absolute strategy for mobile to avoid overflow issues.\n strategy='fixed'\n onMouseDown={(e: MouseEvent) => e.preventDefault()}\n >\n {menu && (\n <Menu\n ref={menuRef}\n listId={listId}\n id={menuComponentId}\n role='listbox'\n mode={mode}\n {...menu}\n items={menu.items}\n focusControlEl={inputRef.current \|\| undefined}\n onItemClick={(itemId, e) => {\n if (mode === 'single-select') {\n setOpen(false);\n toggleMenuDescendantsActive(true);\n }\n menu.onItemClick?.(itemId, e);\n\n const clickedItem = menuHelpers.getItem(menu.items, itemId);\n\n if (clickedItem?.primary && !clickedItem?.selected) {\n selected?.onNew?.(clickedItem?.primary);\n }\n }}\n aria-label={t('menu_option_list')}\n pauseDescendantEvaluation={pauseMenuDescendantEvaluation}\n arrowNavigationUnsupported\n />\n )}\n </Popover>\n </StyledComboBox>\n );\n\n return (\n <>\n {label ? (\n <FormField\n {...{\n testId: testIds,\n label,\n labelHidden,\n id,\n info,\n status,\n required,\n disabled,\n onResolveSuggestion,\n additionalInfo\n }}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n )}\n <VisuallyHiddenText id={`${id}-inputDescription`} aria-hidden>\n {`${t('combobox_open_close')} `}\n </VisuallyHiddenText>\n <VisuallyHiddenText id={`${id}-searchDescription`} aria-hidden>\n {t('combobox_search_instructions')}\n </VisuallyHiddenText>\n <VisuallyHiddenText id={`${id}-multiselectDescription`} aria-hidden>\n {t('multiselect_instructions', [start])}\n </VisuallyHiddenText>\n </>\n );\n }\n);\n\nexport default withTestIds(ComboBox, getComboBoxTestIds);\n"]}
1	+ {"version":3,"file":"ComboBox.js","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n KeyboardEvent as ReactKeyboardEvent,\n PropsWithoutRef,\n Ref,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState\n} from 'react';\n\nimport Icon, { registerIcon } from '../Icon';\nimport * as caretDownIcon from '../Icon/icons/caret-down.icon';\nimport * as caretUpIcon from '../Icon/icons/caret-up.icon';\nimport { ForwardProps } from '../../types';\nimport {\n useConsolidatedRef,\n useFocusWithin,\n useI18n,\n useUID,\n useElement,\n useDirection,\n useTestIds\n} from '../../hooks';\nimport Popover from '../Popover';\nimport FormField from '../FormField';\nimport { StyledFormControl } from '../FormControl';\nimport Menu, { MenuProps } from '../Menu';\nimport Button from '../Button';\nimport { navigatorIsAvailable, withTestIds } from '../../utils';\nimport menuHelpers from '../Menu/helpers';\nimport { sameWidth } from '../Popover/modifiers';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\n\nimport ComboBoxInput from './ComboBoxInput';\nimport ComboBoxProps from './ComboBox.types';\nimport { StyledComboBox } from './ComboBox.styles';\nimport { getComboBoxTestIds } from './ComboxBox.test-ids';\n\nregisterIcon(caretDownIcon, caretUpIcon);\n\nconst isMobile = navigatorIsAvailable && navigator.userAgent.includes('Mobile');\n\nconst ComboBox: FunctionComponent<ComboBoxProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<ComboBoxProps>, ref: Ref<HTMLDivElement>) => {\n const uid = useUID();\n const {\n testId,\n additionalInfo,\n value,\n required,\n id = uid,\n label,\n labelHidden,\n info,\n status,\n readOnly,\n disabled,\n mode = 'single-select',\n selected,\n onChange,\n actions,\n onFocus,\n onBlur,\n onResolveSuggestion,\n onDropdownButtonClick: onDropdownButtonClickProp,\n onClick,\n onKeyDown,\n menu,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getComboBoxTestIds);\n\n const [pauseMenuDescendantEvaluation, setPauseMenuDescendantEvaluation] = useState(true);\n const [pauseSelectedDescendantEvaluation, setPauseSelectedDescendantEvaluation] =\n useState(false);\n const t = useI18n();\n const listId = `${id}-list`;\n const inputRef = useRef<HTMLInputElement>(null);\n const [open, setOpen] = useState(false);\n const menuRef: MenuProps['ref'] = useRef(null);\n const menuComponentId = `${id}-listbox`;\n const { start } = useDirection();\n\n // Force a re-render to make sure useFocusWithin has valid elements to set listeners on.\n const [, setContainerEl] = useElement();\n const containerRef = useConsolidatedRef<HTMLDivElement>(ref, setContainerEl);\n\n const toggleMenuDescendantsActive = useCallback((bool: boolean) => {\n setPauseMenuDescendantEvaluation(!bool);\n setPauseSelectedDescendantEvaluation(bool);\n }, []);\n\n const toggleSelectedDescendantsActive = useCallback((bool: boolean) => {\n setPauseSelectedDescendantEvaluation(!bool);\n setPauseMenuDescendantEvaluation(bool);\n }, []);\n\n const focus = useFocusWithin([containerRef], focused => {\n if (!focused) {\n setOpen(false);\n toggleMenuDescendantsActive(false);\n onBlur?.(selected?.items);\n } else {\n onFocus?.(selected?.items);\n if (isMobile) {\n setTimeout(() => {\n containerRef.current?.scrollIntoView({ behavior: 'smooth', block: 'start' });\n }, 150); // delay it to let keyboard expand first\n }\n }\n });\n\n const onInputKeyDown = useCallback(\n (e: ReactKeyboardEvent<HTMLInputElement>) => {\n if (!menu \|\| readOnly) return;\n if (onKeyDown?.(e) === false) {\n return;\n }\n\n switch (e.key) {\n case 'ArrowUp':\n if (e.altKey) {\n e.preventDefault();\n if (open) {\n setOpen(false);\n toggleMenuDescendantsActive(false);\n }\n }\n break;\n case 'ArrowDown':\n e.preventDefault();\n if (!open) {\n setOpen(true);\n toggleMenuDescendantsActive(true);\n }\n break;\n case 'Escape':\n case 'Tab':\n if (e.key === 'Escape') {\n e.preventDefault();\n if (open) e.stopPropagation();\n }\n setOpen(false);\n toggleMenuDescendantsActive(false);\n break;\n default:\n }\n },\n [open, readOnly, menu, value, onKeyDown]\n );\n\n const onDropdownButtonClick = useCallback(() => {\n onDropdownButtonClickProp?.(!open);\n setOpen(!open);\n }, [open, onDropdownButtonClickProp]);\n\n const dropdownButton = useMemo(() => {\n return (menu?.items?.length \|\| onDropdownButtonClickProp \|\| !onChange) && !readOnly ? (\n <Button\n aria-label={t(\n open ? 'combobox_close_list_button_a11y' : 'combobox_open_list_button_a11y'\n )}\n icon\n variant='simple'\n onClick={onDropdownButtonClick}\n onMouseDown={(e: MouseEvent) => {\n e.preventDefault();\n inputRef.current?.focus();\n }}\n disabled={disabled}\n tabIndex='-1'\n >\n <Icon name={open ? 'caret-up' : 'caret-down'} />\n </Button>\n ) : null;\n }, [onDropdownButtonClick, onChange, readOnly, open, disabled]);\n\n const ariaDescribedBy = useMemo(() => {\n let idString = `${id}-inputDescription`;\n\n if (info) {\n idString = idString.concat(` ${id}-info`);\n }\n if (onChange) {\n idString = idString.concat(` ${id}-searchDescription`);\n }\n if (mode === 'multi-select') {\n idString = idString.concat(` ${id}-multiselectDescription`);\n }\n\n return idString;\n }, [info, id, mode, onChange]);\n\n const onInputClick = useCallback(\n (e: MouseEvent) => {\n if (readOnly) return;\n setOpen(true);\n toggleMenuDescendantsActive(true);\n onClick?.(e);\n },\n [readOnly, onClick]\n );\n\n useEffect(() => {\n if (focus && menu && value && value.length > 0) {\n setOpen(true);\n toggleMenuDescendantsActive(true);\n }\n }, [menu, value, focus]);\n\n // Workaround for the following error from jsx-ast-utils, fixed in version 3.5.0.\n // The prop value with an expression type of JSXFragment could not be resolved. Please file issue to get this fixed immediately.\n const inputActions = (\n <>\n {dropdownButton}\n {actions}\n </>\n );\n\n const Comp = (\n <StyledComboBox\n ref={containerRef}\n as={StyledFormControl}\n id={`${id}-combobox`}\n role='combobox'\n aria-haspopup='listbox'\n aria-expanded={!readOnly && !disabled && open}\n aria-owns={\n open && menu !== undefined && !pauseMenuDescendantEvaluation ? listId : undefined\n }\n >\n <ComboBoxInput\n data-testid={testIds.control}\n ref={inputRef}\n role='searchbox'\n aria-autocomplete='list'\n aria-controls={\n open && menu !== undefined && !pauseMenuDescendantEvaluation ? listId : undefined\n }\n aria-describedby={ariaDescribedBy}\n selected={selected?.items}\n spellCheck={false}\n {...{\n id,\n readOnly,\n disabled,\n onChange,\n value,\n mode,\n status\n }}\n actions={inputActions}\n onRemove={selected?.onRemove}\n onClick={onInputClick}\n onKeyDown={onInputKeyDown}\n required={required}\n pauseDescendantEvaluation={pauseSelectedDescendantEvaluation}\n onSelectedFocus={() => {\n toggleSelectedDescendantsActive(true);\n }}\n onSelectedBlur={() => {\n toggleSelectedDescendantsActive(false);\n }}\n {...restProps}\n />\n\n <Popover\n show={open && menu !== undefined}\n target={containerRef.current}\n placement='bottom-start'\n portal={false}\n modifiers={[sameWidth]}\n // FIXME: Removed absolute strategy for mobile to avoid overflow issues.\n strategy='fixed'\n onMouseDown={(e: MouseEvent) => e.preventDefault()}\n hideOnTargetHidden\n >\n {menu && (\n <Menu\n ref={menuRef}\n listId={listId}\n id={menuComponentId}\n role='listbox'\n mode={mode}\n {...menu}\n items={menu.items}\n focusControlEl={inputRef.current \|\| undefined}\n onItemClick={(itemId, e) => {\n if (mode === 'single-select') {\n setOpen(false);\n toggleMenuDescendantsActive(true);\n }\n menu.onItemClick?.(itemId, e);\n\n const clickedItem = menuHelpers.getItem(menu.items, itemId);\n\n if (clickedItem?.primary && !clickedItem?.selected) {\n selected?.onNew?.(clickedItem?.primary);\n }\n }}\n aria-label={t('menu_option_list')}\n pauseDescendantEvaluation={pauseMenuDescendantEvaluation}\n arrowNavigationUnsupported\n />\n )}\n </Popover>\n </StyledComboBox>\n );\n\n return (\n <>\n {label ? (\n <FormField\n {...{\n testId: testIds,\n label,\n labelHidden,\n id,\n info,\n status,\n required,\n disabled,\n onResolveSuggestion,\n additionalInfo\n }}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n )}\n <VisuallyHiddenText id={`${id}-inputDescription`} aria-hidden>\n {`${t('combobox_open_close')} `}\n </VisuallyHiddenText>\n <VisuallyHiddenText id={`${id}-searchDescription`} aria-hidden>\n {t('combobox_search_instructions')}\n </VisuallyHiddenText>\n <VisuallyHiddenText id={`${id}-multiselectDescription`} aria-hidden>\n {t('multiselect_instructions', [start])}\n </VisuallyHiddenText>\n </>\n );\n }\n);\n\nexport default withTestIds(ComboBox, getComboBoxTestIds);\n"]}

package/lib/components/Dialog/Dialog.styles.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Dialog.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.styles.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,kBAAkB,yGAAe,CAAC;AAE/C,eAAO,MAAM,kBAAkB,yGAAe,CAAC;AAE/C,eAAO,MAAM,mBAAmB,~~yGAe9B~~,CAAC;AAIH,eAAO,MAAM,kBAAkB,yGAAe,CAAC;AAE/C,eAAO,MAAM,YAAY,8TAcvB,CAAC"}
1	+ {"version":3,"file":"Dialog.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.styles.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,kBAAkB,yGAAe,CAAC;AAE/C,eAAO,MAAM,kBAAkB,yGAAe,CAAC;AAE/C,eAAO,MAAM,mBAAmB,yGAgB9B,CAAC;AAIH,eAAO,MAAM,kBAAkB,yGAAe,CAAC;AAE/C,eAAO,MAAM,YAAY,8TAcvB,CAAC"}

package/lib/components/Dialog/Dialog.styles.js CHANGED Viewed

@@ -7,6 +7,7 @@ export const StyledDialogContent = styled.div(({ theme }) => {
     return css `
     position: relative;
     overflow: auto;
+    min-height: 4rem;
     padding: calc(2 * ${theme.base.spacing});
     /* Small amount of block padding accounts for focus ring clipping within overflow auto. */
@@ -30,8 +31,8 @@ export const StyledDialog = styled(Popover)(({ theme }) => {
     max-height: calc(100vh - 2rem);
     &[aria-busy='true'] {
-      ${StyledChildrenWrap} {
-        visibility: hidden;
+      ${StyledDialogContent} {
+        overflow: hidden;
       }
     }
   `;

package/lib/components/Dialog/Dialog.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Dialog.styles.js","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,OAAO,MAAM,YAAY,CAAC;AAEjC,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAA,EAAE,CAAC;AAE/C,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAA,EAAE,CAAC;AAE/C,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC1D,OAAO,GAAG,CAAA~~;;;wBAGY~~,KAAK,CAAC,IAAI,CAAC,OAAO;;;MAGpC,kBAAkB;wCACgB,KAAK,CAAC,IAAI,CAAC,OAAO;;;;sCAIpB,KAAK,CAAC,IAAI,CAAC,OAAO;;GAErD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAA,EAAE,CAAC;AAE/C,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACxD,OAAO,GAAG,CAAA;;;qBAGS,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;qBAC9B,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;;;;QAI3C,~~kBAAkB~~;;;;~~GAIvB~~,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,YAAY,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport Popover from '../Popover';\n\nexport const StyledChildrenWrap = styled.div``;\n\nexport const StyledDialogHeader = styled.div``;\n\nexport const StyledDialogContent = styled.div(({ theme }) => {\n return css`\n position: relative;\n overflow: auto;\n padding: calc(2 * ${theme.base.spacing});\n\n /* Small amount of block padding accounts for focus ring clipping within overflow auto. /\n ${StyledDialogHeader} + & {\n padding-block-start: calc(0.5 ${theme.base.spacing});\n }\n\n &:not(:last-child) {\n padding-block-end: calc(0.5 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledDialogContent.defaultProps = defaultThemeProp;\n\nexport const StyledDialogFooter = styled.div``;\n\nexport const StyledDialog = styled(Popover)(({ theme }) => {\n return css`\n display: flex;\n flex-direction: column;\n min-width: min(${theme.base['content-width'].sm}, calc(100vw - 2rem));\n max-width: min(${theme.base['content-width'].lg}, calc(100vw - 2rem));\n max-height: calc(100vh - 2rem);\n\n &[aria-busy='true'] {\n ${~~StyledChildrenWrap~~} {\n ~~visibility~~: hidden;\n }\n }\n `;\n});\n\nStyledDialog.defaultProps = defaultThemeProp;\n"]}
1	+ {"version":3,"file":"Dialog.styles.js","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,OAAO,MAAM,YAAY,CAAC;AAEjC,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAA,EAAE,CAAC;AAE/C,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAA,EAAE,CAAC;AAE/C,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC1D,OAAO,GAAG,CAAA;;;;wBAIY,KAAK,CAAC,IAAI,CAAC,OAAO;;;MAGpC,kBAAkB;wCACgB,KAAK,CAAC,IAAI,CAAC,OAAO;;;;sCAIpB,KAAK,CAAC,IAAI,CAAC,OAAO;;GAErD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAA,EAAE,CAAC;AAE/C,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACxD,OAAO,GAAG,CAAA;;;qBAGS,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;qBAC9B,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;;;;QAI3C,mBAAmB;;;;GAIxB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,YAAY,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport Popover from '../Popover';\n\nexport const StyledChildrenWrap = styled.div``;\n\nexport const StyledDialogHeader = styled.div``;\n\nexport const StyledDialogContent = styled.div(({ theme }) => {\n return css`\n position: relative;\n overflow: auto;\n min-height: 4rem;\n padding: calc(2 * ${theme.base.spacing});\n\n /* Small amount of block padding accounts for focus ring clipping within overflow auto. /\n ${StyledDialogHeader} + & {\n padding-block-start: calc(0.5 ${theme.base.spacing});\n }\n\n &:not(:last-child) {\n padding-block-end: calc(0.5 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledDialogContent.defaultProps = defaultThemeProp;\n\nexport const StyledDialogFooter = styled.div``;\n\nexport const StyledDialog = styled(Popover)(({ theme }) => {\n return css`\n display: flex;\n flex-direction: column;\n min-width: min(${theme.base['content-width'].sm}, calc(100vw - 2rem));\n max-width: min(${theme.base['content-width'].lg}, calc(100vw - 2rem));\n max-height: calc(100vh - 2rem);\n\n &[aria-busy='true'] {\n ${StyledDialogContent} {\n overflow: hidden;\n }\n }\n `;\n});\n\nStyledDialog.defaultProps = defaultThemeProp;\n"]}

package/lib/components/Dialog/FormDialog.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormDialog.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/FormDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuC,EAAE,EAAa,cAAc,EAAE,MAAM,OAAO,CAAC;AAe3F,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AASzC,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAGjD,eAAO,MAAM,gBAAgB;;;yFAAmB,CAAC;AAEjD,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,GAAG,UAAU,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,~~CAmH1F~~,CAAC;AAEJ,eAAe,UAAU,CAAC"}
1	+ {"version":3,"file":"FormDialog.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/FormDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuC,EAAE,EAAa,cAAc,EAAE,MAAM,OAAO,CAAC;AAe3F,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AASzC,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAGjD,eAAO,MAAM,gBAAgB;;;yFAAmB,CAAC;AAEjD,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,GAAG,UAAU,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,CAqI1F,CAAC;AAEJ,eAAe,UAAU,CAAC"}

package/lib/components/Dialog/FormDialog.js CHANGED Viewed

@@ -14,7 +14,19 @@ const FormDialog = forwardRef(({ arrow = true, target, heading, ariaLabel, child
     const t = useI18n();
     const headingId = useUID();
     const dialogRef = useConsolidatedRef(ref);
+    const dialogContentRef = useRef(null);
     const cancelButtonRef = useRef(null);
+    const setFocus = () => {
+        if (progress)
+            return;
+        const focusables = getFocusables(dialogRef);
+        const focusable = focusables.find(el => {
+            return dialogContentRef.current?.contains(el);
+        }) ??
+            cancelButtonRef.current ??
+            focusables[0];
+        focusable?.focus();
+    };
     const onCancelHandler = typeof onCancel === 'function' ? onCancel : onCancel.handler;
     useEscape(() => {
         if (onDismiss) {
@@ -35,9 +47,7 @@ const FormDialog = forwardRef(({ arrow = true, target, heading, ariaLabel, child
     useFocusTrap(dialogRef);
     useEffect(() => {
         if (!progress) {
-            const focusables = getFocusables(dialogRef);
-            if (focusables[0])
-                focusables[0].focus();
+            setFocus();
         }
     }, [progress]);
     useEffect(() => {
@@ -47,7 +57,7 @@ const FormDialog = forwardRef(({ arrow = true, target, heading, ariaLabel, child
             }
         };
     }, []);
-    return (_jsxs(StyledFormDialog, { ...restProps, ...(heading === undefined ? { ariaLabel } : { labelledbyId: headingId }), arrow: arrow, target: target, progress: progress, ref: dialogRef, children: [heading !== undefined && (_jsx(Flex, { container: { alignItems: 'center', justify: 'between', pad: 2 }, item: { shrink: 0 }, as: StyledDialogHeader, children: _jsx(Text, { id: headingId, variant: 'h2', children: heading }) })), _jsxs(Flex, { item: { grow: 1 }, as: StyledDialogContent, children: [children && _jsx(StyledChildrenWrap, { children: children }), _jsx(Progress, { visible: !!progress, focusOnVisible: true, placement: children ? 'local' : 'block', message: typeof progress === 'string' ? progress : undefined })] }), _jsxs(Flex, { container: { alignItems: 'center', justify: 'between', pad: 2 }, item: { shrink: 0 }, as: StyledDialogFooter, children: [_jsx(Button, { onClick: () => {
+    return (_jsxs(StyledFormDialog, { ...restProps, ...(heading === undefined ? { ariaLabel } : { labelledbyId: headingId }), arrow: arrow, target: target, progress: progress, ref: dialogRef, children: [heading !== undefined && (_jsx(Flex, { container: { alignItems: 'center', justify: 'between', pad: 2 }, item: { shrink: 0 }, as: StyledDialogHeader, children: _jsx(Text, { id: headingId, variant: 'h2', children: heading }) })), _jsxs(Flex, { item: { grow: 1 }, as: StyledDialogContent, ref: dialogContentRef, children: [children && (_jsx(StyledChildrenWrap, { inert: progress ? '' : undefined, children: children })), _jsx(Progress, { visible: !!progress, focusOnVisible: true, placement: 'local', message: typeof progress === 'string' ? progress : undefined })] }), _jsxs(Flex, { container: { alignItems: 'center', justify: 'between', pad: 2 }, item: { shrink: 0 }, as: StyledDialogFooter, children: [_jsx(Button, { onClick: () => {
                             onCancelHandler();
                         }, disabled: typeof onCancel !== 'function' ? onCancel.disabled : undefined, ref: cancelButtonRef, children: typeof onCancel !== 'function' && onCancel.text ? onCancel.text : t('cancel') }), _jsx(Button, { variant: 'primary', onClick: () => {
                             (typeof onSubmit !== 'function' ? onSubmit.handler : onSubmit)();

package/lib/components/Dialog/FormDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/FormDialog.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAmB,MAAM,EAAM,SAAS,EAAkB,MAAM,OAAO,CAAC;AAC3F,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EACL,kBAAkB,EAClB,SAAS,EACT,YAAY,EACZ,OAAO,EACP,aAAa,EACb,MAAM,EACP,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,QAAQ,MAAM,aAAa,CAAC;AAEnC,OAAO,IAAI,MAAM,SAAS,CAAC;AAE3B,OAAO,EACL,kBAAkB,EAClB,mBAAmB,EACnB,kBAAkB,EAClB,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AAEzB,OAAO,MAAM,MAAM,UAAU,CAAC;AAE9B,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAA,EAAE,CAAC;AAEjD,MAAM,UAAU,GACd,UAAU,CACR,CACE,EACE,KAAK,GAAG,IAAI,EACZ,MAAM,EACN,OAAO,EACP,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,GAAG,SAAS,EACqB,EACnC,GAA2B,EAC3B,EAAE;IACF,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,SAAS,GAAG,MAAM,EAAE,CAAC;IAC3B,MAAM,SAAS,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAC1C,MAAM,eAAe,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;~~IACxD~~,MAAM,eAAe,GAAG,OAAO,QAAQ,KAAK,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC;IAErF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,SAAS,EAAE;YACb,SAAS,EAAE,CAAC;SACb;aAAM;YACL,eAAe,EAAE,CAAC;SACnB;IACH,CAAC,CAAC,CAAC;IAEH,aAAa,CAAC,WAAW,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,EAAE,GAAG,EAAE;QACnD,IAAI,SAAS,EAAE;YACb,SAAS,EAAE,CAAC;SACb;aAAM;YACL,eAAe,EAAE,CAAC;SACnB;IACH,CAAC,CAAC,CAAC;IAEH,YAAY,CAAC,SAAS,CAAC,CAAC;IAExB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,QAAQ,EAAE;YACb,~~MAAM~~,~~UAAU,GAAG,aAAa,CAAC,SAAS,CAAC,CAAC;YAC5C,IAAI,UAAU,CAAC,CAAC,CAAC;gBAAE,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,~~EAAE,CAAC;~~SAC1C~~;IACH,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,GAAG,EAAE;YACV,IAAI,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;gBAC7B,MAAM,CAAC,KAAK,EAAE,CAAC;aAChB;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,MAAC,gBAAgB,OACX,SAAS,KACT,CAAC,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,YAAY,EAAE,SAAS,EAAE,CAAC,EACzE,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAE,SAAS,aAEb,OAAO,KAAK,SAAS,IAAI,CACxB,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC,EAAE,EAC/D,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,EACnB,EAAE,EAAE,kBAAkB,YAEtB,KAAC,IAAI,IAAC,EAAE,EAAE,SAAS,EAAE,OAAO,EAAC,IAAI,YAC9B,OAAO,GACH,GACF,CACR,EAED,MAAC,IAAI,IAAC,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,mBAAmB,~~aAC7C~~,QAAQ,IAAI,KAAC,kBAAkB,~~cAAE~~,QAAQ,GAAsB,~~EAChE~~,KAAC,QAAQ,IACP,OAAO,EAAE,CAAC,CAAC,QAAQ,EACnB,cAAc,QACd,SAAS,~~EAAE~~,~~QAAQ,CAAC,CAAC,CAAC,~~OAAO,~~CAAC~~,~~CAAC,CAAC,~~OAAO,~~EACvC,OAAO,~~EAAE,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,GAC5D,IACG,EAEP,MAAC,IAAI,IACH,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC,EAAE,EAC/D,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,EACnB,EAAE,EAAE,kBAAkB,aAEtB,KAAC,MAAM,IACL,OAAO,EAAE,GAAG,EAAE;4BACZ,eAAe,EAAE,CAAC;wBACpB,CAAC,EACD,QAAQ,EAAE,OAAO,QAAQ,KAAK,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EACxE,GAAG,EAAE,eAAe,YAEnB,OAAO,QAAQ,KAAK,UAAU,IAAI,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,GACvE,EAET,KAAC,MAAM,IACL,OAAO,EAAC,SAAS,EACjB,OAAO,EAAE,GAAG,EAAE;4BACZ,CAAC,OAAO,QAAQ,KAAK,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC;wBACnE,CAAC,EACD,QAAQ,EAAE,OAAO,QAAQ,KAAK,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,YAEvE,OAAO,QAAQ,KAAK,UAAU,IAAI,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,GACvE,IACJ,IACU,CACpB,CAAC;AACJ,CAAC,CACF,CAAC;AAEJ,eAAe,UAAU,CAAC","sourcesContent":["import { forwardRef, PropsWithoutRef, useRef, FC, useEffect, HTMLAttributes } from 'react';\nimport styled from 'styled-components';\n\nimport {\n useConsolidatedRef,\n useEscape,\n useFocusTrap,\n useI18n,\n useOuterEvent,\n useUID\n} from '../../hooks';\nimport { getFocusables } from '../../utils';\nimport Button from '../Button';\nimport Text from '../Text';\nimport Progress from '../Progress';\nimport { OmitStrict } from '../../types';\nimport Flex from '../Flex';\n\nimport {\n StyledChildrenWrap,\n StyledDialogContent,\n StyledDialogFooter,\n StyledDialogHeader\n} from './Dialog.styles';\nimport { FormDialogProps } from './Dialog.types';\nimport Dialog from './Dialog';\n\nexport const StyledFormDialog = styled(Dialog)``;\n\nconst FormDialog: FC<FormDialogProps & OmitStrict<HTMLAttributes<HTMLDivElement>, 'onSubmit'>> =\n forwardRef(\n (\n {\n arrow = true,\n target,\n heading,\n ariaLabel,\n children,\n progress,\n onDismiss,\n onCancel,\n onSubmit,\n ...restProps\n }: PropsWithoutRef<FormDialogProps>,\n ref: FormDialogProps['ref']\n ) => {\n const t = useI18n();\n const headingId = useUID();\n const dialogRef = useConsolidatedRef(ref);\n const cancelButtonRef = useRef<HTMLButtonElement>(null);\n const onCancelHandler = typeof onCancel === 'function' ? onCancel : onCancel.handler;\n\n useEscape(() => {\n if (onDismiss) {\n onDismiss();\n } else {\n onCancelHandler();\n }\n });\n\n useOuterEvent('mousedown', [target, dialogRef], () => {\n if (onDismiss) {\n onDismiss();\n } else {\n onCancelHandler();\n }\n });\n\n useFocusTrap(dialogRef);\n\n useEffect(() => {\n if (!progress) {\n ~~const focusables = getFocusables~~(~~dialogRef~~);\n ~~if (focusables[0]) focusables[0].focus();\n~~ }\n }, [progress]);\n\n useEffect(() => {\n return () => {\n if (document.contains(target)) {\n target.focus();\n }\n };\n }, []);\n\n return (\n <StyledFormDialog\n {...restProps}\n {...(heading === undefined ? { ariaLabel } : { labelledbyId: headingId })}\n arrow={arrow}\n target={target}\n progress={progress}\n ref={dialogRef}\n >\n {heading !== undefined && (\n <Flex\n container={{ alignItems: 'center', justify: 'between', pad: 2 }}\n item={{ shrink: 0 }}\n as={StyledDialogHeader}\n >\n <Text id={headingId} variant='h2'>\n {heading}\n </Text>\n </Flex>\n )}\n\n <Flex item={{ grow: 1 }} as={StyledDialogContent}>\n {children && <StyledChildrenWrap>{children}</StyledChildrenWrap>}\n <Progress\n visible={!!progress}\n focusOnVisible\n placement=~~{children ?~~ 'local' ~~: 'block'}~~\n message={typeof progress === 'string' ? progress : undefined}\n />\n </Flex>\n\n <Flex\n container={{ alignItems: 'center', justify: 'between', pad: 2 }}\n item={{ shrink: 0 }}\n as={StyledDialogFooter}\n >\n <Button\n onClick={() => {\n onCancelHandler();\n }}\n disabled={typeof onCancel !== 'function' ? onCancel.disabled : undefined}\n ref={cancelButtonRef}\n >\n {typeof onCancel !== 'function' && onCancel.text ? onCancel.text : t('cancel')}\n </Button>\n\n <Button\n variant='primary'\n onClick={() => {\n (typeof onSubmit !== 'function' ? onSubmit.handler : onSubmit)();\n }}\n disabled={typeof onSubmit !== 'function' ? onSubmit.disabled : undefined}\n >\n {typeof onSubmit !== 'function' && onSubmit.text ? onSubmit.text : t('submit')}\n </Button>\n </Flex>\n </StyledFormDialog>\n );\n }\n );\n\nexport default FormDialog;\n"]}
1	+ {"version":3,"file":"FormDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/FormDialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, PropsWithoutRef, useRef, FC, useEffect, HTMLAttributes } from 'react';\nimport styled from 'styled-components';\n\nimport {\n useConsolidatedRef,\n useEscape,\n useFocusTrap,\n useI18n,\n useOuterEvent,\n useUID\n} from '../../hooks';\nimport { getFocusables } from '../../utils';\nimport Button from '../Button';\nimport Text from '../Text';\nimport Progress from '../Progress';\nimport { OmitStrict } from '../../types';\nimport Flex from '../Flex';\n\nimport {\n StyledChildrenWrap,\n StyledDialogContent,\n StyledDialogFooter,\n StyledDialogHeader\n} from './Dialog.styles';\nimport { FormDialogProps } from './Dialog.types';\nimport Dialog from './Dialog';\n\nexport const StyledFormDialog = styled(Dialog)``;\n\nconst FormDialog: FC<FormDialogProps & OmitStrict<HTMLAttributes<HTMLDivElement>, 'onSubmit'>> =\n forwardRef(\n (\n {\n arrow = true,\n target,\n heading,\n ariaLabel,\n children,\n progress,\n onDismiss,\n onCancel,\n onSubmit,\n ...restProps\n }: PropsWithoutRef<FormDialogProps>,\n ref: FormDialogProps['ref']\n ) => {\n const t = useI18n();\n const headingId = useUID();\n const dialogRef = useConsolidatedRef(ref);\n const dialogContentRef = useRef<HTMLDivElement>(null);\n const cancelButtonRef = useRef<HTMLButtonElement>(null);\n\n const setFocus = () => {\n if (progress) return;\n\n const focusables = getFocusables(dialogRef);\n\n const focusable =\n focusables.find(el => {\n return dialogContentRef.current?.contains(el);\n }) ??\n cancelButtonRef.current ??\n focusables[0];\n\n focusable?.focus();\n };\n\n const onCancelHandler = typeof onCancel === 'function' ? onCancel : onCancel.handler;\n\n useEscape(() => {\n if (onDismiss) {\n onDismiss();\n } else {\n onCancelHandler();\n }\n });\n\n useOuterEvent('mousedown', [target, dialogRef], () => {\n if (onDismiss) {\n onDismiss();\n } else {\n onCancelHandler();\n }\n });\n\n useFocusTrap(dialogRef);\n\n useEffect(() => {\n if (!progress) {\n setFocus();\n }\n }, [progress]);\n\n useEffect(() => {\n return () => {\n if (document.contains(target)) {\n target.focus();\n }\n };\n }, []);\n\n return (\n <StyledFormDialog\n {...restProps}\n {...(heading === undefined ? { ariaLabel } : { labelledbyId: headingId })}\n arrow={arrow}\n target={target}\n progress={progress}\n ref={dialogRef}\n >\n {heading !== undefined && (\n <Flex\n container={{ alignItems: 'center', justify: 'between', pad: 2 }}\n item={{ shrink: 0 }}\n as={StyledDialogHeader}\n >\n <Text id={headingId} variant='h2'>\n {heading}\n </Text>\n </Flex>\n )}\n\n <Flex item={{ grow: 1 }} as={StyledDialogContent} ref={dialogContentRef}>\n {children && (\n <StyledChildrenWrap inert={progress ? '' : undefined}>{children}</StyledChildrenWrap>\n )}\n <Progress\n visible={!!progress}\n focusOnVisible\n placement='local'\n message={typeof progress === 'string' ? progress : undefined}\n />\n </Flex>\n\n <Flex\n container={{ alignItems: 'center', justify: 'between', pad: 2 }}\n item={{ shrink: 0 }}\n as={StyledDialogFooter}\n >\n <Button\n onClick={() => {\n onCancelHandler();\n }}\n disabled={typeof onCancel !== 'function' ? onCancel.disabled : undefined}\n ref={cancelButtonRef}\n >\n {typeof onCancel !== 'function' && onCancel.text ? onCancel.text : t('cancel')}\n </Button>\n\n <Button\n variant='primary'\n onClick={() => {\n (typeof onSubmit !== 'function' ? onSubmit.handler : onSubmit)();\n }}\n disabled={typeof onSubmit !== 'function' ? onSubmit.disabled : undefined}\n >\n {typeof onSubmit !== 'function' && onSubmit.text ? onSubmit.text : t('submit')}\n </Button>\n </Flex>\n </StyledFormDialog>\n );\n }\n );\n\nexport default FormDialog;\n"]}

package/lib/components/Dialog/InfoDialog.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InfoDialog.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/InfoDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuC,EAAE,EAAa,cAAc,EAAE,MAAM,OAAO,CAAC;~~AAiB3F~~,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAGjD,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,GAAG,cAAc,CAAC,cAAc,CAAC,~~CAgHpE~~,CAAC;AAEF,eAAe,UAAU,CAAC"}
1	+ {"version":3,"file":"InfoDialog.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/InfoDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuC,EAAE,EAAa,cAAc,EAAE,MAAM,OAAO,CAAC;AAkB3F,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAGjD,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,GAAG,cAAc,CAAC,cAAc,CAAC,CAyIpE,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/lib/components/Dialog/InfoDialog.js CHANGED Viewed

@@ -6,13 +6,26 @@ import Icon from '../Icon';
 import Progress from '../Progress';
 import Flex from '../Flex';
 import SummaryItem from '../SummaryItem';
+import { getFocusables } from '../../utils';
 import { StyledChildrenWrap, StyledDialogContent, StyledDialogHeader } from './Dialog.styles';
 import { StyledDismissButton, StyledInfoDialog } from './InfoDialog.styles';
 const InfoDialog = forwardRef(({ target, heading: headingProp, children, progress: progressProp, onDismiss, ...restProps }, ref) => {
     const t = useI18n();
     const headingId = useUID();
     const dialogRef = useConsolidatedRef(ref);
+    const dialogContentRef = useRef(null);
     const closeButtonRef = useRef(null);
+    const setFocus = () => {
+        if (progressProp)
+            return;
+        const focusables = getFocusables(dialogRef);
+        const focusable = focusables.find(el => {
+            return dialogContentRef.current?.contains(el);
+        }) ??
+            closeButtonRef.current ??
+            focusables[0];
+        focusable?.focus();
+    };
     useEscape(() => {
         onDismiss?.();
     });
@@ -22,7 +35,7 @@ const InfoDialog = forwardRef(({ target, heading: headingProp, children, progres
     useFocusTrap(dialogRef);
     useEffect(() => {
         if (!progressProp) {
-            closeButtonRef.current?.focus();
+            setFocus();
         }
     }, [progressProp]);
     useEffect(() => {
@@ -33,13 +46,13 @@ const InfoDialog = forwardRef(({ target, heading: headingProp, children, progres
         };
     }, []);
     const heading = headingProp ? (_jsx(Text, { id: headingId, variant: 'h2', children: typeof headingProp === 'string' ? headingProp : headingProp.primary })) : null;
-    const progress = (_jsx(Progress, { visible: !!progressProp, focusOnVisible: true, placement: children ? 'local' : 'block', message: typeof progressProp === 'string' ? progressProp : undefined }));
+    const progress = (_jsx(Progress, { visible: !!progressProp, focusOnVisible: true, placement: 'local', message: typeof progressProp === 'string' ? progressProp : undefined }));
     const dismissButton = (_jsx(StyledDismissButton, { icon: true, variant: 'simple', onClick: () => {
             onDismiss();
         }, label: t('close'), ref: closeButtonRef, children: _jsx(Icon, { name: 'times' }) }));
     return (_jsxs(StyledInfoDialog, { ...restProps, ...(typeof headingProp === 'string'
             ? { labelledbyId: headingId }
-            : { ariaLabel: headingProp?.primary }), arrow: true, target: target, progress: progressProp, ref: dialogRef, children: [headingProp && heading && (_jsxs(Flex, { container: { alignItems: 'center', justify: 'between', pad: 2, gap: 1 }, item: { shrink: 0 }, as: StyledDialogHeader, children: [typeof headingProp === 'string' ? (heading) : (_jsx(SummaryItem, { primary: heading, secondary: headingProp.secondary ? (_jsx(Text, { variant: 'secondary', children: headingProp.secondary })) : undefined, visual: headingProp.visual })), dismissButton] })), _jsxs(Flex, { container: { direction: 'column' }, item: { grow: 1 }, as: StyledDialogContent, children: [!headingProp && dismissButton, children && _jsx(StyledChildrenWrap, { children: children }), progress] })] }));
+            : { ariaLabel: headingProp?.primary }), arrow: true, target: target, progress: progressProp, ref: dialogRef, children: [headingProp && heading && (_jsxs(Flex, { container: { alignItems: 'center', justify: 'between', pad: 2, gap: 1 }, item: { shrink: 0 }, as: StyledDialogHeader, children: [typeof headingProp === 'string' ? (heading) : (_jsx(SummaryItem, { primary: heading, secondary: headingProp.secondary ? (_jsx(Text, { variant: 'secondary', children: headingProp.secondary })) : undefined, visual: headingProp.visual })), dismissButton] })), _jsxs(Flex, { container: { direction: 'column' }, item: { grow: 1 }, as: StyledDialogContent, ref: dialogContentRef, children: [!headingProp && dismissButton, children && (_jsx(StyledChildrenWrap, { inert: progressProp ? '' : undefined, children: children })), progress] })] }));
 });
 export default InfoDialog;
 //# sourceMappingURL=InfoDialog.js.map

package/lib/components/Dialog/InfoDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InfoDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/InfoDialog.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAmB,MAAM,EAAM,SAAS,EAAkB,MAAM,OAAO,CAAC;AAE3F,OAAO,EACL,kBAAkB,EAClB,SAAS,EACT,YAAY,EACZ,OAAO,EACP,aAAa,EACb,MAAM,EACP,MAAM,aAAa,CAAC;AACrB,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,WAAW,MAAM,gBAAgB,CAAC;~~AAEzC~~,OAAO,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAE9F,OAAO,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAE5E,MAAM,UAAU,GAAyD,UAAU,CACjF,CACE,EACE,MAAM,EACN,OAAO,EAAE,WAAW,EACpB,QAAQ,EACR,QAAQ,EAAE,YAAY,EACtB,SAAS,EACT,GAAG,SAAS,EACqB,EACnC,GAA2B,EAC3B,EAAE;IACF,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,SAAS,GAAG,MAAM,EAAE,CAAC;IAC3B,MAAM,SAAS,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAC1C,MAAM,cAAc,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAEvD,SAAS,CAAC,GAAG,EAAE;QACb,SAAS,EAAE,EAAE,CAAC;IAChB,CAAC,CAAC,CAAC;IAEH,aAAa,CAAC,WAAW,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,EAAE,GAAG,EAAE;QACnD,SAAS,EAAE,EAAE,CAAC;IAChB,CAAC,CAAC,CAAC;IAEH,YAAY,CAAC,SAAS,CAAC,CAAC;IAExB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,YAAY,EAAE;YACjB,~~cAAc~~,~~CAAC,OAAO,~~EAAE,~~KAAK,EAAE,~~CAAC;~~SACjC~~;IACH,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,GAAG,EAAE;YACV,IAAI,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;gBAC7B,MAAM,CAAC,KAAK,EAAE,CAAC;aAChB;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,OAAO,GAAG,WAAW,CAAC,CAAC,CAAC,CAC5B,KAAC,IAAI,IAAC,EAAE,EAAE,SAAS,EAAE,OAAO,EAAC,IAAI,YAC9B,OAAO,WAAW,KAAK,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,OAAO,GAC/D,CACR,CAAC,CAAC,CAAC,IAAI,CAAC;IAET,MAAM,QAAQ,GAAG,CACf,KAAC,QAAQ,IACP,OAAO,EAAE,CAAC,CAAC,YAAY,EACvB,cAAc,QACd,SAAS,~~EAAE~~,~~QAAQ,CAAC,CAAC,CAAC,~~OAAO,~~CAAC~~,~~CAAC,CAAC,~~OAAO,~~EACvC,OAAO,~~EAAE,OAAO,YAAY,KAAK,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,GACpE,CACH,CAAC;IAEF,MAAM,aAAa,GAAG,CACpB,KAAC,mBAAmB,IAClB,IAAI,QACJ,OAAO,EAAC,QAAQ,EAChB,OAAO,EAAE,GAAG,EAAE;YACZ,SAAS,EAAE,CAAC;QACd,CAAC,EACD,KAAK,EAAE,CAAC,CAAC,OAAO,CAAC,EACjB,GAAG,EAAE,cAAc,YAEnB,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACD,CACvB,CAAC;IAEF,OAAO,CACL,MAAC,gBAAgB,OACX,SAAS,KACT,CAAC,OAAO,WAAW,KAAK,QAAQ;YAClC,CAAC,CAAC,EAAE,YAAY,EAAE,SAAS,EAAE;YAC7B,CAAC,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,CAAC,EACxC,KAAK,QACL,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,YAAY,EACtB,GAAG,EAAE,SAAS,aAEb,WAAW,IAAI,OAAO,IAAI,CACzB,MAAC,IAAI,IACH,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,EACvE,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,EACnB,EAAE,EAAE,kBAAkB,aAErB,OAAO,WAAW,KAAK,QAAQ,CAAC,CAAC,CAAC,CACjC,OAAO,CACR,CAAC,CAAC,CAAC,CACF,KAAC,WAAW,IACV,OAAO,EAAE,OAAO,EAChB,SAAS,EACP,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,CACtB,KAAC,IAAI,IAAC,OAAO,EAAC,WAAW,YAAE,WAAW,CAAC,SAAS,GAAQ,CACzD,CAAC,CAAC,CAAC,SAAS,EAEf,MAAM,EAAE,WAAW,CAAC,MAAM,GAC1B,CACH,EACA,aAAa,IACT,CACR,EAED,MAAC,IAAI,~~IAAC~~,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,~~EAAE~~,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,~~EAAE~~,EAAE,EAAE,mBAAmB,~~aACjF~~,CAAC,WAAW,IAAI,aAAa,EAC7B,QAAQ,IAAI,KAAC,kBAAkB,~~cAAE~~,QAAQ,~~GAAsB~~,~~EAC/D~~,QAAQ,IACJ,IACU,CACpB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import { forwardRef, PropsWithoutRef, useRef, FC, useEffect, HTMLAttributes } from 'react';\n\nimport {\n useConsolidatedRef,\n useEscape,\n useFocusTrap,\n useI18n,\n useOuterEvent,\n useUID\n} from '../../hooks';\nimport Text from '../Text';\nimport Icon from '../Icon';\nimport Progress from '../Progress';\nimport Flex from '../Flex';\nimport SummaryItem from '../SummaryItem';\n\nimport { StyledChildrenWrap, StyledDialogContent, StyledDialogHeader } from './Dialog.styles';\nimport { InfoDialogProps } from './Dialog.types';\nimport { StyledDismissButton, StyledInfoDialog } from './InfoDialog.styles';\n\nconst InfoDialog: FC<InfoDialogProps & HTMLAttributes<HTMLDivElement>> = forwardRef(\n (\n {\n target,\n heading: headingProp,\n children,\n progress: progressProp,\n onDismiss,\n ...restProps\n }: PropsWithoutRef<InfoDialogProps>,\n ref: InfoDialogProps['ref']\n ) => {\n const t = useI18n();\n const headingId = useUID();\n const dialogRef = useConsolidatedRef(ref);\n const closeButtonRef = useRef<HTMLButtonElement>(null);\n\n useEscape(() => {\n onDismiss?.();\n });\n\n useOuterEvent('mousedown', [target, dialogRef], () => {\n onDismiss?.();\n });\n\n useFocusTrap(dialogRef);\n\n useEffect(() => {\n if (!progressProp) {\n ~~closeButtonRef.current?.focus~~();\n }\n }, [progressProp]);\n\n useEffect(() => {\n return () => {\n if (document.contains(target)) {\n target.focus();\n }\n };\n }, []);\n\n const heading = headingProp ? (\n <Text id={headingId} variant='h2'>\n {typeof headingProp === 'string' ? headingProp : headingProp.primary}\n </Text>\n ) : null;\n\n const progress = (\n <Progress\n visible={!!progressProp}\n focusOnVisible\n placement=~~{children ?~~ 'local' ~~: 'block'}~~\n message={typeof progressProp === 'string' ? progressProp : undefined}\n />\n );\n\n const dismissButton = (\n <StyledDismissButton\n icon\n variant='simple'\n onClick={() => {\n onDismiss();\n }}\n label={t('close')}\n ref={closeButtonRef}\n >\n <Icon name='times' />\n </StyledDismissButton>\n );\n\n return (\n <StyledInfoDialog\n {...restProps}\n {...(typeof headingProp === 'string'\n ? { labelledbyId: headingId }\n : { ariaLabel: headingProp?.primary })}\n arrow\n target={target}\n progress={progressProp}\n ref={dialogRef}\n >\n {headingProp && heading && (\n <Flex\n container={{ alignItems: 'center', justify: 'between', pad: 2, gap: 1 }}\n item={{ shrink: 0 }}\n as={StyledDialogHeader}\n >\n {typeof headingProp === 'string' ? (\n heading\n ) : (\n <SummaryItem\n primary={heading}\n secondary={\n headingProp.secondary ? (\n <Text variant='secondary'>{headingProp.secondary}</Text>\n ) : undefined\n }\n visual={headingProp.visual}\n />\n )}\n {dismissButton}\n </Flex>\n )}\n\n <Flex container={{ direction: 'column' }} item={{ grow: 1 }} as={StyledDialogContent}>\n {!headingProp && dismissButton}\n {children && <StyledChildrenWrap>{children}</StyledChildrenWrap>}\n {progress}\n </Flex>\n </StyledInfoDialog>\n );\n }\n);\n\nexport default InfoDialog;\n"]}
1	+ {"version":3,"file":"InfoDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/InfoDialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, PropsWithoutRef, useRef, FC, useEffect, HTMLAttributes } from 'react';\n\nimport {\n useConsolidatedRef,\n useEscape,\n useFocusTrap,\n useI18n,\n useOuterEvent,\n useUID\n} from '../../hooks';\nimport Text from '../Text';\nimport Icon from '../Icon';\nimport Progress from '../Progress';\nimport Flex from '../Flex';\nimport SummaryItem from '../SummaryItem';\nimport { getFocusables } from '../../utils';\n\nimport { StyledChildrenWrap, StyledDialogContent, StyledDialogHeader } from './Dialog.styles';\nimport { InfoDialogProps } from './Dialog.types';\nimport { StyledDismissButton, StyledInfoDialog } from './InfoDialog.styles';\n\nconst InfoDialog: FC<InfoDialogProps & HTMLAttributes<HTMLDivElement>> = forwardRef(\n (\n {\n target,\n heading: headingProp,\n children,\n progress: progressProp,\n onDismiss,\n ...restProps\n }: PropsWithoutRef<InfoDialogProps>,\n ref: InfoDialogProps['ref']\n ) => {\n const t = useI18n();\n const headingId = useUID();\n const dialogRef = useConsolidatedRef(ref);\n const dialogContentRef = useRef<HTMLDivElement>(null);\n const closeButtonRef = useRef<HTMLButtonElement>(null);\n\n const setFocus = () => {\n if (progressProp) return;\n\n const focusables = getFocusables(dialogRef);\n\n const focusable =\n focusables.find(el => {\n return dialogContentRef.current?.contains(el);\n }) ??\n closeButtonRef.current ??\n focusables[0];\n\n focusable?.focus();\n };\n\n useEscape(() => {\n onDismiss?.();\n });\n\n useOuterEvent('mousedown', [target, dialogRef], () => {\n onDismiss?.();\n });\n\n useFocusTrap(dialogRef);\n\n useEffect(() => {\n if (!progressProp) {\n setFocus();\n }\n }, [progressProp]);\n\n useEffect(() => {\n return () => {\n if (document.contains(target)) {\n target.focus();\n }\n };\n }, []);\n\n const heading = headingProp ? (\n <Text id={headingId} variant='h2'>\n {typeof headingProp === 'string' ? headingProp : headingProp.primary}\n </Text>\n ) : null;\n\n const progress = (\n <Progress\n visible={!!progressProp}\n focusOnVisible\n placement='local'\n message={typeof progressProp === 'string' ? progressProp : undefined}\n />\n );\n\n const dismissButton = (\n <StyledDismissButton\n icon\n variant='simple'\n onClick={() => {\n onDismiss();\n }}\n label={t('close')}\n ref={closeButtonRef}\n >\n <Icon name='times' />\n </StyledDismissButton>\n );\n\n return (\n <StyledInfoDialog\n {...restProps}\n {...(typeof headingProp === 'string'\n ? { labelledbyId: headingId }\n : { ariaLabel: headingProp?.primary })}\n arrow\n target={target}\n progress={progressProp}\n ref={dialogRef}\n >\n {headingProp && heading && (\n <Flex\n container={{ alignItems: 'center', justify: 'between', pad: 2, gap: 1 }}\n item={{ shrink: 0 }}\n as={StyledDialogHeader}\n >\n {typeof headingProp === 'string' ? (\n heading\n ) : (\n <SummaryItem\n primary={heading}\n secondary={\n headingProp.secondary ? (\n <Text variant='secondary'>{headingProp.secondary}</Text>\n ) : undefined\n }\n visual={headingProp.visual}\n />\n )}\n {dismissButton}\n </Flex>\n )}\n\n <Flex\n container={{ direction: 'column' }}\n item={{ grow: 1 }}\n as={StyledDialogContent}\n ref={dialogContentRef}\n >\n {!headingProp && dismissButton}\n {children && (\n <StyledChildrenWrap inert={progressProp ? '' : undefined}>\n {children}\n </StyledChildrenWrap>\n )}\n {progress}\n </Flex>\n </StyledInfoDialog>\n );\n }\n);\n\nexport default InfoDialog;\n"]}

package/lib/components/Form/Form.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Form.d.ts","sourceRoot":"","sources":["../../../src/components/Form/Form.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,EAAE,EAAmB,MAAM,OAAO,CAAC;AAExD,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAGvD,OAAO,EAAE,KAAK,aAAa,EAAE,MAAM,sCAAsC,CAAC;AAE1E,MAAM,WAAW,SAAU,SAAQ,UAAU,CAAC,aAAa,EAAE,SAAS,CAAC;IACrE,6HAA6H;IAC7H,QAAQ,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;CACpC;AAED,QAAA,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,GAAG,YAAY,~~CA2BtC~~,CAAC;AAEF,eAAe,IAAI,CAAC"}
1	+ {"version":3,"file":"Form.d.ts","sourceRoot":"","sources":["../../../src/components/Form/Form.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,EAAE,EAAmB,MAAM,OAAO,CAAC;AAExD,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAGvD,OAAO,EAAE,KAAK,aAAa,EAAE,MAAM,sCAAsC,CAAC;AAE1E,MAAM,WAAW,SAAU,SAAQ,UAAU,CAAC,aAAa,EAAE,SAAS,CAAC;IACrE,6HAA6H;IAC7H,QAAQ,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;CACpC;AAED,QAAA,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,GAAG,YAAY,CAoCtC,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/lib/components/Form/Form.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import { useUID } from '../../hooks';
 import MultiStepForm from '../MultiStepForm';
-const Form = forwardRef(({ children, actions, heading, description, banners, ...restProps }, ref) => {
+const Form = forwardRef(({ children, actions, progress, heading, description, banners, ...restProps }, ref) => {
     const stepId = useUID();
     return (_jsx(MultiStepForm, { ...restProps, heading: heading, steps: [
             {
@@ -13,7 +13,7 @@ const Form = forwardRef(({ children, actions, heading, description, banners, ...
                 description,
                 banners
             }
-        ], currentStepId: stepId, ref: ref, autoComplete: 'off' }));
+        ], currentStepId: stepId, progress: progress, ref: ref, autoComplete: 'off' }));
 });
 export default Form;
 //# sourceMappingURL=Form.js.map

package/lib/components/Form/Form.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Form.js","sourceRoot":"","sources":["../../../src/components/Form/Form.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAuB,MAAM,OAAO,CAAC;AAGxD,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,aAAa,MAAM,kBAAkB,CAAC;AAQ7C,MAAM,IAAI,GAAiC,UAAU,CACnD,CACE,~~EAAE~~,QAAQ,~~EAAE~~,OAAO,~~EAAE~~,OAAO,~~EAAE~~,WAAW,~~EAAE~~,OAAO,~~EAAE~~,GAAG,SAAS,~~EAA8B~~,~~EAC9F~~,GAAqB,EACrB,EAAE;IACF,MAAM,MAAM,GAAG,MAAM,EAAE,CAAC;IAExB,OAAO,CACL,KAAC,aAAa,OACR,SAAS,EACb,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE;YACL;gBACE,EAAE,EAAE,MAAM;gBACV,IAAI,EAAE,EAAE;gBACR,OAAO;gBACP,OAAO,EAAE,QAAQ;gBACjB,WAAW;gBACX,OAAO;aACR;SACF,EACD,aAAa,EAAE,MAAM,EACrB,GAAG,EAAE,GAAG,EACR,YAAY,EAAC,KAAK,GAClB,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,IAAI,CAAC","sourcesContent":["import { forwardRef, FC, PropsWithoutRef } from 'react';\n\nimport { ForwardProps, OmitStrict } from '../../types';\nimport { useUID } from '../../hooks';\nimport MultiStepForm from '../MultiStepForm';\nimport { type BaseFormProps } from '../MultiStepForm/MultiStepForm.types';\n\nexport interface FormProps extends OmitStrict<BaseFormProps, 'content'> {\n /** The Form content. Recommended composing form elements within a layout template such as Grid or Flex as the only child. */\n children: BaseFormProps['content'];\n}\n\nconst Form: FC<FormProps & ForwardProps> = forwardRef(\n (\n { children, actions, heading, description, banners, ...restProps }: PropsWithoutRef<FormProps>,\n ref: FormProps['ref']\n ) => {\n const stepId = useUID();\n\n return (\n <MultiStepForm\n {...restProps}\n heading={heading}\n steps={[\n {\n id: stepId,\n name: '',\n actions,\n content: children,\n description,\n banners\n }\n ]}\n currentStepId={stepId}\n ref={ref}\n autoComplete='off'\n />\n );\n }\n);\n\nexport default Form;\n"]}
1	+ {"version":3,"file":"Form.js","sourceRoot":"","sources":["../../../src/components/Form/Form.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAuB,MAAM,OAAO,CAAC;AAGxD,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,aAAa,MAAM,kBAAkB,CAAC;AAQ7C,MAAM,IAAI,GAAiC,UAAU,CACnD,CACE,EACE,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,OAAO,EACP,WAAW,EACX,OAAO,EACP,GAAG,SAAS,EACe,EAC7B,GAAqB,EACrB,EAAE;IACF,MAAM,MAAM,GAAG,MAAM,EAAE,CAAC;IAExB,OAAO,CACL,KAAC,aAAa,OACR,SAAS,EACb,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE;YACL;gBACE,EAAE,EAAE,MAAM;gBACV,IAAI,EAAE,EAAE;gBACR,OAAO;gBACP,OAAO,EAAE,QAAQ;gBACjB,WAAW;gBACX,OAAO;aACR;SACF,EACD,aAAa,EAAE,MAAM,EACrB,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAE,GAAG,EACR,YAAY,EAAC,KAAK,GAClB,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,IAAI,CAAC","sourcesContent":["import { forwardRef, FC, PropsWithoutRef } from 'react';\n\nimport { ForwardProps, OmitStrict } from '../../types';\nimport { useUID } from '../../hooks';\nimport MultiStepForm from '../MultiStepForm';\nimport { type BaseFormProps } from '../MultiStepForm/MultiStepForm.types';\n\nexport interface FormProps extends OmitStrict<BaseFormProps, 'content'> {\n /** The Form content. Recommended composing form elements within a layout template such as Grid or Flex as the only child. */\n children: BaseFormProps['content'];\n}\n\nconst Form: FC<FormProps & ForwardProps> = forwardRef(\n (\n {\n children,\n actions,\n progress,\n heading,\n description,\n banners,\n ...restProps\n }: PropsWithoutRef<FormProps>,\n ref: FormProps['ref']\n ) => {\n const stepId = useUID();\n\n return (\n <MultiStepForm\n {...restProps}\n heading={heading}\n steps={[\n {\n id: stepId,\n name: '',\n actions,\n content: children,\n description,\n banners\n }\n ]}\n currentStepId={stepId}\n progress={progress}\n ref={ref}\n autoComplete='off'\n />\n );\n }\n);\n\nexport default Form;\n"]}

package/lib/components/Modal/Contexts.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Contexts.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Contexts.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,wBAAwB,EAAE,MAAM,eAAe,CAAC;AAY5E,eAAO,MAAM,mBAAmB,EAAE,~~iBAYjC~~,CAAC;AAEF,eAAO,MAAM,YAAY,4CAAwD,CAAC;AAElF,eAAO,MAAM,mBAAmB,mDAI9B,CAAC"}
1	+ {"version":3,"file":"Contexts.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Contexts.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,wBAAwB,EAAE,MAAM,eAAe,CAAC;AAY5E,eAAO,MAAM,mBAAmB,EAAE,iBAcjC,CAAC;AAEF,eAAO,MAAM,YAAY,4CAAwD,CAAC;AAElF,eAAO,MAAM,mBAAmB,mDAI9B,CAAC"}

package/lib/components/Modal/Contexts.js CHANGED Viewed

@@ -19,6 +19,8 @@ export const initialModalContext = {
     state: 'open',
     top: false,
     initialized: false,
+    portalTarget: null,
+    setPortalTarget: () => { },
     ...initialMethods
 };
 export const ModalContext = createContext(initialModalContext);

package/lib/components/Modal/Contexts.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Contexts.js","sourceRoot":"","sources":["../../../src/components/Modal/Contexts.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAItC,MAAM,cAAc,GAAG;IACrB,MAAM,EAAE,GAAG,EAAE,GAAE,CAAC;IAChB,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;IACjB,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC;IAClB,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC;IAClB,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC;IAClB,IAAI,EAAE,GAAG,EAAE,GAAE,CAAC;IACd,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;CAClB,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAsB;IACpD,KAAK,EAAE,KAAK;IACZ,WAAW,EAAE,IAAI;IACjB,WAAW,EAAE,KAAK;IAClB,WAAW,EAAE,KAAK;IAClB,QAAQ,EAAE,KAAK;IACf,gBAAgB,EAAE,KAAK;IACvB,oBAAoB,EAAE,IAAI;IAC1B,KAAK,EAAE,MAAM;IACb,GAAG,EAAE,KAAK;IACV,WAAW,EAAE,KAAK;IAClB,GAAG,cAAc;CAClB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,aAAa,CAAoB,mBAAmB,CAAC,CAAC;AAElF,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,CAA2B;IACzE,MAAM,EAAE,GAAG,EAAE,CAAC,cAAc;IAC5B,YAAY;IACZ,WAAW,EAAE,KAAK;CACnB,CAAC,CAAC","sourcesContent":["import { createContext } from 'react';\n\nimport { ModalContextValue, ModalManagerContextValue } from './Modal.types';\n\nconst initialMethods = {\n update: () => {},\n dismiss: () => {},\n activate: () => {},\n minimize: () => {},\n maximize: () => {},\n dock: () => {},\n unmount: () => {}\n};\n\nexport const initialModalContext: ModalContextValue = {\n alert: false,\n dismissible: true,\n minimizable: false,\n maximizable: false,\n dockable: false,\n defaultMinimized: false,\n unmountWhenMinimized: true,\n state: 'open',\n top: false,\n initialized: false,\n ...initialMethods\n};\n\nexport const ModalContext = createContext<ModalContextValue>(initialModalContext);\n\nexport const ModalManagerContext = createContext<ModalManagerContextValue>({\n create: () => initialMethods,\n ModalContext,\n initialized: false\n});\n"]}
1	+ {"version":3,"file":"Contexts.js","sourceRoot":"","sources":["../../../src/components/Modal/Contexts.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAItC,MAAM,cAAc,GAAG;IACrB,MAAM,EAAE,GAAG,EAAE,GAAE,CAAC;IAChB,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;IACjB,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC;IAClB,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC;IAClB,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC;IAClB,IAAI,EAAE,GAAG,EAAE,GAAE,CAAC;IACd,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;CAClB,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAsB;IACpD,KAAK,EAAE,KAAK;IACZ,WAAW,EAAE,IAAI;IACjB,WAAW,EAAE,KAAK;IAClB,WAAW,EAAE,KAAK;IAClB,QAAQ,EAAE,KAAK;IACf,gBAAgB,EAAE,KAAK;IACvB,oBAAoB,EAAE,IAAI;IAC1B,KAAK,EAAE,MAAM;IACb,GAAG,EAAE,KAAK;IACV,WAAW,EAAE,KAAK;IAClB,YAAY,EAAE,IAAI;IAClB,eAAe,EAAE,GAAG,EAAE,GAAE,CAAC;IACzB,GAAG,cAAc;CAClB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,aAAa,CAAoB,mBAAmB,CAAC,CAAC;AAElF,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,CAA2B;IACzE,MAAM,EAAE,GAAG,EAAE,CAAC,cAAc;IAC5B,YAAY;IACZ,WAAW,EAAE,KAAK;CACnB,CAAC,CAAC","sourcesContent":["import { createContext } from 'react';\n\nimport { ModalContextValue, ModalManagerContextValue } from './Modal.types';\n\nconst initialMethods = {\n update: () => {},\n dismiss: () => {},\n activate: () => {},\n minimize: () => {},\n maximize: () => {},\n dock: () => {},\n unmount: () => {}\n};\n\nexport const initialModalContext: ModalContextValue = {\n alert: false,\n dismissible: true,\n minimizable: false,\n maximizable: false,\n dockable: false,\n defaultMinimized: false,\n unmountWhenMinimized: true,\n state: 'open',\n top: false,\n initialized: false,\n portalTarget: null,\n setPortalTarget: () => {},\n ...initialMethods\n};\n\nexport const ModalContext = createContext<ModalContextValue>(initialModalContext);\n\nexport const ModalManagerContext = createContext<ModalManagerContextValue>({\n create: () => initialMethods,\n ModalContext,\n initialized: false\n});\n"]}