npm - acinguiux-ds-react-framework - Versions diffs - 0.1.24 → 0.1.25 - Mend

acinguiux-ds-react-framework 0.1.24 → 0.1.25

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

package/build/cjs/components/Alert/Alert.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Alert.styles.js","sources":["../../../../src/components/Alert/Alert.styles.tsx"],"sourcesContent":["import { PropsWithChildren } from 'react';\n\nimport { Directions, LINK_CLASS, Sizes, Variants } from 'acinguiux-ds-react-base/consts';\nimport { PickTransient } from 'acinguiux-ds-react-base/types';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\nimport { AlertConsts, AlertTypes } from 'acinguiux-ds-react-base/components/Alert';\nimport { FabricsVariables } from 'acinguiux-ds-fabrics';\nimport { styled, css, keyframes } from 'styled-components';\nimport { getLargerSize } from 'acinguiux-ds-react-base/utils/sizesUtils';\nimport { LabelTypes, TextTypes } from 'acinguiux-ds-react-base/components/Text';\n\nimport Label from '../Text/components/Label/Label';\nimport Text from '../Text/components/Text/Text';\nimport type { IAlertProps } from './Alert.types';\nimport OnSentimentButton from '../Button/OnSentimentButton';\nimport { getAlertBodySize } from './utils/alertUtils';\n\nconst getProminence = (variant: AlertTypes.Variant) => {\n if (variant === Variants.Filled) {\n return FabricsVariables.SentimentProminences.Strong;\n }\n\n if (variant === Variants.Subtle) {\n return FabricsVariables.SentimentProminences.Subtle;\n }\n\n return FabricsVariables.SentimentProminences.Transparent;\n};\n\ntype AlertBasicProps = Required<PickTransient<IAlertProps, 'size' \| 'alignment'>>;\ntype AlertVariantProps = Required<PickTransient<IAlertProps, 'variant'>>;\ntype AlertSentimentProps = Required<PickTransient<IAlertProps, 'sentiment'>>;\ntype AlertBannerProps = Required<PickTransient<IAlertProps, 'banner'>>;\ntype AlertAutocloseProps = Required<PickTransient<IAlertProps, 'autoCloseTimeout'>>;\n\nconst fullWidth = keyframes`\n from {\n width: 0;\n }\n \n to {\n width: 100%;\n }\n`;\n\nconst opacity = keyframes`\n from {\n opacity: 0;\n }\n \n to {\n opacity: 1;\n }\n`;\n\nconst miniOpacity = keyframes`\n from {\n opacity: 0;\n }\n \n to {\n opacity: .1;\n }\n`;\n\nconst AutoCloseContainer = styled.div<AlertVariantProps & AlertSentimentProps & AlertAutocloseProps>`\n ${({ $sentiment, $variant, $autoCloseTimeout, theme }) => {\n const layer = theme.layer({\n sentiment: $sentiment,\n sentimentProminence: FabricsVariables.SentimentProminences.Strong,\n });\n\n return css`\n position: absolute;\n inset-block: 0;\n opacity: ${$variant === Variants.Filled ? 1 : 0.1};\n left: 0;\n right: 0;\n overflow: hidden;\n pointer-events: none;\n\n &::after {\n content: '';\n position: relative;\n height: 100%;\n display: block;\n\n @media (prefers-reduced-motion: no-preference) {\n width: 0;\n opacity: ${$variant === Variants.Filled ? 0.1 : 1};\n will-change: width;\n animation: ${fullWidth} ${$autoCloseTimeout}ms ease-out forwards;\n }\n\n @media (prefers-reduced-motion: reduce) {\n width: 100%;\n opacity: 0;\n will-change: opacity;\n animation: ${$variant === Variants.Filled ? miniOpacity : opacity} 1s ease-out forwards;\n }\n background-color: ${layer[Variables.BackgroundSentiment]};\n ${$variant === Variants.Filled &&\n css`\n mix-blend-mode: difference;\n `}\n }\n `;\n }};\n`;\n\nconst Alert = styled.div<AlertBasicProps & AlertVariantProps & AlertSentimentProps & AlertBannerProps>`\n ${({ $size, $sentiment, $banner, $variant, $alignment, theme }) => {\n const currentModes = { sentiment: $sentiment, sentimentProminence: getProminence($variant) };\n const layer = theme.layer(currentModes);\n\n return css`\n position: relative;\n background-color: ${layer[Variables.BackgroundSentiment]};\n color: ${layer[Variables.TextOnSentimentOnBackground]};\n border-color: ${layer[Variables.BorderOnSentimentOnBackground]};\n\n display: flex;\n align-items: flex-start;\n width: 100%;\n &,\n & > ${AutoCloseContainer} {\n border-radius: ${$banner ? 0 : AlertConsts.consts[$size][$alignment].radius}px;\n }\n box-sizing: border-box;\n min-height: ${AlertConsts.consts[$size][$alignment].minHeight}px;\n min-width: 0;\n margin: 0;\n padding: 0;\n\n ${$variant === Variants.Outlined &&\n css`\n border-width: 1px;\n border-style: solid;\n `}\n\n ${$alignment === Directions.Horizontal &&\n css`\n justify-content: center;\n `}\n \n ${$banner &&\n $variant === Variants.Outlined &&\n css`\n border-right-width: 0;\n border-left-width: 0;\n `}\n `;\n }}\n`;\n\nconst HighlightIndicator = styled.div<AlertBasicProps & AlertVariantProps & AlertSentimentProps>`\n ${({ theme, $sentiment, $size, $alignment, $variant }) => {\n const layer = theme.layer({ sentiment: $sentiment, sentimentProminence: getProminence($variant) });\n\n return css`\n position: relative;\n padding: 0;\n margin: 0;\n height: 100%;\n width: ${AlertConsts.consts[$size][$alignment].highlightContainerWidth}px;\n\n &::after {\n content: '';\n display: block;\n position: absolute;\n top: ${AlertConsts.consts[$size][$alignment].highlightPadding}px;\n bottom: ${AlertConsts.consts[$size][$alignment].highlightPadding}px;\n left: calc(100% + ${AlertConsts.consts[$size][$alignment].highlightContainerOffset}px);\n width: ${AlertConsts.consts[$size][$alignment].highlightWidth}px;\n border-radius: 10000px;\n background-color: ${layer[Variables.ForegroundOnSentiment]};\n }\n `;\n }};\n`;\n\nconst AlertContentContainer = styled.div<AlertBasicProps & AlertVariantProps>`\n ${({ $size, $alignment, $variant }) => css`\n display: flex;\n flex: 1 0 0;\n min-width: 0;\n min-height: 100%;\n overflow: hidden;\n padding: ${AlertConsts.consts[$size][$alignment].padding.vertical}px\n ${AlertConsts.consts[$size][$alignment].padding.horizontal}px;\n\n ${$variant === Variants.Outlined &&\n css`\n padding: ${AlertConsts.consts[$size][$alignment].padding.vertical - 1}px\n ${AlertConsts.consts[$size][$alignment].padding.horizontal - 1}px;\n `}\n `};\n`;\n\nconst MessageAndButtonContainer = styled.div<AlertBasicProps>`\n ${({ $size, $alignment }) => css`\n display: flex;\n flex: 1 1 100%;\n width: 100%;\n min-width: 0;\n overflow: hidden;\n flex-wrap: wrap;\n align-items: flex-start;\n gap: ${AlertConsts.consts[$size][$alignment].textIconGap}px;\n `};\n`;\n\nconst MessageAndIconVerticalContainer = styled.div<AlertBasicProps>`\n ${({ $alignment, $size }) => css`\n display: flex;\n flex: 1 0 0;\n width: 100%;\n min-width: 0;\n flex-wrap: nowrap;\n align-items: ${$alignment === Directions.Horizontal ? 'center' : 'flex-start'};\n gap: ${AlertConsts.consts[$size][$alignment].textIconGap}px;\n padding: ${AlertConsts.consts[$size][$alignment].innerPadding.top}px\n ${AlertConsts.consts[$size][$alignment].innerPadding.right}px\n ${AlertConsts.consts[$size][$alignment].innerPadding.bottom}px\n ${AlertConsts.consts[$size][$alignment].innerPadding.left}px;\n\n ${$alignment === Directions.Vertical &&\n css`\n padding-right: 0;\n `};\n `};\n`;\n\nconst IconContainer = styled.div<AlertBasicProps>`\n ${({ $alignment, $size }) => css`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n min-width: ${AlertConsts.consts[$size][$alignment].minIconSize ?? AlertConsts.consts[$size][$alignment].iconSize}px;\n min-height: ${AlertConsts.consts[$size][$alignment].minIconSize ??\n AlertConsts.consts[$size][$alignment].iconSize}px;\n\n & > svg {\n width: ${AlertConsts.consts[$size][$alignment].iconSize}px;\n height: ${AlertConsts.consts[$size][$alignment].iconSize}px;\n }\n `};\n`;\n\nconst InnerContainer = styled.div<AlertBasicProps>`\n ${({ $size, $alignment }) => css`\n display: flex;\n flex: 1 1 100%;\n justify-content: space-between;\n flex-wrap: nowrap;\n min-width: 0;\n gap: ${AlertConsts.consts[$size][$alignment].innerGap}px;\n align-self: stretch;\n align-items: center;\n\n ${$alignment === Directions.Vertical &&\n css`\n flex-direction: column;\n align-items: flex-start;\n `}\n `}\n`;\n\nconst AlertMessageContainer = styled.div<AlertBasicProps & AlertVariantProps>`\n ${({ $size, $variant, $alignment, theme }) => css`\n ${theme.typography('paragraph', getAlertBodySize($size))};\n display: flex;\n flex: 1 0 0;\n padding: 0 ${AlertConsts.consts[$size][$alignment].innerPadding.right}px 0\n ${AlertConsts.consts[$size][$alignment].innerPadding.left}px;\n\n ${$alignment === Directions.Horizontal &&\n css`\n padding-left: 0;\n padding-right: 0;\n `};\n\n overflow: hidden;\n\n > * {\n color: inherit;\n ${(!$variant \|\| $variant === 'filled') &&\n css`\n .${LINK_CLASS} a {\n &,\n &:hover,\n &:visited {\n color: inherit;\n border-color: inherit;\n }\n }\n `};\n\n ${$alignment === Directions.Horizontal &&\n css`\n white-space: nowrap;\n `};\n }\n\n ${$alignment === Directions.Horizontal &&\n css`\n > p {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n `};\n\n gap: ${AlertConsts.consts[$size][$alignment].textGap}px;\n\n ${$alignment === Directions.Horizontal &&\n css`\n align-items: baseline;\n `}\n\n ${$alignment === Directions.Vertical &&\n css`\n align-items: flex-start;\n flex-direction: column;\n `}\n `};\n`;\n\nconst AlertTitle = ({\n $size,\n $alignment,\n children,\n}: PropsWithChildren<Required<PickTransient<IAlertProps, 'size' \| 'alignment'>>>) => {\n if ($alignment === Directions.Vertical) {\n if ($size === Sizes.Large) {\n return (\n <Text bold={true} size={getLargerSize($size) as TextTypes.Size}>\n {children}\n </Text>\n );\n }\n\n return (\n <Label bold={true} size={getLargerSize($size) as LabelTypes.Size}>\n {children}\n </Label>\n );\n }\n\n return (\n <Text bold={true} size={$size}>\n {children}\n </Text>\n );\n};\n\nconst AlertMessage = styled(Text)``;\n\nconst Actions = styled.div<AlertBasicProps>`\n ${({ $size, $alignment }) => css`\n display: flex;\n align-items: center;\n flex-wrap: nowrap;\n justify-content: flex-end;\n gap: ${AlertConsts.consts[$size][$alignment].buttonGap}px;\n\n ${$alignment === Directions.Vertical &&\n css`\n align-self: stretch;\n `};\n `};\n`;\n\nconst ActionButton = styled(OnSentimentButton)``;\n\nconst CloseButton = styled(OnSentimentButton)``;\n\nexport {\n ActionButton,\n Actions,\n Alert,\n AutoCloseContainer,\n AlertContentContainer,\n AlertTitle,\n AlertMessage,\n AlertMessageContainer,\n CloseButton,\n HighlightIndicator,\n IconContainer,\n InnerContainer,\n MessageAndButtonContainer,\n MessageAndIconVerticalContainer,\n};\n"],"names":["getProminence","variant","Variants","FabricsVariables","fullWidth","keyframes","opacity","miniOpacity","AutoCloseContainer","styled","$sentiment","$variant","$autoCloseTimeout","theme","layer","css","Variables","Alert","$size","$banner","$alignment","currentModes","AlertConsts.consts","Directions","HighlightIndicator","AlertContentContainer","MessageAndButtonContainer","MessageAndIconVerticalContainer","IconContainer","InnerContainer","AlertMessageContainer","getAlertBodySize","LINK_CLASS","AlertTitle","children","Sizes","jsx","Text","getLargerSize","Label","AlertMessage","Actions","ActionButton","OnSentimentButton","CloseButton"],"mappings":"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"}
1	+ {"version":3,"file":"Alert.styles.js","sources":["../../../../src/components/Alert/Alert.styles.tsx"],"sourcesContent":["import { PropsWithChildren } from 'react';\n\nimport { Directions, LINK_CLASS, Sizes, Variants } from 'acinguiux-ds-react-base/consts';\nimport { PickTransient } from 'acinguiux-ds-react-base/types';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\nimport { AlertConsts, AlertTypes } from 'acinguiux-ds-react-base/components/Alert';\nimport { FabricsVariables } from 'acinguiux-ds-fabrics';\nimport { styled, css, keyframes } from 'styled-components';\nimport { getLargerSize } from 'acinguiux-ds-react-base/utils/sizesUtils';\nimport { LabelTypes, TextTypes } from 'acinguiux-ds-react-base/components/Text';\n\nimport Label from '../Text/components/Label/Label';\nimport Text from '../Text/components/Text/Text';\nimport type { IAlertProps } from './Alert.types';\nimport OnSentimentButton from '../Button/OnSentimentButton';\nimport { getAlertBodySize } from './utils/alertUtils';\n\nconst getProminence = (variant: AlertTypes.Variant) => {\n if (variant === Variants.Filled) {\n return FabricsVariables.SentimentProminences.Strong;\n }\n\n if (variant === Variants.Subtle) {\n return FabricsVariables.SentimentProminences.Subtle;\n }\n\n return FabricsVariables.SentimentProminences.Transparent;\n};\n\ntype AlertBasicProps = Required<PickTransient<IAlertProps, 'size' \| 'alignment'>>;\ntype AlertVariantProps = Required<PickTransient<IAlertProps, 'variant'>>;\ntype AlertSentimentProps = Required<PickTransient<IAlertProps, 'sentiment'>>;\ntype AlertBannerProps = Required<PickTransient<IAlertProps, 'banner'>>;\ntype AlertHighlightProps = Required<PickTransient<IAlertProps, 'highlight'>>;\ntype AlertAutocloseProps = Required<PickTransient<IAlertProps, 'autoCloseTimeout'>>;\n\nconst fullWidth = keyframes`\n from {\n width: 0;\n }\n \n to {\n width: 100%;\n }\n`;\n\nconst opacity = keyframes`\n from {\n opacity: 0;\n }\n \n to {\n opacity: 1;\n }\n`;\n\nconst miniOpacity = keyframes`\n from {\n opacity: 0;\n }\n \n to {\n opacity: .1;\n }\n`;\n\nconst AutoCloseContainer = styled.div<AlertVariantProps & AlertSentimentProps & AlertAutocloseProps>`\n ${({ $sentiment, $variant, $autoCloseTimeout, theme }) => {\n const layer = theme.layer({\n sentiment: $sentiment,\n sentimentProminence: FabricsVariables.SentimentProminences.Strong,\n });\n\n return css`\n position: absolute;\n inset-block: 0;\n opacity: ${$variant === Variants.Filled ? 1 : 0.1};\n left: 0;\n right: 0;\n overflow: hidden;\n pointer-events: none;\n\n &::after {\n content: '';\n position: relative;\n height: 100%;\n display: block;\n\n @media (prefers-reduced-motion: no-preference) {\n width: 0;\n opacity: ${$variant === Variants.Filled ? 0.1 : 1};\n will-change: width;\n animation: ${fullWidth} ${$autoCloseTimeout}ms ease-out forwards;\n }\n\n @media (prefers-reduced-motion: reduce) {\n width: 100%;\n opacity: 0;\n will-change: opacity;\n animation: ${$variant === Variants.Filled ? miniOpacity : opacity} 1s ease-out forwards;\n }\n background-color: ${layer[Variables.BackgroundSentiment]};\n ${$variant === Variants.Filled &&\n css`\n mix-blend-mode: difference;\n `}\n }\n `;\n }};\n`;\n\nconst AlertContentContainer = styled.div<AlertBasicProps & AlertVariantProps>`\n ${({ $size, $alignment, $variant }) => css`\n position: relative;\n display: flex;\n flex: 1 0 0;\n min-width: 0;\n min-height: 100%;\n overflow: hidden;\n padding: ${AlertConsts.consts[$size][$alignment].padding.vertical}px\n ${AlertConsts.consts[$size][$alignment].padding.horizontal}px;\n\n ${$variant === Variants.Outlined &&\n css`\n padding: ${AlertConsts.consts[$size][$alignment].padding.vertical - 1}px\n ${AlertConsts.consts[$size][$alignment].padding.horizontal - 1}px;\n `}\n `};\n`;\n\nconst Alert = styled.div<\n AlertBasicProps & AlertVariantProps & AlertSentimentProps & AlertBannerProps & AlertHighlightProps\n>`\n ${({ $size, $sentiment, $banner, $highlight, $variant, $alignment, theme }) => {\n const currentModes = { sentiment: $sentiment, sentimentProminence: getProminence($variant) };\n const layer = theme.layer(currentModes);\n\n return css`\n position: relative;\n background-color: ${layer[Variables.BackgroundSentiment]};\n color: ${layer[Variables.TextOnSentimentOnBackground]};\n border-color: ${layer[Variables.BorderOnSentimentOnBackground]};\n\n display: flex;\n align-items: flex-start;\n width: 100%;\n &,\n & > ${AutoCloseContainer} {\n border-radius: ${$banner ? 0 : AlertConsts.consts[$size][$alignment].radius}px;\n }\n box-sizing: border-box;\n min-height: ${AlertConsts.consts[$size][$alignment].minHeight}px;\n min-width: 0;\n margin: 0;\n padding: 0;\n\n ${$highlight &&\n !$banner &&\n css`\n & > ${AlertContentContainer} {\n margin-left: ${AlertConsts.consts[$size][$alignment].highlightContainerWidth}px;\n\n &::before {\n content: '';\n display: block;\n position: absolute;\n top: ${AlertConsts.consts[$size][$alignment].highlightPadding}px;\n bottom: ${AlertConsts.consts[$size][$alignment].highlightPadding}px;\n left: calc(${AlertConsts.consts[$size][$alignment].highlightContainerOffset}px);\n width: ${AlertConsts.consts[$size][$alignment].highlightWidth}px;\n border-radius: 10000px;\n background-color: ${layer[Variables.ForegroundOnSentiment]};\n }\n }\n `};\n\n ${$variant === Variants.Outlined &&\n css`\n border-width: 1px;\n border-style: solid;\n `}\n\n ${$alignment === Directions.Horizontal &&\n css`\n justify-content: center;\n `}\n \n ${$banner &&\n $variant === Variants.Outlined &&\n css`\n border-right-width: 0;\n border-left-width: 0;\n `}\n `;\n }}\n`;\n\nconst MessageAndButtonContainer = styled.div<AlertBasicProps>`\n ${({ $size, $alignment }) => css`\n display: flex;\n flex: 1 1 100%;\n width: 100%;\n min-width: 0;\n overflow: hidden;\n flex-wrap: wrap;\n align-items: flex-start;\n gap: ${AlertConsts.consts[$size][$alignment].textIconGap}px;\n `};\n`;\n\nconst MessageAndIconVerticalContainer = styled.div<AlertBasicProps>`\n ${({ $alignment, $size }) => css`\n display: flex;\n flex: 1 0 0;\n width: 100%;\n min-width: 0;\n flex-wrap: nowrap;\n align-items: ${$alignment === Directions.Horizontal ? 'center' : 'flex-start'};\n gap: ${AlertConsts.consts[$size][$alignment].textIconGap}px;\n padding: ${AlertConsts.consts[$size][$alignment].innerPadding.top}px\n ${AlertConsts.consts[$size][$alignment].innerPadding.right}px\n ${AlertConsts.consts[$size][$alignment].innerPadding.bottom}px\n ${AlertConsts.consts[$size][$alignment].innerPadding.left}px;\n\n ${$alignment === Directions.Vertical &&\n css`\n padding-right: 0;\n `};\n `};\n`;\n\nconst IconContainer = styled.div<AlertBasicProps>`\n ${({ $alignment, $size }) => css`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n min-width: ${AlertConsts.consts[$size][$alignment].minIconSize ?? AlertConsts.consts[$size][$alignment].iconSize}px;\n min-height: ${AlertConsts.consts[$size][$alignment].minIconSize ??\n AlertConsts.consts[$size][$alignment].iconSize}px;\n\n & > svg {\n width: ${AlertConsts.consts[$size][$alignment].iconSize}px;\n height: ${AlertConsts.consts[$size][$alignment].iconSize}px;\n }\n `};\n`;\n\nconst InnerContainer = styled.div<AlertBasicProps>`\n ${({ $size, $alignment }) => css`\n display: flex;\n flex: 1 1 100%;\n justify-content: space-between;\n flex-wrap: nowrap;\n min-width: 0;\n gap: ${AlertConsts.consts[$size][$alignment].innerGap}px;\n align-self: stretch;\n align-items: center;\n\n ${$alignment === Directions.Vertical &&\n css`\n flex-direction: column;\n align-items: flex-start;\n `}\n `}\n`;\n\nconst AlertMessageContainer = styled.div<AlertBasicProps & AlertVariantProps>`\n ${({ $size, $variant, $alignment, theme }) => css`\n ${theme.typography('paragraph', getAlertBodySize($size))};\n display: flex;\n flex: 1 0 0;\n padding: 0 ${AlertConsts.consts[$size][$alignment].innerPadding.right}px 0\n ${AlertConsts.consts[$size][$alignment].innerPadding.left}px;\n\n ${$alignment === Directions.Horizontal &&\n css`\n padding-left: 0;\n padding-right: 0;\n `};\n\n overflow: hidden;\n\n * {\n color: inherit;\n margin: 0;\n padding: 0;\n\n ${(!$variant \|\| $variant === 'filled') &&\n css`\n .${LINK_CLASS} a {\n &,\n &:hover,\n &:visited {\n color: inherit;\n border-color: inherit;\n }\n }\n `};\n\n ${$alignment === Directions.Horizontal &&\n css`\n white-space: nowrap;\n `};\n }\n\n ${$alignment === Directions.Horizontal &&\n css`\n > p {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n `};\n\n gap: ${AlertConsts.consts[$size][$alignment].textGap}px;\n\n ${$alignment === Directions.Horizontal &&\n css`\n align-items: baseline;\n `}\n\n ${$alignment === Directions.Vertical &&\n css`\n align-items: flex-start;\n flex-direction: column;\n `}\n `};\n`;\n\nconst AlertTitle = ({\n $size,\n $alignment,\n children,\n}: PropsWithChildren<Required<PickTransient<IAlertProps, 'size' \| 'alignment'>>>) => {\n if ($alignment === Directions.Vertical) {\n if ($size === Sizes.Large) {\n return (\n <Text bold={true} size={getLargerSize($size) as TextTypes.Size}>\n {children}\n </Text>\n );\n }\n\n return (\n <Label bold={true} size={getLargerSize($size) as LabelTypes.Size}>\n {children}\n </Label>\n );\n }\n\n return (\n <Text bold={true} size={$size}>\n {children}\n </Text>\n );\n};\n\nconst AlertMessage = styled(Text)``;\n\nconst Actions = styled.div<AlertBasicProps>`\n ${({ $size, $alignment }) => css`\n display: flex;\n align-items: center;\n flex-wrap: nowrap;\n justify-content: flex-end;\n gap: ${AlertConsts.consts[$size][$alignment].buttonGap}px;\n\n ${$alignment === Directions.Vertical &&\n css`\n align-self: stretch;\n `};\n `};\n`;\n\nconst ActionButton = styled(OnSentimentButton)``;\n\nconst CloseButton = styled(OnSentimentButton)``;\n\nexport {\n ActionButton,\n Actions,\n Alert,\n AutoCloseContainer,\n AlertContentContainer,\n AlertTitle,\n AlertMessage,\n AlertMessageContainer,\n CloseButton,\n IconContainer,\n InnerContainer,\n MessageAndButtonContainer,\n MessageAndIconVerticalContainer,\n};\n"],"names":["getProminence","variant","Variants","FabricsVariables","fullWidth","keyframes","opacity","miniOpacity","AutoCloseContainer","styled","$sentiment","$variant","$autoCloseTimeout","theme","layer","css","Variables","AlertContentContainer","$size","$alignment","AlertConsts.consts","Alert","$banner","$highlight","currentModes","Directions","MessageAndButtonContainer","MessageAndIconVerticalContainer","IconContainer","InnerContainer","AlertMessageContainer","getAlertBodySize","LINK_CLASS","AlertTitle","children","Sizes","jsx","Text","getLargerSize","Label","AlertMessage","Actions","ActionButton","OnSentimentButton","CloseButton"],"mappings":"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"}

package/build/cjs/components/Avatar/components/SimpleAvatar.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),r=require("react"),u=require("../../Icon/components/PersonSolid.js"),S=require("../SimpleAvatar.styles.js"),d=require("../../Flag/Flag.js"),s=()=>t.jsx(u,{}),g=({abbreviation:e})=>e&&e.length>0?e.slice(0,2):t.jsx(s,{}),m=({src:e,alt:i})=>{const[l,n]=r.useState(!1),[a,c]=r.useState();return r.useEffect(()=>{n(!1),c(void 0);const o=new Image;o.onload=()=>c(e),o.onerror=()=>n(!0),o.src=e},[e]),!a||l?t.jsx(s,{}):t.jsx(S.Image,{src:a,alt:i},e)},A={initials:g,icon:s,photo:m,flag:d},f=e=>A[e];exports.getSimpleAvatarComponent=f;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),o=require("react"),u=require("../../Icon/components/PersonSolid.js"),S=require("../SimpleAvatar.styles.js"),d=require("../../Flag/Flag.js"),s=()=>t.jsx(u,{"aria-label":"Default user avatar"}),g=({abbreviation:e})=>e&&e.length>0?e.slice(0,2):t.jsx(s,{}),m=({src:e,alt:c})=>{const[i,a]=o.useState(!1),[n,l]=o.useState();return o.useEffect(()=>{a(!1),l(void 0);const r=new Image;r.onload=()=>l(e),r.onerror=()=>a(!0),r.src=e},[e]),!n||i?t.jsx(s,{}):t.jsx(S.Image,{src:n,alt:c},e)},A={initials:g,icon:s,photo:m,flag:d},f=e=>A[e];exports.getSimpleAvatarComponent=f;
 //# sourceMappingURL=SimpleAvatar.js.map

package/build/cjs/components/Avatar/components/SimpleAvatar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SimpleAvatar.js","sources":["../../../../../src/components/Avatar/components/SimpleAvatar.tsx"],"sourcesContent":["import { type FC, useState, useEffect } from 'react';\n\nimport type { SimpleVariantComponentProps, VariantType } from '../utils/useSimpleProps';\nimport PersonSolid from '../../Icon/components/PersonSolid';\nimport * as Styled from '../SimpleAvatar.styles';\nimport Flag from '../../Flag/Flag';\n\nconst AvatarIcon: FC<SimpleVariantComponentProps<'icon'>> = () => <PersonSolid />;\nconst AvatarInitials: FC<SimpleVariantComponentProps<'initials'>> = ({ abbreviation }) =>\n abbreviation && abbreviation.length > 0 ? abbreviation.slice(0, 2) : <AvatarIcon />;\nconst AvatarPhoto: FC<SimpleVariantComponentProps<'photo'>> = ({ src, alt }) => {\n const [hasError, setHasError] = useState(false);\n const [loadedSrc, setLoadedSrc] = useState<string>();\n\n useEffect(() => {\n setHasError(false);\n setLoadedSrc(undefined);\n const img = new Image();\n img.onload = () => setLoadedSrc(src);\n img.onerror = () => setHasError(true);\n img.src = src;\n }, [src]);\n\n if (!loadedSrc \|\| hasError) {\n return <AvatarIcon />;\n }\n\n return <Styled.Image key={src} src={loadedSrc} alt={alt} />;\n};\n\nconst SIMPLE_AVATAR_COMPONENTS: { readonly [Variant in VariantType]: FC<SimpleVariantComponentProps<Variant>> } = {\n initials: AvatarInitials,\n icon: AvatarIcon,\n photo: AvatarPhoto,\n flag: Flag,\n} as const;\n\nexport const getSimpleAvatarComponent = <Variant extends VariantType>(\n variant: Variant,\n): FC<SimpleVariantComponentProps<Variant>> => SIMPLE_AVATAR_COMPONENTS[variant];\n"],"names":["AvatarIcon","jsx","PersonSolid","AvatarInitials","abbreviation","AvatarPhoto","src","alt","hasError","setHasError","useState","loadedSrc","setLoadedSrc","useEffect","img","Styled.Image","SIMPLE_AVATAR_COMPONENTS","Flag","getSimpleAvatarComponent","variant"],"mappings":"6RAOMA,EAAsD,IAAMC,EAAAA,IAACC,EAAA,~~EAAY~~,~~EACzEC~~,EAA8D,CAAC,CAAE,aAAAC,CAAA,IACrEA,GAAgBA,EAAa,OAAS,EAAIA,EAAa,MAAM,EAAG,CAAC,QAAKJ,EAAA,EAAW,EAC7EK,EAAwD,CAAC,CAAE,IAAAC,EAAK,IAAAC,KAAU,CAC9E,KAAM,CAACC,EAAUC,CAAW,EAAIC,EAAAA,SAAS,EAAK,EACxC,CAACC,EAAWC,CAAY,EAAIF,WAAA,EAWlC,OATAG,EAAAA,UAAU,IAAM,CACdJ,EAAY,EAAK,EACjBG,EAAa,MAAS,EACtB,MAAME,EAAM,IAAI,MAChBA,EAAI,OAAS,IAAMF,EAAaN,CAAG,EACnCQ,EAAI,QAAU,IAAML,EAAY,EAAI,EACpCK,EAAI,IAAMR,CACZ,EAAG,CAACA,CAAG,CAAC,EAEJ,CAACK,GAAaH,QACRR,EAAA,EAAW,QAGbe,EAAAA,MAAA,CAAuB,IAAKJ,EAAW,IAAAJ,GAArBD,CAA+B,CAC3D,EAEMU,EAA4G,CAChH,SAAUb,EACV,KAAMH,EACN,MAAOK,EACP,KAAMY,CACR,EAEaC,EACXC,GAC6CH,EAAyBG,CAAO"}
1	+ {"version":3,"file":"SimpleAvatar.js","sources":["../../../../../src/components/Avatar/components/SimpleAvatar.tsx"],"sourcesContent":["import { type FC, useState, useEffect } from 'react';\n\nimport type { SimpleVariantComponentProps, VariantType } from '../utils/useSimpleProps';\nimport PersonSolid from '../../Icon/components/PersonSolid';\nimport * as Styled from '../SimpleAvatar.styles';\nimport Flag from '../../Flag/Flag';\n\nconst AvatarIcon: FC<SimpleVariantComponentProps<'icon'>> = () => <PersonSolid aria-label=\"Default user avatar\" />;\nconst AvatarInitials: FC<SimpleVariantComponentProps<'initials'>> = ({ abbreviation }) =>\n abbreviation && abbreviation.length > 0 ? abbreviation.slice(0, 2) : <AvatarIcon />;\nconst AvatarPhoto: FC<SimpleVariantComponentProps<'photo'>> = ({ src, alt }) => {\n const [hasError, setHasError] = useState(false);\n const [loadedSrc, setLoadedSrc] = useState<string>();\n\n useEffect(() => {\n setHasError(false);\n setLoadedSrc(undefined);\n const img = new Image();\n img.onload = () => setLoadedSrc(src);\n img.onerror = () => setHasError(true);\n img.src = src;\n }, [src]);\n\n if (!loadedSrc \|\| hasError) {\n return <AvatarIcon />;\n }\n\n return <Styled.Image key={src} src={loadedSrc} alt={alt} />;\n};\n\nconst SIMPLE_AVATAR_COMPONENTS: { readonly [Variant in VariantType]: FC<SimpleVariantComponentProps<Variant>> } = {\n initials: AvatarInitials,\n icon: AvatarIcon,\n photo: AvatarPhoto,\n flag: Flag,\n} as const;\n\nexport const getSimpleAvatarComponent = <Variant extends VariantType>(\n variant: Variant,\n): FC<SimpleVariantComponentProps<Variant>> => SIMPLE_AVATAR_COMPONENTS[variant];\n"],"names":["AvatarIcon","jsx","PersonSolid","AvatarInitials","abbreviation","AvatarPhoto","src","alt","hasError","setHasError","useState","loadedSrc","setLoadedSrc","useEffect","img","Styled.Image","SIMPLE_AVATAR_COMPONENTS","Flag","getSimpleAvatarComponent","variant"],"mappings":"6RAOMA,EAAsD,IAAMC,EAAAA,IAACC,EAAA,CAAY,aAAW,qBAAA,CAAsB,EAC1GC,EAA8D,CAAC,CAAE,aAAAC,CAAA,IACrEA,GAAgBA,EAAa,OAAS,EAAIA,EAAa,MAAM,EAAG,CAAC,QAAKJ,EAAA,EAAW,EAC7EK,EAAwD,CAAC,CAAE,IAAAC,EAAK,IAAAC,KAAU,CAC9E,KAAM,CAACC,EAAUC,CAAW,EAAIC,EAAAA,SAAS,EAAK,EACxC,CAACC,EAAWC,CAAY,EAAIF,WAAA,EAWlC,OATAG,EAAAA,UAAU,IAAM,CACdJ,EAAY,EAAK,EACjBG,EAAa,MAAS,EACtB,MAAME,EAAM,IAAI,MAChBA,EAAI,OAAS,IAAMF,EAAaN,CAAG,EACnCQ,EAAI,QAAU,IAAML,EAAY,EAAI,EACpCK,EAAI,IAAMR,CACZ,EAAG,CAACA,CAAG,CAAC,EAEJ,CAACK,GAAaH,QACRR,EAAA,EAAW,QAGbe,EAAAA,MAAA,CAAuB,IAAKJ,EAAW,IAAAJ,GAArBD,CAA+B,CAC3D,EAEMU,EAA4G,CAChH,SAAUb,EACV,KAAMH,EACN,MAAOK,EACP,KAAMY,CACR,EAEaC,EACXC,GAC6CH,EAAyBG,CAAO"}

package/build/cjs/components/Badge/Badge.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";const s=require("react/jsx-runtime"),g=require("react"),m=require("classnames"),q=require("../../react-base/src/consts/classes.js"),B=require("../../react-base/src/components/Badge/Badge.utils.js"),r=require("./Badge.styles.js"),$=g.forwardRef(({className:t,...n},i)=>{const{size:e,variant:d,sentiment:o,iconComponent:a,shouldRenderChildren:c,shouldRenderIcon:u,children:l,fixedWidth:h,...x}=B.useProps(n);return s.jsxs(r.Badge,{className:m(q.BADGE_CLASS,t),ref:i,$size:e,$variant:d,$fixedWidth:h,$sentiment:o,...x,children:[u&&a,c&&s.jsx(r.BadgeText,{$size:e,children:l})]})});module.exports=$;
+"use strict";const s=require("react/jsx-runtime"),g=require("react"),q=require("classnames"),B=require("../../react-base/src/consts/classes.js"),m=require("../../react-base/src/components/Badge/Badge.utils.js"),r=require("./Badge.styles.js"),$=g.forwardRef(({className:t,...i},n)=>{const{size:e,variant:d,sentiment:a,icon:c,shouldRenderChildren:o,shouldRenderIcon:u,children:l,fixedWidth:h,...x}=m.useProps(i);return s.jsxs(r.Badge,{className:q(B.BADGE_CLASS,t),ref:n,$size:e,$variant:d,$fixedWidth:h,$sentiment:a,...x,children:[u&&c,o&&s.jsx(r.BadgeText,{$size:e,children:l})]})});module.exports=$;
 //# sourceMappingURL=Badge.js.map

package/build/cjs/components/Badge/Badge.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Badge.js","sources":["../../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport classNames from 'classnames';\nimport { BADGE_CLASS } from 'acinguiux-ds-react-base/consts';\nimport { BadgeUtils } from 'acinguiux-ds-react-base/components/Badge';\n\nimport * as Styled from './Badge.styles';\nimport type { IBadgeProps } from './Badge.types';\n\nconst Badge = forwardRef<HTMLDivElement, IBadgeProps>(({ className, ...props }, ref) => {\n const {\n size,\n variant,\n sentiment,\n ~~iconComponent~~,\n shouldRenderChildren,\n shouldRenderIcon,\n children,\n fixedWidth,\n ...badgeProps\n } = BadgeUtils.useProps(props);\n\n return (\n <Styled.Badge\n className={classNames(BADGE_CLASS, className)}\n ref={ref}\n $size={size}\n $variant={variant}\n $fixedWidth={fixedWidth}\n $sentiment={sentiment}\n {...badgeProps}\n >\n {shouldRenderIcon && ~~iconComponent~~}\n {shouldRenderChildren && <Styled.BadgeText $size={size}>{children}</Styled.BadgeText>}\n </Styled.Badge>\n );\n});\n\nexport default Badge;\n"],"names":["Badge","forwardRef","className","props","ref","size","variant","sentiment","~~iconComponent~~","shouldRenderChildren","shouldRenderIcon","children","fixedWidth","badgeProps","BadgeUtils.useProps","jsxs","Styled.Badge","classNames","BADGE_CLASS","jsx","Styled.BadgeText"],"mappings":"kPASMA,EAAQC,EAAAA,WAAwC,CAAC,CAAE,UAAAC,EAAW,GAAGC,CAAA,EAASC,IAAQ,CACtF,KAAM,CACJ,KAAAC,EACA,QAAAC,EACA,UAAAC,EACA,~~cAAAC~~,EACA,qBAAAC,EACA,iBAAAC,EACA,SAAAC,EACA,WAAAC,EACA,GAAGC,CAAA,EACDC,EAAAA,SAAoBX,CAAK,EAE7B,OACEY,EAAAA,KAACC,EAAAA,MAAA,CACC,UAAWC,EAAWC,EAAAA,YAAahB,CAAS,EAC5C,IAAAE,EACA,MAAOC,EACP,SAAUC,EACV,YAAaM,EACb,WAAYL,EACX,GAAGM,EAEH,SAAA,CAAAH,GAAoBF,EACpBC,GAAwBU,EAAAA,IAACC,EAAAA,UAAA,CAAiB,MAAOf,EAAO,SAAAM,CAAA,CAAS,CAAA,CAAA,CAAA,CAGxE,CAAC"}
1	+ {"version":3,"file":"Badge.js","sources":["../../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport classNames from 'classnames';\nimport { BADGE_CLASS } from 'acinguiux-ds-react-base/consts';\nimport { BadgeUtils } from 'acinguiux-ds-react-base/components/Badge';\n\nimport * as Styled from './Badge.styles';\nimport type { IBadgeProps } from './Badge.types';\n\nconst Badge = forwardRef<HTMLDivElement, IBadgeProps>(({ className, ...props }, ref) => {\n const {\n size,\n variant,\n sentiment,\n icon,\n shouldRenderChildren,\n shouldRenderIcon,\n children,\n fixedWidth,\n ...badgeProps\n } = BadgeUtils.useProps(props);\n\n return (\n <Styled.Badge\n className={classNames(BADGE_CLASS, className)}\n ref={ref}\n $size={size}\n $variant={variant}\n $fixedWidth={fixedWidth}\n $sentiment={sentiment}\n {...badgeProps}\n >\n {shouldRenderIcon && icon}\n {shouldRenderChildren && <Styled.BadgeText $size={size}>{children}</Styled.BadgeText>}\n </Styled.Badge>\n );\n});\n\nexport default Badge;\n"],"names":["Badge","forwardRef","className","props","ref","size","variant","sentiment","icon","shouldRenderChildren","shouldRenderIcon","children","fixedWidth","badgeProps","BadgeUtils.useProps","jsxs","Styled.Badge","classNames","BADGE_CLASS","jsx","Styled.BadgeText"],"mappings":"kPASMA,EAAQC,EAAAA,WAAwC,CAAC,CAAE,UAAAC,EAAW,GAAGC,CAAA,EAASC,IAAQ,CACtF,KAAM,CACJ,KAAAC,EACA,QAAAC,EACA,UAAAC,EACA,KAAAC,EACA,qBAAAC,EACA,iBAAAC,EACA,SAAAC,EACA,WAAAC,EACA,GAAGC,CAAA,EACDC,EAAAA,SAAoBX,CAAK,EAE7B,OACEY,EAAAA,KAACC,EAAAA,MAAA,CACC,UAAWC,EAAWC,EAAAA,YAAahB,CAAS,EAC5C,IAAAE,EACA,MAAOC,EACP,SAAUC,EACV,YAAaM,EACb,WAAYL,EACX,GAAGM,EAEH,SAAA,CAAAH,GAAoBF,EACpBC,GAAwBU,EAAAA,IAACC,EAAAA,UAAA,CAAiB,MAAOf,EAAO,SAAAM,CAAA,CAAS,CAAA,CAAA,CAAA,CAGxE,CAAC"}

package/build/cjs/components/Button/Button.styles.js CHANGED Viewed

@@ -1,18 +1,18 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("styled-components"),m=require("../../react-base/src/utils/stylesUtils.js"),u=require("../../react-base/src/theme/types/layer.js"),d=require("../../react-base/src/components/Button/Button.utils.js"),b=require("../../react-base/src/components/Button/Button.styles.js"),i=require("acinguiux-ds-fabrics"),B=require("../../react-base/src/consts/index.js"),S=n.styled.span``,l=n.styled.span``,r=(e,t)=>n.css(({$size:s,theme:o})=>n.css`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("styled-components"),m=require("../../react-base/src/utils/stylesUtils.js"),u=require("../../react-base/src/theme/types/layer.js"),d=require("../../react-base/src/components/Button/Button.utils.js"),b=require("../../react-base/src/components/Button/Button.styles.js"),i=require("acinguiux-ds-fabrics"),B=require("../../react-base/src/consts/index.js"),F=require("../../react-base/src/consts/classes.js"),S=n.styled.span``,a=n.styled.span``,r=(e,t)=>n.css(({$size:s,theme:o})=>n.css`
       ${b.containerStylesForVariant(e)};
       &[aria-busy='true'] {
-        & > ${l}, & > ${l} > svg,
-        & ${l} > ${S} {
+        & > ${a}, & > ${a} > svg,
+        & ${a} > ${S} {
           opacity: 0;
           min-height: 0;
           height: 0;
         }
       }
-      & ${l}, &:is(a) {
+      & ${a} {
         ${b.stylesForVariant(e)};
         ${d.getSizeStyles(o,s)};
-        & > svg {
+        & > .${F.ICON_CLASS} {
           ${d.getSvgStyles(s)};
         }
       }
@@ -20,7 +20,7 @@
       &:focus-visible {
         ${m.getFocusStyles(o,e==="filled"&&t!=="Foundation")};
       }
-    `),a=(e,t,s=B.Variants.Filled,o={})=>{const c=d.getFabricStyles(e,s,t,o);return n.css`
+    `),l=(e,t,s=B.Variants.Filled,o={})=>{const c=d.getFabricStyles(e,s,t,o);return n.css`
     &,
     &:not(:disabled) {
       ${c.resting};
@@ -40,10 +40,10 @@
     }
   `},y=e=>n.css`
   ${r(e)};
-  ${({$variant:t,theme:s})=>a(s,"Foundation",t,{transparentRestingState:t==="filled"?i.FabricsVariables.TransparentRestingStates.False:i.FabricsVariables.TransparentRestingStates.True})};
+  ${({$variant:t,theme:s})=>l(s,"Foundation",e??t,{transparentRestingState:(e??t)==="filled"?i.FabricsVariables.TransparentRestingStates.False:i.FabricsVariables.TransparentRestingStates.True})};
 `,g=n.styled.button`
   ${y()};
-`,F=n.styled.a(({$variant:e,theme:t,$disabled:s})=>n.css`
+`,V=n.styled.a(({$variant:e,theme:t,$disabled:s})=>n.css`
     ${r()};
     text-decoration: underline;
@@ -59,18 +59,18 @@
       }
     `};
-    ${a(t,"Link",e,{disabled:s,transparentRestingState:e==="filled"?i.FabricsVariables.TransparentRestingStates.False:i.FabricsVariables.TransparentRestingStates.True})};
-  `),V=n.styled.button(({$variant:e,theme:t,$sentiment:s})=>n.css`
+    ${l(t,"Link",e,{disabled:s,transparentRestingState:e==="filled"?i.FabricsVariables.TransparentRestingStates.False:i.FabricsVariables.TransparentRestingStates.True})};
+  `),$=n.styled.button(({$variant:e,theme:t,$sentiment:s})=>n.css`
     ${r(e,"Sentiment")};
-    ${a(t,"Sentiment",e,{sentiment:s,sentimentProminence:e==="filled"?i.FabricsVariables.SentimentProminences.Strong:i.FabricsVariables.SentimentProminences.Transparent})};
-  `),$=n.styled.button(({$variant:e,theme:t,$sentiment:s,$sentimentProminence:o})=>n.css`
+    ${l(t,"Sentiment",e,{sentiment:s,sentimentProminence:e==="filled"?i.FabricsVariables.SentimentProminences.Strong:i.FabricsVariables.SentimentProminences.Transparent})};
+  `),O=n.styled.button(({$variant:e,theme:t,$sentiment:s,$sentimentProminence:o})=>n.css`
     ${r(e,"On Sentiment")};
-    ${a(t,"On Sentiment",e,{sentiment:s,sentimentProminence:o})};
-  `),O=n.styled.button(({$variant:e,theme:t,$brand:s})=>n.css`
+    ${l(t,"On Sentiment",e,{sentiment:s,sentimentProminence:o})};
+  `),p=n.styled.button(({$variant:e,theme:t,$brand:s})=>n.css`
     ${r(e,"On Brand")};
-    ${a(t,"On Brand",e,{brand:s})};
-  `),p=n.styled.button(({$variant:e,theme:t})=>n.css`
+    ${l(t,"On Brand",e,{brand:s})};
+  `),L=n.styled.button(({$variant:e,theme:t})=>n.css`
     ${r(e,"On Selected")};
-    ${a(t,"On Selected",e,{selectedProminence:e==="filled"?i.FabricsVariables.SelectedProminences.Strong:i.FabricsVariables.SelectedProminences.Subtle})};
-  `);exports.Button=g;exports.ButtonLabel=S;exports.ButtonLabelContainer=l;exports.ButtonLink=F;exports.OnBrandButton=O;exports.OnSelectedButton=p;exports.OnSentimentButton=$;exports.SentimentButton=V;exports.buttonCssWithVariant=y;
+    ${l(t,"On Selected",e,{selectedProminence:e==="filled"?i.FabricsVariables.SelectedProminences.Strong:i.FabricsVariables.SelectedProminences.Subtle})};
+  `);exports.Button=g;exports.ButtonLabel=S;exports.ButtonLabelContainer=a;exports.ButtonLink=V;exports.OnBrandButton=p;exports.OnSelectedButton=L;exports.OnSentimentButton=O;exports.SentimentButton=$;exports.buttonCssWithVariant=y;
 //# sourceMappingURL=Button.styles.js.map

package/build/cjs/components/Button/Button.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.styles.js","sources":["../../../../src/components/Button/Button.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\nimport { getFocusStyles } from 'acinguiux-ds-react-base/utils/stylesUtils';\nimport { type Theme, type ModesType, Variables } from 'acinguiux-ds-react-base/theme';\nimport { ButtonStyles, ButtonTypes, ButtonUtils } from 'acinguiux-ds-react-base/components/Button';\nimport { FabricsVariables } from 'acinguiux-ds-fabrics';\nimport { Variants } from 'acinguiux-ds-react-base/consts';\n\nimport type {\n StyledButtonProps,\n StyledOnBrandButtonProps,\n StyledOnSelectedButtonProps,\n StyledOnSentimentButtonProps,\n StyledSentimentButtonProps,\n} from './Button.types';\n\nexport const ButtonLabel = styled.span``;\nexport const ButtonLabelContainer = styled.span``;\n\nconst commonStylesForVariant = (variant?: ButtonTypes.Variant, style?: ButtonUtils.ButtonKinds) =>\n css<StyledButtonProps>(\n ({ $size, theme }) => css<StyledButtonProps>`\n ${ButtonStyles.containerStylesForVariant(variant)};\n &[aria-busy='true'] {\n & > ${ButtonLabelContainer}, & > ${ButtonLabelContainer} > svg,\n & ${ButtonLabelContainer} > ${ButtonLabel} {\n opacity: 0;\n min-height: 0;\n height: 0;\n }\n }\n\n & ${ButtonLabelContainer}, ~~&:is(a)~~ {\n ${ButtonStyles.stylesForVariant(variant)};\n ${ButtonUtils.getSizeStyles(theme, $size)};\n & > ~~svg~~ {\n ${ButtonUtils.getSvgStyles($size)};\n }\n }\n\n &:focus-visible {\n ${getFocusStyles(theme, variant === 'filled' && style !== 'Foundation')};\n }\n `,\n );\n\nconst stateStyles = (\n theme: Theme,\n style: ButtonUtils.ButtonKinds,\n variant: ButtonTypes.Variant = Variants.Filled,\n modes: ModesType = {},\n) => {\n const styles = ButtonUtils.getFabricStyles(theme, variant, style, modes);\n\n return css`\n &,\n &:not(:disabled) {\n ${styles.resting};\n }\n\n &:disabled {\n cursor: not-allowed;\n ${styles.disabled};\n }\n\n &:not(:disabled):hover {\n ${styles.hover};\n }\n\n &:not(:disabled):active {\n ${styles.press};\n }\n `;\n};\n\nexport const buttonCssWithVariant = (variant?: ButtonTypes.Variant) => css<StyledButtonProps>`\n ${commonStylesForVariant(variant)};\n ${({ $variant, theme }) =>\n stateStyles(theme, 'Foundation', variant ?? $variant, {\n transparentRestingState:\n (variant ?? $variant) === 'filled'\n ? FabricsVariables.TransparentRestingStates.False\n : FabricsVariables.TransparentRestingStates.True,\n })};\n`;\n\nexport const Button = styled.button<StyledButtonProps>`\n ${buttonCssWithVariant()};\n`;\n\nexport const ButtonLink = styled.a<StyledButtonProps>(\n ({ $variant, theme, $disabled }) => css<StyledButtonProps>`\n ${commonStylesForVariant()};\n text-decoration: underline;\n\n &[aria-disabled='true'] {\n cursor: not-allowed;\n pointer-events: none;\n }\n\n ${$variant &&\n $variant !== 'filled' &&\n css`\n &:link:visited {\n color: ${theme.layer({ disabled: $disabled })[Variables.TextOnFoundationLinkVisited]};\n border-color: ${theme.layer({ disabled: $disabled })[Variables.TextOnFoundationLinkVisited]};\n }\n `};\n\n ${stateStyles(theme, 'Link', $variant, {\n disabled: $disabled,\n transparentRestingState:\n $variant === 'filled'\n ? FabricsVariables.TransparentRestingStates.False\n : FabricsVariables.TransparentRestingStates.True,\n })};\n `,\n);\n\nexport const SentimentButton = styled.button<StyledSentimentButtonProps>(\n ({ $variant, theme, $sentiment }) => css<StyledSentimentButtonProps>`\n ${commonStylesForVariant($variant, 'Sentiment')};\n ${stateStyles(theme, 'Sentiment', $variant, {\n sentiment: $sentiment,\n sentimentProminence:\n $variant === 'filled'\n ? FabricsVariables.SentimentProminences.Strong\n : FabricsVariables.SentimentProminences.Transparent,\n })};\n `,\n);\n\nexport const OnSentimentButton = styled.button<StyledOnSentimentButtonProps>(\n ({ $variant, theme, $sentiment, $sentimentProminence }) => css<StyledOnSentimentButtonProps>`\n ${commonStylesForVariant($variant, 'On Sentiment')};\n ${stateStyles(theme, 'On Sentiment', $variant, {\n sentiment: $sentiment,\n sentimentProminence: $sentimentProminence,\n })};\n `,\n);\n\nexport const OnBrandButton = styled.button<StyledOnBrandButtonProps>(\n ({ $variant, theme, $brand }) => css<StyledOnBrandButtonProps>`\n ${commonStylesForVariant($variant, 'On Brand')};\n ${stateStyles(theme, 'On Brand', $variant, { brand: $brand })};\n `,\n);\n\nexport const OnSelectedButton = styled.button<StyledOnSelectedButtonProps>(\n ({ $variant, theme }) => css<StyledOnSelectedButtonProps>`\n ${commonStylesForVariant($variant, 'On Selected')};\n ${stateStyles(theme, 'On Selected', $variant, {\n selectedProminence:\n $variant === 'filled'\n ? FabricsVariables.SelectedProminences.Strong\n : FabricsVariables.SelectedProminences.Subtle,\n })};\n `,\n);\n"],"names":["ButtonLabel","styled","ButtonLabelContainer","commonStylesForVariant","variant","style","css","$size","theme","ButtonStyles.containerStylesForVariant","ButtonStyles.stylesForVariant","ButtonUtils.getSizeStyles","ButtonUtils.getSvgStyles","getFocusStyles","stateStyles","Variants","modes","styles","ButtonUtils.getFabricStyles","buttonCssWithVariant","$variant","FabricsVariables","Button","ButtonLink","$disabled","Variables","SentimentButton","$sentiment","OnSentimentButton","$sentimentProminence","OnBrandButton","$brand","OnSelectedButton"],"mappings":"~~4dAeaA~~,EAAcC,EAAAA,OAAO,OACrBC,EAAuBD,EAAAA,OAAO,OAErCE,EAAyB,CAACC,EAA+BC,IAC7DC,EAAAA,IACE,CAAC,CAAE,MAAAC,EAAO,MAAAC,CAAA,IAAYF,EAAAA;AAAAA,QAClBG,EAAAA,0BAAuCL,CAAO,CAAC;AAAA;AAAA,cAEzCF,CAAoB,SAASA,CAAoB;AAAA,YACnDA,CAAoB,MAAMF,CAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAOvCE,CAAoB;AAAA,UACpBQ,EAAAA,iBAA8BN,CAAO,CAAC;AAAA,UACtCO,EAAAA,cAA0BH,EAAOD,CAAK,CAAC;AAAA;AAAA,~~YAErCK~~,EAAAA,~~aAAyBL~~,CAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,~~UAKjCM~~,EAAAA,~~eAAeL~~,EAAOJ,IAAY,UAAYC,IAAU,YAAY,CAAC;AAAA;AAAA,KAG7E,~~EAEIS~~,EAAc,~~CAClBN~~,EACAH,EACAD,EAA+BW,EAAAA,SAAS,OACxCC,EAAmB,KAChB,CACH,MAAMC,EAASC,EAAAA,~~gBAA4BV~~,EAAOJ,EAASC,~~EAAOW~~,CAAK,EAEvE,~~OAAOV~~,EAAAA;AAAAA;AAAAA;AAAAA,~~QAGDW~~,EAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,QAKdA,EAAO,QAAQ;AAAA;AAAA;AAAA;AAAA,QAIfA,EAAO,KAAK;AAAA;AAAA;AAAA;AAAA,QAIZA,EAAO,KAAK;AAAA;AAAA,GAGpB,EAEaE,~~EAAwBf~~,GAAkCE,EAAAA;AAAAA,IACnEH,EAAuBC,CAAO,CAAC;AAAA,IAC/B,CAAC,CAAE,~~SAAAgB~~,EAAU,~~MAAAZ~~,CAAA,~~IACbM~~,~~EAAYN~~,EAAO,~~aAAyBY~~,EAAU,CACpD,~~wBACcA~~,~~IAAc~~,SACtBC,EAAAA,iBAAiB,yBAAyB,MAC1CA,EAAAA,iBAAiB,yBAAyB,IAClD,CAAC,CAAC;AAAA,EAGOC,~~EAASrB~~,EAAAA,OAAO;AAAA,~~IACzBkB~~,GAAsB;AAAA,EAGbI,~~EAAatB~~,EAAAA,OAAO,EAC/B,CAAC,CAAE,~~SAAAmB~~,EAAU,~~MAAAZ~~,EAAO,~~UAAAgB~~,~~KAAgBlB~~,EAAAA;AAAAA,MAChCH,GAAwB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,~~MAQxBiB~~,GACFA,IAAa,~~UACbd~~,EAAAA;AAAAA;AAAAA,iBAEaE,EAAM,MAAM,CAAE,~~SAAUgB~~,EAAW,EAAEC,EAAAA,UAAU,2BAA2B,CAAC;AAAA,~~wBACpEjB~~,EAAM,MAAM,CAAE,~~SAAUgB~~,EAAW,EAAEC,EAAAA,UAAU,2BAA2B,CAAC;AAAA;AAAA,KAE9F;AAAA;AAAA,MAECX,~~EAAYN~~,EAAO,~~OAAQY~~,EAAU,CACrC,SAAUI,EACV,wBACEJ,IAAa,SACTC,EAAAA,iBAAiB,yBAAyB,MAC1CA,EAAAA,iBAAiB,yBAAyB,IAAA,CACjD,CAAC;AAAA,GAEN,EAEaK,~~EAAkBzB~~,EAAAA,OAAO,OACpC,CAAC,CAAE,~~SAAAmB~~,EAAU,~~MAAAZ~~,EAAO,~~WAAAmB~~,~~KAAiBrB~~,EAAAA;AAAAA,MACjCH,~~EAAuBiB~~,EAAU,WAAW,CAAC;AAAA,MAC7CN,~~EAAYN~~,EAAO,~~YAAaY~~,EAAU,CAC1C,UAAWO,EACX,oBACEP,IAAa,SACTC,EAAAA,iBAAiB,qBAAqB,OACtCA,EAAAA,iBAAiB,qBAAqB,WAAA,CAC7C,CAAC;AAAA,GAEN,EAEaO,~~EAAoB3B~~,EAAAA,OAAO,OACtC,CAAC,CAAE,~~SAAAmB~~,EAAU,~~MAAAZ~~,EAAO,~~WAAAmB~~,EAAY,qBAAAE,~~KAA2BvB~~,EAAAA;AAAAA,MACvDH,~~EAAuBiB~~,EAAU,cAAc,CAAC;AAAA,MAChDN,~~EAAYN~~,EAAO,~~eAAgBY~~,EAAU,CAC7C,UAAWO,EACX,oBAAqBE,CAAA,CACtB,CAAC;AAAA,GAEN,EAEaC,~~EAAgB7B~~,EAAAA,OAAO,OAClC,CAAC,CAAE,~~SAAAmB~~,EAAU,~~MAAAZ~~,EAAO,~~OAAAuB~~,~~KAAazB~~,EAAAA;AAAAA,MAC7BH,~~EAAuBiB~~,EAAU,UAAU,CAAC;AAAA,MAC5CN,~~EAAYN~~,EAAO,~~WAAYY~~,EAAU,CAAE,MAAOW,CAAA,CAAQ,CAAC;AAAA,GAEjE,EAEaC,~~EAAmB/B~~,EAAAA,OAAO,OACrC,CAAC,CAAE,~~SAAAmB~~,EAAU,~~MAAAZ~~,CAAA,IAAYF,EAAAA;AAAAA,MACrBH,~~EAAuBiB~~,EAAU,aAAa,CAAC;AAAA,MAC/CN,~~EAAYN~~,EAAO,~~cAAeY~~,EAAU,CAC5C,mBACEA,IAAa,SACTC,EAAAA,iBAAiB,oBAAoB,OACrCA,EAAAA,iBAAiB,oBAAoB,MAAA,CAC5C,CAAC;AAAA,GAEN"}
1	+ {"version":3,"file":"Button.styles.js","sources":["../../../../src/components/Button/Button.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\nimport { getFocusStyles } from 'acinguiux-ds-react-base/utils/stylesUtils';\nimport { type Theme, type ModesType, Variables } from 'acinguiux-ds-react-base/theme';\nimport { ButtonStyles, ButtonTypes, ButtonUtils } from 'acinguiux-ds-react-base/components/Button';\nimport { FabricsVariables } from 'acinguiux-ds-fabrics';\nimport { ICON_CLASS, Variants } from 'acinguiux-ds-react-base/consts';\n\nimport type {\n StyledButtonProps,\n StyledOnBrandButtonProps,\n StyledOnSelectedButtonProps,\n StyledOnSentimentButtonProps,\n StyledSentimentButtonProps,\n} from './Button.types';\n\nexport const ButtonLabel = styled.span``;\nexport const ButtonLabelContainer = styled.span``;\n\nconst commonStylesForVariant = (variant?: ButtonTypes.Variant, style?: ButtonUtils.ButtonKinds) =>\n css<StyledButtonProps>(\n ({ $size, theme }) => css<StyledButtonProps>`\n ${ButtonStyles.containerStylesForVariant(variant)};\n &[aria-busy='true'] {\n & > ${ButtonLabelContainer}, & > ${ButtonLabelContainer} > svg,\n & ${ButtonLabelContainer} > ${ButtonLabel} {\n opacity: 0;\n min-height: 0;\n height: 0;\n }\n }\n\n & ${ButtonLabelContainer} {\n ${ButtonStyles.stylesForVariant(variant)};\n ${ButtonUtils.getSizeStyles(theme, $size)};\n & > .${ICON_CLASS} {\n ${ButtonUtils.getSvgStyles($size)};\n }\n }\n\n &:focus-visible {\n ${getFocusStyles(theme, variant === 'filled' && style !== 'Foundation')};\n }\n `,\n );\n\nconst stateStyles = (\n theme: Theme,\n style: ButtonUtils.ButtonKinds,\n variant: ButtonTypes.Variant = Variants.Filled,\n modes: ModesType = {},\n) => {\n const styles = ButtonUtils.getFabricStyles(theme, variant, style, modes);\n\n return css`\n &,\n &:not(:disabled) {\n ${styles.resting};\n }\n\n &:disabled {\n cursor: not-allowed;\n ${styles.disabled};\n }\n\n &:not(:disabled):hover {\n ${styles.hover};\n }\n\n &:not(:disabled):active {\n ${styles.press};\n }\n `;\n};\n\nexport const buttonCssWithVariant = (variant?: ButtonTypes.Variant) => css<StyledButtonProps>`\n ${commonStylesForVariant(variant)};\n ${({ $variant, theme }) =>\n stateStyles(theme, 'Foundation', variant ?? $variant, {\n transparentRestingState:\n (variant ?? $variant) === 'filled'\n ? FabricsVariables.TransparentRestingStates.False\n : FabricsVariables.TransparentRestingStates.True,\n })};\n`;\n\nexport const Button = styled.button<StyledButtonProps>`\n ${buttonCssWithVariant()};\n`;\n\nexport const ButtonLink = styled.a<StyledButtonProps>(\n ({ $variant, theme, $disabled }) => css<StyledButtonProps>`\n ${commonStylesForVariant()};\n text-decoration: underline;\n\n &[aria-disabled='true'] {\n cursor: not-allowed;\n pointer-events: none;\n }\n\n ${$variant &&\n $variant !== 'filled' &&\n css`\n &:link:visited {\n color: ${theme.layer({ disabled: $disabled })[Variables.TextOnFoundationLinkVisited]};\n border-color: ${theme.layer({ disabled: $disabled })[Variables.TextOnFoundationLinkVisited]};\n }\n `};\n\n ${stateStyles(theme, 'Link', $variant, {\n disabled: $disabled,\n transparentRestingState:\n $variant === 'filled'\n ? FabricsVariables.TransparentRestingStates.False\n : FabricsVariables.TransparentRestingStates.True,\n })};\n `,\n);\n\nexport const SentimentButton = styled.button<StyledSentimentButtonProps>(\n ({ $variant, theme, $sentiment }) => css<StyledSentimentButtonProps>`\n ${commonStylesForVariant($variant, 'Sentiment')};\n ${stateStyles(theme, 'Sentiment', $variant, {\n sentiment: $sentiment,\n sentimentProminence:\n $variant === 'filled'\n ? FabricsVariables.SentimentProminences.Strong\n : FabricsVariables.SentimentProminences.Transparent,\n })};\n `,\n);\n\nexport const OnSentimentButton = styled.button<StyledOnSentimentButtonProps>(\n ({ $variant, theme, $sentiment, $sentimentProminence }) => css<StyledOnSentimentButtonProps>`\n ${commonStylesForVariant($variant, 'On Sentiment')};\n ${stateStyles(theme, 'On Sentiment', $variant, {\n sentiment: $sentiment,\n sentimentProminence: $sentimentProminence,\n })};\n `,\n);\n\nexport const OnBrandButton = styled.button<StyledOnBrandButtonProps>(\n ({ $variant, theme, $brand }) => css<StyledOnBrandButtonProps>`\n ${commonStylesForVariant($variant, 'On Brand')};\n ${stateStyles(theme, 'On Brand', $variant, { brand: $brand })};\n `,\n);\n\nexport const OnSelectedButton = styled.button<StyledOnSelectedButtonProps>(\n ({ $variant, theme }) => css<StyledOnSelectedButtonProps>`\n ${commonStylesForVariant($variant, 'On Selected')};\n ${stateStyles(theme, 'On Selected', $variant, {\n selectedProminence:\n $variant === 'filled'\n ? FabricsVariables.SelectedProminences.Strong\n : FabricsVariables.SelectedProminences.Subtle,\n })};\n `,\n);\n"],"names":["ButtonLabel","styled","ButtonLabelContainer","commonStylesForVariant","variant","style","css","$size","theme","ButtonStyles.containerStylesForVariant","ButtonStyles.stylesForVariant","ButtonUtils.getSizeStyles","ICON_CLASS","ButtonUtils.getSvgStyles","getFocusStyles","stateStyles","Variants","modes","styles","ButtonUtils.getFabricStyles","buttonCssWithVariant","$variant","FabricsVariables","Button","ButtonLink","$disabled","Variables","SentimentButton","$sentiment","OnSentimentButton","$sentimentProminence","OnBrandButton","$brand","OnSelectedButton"],"mappings":"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"}

package/build/cjs/components/Card/Card.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";const a=require("react/jsx-runtime"),f=require("react"),h=require("classnames"),n=require("../../react-base/src/consts/index.js"),u=require("./Card.styles.js"),d=require("./components/CardBar/CardBar.js"),w=require("../../react-base/src/consts/classes.js"),R=f.forwardRef(({className:o,size:e=`${n.Sizes.Medium}`,direction:s=`${n.Directions.Vertical}`,padding:c=!0,bgColor:i=!1,headerBorder:j,footerBorder:q,borders:$=!1,outlined:x=!1,children:y,onClick:l,header:r,footer:t,isClickable:C,...b},m)=>a.jsxs(u.Card,{ref:m,className:h(w.CARD_CLASS,o),$size:e,$direction:s,$outlined:x,$isClickable:!!C||!!l,onClick:l,...b,children:[!!r&&a.jsx(d,{size:e,bar:r,type:"header",direction:s,borders:j??$,bgColor:i,padding:c}),a.jsx(u.CardBody,{$size:e,$direction:s,$withHeader:!!r&&Object.keys(r).length>0,$withFooter:!!t&&Object.keys(t).length>0,$padding:c,$borders:$,$bgColor:i,children:y}),!!t&&a.jsx(d,{size:e,bar:t,type:"footer",direction:s,borders:q??$,bgColor:i,padding:c})]}));module.exports=R;
+"use strict";const a=require("react/jsx-runtime"),$=require("react"),f=require("classnames"),o=require("../../react-base/src/consts/index.js"),d=require("./Card.styles.js"),j=require("./components/CardBar/CardBar.js"),w=require("../../react-base/src/consts/classes.js"),A=$.forwardRef(({className:q,size:e=`${o.Sizes.Medium}`,direction:s=`${o.Directions.Vertical}`,padding:c=!0,bgColor:i=!1,headerBorder:x,footerBorder:y,borders:l=!1,outlined:C=!1,children:n,onClick:u,header:r,footer:t,isClickable:b,...h},m)=>a.jsxs(d.Card,{ref:m,className:f(w.CARD_CLASS,q),$size:e,$direction:s,$outlined:C,$isClickable:!!b||!!u,onClick:u,...h,children:[!!r&&a.jsx(j,{size:e,bar:r,type:"header",direction:s,borders:x??l,bgColor:i,padding:c}),$.Children.toArray(n).length>0?a.jsx(d.CardBody,{$size:e,$direction:s,$withHeader:!!r&&Object.keys(r).length>0,$withFooter:!!t&&Object.keys(t).length>0,$padding:c,$borders:l,$bgColor:i,children:n}):null,!!t&&a.jsx(j,{size:e,bar:t,type:"footer",direction:s,borders:y??l,bgColor:i,padding:c})]}));module.exports=A;
 //# sourceMappingURL=Card.js.map

package/build/cjs/components/Card/Card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Card.js","sources":["../../../../src/components/Card/Card.tsx"],"sourcesContent":["import { forwardRef, type ReactElement } from 'react';\n\nimport classNames from 'classnames';\nimport { Sizes, Directions, CARD_CLASS } from 'acinguiux-ds-react-base/consts';\n\nimport * as Styled from './Card.styles';\nimport type { ICardProps } from './Card.types';\nimport CardBar from './components/CardBar/CardBar';\n\nconst Card = forwardRef<HTMLDivElement, ICardProps>(\n (\n {\n className,\n size = `${Sizes.Medium}`,\n direction = `${Directions.Vertical}`,\n padding = true,\n bgColor = false,\n headerBorder,\n footerBorder,\n borders = false,\n outlined = false,\n children,\n onClick,\n header,\n footer,\n isClickable,\n ...rest\n },\n ref,\n ): ReactElement => (\n <Styled.Card\n ref={ref}\n className={classNames(CARD_CLASS, className)}\n $size={size}\n $direction={direction}\n $outlined={outlined}\n $isClickable={!!isClickable \|\| !!onClick}\n onClick={onClick}\n {...rest}\n >\n {!!header && (\n <CardBar\n size={size}\n bar={header}\n type=\"header\"\n direction={direction}\n borders={headerBorder ?? borders}\n bgColor={bgColor}\n padding={padding}\n />\n )}\n <Styled.CardBody\n $size={size}\n $direction={direction}\n $withHeader={!!header && Object.keys(header).length > 0}\n $withFooter={!!footer && Object.keys(footer).length > 0}\n $padding={padding}\n $borders={borders}\n $bgColor={bgColor}\n >\n {children}\n </Styled.CardBody>\n {!!footer && (\n <CardBar\n size={size}\n bar={footer}\n type=\"footer\"\n direction={direction}\n borders={footerBorder ?? borders}\n bgColor={bgColor}\n padding={padding}\n />\n )}\n </Styled.Card>\n ),\n);\n\nexport default Card;\n"],"names":["Card","forwardRef","className","size","Sizes","direction","Directions","padding","bgColor","headerBorder","footerBorder","borders","outlined","children","onClick","header","footer","isClickable","rest","ref","jsxs","Styled.Card","classNames","CARD_CLASS","jsx","CardBar","Styled.CardBody"],"mappings":"8QASMA,EAAOC,EAAAA,WACX,CACE,CACE,UAAAC,EACA,KAAAC,EAAO,GAAGC,QAAM,MAAM,GACtB,UAAAC,EAAY,GAAGC,aAAW,QAAQ,GAClC,QAAAC,EAAU,GACV,QAAAC,EAAU,GACV,aAAAC,EACA,aAAAC,EACA,QAAAC,EAAU,GACV,SAAAC,EAAW,GACX,SAAAC,EACA,QAAAC,EACA,OAAAC,EACA,OAAAC,EACA,YAAAC,EACA,GAAGC,CAAA,EAELC,IAEAC,EAAAA,KAACC,EAAAA,KAAA,CACC,IAAAF,EACA,UAAWG,EAAWC,EAAAA,WAAYrB,CAAS,EAC3C,MAAOC,EACP,WAAYE,EACZ,UAAWO,EACX,aAAc,CAAC,CAACK,GAAe,CAAC,CAACH,EACjC,QAAAA,EACC,GAAGI,EAEH,SAAA,CAAA,CAAC,CAACH,GACDS,EAAAA,IAACC,EAAA,CACC,KAAAtB,EACA,IAAKY,EACL,KAAK,SACL,UAAAV,EACA,QAASI,GAAgBE,EACzB,QAAAH,EACA,QAAAD,CAAA,CAAA,~~EAGJiB~~,EAAAA,~~IAACE~~,EAAAA,SAAA,CACC,~~MAAOvB~~,EACP,WAAYE,EACZ,YAAa,CAAC,CAACU,GAAU,OAAO,KAAKA,CAAM,EAAE,OAAS,EACtD,YAAa,CAAC,CAACC,GAAU,OAAO,KAAKA,CAAM,EAAE,OAAS,EACtD,SAAUT,EACV,SAAUI,EACV,SAAUH,EAET,SAAAK,CAAA,CAAA,~~EAEF~~,CAAC,CAACG,GACDQ,EAAAA,IAACC,EAAA,CACC,KAAAtB,EACA,IAAKa,EACL,KAAK,SACL,UAAAX,EACA,QAASK,GAAgBC,EACzB,QAAAH,EACA,QAAAD,CAAA,CAAA,CACF,CAAA,CAAA,CAIR"}
1	+ {"version":3,"file":"Card.js","sources":["../../../../src/components/Card/Card.tsx"],"sourcesContent":["import { Children, forwardRef, type ReactElement } from 'react';\n\nimport classNames from 'classnames';\nimport { Sizes, Directions, CARD_CLASS } from 'acinguiux-ds-react-base/consts';\n\nimport * as Styled from './Card.styles';\nimport type { ICardProps } from './Card.types';\nimport CardBar from './components/CardBar/CardBar';\n\nconst Card = forwardRef<HTMLDivElement, ICardProps>(\n (\n {\n className,\n size = `${Sizes.Medium}`,\n direction = `${Directions.Vertical}`,\n padding = true,\n bgColor = false,\n headerBorder,\n footerBorder,\n borders = false,\n outlined = false,\n children,\n onClick,\n header,\n footer,\n isClickable,\n ...rest\n },\n ref,\n ): ReactElement => (\n <Styled.Card\n ref={ref}\n className={classNames(CARD_CLASS, className)}\n $size={size}\n $direction={direction}\n $outlined={outlined}\n $isClickable={!!isClickable \|\| !!onClick}\n onClick={onClick}\n {...rest}\n >\n {!!header && (\n <CardBar\n size={size}\n bar={header}\n type=\"header\"\n direction={direction}\n borders={headerBorder ?? borders}\n bgColor={bgColor}\n padding={padding}\n />\n )}\n {Children.toArray(children).length > 0 ? (\n <Styled.CardBody\n $size={size}\n $direction={direction}\n $withHeader={!!header && Object.keys(header).length > 0}\n $withFooter={!!footer && Object.keys(footer).length > 0}\n $padding={padding}\n $borders={borders}\n $bgColor={bgColor}\n >\n {children}\n </Styled.CardBody>\n ) : null}\n {!!footer && (\n <CardBar\n size={size}\n bar={footer}\n type=\"footer\"\n direction={direction}\n borders={footerBorder ?? borders}\n bgColor={bgColor}\n padding={padding}\n />\n )}\n </Styled.Card>\n ),\n);\n\nexport default Card;\n"],"names":["Card","forwardRef","className","size","Sizes","direction","Directions","padding","bgColor","headerBorder","footerBorder","borders","outlined","children","onClick","header","footer","isClickable","rest","ref","jsxs","Styled.Card","classNames","CARD_CLASS","jsx","CardBar","Children","Styled.CardBody"],"mappings":"8QASMA,EAAOC,EAAAA,WACX,CACE,CACE,UAAAC,EACA,KAAAC,EAAO,GAAGC,QAAM,MAAM,GACtB,UAAAC,EAAY,GAAGC,aAAW,QAAQ,GAClC,QAAAC,EAAU,GACV,QAAAC,EAAU,GACV,aAAAC,EACA,aAAAC,EACA,QAAAC,EAAU,GACV,SAAAC,EAAW,GACX,SAAAC,EACA,QAAAC,EACA,OAAAC,EACA,OAAAC,EACA,YAAAC,EACA,GAAGC,CAAA,EAELC,IAEAC,EAAAA,KAACC,EAAAA,KAAA,CACC,IAAAF,EACA,UAAWG,EAAWC,EAAAA,WAAYrB,CAAS,EAC3C,MAAOC,EACP,WAAYE,EACZ,UAAWO,EACX,aAAc,CAAC,CAACK,GAAe,CAAC,CAACH,EACjC,QAAAA,EACC,GAAGI,EAEH,SAAA,CAAA,CAAC,CAACH,GACDS,EAAAA,IAACC,EAAA,CACC,KAAAtB,EACA,IAAKY,EACL,KAAK,SACL,UAAAV,EACA,QAASI,GAAgBE,EACzB,QAAAH,EACA,QAAAD,CAAA,CAAA,EAGHmB,EAAAA,SAAS,QAAQb,CAAQ,EAAE,OAAS,EACnCW,EAAAA,IAACG,EAAAA,SAAA,CACC,MAAOxB,EACP,WAAYE,EACZ,YAAa,CAAC,CAACU,GAAU,OAAO,KAAKA,CAAM,EAAE,OAAS,EACtD,YAAa,CAAC,CAACC,GAAU,OAAO,KAAKA,CAAM,EAAE,OAAS,EACtD,SAAUT,EACV,SAAUI,EACV,SAAUH,EAET,SAAAK,CAAA,CAAA,EAED,KACH,CAAC,CAACG,GACDQ,EAAAA,IAACC,EAAA,CACC,KAAAtB,EACA,IAAKa,EACL,KAAK,SACL,UAAAX,EACA,QAASK,GAAgBC,EACzB,QAAAH,EACA,QAAAD,CAAA,CAAA,CACF,CAAA,CAAA,CAIR"}

package/build/cjs/components/Card/Card.styles.js CHANGED Viewed

@@ -1,10 +1,10 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("styled-components"),i=require("../../react-base/src/consts/index.js"),s=require("../../react-base/src/components/Card/Card.consts.js"),c=require("../../react-base/src/theme/types/layer.js"),g=require("../../react-base/src/utils/stylesUtils.js"),y=require("../../react-base/src/utils/sizesUtils.js"),$=require("./components/CardBar/CardBar.styles.js"),b=o.styled.div(({$size:r,$outlined:d,$direction:n,$isClickable:a,theme:t})=>{const e=t.layer({foundation:"surface"});return o.css`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("styled-components"),i=require("../../react-base/src/consts/index.js"),s=require("../../react-base/src/components/Card/Card.consts.js"),c=require("../../react-base/src/theme/types/layer.js"),g=require("../../react-base/src/utils/stylesUtils.js"),y=require("../../react-base/src/utils/sizesUtils.js"),$=require("./components/CardBar/CardBar.styles.js"),b=o.styled.div(({$size:r,$outlined:e,$direction:n,$isClickable:a,theme:t})=>{const d=t.layer({foundation:"surface"});return o.css`
       display: flex;
       flex-direction: ${n===i.Directions.Vertical?"column":"row"};
       width: 100%;
-      background-color: ${e[c.Variables.BackgroundFoundation]};
-      ${d&&o.css`
-        border: 1px solid ${e[c.Variables.BorderOnFoundationSubtle]};
+      background-color: ${d[c.Variables.BackgroundFoundation]};
+      ${e&&o.css`
+        border: 1px solid ${d[c.Variables.BorderOnFoundationSubtle]};
       `};
       transition: filter 0.3s ease;
       border-radius: ${s.consts[r].borderRadius}px;
@@ -34,7 +34,7 @@
   width: 100%;
   height: 100%;
   transition: transform 0.5s;
-`,f=o.styled(b)(({$size:r=`${i.Sizes.Medium}`,$backgroundImage:d,$interactive:n,$backgroundPosition:a="center",theme:t})=>o.css`
+`,f=o.styled(b)(({$size:r=`${i.Sizes.Medium}`,$backgroundImage:e,$interactive:n,$backgroundPosition:a="center",theme:t})=>o.css`
     position: relative;
     align-items: flex-end;
     height: 100%;
@@ -49,8 +49,8 @@
     }
     & > ${l} {
-      ${d&&o.css`
-        background-image: url(${d});
+      ${e&&o.css`
+        background-image: url(${e});
         background-position: ${a};
         background-size: cover;
       `}
@@ -61,33 +61,32 @@
         transform: scale(1.05);
       }
     `}
-  `),x=o.styled.div(({$size:r,$padding:d,$bgColor:n,$withHeader:a,$withFooter:t,$direction:e,theme:u})=>{const p=u.layer({foundation:n?"section":"surface"});return o.css`
+  `),x=o.styled.div(({$size:r,$padding:e,$bgColor:n,$withHeader:a,$withFooter:t,$direction:d,theme:u})=>{const p=u.layer({foundation:n?"section":"surface"});return o.css`
     ${u.typography("paragraph",y.getParagraphTypographySize(r))};
     display: grid;
-    flex-grow: 1;
     color: ${p[c.Variables.TextOnFoundationStrong]};
     background-color: ${p[c.Variables.BackgroundFoundation]};
-    ${d&&o.css`
+    ${e&&o.css`
       padding: ${s.consts[r].padding}px;
     `}
-    ${e===i.Directions.Horizontal&&!a&&o.css`
+    ${d===i.Directions.Horizontal&&!a&&o.css`
       border-top-left-radius: ${s.consts[r].borderRadius}px;
       border-bottom-left-radius: ${s.consts[r].borderRadius}px;
     `}
-      ${e===i.Directions.Horizontal&&!t&&o.css`
+      ${d===i.Directions.Horizontal&&!t&&o.css`
       border-top-right-radius: ${s.consts[r].borderRadius}px;
       border-bottom-right-radius: ${s.consts[r].borderRadius}px;
     `}
-      ${e===i.Directions.Vertical&&!a&&o.css`
+      ${d===i.Directions.Vertical&&!a&&o.css`
       border-top-left-radius: ${s.consts[r].borderRadius}px;
       border-top-right-radius: ${s.consts[r].borderRadius}px;
     `}
-      ${e===i.Directions.Vertical&&!t&&o.css`
+      ${d===i.Directions.Vertical&&!t&&o.css`
       border-bottom-right-radius: ${s.consts[r].borderRadius}px;
       border-bottom-left-radius: ${s.consts[r].borderRadius}px;
     `}

package/build/cjs/components/Card/Card.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Card.styles.js","sources":["../../../../src/components/Card/Card.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\nimport { Directions, Sizes } from 'acinguiux-ds-react-base/consts';\nimport { PickTransient } from 'acinguiux-ds-react-base/types';\nimport { CardConsts } from 'acinguiux-ds-react-base/components/Card';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\nimport { getFocusStyles } from 'acinguiux-ds-react-base/utils/stylesUtils';\nimport { getParagraphTypographySize } from 'acinguiux-ds-react-base/utils/sizesUtils';\n\nimport type { ICardProps, IInsetCardProps } from './Card.types';\nimport { CardBar } from './components/CardBar/CardBar.styles';\n\ntype CardStylePropKeys = 'outlined' \| 'direction' \| 'isClickable' \| 'size';\n\nconst Card = styled.div<Required<PickTransient<ICardProps, CardStylePropKeys>>>(\n ({ $size, $outlined, $direction, $isClickable, theme }) => {\n const layer = theme.layer({ foundation: 'surface' });\n\n return css`\n display: flex;\n flex-direction: ${$direction === Directions.Vertical ? 'column' : 'row'};\n width: 100%;\n background-color: ${layer[Variables.BackgroundFoundation]};\n ${$outlined &&\n css`\n border: 1px solid ${layer[Variables.BorderOnFoundationSubtle]};\n `};\n transition: filter 0.3s ease;\n border-radius: ${CardConsts.consts[$size].borderRadius}px;\n\n ${$isClickable &&\n css`\n text-decoration: none;\n color: inherit;\n cursor: pointer;\n\n &:hover {\n filter: ${theme.dropShadows.low2};\n }\n\n &:active {\n filter: ${theme.dropShadows.low1};\n }\n `}\n\n &:focus-visible {\n ${getFocusStyles(theme)};\n }\n `;\n },\n);\n\nconst InsetCardBody = styled.div`\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n transition: transform 0.5s;\n`;\n\nconst InsetCard = styled(Card)<\n PickTransient<IInsetCardProps, 'backgroundImage' \| 'backgroundPosition' \| 'interactive'>\n>(\n ({ $size = `${Sizes.Medium}`, $backgroundImage, $interactive, $backgroundPosition = 'center', theme }) => css`\n position: relative;\n align-items: flex-end;\n height: 100%;\n padding: ${CardConsts.consts[$size].padding}px;\n border-radius: ${CardConsts.consts[$size].borderRadius}px;\n background-color: ${theme.layer()[Variables.BackgroundFoundation]};\n overflow: hidden;\n\n & > ${CardBar} {\n padding: ${CardConsts.consts[$size].innerCardPadding}px;\n position: relative;\n }\n\n & > ${InsetCardBody} {\n ${$backgroundImage &&\n css`\n background-image: url(${$backgroundImage});\n background-position: ${$backgroundPosition};\n background-size: cover;\n `}\n }\n\n ${$interactive &&\n css`\n &:hover > ${InsetCardBody} {\n transform: scale(1.05);\n }\n `}\n `,\n);\n\ntype CardBodyStylePropKeys = 'padding' \| 'bgColor' \| 'direction' \| 'borders';\n\nconst CardBody = styled.div<\n Required<PickTransient<ICardProps, 'size'>> &\n PickTransient<ICardProps, CardBodyStylePropKeys> & {\n $withHeader?: boolean;\n $withFooter?: boolean;\n }\n>(({ $size, $padding, $bgColor, $withHeader, $withFooter, $direction, theme }) => {\n const layer = theme.layer({ foundation: $bgColor ? 'section' : 'surface' });\n\n return css`\n ${theme.typography('paragraph', getParagraphTypographySize($size))};\n display: grid;\n ~~flex-grow: 1;\n~~ color: ${layer[Variables.TextOnFoundationStrong]};\n background-color: ${layer[Variables.BackgroundFoundation]};\n\n ${$padding &&\n css`\n padding: ${CardConsts.consts[$size].padding}px;\n `}\n\n ${$direction === Directions.Horizontal &&\n !$withHeader &&\n css`\n border-top-left-radius: ${CardConsts.consts[$size].borderRadius}px;\n border-bottom-left-radius: ${CardConsts.consts[$size].borderRadius}px;\n `}\n \n ${$direction === Directions.Horizontal &&\n !$withFooter &&\n css`\n border-top-right-radius: ${CardConsts.consts[$size].borderRadius}px;\n border-bottom-right-radius: ${CardConsts.consts[$size].borderRadius}px;\n `}\n\n ${$direction === Directions.Vertical &&\n !$withHeader &&\n css`\n border-top-left-radius: ${CardConsts.consts[$size].borderRadius}px;\n border-top-right-radius: ${CardConsts.consts[$size].borderRadius}px;\n `}\n\n ${$direction === Directions.Vertical &&\n !$withFooter &&\n css`\n border-bottom-right-radius: ${CardConsts.consts[$size].borderRadius}px;\n border-bottom-left-radius: ${CardConsts.consts[$size].borderRadius}px;\n `}\n\n > img {\n width: 100%;\n height: 100%;\n object-fit: contain;\n }\n `;\n});\n\nexport { Card, InsetCard, InsetCardBody, CardBody };\n"],"names":["Card","styled","$size","$outlined","$direction","$isClickable","theme","layer","css","Directions","Variables","CardConsts.consts","getFocusStyles","InsetCardBody","InsetCard","Sizes","$backgroundImage","$interactive","$backgroundPosition","CardBar","CardBody","$padding","$bgColor","$withHeader","$withFooter","getParagraphTypographySize"],"mappings":"4dAaMA,EAAOC,EAAAA,OAAO,IAClB,CAAC,CAAE,MAAAC,EAAO,UAAAC,EAAW,WAAAC,EAAY,aAAAC,EAAc,MAAAC,KAAY,CACzD,MAAMC,EAAQD,EAAM,MAAM,CAAE,WAAY,UAAW,EAEnD,OAAOE,EAAAA;AAAAA;AAAAA,wBAEaJ,IAAeK,EAAAA,WAAW,SAAW,SAAW,KAAK;AAAA;AAAA,0BAEnDF,EAAMG,YAAU,oBAAoB,CAAC;AAAA,QACvDP,GACFK,EAAAA;AAAAA,4BACsBD,EAAMG,YAAU,wBAAwB,CAAC;AAAA,OAC9D;AAAA;AAAA,uBAEgBC,EAAAA,OAAkBT,CAAK,EAAE,YAAY;AAAA;AAAA,QAEpDG,GACFG,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,oBAMcF,EAAM,YAAY,IAAI;AAAA;AAAA;AAAA;AAAA,oBAItBA,EAAM,YAAY,IAAI;AAAA;AAAA,OAEnC;AAAA;AAAA;AAAA,UAGGM,EAAAA,eAAeN,CAAK,CAAC;AAAA;AAAA,KAG7B,CACF,EAEMO,EAAgBZ,EAAAA,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUvBa,EAAYb,EAAAA,OAAOD,CAAI,EAG3B,CAAC,CAAE,MAAAE,EAAQ,GAAGa,EAAAA,MAAM,MAAM,GAAI,iBAAAC,EAAkB,aAAAC,EAAc,oBAAAC,EAAsB,SAAU,MAAAZ,CAAA,IAAYE,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA,eAI7FG,EAAAA,OAAkBT,CAAK,EAAE,OAAO;AAAA,qBAC1BS,EAAAA,OAAkBT,CAAK,EAAE,YAAY;AAAA,wBAClCI,EAAM,MAAA,EAAQI,EAAAA,UAAU,oBAAoB,CAAC;AAAA;AAAA;AAAA,UAG3DS,SAAO;AAAA,iBACAR,EAAAA,OAAkBT,CAAK,EAAE,gBAAgB;AAAA;AAAA;AAAA;AAAA,UAIhDW,CAAa;AAAA,QACfG,GACFR,EAAAA;AAAAA,gCAC0BQ,CAAgB;AAAA,+BACjBE,CAAmB;AAAA;AAAA,OAE3C;AAAA;AAAA;AAAA,MAGDD,GACFT,EAAAA;AAAAA,kBACcK,CAAa;AAAA;AAAA;AAAA,KAG1B;AAAA,GAEL,EAIMO,EAAWnB,EAAAA,OAAO,IAMtB,CAAC,CAAE,MAAAC,EAAO,SAAAmB,EAAU,SAAAC,EAAU,YAAAC,EAAa,YAAAC,EAAa,WAAApB,EAAY,MAAAE,CAAA,IAAY,CAChF,MAAMC,EAAQD,EAAM,MAAM,CAAE,WAAYgB,EAAW,UAAY,UAAW,EAE1E,OAAOd,EAAAA;AAAAA,MACHF,EAAM,WAAW,YAAamB,EAAAA,2BAA2BvB,CAAK,CAAC,CAAC;AAAA;AAAA~~;AAAA~~,~~aAGzDK~~,EAAMG,YAAU,sBAAsB,CAAC;AAAA,wBAC5BH,EAAMG,YAAU,oBAAoB,CAAC;AAAA;AAAA,MAEvDW,GACFb,EAAAA;AAAAA,iBACaG,EAAAA,OAAkBT,CAAK,EAAE,OAAO;AAAA,KAC5C;AAAA;AAAA,MAECE,IAAeK,EAAAA,WAAW,YAC5B,CAACc,GACDf,EAAAA;AAAAA,gCAC4BG,EAAAA,OAAkBT,CAAK,EAAE,YAAY;AAAA,mCAClCS,EAAAA,OAAkBT,CAAK,EAAE,YAAY;AAAA,KACnE;AAAA;AAAA,QAEGE,IAAeK,EAAAA,WAAW,YAC9B,CAACe,GACDhB,EAAAA;AAAAA,iCAC6BG,EAAAA,OAAkBT,CAAK,EAAE,YAAY;AAAA,oCAClCS,EAAAA,OAAkBT,CAAK,EAAE,YAAY;AAAA,KACpE;AAAA;AAAA,QAEGE,IAAeK,EAAAA,WAAW,UAC9B,CAACc,GACDf,EAAAA;AAAAA,gCAC4BG,EAAAA,OAAkBT,CAAK,EAAE,YAAY;AAAA,iCACpCS,EAAAA,OAAkBT,CAAK,EAAE,YAAY;AAAA,KACjE;AAAA;AAAA,QAEGE,IAAeK,EAAAA,WAAW,UAC9B,CAACe,GACDhB,EAAAA;AAAAA,oCACgCG,EAAAA,OAAkBT,CAAK,EAAE,YAAY;AAAA,mCACtCS,EAAAA,OAAkBT,CAAK,EAAE,YAAY;AAAA,KACnE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQL,CAAC"}
1	+ {"version":3,"file":"Card.styles.js","sources":["../../../../src/components/Card/Card.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\nimport { Directions, Sizes } from 'acinguiux-ds-react-base/consts';\nimport { PickTransient } from 'acinguiux-ds-react-base/types';\nimport { CardConsts } from 'acinguiux-ds-react-base/components/Card';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\nimport { getFocusStyles } from 'acinguiux-ds-react-base/utils/stylesUtils';\nimport { getParagraphTypographySize } from 'acinguiux-ds-react-base/utils/sizesUtils';\n\nimport type { ICardProps, IInsetCardProps } from './Card.types';\nimport { CardBar } from './components/CardBar/CardBar.styles';\n\ntype CardStylePropKeys = 'outlined' \| 'direction' \| 'isClickable' \| 'size';\n\nconst Card = styled.div<Required<PickTransient<ICardProps, CardStylePropKeys>>>(\n ({ $size, $outlined, $direction, $isClickable, theme }) => {\n const layer = theme.layer({ foundation: 'surface' });\n\n return css`\n display: flex;\n flex-direction: ${$direction === Directions.Vertical ? 'column' : 'row'};\n width: 100%;\n background-color: ${layer[Variables.BackgroundFoundation]};\n ${$outlined &&\n css`\n border: 1px solid ${layer[Variables.BorderOnFoundationSubtle]};\n `};\n transition: filter 0.3s ease;\n border-radius: ${CardConsts.consts[$size].borderRadius}px;\n\n ${$isClickable &&\n css`\n text-decoration: none;\n color: inherit;\n cursor: pointer;\n\n &:hover {\n filter: ${theme.dropShadows.low2};\n }\n\n &:active {\n filter: ${theme.dropShadows.low1};\n }\n `}\n\n &:focus-visible {\n ${getFocusStyles(theme)};\n }\n `;\n },\n);\n\nconst InsetCardBody = styled.div`\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n transition: transform 0.5s;\n`;\n\nconst InsetCard = styled(Card)<\n PickTransient<IInsetCardProps, 'backgroundImage' \| 'backgroundPosition' \| 'interactive'>\n>(\n ({ $size = `${Sizes.Medium}`, $backgroundImage, $interactive, $backgroundPosition = 'center', theme }) => css`\n position: relative;\n align-items: flex-end;\n height: 100%;\n padding: ${CardConsts.consts[$size].padding}px;\n border-radius: ${CardConsts.consts[$size].borderRadius}px;\n background-color: ${theme.layer()[Variables.BackgroundFoundation]};\n overflow: hidden;\n\n & > ${CardBar} {\n padding: ${CardConsts.consts[$size].innerCardPadding}px;\n position: relative;\n }\n\n & > ${InsetCardBody} {\n ${$backgroundImage &&\n css`\n background-image: url(${$backgroundImage});\n background-position: ${$backgroundPosition};\n background-size: cover;\n `}\n }\n\n ${$interactive &&\n css`\n &:hover > ${InsetCardBody} {\n transform: scale(1.05);\n }\n `}\n `,\n);\n\ntype CardBodyStylePropKeys = 'padding' \| 'bgColor' \| 'direction' \| 'borders';\n\nconst CardBody = styled.div<\n Required<PickTransient<ICardProps, 'size'>> &\n PickTransient<ICardProps, CardBodyStylePropKeys> & {\n $withHeader?: boolean;\n $withFooter?: boolean;\n }\n>(({ $size, $padding, $bgColor, $withHeader, $withFooter, $direction, theme }) => {\n const layer = theme.layer({ foundation: $bgColor ? 'section' : 'surface' });\n\n return css`\n ${theme.typography('paragraph', getParagraphTypographySize($size))};\n display: grid;\n color: ${layer[Variables.TextOnFoundationStrong]};\n background-color: ${layer[Variables.BackgroundFoundation]};\n\n ${$padding &&\n css`\n padding: ${CardConsts.consts[$size].padding}px;\n `}\n\n ${$direction === Directions.Horizontal &&\n !$withHeader &&\n css`\n border-top-left-radius: ${CardConsts.consts[$size].borderRadius}px;\n border-bottom-left-radius: ${CardConsts.consts[$size].borderRadius}px;\n `}\n \n ${$direction === Directions.Horizontal &&\n !$withFooter &&\n css`\n border-top-right-radius: ${CardConsts.consts[$size].borderRadius}px;\n border-bottom-right-radius: ${CardConsts.consts[$size].borderRadius}px;\n `}\n\n ${$direction === Directions.Vertical &&\n !$withHeader &&\n css`\n border-top-left-radius: ${CardConsts.consts[$size].borderRadius}px;\n border-top-right-radius: ${CardConsts.consts[$size].borderRadius}px;\n `}\n\n ${$direction === Directions.Vertical &&\n !$withFooter &&\n css`\n border-bottom-right-radius: ${CardConsts.consts[$size].borderRadius}px;\n border-bottom-left-radius: ${CardConsts.consts[$size].borderRadius}px;\n `}\n\n > img {\n width: 100%;\n height: 100%;\n object-fit: contain;\n }\n `;\n});\n\nexport { Card, InsetCard, InsetCardBody, CardBody };\n"],"names":["Card","styled","$size","$outlined","$direction","$isClickable","theme","layer","css","Directions","Variables","CardConsts.consts","getFocusStyles","InsetCardBody","InsetCard","Sizes","$backgroundImage","$interactive","$backgroundPosition","CardBar","CardBody","$padding","$bgColor","$withHeader","$withFooter","getParagraphTypographySize"],"mappings":"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"}

package/build/cjs/components/Card/InsetCard.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";const e=require("react/jsx-runtime"),g=require("react"),m=require("classnames"),r=require("../../react-base/src/consts/index.js"),n=require("./Card.styles.js"),f=require("./components/CardBar/CardBar.js"),j=require("../../react-base/src/consts/classes.js"),I=g.forwardRef(({className:o,size:s=`${r.Sizes.Medium}`,bar:i,borders:b,outlined:a=!1,fullBar:c,interactive:d,onClick:t,isClickable:u,backgroundImage:l,backgroundPosition:$,children:q,...C},x)=>e.jsxs(n.InsetCard,{ref:x,className:m(j.CARD_CLASS,o),$size:s,$direction:r.Directions.Horizontal,$outlined:a,$isClickable:!!u||!!t,$interactive:d,onClick:t,$backgroundPosition:$,$backgroundImage:l,...C,children:[e.jsx(n.InsetCardBody,{children:q}),!!i&&e.jsx(f,{size:s,bar:i,fullBar:c,padding:!0,direction:r.Directions.Vertical,type:"floatingFooter"})]}));module.exports=I;
+"use strict";const e=require("react/jsx-runtime"),m=require("react"),f=require("classnames"),r=require("../../react-base/src/consts/index.js"),n=require("./Card.styles.js"),j=require("./components/CardBar/CardBar.js"),I=require("../../react-base/src/consts/classes.js"),p=m.forwardRef(({className:o,size:s=`${r.Sizes.Medium}`,bar:i,borders:a,outlined:c=!1,fullBar:d,interactive:u,onClick:t,isClickable:l,backgroundImage:$,backgroundPosition:q,children:C,...x},g)=>e.jsxs(n.InsetCard,{ref:g,className:f(I.CARD_CLASS,o),$size:s,$direction:r.Directions.Horizontal,$outlined:c,$isClickable:!!l||!!t,$interactive:u,onClick:t,$backgroundPosition:q,$backgroundImage:$,...x,children:[e.jsx(n.InsetCardBody,{children:C}),!!i&&e.jsx(j,{size:s,bar:i,borders:a,fullBar:d,padding:!0,direction:r.Directions.Vertical,type:"floatingFooter"})]}));module.exports=p;
 //# sourceMappingURL=InsetCard.js.map

package/build/cjs/components/Card/InsetCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InsetCard.js","sources":["../../../../src/components/Card/InsetCard.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport classNames from 'classnames';\nimport { Sizes, CARD_CLASS, Directions } from 'acinguiux-ds-react-base/consts';\n\nimport type { IInsetCardProps } from './Card.types';\nimport * as Styled from './Card.styles';\nimport CardBar from './components/CardBar/CardBar';\n\nconst InsetCard = forwardRef<HTMLDivElement, IInsetCardProps>(\n (\n {\n className,\n size = `${Sizes.Medium}`,\n bar,\n borders,\n outlined = false,\n fullBar,\n interactive,\n onClick,\n isClickable,\n backgroundImage,\n backgroundPosition,\n children,\n ...rest\n },\n ref,\n ) => (\n <Styled.InsetCard\n ref={ref}\n className={classNames(CARD_CLASS, className)}\n $size={size}\n $direction={Directions.Horizontal}\n $outlined={outlined}\n $isClickable={!!isClickable \|\| !!onClick}\n $interactive={interactive}\n onClick={onClick}\n $backgroundPosition={backgroundPosition}\n $backgroundImage={backgroundImage}\n {...rest}\n >\n <Styled.InsetCardBody>{children}</Styled.InsetCardBody>\n {!!bar && (\n <CardBar\n size={size}\n bar={bar}\n fullBar={fullBar}\n padding={true}\n direction={Directions.Vertical}\n type=\"floatingFooter\"\n />\n )}\n </Styled.InsetCard>\n ),\n);\n\nexport default InsetCard;\n"],"names":["InsetCard","forwardRef","className","size","Sizes","bar","borders","outlined","fullBar","interactive","onClick","isClickable","backgroundImage","backgroundPosition","children","rest","ref","jsxs","Styled.InsetCard","classNames","CARD_CLASS","Directions","jsx","Styled.InsetCardBody","CardBar"],"mappings":"8QASMA,EAAYC,EAAAA,WAChB,CACE,CACE,UAAAC,EACA,KAAAC,EAAO,GAAGC,QAAM,MAAM,GACtB,IAAAC,EACA,QAAAC,EACA,SAAAC,EAAW,GACX,QAAAC,EACA,YAAAC,EACA,QAAAC,EACA,YAAAC,EACA,gBAAAC,EACA,mBAAAC,EACA,SAAAC,EACA,GAAGC,CAAA,EAELC,IAEAC,EAAAA,KAACC,EAAAA,UAAA,CACC,IAAAF,EACA,UAAWG,EAAWC,EAAAA,WAAYlB,CAAS,EAC3C,MAAOC,EACP,WAAYkB,EAAAA,WAAW,WACvB,UAAWd,EACX,aAAc,CAAC,CAACI,GAAe,CAAC,CAACD,EACjC,aAAcD,EACd,QAAAC,EACA,oBAAqBG,EACrB,iBAAkBD,EACjB,GAAGG,EAEJ,SAAA,CAAAO,MAACC,EAAAA,cAAA,CAAsB,SAAAT,EAAS,EAC/B,CAAC,CAACT,GACDiB,EAAAA,IAACE,EAAA,CACC,KAAArB,EACA,IAAAE,EACA,~~QAAAG~~,EACA,QAAS,GACT,UAAWa,EAAAA,WAAW,SACtB,KAAK,gBAAA,CAAA,CACP,CAAA,CAAA,CAIR"}
1	+ {"version":3,"file":"InsetCard.js","sources":["../../../../src/components/Card/InsetCard.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport classNames from 'classnames';\nimport { Sizes, CARD_CLASS, Directions } from 'acinguiux-ds-react-base/consts';\n\nimport type { IInsetCardProps } from './Card.types';\nimport * as Styled from './Card.styles';\nimport CardBar from './components/CardBar/CardBar';\n\nconst InsetCard = forwardRef<HTMLDivElement, IInsetCardProps>(\n (\n {\n className,\n size = `${Sizes.Medium}`,\n bar,\n borders,\n outlined = false,\n fullBar,\n interactive,\n onClick,\n isClickable,\n backgroundImage,\n backgroundPosition,\n children,\n ...rest\n },\n ref,\n ) => (\n <Styled.InsetCard\n ref={ref}\n className={classNames(CARD_CLASS, className)}\n $size={size}\n $direction={Directions.Horizontal}\n $outlined={outlined}\n $isClickable={!!isClickable \|\| !!onClick}\n $interactive={interactive}\n onClick={onClick}\n $backgroundPosition={backgroundPosition}\n $backgroundImage={backgroundImage}\n {...rest}\n >\n <Styled.InsetCardBody>{children}</Styled.InsetCardBody>\n {!!bar && (\n <CardBar\n size={size}\n bar={bar}\n borders={borders}\n fullBar={fullBar}\n padding={true}\n direction={Directions.Vertical}\n type=\"floatingFooter\"\n />\n )}\n </Styled.InsetCard>\n ),\n);\n\nexport default InsetCard;\n"],"names":["InsetCard","forwardRef","className","size","Sizes","bar","borders","outlined","fullBar","interactive","onClick","isClickable","backgroundImage","backgroundPosition","children","rest","ref","jsxs","Styled.InsetCard","classNames","CARD_CLASS","Directions","jsx","Styled.InsetCardBody","CardBar"],"mappings":"8QASMA,EAAYC,EAAAA,WAChB,CACE,CACE,UAAAC,EACA,KAAAC,EAAO,GAAGC,QAAM,MAAM,GACtB,IAAAC,EACA,QAAAC,EACA,SAAAC,EAAW,GACX,QAAAC,EACA,YAAAC,EACA,QAAAC,EACA,YAAAC,EACA,gBAAAC,EACA,mBAAAC,EACA,SAAAC,EACA,GAAGC,CAAA,EAELC,IAEAC,EAAAA,KAACC,EAAAA,UAAA,CACC,IAAAF,EACA,UAAWG,EAAWC,EAAAA,WAAYlB,CAAS,EAC3C,MAAOC,EACP,WAAYkB,EAAAA,WAAW,WACvB,UAAWd,EACX,aAAc,CAAC,CAACI,GAAe,CAAC,CAACD,EACjC,aAAcD,EACd,QAAAC,EACA,oBAAqBG,EACrB,iBAAkBD,EACjB,GAAGG,EAEJ,SAAA,CAAAO,MAACC,EAAAA,cAAA,CAAsB,SAAAT,EAAS,EAC/B,CAAC,CAACT,GACDiB,EAAAA,IAACE,EAAA,CACC,KAAArB,EACA,IAAAE,EACA,QAAAC,EACA,QAAAE,EACA,QAAS,GACT,UAAWa,EAAAA,WAAW,SACtB,KAAK,gBAAA,CAAA,CACP,CAAA,CAAA,CAIR"}

package/build/cjs/components/Card/components/CardBar/CardBar.styles.js CHANGED Viewed

@@ -1,17 +1,17 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("styled-components"),u=require("../../../../react-base/src/components/Card/Card.consts.js"),f=require("../../../../react-base/src/theme/types/layer.js"),a=require("../../../../react-base/src/consts/index.js"),g=require("../../../Flexbox/Flexbox.js"),x=(o,r,t,e)=>{const n=o==="floatingFooter"?u.consts[t].innerCardPadding:u.consts[t].padding,i=r===a.Directions.Vertical&&o==="footer"&&e?0:n,s=r===a.Directions.Vertical&&o==="header"&&e?0:n,l=r===a.Directions.Horizontal&&o==="header"&&e?0:n,c=r===a.Directions.Horizontal&&o==="footer"&&e?0:n;return`padding: ${i}px ${l}px ${s}px ${c}px`},$=(o,r,t=!1)=>{const e=t&&r===a.Directions.Vertical&&o==="footer"?1:0,n=t&&r===a.Directions.Vertical&&o==="header"?1:0,i=t&&r===a.Directions.Horizontal&&o==="header"?1:0,s=t&&r===a.Directions.Horizontal&&o==="footer"?1:0;return`border-width: ${e}px ${i}px ${n}px ${s}px`},b=d.styled(g)`
-  ${({$type:o,$size:r,$direction:t,$padding:e,$bgColor:n,$fullBar:i,$borders:s,theme:l})=>{const c=l.layer({foundation:"surface"});return d.css`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("styled-components"),u=require("../../../../react-base/src/components/Card/Card.consts.js"),f=require("../../../../react-base/src/theme/types/layer.js"),a=require("../../../../react-base/src/consts/index.js"),g=require("../../../Flexbox/Flexbox.js"),x=(o,r,t,e)=>{const n=o==="floatingFooter"?u.consts[t].innerCardPadding:u.consts[t].padding,s=r===a.Directions.Vertical&&o==="footer"&&e?0:n,i=r===a.Directions.Vertical&&o==="header"&&e?0:n,l=r===a.Directions.Horizontal&&o==="header"&&e?0:n,c=r===a.Directions.Horizontal&&o==="footer"&&e?0:n;return`padding: ${s}px ${l}px ${i}px ${c}px`},h=(o,r,t=!1)=>{if(o==="floatingFooter"&&t)return"border-width: 1px";const e=t&&r===a.Directions.Vertical&&o==="footer"?1:0,n=t&&r===a.Directions.Vertical&&o==="header"?1:0,s=t&&r===a.Directions.Horizontal&&o==="header"?1:0,i=t&&r===a.Directions.Horizontal&&o==="footer"?1:0;return`border-width: ${e}px ${s}px ${n}px ${i}px`},$=d.styled(g)`
+  ${({$type:o,$size:r,$direction:t,$padding:e,$bgColor:n,$fullBar:s,$borders:i,theme:l})=>{const c=l.layer({foundation:"surface"});return d.css`
       display: flex;
       min-height: auto;
       border-color: ${c[f.Variables.BorderOnFoundationSubtle]};
       border-style: solid;
-      ${$(o,t,s)};
-      ${x(o,t,r,!s&&!n&&e===!0)};
+      ${h(o,t,i)};
+      ${x(o,t,r,!i&&!n&&e===!0)};
       ${o==="floatingFooter"&&d.css`
         background-color: ${c[f.Variables.BackgroundFoundation]};
         border-radius: ${u.consts[r].floatingBarBorderRadius}px;
-        flex-basis: ${o==="floatingFooter"&&i?"100%":"50%"};
+        flex-basis: ${o==="floatingFooter"&&s?"100%":"50%"};
       `}
     `}};
-`;exports.CardBar=b;
+`;exports.CardBar=$;
 //# sourceMappingURL=CardBar.styles.js.map

package/build/cjs/components/Card/components/CardBar/CardBar.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CardBar.styles.js","sources":["../../../../../../src/components/Card/components/CardBar/CardBar.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\nimport type { PickTransient } from 'acinguiux-ds-react-base/types';\nimport { CardConsts } from 'acinguiux-ds-react-base/components/Card';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\nimport { Directions } from 'acinguiux-ds-react-base/consts';\n\nimport type { ICardBarProps } from './CardBar.types';\nimport Flexbox from '../../../Flexbox/Flexbox';\n\ntype CardBarStylePropKeys = 'size' \| 'type' \| 'direction' \| 'padding';\n\nconst getCardBarPadding = (\n type: ICardBarProps['type'],\n direction: ICardBarProps['direction'],\n size: ICardBarProps['size'],\n lessPadding: boolean,\n) => {\n const paddingValue =\n type === 'floatingFooter' ? CardConsts.consts[size].innerCardPadding : CardConsts.consts[size].padding;\n\n const top = direction === Directions.Vertical && type === 'footer' && lessPadding ? 0 : paddingValue;\n const bottom = direction === Directions.Vertical && type === 'header' && lessPadding ? 0 : paddingValue;\n const right = direction === Directions.Horizontal && type === 'header' && lessPadding ? 0 : paddingValue;\n const left = direction === Directions.Horizontal && type === 'footer' && lessPadding ? 0 : paddingValue;\n\n return `padding: ${top}px ${right}px ${bottom}px ${left}px`;\n};\n\nconst getCardBarBorderWidth = (type: ICardBarProps['type'], direction: ICardBarProps['direction'], borders = false) => {\n const top = borders && direction === Directions.Vertical && type === 'footer' ? 1 : 0;\n const bottom = borders && direction === Directions.Vertical && type === 'header' ? 1 : 0;\n const right = borders && direction === Directions.Horizontal && type === 'header' ? 1 : 0;\n const left = borders && direction === Directions.Horizontal && type === 'footer' ? 1 : 0;\n\n return `border-width: ${top}px ${right}px ${bottom}px ${left}px`;\n};\n\nconst CardBar = styled(Flexbox)<\n Required<PickTransient<ICardBarProps, CardBarStylePropKeys>> &\n PickTransient<ICardBarProps, 'fullBar' \| 'borders' \| 'bgColor'>\n>`\n ${({ $type, $size, $direction, $padding, $bgColor, $fullBar, $borders, theme }) => {\n const layer = theme.layer({ foundation: 'surface' });\n\n return css`\n display: flex;\n min-height: auto;\n border-color: ${layer[Variables.BorderOnFoundationSubtle]};\n border-style: solid;\n ${getCardBarBorderWidth($type, $direction, $borders)};\n ${getCardBarPadding($type, $direction, $size, !$borders && !$bgColor && $padding === true)};\n\n ${$type === 'floatingFooter' &&\n css`\n background-color: ${layer[Variables.BackgroundFoundation]};\n border-radius: ${CardConsts.consts[$size].floatingBarBorderRadius}px;\n flex-basis: ${$type === 'floatingFooter' && $fullBar ? '100%' : '50%'};\n `}\n `;\n }};\n`;\n\nexport { CardBar };\n"],"names":["getCardBarPadding","type","direction","size","lessPadding","paddingValue","CardConsts.consts","top","Directions","bottom","right","left","getCardBarBorderWidth","borders","CardBar","styled","Flexbox","$type","$size","$direction","$padding","$bgColor","$fullBar","$borders","theme","layer","css","Variables"],"mappings":"sXAWMA,EAAoB,CACxBC,EACAC,EACAC,EACAC,IACG,CACH,MAAMC,EACJJ,IAAS,iBAAmBK,EAAAA,OAAkBH,CAAI,EAAE,iBAAmBG,EAAAA,OAAkBH,CAAI,EAAE,QAE3FI,EAAML,IAAcM,aAAW,UAAYP,IAAS,UAAYG,EAAc,EAAIC,EAClFI,EAASP,IAAcM,aAAW,UAAYP,IAAS,UAAYG,EAAc,EAAIC,EACrFK,EAAQR,IAAcM,aAAW,YAAcP,IAAS,UAAYG,EAAc,EAAIC,EACtFM,EAAOT,IAAcM,aAAW,YAAcP,IAAS,UAAYG,EAAc,EAAIC,EAE3F,MAAO,YAAYE,CAAG,MAAMG,CAAK,MAAMD,CAAM,MAAME,CAAI,IACzD,EAEMC,EAAwB,CAACX,EAA6BC,EAAuCW,EAAU,KAAU,CACrH,MAAMN,EAAMM,GAAWX,IAAcM,EAAAA,WAAW,UAAYP,IAAS,SAAW,EAAI,EAC9EQ,EAASI,GAAWX,IAAcM,EAAAA,WAAW,UAAYP,IAAS,SAAW,EAAI,EACjFS,EAAQG,GAAWX,IAAcM,EAAAA,WAAW,YAAcP,IAAS,SAAW,EAAI,EAClFU,EAAOE,GAAWX,IAAcM,EAAAA,WAAW,YAAcP,IAAS,SAAW,EAAI,EAEvF,MAAO,iBAAiBM,CAAG,MAAMG,CAAK,MAAMD,CAAM,MAAME,CAAI,IAC9D,EAEMG,EAAUC,EAAAA,OAAOC,CAAO;AAAA,IAI1B,CAAC,CAAE,MAAAC,EAAO,MAAAC,EAAO,WAAAC,EAAY,SAAAC,EAAU,SAAAC,EAAU,SAAAC,EAAU,SAAAC,EAAU,MAAAC,KAAY,CACjF,MAAMC,EAAQD,EAAM,MAAM,CAAE,WAAY,UAAW,EAEnD,OAAOE,EAAAA;AAAAA;AAAAA;AAAAA,sBAGWD,EAAME,YAAU,wBAAwB,CAAC;AAAA;AAAA,QAEvDf,EAAsBK,EAAOE,EAAYI,CAAQ,CAAC;AAAA,QAClDvB,EAAkBiB,EAAOE,EAAYD,EAAO,CAACK,GAAY,CAACF,GAAYD,IAAa,EAAI,CAAC;AAAA;AAAA,QAExFH,IAAU,kBACZS,EAAAA;AAAAA,4BACsBD,EAAME,YAAU,oBAAoB,CAAC;AAAA,yBACxCrB,EAAAA,OAAkBY,CAAK,EAAE,uBAAuB;AAAA,sBACnDD,IAAU,kBAAoBK,EAAW,OAAS,KAAK;AAAA,OACtE;AAAA,KAEL,CAAC;AAAA"}
1	+ {"version":3,"file":"CardBar.styles.js","sources":["../../../../../../src/components/Card/components/CardBar/CardBar.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\nimport type { PickTransient } from 'acinguiux-ds-react-base/types';\nimport { CardConsts } from 'acinguiux-ds-react-base/components/Card';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\nimport { Directions } from 'acinguiux-ds-react-base/consts';\n\nimport type { ICardBarProps } from './CardBar.types';\nimport Flexbox from '../../../Flexbox/Flexbox';\n\ntype CardBarStylePropKeys = 'size' \| 'type' \| 'direction' \| 'padding';\n\nconst getCardBarPadding = (\n type: ICardBarProps['type'],\n direction: ICardBarProps['direction'],\n size: ICardBarProps['size'],\n lessPadding: boolean,\n) => {\n const paddingValue =\n type === 'floatingFooter' ? CardConsts.consts[size].innerCardPadding : CardConsts.consts[size].padding;\n\n const top = direction === Directions.Vertical && type === 'footer' && lessPadding ? 0 : paddingValue;\n const bottom = direction === Directions.Vertical && type === 'header' && lessPadding ? 0 : paddingValue;\n const right = direction === Directions.Horizontal && type === 'header' && lessPadding ? 0 : paddingValue;\n const left = direction === Directions.Horizontal && type === 'footer' && lessPadding ? 0 : paddingValue;\n\n return `padding: ${top}px ${right}px ${bottom}px ${left}px`;\n};\n\nconst getCardBarBorderWidth = (type: ICardBarProps['type'], direction: ICardBarProps['direction'], borders = false) => {\n if (type === 'floatingFooter' && borders) {\n return `border-width: 1px`;\n }\n\n const top = borders && direction === Directions.Vertical && type === 'footer' ? 1 : 0;\n const bottom = borders && direction === Directions.Vertical && type === 'header' ? 1 : 0;\n const right = borders && direction === Directions.Horizontal && type === 'header' ? 1 : 0;\n const left = borders && direction === Directions.Horizontal && type === 'footer' ? 1 : 0;\n\n return `border-width: ${top}px ${right}px ${bottom}px ${left}px`;\n};\n\nconst CardBar = styled(Flexbox)<\n Required<PickTransient<ICardBarProps, CardBarStylePropKeys>> &\n PickTransient<ICardBarProps, 'fullBar' \| 'borders' \| 'bgColor'>\n>`\n ${({ $type, $size, $direction, $padding, $bgColor, $fullBar, $borders, theme }) => {\n const layer = theme.layer({ foundation: 'surface' });\n\n return css`\n display: flex;\n min-height: auto;\n border-color: ${layer[Variables.BorderOnFoundationSubtle]};\n border-style: solid;\n ${getCardBarBorderWidth($type, $direction, $borders)};\n ${getCardBarPadding($type, $direction, $size, !$borders && !$bgColor && $padding === true)};\n\n ${$type === 'floatingFooter' &&\n css`\n background-color: ${layer[Variables.BackgroundFoundation]};\n border-radius: ${CardConsts.consts[$size].floatingBarBorderRadius}px;\n flex-basis: ${$type === 'floatingFooter' && $fullBar ? '100%' : '50%'};\n `}\n `;\n }};\n`;\n\nexport { CardBar };\n"],"names":["getCardBarPadding","type","direction","size","lessPadding","paddingValue","CardConsts.consts","top","Directions","bottom","right","left","getCardBarBorderWidth","borders","CardBar","styled","Flexbox","$type","$size","$direction","$padding","$bgColor","$fullBar","$borders","theme","layer","css","Variables"],"mappings":"sXAWMA,EAAoB,CACxBC,EACAC,EACAC,EACAC,IACG,CACH,MAAMC,EACJJ,IAAS,iBAAmBK,EAAAA,OAAkBH,CAAI,EAAE,iBAAmBG,EAAAA,OAAkBH,CAAI,EAAE,QAE3FI,EAAML,IAAcM,aAAW,UAAYP,IAAS,UAAYG,EAAc,EAAIC,EAClFI,EAASP,IAAcM,aAAW,UAAYP,IAAS,UAAYG,EAAc,EAAIC,EACrFK,EAAQR,IAAcM,aAAW,YAAcP,IAAS,UAAYG,EAAc,EAAIC,EACtFM,EAAOT,IAAcM,aAAW,YAAcP,IAAS,UAAYG,EAAc,EAAIC,EAE3F,MAAO,YAAYE,CAAG,MAAMG,CAAK,MAAMD,CAAM,MAAME,CAAI,IACzD,EAEMC,EAAwB,CAACX,EAA6BC,EAAuCW,EAAU,KAAU,CACrH,GAAIZ,IAAS,kBAAoBY,EAC/B,MAAO,oBAGT,MAAMN,EAAMM,GAAWX,IAAcM,EAAAA,WAAW,UAAYP,IAAS,SAAW,EAAI,EAC9EQ,EAASI,GAAWX,IAAcM,EAAAA,WAAW,UAAYP,IAAS,SAAW,EAAI,EACjFS,EAAQG,GAAWX,IAAcM,EAAAA,WAAW,YAAcP,IAAS,SAAW,EAAI,EAClFU,EAAOE,GAAWX,IAAcM,EAAAA,WAAW,YAAcP,IAAS,SAAW,EAAI,EAEvF,MAAO,iBAAiBM,CAAG,MAAMG,CAAK,MAAMD,CAAM,MAAME,CAAI,IAC9D,EAEMG,EAAUC,EAAAA,OAAOC,CAAO;AAAA,IAI1B,CAAC,CAAE,MAAAC,EAAO,MAAAC,EAAO,WAAAC,EAAY,SAAAC,EAAU,SAAAC,EAAU,SAAAC,EAAU,SAAAC,EAAU,MAAAC,KAAY,CACjF,MAAMC,EAAQD,EAAM,MAAM,CAAE,WAAY,UAAW,EAEnD,OAAOE,EAAAA;AAAAA;AAAAA;AAAAA,sBAGWD,EAAME,YAAU,wBAAwB,CAAC;AAAA;AAAA,QAEvDf,EAAsBK,EAAOE,EAAYI,CAAQ,CAAC;AAAA,QAClDvB,EAAkBiB,EAAOE,EAAYD,EAAO,CAACK,GAAY,CAACF,GAAYD,IAAa,EAAI,CAAC;AAAA;AAAA,QAExFH,IAAU,kBACZS,EAAAA;AAAAA,4BACsBD,EAAME,YAAU,oBAAoB,CAAC;AAAA,yBACxCrB,EAAAA,OAAkBY,CAAK,EAAE,uBAAuB;AAAA,sBACnDD,IAAU,kBAAoBK,EAAW,OAAS,KAAK;AAAA,OACtE;AAAA,KAEL,CAAC;AAAA"}

package/build/cjs/components/Chart/Highcharts/HighchartsChart.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var l=Object.create;var a=Object.defineProperty;var q=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var H=Object.getPrototypeOf,m=Object.prototype.hasOwnProperty;var p=(e,s,t,i)=>{if(s&&typeof s=="object"||typeof s=="function")for(let r of g(s))!m.call(e,r)&&r!==t&&a(e,r,{get:()=>s[r],enumerable:!(i=q(s,r))||i.enumerable});return e};var R=(e,s,t)=>(t=e!=null?l(H(e)):{},p(s||!e||!e.__esModule?a(t,"default",{value:e,enumerable:!0}):t,e));const h=require("react/jsx-runtime"),c=require("react"),x=require("../../../react-base/src/consts/index.js"),o=require("highcharts"),C=require("highcharts-react-official"),w=require("classnames"),j=require("./HighchartsChart.styles.js"),y=require("./hooks/useHighchartsOptions.js"),N=require("../../../react-base/src/consts/classes.js");let n=!1;const O=c.forwardRef(({className:e,containerProps:s,...t},i)=>h.jsx(C.HighchartsReact,{ref:i,containerProps:{...s,className:w(e,N.CHART_CLASS,s?.className)},...t})),S=c.forwardRef(({size:e=x.Sizes.Medium,highcharts:s=o,options:t,option:i=[],...r},u)=>{const f=y(t,e,i);return c.useEffect(()=>{!n&&typeof window<"u"&&import("highcharts/modules/accessibility").then(d=>{d.default(o),n=!0})},[]),h.jsx(j.Highcharts,{as:O,ref:u,highcharts:s,options:f,...r})});module.exports=S;
+"use strict";const c=require("react/jsx-runtime"),i=require("react"),h=require("../../../react-base/src/consts/index.js"),u=require("highcharts"),q=require("highcharts-react-official"),g=require("classnames");require("highcharts/modules/accessibility");const H=require("./HighchartsChart.styles.js"),R=require("./hooks/useHighchartsOptions.js"),f=require("../../../react-base/src/consts/classes.js"),l=i.forwardRef(({className:e,containerProps:s,...r},t)=>c.jsx(q.HighchartsReact,{ref:t,containerProps:{...s,className:g(e,f.CHART_CLASS,s?.className)},...r})),m=i.forwardRef(({size:e=h.Sizes.Medium,highcharts:s=u,options:r,option:t=[],...a},o)=>{const n=R(r,e,t);return c.jsx(H.Highcharts,{as:l,ref:o,highcharts:s,options:n,...a})});module.exports=m;
 //# sourceMappingURL=HighchartsChart.js.map

package/build/cjs/components/Chart/Highcharts/HighchartsChart.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HighchartsChart.js","sources":["../../../../../src/components/Chart/Highcharts/HighchartsChart.tsx"],"sourcesContent":["import { forwardRef, ~~useEffect~~ } from 'react';\n\nimport { CHART_CLASS, Sizes } from 'acinguiux-ds-react-base/consts';\nimport Highcharts from 'highcharts';\nimport { HighchartsReact, HighchartsReactProps, HighchartsReactRefObject } from 'highcharts-react-official';\nimport cx from 'classnames';\~~n\n//~~ ~~Import~~ accessibility ~~module dynamically on client side to avoid SSR issues\nlet accessibilityLoaded = false~~;\n\nimport type { IHighchartsChartProps } from './HighchartsChart.types';\nimport * as Styled from './HighchartsChart.styles';\nimport useHighchartsOptions from './hooks/useHighchartsOptions';\n\nconst HighchartsReactComponent = forwardRef<HighchartsReactRefObject, HighchartsReactProps>(\n ({ className, containerProps, ...rest }, ref) => (\n <HighchartsReact\n ref={ref}\n containerProps={{ ...containerProps, className: cx(className, CHART_CLASS, containerProps?.className) }}\n {...rest}\n />\n ),\n);\n\nconst HighchartsChart = forwardRef<HighchartsReactRefObject, IHighchartsChartProps>(\n ({ size = Sizes.Medium, highcharts = Highcharts, options, option = [], ...rest }, ref) => {\n const sdsOptions = useHighchartsOptions(options, size, option);\n\n // Load accessibility module on client side\n useEffect(() => {\n if (!accessibilityLoaded && typeof window !== 'undefined') {\n import('highcharts/modules/accessibility').then((module) => {\n module.default(Highcharts);\n accessibilityLoaded = true;\n });\n }\n }, []);\n\n return (\n <Styled.Highcharts\n as={HighchartsReactComponent}\n ref={ref}\n highcharts={highcharts}\n options={sdsOptions}\n {...rest}\n />\n );\n },\n);\n\nexport default HighchartsChart;"],"names":["~~accessibilityLoaded","~~HighchartsReactComponent","forwardRef","className","containerProps","rest","ref","jsx","HighchartsReact","cx","CHART_CLASS","HighchartsChart","size","Sizes","highcharts","Highcharts","options","option","sdsOptions","useHighchartsOptions","~~useEffect","module","~~Styled.Highcharts"],"mappings":"~~yyBAQA~~,~~IAAIA,EAAsB,GAM1B,MAAMC,~~EAA2BC,EAAAA,WAC/B,CAAC,CAAE,UAAAC,EAAW,eAAAC,EAAgB,GAAGC,CAAA,EAAQC,IACvCC,EAAAA,IAACC,EAAAA,gBAAA,CACC,IAAAF,EACA,eAAgB,CAAE,GAAGF,EAAgB,UAAWK,EAAGN,EAAWO,EAAAA,YAAaN,GAAgB,SAAS,CAAA,EACnG,GAAGC,CAAA,CAAA,CAGV,EAEMM,EAAkBT,EAAAA,WACtB,CAAC,CAAE,KAAAU,EAAOC,QAAM,OAAQ,WAAAC,EAAaC,EAAY,QAAAC,EAAS,OAAAC,EAAS,CAAA,EAAI,GAAGZ,CAAA,EAAQC,IAAQ,CACxF,MAAMY,EAAaC,EAAqBH,EAASJ,EAAMK,CAAM,~~EAG7DG~~,~~OAAAA~~,EAAAA,~~UAAU~~,~~IAAM,CACV,CAACpB,GAAuB,OAAO,OAAW,KAC5C,OAAO,kCAAkC,EAAE,KAAMqB,GAAW,CAC1DA,EAAO,QAAQN,CAAU,EACzBf,EAAsB,EACxB,CAAC,CAEL,EAAG,CAAA,CAAE,EAGHO,~~EAAAA,~~IAACe,EAAAA,~~WAAA,CACC,~~GAAIrB~~,EACJ,IAAAK,EACA,WAAAQ,EACA,QAASI,EACR,GAAGb,CAAA,CAAA,CAGV,CACF"}
1	+ {"version":3,"file":"HighchartsChart.js","sources":["../../../../../src/components/Chart/Highcharts/HighchartsChart.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport { CHART_CLASS, Sizes } from 'acinguiux-ds-react-base/consts';\nimport Highcharts from 'highcharts';\nimport { HighchartsReact, HighchartsReactProps, HighchartsReactRefObject } from 'highcharts-react-official';\nimport cx from 'classnames';\nimport 'highcharts/modules/accessibility';\n\nimport type { IHighchartsChartProps } from './HighchartsChart.types';\nimport * as Styled from './HighchartsChart.styles';\nimport useHighchartsOptions from './hooks/useHighchartsOptions';\n\nconst HighchartsReactComponent = forwardRef<HighchartsReactRefObject, HighchartsReactProps>(\n ({ className, containerProps, ...rest }, ref) => (\n <HighchartsReact\n ref={ref}\n containerProps={{ ...containerProps, className: cx(className, CHART_CLASS, containerProps?.className) }}\n {...rest}\n />\n ),\n);\n\nconst HighchartsChart = forwardRef<HighchartsReactRefObject, IHighchartsChartProps>(\n ({ size = Sizes.Medium, highcharts = Highcharts, options, option = [], ...rest }, ref) => {\n const sdsOptions = useHighchartsOptions(options, size, option);\n\n return (\n <Styled.Highcharts\n as={HighchartsReactComponent}\n ref={ref}\n highcharts={highcharts}\n options={sdsOptions}\n {...rest}\n />\n );\n },\n);\n\nexport default HighchartsChart;\n"],"names":["HighchartsReactComponent","forwardRef","className","containerProps","rest","ref","jsx","HighchartsReact","cx","CHART_CLASS","HighchartsChart","size","Sizes","highcharts","Highcharts","options","option","sdsOptions","useHighchartsOptions","Styled.Highcharts"],"mappings":"gZAYMA,EAA2BC,EAAAA,WAC/B,CAAC,CAAE,UAAAC,EAAW,eAAAC,EAAgB,GAAGC,CAAA,EAAQC,IACvCC,EAAAA,IAACC,EAAAA,gBAAA,CACC,IAAAF,EACA,eAAgB,CAAE,GAAGF,EAAgB,UAAWK,EAAGN,EAAWO,EAAAA,YAAaN,GAAgB,SAAS,CAAA,EACnG,GAAGC,CAAA,CAAA,CAGV,EAEMM,EAAkBT,EAAAA,WACtB,CAAC,CAAE,KAAAU,EAAOC,QAAM,OAAQ,WAAAC,EAAaC,EAAY,QAAAC,EAAS,OAAAC,EAAS,CAAA,EAAI,GAAGZ,CAAA,EAAQC,IAAQ,CACxF,MAAMY,EAAaC,EAAqBH,EAASJ,EAAMK,CAAM,EAE7D,OACEV,EAAAA,IAACa,EAAAA,WAAA,CACC,GAAInB,EACJ,IAAAK,EACA,WAAAQ,EACA,QAASI,EACR,GAAGb,CAAA,CAAA,CAGV,CACF"}