npm - @pega/cosmos-react-core - Versions diffs - 9.0.0-build.9.8 → 9.0.0 - Mend

@pega/cosmos-react-core 9.0.0-build.9.8 → 9.0.0

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 (1414) hide show

package/lib/components/Preview/PreviewPanel.js ADDED Viewed

@@ -0,0 +1,110 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useState, useEffect } from 'react';
+import styled, { css } from 'styled-components';
+import Button from '../Button';
+import { defaultThemeProp } from '../../theme';
+import Drawer from '../Drawer';
+import Flex from '../Flex';
+import getFocusables from '../../utils/getFocusables';
+import Icon, { registerIcon } from '../Icon';
+import Progress from '../Progress';
+import { readableHue } from '../../styles/utils';
+import { resizeDrawerDefaultWidth, resizeDrawerMaxWidth, resizeDrawerMinWidth } from '../../styles/constants';
+import { StyledResizeHandle } from '../Drawer/ResizeHandle';
+import * as timesIcon from '../Icon/icons/times.icon';
+import useConsolidatedRef from '../../hooks/useConsolidatedRef';
+import useDirection from '../../hooks/useDirection';
+import useElement from '../../hooks/useElement';
+import useFocusTrap from '../../hooks/useFocusTrap';
+import useI18n from '../../hooks/useI18n';
+import usePreviewContext from '../../hooks/usePreviewContext';
+import useTestIds from '../../hooks/useTestIds';
+import { withTestIds } from '../../utils';
+import { getPreviewPanelTestIds } from './PreviewPanel.test-ids';
+registerIcon(timesIcon);
+export const StyledPreviewDrawer = styled(Drawer)(({ theme }) => {
+    return css `
+    min-width: ${resizeDrawerMinWidth};
+    max-width: ${resizeDrawerMaxWidth};
+    width: var(--resize-drawer-width);
+    background-color: ${theme.base.palette['app-background']};
+    height: auto;
+    inset-block-start: calc(var(--app-header-height, 0rem) + var(--appshell-top-offset, 0rem));
+    inset-block-end: var(--appshell-bottom-offset, 0);
+    z-index: calc(${theme.base['z-index'].backdrop} - 1);
+    transition-property: transform, box-shadow, opacity, border-inline-start;
+    transition-duration: max(${theme.base.animation.speed}, 1ms);
+    transition-timing-function: ${theme.base.animation.timing.ease};
+    ${StyledResizeHandle} {
+      z-index: calc(${theme.base['z-index'].max - 1});
+    }
+    @media (width >= ${theme.base.breakpoints.md}) {
+      box-shadow: none;
+      border-inline-start: 0.0625rem solid
+        ${readableHue(theme.base.palette['border-line'], theme.base.palette['app-background'], {
+        mode: 'both',
+        level: 'AANonText'
+    })};
+    }
+  `;
+});
+StyledPreviewDrawer.defaultProps = defaultThemeProp;
+const StyledCloseButton = styled(Button)(({ theme }) => {
+    return css `
+    --half-btn-compact-difference: calc(
+      (${theme.base['hit-area'].mouse} - ${theme.base['hit-area'].compact}) / 2
+    );
+    @media (pointer: coarse) {
+      --half-btn-compact-difference: calc(
+        (${theme.base['hit-area'].finger} - ${theme.base['hit-area'].compact}) / 2
+      );
+    }
+    position: absolute;
+    border: none;
+    /* Places above resize handle */
+    z-index: ${theme.base['z-index'].max};
+    box-shadow: ${theme.base.shadow.low};
+    inset-inline-start: calc(-${theme.base['hit-area'].compact} / 2);
+    inset-block-start: calc(2 * ${theme.base.spacing} + var(--half-btn-compact-difference));
+  `;
+});
+StyledCloseButton.defaultProps = defaultThemeProp;
+const PreviewPanel = forwardRef(function PreviewPanel({ testId, previewLabel, open, children, progress, onBeforeOpen, onAfterOpen, onBeforeClose, onAfterClose, ...restProps }, ref) {
+    const testIds = useTestIds(testId, getPreviewPanelTestIds);
+    const t = useI18n();
+    const direction = useDirection();
+    const previewRef = useConsolidatedRef(ref);
+    const { previewTriggerRef } = usePreviewContext();
+    const [closeButtonEl, setCloseButtonEl] = useElement();
+    const [progressVisible, setProgressVisible] = useState(false);
+    const setFocus = () => {
+        if (progressVisible)
+            return;
+        const focusables = getFocusables(previewRef).filter(el => el !== closeButtonEl);
+        const focusable = focusables[0] ?? closeButtonEl;
+        focusable?.focus();
+    };
+    useEffect(() => {
+        if (!progressVisible) {
+            setFocus();
+        }
+    }, [progressVisible]);
+    useFocusTrap(previewRef, true, [], false);
+    return (_jsxs(Drawer, { "data-testid": testIds.root, onBeforeOpen: () => {
+            onBeforeOpen?.();
+        }, onAfterOpen: () => {
+            setFocus();
+            onAfterOpen?.();
+        }, as: StyledPreviewDrawer, role: 'complementary', forwardedAs: Flex, container: { direction: 'column' }, ref: previewRef, position: 'fixed', placement: direction.end, size: resizeDrawerDefaultWidth, "aria-label": previewLabel ? t('preview_of_noun', [previewLabel]) : t('preview'), open: open, resizeable: true, shadow: true, nullWhenClosed: true, ...restProps, children: [_jsx(StyledCloseButton, { "data-testid": testIds.close, icon: true, compact: true, onClick: () => {
+                    onBeforeClose?.();
+                    onAfterClose?.();
+                    previewTriggerRef.current?.focus();
+                }, ref: setCloseButtonEl, label: t('close_preview'), children: _jsx(Icon, { name: 'times', size: 'font-size' }) }), _jsx(Progress, { "data-testid": testIds.progress, placement: 'local', visible: !!progress, focusOnVisible: true, delay: true, onTransitionStartIn: () => {
+                    setProgressVisible(true);
+                }, onTransitionEndOut: () => setProgressVisible(false) }), !progress && children] }));
+});
+export default withTestIds(PreviewPanel, getPreviewPanelTestIds);
+//# sourceMappingURL=PreviewPanel.js.map

package/lib/components/Preview/PreviewPanel.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"PreviewPanel.js","sourceRoot":"","sources":["../../../src/components/Preview/PreviewPanel.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useEffect } from 'react';\nimport type { PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Button from '../Button';\nimport { defaultThemeProp } from '../../theme';\nimport Drawer from '../Drawer';\nimport Flex from '../Flex';\nimport getFocusables from '../../utils/getFocusables';\nimport Icon, { registerIcon } from '../Icon';\nimport Progress from '../Progress';\nimport { readableHue } from '../../styles/utils';\nimport {\n resizeDrawerDefaultWidth,\n resizeDrawerMaxWidth,\n resizeDrawerMinWidth\n} from '../../styles/constants';\nimport { StyledResizeHandle } from '../Drawer/ResizeHandle';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport useConsolidatedRef from '../../hooks/useConsolidatedRef';\nimport useDirection from '../../hooks/useDirection';\nimport useElement from '../../hooks/useElement';\nimport useFocusTrap from '../../hooks/useFocusTrap';\nimport useI18n from '../../hooks/useI18n';\nimport usePreviewContext from '../../hooks/usePreviewContext';\nimport useTestIds from '../../hooks/useTestIds';\nimport { withTestIds } from '../../utils';\n\nimport { getPreviewPanelTestIds } from './PreviewPanel.test-ids';\nimport type { PreviewPanelProps } from './Preview.types';\n\nregisterIcon(timesIcon);\n\nexport const StyledPreviewDrawer = styled(Drawer)(({ theme }) => {\n return css`\n min-width: ${resizeDrawerMinWidth};\n max-width: ${resizeDrawerMaxWidth};\n width: var(--resize-drawer-width);\n background-color: ${theme.base.palette['app-background']};\n height: auto;\n inset-block-start: calc(var(--app-header-height, 0rem) + var(--appshell-top-offset, 0rem));\n inset-block-end: var(--appshell-bottom-offset, 0);\n z-index: calc(${theme.base['z-index'].backdrop} - 1);\n transition-property: transform, box-shadow, opacity, border-inline-start;\n transition-duration: max(${theme.base.animation.speed}, 1ms);\n transition-timing-function: ${theme.base.animation.timing.ease};\n\n ${StyledResizeHandle} {\n z-index: calc(${theme.base['z-index'].max - 1});\n }\n\n @media (width >= ${theme.base.breakpoints.md}) {\n box-shadow: none;\n border-inline-start: 0.0625rem solid\n ${readableHue(theme.base.palette['border-line'], theme.base.palette['app-background'], {\n mode: 'both',\n level: 'AANonText'\n })};\n }\n `;\n});\n\nStyledPreviewDrawer.defaultProps = defaultThemeProp;\n\nconst StyledCloseButton = styled(Button)(({ theme }) => {\n return css`\n --half-btn-compact-difference: calc(\n (${theme.base['hit-area'].mouse} - ${theme.base['hit-area'].compact}) / 2\n );\n @media (pointer: coarse) {\n --half-btn-compact-difference: calc(\n (${theme.base['hit-area'].finger} - ${theme.base['hit-area'].compact}) / 2\n );\n }\n position: absolute;\n border: none;\n\n /* Places above resize handle */\n z-index: ${theme.base['z-index'].max};\n box-shadow: ${theme.base.shadow.low};\n inset-inline-start: calc(-${theme.base['hit-area'].compact} / 2);\n inset-block-start: calc(2 * ${theme.base.spacing} + var(--half-btn-compact-difference));\n `;\n});\n\nStyledCloseButton.defaultProps = defaultThemeProp;\n\nconst PreviewPanel = forwardRef(function PreviewPanel(\n {\n testId,\n previewLabel,\n open,\n children,\n progress,\n onBeforeOpen,\n onAfterOpen,\n onBeforeClose,\n onAfterClose,\n ...restProps\n }: PropsWithoutRef<PreviewPanelProps>,\n ref: Ref<HTMLDivElement>\n) {\n const testIds = useTestIds(testId, getPreviewPanelTestIds);\n\n const t = useI18n();\n const direction = useDirection();\n const previewRef = useConsolidatedRef(ref);\n const { previewTriggerRef } = usePreviewContext();\n\n const [closeButtonEl, setCloseButtonEl] = useElement<HTMLButtonElement>();\n const [progressVisible, setProgressVisible] = useState(false);\n\n const setFocus = () => {\n if (progressVisible) return;\n\n const focusables = getFocusables(previewRef).filter(el => el !== closeButtonEl);\n const focusable = focusables[0] ?? closeButtonEl;\n focusable?.focus();\n };\n\n useEffect(() => {\n if (!progressVisible) {\n setFocus();\n }\n }, [progressVisible]);\n\n useFocusTrap(previewRef, true, [], false);\n\n return (\n <Drawer\n data-testid={testIds.root}\n onBeforeOpen={() => {\n onBeforeOpen?.();\n }}\n onAfterOpen={() => {\n setFocus();\n onAfterOpen?.();\n }}\n as={StyledPreviewDrawer}\n role='complementary'\n forwardedAs={Flex}\n container={{ direction: 'column' }}\n ref={previewRef}\n position='fixed'\n placement={direction.end}\n size={resizeDrawerDefaultWidth}\n aria-label={previewLabel ? t('preview_of_noun', [previewLabel]) : t('preview')}\n open={open}\n resizeable\n shadow\n nullWhenClosed\n {...restProps}\n >\n <StyledCloseButton\n data-testid={testIds.close}\n icon\n compact\n onClick={() => {\n onBeforeClose?.();\n onAfterClose?.();\n previewTriggerRef.current?.focus();\n }}\n ref={setCloseButtonEl}\n label={t('close_preview')}\n >\n <Icon name='times' size='font-size' />\n </StyledCloseButton>\n\n <Progress\n data-testid={testIds.progress}\n placement='local'\n visible={!!progress}\n focusOnVisible\n delay\n onTransitionStartIn={() => {\n setProgressVisible(true);\n }}\n onTransitionEndOut={() => setProgressVisible(false)}\n />\n {!progress && children}\n </Drawer>\n );\n});\n\nexport default withTestIds(PreviewPanel, getPreviewPanelTestIds);\n"]}

package/lib/components/Preview/PreviewPanel.test-ids.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export declare const getPreviewPanelTestIds: (testIdProp?: import("../..").TestIdProp["testId"]) => import("../..").TestIdsRecord<readonly ["close", "progress"]>;
2	+ //# sourceMappingURL=PreviewPanel.test-ids.d.ts.map

package/lib/components/Preview/PreviewPanel.test-ids.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"PreviewPanel.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/Preview/PreviewPanel.test-ids.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,sBAAsB,sHAGxB,CAAC"}

package/lib/components/Preview/PreviewPanel.test-ids.js ADDED Viewed

@@ -0,0 +1,6 @@
+import { createTestIds } from '../../utils';
+export const getPreviewPanelTestIds = createTestIds('preview-panel', [
+    'close',
+    'progress'
+]);
+//# sourceMappingURL=PreviewPanel.test-ids.js.map

package/lib/components/Preview/PreviewPanel.test-ids.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"PreviewPanel.test-ids.js","sourceRoot":"","sources":["../../../src/components/Preview/PreviewPanel.test-ids.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,MAAM,CAAC,MAAM,sBAAsB,GAAG,aAAa,CAAC,eAAe,EAAE;IACnE,OAAO;IACP,UAAU;CACF,CAAC,CAAC","sourcesContent":["import { createTestIds } from '../../utils';\n\nexport const getPreviewPanelTestIds = createTestIds('preview-panel', [\n 'close',\n 'progress'\n] as const);\n"]}

package/lib/components/Preview/index.d.ts ADDED Viewed

@@ -0,0 +1,5 @@
+export { default as PreviewPanel, StyledPreviewDrawer } from './PreviewPanel';
+export { default as PreviewManager } from './PreviewManager';
+export type { PreviewOptions, PreviewProps, PreviewMethods } from './Preview.types';
+export { getPreviewPanelTestIds } from './PreviewPanel.test-ids';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/Preview/index.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Preview/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAC9E,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,YAAY,EAAE,cAAc,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACpF,OAAO,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC"}

package/lib/components/Preview/index.js ADDED Viewed

@@ -0,0 +1,4 @@
+export { default as PreviewPanel, StyledPreviewDrawer } from './PreviewPanel';
+export { default as PreviewManager } from './PreviewManager';
+export { getPreviewPanelTestIds } from './PreviewPanel.test-ids';
+//# sourceMappingURL=index.js.map

package/lib/components/Preview/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Preview/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAC9E,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAE7D,OAAO,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC","sourcesContent":["export { default as PreviewPanel, StyledPreviewDrawer } from './PreviewPanel';\nexport { default as PreviewManager } from './PreviewManager';\nexport type { PreviewOptions, PreviewProps, PreviewMethods } from './Preview.types';\nexport { getPreviewPanelTestIds } from './PreviewPanel.test-ids';\n"]}

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

@@ -114,7 +114,7 @@ const Progress = forwardRef(function Progress({ variant = 'ring', placement = 'g
     }
     // generate background variant based on theme text color
     const progressBackdropVariant = getLuminance(theme.base.palette['foreground-color']) > 0.5 ? 'dark' : 'light';
-    const content = hasBackdrop ? (_jsx(StyledProgressBackdrop, { open: isVisibleState, container: { direction: 'column' }, position: placement === 'global' ? 'fixed' : 'absolute', variant: progressBackdropVariant, alpha: 0.8, onBeforeTransitionIn: onTransitionStartIn, onAfterTransitionIn: onTransitionEndIn, onBeforeTransitionOut: onTransitionStartOut, onAfterTransitionOut: () => {
+    const content = hasBackdrop ? (_jsx(StyledProgressBackdrop, { open: isVisibleState, container: { direction: 'column' }, position: placement === 'global' ? 'fixed' : 'absolute', variant: progressBackdropVariant, alpha: 0.6, onBeforeTransitionIn: onTransitionStartIn, onAfterTransitionIn: onTransitionEndIn, onBeforeTransitionOut: onTransitionStartOut, onAfterTransitionOut: () => {
             setNullRender(true);
             onTransitionEndOut?.();
         }, children: indicator })) : (indicator);

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Progress.js","sourceRoot":"","sources":["../../../src/components/Progress/Progress.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useEffect, useRef } from 'react';\nimport type { PropsWithoutRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { getLuminance } from 'polished';\n\nimport type { ForwardRefForwardPropsComponent } from '../../types';\nimport Text from '../Text';\nimport { useConfiguration, useConsolidatedRef, useI18n, useLiveLog, useTheme } from '../../hooks';\nimport Flex from '../Flex';\n\nimport type { ProgressProps } from './Progress.types';\nimport Bar from './Bar';\nimport Ellipsis from './Ellipsis';\nimport Ring from './Ring';\nimport { StyledMessage, StyledProgress, StyledProgressBackdrop } from './Progress.styles';\n\nconst variantMap = {\n ring: Ring,\n bar: Bar,\n ellipsis: Ellipsis\n} as const;\n\nconst delayDuration = 100;\nconst minVisibleDuration = 1000;\n\nconst Progress: ForwardRefForwardPropsComponent<ProgressProps> = forwardRef(function Progress(\n {\n variant = 'ring',\n placement = 'global',\n visible: visibleProp = true,\n focusOnVisible = false,\n delay = false,\n onTransitionStartIn,\n onTransitionEndIn,\n onTransitionStartOut,\n onTransitionEndOut,\n value,\n message,\n liveConfig,\n ...restProps\n }: PropsWithoutRef<ProgressProps>,\n ref: ProgressProps['ref']\n) {\n const t = useI18n();\n const { portalTarget } = useConfiguration();\n const { announcePolite } = useLiveLog();\n const theme = useTheme();\n const progressEl = useConsolidatedRef<HTMLDivElement>(ref);\n\n // Rendering states. Both are needed due to Backdrop's transition phase where isVisibleState is false but nullRender is true until onAfterTransitionOut.\n const [isVisibleState, setIsVisibleState] = useState(delay ? false : visibleProp);\n const [nullRender, setNullRender] = useState(!isVisibleState);\n\n // Refs for timestamps and timeout ids.\n const timeBeforeVisibleRender = useRef<number>();\n const timeAfterVisibleRender = useRef<number>();\n const delayTimer = useRef<number>();\n const minVisibleTimer = useRef<number>();\n\n const hasBackdrop = placement === 'global' \|\| placement === 'local';\n const valString = typeof value === 'number' ? `${value}%` : undefined;\n const label = message && valString ? `${message} - ${valString}` : message \|\| valString;\n\n const renderVisible = () => {\n setIsVisibleState(true);\n setNullRender(false);\n };\n\n const renderNotVisible = () => {\n setIsVisibleState(false);\n // With a transition, setNullRender needs to be called in Backdrop's onAfterTransitionOut.\n if (!hasBackdrop) {\n setNullRender(true);\n }\n };\n\n // Handle render and visible state.\n useEffect(\n () => {\n if (visibleProp) {\n // Capture a timestamp for additional timers.\n timeBeforeVisibleRender.current = Date.now();\n\n if (delay) {\n delayTimer.current = window.setTimeout(renderVisible, delayDuration);\n } else {\n renderVisible();\n }\n } else if (\n // A timer was started to render visible either avoid it or render null.\n delayTimer.current !== undefined\n ) {\n // If a timeout has started to render visible, clear it.\n clearTimeout(delayTimer.current);\n\n // If the indicator has already rendered visible.\n if (timeAfterVisibleRender.current !== undefined) {\n const timeElapsedSinceLastVisibleRender = Date.now() - timeAfterVisibleRender.current;\n\n // If the indicator has been visible for long enough we can remove it.\n if (timeElapsedSinceLastVisibleRender >= minVisibleDuration) {\n renderNotVisible();\n } else {\n // Hold off removing until we hit the minimum visible time.\n minVisibleTimer.current = window.setTimeout(\n renderNotVisible,\n minVisibleDuration - timeElapsedSinceLastVisibleRender\n );\n }\n } else {\n renderNotVisible();\n }\n } else {\n renderNotVisible();\n }\n },\n // visibleProp is the only triggerable dependency. Others values will be captured.\n [visibleProp]\n );\n\n // Live announcement\n useEffect(\n () => {\n if (liveConfig?.contextualLabel && isVisibleState) {\n announcePolite({\n message: `${liveConfig.contextualLabel}, ${label ?? t('loading')}`,\n type: 'status'\n });\n }\n },\n // isVisibleState is the only triggerable dependency. Others values will be captured.\n [isVisibleState]\n );\n\n // Auto focusing and render timestamping.\n useEffect(\n () => {\n if (!nullRender && isVisibleState) {\n // After a visible render set a timestamp for timers above.\n timeAfterVisibleRender.current = Date.now();\n\n if (focusOnVisible) progressEl.current?.focus();\n }\n },\n // nullRender is the only triggerable dependency. Others values will be captured.\n [nullRender]\n );\n\n if (nullRender) return null;\n\n const CompVariant = variantMap[variant];\n\n let indicator = (\n <CompVariant\n aria-label={typeof value !== 'number' && label ? label : t('loading')}\n as={placement === 'inline' ? 'span' : undefined}\n {...restProps}\n placement={placement}\n value={value}\n aria-valuetext={typeof value === 'number' ? label : undefined}\n ref={progressEl}\n tabIndex={-1}\n />\n );\n\n if (placement !== 'inline') {\n indicator = (\n <Flex\n container={{ direction: 'column', alignItems: 'center', gap: 0.5 }}\n as={StyledProgress}\n placement={placement}\n >\n {indicator}\n {message && (\n <Text as={StyledMessage} variant='secondary' aria-hidden>\n {message}\n </Text>\n )}\n </Flex>\n );\n }\n\n // generate background variant based on theme text color\n const progressBackdropVariant =\n getLuminance(theme.base.palette['foreground-color']) > 0.5 ? 'dark' : 'light';\n\n const content = hasBackdrop ? (\n <StyledProgressBackdrop\n open={isVisibleState}\n container={{ direction: 'column' }}\n position={placement === 'global' ? 'fixed' : 'absolute'}\n variant={progressBackdropVariant}\n alpha={0.8}\n onBeforeTransitionIn={onTransitionStartIn}\n onAfterTransitionIn={onTransitionEndIn}\n onBeforeTransitionOut={onTransitionStartOut}\n onAfterTransitionOut={() => {\n setNullRender(true);\n onTransitionEndOut?.();\n }}\n >\n {indicator}\n </StyledProgressBackdrop>\n ) : (\n indicator\n );\n\n return placement === 'global' && portalTarget ? createPortal(content, portalTarget) : content;\n});\n\nexport default Progress;\n"]}
1	+ {"version":3,"file":"Progress.js","sourceRoot":"","sources":["../../../src/components/Progress/Progress.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useEffect, useRef } from 'react';\nimport type { PropsWithoutRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { getLuminance } from 'polished';\n\nimport type { ForwardRefForwardPropsComponent } from '../../types';\nimport Text from '../Text';\nimport { useConfiguration, useConsolidatedRef, useI18n, useLiveLog, useTheme } from '../../hooks';\nimport Flex from '../Flex';\n\nimport type { ProgressProps } from './Progress.types';\nimport Bar from './Bar';\nimport Ellipsis from './Ellipsis';\nimport Ring from './Ring';\nimport { StyledMessage, StyledProgress, StyledProgressBackdrop } from './Progress.styles';\n\nconst variantMap = {\n ring: Ring,\n bar: Bar,\n ellipsis: Ellipsis\n} as const;\n\nconst delayDuration = 100;\nconst minVisibleDuration = 1000;\n\nconst Progress: ForwardRefForwardPropsComponent<ProgressProps> = forwardRef(function Progress(\n {\n variant = 'ring',\n placement = 'global',\n visible: visibleProp = true,\n focusOnVisible = false,\n delay = false,\n onTransitionStartIn,\n onTransitionEndIn,\n onTransitionStartOut,\n onTransitionEndOut,\n value,\n message,\n liveConfig,\n ...restProps\n }: PropsWithoutRef<ProgressProps>,\n ref: ProgressProps['ref']\n) {\n const t = useI18n();\n const { portalTarget } = useConfiguration();\n const { announcePolite } = useLiveLog();\n const theme = useTheme();\n const progressEl = useConsolidatedRef<HTMLDivElement>(ref);\n\n // Rendering states. Both are needed due to Backdrop's transition phase where isVisibleState is false but nullRender is true until onAfterTransitionOut.\n const [isVisibleState, setIsVisibleState] = useState(delay ? false : visibleProp);\n const [nullRender, setNullRender] = useState(!isVisibleState);\n\n // Refs for timestamps and timeout ids.\n const timeBeforeVisibleRender = useRef<number>();\n const timeAfterVisibleRender = useRef<number>();\n const delayTimer = useRef<number>();\n const minVisibleTimer = useRef<number>();\n\n const hasBackdrop = placement === 'global' \|\| placement === 'local';\n const valString = typeof value === 'number' ? `${value}%` : undefined;\n const label = message && valString ? `${message} - ${valString}` : message \|\| valString;\n\n const renderVisible = () => {\n setIsVisibleState(true);\n setNullRender(false);\n };\n\n const renderNotVisible = () => {\n setIsVisibleState(false);\n // With a transition, setNullRender needs to be called in Backdrop's onAfterTransitionOut.\n if (!hasBackdrop) {\n setNullRender(true);\n }\n };\n\n // Handle render and visible state.\n useEffect(\n () => {\n if (visibleProp) {\n // Capture a timestamp for additional timers.\n timeBeforeVisibleRender.current = Date.now();\n\n if (delay) {\n delayTimer.current = window.setTimeout(renderVisible, delayDuration);\n } else {\n renderVisible();\n }\n } else if (\n // A timer was started to render visible either avoid it or render null.\n delayTimer.current !== undefined\n ) {\n // If a timeout has started to render visible, clear it.\n clearTimeout(delayTimer.current);\n\n // If the indicator has already rendered visible.\n if (timeAfterVisibleRender.current !== undefined) {\n const timeElapsedSinceLastVisibleRender = Date.now() - timeAfterVisibleRender.current;\n\n // If the indicator has been visible for long enough we can remove it.\n if (timeElapsedSinceLastVisibleRender >= minVisibleDuration) {\n renderNotVisible();\n } else {\n // Hold off removing until we hit the minimum visible time.\n minVisibleTimer.current = window.setTimeout(\n renderNotVisible,\n minVisibleDuration - timeElapsedSinceLastVisibleRender\n );\n }\n } else {\n renderNotVisible();\n }\n } else {\n renderNotVisible();\n }\n },\n // visibleProp is the only triggerable dependency. Others values will be captured.\n [visibleProp]\n );\n\n // Live announcement\n useEffect(\n () => {\n if (liveConfig?.contextualLabel && isVisibleState) {\n announcePolite({\n message: `${liveConfig.contextualLabel}, ${label ?? t('loading')}`,\n type: 'status'\n });\n }\n },\n // isVisibleState is the only triggerable dependency. Others values will be captured.\n [isVisibleState]\n );\n\n // Auto focusing and render timestamping.\n useEffect(\n () => {\n if (!nullRender && isVisibleState) {\n // After a visible render set a timestamp for timers above.\n timeAfterVisibleRender.current = Date.now();\n\n if (focusOnVisible) progressEl.current?.focus();\n }\n },\n // nullRender is the only triggerable dependency. Others values will be captured.\n [nullRender]\n );\n\n if (nullRender) return null;\n\n const CompVariant = variantMap[variant];\n\n let indicator = (\n <CompVariant\n aria-label={typeof value !== 'number' && label ? label : t('loading')}\n as={placement === 'inline' ? 'span' : undefined}\n {...restProps}\n placement={placement}\n value={value}\n aria-valuetext={typeof value === 'number' ? label : undefined}\n ref={progressEl}\n tabIndex={-1}\n />\n );\n\n if (placement !== 'inline') {\n indicator = (\n <Flex\n container={{ direction: 'column', alignItems: 'center', gap: 0.5 }}\n as={StyledProgress}\n placement={placement}\n >\n {indicator}\n {message && (\n <Text as={StyledMessage} variant='secondary' aria-hidden>\n {message}\n </Text>\n )}\n </Flex>\n );\n }\n\n // generate background variant based on theme text color\n const progressBackdropVariant =\n getLuminance(theme.base.palette['foreground-color']) > 0.5 ? 'dark' : 'light';\n\n const content = hasBackdrop ? (\n <StyledProgressBackdrop\n open={isVisibleState}\n container={{ direction: 'column' }}\n position={placement === 'global' ? 'fixed' : 'absolute'}\n variant={progressBackdropVariant}\n alpha={0.6}\n onBeforeTransitionIn={onTransitionStartIn}\n onAfterTransitionIn={onTransitionEndIn}\n onBeforeTransitionOut={onTransitionStartOut}\n onAfterTransitionOut={() => {\n setNullRender(true);\n onTransitionEndOut?.();\n }}\n >\n {indicator}\n </StyledProgressBackdrop>\n ) : (\n indicator\n );\n\n return placement === 'global' && portalTarget ? createPortal(content, portalTarget) : content;\n});\n\nexport default Progress;\n"]}

package/lib/components/Progress/Progress.styles.d.ts CHANGED Viewed

@@ -1,14 +1,204 @@
 import type { ProgressProps } from './Progress.types';
-export declare const StyledProgressBackdrop: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Omit<import("../Backdrop").BackdropProps, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
+export declare const StyledProgressBackdrop: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<Omit<import("../Backdrop").BackdropProps, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, never>> & string & Omit<import("react").ForwardRefExoticComponent<Omit<import("../Backdrop").BackdropProps, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
     getTestIds: (testIdProp?: import("../..").TestIdProp["testId"]) => import("../..").TestIdsRecord<readonly []>;
-}, import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledProgressRing: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Pick<ProgressProps, "placement"> & {
+}, keyof import("react").Component<any, {}, any>>;
+export declare const StyledProgressRing: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, Pick<ProgressProps, "placement"> & {
     determinate: boolean;
-}, never>;
-export declare const StyledProgressBar: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, ProgressProps & {
+}>> & string;
+export declare const StyledProgressBar: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, ProgressProps & {
     determinate: boolean;
-}, never>;
-export declare const StyledProgressEllipsis: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Pick<ProgressProps, "placement">, never>;
-export declare const StyledMessage: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledProgress: import("styled-components").StyledComponent<import("../..").ForwardRefForwardPropsComponent<import("../Flex").FlexProps>, import("styled-components").DefaultTheme, Pick<ProgressProps, "placement">, never>;
+}>> & string;
+export declare const StyledProgressEllipsis: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, Pick<ProgressProps, "placement">>> & string;
+export declare const StyledMessage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const StyledProgress: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<(Omit<Omit<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "ref" | "className" | "children" | keyof import("../..").AsProp> & Required<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "item" | "xs" | "xl" | "sm" | "md" | "lg">>, "ref"> & import("react").RefAttributes<Element> & import("../..").ForwardProps, "ref"> & {
+    ref?: import("react").RefObject<Element> | ((instance: Element | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}) | (Omit<Omit<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "ref" | "className" | "children" | keyof import("../..").AsProp> & Required<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "container" | "xs" | "xl" | "sm" | "md" | "lg">>, "ref"> & import("react").RefAttributes<Element> & import("../..").ForwardProps, "ref"> & {
+    ref?: import("react").RefObject<Element> | ((instance: Element | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}) | (Omit<Omit<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "ref" | "className" | "children" | keyof import("../..").AsProp> & Required<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "xs">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "container" | "item" | "xl" | "sm" | "md" | "lg">>, "ref"> & import("react").RefAttributes<Element> & import("../..").ForwardProps, "ref"> & {
+    ref?: import("react").RefObject<Element> | ((instance: Element | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}) | (Omit<Omit<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "ref" | "className" | "children" | keyof import("../..").AsProp> & Required<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "xl">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "container" | "item" | "xs" | "sm" | "md" | "lg">>, "ref"> & import("react").RefAttributes<Element> & import("../..").ForwardProps, "ref"> & {
+    ref?: import("react").RefObject<Element> | ((instance: Element | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}) | (Omit<Omit<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "ref" | "className" | "children" | keyof import("../..").AsProp> & Required<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "sm">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "container" | "item" | "xs" | "xl" | "md" | "lg">>, "ref"> & import("react").RefAttributes<Element> & import("../..").ForwardProps, "ref"> & {
+    ref?: import("react").RefObject<Element> | ((instance: Element | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}) | (Omit<Omit<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "ref" | "className" | "children" | keyof import("../..").AsProp> & Required<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "md">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "container" | "item" | "xs" | "xl" | "sm" | "lg">>, "ref"> & import("react").RefAttributes<Element> & import("../..").ForwardProps, "ref"> & {
+    ref?: import("react").RefObject<Element> | ((instance: Element | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}) | (Omit<Omit<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "ref" | "className" | "children" | keyof import("../..").AsProp> & Required<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "lg">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps & import("../..").BaseProps & import("../..").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    sm?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    md?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    lg?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+    xl?: Pick<import("../Flex/Flex").BaseFlexProps, never> & ((Required<Pick<import("../Flex/Flex").BaseFlexProps, "container">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "item">>) | (Required<Pick<import("../Flex/Flex").BaseFlexProps, "item">> & Partial<Pick<import("../Flex/Flex").BaseFlexProps, "container">>));
+}, "container" | "item" | "xs" | "xl" | "sm" | "md">>, "ref"> & import("react").RefAttributes<Element> & import("../..").ForwardProps, "ref"> & {
+    ref?: import("react").RefObject<Element> | ((instance: Element | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}), Pick<ProgressProps, "placement">>> & string & Omit<import("../..").ForwardRefForwardPropsComponent<import("../Flex").FlexProps>, keyof import("react").Component<any, {}, any>>;
 //# sourceMappingURL=Progress.styles.d.ts.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Progress.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Progress/Progress.styles.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEtD,eAAO,MAAM,sBAAsB~~;;uDAIjC~~,CAAC;AAgBH,eAAO,MAAM,kBAAkB;iBACqB,OAAO;~~SAsDzD~~,CAAC;AAIH,eAAO,MAAM,iBAAiB;iBACG,OAAO;~~SA6DtC~~,CAAC;AAIH,eAAO,MAAM,sBAAsB,~~uIAqEjC,~~CAAC;AAIH,eAAO,MAAM,aAAa,~~0GAexB,~~CAAC;AAIH,eAAO,MAAM,cAAc,~~8MAezB,~~CAAC"}
1	+ {"version":3,"file":"Progress.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Progress/Progress.styles.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEtD,eAAO,MAAM,sBAAsB;;;;iDAIjC,CAAC;AAgBH,eAAO,MAAM,kBAAkB;;;iBACqB,OAAO;YAsDzD,CAAC;AAIH,eAAO,MAAM,iBAAiB;;;iBACG,OAAO;YA6DtC,CAAC;AAIH,eAAO,MAAM,sBAAsB;;8CAqEjC,CAAC;AAIH,eAAO,MAAM,aAAa,+NAexB,CAAC;AAIH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mLAezB,CAAC"}

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

@@ -93,7 +93,7 @@ export const StyledProgressBar = styled(StyledProgressVisual)(({ theme, placemen
     max-width: min(calc(100vw - 4 * ${theme.base.spacing}), ${theme.base['content-width'].lg});
     overflow: hidden;
-    ::before {
+    &::before {
       content: '';
       display: block;
       height: 100%;