@televet/kibble-ui 2.1.2-beta.866b0wdrd.6 → 2.1.2-beta.86796dgae.0

package/README.md

@@ -35,3 +35,18 @@ $ npm run build
 ```
 
 After the build finishes, look for the file named `stats.html` and open it in the browser of your choice.
+
+## Playwright Tests
+
+We are using [Playwright Snapshop Assertions]() to visually test our component library. At the start of each run, playwright will get a list of all stories. The test will loop through each story, and based on the type of component, it will perform appropriate actions to that component, and screenshot the result of each action. The screenshots will immediately be compared to a "golden" screenshot that we store in AWS S3 and pull down before the tests start.
+
+If you are pulling down changes, it would be a great idea to delete all .png files from /src/playwright/tests/snapshotTests.spec.ts-snapshots/ and run the tests again. This will ensure that you are using the most up to date screenshots, and any screenshots for new components which may have been added since the last time you ran the tests.
+
+Running these tests is kind of clunky and takes a long time to do, but you don't need to worry about pulling the screenshots or uploading them yourself. We do all of this from within the playwright tests already. Just run the below command after you have already started kibble locally (We are looking for locahost:6006 to be running), and then take a hike pall. We're workin' ova' here!
+
+```bash
+$ npm run snapshotTests
+```
+
+**But we have to change a component so now it doesn't look the same as the screenshot we have!**
+In the event that you changed a component and you need to therefore change the screenshot, you will need to find that screenshot in src/playwright/tests/snapshotTests.spec.ts-snapshots/ and delete the offending screenshot, and run the tests again. This will flag that screenshot as being missing for playwright which will write a new one. Then, we will see that this screenshot is new at the end of the test run (that failed again, by the way, since there wasn't a screenshot) and we will upload it to S3. 

package/build/{alert.component-52451145.js → alert.component-3f698ba2.js}

@@ -1,2 +1,2 @@
-"use strict";var t=require("./tslib.es6-194b75fc.js"),e=require("react"),s=require("./button.component-957d9e9f.js"),a=require("./chakra-ui-layout.esm-6ee578f7.js"),o=require("./heading.component-198f40a3.js"),n=require("./icon.component-729a7547.js"),i=require("./text.component-30355fe6.js"),r=require("./chakra-ui-alert.esm-17eebb99.js");function l(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var c=l(e);const u=e=>{const{buttonText:o,buttonPosition:n,hasDescription:i,status:r,isToast:l}=e,u=t.__rest(e,["buttonText","buttonPosition","hasDescription","status","isToast"]);return c.default.createElement(a.Box,{className:"Alert__Button",pt:"bottomLeft"!==n||i?0:1,pb:"bottomLeft"===n?.5:0},c.default.createElement(s.Button,Object.assign({size:"xs",variant:"default"===r?"primary":"secondary",isOnContrast:l},u),e.buttonText))},d=t=>{const{onClose:e,isToast:o}=t;return c.default.createElement(a.Box,{className:"Alert__CloseButton"},c.default.createElement(s.Button,{variant:"ghostNeutral",iconName:"close",size:"xs",onClick:e,isOnContrast:o}))},f=t=>{const{title:e,titleProps:s,isToast:a}=t;return c.default.createElement(o.WrappedHeading,Object.assign({className:"Alert__Title",flexGrow:1,variant:a?"onContrast":"default",lineHeight:6,size:"sm"},s),e)},m={error:"warningSign",warning:"warningSign",success:"checkmark",info:"infoCircle",default:"infoCircle"},p=t=>{const{iconProps:s,status:o,isToast:i=!1}=t,r=e.useMemo((()=>"error"===o?"danger":o),[o]);return c.default.createElement(a.Box,{className:"Alert__Icon",maxH:"24px"},c.default.createElement(n.Icon,Object.assign({variant:i?"onContrast":r,size:"lg",name:(null==s?void 0:s.name)||m[o]},s)))},b=t=>{const{description:e,descriptionProps:s,isToast:a}=t;return"string"==typeof e?c.default.createElement(i.WrappedText,Object.assign({className:"Alert__Description",size:"md",variant:a?"onContrast":"default"},s),e):c.default.createElement(c.default.Fragment,null,e)},h=t=>{const{children:e,hideIcon:s,hideCloseButton:o}=t;return c.default.createElement(a.VStack,{className:"Alert__Body",justify:"flex-start",align:"flex-start",w:"100%",pl:s?"":"34px",pr:o?"":"34px"},e)},E=t=>{const{children:e}=t;return c.default.createElement(a.HStack,{className:"Alert__Header",w:"100%",align:"flex-start",justify:"flex-start"},e)};exports.Alert=e=>{var{buttonProps:s,children:o,description:n,descriptionProps:i,hasShadow:l=!1,hideCloseButton:m=!1,hideIcon:g=!1,iconProps:x,onClose:T,status:P="success",title:j,titleProps:C,isToast:B=!1}=e,_=t.__rest(e,["buttonProps","children","description","descriptionProps","hasShadow","hideCloseButton","hideIcon","iconProps","onClose","status","title","titleProps","isToast"]);const v=B?`${P}Toast`:P;s&&!s.buttonPosition&&(s.buttonPosition="topRight");return c.default.createElement(r.Alert,Object.assign({flexDirection:"column",align:"flex-start",justify:"flex-start",variant:v,overflow:"visible",px:3,py:2},l&&{boxShadow:"md"},_),j?c.default.createElement((()=>c.default.createElement(c.default.Fragment,null,c.default.createElement(E,null,!g&&c.default.createElement(p,{isToast:B,status:P,iconProps:x}),c.default.createElement(f,{isToast:B,title:j,titleProps:C}),"topRight"===(null==s?void 0:s.buttonPosition)&&c.default.createElement(u,Object.assign({},s,{hasDescription:Boolean(n),isToast:B,status:P})),!m&&c.default.createElement(d,{isToast:B,onClose:T})),c.default.createElement(h,{hideIcon:g,hideCloseButton:m},n&&c.default.createElement(b,{isToast:B,description:n,descriptionProps:i}),o,"bottomLeft"===(null==s?void 0:s.buttonPosition)&&c.default.createElement(u,Object.assign({},s,{hasDescription:Boolean(n),isToast:B,status:P}))))),null):c.default.createElement((()=>c.default.createElement(a.VStack,{w:"100%",align:"flex-start",justify:"flex-start"},c.default.createElement(E,null,!g&&c.default.createElement(p,{isToast:B,status:P,iconProps:x}),c.default.createElement(a.Box,{flexGrow:1},n&&c.default.createElement(b,{isToast:B,description:n,descriptionProps:i}),o),"topRight"===(null==s?void 0:s.buttonPosition)&&c.default.createElement(u,Object.assign({},s,{hasDescription:Boolean(n),isToast:B,status:P})),!m&&c.default.createElement(d,{isToast:B,onClose:T})),"bottomLeft"===(null==s?void 0:s.buttonPosition)&&c.default.createElement(h,{hideIcon:g,hideCloseButton:m},c.default.createElement(u,Object.assign({},s,{hasDescription:Boolean(n),isToast:B,status:P}))))),null))};
-//# sourceMappingURL=alert.component-52451145.js.map
+"use strict";var t=require("./tslib.es6-d6f17add.js"),e=require("react"),s=require("./button.component-31667514.js"),a=require("./chakra-ui-layout.esm-6ee578f7.js"),o=require("./heading.component-e55f8364.js"),n=require("./icon.component-729a7547.js"),i=require("./text.component-057889c3.js"),r=require("./chakra-ui-alert.esm-17eebb99.js");function l(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var c=l(e);const u=e=>{const{buttonText:o,buttonPosition:n,hasDescription:i,status:r,isToast:l}=e,u=t.__rest(e,["buttonText","buttonPosition","hasDescription","status","isToast"]);return c.default.createElement(a.Box,{className:"Alert__Button",pt:"bottomLeft"!==n||i?0:1,pb:"bottomLeft"===n?.5:0},c.default.createElement(s.Button,Object.assign({size:"xs",variant:"default"===r?"primary":"secondary",isOnContrast:l},u),e.buttonText))},d=t=>{const{onClose:e,isToast:o}=t;return c.default.createElement(a.Box,{className:"Alert__CloseButton"},c.default.createElement(s.Button,{variant:"ghostNeutral",iconName:"close",size:"xs",onClick:e,isOnContrast:o}))},f=t=>{const{title:e,titleProps:s,isToast:a}=t;return c.default.createElement(o.WrappedHeading,Object.assign({className:"Alert__Title",flexGrow:1,variant:a?"onContrast":"default",lineHeight:6,size:"sm"},s),e)},m={error:"warningSign",warning:"warningSign",success:"checkmark",info:"infoCircle",default:"infoCircle"},p=t=>{const{iconProps:s,status:o,isToast:i=!1}=t,r=e.useMemo((()=>"error"===o?"danger":o),[o]);return c.default.createElement(a.Box,{className:"Alert__Icon",maxH:"24px"},c.default.createElement(n.Icon,Object.assign({variant:i?"onContrast":r,size:"lg",name:(null==s?void 0:s.name)||m[o]},s)))},b=t=>{const{description:e,descriptionProps:s,isToast:a}=t;return"string"==typeof e?c.default.createElement(i.WrappedText,Object.assign({className:"Alert__Description",size:"md",variant:a?"onContrast":"default"},s),e):c.default.createElement(c.default.Fragment,null,e)},h=t=>{const{children:e,hideIcon:s,hideCloseButton:o}=t;return c.default.createElement(a.VStack,{className:"Alert__Body",justify:"flex-start",align:"flex-start",w:"100%",pl:s?"":"34px",pr:o?"":"34px"},e)},E=t=>{const{children:e}=t;return c.default.createElement(a.HStack,{className:"Alert__Header",w:"100%",align:"flex-start",justify:"flex-start"},e)};exports.Alert=e=>{var{buttonProps:s,children:o,description:n,descriptionProps:i,hasShadow:l=!1,hideCloseButton:m=!1,hideIcon:g=!1,iconProps:x,onClose:T,status:P="success",title:j,titleProps:C,isToast:B=!1}=e,_=t.__rest(e,["buttonProps","children","description","descriptionProps","hasShadow","hideCloseButton","hideIcon","iconProps","onClose","status","title","titleProps","isToast"]);const v=B?`${P}Toast`:P;s&&!s.buttonPosition&&(s.buttonPosition="topRight");return c.default.createElement(r.Alert,Object.assign({flexDirection:"column",align:"flex-start",justify:"flex-start",variant:v,overflow:"visible",px:3,py:2},l&&{boxShadow:"md"},_),j?c.default.createElement((()=>c.default.createElement(c.default.Fragment,null,c.default.createElement(E,null,!g&&c.default.createElement(p,{isToast:B,status:P,iconProps:x}),c.default.createElement(f,{isToast:B,title:j,titleProps:C}),"topRight"===(null==s?void 0:s.buttonPosition)&&c.default.createElement(u,Object.assign({},s,{hasDescription:Boolean(n),isToast:B,status:P})),!m&&c.default.createElement(d,{isToast:B,onClose:T})),c.default.createElement(h,{hideIcon:g,hideCloseButton:m},n&&c.default.createElement(b,{isToast:B,description:n,descriptionProps:i}),o,"bottomLeft"===(null==s?void 0:s.buttonPosition)&&c.default.createElement(u,Object.assign({},s,{hasDescription:Boolean(n),isToast:B,status:P}))))),null):c.default.createElement((()=>c.default.createElement(a.VStack,{w:"100%",align:"flex-start",justify:"flex-start"},c.default.createElement(E,null,!g&&c.default.createElement(p,{isToast:B,status:P,iconProps:x}),c.default.createElement(a.Box,{flexGrow:1},n&&c.default.createElement(b,{isToast:B,description:n,descriptionProps:i}),o),"topRight"===(null==s?void 0:s.buttonPosition)&&c.default.createElement(u,Object.assign({},s,{hasDescription:Boolean(n),isToast:B,status:P})),!m&&c.default.createElement(d,{isToast:B,onClose:T})),"bottomLeft"===(null==s?void 0:s.buttonPosition)&&c.default.createElement(h,{hideIcon:g,hideCloseButton:m},c.default.createElement(u,Object.assign({},s,{hasDescription:Boolean(n),isToast:B,status:P}))))),null))};
+//# sourceMappingURL=alert.component-3f698ba2.js.map

package/build/{alert.component-52451145.js.map → alert.component-3f698ba2.js.map}

@@ -1 +1 @@
-{"version":3,"file":"alert.component-52451145.js","sources":["../src/components/Alert/components/alertButton.component.tsx","../src/components/Alert/components/alertCloseButton.component.tsx","../src/components/Alert/components/alertTitle.component.tsx","../src/components/Alert/components/alertIcon.component.tsx","../src/components/Alert/components/alertDescription.component.tsx","../src/components/Alert/components/alertBody.component.tsx","../src/components/Alert/components/alertHeader.component.tsx","../src/components/Alert/alert.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Status } from 'shared/types/status';\nimport { Button, ButtonProps } from '../../Button';\nimport { Box } from '@chakra-ui/react';\n\nexport interface AlertButtonProps extends ButtonProps {\n  buttonPosition?: 'topRight' | 'bottomLeft';\n  buttonText: string;\n  hasDescription?: boolean;\n  status?: Status;\n  isToast?: boolean;\n}\n\nexport const AlertButton = (buttonProps: AlertButtonProps): JSX.Element => {\n  const { buttonText, buttonPosition, hasDescription, status, isToast, ...rest } = buttonProps;\n\n  return (\n    <Box\n      className=\"Alert__Button\"\n      pt={buttonPosition === 'bottomLeft' && !hasDescription ? 1 : 0}\n      pb={buttonPosition === 'bottomLeft' ? 0.5 : 0}\n    >\n      <Button size=\"xs\" variant={status === 'default' ? 'primary' : 'secondary'} isOnContrast={isToast} {...rest}>\n        {buttonProps.buttonText}\n      </Button>\n    </Box>\n  );\n};\n","import { Button } from '../../Button/button.component';\nimport React from 'react';\nimport { Box } from '@chakra-ui/react';\n\nexport interface AlertCloseButtonProps {\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  isToast: boolean;\n}\n\nexport const AlertCloseButton = (props: AlertCloseButtonProps): JSX.Element => {\n  const { onClose, isToast } = props;\n  return (\n    <Box className=\"Alert__CloseButton\">\n      <Button variant=\"ghostNeutral\" iconName=\"close\" size=\"xs\" onClick={onClose} isOnContrast={isToast} />\n    </Box>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { Heading, HeadingProps } from 'components/Heading';\n\nexport interface AlertTitleProps {\n  title?: string | ReactNode;\n  titleProps?: HeadingProps;\n  isToast?: boolean;\n}\n\nexport const AlertTitle = (props: AlertTitleProps): JSX.Element => {\n  const { title, titleProps, isToast } = props;\n  return (\n    <Heading\n      className=\"Alert__Title\"\n      flexGrow={1}\n      variant={isToast ? 'onContrast' : 'default'}\n      lineHeight={6}\n      size=\"sm\"\n      {...titleProps}\n    >\n      {title}\n    </Heading>\n  );\n};\n","import React, { useMemo } from 'react';\nimport { Box } from '@chakra-ui/react';\nimport { Icon, IconProps } from '../../Icon/icon.component';\nimport { IconName } from 'components/Icon';\nimport { Status } from 'shared/types/status';\nimport { TypographyVariant } from 'shared/types/typography';\n\nexport const AlertStatusIcon: Record<Status, IconName> = {\n  error: 'warningSign',\n  warning: 'warningSign',\n  success: 'checkmark',\n  info: 'infoCircle',\n  default: 'infoCircle',\n};\n\nexport interface AlertIconProps {\n  iconProps?: IconProps;\n  status: Status;\n  isToast: boolean;\n}\n\nexport const AlertIcon = (props: AlertIconProps): JSX.Element => {\n  const { iconProps, status, isToast = false } = props;\n\n  const computedVariant: TypographyVariant = useMemo(() => (status === 'error' ? 'danger' : status), [status]);\n\n  return (\n    <Box className=\"Alert__Icon\" maxH=\"24px\">\n      <Icon\n        variant={isToast ? 'onContrast' : computedVariant}\n        size=\"lg\"\n        name={iconProps?.name || AlertStatusIcon[status]}\n        {...iconProps}\n      />\n    </Box>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { Text, TextProps } from '../../Text/text.component';\n\nexport interface AlertDescriptionProps {\n  description?: string | ReactNode;\n  descriptionProps?: TextProps;\n  isToast: boolean;\n}\n\nexport const AlertDescription = (props: AlertDescriptionProps): JSX.Element => {\n  const { description, descriptionProps, isToast } = props;\n  return typeof description === 'string' ? (\n    <Text className=\"Alert__Description\" size=\"md\" variant={isToast ? 'onContrast' : 'default'} {...descriptionProps}>\n      {description}\n    </Text>\n  ) : (\n    <>{description}</>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { VStack } from '@chakra-ui/react';\n\nexport interface AlertBodyProps {\n  children: ReactNode;\n  hideIcon: boolean;\n  hideCloseButton: boolean;\n}\n\nexport const AlertBody = (props: AlertBodyProps): JSX.Element => {\n  const { children, hideIcon, hideCloseButton } = props;\n  return (\n    <VStack\n      className=\"Alert__Body\"\n      justify=\"flex-start\"\n      align=\"flex-start\"\n      w=\"100%\"\n      pl={!hideIcon ? '34px' : ''}\n      pr={!hideCloseButton ? '34px' : ''}\n    >\n      {children}\n    </VStack>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { HStack } from '@chakra-ui/react';\n\nexport interface AlertHeaderProps {\n  children: ReactNode;\n}\n\nexport const AlertHeader = (props: AlertHeaderProps): JSX.Element => {\n  const { children } = props;\n  return (\n    <HStack className=\"Alert__Header\" w=\"100%\" align=\"flex-start\" justify=\"flex-start\">\n      {children}\n    </HStack>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { Alert as CAlert, AlertProps as CAlertProps, Box, VStack } from '@chakra-ui/react';\nimport { IconProps } from '../Icon/icon.component';\nimport { TextProps } from '../Text/text.component';\nimport { HeadingProps } from '../Heading/heading.component';\nimport { AlertButton, AlertButtonProps } from './components/alertButton.component';\nimport { AlertCloseButton } from './components/alertCloseButton.component';\nimport { AlertTitle } from './components/alertTitle.component';\nimport { AlertIcon } from './components/alertIcon.component';\nimport { AlertDescription } from './components/alertDescription.component';\nimport { AlertBody } from './components/alertBody.component';\nimport { AlertHeader } from './components/alertHeader.component';\nimport { Status } from 'shared/types/status';\n\nexport interface KAlertProps {\n  buttonProps?: AlertButtonProps;\n  children?: ReactNode;\n  description?: string | ReactNode;\n  descriptionProps?: TextProps;\n  hasShadow?: boolean;\n  hideCloseButton?: boolean;\n  hideIcon?: boolean;\n  iconProps?: IconProps;\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  status?: Status;\n  title?: string | ReactNode;\n  titleProps?: HeadingProps;\n  isToast?: boolean;\n}\n\nexport interface AlertProps extends KAlertProps, Omit<CAlertProps, 'title' | 'status'> {}\n\nexport const Alert = ({\n  buttonProps,\n  children,\n  description,\n  descriptionProps,\n  hasShadow = false,\n  hideCloseButton = false,\n  hideIcon = false,\n  iconProps,\n  onClose,\n  status = 'success',\n  title,\n  titleProps,\n  isToast = false,\n  ...rest\n}: AlertProps): JSX.Element => {\n  const computedVariant = isToast ? `${status}Toast` : status;\n  if (buttonProps && !buttonProps.buttonPosition) {\n    buttonProps.buttonPosition = 'topRight';\n  }\n\n  const AlertWithTitle = (): JSX.Element => {\n    return (\n      <>\n        <AlertHeader>\n          {!hideIcon && <AlertIcon isToast={isToast} status={status} iconProps={iconProps} />}\n          <AlertTitle isToast={isToast} title={title} titleProps={titleProps} />\n          {buttonProps?.buttonPosition === 'topRight' && (\n            <AlertButton {...buttonProps} hasDescription={Boolean(description)} isToast={isToast} status={status} />\n          )}\n          {!hideCloseButton && <AlertCloseButton isToast={isToast} onClose={onClose} />}\n        </AlertHeader>\n        <AlertBody hideIcon={hideIcon} hideCloseButton={hideCloseButton}>\n          {description && (\n            <AlertDescription isToast={isToast} description={description} descriptionProps={descriptionProps} />\n          )}\n          {children}\n          {buttonProps?.buttonPosition === 'bottomLeft' && (\n            <AlertButton {...buttonProps} hasDescription={Boolean(description)} isToast={isToast} status={status} />\n          )}\n        </AlertBody>\n      </>\n    );\n  };\n\n  const AlertWithoutTitle = (): JSX.Element => {\n    return (\n      <VStack w=\"100%\" align=\"flex-start\" justify=\"flex-start\">\n        <AlertHeader>\n          {!hideIcon && <AlertIcon isToast={isToast} status={status} iconProps={iconProps} />}\n          <Box flexGrow={1}>\n            {description && (\n              <AlertDescription isToast={isToast} description={description} descriptionProps={descriptionProps} />\n            )}\n            {children}\n          </Box>\n          {buttonProps?.buttonPosition === 'topRight' && (\n            <AlertButton {...buttonProps} hasDescription={Boolean(description)} isToast={isToast} status={status} />\n          )}\n          {!hideCloseButton && <AlertCloseButton isToast={isToast} onClose={onClose} />}\n        </AlertHeader>\n        {buttonProps?.buttonPosition === 'bottomLeft' && (\n          <AlertBody hideIcon={hideIcon} hideCloseButton={hideCloseButton}>\n            <AlertButton {...buttonProps} hasDescription={Boolean(description)} isToast={isToast} status={status} />\n          </AlertBody>\n        )}\n      </VStack>\n    );\n  };\n\n  return (\n    <CAlert\n      flexDirection=\"column\"\n      align=\"flex-start\"\n      justify=\"flex-start\"\n      variant={computedVariant}\n      overflow=\"visible\"\n      px={3}\n      py={2}\n      {...(hasShadow && { boxShadow: 'md' })}\n      {...rest}\n    >\n      {title ? <AlertWithTitle /> : <AlertWithoutTitle />}\n    </CAlert>\n  );\n};\n"],"names":["AlertButton","buttonProps","buttonText","buttonPosition","hasDescription","status","isToast","rest","__rest","React","createElement","Box","className","pt","pb","Button","Object","assign","size","variant","isOnContrast","AlertCloseButton","props","onClose","iconName","onClick","AlertTitle","title","titleProps","Heading","flexGrow","lineHeight","AlertStatusIcon","error","warning","success","info","default","AlertIcon","iconProps","computedVariant","useMemo","maxH","Icon","name","AlertDescription","description","descriptionProps","Text","WrappedText","AlertBody","children","hideIcon","hideCloseButton","VStack","justify","align","w","pl","pr","AlertHeader","HStack","_a","hasShadow","CAlert","Alert","flexDirection","overflow","px","py","boxShadow","Fragment","Boolean"],"mappings":"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"}
+{"version":3,"file":"alert.component-3f698ba2.js","sources":["../src/components/Alert/components/alertButton.component.tsx","../src/components/Alert/components/alertCloseButton.component.tsx","../src/components/Alert/components/alertTitle.component.tsx","../src/components/Alert/components/alertIcon.component.tsx","../src/components/Alert/components/alertDescription.component.tsx","../src/components/Alert/components/alertBody.component.tsx","../src/components/Alert/components/alertHeader.component.tsx","../src/components/Alert/alert.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Status } from 'shared/types/status';\nimport { Button, ButtonProps } from '../../Button';\nimport { Box } from '@chakra-ui/react';\n\nexport interface AlertButtonProps extends ButtonProps {\n  buttonPosition?: 'topRight' | 'bottomLeft';\n  buttonText: string;\n  hasDescription?: boolean;\n  status?: Status;\n  isToast?: boolean;\n}\n\nexport const AlertButton = (buttonProps: AlertButtonProps): JSX.Element => {\n  const { buttonText, buttonPosition, hasDescription, status, isToast, ...rest } = buttonProps;\n\n  return (\n    <Box\n      className=\"Alert__Button\"\n      pt={buttonPosition === 'bottomLeft' && !hasDescription ? 1 : 0}\n      pb={buttonPosition === 'bottomLeft' ? 0.5 : 0}\n    >\n      <Button size=\"xs\" variant={status === 'default' ? 'primary' : 'secondary'} isOnContrast={isToast} {...rest}>\n        {buttonProps.buttonText}\n      </Button>\n    </Box>\n  );\n};\n","import { Button } from '../../Button/button.component';\nimport React from 'react';\nimport { Box } from '@chakra-ui/react';\n\nexport interface AlertCloseButtonProps {\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  isToast: boolean;\n}\n\nexport const AlertCloseButton = (props: AlertCloseButtonProps): JSX.Element => {\n  const { onClose, isToast } = props;\n  return (\n    <Box className=\"Alert__CloseButton\">\n      <Button variant=\"ghostNeutral\" iconName=\"close\" size=\"xs\" onClick={onClose} isOnContrast={isToast} />\n    </Box>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { Heading, HeadingProps } from 'components/Heading';\n\nexport interface AlertTitleProps {\n  title?: string | ReactNode;\n  titleProps?: HeadingProps;\n  isToast?: boolean;\n}\n\nexport const AlertTitle = (props: AlertTitleProps): JSX.Element => {\n  const { title, titleProps, isToast } = props;\n  return (\n    <Heading\n      className=\"Alert__Title\"\n      flexGrow={1}\n      variant={isToast ? 'onContrast' : 'default'}\n      lineHeight={6}\n      size=\"sm\"\n      {...titleProps}\n    >\n      {title}\n    </Heading>\n  );\n};\n","import React, { useMemo } from 'react';\nimport { Box } from '@chakra-ui/react';\nimport { Icon, IconProps } from '../../Icon/icon.component';\nimport { IconName } from 'components/Icon';\nimport { Status } from 'shared/types/status';\nimport { TypographyVariant } from 'shared/types/typography';\n\nexport const AlertStatusIcon: Record<Status, IconName> = {\n  error: 'warningSign',\n  warning: 'warningSign',\n  success: 'checkmark',\n  info: 'infoCircle',\n  default: 'infoCircle',\n};\n\nexport interface AlertIconProps {\n  iconProps?: IconProps;\n  status: Status;\n  isToast: boolean;\n}\n\nexport const AlertIcon = (props: AlertIconProps): JSX.Element => {\n  const { iconProps, status, isToast = false } = props;\n\n  const computedVariant: TypographyVariant = useMemo(() => (status === 'error' ? 'danger' : status), [status]);\n\n  return (\n    <Box className=\"Alert__Icon\" maxH=\"24px\">\n      <Icon\n        variant={isToast ? 'onContrast' : computedVariant}\n        size=\"lg\"\n        name={iconProps?.name || AlertStatusIcon[status]}\n        {...iconProps}\n      />\n    </Box>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { Text, TextProps } from '../../Text/text.component';\n\nexport interface AlertDescriptionProps {\n  description?: string | ReactNode;\n  descriptionProps?: TextProps;\n  isToast: boolean;\n}\n\nexport const AlertDescription = (props: AlertDescriptionProps): JSX.Element => {\n  const { description, descriptionProps, isToast } = props;\n  return typeof description === 'string' ? (\n    <Text className=\"Alert__Description\" size=\"md\" variant={isToast ? 'onContrast' : 'default'} {...descriptionProps}>\n      {description}\n    </Text>\n  ) : (\n    <>{description}</>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { VStack } from '@chakra-ui/react';\n\nexport interface AlertBodyProps {\n  children: ReactNode;\n  hideIcon: boolean;\n  hideCloseButton: boolean;\n}\n\nexport const AlertBody = (props: AlertBodyProps): JSX.Element => {\n  const { children, hideIcon, hideCloseButton } = props;\n  return (\n    <VStack\n      className=\"Alert__Body\"\n      justify=\"flex-start\"\n      align=\"flex-start\"\n      w=\"100%\"\n      pl={!hideIcon ? '34px' : ''}\n      pr={!hideCloseButton ? '34px' : ''}\n    >\n      {children}\n    </VStack>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { HStack } from '@chakra-ui/react';\n\nexport interface AlertHeaderProps {\n  children: ReactNode;\n}\n\nexport const AlertHeader = (props: AlertHeaderProps): JSX.Element => {\n  const { children } = props;\n  return (\n    <HStack className=\"Alert__Header\" w=\"100%\" align=\"flex-start\" justify=\"flex-start\">\n      {children}\n    </HStack>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { Alert as CAlert, AlertProps as CAlertProps, Box, VStack } from '@chakra-ui/react';\nimport { IconProps } from '../Icon/icon.component';\nimport { TextProps } from '../Text/text.component';\nimport { HeadingProps } from '../Heading/heading.component';\nimport { AlertButton, AlertButtonProps } from './components/alertButton.component';\nimport { AlertCloseButton } from './components/alertCloseButton.component';\nimport { AlertTitle } from './components/alertTitle.component';\nimport { AlertIcon } from './components/alertIcon.component';\nimport { AlertDescription } from './components/alertDescription.component';\nimport { AlertBody } from './components/alertBody.component';\nimport { AlertHeader } from './components/alertHeader.component';\nimport { Status } from 'shared/types/status';\n\nexport interface KAlertProps {\n  buttonProps?: AlertButtonProps;\n  children?: ReactNode;\n  description?: string | ReactNode;\n  descriptionProps?: TextProps;\n  hasShadow?: boolean;\n  hideCloseButton?: boolean;\n  hideIcon?: boolean;\n  iconProps?: IconProps;\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  status?: Status;\n  title?: string | ReactNode;\n  titleProps?: HeadingProps;\n  isToast?: boolean;\n}\n\nexport interface AlertProps extends KAlertProps, Omit<CAlertProps, 'title' | 'status'> {}\n\nexport const Alert = ({\n  buttonProps,\n  children,\n  description,\n  descriptionProps,\n  hasShadow = false,\n  hideCloseButton = false,\n  hideIcon = false,\n  iconProps,\n  onClose,\n  status = 'success',\n  title,\n  titleProps,\n  isToast = false,\n  ...rest\n}: AlertProps): JSX.Element => {\n  const computedVariant = isToast ? `${status}Toast` : status;\n  if (buttonProps && !buttonProps.buttonPosition) {\n    buttonProps.buttonPosition = 'topRight';\n  }\n\n  const AlertWithTitle = (): JSX.Element => {\n    return (\n      <>\n        <AlertHeader>\n          {!hideIcon && <AlertIcon isToast={isToast} status={status} iconProps={iconProps} />}\n          <AlertTitle isToast={isToast} title={title} titleProps={titleProps} />\n          {buttonProps?.buttonPosition === 'topRight' && (\n            <AlertButton {...buttonProps} hasDescription={Boolean(description)} isToast={isToast} status={status} />\n          )}\n          {!hideCloseButton && <AlertCloseButton isToast={isToast} onClose={onClose} />}\n        </AlertHeader>\n        <AlertBody hideIcon={hideIcon} hideCloseButton={hideCloseButton}>\n          {description && (\n            <AlertDescription isToast={isToast} description={description} descriptionProps={descriptionProps} />\n          )}\n          {children}\n          {buttonProps?.buttonPosition === 'bottomLeft' && (\n            <AlertButton {...buttonProps} hasDescription={Boolean(description)} isToast={isToast} status={status} />\n          )}\n        </AlertBody>\n      </>\n    );\n  };\n\n  const AlertWithoutTitle = (): JSX.Element => {\n    return (\n      <VStack w=\"100%\" align=\"flex-start\" justify=\"flex-start\">\n        <AlertHeader>\n          {!hideIcon && <AlertIcon isToast={isToast} status={status} iconProps={iconProps} />}\n          <Box flexGrow={1}>\n            {description && (\n              <AlertDescription isToast={isToast} description={description} descriptionProps={descriptionProps} />\n            )}\n            {children}\n          </Box>\n          {buttonProps?.buttonPosition === 'topRight' && (\n            <AlertButton {...buttonProps} hasDescription={Boolean(description)} isToast={isToast} status={status} />\n          )}\n          {!hideCloseButton && <AlertCloseButton isToast={isToast} onClose={onClose} />}\n        </AlertHeader>\n        {buttonProps?.buttonPosition === 'bottomLeft' && (\n          <AlertBody hideIcon={hideIcon} hideCloseButton={hideCloseButton}>\n            <AlertButton {...buttonProps} hasDescription={Boolean(description)} isToast={isToast} status={status} />\n          </AlertBody>\n        )}\n      </VStack>\n    );\n  };\n\n  return (\n    <CAlert\n      flexDirection=\"column\"\n      align=\"flex-start\"\n      justify=\"flex-start\"\n      variant={computedVariant}\n      overflow=\"visible\"\n      px={3}\n      py={2}\n      {...(hasShadow && { boxShadow: 'md' })}\n      {...rest}\n    >\n      {title ? <AlertWithTitle /> : <AlertWithoutTitle />}\n    </CAlert>\n  );\n};\n"],"names":["AlertButton","buttonProps","buttonText","buttonPosition","hasDescription","status","isToast","rest","__rest","React","createElement","Box","className","pt","pb","Button","Object","assign","size","variant","isOnContrast","AlertCloseButton","props","onClose","iconName","onClick","AlertTitle","title","titleProps","Heading","flexGrow","lineHeight","AlertStatusIcon","error","warning","success","info","default","AlertIcon","iconProps","computedVariant","useMemo","maxH","Icon","name","AlertDescription","description","descriptionProps","Text","WrappedText","AlertBody","children","hideIcon","hideCloseButton","VStack","justify","align","w","pl","pr","AlertHeader","HStack","_a","hasShadow","CAlert","Alert","flexDirection","overflow","px","py","boxShadow","Fragment","Boolean"],"mappings":"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"}

package/build/{alert.component-85f70ef3.js → alert.component-864beab4.js}

@@ -1,2 +1,2 @@
-"use strict";var t=require("./tslib.es6-194b75fc.js"),e=require("react"),s=require("./button.component-967d0def.js"),a=require("./chakra-ui-layout.esm-6ee578f7.js"),o=require("./heading.component-198f40a3.js"),n=require("./icon.component-d618e1f5.js"),i=require("./text.component-30355fe6.js"),r=require("./chakra-ui-alert.esm-17eebb99.js");function l(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var c=l(e);const u=e=>{const{buttonText:o,buttonPosition:n,hasDescription:i,status:r,isToast:l}=e,u=t.__rest(e,["buttonText","buttonPosition","hasDescription","status","isToast"]);return c.default.createElement(a.Box,{className:"Alert__Button",pt:"bottomLeft"!==n||i?0:1,pb:"bottomLeft"===n?.5:0},c.default.createElement(s.Button,Object.assign({size:"xs",variant:"default"===r?"primary":"secondary",isOnContrast:l},u),e.buttonText))},d=t=>{const{onClose:e,isToast:o}=t;return c.default.createElement(a.Box,{className:"Alert__CloseButton"},c.default.createElement(s.Button,{variant:"ghostNeutral",iconName:"close",size:"xs",onClick:e,isOnContrast:o}))},f=t=>{const{title:e,titleProps:s,isToast:a}=t;return c.default.createElement(o.WrappedHeading,Object.assign({className:"Alert__Title",flexGrow:1,variant:a?"onContrast":"default",lineHeight:6,size:"sm"},s),e)},m={error:"warningSign",warning:"warningSign",success:"checkmark",info:"infoCircle",default:"infoCircle"},p=t=>{const{iconProps:s,status:o,isToast:i=!1}=t,r=e.useMemo((()=>"error"===o?"danger":o),[o]);return c.default.createElement(a.Box,{className:"Alert__Icon",maxH:"24px"},c.default.createElement(n.Icon,Object.assign({variant:i?"onContrast":r,size:"lg",name:(null==s?void 0:s.name)||m[o]},s)))},b=t=>{const{description:e,descriptionProps:s,isToast:a}=t;return"string"==typeof e?c.default.createElement(i.WrappedText,Object.assign({className:"Alert__Description",size:"md",variant:a?"onContrast":"default"},s),e):c.default.createElement(c.default.Fragment,null,e)},h=t=>{const{children:e,hideIcon:s,hideCloseButton:o}=t;return c.default.createElement(a.VStack,{className:"Alert__Body",justify:"flex-start",align:"flex-start",w:"100%",pl:s?"":"34px",pr:o?"":"34px"},e)},E=t=>{const{children:e}=t;return c.default.createElement(a.HStack,{className:"Alert__Header",w:"100%",align:"flex-start",justify:"flex-start"},e)};exports.Alert=e=>{var{buttonProps:s,children:o,description:n,descriptionProps:i,hasShadow:l=!1,hideCloseButton:m=!1,hideIcon:g=!1,iconProps:x,onClose:T,status:P="success",title:j,titleProps:C,isToast:B=!1}=e,_=t.__rest(e,["buttonProps","children","description","descriptionProps","hasShadow","hideCloseButton","hideIcon","iconProps","onClose","status","title","titleProps","isToast"]);const v=B?`${P}Toast`:P;s&&!s.buttonPosition&&(s.buttonPosition="topRight");return c.default.createElement(r.Alert,Object.assign({flexDirection:"column",align:"flex-start",justify:"flex-start",variant:v,overflow:"visible",px:3,py:2},l&&{boxShadow:"md"},_),j?c.default.createElement((()=>c.default.createElement(c.default.Fragment,null,c.default.createElement(E,null,!g&&c.default.createElement(p,{isToast:B,status:P,iconProps:x}),c.default.createElement(f,{isToast:B,title:j,titleProps:C}),"topRight"===(null==s?void 0:s.buttonPosition)&&c.default.createElement(u,Object.assign({},s,{hasDescription:Boolean(n),isToast:B,status:P})),!m&&c.default.createElement(d,{isToast:B,onClose:T})),c.default.createElement(h,{hideIcon:g,hideCloseButton:m},n&&c.default.createElement(b,{isToast:B,description:n,descriptionProps:i}),o,"bottomLeft"===(null==s?void 0:s.buttonPosition)&&c.default.createElement(u,Object.assign({},s,{hasDescription:Boolean(n),isToast:B,status:P}))))),null):c.default.createElement((()=>c.default.createElement(a.VStack,{w:"100%",align:"flex-start",justify:"flex-start"},c.default.createElement(E,null,!g&&c.default.createElement(p,{isToast:B,status:P,iconProps:x}),c.default.createElement(a.Box,{flexGrow:1},n&&c.default.createElement(b,{isToast:B,description:n,descriptionProps:i}),o),"topRight"===(null==s?void 0:s.buttonPosition)&&c.default.createElement(u,Object.assign({},s,{hasDescription:Boolean(n),isToast:B,status:P})),!m&&c.default.createElement(d,{isToast:B,onClose:T})),"bottomLeft"===(null==s?void 0:s.buttonPosition)&&c.default.createElement(h,{hideIcon:g,hideCloseButton:m},c.default.createElement(u,Object.assign({},s,{hasDescription:Boolean(n),isToast:B,status:P}))))),null))};
-//# sourceMappingURL=alert.component-85f70ef3.js.map
+"use strict";var t=require("./tslib.es6-d6f17add.js"),e=require("react"),s=require("./button.component-0b765852.js"),a=require("./chakra-ui-layout.esm-6ee578f7.js"),o=require("./heading.component-e55f8364.js"),n=require("./icon.component-d618e1f5.js"),i=require("./text.component-057889c3.js"),r=require("./chakra-ui-alert.esm-17eebb99.js");function l(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var c=l(e);const u=e=>{const{buttonText:o,buttonPosition:n,hasDescription:i,status:r,isToast:l}=e,u=t.__rest(e,["buttonText","buttonPosition","hasDescription","status","isToast"]);return c.default.createElement(a.Box,{className:"Alert__Button",pt:"bottomLeft"!==n||i?0:1,pb:"bottomLeft"===n?.5:0},c.default.createElement(s.Button,Object.assign({size:"xs",variant:"default"===r?"primary":"secondary",isOnContrast:l},u),e.buttonText))},d=t=>{const{onClose:e,isToast:o}=t;return c.default.createElement(a.Box,{className:"Alert__CloseButton"},c.default.createElement(s.Button,{variant:"ghostNeutral",iconName:"close",size:"xs",onClick:e,isOnContrast:o}))},f=t=>{const{title:e,titleProps:s,isToast:a}=t;return c.default.createElement(o.WrappedHeading,Object.assign({className:"Alert__Title",flexGrow:1,variant:a?"onContrast":"default",lineHeight:6,size:"sm"},s),e)},m={error:"warningSign",warning:"warningSign",success:"checkmark",info:"infoCircle",default:"infoCircle"},p=t=>{const{iconProps:s,status:o,isToast:i=!1}=t,r=e.useMemo((()=>"error"===o?"danger":o),[o]);return c.default.createElement(a.Box,{className:"Alert__Icon",maxH:"24px"},c.default.createElement(n.Icon,Object.assign({variant:i?"onContrast":r,size:"lg",name:(null==s?void 0:s.name)||m[o]},s)))},b=t=>{const{description:e,descriptionProps:s,isToast:a}=t;return"string"==typeof e?c.default.createElement(i.WrappedText,Object.assign({className:"Alert__Description",size:"md",variant:a?"onContrast":"default"},s),e):c.default.createElement(c.default.Fragment,null,e)},h=t=>{const{children:e,hideIcon:s,hideCloseButton:o}=t;return c.default.createElement(a.VStack,{className:"Alert__Body",justify:"flex-start",align:"flex-start",w:"100%",pl:s?"":"34px",pr:o?"":"34px"},e)},E=t=>{const{children:e}=t;return c.default.createElement(a.HStack,{className:"Alert__Header",w:"100%",align:"flex-start",justify:"flex-start"},e)};exports.Alert=e=>{var{buttonProps:s,children:o,description:n,descriptionProps:i,hasShadow:l=!1,hideCloseButton:m=!1,hideIcon:g=!1,iconProps:x,onClose:T,status:P="success",title:j,titleProps:C,isToast:B=!1}=e,_=t.__rest(e,["buttonProps","children","description","descriptionProps","hasShadow","hideCloseButton","hideIcon","iconProps","onClose","status","title","titleProps","isToast"]);const v=B?`${P}Toast`:P;s&&!s.buttonPosition&&(s.buttonPosition="topRight");return c.default.createElement(r.Alert,Object.assign({flexDirection:"column",align:"flex-start",justify:"flex-start",variant:v,overflow:"visible",px:3,py:2},l&&{boxShadow:"md"},_),j?c.default.createElement((()=>c.default.createElement(c.default.Fragment,null,c.default.createElement(E,null,!g&&c.default.createElement(p,{isToast:B,status:P,iconProps:x}),c.default.createElement(f,{isToast:B,title:j,titleProps:C}),"topRight"===(null==s?void 0:s.buttonPosition)&&c.default.createElement(u,Object.assign({},s,{hasDescription:Boolean(n),isToast:B,status:P})),!m&&c.default.createElement(d,{isToast:B,onClose:T})),c.default.createElement(h,{hideIcon:g,hideCloseButton:m},n&&c.default.createElement(b,{isToast:B,description:n,descriptionProps:i}),o,"bottomLeft"===(null==s?void 0:s.buttonPosition)&&c.default.createElement(u,Object.assign({},s,{hasDescription:Boolean(n),isToast:B,status:P}))))),null):c.default.createElement((()=>c.default.createElement(a.VStack,{w:"100%",align:"flex-start",justify:"flex-start"},c.default.createElement(E,null,!g&&c.default.createElement(p,{isToast:B,status:P,iconProps:x}),c.default.createElement(a.Box,{flexGrow:1},n&&c.default.createElement(b,{isToast:B,description:n,descriptionProps:i}),o),"topRight"===(null==s?void 0:s.buttonPosition)&&c.default.createElement(u,Object.assign({},s,{hasDescription:Boolean(n),isToast:B,status:P})),!m&&c.default.createElement(d,{isToast:B,onClose:T})),"bottomLeft"===(null==s?void 0:s.buttonPosition)&&c.default.createElement(h,{hideIcon:g,hideCloseButton:m},c.default.createElement(u,Object.assign({},s,{hasDescription:Boolean(n),isToast:B,status:P}))))),null))};
+//# sourceMappingURL=alert.component-864beab4.js.map

package/build/{alert.component-85f70ef3.js.map → alert.component-864beab4.js.map}

@@ -1 +1 @@
-{"version":3,"file":"alert.component-85f70ef3.js","sources":["../src/components/Alert/components/alertButton.component.tsx","../src/components/Alert/components/alertCloseButton.component.tsx","../src/components/Alert/components/alertTitle.component.tsx","../src/components/Alert/components/alertIcon.component.tsx","../src/components/Alert/components/alertDescription.component.tsx","../src/components/Alert/components/alertBody.component.tsx","../src/components/Alert/components/alertHeader.component.tsx","../src/components/Alert/alert.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Status } from 'shared/types/status';\nimport { Button, ButtonProps } from '../../Button';\nimport { Box } from '@chakra-ui/react';\n\nexport interface AlertButtonProps extends ButtonProps {\n  buttonPosition?: 'topRight' | 'bottomLeft';\n  buttonText: string;\n  hasDescription?: boolean;\n  status?: Status;\n  isToast?: boolean;\n}\n\nexport const AlertButton = (buttonProps: AlertButtonProps): JSX.Element => {\n  const { buttonText, buttonPosition, hasDescription, status, isToast, ...rest } = buttonProps;\n\n  return (\n    <Box\n      className=\"Alert__Button\"\n      pt={buttonPosition === 'bottomLeft' && !hasDescription ? 1 : 0}\n      pb={buttonPosition === 'bottomLeft' ? 0.5 : 0}\n    >\n      <Button size=\"xs\" variant={status === 'default' ? 'primary' : 'secondary'} isOnContrast={isToast} {...rest}>\n        {buttonProps.buttonText}\n      </Button>\n    </Box>\n  );\n};\n","import { Button } from '../../Button/button.component';\nimport React from 'react';\nimport { Box } from '@chakra-ui/react';\n\nexport interface AlertCloseButtonProps {\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  isToast: boolean;\n}\n\nexport const AlertCloseButton = (props: AlertCloseButtonProps): JSX.Element => {\n  const { onClose, isToast } = props;\n  return (\n    <Box className=\"Alert__CloseButton\">\n      <Button variant=\"ghostNeutral\" iconName=\"close\" size=\"xs\" onClick={onClose} isOnContrast={isToast} />\n    </Box>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { Heading, HeadingProps } from 'components/Heading';\n\nexport interface AlertTitleProps {\n  title?: string | ReactNode;\n  titleProps?: HeadingProps;\n  isToast?: boolean;\n}\n\nexport const AlertTitle = (props: AlertTitleProps): JSX.Element => {\n  const { title, titleProps, isToast } = props;\n  return (\n    <Heading\n      className=\"Alert__Title\"\n      flexGrow={1}\n      variant={isToast ? 'onContrast' : 'default'}\n      lineHeight={6}\n      size=\"sm\"\n      {...titleProps}\n    >\n      {title}\n    </Heading>\n  );\n};\n","import React, { useMemo } from 'react';\nimport { Box } from '@chakra-ui/react';\nimport { Icon, IconProps } from '../../Icon/icon.component';\nimport { IconName } from 'components/Icon';\nimport { Status } from 'shared/types/status';\nimport { TypographyVariant } from 'shared/types/typography';\n\nexport const AlertStatusIcon: Record<Status, IconName> = {\n  error: 'warningSign',\n  warning: 'warningSign',\n  success: 'checkmark',\n  info: 'infoCircle',\n  default: 'infoCircle',\n};\n\nexport interface AlertIconProps {\n  iconProps?: IconProps;\n  status: Status;\n  isToast: boolean;\n}\n\nexport const AlertIcon = (props: AlertIconProps): JSX.Element => {\n  const { iconProps, status, isToast = false } = props;\n\n  const computedVariant: TypographyVariant = useMemo(() => (status === 'error' ? 'danger' : status), [status]);\n\n  return (\n    <Box className=\"Alert__Icon\" maxH=\"24px\">\n      <Icon\n        variant={isToast ? 'onContrast' : computedVariant}\n        size=\"lg\"\n        name={iconProps?.name || AlertStatusIcon[status]}\n        {...iconProps}\n      />\n    </Box>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { Text, TextProps } from '../../Text/text.component';\n\nexport interface AlertDescriptionProps {\n  description?: string | ReactNode;\n  descriptionProps?: TextProps;\n  isToast: boolean;\n}\n\nexport const AlertDescription = (props: AlertDescriptionProps): JSX.Element => {\n  const { description, descriptionProps, isToast } = props;\n  return typeof description === 'string' ? (\n    <Text className=\"Alert__Description\" size=\"md\" variant={isToast ? 'onContrast' : 'default'} {...descriptionProps}>\n      {description}\n    </Text>\n  ) : (\n    <>{description}</>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { VStack } from '@chakra-ui/react';\n\nexport interface AlertBodyProps {\n  children: ReactNode;\n  hideIcon: boolean;\n  hideCloseButton: boolean;\n}\n\nexport const AlertBody = (props: AlertBodyProps): JSX.Element => {\n  const { children, hideIcon, hideCloseButton } = props;\n  return (\n    <VStack\n      className=\"Alert__Body\"\n      justify=\"flex-start\"\n      align=\"flex-start\"\n      w=\"100%\"\n      pl={!hideIcon ? '34px' : ''}\n      pr={!hideCloseButton ? '34px' : ''}\n    >\n      {children}\n    </VStack>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { HStack } from '@chakra-ui/react';\n\nexport interface AlertHeaderProps {\n  children: ReactNode;\n}\n\nexport const AlertHeader = (props: AlertHeaderProps): JSX.Element => {\n  const { children } = props;\n  return (\n    <HStack className=\"Alert__Header\" w=\"100%\" align=\"flex-start\" justify=\"flex-start\">\n      {children}\n    </HStack>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { Alert as CAlert, AlertProps as CAlertProps, Box, VStack } from '@chakra-ui/react';\nimport { IconProps } from '../Icon/icon.component';\nimport { TextProps } from '../Text/text.component';\nimport { HeadingProps } from '../Heading/heading.component';\nimport { AlertButton, AlertButtonProps } from './components/alertButton.component';\nimport { AlertCloseButton } from './components/alertCloseButton.component';\nimport { AlertTitle } from './components/alertTitle.component';\nimport { AlertIcon } from './components/alertIcon.component';\nimport { AlertDescription } from './components/alertDescription.component';\nimport { AlertBody } from './components/alertBody.component';\nimport { AlertHeader } from './components/alertHeader.component';\nimport { Status } from 'shared/types/status';\n\nexport interface KAlertProps {\n  buttonProps?: AlertButtonProps;\n  children?: ReactNode;\n  description?: string | ReactNode;\n  descriptionProps?: TextProps;\n  hasShadow?: boolean;\n  hideCloseButton?: boolean;\n  hideIcon?: boolean;\n  iconProps?: IconProps;\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  status?: Status;\n  title?: string | ReactNode;\n  titleProps?: HeadingProps;\n  isToast?: boolean;\n}\n\nexport interface AlertProps extends KAlertProps, Omit<CAlertProps, 'title' | 'status'> {}\n\nexport const Alert = ({\n  buttonProps,\n  children,\n  description,\n  descriptionProps,\n  hasShadow = false,\n  hideCloseButton = false,\n  hideIcon = false,\n  iconProps,\n  onClose,\n  status = 'success',\n  title,\n  titleProps,\n  isToast = false,\n  ...rest\n}: AlertProps): JSX.Element => {\n  const computedVariant = isToast ? `${status}Toast` : status;\n  if (buttonProps && !buttonProps.buttonPosition) {\n    buttonProps.buttonPosition = 'topRight';\n  }\n\n  const AlertWithTitle = (): JSX.Element => {\n    return (\n      <>\n        <AlertHeader>\n          {!hideIcon && <AlertIcon isToast={isToast} status={status} iconProps={iconProps} />}\n          <AlertTitle isToast={isToast} title={title} titleProps={titleProps} />\n          {buttonProps?.buttonPosition === 'topRight' && (\n            <AlertButton {...buttonProps} hasDescription={Boolean(description)} isToast={isToast} status={status} />\n          )}\n          {!hideCloseButton && <AlertCloseButton isToast={isToast} onClose={onClose} />}\n        </AlertHeader>\n        <AlertBody hideIcon={hideIcon} hideCloseButton={hideCloseButton}>\n          {description && (\n            <AlertDescription isToast={isToast} description={description} descriptionProps={descriptionProps} />\n          )}\n          {children}\n          {buttonProps?.buttonPosition === 'bottomLeft' && (\n            <AlertButton {...buttonProps} hasDescription={Boolean(description)} isToast={isToast} status={status} />\n          )}\n        </AlertBody>\n      </>\n    );\n  };\n\n  const AlertWithoutTitle = (): JSX.Element => {\n    return (\n      <VStack w=\"100%\" align=\"flex-start\" justify=\"flex-start\">\n        <AlertHeader>\n          {!hideIcon && <AlertIcon isToast={isToast} status={status} iconProps={iconProps} />}\n          <Box flexGrow={1}>\n            {description && (\n              <AlertDescription isToast={isToast} description={description} descriptionProps={descriptionProps} />\n            )}\n            {children}\n          </Box>\n          {buttonProps?.buttonPosition === 'topRight' && (\n            <AlertButton {...buttonProps} hasDescription={Boolean(description)} isToast={isToast} status={status} />\n          )}\n          {!hideCloseButton && <AlertCloseButton isToast={isToast} onClose={onClose} />}\n        </AlertHeader>\n        {buttonProps?.buttonPosition === 'bottomLeft' && (\n          <AlertBody hideIcon={hideIcon} hideCloseButton={hideCloseButton}>\n            <AlertButton {...buttonProps} hasDescription={Boolean(description)} isToast={isToast} status={status} />\n          </AlertBody>\n        )}\n      </VStack>\n    );\n  };\n\n  return (\n    <CAlert\n      flexDirection=\"column\"\n      align=\"flex-start\"\n      justify=\"flex-start\"\n      variant={computedVariant}\n      overflow=\"visible\"\n      px={3}\n      py={2}\n      {...(hasShadow && { boxShadow: 'md' })}\n      {...rest}\n    >\n      {title ? <AlertWithTitle /> : <AlertWithoutTitle />}\n    </CAlert>\n  );\n};\n"],"names":["AlertButton","buttonProps","buttonText","buttonPosition","hasDescription","status","isToast","rest","__rest","React","createElement","Box","className","pt","pb","Button","Object","assign","size","variant","isOnContrast","AlertCloseButton","props","onClose","iconName","onClick","AlertTitle","title","titleProps","Heading","flexGrow","lineHeight","AlertStatusIcon","error","warning","success","info","default","AlertIcon","iconProps","computedVariant","useMemo","maxH","Icon","name","AlertDescription","description","descriptionProps","Text","WrappedText","AlertBody","children","hideIcon","hideCloseButton","VStack","justify","align","w","pl","pr","AlertHeader","HStack","_a","hasShadow","CAlert","Alert","flexDirection","overflow","px","py","boxShadow","Fragment","Boolean"],"mappings":"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"}
+{"version":3,"file":"alert.component-864beab4.js","sources":["../src/components/Alert/components/alertButton.component.tsx","../src/components/Alert/components/alertCloseButton.component.tsx","../src/components/Alert/components/alertTitle.component.tsx","../src/components/Alert/components/alertIcon.component.tsx","../src/components/Alert/components/alertDescription.component.tsx","../src/components/Alert/components/alertBody.component.tsx","../src/components/Alert/components/alertHeader.component.tsx","../src/components/Alert/alert.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Status } from 'shared/types/status';\nimport { Button, ButtonProps } from '../../Button';\nimport { Box } from '@chakra-ui/react';\n\nexport interface AlertButtonProps extends ButtonProps {\n  buttonPosition?: 'topRight' | 'bottomLeft';\n  buttonText: string;\n  hasDescription?: boolean;\n  status?: Status;\n  isToast?: boolean;\n}\n\nexport const AlertButton = (buttonProps: AlertButtonProps): JSX.Element => {\n  const { buttonText, buttonPosition, hasDescription, status, isToast, ...rest } = buttonProps;\n\n  return (\n    <Box\n      className=\"Alert__Button\"\n      pt={buttonPosition === 'bottomLeft' && !hasDescription ? 1 : 0}\n      pb={buttonPosition === 'bottomLeft' ? 0.5 : 0}\n    >\n      <Button size=\"xs\" variant={status === 'default' ? 'primary' : 'secondary'} isOnContrast={isToast} {...rest}>\n        {buttonProps.buttonText}\n      </Button>\n    </Box>\n  );\n};\n","import { Button } from '../../Button/button.component';\nimport React from 'react';\nimport { Box } from '@chakra-ui/react';\n\nexport interface AlertCloseButtonProps {\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  isToast: boolean;\n}\n\nexport const AlertCloseButton = (props: AlertCloseButtonProps): JSX.Element => {\n  const { onClose, isToast } = props;\n  return (\n    <Box className=\"Alert__CloseButton\">\n      <Button variant=\"ghostNeutral\" iconName=\"close\" size=\"xs\" onClick={onClose} isOnContrast={isToast} />\n    </Box>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { Heading, HeadingProps } from 'components/Heading';\n\nexport interface AlertTitleProps {\n  title?: string | ReactNode;\n  titleProps?: HeadingProps;\n  isToast?: boolean;\n}\n\nexport const AlertTitle = (props: AlertTitleProps): JSX.Element => {\n  const { title, titleProps, isToast } = props;\n  return (\n    <Heading\n      className=\"Alert__Title\"\n      flexGrow={1}\n      variant={isToast ? 'onContrast' : 'default'}\n      lineHeight={6}\n      size=\"sm\"\n      {...titleProps}\n    >\n      {title}\n    </Heading>\n  );\n};\n","import React, { useMemo } from 'react';\nimport { Box } from '@chakra-ui/react';\nimport { Icon, IconProps } from '../../Icon/icon.component';\nimport { IconName } from 'components/Icon';\nimport { Status } from 'shared/types/status';\nimport { TypographyVariant } from 'shared/types/typography';\n\nexport const AlertStatusIcon: Record<Status, IconName> = {\n  error: 'warningSign',\n  warning: 'warningSign',\n  success: 'checkmark',\n  info: 'infoCircle',\n  default: 'infoCircle',\n};\n\nexport interface AlertIconProps {\n  iconProps?: IconProps;\n  status: Status;\n  isToast: boolean;\n}\n\nexport const AlertIcon = (props: AlertIconProps): JSX.Element => {\n  const { iconProps, status, isToast = false } = props;\n\n  const computedVariant: TypographyVariant = useMemo(() => (status === 'error' ? 'danger' : status), [status]);\n\n  return (\n    <Box className=\"Alert__Icon\" maxH=\"24px\">\n      <Icon\n        variant={isToast ? 'onContrast' : computedVariant}\n        size=\"lg\"\n        name={iconProps?.name || AlertStatusIcon[status]}\n        {...iconProps}\n      />\n    </Box>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { Text, TextProps } from '../../Text/text.component';\n\nexport interface AlertDescriptionProps {\n  description?: string | ReactNode;\n  descriptionProps?: TextProps;\n  isToast: boolean;\n}\n\nexport const AlertDescription = (props: AlertDescriptionProps): JSX.Element => {\n  const { description, descriptionProps, isToast } = props;\n  return typeof description === 'string' ? (\n    <Text className=\"Alert__Description\" size=\"md\" variant={isToast ? 'onContrast' : 'default'} {...descriptionProps}>\n      {description}\n    </Text>\n  ) : (\n    <>{description}</>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { VStack } from '@chakra-ui/react';\n\nexport interface AlertBodyProps {\n  children: ReactNode;\n  hideIcon: boolean;\n  hideCloseButton: boolean;\n}\n\nexport const AlertBody = (props: AlertBodyProps): JSX.Element => {\n  const { children, hideIcon, hideCloseButton } = props;\n  return (\n    <VStack\n      className=\"Alert__Body\"\n      justify=\"flex-start\"\n      align=\"flex-start\"\n      w=\"100%\"\n      pl={!hideIcon ? '34px' : ''}\n      pr={!hideCloseButton ? '34px' : ''}\n    >\n      {children}\n    </VStack>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { HStack } from '@chakra-ui/react';\n\nexport interface AlertHeaderProps {\n  children: ReactNode;\n}\n\nexport const AlertHeader = (props: AlertHeaderProps): JSX.Element => {\n  const { children } = props;\n  return (\n    <HStack className=\"Alert__Header\" w=\"100%\" align=\"flex-start\" justify=\"flex-start\">\n      {children}\n    </HStack>\n  );\n};\n","import React, { ReactNode } from 'react';\nimport { Alert as CAlert, AlertProps as CAlertProps, Box, VStack } from '@chakra-ui/react';\nimport { IconProps } from '../Icon/icon.component';\nimport { TextProps } from '../Text/text.component';\nimport { HeadingProps } from '../Heading/heading.component';\nimport { AlertButton, AlertButtonProps } from './components/alertButton.component';\nimport { AlertCloseButton } from './components/alertCloseButton.component';\nimport { AlertTitle } from './components/alertTitle.component';\nimport { AlertIcon } from './components/alertIcon.component';\nimport { AlertDescription } from './components/alertDescription.component';\nimport { AlertBody } from './components/alertBody.component';\nimport { AlertHeader } from './components/alertHeader.component';\nimport { Status } from 'shared/types/status';\n\nexport interface KAlertProps {\n  buttonProps?: AlertButtonProps;\n  children?: ReactNode;\n  description?: string | ReactNode;\n  descriptionProps?: TextProps;\n  hasShadow?: boolean;\n  hideCloseButton?: boolean;\n  hideIcon?: boolean;\n  iconProps?: IconProps;\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  status?: Status;\n  title?: string | ReactNode;\n  titleProps?: HeadingProps;\n  isToast?: boolean;\n}\n\nexport interface AlertProps extends KAlertProps, Omit<CAlertProps, 'title' | 'status'> {}\n\nexport const Alert = ({\n  buttonProps,\n  children,\n  description,\n  descriptionProps,\n  hasShadow = false,\n  hideCloseButton = false,\n  hideIcon = false,\n  iconProps,\n  onClose,\n  status = 'success',\n  title,\n  titleProps,\n  isToast = false,\n  ...rest\n}: AlertProps): JSX.Element => {\n  const computedVariant = isToast ? `${status}Toast` : status;\n  if (buttonProps && !buttonProps.buttonPosition) {\n    buttonProps.buttonPosition = 'topRight';\n  }\n\n  const AlertWithTitle = (): JSX.Element => {\n    return (\n      <>\n        <AlertHeader>\n          {!hideIcon && <AlertIcon isToast={isToast} status={status} iconProps={iconProps} />}\n          <AlertTitle isToast={isToast} title={title} titleProps={titleProps} />\n          {buttonProps?.buttonPosition === 'topRight' && (\n            <AlertButton {...buttonProps} hasDescription={Boolean(description)} isToast={isToast} status={status} />\n          )}\n          {!hideCloseButton && <AlertCloseButton isToast={isToast} onClose={onClose} />}\n        </AlertHeader>\n        <AlertBody hideIcon={hideIcon} hideCloseButton={hideCloseButton}>\n          {description && (\n            <AlertDescription isToast={isToast} description={description} descriptionProps={descriptionProps} />\n          )}\n          {children}\n          {buttonProps?.buttonPosition === 'bottomLeft' && (\n            <AlertButton {...buttonProps} hasDescription={Boolean(description)} isToast={isToast} status={status} />\n          )}\n        </AlertBody>\n      </>\n    );\n  };\n\n  const AlertWithoutTitle = (): JSX.Element => {\n    return (\n      <VStack w=\"100%\" align=\"flex-start\" justify=\"flex-start\">\n        <AlertHeader>\n          {!hideIcon && <AlertIcon isToast={isToast} status={status} iconProps={iconProps} />}\n          <Box flexGrow={1}>\n            {description && (\n              <AlertDescription isToast={isToast} description={description} descriptionProps={descriptionProps} />\n            )}\n            {children}\n          </Box>\n          {buttonProps?.buttonPosition === 'topRight' && (\n            <AlertButton {...buttonProps} hasDescription={Boolean(description)} isToast={isToast} status={status} />\n          )}\n          {!hideCloseButton && <AlertCloseButton isToast={isToast} onClose={onClose} />}\n        </AlertHeader>\n        {buttonProps?.buttonPosition === 'bottomLeft' && (\n          <AlertBody hideIcon={hideIcon} hideCloseButton={hideCloseButton}>\n            <AlertButton {...buttonProps} hasDescription={Boolean(description)} isToast={isToast} status={status} />\n          </AlertBody>\n        )}\n      </VStack>\n    );\n  };\n\n  return (\n    <CAlert\n      flexDirection=\"column\"\n      align=\"flex-start\"\n      justify=\"flex-start\"\n      variant={computedVariant}\n      overflow=\"visible\"\n      px={3}\n      py={2}\n      {...(hasShadow && { boxShadow: 'md' })}\n      {...rest}\n    >\n      {title ? <AlertWithTitle /> : <AlertWithoutTitle />}\n    </CAlert>\n  );\n};\n"],"names":["AlertButton","buttonProps","buttonText","buttonPosition","hasDescription","status","isToast","rest","__rest","React","createElement","Box","className","pt","pb","Button","Object","assign","size","variant","isOnContrast","AlertCloseButton","props","onClose","iconName","onClick","AlertTitle","title","titleProps","Heading","flexGrow","lineHeight","AlertStatusIcon","error","warning","success","info","default","AlertIcon","iconProps","computedVariant","useMemo","maxH","Icon","name","AlertDescription","description","descriptionProps","Text","WrappedText","AlertBody","children","hideIcon","hideCloseButton","VStack","justify","align","w","pl","pr","AlertHeader","HStack","_a","hasShadow","CAlert","Alert","flexDirection","overflow","px","py","boxShadow","Fragment","Boolean"],"mappings":"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"}

package/build/{avatar.component-a96cbc6b.js → avatar.component-05bcf698.js}

@@ -1,2 +1,2 @@
-"use strict";var e=require("./tslib.es6-194b75fc.js"),t=require("react"),a=require("./icon.component-729a7547.js"),o=require("./tooltip.component-76a21c48.js"),r=require("./avatar.config-e43cfce7.js"),n=require("./chakra-ui-avatar.esm-eee70d3a.js"),s=require("./chakra-ui-layout.esm-6ee578f7.js"),l=require("./picture.component-b0edf814.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=i(t);const u=(e,t=!0,a=1)=>{let o;switch(e){case"xs":o=t?"sm":"xs";break;case"sm":o=t?"md":"xs";break;case"md":o=t?"lg":"sm";break;case"lg":o=t?"xl":"md";break;case"xl":o=t?"2xl":"lg";break;case"2xl":o=t?"2xl":"xl";break;default:o=e}return a>1&&(o=u(o,t,a-1)),o},d=({avatarSize:e,iconName:o,bg:s="background.info",borderColor:l="border.strongContrast",iconVariant:i="info",position:u="bottomRight"})=>{const d=t.useMemo((()=>"xs"===e||!o),[o,e]);return c.default.createElement(n.AvatarBadge,{borderColor:l,borderWidth:"1px",bg:s,boxSize:d?"10px":"18px",transform:(t=>{var a,o,n,s;const l=null===(s=null===(n=null===(o=null===(a=r.AvatarConfig.sizes)||void 0===a?void 0:a[e])||void 0===o?void 0:o.container)||void 0===n?void 0:n.height)||void 0===s?void 0:s.toString(),i=Number(null==l?void 0:l.replace("px","")),c="xl"!==e?i/2:i/4;switch(t){case"topLeft":return d&&"xs"!==e?`translate(${-1.35*c}px, ${-1.35*c}px)`:`translate(${-1.2*c}px, ${-1.2*c}px)`;case"topRight":return d&&"xs"!==e?`translate(${c/10}px, ${-1.35*c}px)`:`translate(${c/3}px, ${-1.2*c}px)`;case"bottomLeft":return d&&"xs"!==e?`translate(${-1.35*c}px, ${c/10}px)`:`translate(${-1.2*c}px, ${c/5}px)`;default:return d&&"xs"!==e?`translate(${c/10}px, ${c/10}px)`:`translate(${c/3}px, ${c/3}px)`}})(u)},!d&&o&&c.default.createElement(a.Icon,{name:o,variant:i,size:"xs"}))},p=({handleRemoveButtonClick:e,isBeingHovered:o,setIsBeingHovered:r})=>{const n=t.useCallback((t=>{t.stopPropagation(),e&&e(t)}),[e]);return c.default.createElement(s.Flex,{className:"Avatar__RemoveButton",backgroundColor:"background.default",borderRadius:"full",cursor:"pointer",position:"absolute",top:"-6px",h:4,w:4,right:"-6px",justify:"center",align:"center",onClick:n,onMouseEnter:()=>r(!0),zIndex:"tooltip",onMouseLeave:()=>r(!1)},c.default.createElement(a.Icon,{variant:"default",name:"closeCircleSolid",size:o?"sm":"xs"}))},m=({src:e,webpSrc:t})=>c.default.createElement(s.Box,{className:"Avatar__Image"},c.default.createElement(l.Picture,{src:e,webpSrc:t,imgProps:{w:"100%",h:"100%",objectFit:"cover",borderRadius:"full",position:"absolute",top:0,left:0}}));exports.Avatar=r=>{var{badgeProps:s,handleClick:l,handleRemoveButtonClick:i,hideBorder:b=!1,iconName:x,name:v="",randomizeVariant:f=!1,randomizationType:g="outline",showBadge:h=!1,showRemoveButton:k=!1,showTooltip:C=!0,size:w="md",src:B,tooltipPlacement:$="bottom",tooltipText:z,variant:S="default",webpSrc:E}=r,_=e.__rest(r,["badgeProps","handleClick","handleRemoveButtonClick","hideBorder","iconName","name","randomizeVariant","randomizationType","showBadge","showRemoveButton","showTooltip","size","src","tooltipPlacement","tooltipText","variant","webpSrc"]);const[j,R]=t.useState(!1),[A,q]=t.useState(!1),y="xs"===w;let I=S;var P,T;f&&(P=v.charCodeAt(0),T=g,I=P>=65&&P<=77?"outline"===T?"outlineAccent":"accent":"outline"===T?"outlineAccentSubtle":"accentSubtle");const M=t.useMemo((()=>{let e={_hover:{img:{opacity:1},_after:{content:'""',backgroundColor:"background.alpha.hover",w:"110%",h:"110%",borderRadius:"full",position:"absolute"}},_active:{img:{opacity:1},_after:{content:'""',backgroundColor:"background.alpha.pressed",w:"110%",h:"110%",borderRadius:"full",position:"absolute"}}};return"contrast"===S&&(e._hover._after.backgroundColor="background.alphaContrast.hover",e._active._after.backgroundColor="background.alphaContrast.pressed"),e}),[S]),N=c.default.createElement(n.Avatar,Object.assign({name:x?"":v,size:w,src:E?void 0:B,variant:I,boxShadow:"0 0 0 1px var(--chakra-colors-border-strongContrast)",borderWidth:b?"0px":"2px",cursor:"default"},x&&{icon:c.default.createElement(a.Icon,{name:x,size:u(w,!0,"sm"===w||"xs"===w?2:1)})},l&&Object.assign({onClick:l,cursor:"pointer"},M),{onMouseEnter:()=>R(!0),onMouseLeave:()=>R(!1)},_),k&&j&&!y&&c.default.createElement(p,{handleRemoveButtonClick:i,isBeingHovered:A,setIsBeingHovered:q}),h&&c.default.createElement(d,Object.assign({avatarSize:w},s)),E&&B&&c.default.createElement(m,{src:B,webpSrc:E}));return C&&!A?c.default.createElement(o.Tooltip,{label:z||v,placement:$},N):N};
-//# sourceMappingURL=avatar.component-a96cbc6b.js.map
+"use strict";var e=require("./tslib.es6-d6f17add.js"),t=require("react"),a=require("./icon.component-729a7547.js"),o=require("./tooltip.component-197bff7c.js"),r=require("./avatar.config-e43cfce7.js"),n=require("./chakra-ui-avatar.esm-eee70d3a.js"),s=require("./chakra-ui-layout.esm-6ee578f7.js"),l=require("./picture.component-19489bee.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=i(t);const u=(e,t=!0,a=1)=>{let o;switch(e){case"xs":o=t?"sm":"xs";break;case"sm":o=t?"md":"xs";break;case"md":o=t?"lg":"sm";break;case"lg":o=t?"xl":"md";break;case"xl":o=t?"2xl":"lg";break;case"2xl":o=t?"2xl":"xl";break;default:o=e}return a>1&&(o=u(o,t,a-1)),o},d=({avatarSize:e,iconName:o,bg:s="background.info",borderColor:l="border.strongContrast",iconVariant:i="info",position:u="bottomRight"})=>{const d=t.useMemo((()=>"xs"===e||!o),[o,e]);return c.default.createElement(n.AvatarBadge,{borderColor:l,borderWidth:"1px",bg:s,boxSize:d?"10px":"18px",transform:(t=>{var a,o,n,s;const l=null===(s=null===(n=null===(o=null===(a=r.AvatarConfig.sizes)||void 0===a?void 0:a[e])||void 0===o?void 0:o.container)||void 0===n?void 0:n.height)||void 0===s?void 0:s.toString(),i=Number(null==l?void 0:l.replace("px","")),c="xl"!==e?i/2:i/4;switch(t){case"topLeft":return d&&"xs"!==e?`translate(${-1.35*c}px, ${-1.35*c}px)`:`translate(${-1.2*c}px, ${-1.2*c}px)`;case"topRight":return d&&"xs"!==e?`translate(${c/10}px, ${-1.35*c}px)`:`translate(${c/3}px, ${-1.2*c}px)`;case"bottomLeft":return d&&"xs"!==e?`translate(${-1.35*c}px, ${c/10}px)`:`translate(${-1.2*c}px, ${c/5}px)`;default:return d&&"xs"!==e?`translate(${c/10}px, ${c/10}px)`:`translate(${c/3}px, ${c/3}px)`}})(u)},!d&&o&&c.default.createElement(a.Icon,{name:o,variant:i,size:"xs"}))},p=({handleRemoveButtonClick:e,isBeingHovered:o,setIsBeingHovered:r})=>{const n=t.useCallback((t=>{t.stopPropagation(),e&&e(t)}),[e]);return c.default.createElement(s.Flex,{className:"Avatar__RemoveButton",backgroundColor:"background.default",borderRadius:"full",cursor:"pointer",position:"absolute",top:"-6px",h:4,w:4,right:"-6px",justify:"center",align:"center",onClick:n,onMouseEnter:()=>r(!0),zIndex:"tooltip",onMouseLeave:()=>r(!1)},c.default.createElement(a.Icon,{variant:"default",name:"closeCircleSolid",size:o?"sm":"xs"}))},m=({src:e,webpSrc:t})=>c.default.createElement(s.Box,{className:"Avatar__Image"},c.default.createElement(l.Picture,{src:e,webpSrc:t,imgProps:{w:"100%",h:"100%",objectFit:"cover",borderRadius:"full",position:"absolute",top:0,left:0}}));exports.Avatar=r=>{var{badgeProps:s,handleClick:l,handleRemoveButtonClick:i,hideBorder:b=!1,iconName:x,name:v="",randomizeVariant:f=!1,randomizationType:g="outline",showBadge:h=!1,showRemoveButton:k=!1,showTooltip:C=!0,size:w="md",src:B,tooltipPlacement:$="bottom",tooltipText:z,variant:S="default",webpSrc:E}=r,_=e.__rest(r,["badgeProps","handleClick","handleRemoveButtonClick","hideBorder","iconName","name","randomizeVariant","randomizationType","showBadge","showRemoveButton","showTooltip","size","src","tooltipPlacement","tooltipText","variant","webpSrc"]);const[j,R]=t.useState(!1),[A,q]=t.useState(!1),y="xs"===w;let I=S;var P,T;f&&(P=v.charCodeAt(0),T=g,I=P>=65&&P<=77?"outline"===T?"outlineAccent":"accent":"outline"===T?"outlineAccentSubtle":"accentSubtle");const M=t.useMemo((()=>{let e={_hover:{img:{opacity:1},_after:{content:'""',backgroundColor:"background.alpha.hover",w:"110%",h:"110%",borderRadius:"full",position:"absolute"}},_active:{img:{opacity:1},_after:{content:'""',backgroundColor:"background.alpha.pressed",w:"110%",h:"110%",borderRadius:"full",position:"absolute"}}};return"contrast"===S&&(e._hover._after.backgroundColor="background.alphaContrast.hover",e._active._after.backgroundColor="background.alphaContrast.pressed"),e}),[S]),N=c.default.createElement(n.Avatar,Object.assign({name:x?"":v,size:w,src:E?void 0:B,variant:I,boxShadow:"0 0 0 1px var(--chakra-colors-border-strongContrast)",borderWidth:b?"0px":"2px",cursor:"default"},x&&{icon:c.default.createElement(a.Icon,{name:x,size:u(w,!0,"sm"===w||"xs"===w?2:1)})},l&&Object.assign({onClick:l,cursor:"pointer"},M),{onMouseEnter:()=>R(!0),onMouseLeave:()=>R(!1)},_),k&&j&&!y&&c.default.createElement(p,{handleRemoveButtonClick:i,isBeingHovered:A,setIsBeingHovered:q}),h&&c.default.createElement(d,Object.assign({avatarSize:w},s)),E&&B&&c.default.createElement(m,{src:B,webpSrc:E}));return C&&!A?c.default.createElement(o.Tooltip,{label:z||v,placement:$},N):N};
+//# sourceMappingURL=avatar.component-05bcf698.js.map

package/build/{avatar.component-a96cbc6b.js.map → avatar.component-05bcf698.js.map}

@@ -1 +1 @@
-{"version":3,"file":"avatar.component-a96cbc6b.js","sources":["../src/shared/utils/sizes.ts","../src/components/Avatar/components/avatarBadge.component.tsx","../src/components/Avatar/components/avatarRemoveButton.component.tsx","../src/components/Avatar/components/avatarImage.component.tsx","../src/components/Avatar/avatar.component.tsx"],"sourcesContent":["import { AvatarSize } from 'components/Avatar/avatar.types';\nimport { IconSize } from 'components/Icon/icon.types';\n\nexport const getNextIconSize = (size: IconSize | AvatarSize, larger = true, count = 1): IconSize => {\n  let nextSize: IconSize;\n  switch (size) {\n    case 'xs':\n      nextSize = larger ? 'sm' : 'xs';\n      break;\n    case 'sm':\n      nextSize = larger ? 'md' : 'xs';\n      break;\n    case 'md':\n      nextSize = larger ? 'lg' : 'sm';\n      break;\n    case 'lg':\n      nextSize = larger ? 'xl' : 'md';\n      break;\n    case 'xl':\n      nextSize = larger ? '2xl' : 'lg';\n      break;\n    case '2xl':\n      nextSize = larger ? '2xl' : 'xl';\n      break;\n    default:\n      nextSize = size as IconSize;\n      break;\n  }\n\n  if (count > 1) {\n    nextSize = getNextIconSize(nextSize, larger, count - 1);\n  }\n\n  return nextSize;\n};\n","import React, { useMemo } from 'react';\nimport { AvatarBadge as CAvatarBadge } from '@chakra-ui/react';\nimport { Icon } from '../../Icon/icon.component';\nimport { AvatarSize } from '../avatar.types';\nimport { AvatarConfig } from '../avatar.config';\nimport { SemanticBackgroundColorToken, SemanticBorderColorToken } from 'theme/tokens/colors';\nimport { StyleInterpolationObject } from 'shared/types/chakra';\nimport { IconName } from '../../../icons';\nimport { AvatarBadgePosition } from '../avatar.types';\nimport { TypographyVariant } from 'shared/types/typography';\n\nexport interface AvatarBadgeProps {\n  iconName?: IconName;\n  bg?: SemanticBackgroundColorToken;\n  borderColor?: SemanticBorderColorToken;\n  iconVariant?: TypographyVariant;\n  position?: AvatarBadgePosition;\n}\n\ninterface AvatarBadgeComponentProps extends AvatarBadgeProps {\n  avatarSize: AvatarSize;\n}\n\nexport const AvatarBadge = ({\n  avatarSize,\n  iconName,\n  bg = 'background.info',\n  borderColor = 'border.strongContrast',\n  iconVariant = 'info',\n  position = 'bottomRight',\n}: AvatarBadgeComponentProps): JSX.Element => {\n  const useSmallBadge = useMemo(() => avatarSize === 'xs' || !iconName, [iconName, avatarSize]);\n\n  const getBadgeTransform = (position: AvatarBadgePosition): string => {\n    const parentSizeString = (\n      AvatarConfig.sizes?.[avatarSize] as StyleInterpolationObject\n    )?.container?.height?.toString();\n    const parentSize = Number(parentSizeString?.replace('px', ''));\n    const translation = avatarSize !== 'xl' ? parentSize / 2 : parentSize / 4;\n\n    switch (position) {\n      case 'topLeft':\n        return useSmallBadge && avatarSize !== 'xs'\n          ? `translate(${translation * -1.35}px, ${translation * -1.35}px)`\n          : `translate(${translation * -1.2}px, ${translation * -1.2}px)`;\n      case 'topRight':\n        return useSmallBadge && avatarSize !== 'xs'\n          ? `translate(${translation / 10}px, ${translation * -1.35}px)`\n          : `translate(${translation / 3}px, ${translation * -1.2}px)`;\n      case 'bottomLeft':\n        return useSmallBadge && avatarSize !== 'xs'\n          ? `translate(${translation * -1.35}px, ${translation / 10}px)`\n          : `translate(${translation * -1.2}px, ${translation / 5}px)`;\n      default:\n        return useSmallBadge && avatarSize !== 'xs'\n          ? `translate(${translation / 10}px, ${translation / 10}px)`\n          : `translate(${translation / 3}px, ${translation / 3}px)`;\n    }\n  };\n\n  return (\n    <CAvatarBadge\n      borderColor={borderColor}\n      borderWidth=\"1px\"\n      bg={bg}\n      boxSize={useSmallBadge ? '10px' : '18px'}\n      transform={getBadgeTransform(position)}\n    >\n      {!useSmallBadge && iconName && <Icon name={iconName} variant={iconVariant} size={'xs'} />}\n    </CAvatarBadge>\n  );\n};\n","import React, { useCallback, MouseEvent, MouseEventHandler, Dispatch, SetStateAction } from 'react';\nimport { Flex } from '@chakra-ui/react';\nimport { Icon } from 'components/Icon/icon.component';\n\ninterface AvatarRemoveButtonProps {\n  handleRemoveButtonClick?: MouseEventHandler<HTMLDivElement>;\n  isBeingHovered: boolean;\n  setIsBeingHovered: Dispatch<SetStateAction<boolean>>;\n}\n\nconst AvatarRemoveButton = ({\n  handleRemoveButtonClick,\n  isBeingHovered,\n  setIsBeingHovered,\n}: AvatarRemoveButtonProps): JSX.Element => {\n  const onRemoveButtonClick = useCallback(\n    (e: MouseEvent<HTMLDivElement>) => {\n      e.stopPropagation();\n\n      if (handleRemoveButtonClick) {\n        handleRemoveButtonClick(e);\n      }\n    },\n    [handleRemoveButtonClick],\n  );\n  return (\n    <Flex\n      className=\"Avatar__RemoveButton\"\n      backgroundColor=\"background.default\"\n      borderRadius=\"full\"\n      cursor=\"pointer\"\n      position=\"absolute\"\n      top=\"-6px\"\n      h={4}\n      w={4}\n      right=\"-6px\"\n      justify=\"center\"\n      align=\"center\"\n      onClick={onRemoveButtonClick}\n      onMouseEnter={(): void => setIsBeingHovered(true)}\n      zIndex=\"tooltip\"\n      onMouseLeave={(): void => setIsBeingHovered(false)}\n    >\n      <Icon variant=\"default\" name=\"closeCircleSolid\" size={isBeingHovered ? 'sm' : 'xs'} />\n    </Flex>\n  );\n};\n\nexport default AvatarRemoveButton;\n","import { Box } from '@chakra-ui/react';\nimport { Picture } from 'components/Picture';\nimport React from 'react';\n\ninterface AvatarImageProps {\n  src: string;\n  webpSrc: string;\n}\n\nconst AvatarImage = ({ src, webpSrc }: AvatarImageProps): JSX.Element => {\n  return (\n    <Box className=\"Avatar__Image\">\n      <Picture\n        src={src}\n        webpSrc={webpSrc}\n        imgProps={{\n          w: '100%',\n          h: '100%',\n          objectFit: 'cover',\n          borderRadius: 'full',\n          position: 'absolute',\n          top: 0,\n          left: 0,\n        }}\n      />\n    </Box>\n  );\n};\n\nexport default AvatarImage;\n","import React, { useState, useMemo, MouseEventHandler } from 'react';\nimport { Placement, Avatar as CAvatar, AvatarProps as CAvatarProps } from '@chakra-ui/react';\nimport { Icon } from '../Icon/icon.component';\nimport { Tooltip } from '../Tooltip/tooltip.component';\nimport { AvatarSize, AvatarType, AvatarVariant } from './avatar.types';\nimport { getNextIconSize } from 'shared/utils/sizes';\nimport { AvatarBadge, AvatarBadgeProps } from './components/avatarBadge.component';\nimport { IconName } from '../../icons';\nimport AvatarRemoveButton from './components/avatarRemoveButton.component';\nimport AvatarImage from './components/avatarImage.component';\n\nexport interface KAvatarProps {\n  badgeProps?: AvatarBadgeProps;\n  handleClick?: MouseEventHandler<HTMLSpanElement>;\n  handleRemoveButtonClick?: MouseEventHandler<HTMLDivElement>;\n  hideBorder?: boolean;\n  iconName?: IconName;\n  name?: string;\n  randomizeVariant?: boolean;\n  randomizationType?: AvatarType;\n  showBadge?: boolean;\n  showRemoveButton?: boolean;\n  showTooltip?: boolean;\n  size?: AvatarSize;\n  src?: string;\n  tooltipPlacement?: Placement;\n  tooltipText?: string;\n  variant?: AvatarVariant;\n  webpSrc?: string;\n}\n\nexport type AvatarProps = KAvatarProps & CAvatarProps;\n\nconst getRandomizedAvatarVariant = (charCode: number, type: AvatarType): AvatarVariant => {\n  if (charCode >= 65 && charCode <= 77) {\n    return type === 'outline' ? 'outlineAccent' : 'accent';\n  } else {\n    return type === 'outline' ? 'outlineAccentSubtle' : 'accentSubtle';\n  }\n};\n\nexport const Avatar = ({\n  badgeProps,\n  handleClick,\n  handleRemoveButtonClick,\n  hideBorder = false,\n  iconName,\n  name = '',\n  randomizeVariant = false,\n  randomizationType = 'outline',\n  showBadge = false,\n  showRemoveButton = false,\n  showTooltip = true,\n  size = 'md',\n  src,\n  tooltipPlacement = 'bottom',\n  tooltipText,\n  variant = 'default',\n  webpSrc,\n  ...rest\n}: AvatarProps): JSX.Element => {\n  const [isHoveringAvatar, setIsHoveringAvatar] = useState(false);\n  const [isHoveringRemoveButton, setIsHoveringRemoveButton] = useState(false);\n  const shouldHideRemoveButton = size === 'xs';\n\n  let _variant = variant;\n\n  if (randomizeVariant) {\n    _variant = getRandomizedAvatarVariant(name.charCodeAt(0), randomizationType);\n  }\n\n  // These styles are not defined in the config file because they\n  // should only be applied if the avatar has a click handler defined\n  const hoverActiveStyles = useMemo(() => {\n    let styles = {\n      _hover: {\n        img: { opacity: 1 },\n        _after: {\n          content: '\"\"',\n          backgroundColor: 'background.alpha.hover',\n          w: '110%',\n          h: '110%',\n          borderRadius: 'full',\n          position: 'absolute',\n        },\n      },\n      _active: {\n        img: { opacity: 1 },\n        _after: {\n          content: '\"\"',\n          backgroundColor: 'background.alpha.pressed',\n          w: '110%',\n          h: '110%',\n          borderRadius: 'full',\n          position: 'absolute',\n        },\n      },\n    };\n\n    if (variant === 'contrast') {\n      styles._hover._after.backgroundColor = 'background.alphaContrast.hover';\n      styles._active._after.backgroundColor = 'background.alphaContrast.pressed';\n    }\n\n    return styles;\n  }, [variant]);\n\n  const avatarMarkup = (\n    <CAvatar\n      name={iconName ? '' : name}\n      size={size}\n      src={!!webpSrc ? undefined : src}\n      variant={_variant}\n      boxShadow=\"0 0 0 1px var(--chakra-colors-border-strongContrast)\"\n      borderWidth={hideBorder ? '0px' : '2px'}\n      cursor=\"default\"\n      {...(iconName && {\n        icon: <Icon name={iconName} size={getNextIconSize(size, true, size === 'sm' || size === 'xs' ? 2 : 1)} />,\n      })}\n      {...(handleClick && {\n        onClick: handleClick,\n        cursor: 'pointer',\n        ...hoverActiveStyles,\n      })}\n      onMouseEnter={(): void => setIsHoveringAvatar(true)}\n      onMouseLeave={(): void => setIsHoveringAvatar(false)}\n      {...rest}\n    >\n      {showRemoveButton && isHoveringAvatar && !shouldHideRemoveButton && (\n        <AvatarRemoveButton\n          handleRemoveButtonClick={handleRemoveButtonClick}\n          isBeingHovered={isHoveringRemoveButton}\n          setIsBeingHovered={setIsHoveringRemoveButton}\n        />\n      )}\n      {showBadge && <AvatarBadge avatarSize={size} {...badgeProps} />}\n      {webpSrc && src && <AvatarImage src={src} webpSrc={webpSrc} />}\n    </CAvatar>\n  );\n\n  if (showTooltip && !isHoveringRemoveButton) {\n    return (\n      <Tooltip label={tooltipText || name} placement={tooltipPlacement}>\n        {avatarMarkup}\n      </Tooltip>\n    );\n  }\n\n  return avatarMarkup;\n};\n"],"names":["getNextIconSize","size","larger","count","nextSize","AvatarBadge","avatarSize","iconName","bg","borderColor","iconVariant","position","useSmallBadge","useMemo","React","createElement","CAvatarBadge","borderWidth","boxSize","transform","parentSizeString","_d","_b","_a","AvatarConfig","sizes","container","_c","height","toString","parentSize","Number","replace","translation","getBadgeTransform","Icon","name","variant","AvatarRemoveButton","handleRemoveButtonClick","isBeingHovered","setIsBeingHovered","onRemoveButtonClick","useCallback","e","stopPropagation","Flex","className","backgroundColor","borderRadius","cursor","top","h","w","right","justify","align","onClick","onMouseEnter","zIndex","onMouseLeave","AvatarImage","src","webpSrc","Box","Picture","imgProps","objectFit","left","badgeProps","handleClick","hideBorder","randomizeVariant","randomizationType","showBadge","showRemoveButton","showTooltip","tooltipPlacement","tooltipText","rest","__rest","isHoveringAvatar","setIsHoveringAvatar","useState","isHoveringRemoveButton","setIsHoveringRemoveButton","shouldHideRemoveButton","_variant","charCode","type","charCodeAt","hoverActiveStyles","styles","_hover","img","opacity","_after","content","_active","avatarMarkup","CAvatar","Avatar","Object","assign","undefined","boxShadow","icon","Tooltip","label","placement"],"mappings":"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"}
+{"version":3,"file":"avatar.component-05bcf698.js","sources":["../src/shared/utils/sizes.ts","../src/components/Avatar/components/avatarBadge.component.tsx","../src/components/Avatar/components/avatarRemoveButton.component.tsx","../src/components/Avatar/components/avatarImage.component.tsx","../src/components/Avatar/avatar.component.tsx"],"sourcesContent":["import { AvatarSize } from 'components/Avatar/avatar.types';\nimport { IconSize } from 'components/Icon/icon.types';\n\nexport const getNextIconSize = (size: IconSize | AvatarSize, larger = true, count = 1): IconSize => {\n  let nextSize: IconSize;\n  switch (size) {\n    case 'xs':\n      nextSize = larger ? 'sm' : 'xs';\n      break;\n    case 'sm':\n      nextSize = larger ? 'md' : 'xs';\n      break;\n    case 'md':\n      nextSize = larger ? 'lg' : 'sm';\n      break;\n    case 'lg':\n      nextSize = larger ? 'xl' : 'md';\n      break;\n    case 'xl':\n      nextSize = larger ? '2xl' : 'lg';\n      break;\n    case '2xl':\n      nextSize = larger ? '2xl' : 'xl';\n      break;\n    default:\n      nextSize = size as IconSize;\n      break;\n  }\n\n  if (count > 1) {\n    nextSize = getNextIconSize(nextSize, larger, count - 1);\n  }\n\n  return nextSize;\n};\n","import React, { useMemo } from 'react';\nimport { AvatarBadge as CAvatarBadge } from '@chakra-ui/react';\nimport { Icon } from '../../Icon/icon.component';\nimport { AvatarSize } from '../avatar.types';\nimport { AvatarConfig } from '../avatar.config';\nimport { SemanticBackgroundColorToken, SemanticBorderColorToken } from 'theme/tokens/colors';\nimport { StyleInterpolationObject } from 'shared/types/chakra';\nimport { IconName } from '../../../icons';\nimport { AvatarBadgePosition } from '../avatar.types';\nimport { TypographyVariant } from 'shared/types/typography';\n\nexport interface AvatarBadgeProps {\n  iconName?: IconName;\n  bg?: SemanticBackgroundColorToken;\n  borderColor?: SemanticBorderColorToken;\n  iconVariant?: TypographyVariant;\n  position?: AvatarBadgePosition;\n}\n\ninterface AvatarBadgeComponentProps extends AvatarBadgeProps {\n  avatarSize: AvatarSize;\n}\n\nexport const AvatarBadge = ({\n  avatarSize,\n  iconName,\n  bg = 'background.info',\n  borderColor = 'border.strongContrast',\n  iconVariant = 'info',\n  position = 'bottomRight',\n}: AvatarBadgeComponentProps): JSX.Element => {\n  const useSmallBadge = useMemo(() => avatarSize === 'xs' || !iconName, [iconName, avatarSize]);\n\n  const getBadgeTransform = (position: AvatarBadgePosition): string => {\n    const parentSizeString = (\n      AvatarConfig.sizes?.[avatarSize] as StyleInterpolationObject\n    )?.container?.height?.toString();\n    const parentSize = Number(parentSizeString?.replace('px', ''));\n    const translation = avatarSize !== 'xl' ? parentSize / 2 : parentSize / 4;\n\n    switch (position) {\n      case 'topLeft':\n        return useSmallBadge && avatarSize !== 'xs'\n          ? `translate(${translation * -1.35}px, ${translation * -1.35}px)`\n          : `translate(${translation * -1.2}px, ${translation * -1.2}px)`;\n      case 'topRight':\n        return useSmallBadge && avatarSize !== 'xs'\n          ? `translate(${translation / 10}px, ${translation * -1.35}px)`\n          : `translate(${translation / 3}px, ${translation * -1.2}px)`;\n      case 'bottomLeft':\n        return useSmallBadge && avatarSize !== 'xs'\n          ? `translate(${translation * -1.35}px, ${translation / 10}px)`\n          : `translate(${translation * -1.2}px, ${translation / 5}px)`;\n      default:\n        return useSmallBadge && avatarSize !== 'xs'\n          ? `translate(${translation / 10}px, ${translation / 10}px)`\n          : `translate(${translation / 3}px, ${translation / 3}px)`;\n    }\n  };\n\n  return (\n    <CAvatarBadge\n      borderColor={borderColor}\n      borderWidth=\"1px\"\n      bg={bg}\n      boxSize={useSmallBadge ? '10px' : '18px'}\n      transform={getBadgeTransform(position)}\n    >\n      {!useSmallBadge && iconName && <Icon name={iconName} variant={iconVariant} size={'xs'} />}\n    </CAvatarBadge>\n  );\n};\n","import React, { useCallback, MouseEvent, MouseEventHandler, Dispatch, SetStateAction } from 'react';\nimport { Flex } from '@chakra-ui/react';\nimport { Icon } from 'components/Icon/icon.component';\n\ninterface AvatarRemoveButtonProps {\n  handleRemoveButtonClick?: MouseEventHandler<HTMLDivElement>;\n  isBeingHovered: boolean;\n  setIsBeingHovered: Dispatch<SetStateAction<boolean>>;\n}\n\nconst AvatarRemoveButton = ({\n  handleRemoveButtonClick,\n  isBeingHovered,\n  setIsBeingHovered,\n}: AvatarRemoveButtonProps): JSX.Element => {\n  const onRemoveButtonClick = useCallback(\n    (e: MouseEvent<HTMLDivElement>) => {\n      e.stopPropagation();\n\n      if (handleRemoveButtonClick) {\n        handleRemoveButtonClick(e);\n      }\n    },\n    [handleRemoveButtonClick],\n  );\n  return (\n    <Flex\n      className=\"Avatar__RemoveButton\"\n      backgroundColor=\"background.default\"\n      borderRadius=\"full\"\n      cursor=\"pointer\"\n      position=\"absolute\"\n      top=\"-6px\"\n      h={4}\n      w={4}\n      right=\"-6px\"\n      justify=\"center\"\n      align=\"center\"\n      onClick={onRemoveButtonClick}\n      onMouseEnter={(): void => setIsBeingHovered(true)}\n      zIndex=\"tooltip\"\n      onMouseLeave={(): void => setIsBeingHovered(false)}\n    >\n      <Icon variant=\"default\" name=\"closeCircleSolid\" size={isBeingHovered ? 'sm' : 'xs'} />\n    </Flex>\n  );\n};\n\nexport default AvatarRemoveButton;\n","import { Box } from '@chakra-ui/react';\nimport { Picture } from 'components/Picture';\nimport React from 'react';\n\ninterface AvatarImageProps {\n  src: string;\n  webpSrc: string;\n}\n\nconst AvatarImage = ({ src, webpSrc }: AvatarImageProps): JSX.Element => {\n  return (\n    <Box className=\"Avatar__Image\">\n      <Picture\n        src={src}\n        webpSrc={webpSrc}\n        imgProps={{\n          w: '100%',\n          h: '100%',\n          objectFit: 'cover',\n          borderRadius: 'full',\n          position: 'absolute',\n          top: 0,\n          left: 0,\n        }}\n      />\n    </Box>\n  );\n};\n\nexport default AvatarImage;\n","import React, { useState, useMemo, MouseEventHandler } from 'react';\nimport { Placement, Avatar as CAvatar, AvatarProps as CAvatarProps } from '@chakra-ui/react';\nimport { Icon } from '../Icon/icon.component';\nimport { Tooltip } from '../Tooltip/tooltip.component';\nimport { AvatarSize, AvatarType, AvatarVariant } from './avatar.types';\nimport { getNextIconSize } from 'shared/utils/sizes';\nimport { AvatarBadge, AvatarBadgeProps } from './components/avatarBadge.component';\nimport { IconName } from '../../icons';\nimport AvatarRemoveButton from './components/avatarRemoveButton.component';\nimport AvatarImage from './components/avatarImage.component';\n\nexport interface KAvatarProps {\n  badgeProps?: AvatarBadgeProps;\n  handleClick?: MouseEventHandler<HTMLSpanElement>;\n  handleRemoveButtonClick?: MouseEventHandler<HTMLDivElement>;\n  hideBorder?: boolean;\n  iconName?: IconName;\n  name?: string;\n  randomizeVariant?: boolean;\n  randomizationType?: AvatarType;\n  showBadge?: boolean;\n  showRemoveButton?: boolean;\n  showTooltip?: boolean;\n  size?: AvatarSize;\n  src?: string;\n  tooltipPlacement?: Placement;\n  tooltipText?: string;\n  variant?: AvatarVariant;\n  webpSrc?: string;\n}\n\nexport type AvatarProps = KAvatarProps & CAvatarProps;\n\nconst getRandomizedAvatarVariant = (charCode: number, type: AvatarType): AvatarVariant => {\n  if (charCode >= 65 && charCode <= 77) {\n    return type === 'outline' ? 'outlineAccent' : 'accent';\n  } else {\n    return type === 'outline' ? 'outlineAccentSubtle' : 'accentSubtle';\n  }\n};\n\nexport const Avatar = ({\n  badgeProps,\n  handleClick,\n  handleRemoveButtonClick,\n  hideBorder = false,\n  iconName,\n  name = '',\n  randomizeVariant = false,\n  randomizationType = 'outline',\n  showBadge = false,\n  showRemoveButton = false,\n  showTooltip = true,\n  size = 'md',\n  src,\n  tooltipPlacement = 'bottom',\n  tooltipText,\n  variant = 'default',\n  webpSrc,\n  ...rest\n}: AvatarProps): JSX.Element => {\n  const [isHoveringAvatar, setIsHoveringAvatar] = useState(false);\n  const [isHoveringRemoveButton, setIsHoveringRemoveButton] = useState(false);\n  const shouldHideRemoveButton = size === 'xs';\n\n  let _variant = variant;\n\n  if (randomizeVariant) {\n    _variant = getRandomizedAvatarVariant(name.charCodeAt(0), randomizationType);\n  }\n\n  // These styles are not defined in the config file because they\n  // should only be applied if the avatar has a click handler defined\n  const hoverActiveStyles = useMemo(() => {\n    let styles = {\n      _hover: {\n        img: { opacity: 1 },\n        _after: {\n          content: '\"\"',\n          backgroundColor: 'background.alpha.hover',\n          w: '110%',\n          h: '110%',\n          borderRadius: 'full',\n          position: 'absolute',\n        },\n      },\n      _active: {\n        img: { opacity: 1 },\n        _after: {\n          content: '\"\"',\n          backgroundColor: 'background.alpha.pressed',\n          w: '110%',\n          h: '110%',\n          borderRadius: 'full',\n          position: 'absolute',\n        },\n      },\n    };\n\n    if (variant === 'contrast') {\n      styles._hover._after.backgroundColor = 'background.alphaContrast.hover';\n      styles._active._after.backgroundColor = 'background.alphaContrast.pressed';\n    }\n\n    return styles;\n  }, [variant]);\n\n  const avatarMarkup = (\n    <CAvatar\n      name={iconName ? '' : name}\n      size={size}\n      src={!!webpSrc ? undefined : src}\n      variant={_variant}\n      boxShadow=\"0 0 0 1px var(--chakra-colors-border-strongContrast)\"\n      borderWidth={hideBorder ? '0px' : '2px'}\n      cursor=\"default\"\n      {...(iconName && {\n        icon: <Icon name={iconName} size={getNextIconSize(size, true, size === 'sm' || size === 'xs' ? 2 : 1)} />,\n      })}\n      {...(handleClick && {\n        onClick: handleClick,\n        cursor: 'pointer',\n        ...hoverActiveStyles,\n      })}\n      onMouseEnter={(): void => setIsHoveringAvatar(true)}\n      onMouseLeave={(): void => setIsHoveringAvatar(false)}\n      {...rest}\n    >\n      {showRemoveButton && isHoveringAvatar && !shouldHideRemoveButton && (\n        <AvatarRemoveButton\n          handleRemoveButtonClick={handleRemoveButtonClick}\n          isBeingHovered={isHoveringRemoveButton}\n          setIsBeingHovered={setIsHoveringRemoveButton}\n        />\n      )}\n      {showBadge && <AvatarBadge avatarSize={size} {...badgeProps} />}\n      {webpSrc && src && <AvatarImage src={src} webpSrc={webpSrc} />}\n    </CAvatar>\n  );\n\n  if (showTooltip && !isHoveringRemoveButton) {\n    return (\n      <Tooltip label={tooltipText || name} placement={tooltipPlacement}>\n        {avatarMarkup}\n      </Tooltip>\n    );\n  }\n\n  return avatarMarkup;\n};\n"],"names":["getNextIconSize","size","larger","count","nextSize","AvatarBadge","avatarSize","iconName","bg","borderColor","iconVariant","position","useSmallBadge","useMemo","React","createElement","CAvatarBadge","borderWidth","boxSize","transform","parentSizeString","_d","_b","_a","AvatarConfig","sizes","container","_c","height","toString","parentSize","Number","replace","translation","getBadgeTransform","Icon","name","variant","AvatarRemoveButton","handleRemoveButtonClick","isBeingHovered","setIsBeingHovered","onRemoveButtonClick","useCallback","e","stopPropagation","Flex","className","backgroundColor","borderRadius","cursor","top","h","w","right","justify","align","onClick","onMouseEnter","zIndex","onMouseLeave","AvatarImage","src","webpSrc","Box","Picture","imgProps","objectFit","left","badgeProps","handleClick","hideBorder","randomizeVariant","randomizationType","showBadge","showRemoveButton","showTooltip","tooltipPlacement","tooltipText","rest","__rest","isHoveringAvatar","setIsHoveringAvatar","useState","isHoveringRemoveButton","setIsHoveringRemoveButton","shouldHideRemoveButton","_variant","charCode","type","charCodeAt","hoverActiveStyles","styles","_hover","img","opacity","_after","content","_active","avatarMarkup","CAvatar","Avatar","Object","assign","undefined","boxShadow","icon","Tooltip","label","placement"],"mappings":"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"}

package/build/{avatar.component-bc86fb97.js → avatar.component-433a4ec2.js}

@@ -1,2 +1,2 @@
-"use strict";var e=require("./tslib.es6-194b75fc.js"),t=require("react"),a=require("./icon.component-d618e1f5.js"),o=require("./tooltip.component-76a21c48.js"),r=require("./avatar.config-e43cfce7.js"),n=require("./chakra-ui-avatar.esm-eee70d3a.js"),s=require("./chakra-ui-layout.esm-6ee578f7.js"),l=require("./picture.component-b0edf814.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=i(t);const u=(e,t=!0,a=1)=>{let o;switch(e){case"xs":o=t?"sm":"xs";break;case"sm":o=t?"md":"xs";break;case"md":o=t?"lg":"sm";break;case"lg":o=t?"xl":"md";break;case"xl":o=t?"2xl":"lg";break;case"2xl":o=t?"2xl":"xl";break;default:o=e}return a>1&&(o=u(o,t,a-1)),o},d=({avatarSize:e,iconName:o,bg:s="background.info",borderColor:l="border.strongContrast",iconVariant:i="info",position:u="bottomRight"})=>{const d=t.useMemo((()=>"xs"===e||!o),[o,e]);return c.default.createElement(n.AvatarBadge,{borderColor:l,borderWidth:"1px",bg:s,boxSize:d?"10px":"18px",transform:(t=>{var a,o,n,s;const l=null===(s=null===(n=null===(o=null===(a=r.AvatarConfig.sizes)||void 0===a?void 0:a[e])||void 0===o?void 0:o.container)||void 0===n?void 0:n.height)||void 0===s?void 0:s.toString(),i=Number(null==l?void 0:l.replace("px","")),c="xl"!==e?i/2:i/4;switch(t){case"topLeft":return d&&"xs"!==e?`translate(${-1.35*c}px, ${-1.35*c}px)`:`translate(${-1.2*c}px, ${-1.2*c}px)`;case"topRight":return d&&"xs"!==e?`translate(${c/10}px, ${-1.35*c}px)`:`translate(${c/3}px, ${-1.2*c}px)`;case"bottomLeft":return d&&"xs"!==e?`translate(${-1.35*c}px, ${c/10}px)`:`translate(${-1.2*c}px, ${c/5}px)`;default:return d&&"xs"!==e?`translate(${c/10}px, ${c/10}px)`:`translate(${c/3}px, ${c/3}px)`}})(u)},!d&&o&&c.default.createElement(a.Icon,{name:o,variant:i,size:"xs"}))},p=({handleRemoveButtonClick:e,isBeingHovered:o,setIsBeingHovered:r})=>{const n=t.useCallback((t=>{t.stopPropagation(),e&&e(t)}),[e]);return c.default.createElement(s.Flex,{className:"Avatar__RemoveButton",backgroundColor:"background.default",borderRadius:"full",cursor:"pointer",position:"absolute",top:"-6px",h:4,w:4,right:"-6px",justify:"center",align:"center",onClick:n,onMouseEnter:()=>r(!0),zIndex:"tooltip",onMouseLeave:()=>r(!1)},c.default.createElement(a.Icon,{variant:"default",name:"closeCircleSolid",size:o?"sm":"xs"}))},m=({src:e,webpSrc:t})=>c.default.createElement(s.Box,{className:"Avatar__Image"},c.default.createElement(l.Picture,{src:e,webpSrc:t,imgProps:{w:"100%",h:"100%",objectFit:"cover",borderRadius:"full",position:"absolute",top:0,left:0}}));exports.Avatar=r=>{var{badgeProps:s,handleClick:l,handleRemoveButtonClick:i,hideBorder:b=!1,iconName:x,name:v="",randomizeVariant:f=!1,randomizationType:g="outline",showBadge:h=!1,showRemoveButton:k=!1,showTooltip:C=!0,size:w="md",src:B,tooltipPlacement:$="bottom",tooltipText:z,variant:S="default",webpSrc:E}=r,_=e.__rest(r,["badgeProps","handleClick","handleRemoveButtonClick","hideBorder","iconName","name","randomizeVariant","randomizationType","showBadge","showRemoveButton","showTooltip","size","src","tooltipPlacement","tooltipText","variant","webpSrc"]);const[j,R]=t.useState(!1),[A,q]=t.useState(!1),y="xs"===w;let I=S;var P,T;f&&(P=v.charCodeAt(0),T=g,I=P>=65&&P<=77?"outline"===T?"outlineAccent":"accent":"outline"===T?"outlineAccentSubtle":"accentSubtle");const M=t.useMemo((()=>{let e={_hover:{img:{opacity:1},_after:{content:'""',backgroundColor:"background.alpha.hover",w:"110%",h:"110%",borderRadius:"full",position:"absolute"}},_active:{img:{opacity:1},_after:{content:'""',backgroundColor:"background.alpha.pressed",w:"110%",h:"110%",borderRadius:"full",position:"absolute"}}};return"contrast"===S&&(e._hover._after.backgroundColor="background.alphaContrast.hover",e._active._after.backgroundColor="background.alphaContrast.pressed"),e}),[S]),N=c.default.createElement(n.Avatar,Object.assign({name:x?"":v,size:w,src:E?void 0:B,variant:I,boxShadow:"0 0 0 1px var(--chakra-colors-border-strongContrast)",borderWidth:b?"0px":"2px",cursor:"default"},x&&{icon:c.default.createElement(a.Icon,{name:x,size:u(w,!0,"sm"===w||"xs"===w?2:1)})},l&&Object.assign({onClick:l,cursor:"pointer"},M),{onMouseEnter:()=>R(!0),onMouseLeave:()=>R(!1)},_),k&&j&&!y&&c.default.createElement(p,{handleRemoveButtonClick:i,isBeingHovered:A,setIsBeingHovered:q}),h&&c.default.createElement(d,Object.assign({avatarSize:w},s)),E&&B&&c.default.createElement(m,{src:B,webpSrc:E}));return C&&!A?c.default.createElement(o.Tooltip,{label:z||v,placement:$},N):N};
-//# sourceMappingURL=avatar.component-bc86fb97.js.map
+"use strict";var e=require("./tslib.es6-d6f17add.js"),t=require("react"),a=require("./icon.component-d618e1f5.js"),o=require("./tooltip.component-197bff7c.js"),r=require("./avatar.config-e43cfce7.js"),n=require("./chakra-ui-avatar.esm-eee70d3a.js"),s=require("./chakra-ui-layout.esm-6ee578f7.js"),l=require("./picture.component-19489bee.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=i(t);const u=(e,t=!0,a=1)=>{let o;switch(e){case"xs":o=t?"sm":"xs";break;case"sm":o=t?"md":"xs";break;case"md":o=t?"lg":"sm";break;case"lg":o=t?"xl":"md";break;case"xl":o=t?"2xl":"lg";break;case"2xl":o=t?"2xl":"xl";break;default:o=e}return a>1&&(o=u(o,t,a-1)),o},d=({avatarSize:e,iconName:o,bg:s="background.info",borderColor:l="border.strongContrast",iconVariant:i="info",position:u="bottomRight"})=>{const d=t.useMemo((()=>"xs"===e||!o),[o,e]);return c.default.createElement(n.AvatarBadge,{borderColor:l,borderWidth:"1px",bg:s,boxSize:d?"10px":"18px",transform:(t=>{var a,o,n,s;const l=null===(s=null===(n=null===(o=null===(a=r.AvatarConfig.sizes)||void 0===a?void 0:a[e])||void 0===o?void 0:o.container)||void 0===n?void 0:n.height)||void 0===s?void 0:s.toString(),i=Number(null==l?void 0:l.replace("px","")),c="xl"!==e?i/2:i/4;switch(t){case"topLeft":return d&&"xs"!==e?`translate(${-1.35*c}px, ${-1.35*c}px)`:`translate(${-1.2*c}px, ${-1.2*c}px)`;case"topRight":return d&&"xs"!==e?`translate(${c/10}px, ${-1.35*c}px)`:`translate(${c/3}px, ${-1.2*c}px)`;case"bottomLeft":return d&&"xs"!==e?`translate(${-1.35*c}px, ${c/10}px)`:`translate(${-1.2*c}px, ${c/5}px)`;default:return d&&"xs"!==e?`translate(${c/10}px, ${c/10}px)`:`translate(${c/3}px, ${c/3}px)`}})(u)},!d&&o&&c.default.createElement(a.Icon,{name:o,variant:i,size:"xs"}))},p=({handleRemoveButtonClick:e,isBeingHovered:o,setIsBeingHovered:r})=>{const n=t.useCallback((t=>{t.stopPropagation(),e&&e(t)}),[e]);return c.default.createElement(s.Flex,{className:"Avatar__RemoveButton",backgroundColor:"background.default",borderRadius:"full",cursor:"pointer",position:"absolute",top:"-6px",h:4,w:4,right:"-6px",justify:"center",align:"center",onClick:n,onMouseEnter:()=>r(!0),zIndex:"tooltip",onMouseLeave:()=>r(!1)},c.default.createElement(a.Icon,{variant:"default",name:"closeCircleSolid",size:o?"sm":"xs"}))},m=({src:e,webpSrc:t})=>c.default.createElement(s.Box,{className:"Avatar__Image"},c.default.createElement(l.Picture,{src:e,webpSrc:t,imgProps:{w:"100%",h:"100%",objectFit:"cover",borderRadius:"full",position:"absolute",top:0,left:0}}));exports.Avatar=r=>{var{badgeProps:s,handleClick:l,handleRemoveButtonClick:i,hideBorder:b=!1,iconName:x,name:v="",randomizeVariant:f=!1,randomizationType:g="outline",showBadge:h=!1,showRemoveButton:k=!1,showTooltip:C=!0,size:w="md",src:B,tooltipPlacement:$="bottom",tooltipText:z,variant:S="default",webpSrc:E}=r,_=e.__rest(r,["badgeProps","handleClick","handleRemoveButtonClick","hideBorder","iconName","name","randomizeVariant","randomizationType","showBadge","showRemoveButton","showTooltip","size","src","tooltipPlacement","tooltipText","variant","webpSrc"]);const[j,R]=t.useState(!1),[A,q]=t.useState(!1),y="xs"===w;let I=S;var P,T;f&&(P=v.charCodeAt(0),T=g,I=P>=65&&P<=77?"outline"===T?"outlineAccent":"accent":"outline"===T?"outlineAccentSubtle":"accentSubtle");const M=t.useMemo((()=>{let e={_hover:{img:{opacity:1},_after:{content:'""',backgroundColor:"background.alpha.hover",w:"110%",h:"110%",borderRadius:"full",position:"absolute"}},_active:{img:{opacity:1},_after:{content:'""',backgroundColor:"background.alpha.pressed",w:"110%",h:"110%",borderRadius:"full",position:"absolute"}}};return"contrast"===S&&(e._hover._after.backgroundColor="background.alphaContrast.hover",e._active._after.backgroundColor="background.alphaContrast.pressed"),e}),[S]),N=c.default.createElement(n.Avatar,Object.assign({name:x?"":v,size:w,src:E?void 0:B,variant:I,boxShadow:"0 0 0 1px var(--chakra-colors-border-strongContrast)",borderWidth:b?"0px":"2px",cursor:"default"},x&&{icon:c.default.createElement(a.Icon,{name:x,size:u(w,!0,"sm"===w||"xs"===w?2:1)})},l&&Object.assign({onClick:l,cursor:"pointer"},M),{onMouseEnter:()=>R(!0),onMouseLeave:()=>R(!1)},_),k&&j&&!y&&c.default.createElement(p,{handleRemoveButtonClick:i,isBeingHovered:A,setIsBeingHovered:q}),h&&c.default.createElement(d,Object.assign({avatarSize:w},s)),E&&B&&c.default.createElement(m,{src:B,webpSrc:E}));return C&&!A?c.default.createElement(o.Tooltip,{label:z||v,placement:$},N):N};
+//# sourceMappingURL=avatar.component-433a4ec2.js.map

package/build/{avatar.component-bc86fb97.js.map → avatar.component-433a4ec2.js.map}

@@ -1 +1 @@
-{"version":3,"file":"avatar.component-bc86fb97.js","sources":["../src/shared/utils/sizes.ts","../src/components/Avatar/components/avatarBadge.component.tsx","../src/components/Avatar/components/avatarRemoveButton.component.tsx","../src/components/Avatar/components/avatarImage.component.tsx","../src/components/Avatar/avatar.component.tsx"],"sourcesContent":["import { AvatarSize } from 'components/Avatar/avatar.types';\nimport { IconSize } from 'components/Icon/icon.types';\n\nexport const getNextIconSize = (size: IconSize | AvatarSize, larger = true, count = 1): IconSize => {\n  let nextSize: IconSize;\n  switch (size) {\n    case 'xs':\n      nextSize = larger ? 'sm' : 'xs';\n      break;\n    case 'sm':\n      nextSize = larger ? 'md' : 'xs';\n      break;\n    case 'md':\n      nextSize = larger ? 'lg' : 'sm';\n      break;\n    case 'lg':\n      nextSize = larger ? 'xl' : 'md';\n      break;\n    case 'xl':\n      nextSize = larger ? '2xl' : 'lg';\n      break;\n    case '2xl':\n      nextSize = larger ? '2xl' : 'xl';\n      break;\n    default:\n      nextSize = size as IconSize;\n      break;\n  }\n\n  if (count > 1) {\n    nextSize = getNextIconSize(nextSize, larger, count - 1);\n  }\n\n  return nextSize;\n};\n","import React, { useMemo } from 'react';\nimport { AvatarBadge as CAvatarBadge } from '@chakra-ui/react';\nimport { Icon } from '../../Icon/icon.component';\nimport { AvatarSize } from '../avatar.types';\nimport { AvatarConfig } from '../avatar.config';\nimport { SemanticBackgroundColorToken, SemanticBorderColorToken } from 'theme/tokens/colors';\nimport { StyleInterpolationObject } from 'shared/types/chakra';\nimport { IconName } from '../../../icons';\nimport { AvatarBadgePosition } from '../avatar.types';\nimport { TypographyVariant } from 'shared/types/typography';\n\nexport interface AvatarBadgeProps {\n  iconName?: IconName;\n  bg?: SemanticBackgroundColorToken;\n  borderColor?: SemanticBorderColorToken;\n  iconVariant?: TypographyVariant;\n  position?: AvatarBadgePosition;\n}\n\ninterface AvatarBadgeComponentProps extends AvatarBadgeProps {\n  avatarSize: AvatarSize;\n}\n\nexport const AvatarBadge = ({\n  avatarSize,\n  iconName,\n  bg = 'background.info',\n  borderColor = 'border.strongContrast',\n  iconVariant = 'info',\n  position = 'bottomRight',\n}: AvatarBadgeComponentProps): JSX.Element => {\n  const useSmallBadge = useMemo(() => avatarSize === 'xs' || !iconName, [iconName, avatarSize]);\n\n  const getBadgeTransform = (position: AvatarBadgePosition): string => {\n    const parentSizeString = (\n      AvatarConfig.sizes?.[avatarSize] as StyleInterpolationObject\n    )?.container?.height?.toString();\n    const parentSize = Number(parentSizeString?.replace('px', ''));\n    const translation = avatarSize !== 'xl' ? parentSize / 2 : parentSize / 4;\n\n    switch (position) {\n      case 'topLeft':\n        return useSmallBadge && avatarSize !== 'xs'\n          ? `translate(${translation * -1.35}px, ${translation * -1.35}px)`\n          : `translate(${translation * -1.2}px, ${translation * -1.2}px)`;\n      case 'topRight':\n        return useSmallBadge && avatarSize !== 'xs'\n          ? `translate(${translation / 10}px, ${translation * -1.35}px)`\n          : `translate(${translation / 3}px, ${translation * -1.2}px)`;\n      case 'bottomLeft':\n        return useSmallBadge && avatarSize !== 'xs'\n          ? `translate(${translation * -1.35}px, ${translation / 10}px)`\n          : `translate(${translation * -1.2}px, ${translation / 5}px)`;\n      default:\n        return useSmallBadge && avatarSize !== 'xs'\n          ? `translate(${translation / 10}px, ${translation / 10}px)`\n          : `translate(${translation / 3}px, ${translation / 3}px)`;\n    }\n  };\n\n  return (\n    <CAvatarBadge\n      borderColor={borderColor}\n      borderWidth=\"1px\"\n      bg={bg}\n      boxSize={useSmallBadge ? '10px' : '18px'}\n      transform={getBadgeTransform(position)}\n    >\n      {!useSmallBadge && iconName && <Icon name={iconName} variant={iconVariant} size={'xs'} />}\n    </CAvatarBadge>\n  );\n};\n","import React, { useCallback, MouseEvent, MouseEventHandler, Dispatch, SetStateAction } from 'react';\nimport { Flex } from '@chakra-ui/react';\nimport { Icon } from 'components/Icon/icon.component';\n\ninterface AvatarRemoveButtonProps {\n  handleRemoveButtonClick?: MouseEventHandler<HTMLDivElement>;\n  isBeingHovered: boolean;\n  setIsBeingHovered: Dispatch<SetStateAction<boolean>>;\n}\n\nconst AvatarRemoveButton = ({\n  handleRemoveButtonClick,\n  isBeingHovered,\n  setIsBeingHovered,\n}: AvatarRemoveButtonProps): JSX.Element => {\n  const onRemoveButtonClick = useCallback(\n    (e: MouseEvent<HTMLDivElement>) => {\n      e.stopPropagation();\n\n      if (handleRemoveButtonClick) {\n        handleRemoveButtonClick(e);\n      }\n    },\n    [handleRemoveButtonClick],\n  );\n  return (\n    <Flex\n      className=\"Avatar__RemoveButton\"\n      backgroundColor=\"background.default\"\n      borderRadius=\"full\"\n      cursor=\"pointer\"\n      position=\"absolute\"\n      top=\"-6px\"\n      h={4}\n      w={4}\n      right=\"-6px\"\n      justify=\"center\"\n      align=\"center\"\n      onClick={onRemoveButtonClick}\n      onMouseEnter={(): void => setIsBeingHovered(true)}\n      zIndex=\"tooltip\"\n      onMouseLeave={(): void => setIsBeingHovered(false)}\n    >\n      <Icon variant=\"default\" name=\"closeCircleSolid\" size={isBeingHovered ? 'sm' : 'xs'} />\n    </Flex>\n  );\n};\n\nexport default AvatarRemoveButton;\n","import { Box } from '@chakra-ui/react';\nimport { Picture } from 'components/Picture';\nimport React from 'react';\n\ninterface AvatarImageProps {\n  src: string;\n  webpSrc: string;\n}\n\nconst AvatarImage = ({ src, webpSrc }: AvatarImageProps): JSX.Element => {\n  return (\n    <Box className=\"Avatar__Image\">\n      <Picture\n        src={src}\n        webpSrc={webpSrc}\n        imgProps={{\n          w: '100%',\n          h: '100%',\n          objectFit: 'cover',\n          borderRadius: 'full',\n          position: 'absolute',\n          top: 0,\n          left: 0,\n        }}\n      />\n    </Box>\n  );\n};\n\nexport default AvatarImage;\n","import React, { useState, useMemo, MouseEventHandler } from 'react';\nimport { Placement, Avatar as CAvatar, AvatarProps as CAvatarProps } from '@chakra-ui/react';\nimport { Icon } from '../Icon/icon.component';\nimport { Tooltip } from '../Tooltip/tooltip.component';\nimport { AvatarSize, AvatarType, AvatarVariant } from './avatar.types';\nimport { getNextIconSize } from 'shared/utils/sizes';\nimport { AvatarBadge, AvatarBadgeProps } from './components/avatarBadge.component';\nimport { IconName } from '../../icons';\nimport AvatarRemoveButton from './components/avatarRemoveButton.component';\nimport AvatarImage from './components/avatarImage.component';\n\nexport interface KAvatarProps {\n  badgeProps?: AvatarBadgeProps;\n  handleClick?: MouseEventHandler<HTMLSpanElement>;\n  handleRemoveButtonClick?: MouseEventHandler<HTMLDivElement>;\n  hideBorder?: boolean;\n  iconName?: IconName;\n  name?: string;\n  randomizeVariant?: boolean;\n  randomizationType?: AvatarType;\n  showBadge?: boolean;\n  showRemoveButton?: boolean;\n  showTooltip?: boolean;\n  size?: AvatarSize;\n  src?: string;\n  tooltipPlacement?: Placement;\n  tooltipText?: string;\n  variant?: AvatarVariant;\n  webpSrc?: string;\n}\n\nexport type AvatarProps = KAvatarProps & CAvatarProps;\n\nconst getRandomizedAvatarVariant = (charCode: number, type: AvatarType): AvatarVariant => {\n  if (charCode >= 65 && charCode <= 77) {\n    return type === 'outline' ? 'outlineAccent' : 'accent';\n  } else {\n    return type === 'outline' ? 'outlineAccentSubtle' : 'accentSubtle';\n  }\n};\n\nexport const Avatar = ({\n  badgeProps,\n  handleClick,\n  handleRemoveButtonClick,\n  hideBorder = false,\n  iconName,\n  name = '',\n  randomizeVariant = false,\n  randomizationType = 'outline',\n  showBadge = false,\n  showRemoveButton = false,\n  showTooltip = true,\n  size = 'md',\n  src,\n  tooltipPlacement = 'bottom',\n  tooltipText,\n  variant = 'default',\n  webpSrc,\n  ...rest\n}: AvatarProps): JSX.Element => {\n  const [isHoveringAvatar, setIsHoveringAvatar] = useState(false);\n  const [isHoveringRemoveButton, setIsHoveringRemoveButton] = useState(false);\n  const shouldHideRemoveButton = size === 'xs';\n\n  let _variant = variant;\n\n  if (randomizeVariant) {\n    _variant = getRandomizedAvatarVariant(name.charCodeAt(0), randomizationType);\n  }\n\n  // These styles are not defined in the config file because they\n  // should only be applied if the avatar has a click handler defined\n  const hoverActiveStyles = useMemo(() => {\n    let styles = {\n      _hover: {\n        img: { opacity: 1 },\n        _after: {\n          content: '\"\"',\n          backgroundColor: 'background.alpha.hover',\n          w: '110%',\n          h: '110%',\n          borderRadius: 'full',\n          position: 'absolute',\n        },\n      },\n      _active: {\n        img: { opacity: 1 },\n        _after: {\n          content: '\"\"',\n          backgroundColor: 'background.alpha.pressed',\n          w: '110%',\n          h: '110%',\n          borderRadius: 'full',\n          position: 'absolute',\n        },\n      },\n    };\n\n    if (variant === 'contrast') {\n      styles._hover._after.backgroundColor = 'background.alphaContrast.hover';\n      styles._active._after.backgroundColor = 'background.alphaContrast.pressed';\n    }\n\n    return styles;\n  }, [variant]);\n\n  const avatarMarkup = (\n    <CAvatar\n      name={iconName ? '' : name}\n      size={size}\n      src={!!webpSrc ? undefined : src}\n      variant={_variant}\n      boxShadow=\"0 0 0 1px var(--chakra-colors-border-strongContrast)\"\n      borderWidth={hideBorder ? '0px' : '2px'}\n      cursor=\"default\"\n      {...(iconName && {\n        icon: <Icon name={iconName} size={getNextIconSize(size, true, size === 'sm' || size === 'xs' ? 2 : 1)} />,\n      })}\n      {...(handleClick && {\n        onClick: handleClick,\n        cursor: 'pointer',\n        ...hoverActiveStyles,\n      })}\n      onMouseEnter={(): void => setIsHoveringAvatar(true)}\n      onMouseLeave={(): void => setIsHoveringAvatar(false)}\n      {...rest}\n    >\n      {showRemoveButton && isHoveringAvatar && !shouldHideRemoveButton && (\n        <AvatarRemoveButton\n          handleRemoveButtonClick={handleRemoveButtonClick}\n          isBeingHovered={isHoveringRemoveButton}\n          setIsBeingHovered={setIsHoveringRemoveButton}\n        />\n      )}\n      {showBadge && <AvatarBadge avatarSize={size} {...badgeProps} />}\n      {webpSrc && src && <AvatarImage src={src} webpSrc={webpSrc} />}\n    </CAvatar>\n  );\n\n  if (showTooltip && !isHoveringRemoveButton) {\n    return (\n      <Tooltip label={tooltipText || name} placement={tooltipPlacement}>\n        {avatarMarkup}\n      </Tooltip>\n    );\n  }\n\n  return avatarMarkup;\n};\n"],"names":["getNextIconSize","size","larger","count","nextSize","AvatarBadge","avatarSize","iconName","bg","borderColor","iconVariant","position","useSmallBadge","useMemo","React","createElement","CAvatarBadge","borderWidth","boxSize","transform","parentSizeString","_d","_b","_a","AvatarConfig","sizes","container","_c","height","toString","parentSize","Number","replace","translation","getBadgeTransform","Icon","name","variant","AvatarRemoveButton","handleRemoveButtonClick","isBeingHovered","setIsBeingHovered","onRemoveButtonClick","useCallback","e","stopPropagation","Flex","className","backgroundColor","borderRadius","cursor","top","h","w","right","justify","align","onClick","onMouseEnter","zIndex","onMouseLeave","AvatarImage","src","webpSrc","Box","Picture","imgProps","objectFit","left","badgeProps","handleClick","hideBorder","randomizeVariant","randomizationType","showBadge","showRemoveButton","showTooltip","tooltipPlacement","tooltipText","rest","__rest","isHoveringAvatar","setIsHoveringAvatar","useState","isHoveringRemoveButton","setIsHoveringRemoveButton","shouldHideRemoveButton","_variant","charCode","type","charCodeAt","hoverActiveStyles","styles","_hover","img","opacity","_after","content","_active","avatarMarkup","CAvatar","Avatar","Object","assign","undefined","boxShadow","icon","Tooltip","label","placement"],"mappings":"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"}
+{"version":3,"file":"avatar.component-433a4ec2.js","sources":["../src/shared/utils/sizes.ts","../src/components/Avatar/components/avatarBadge.component.tsx","../src/components/Avatar/components/avatarRemoveButton.component.tsx","../src/components/Avatar/components/avatarImage.component.tsx","../src/components/Avatar/avatar.component.tsx"],"sourcesContent":["import { AvatarSize } from 'components/Avatar/avatar.types';\nimport { IconSize } from 'components/Icon/icon.types';\n\nexport const getNextIconSize = (size: IconSize | AvatarSize, larger = true, count = 1): IconSize => {\n  let nextSize: IconSize;\n  switch (size) {\n    case 'xs':\n      nextSize = larger ? 'sm' : 'xs';\n      break;\n    case 'sm':\n      nextSize = larger ? 'md' : 'xs';\n      break;\n    case 'md':\n      nextSize = larger ? 'lg' : 'sm';\n      break;\n    case 'lg':\n      nextSize = larger ? 'xl' : 'md';\n      break;\n    case 'xl':\n      nextSize = larger ? '2xl' : 'lg';\n      break;\n    case '2xl':\n      nextSize = larger ? '2xl' : 'xl';\n      break;\n    default:\n      nextSize = size as IconSize;\n      break;\n  }\n\n  if (count > 1) {\n    nextSize = getNextIconSize(nextSize, larger, count - 1);\n  }\n\n  return nextSize;\n};\n","import React, { useMemo } from 'react';\nimport { AvatarBadge as CAvatarBadge } from '@chakra-ui/react';\nimport { Icon } from '../../Icon/icon.component';\nimport { AvatarSize } from '../avatar.types';\nimport { AvatarConfig } from '../avatar.config';\nimport { SemanticBackgroundColorToken, SemanticBorderColorToken } from 'theme/tokens/colors';\nimport { StyleInterpolationObject } from 'shared/types/chakra';\nimport { IconName } from '../../../icons';\nimport { AvatarBadgePosition } from '../avatar.types';\nimport { TypographyVariant } from 'shared/types/typography';\n\nexport interface AvatarBadgeProps {\n  iconName?: IconName;\n  bg?: SemanticBackgroundColorToken;\n  borderColor?: SemanticBorderColorToken;\n  iconVariant?: TypographyVariant;\n  position?: AvatarBadgePosition;\n}\n\ninterface AvatarBadgeComponentProps extends AvatarBadgeProps {\n  avatarSize: AvatarSize;\n}\n\nexport const AvatarBadge = ({\n  avatarSize,\n  iconName,\n  bg = 'background.info',\n  borderColor = 'border.strongContrast',\n  iconVariant = 'info',\n  position = 'bottomRight',\n}: AvatarBadgeComponentProps): JSX.Element => {\n  const useSmallBadge = useMemo(() => avatarSize === 'xs' || !iconName, [iconName, avatarSize]);\n\n  const getBadgeTransform = (position: AvatarBadgePosition): string => {\n    const parentSizeString = (\n      AvatarConfig.sizes?.[avatarSize] as StyleInterpolationObject\n    )?.container?.height?.toString();\n    const parentSize = Number(parentSizeString?.replace('px', ''));\n    const translation = avatarSize !== 'xl' ? parentSize / 2 : parentSize / 4;\n\n    switch (position) {\n      case 'topLeft':\n        return useSmallBadge && avatarSize !== 'xs'\n          ? `translate(${translation * -1.35}px, ${translation * -1.35}px)`\n          : `translate(${translation * -1.2}px, ${translation * -1.2}px)`;\n      case 'topRight':\n        return useSmallBadge && avatarSize !== 'xs'\n          ? `translate(${translation / 10}px, ${translation * -1.35}px)`\n          : `translate(${translation / 3}px, ${translation * -1.2}px)`;\n      case 'bottomLeft':\n        return useSmallBadge && avatarSize !== 'xs'\n          ? `translate(${translation * -1.35}px, ${translation / 10}px)`\n          : `translate(${translation * -1.2}px, ${translation / 5}px)`;\n      default:\n        return useSmallBadge && avatarSize !== 'xs'\n          ? `translate(${translation / 10}px, ${translation / 10}px)`\n          : `translate(${translation / 3}px, ${translation / 3}px)`;\n    }\n  };\n\n  return (\n    <CAvatarBadge\n      borderColor={borderColor}\n      borderWidth=\"1px\"\n      bg={bg}\n      boxSize={useSmallBadge ? '10px' : '18px'}\n      transform={getBadgeTransform(position)}\n    >\n      {!useSmallBadge && iconName && <Icon name={iconName} variant={iconVariant} size={'xs'} />}\n    </CAvatarBadge>\n  );\n};\n","import React, { useCallback, MouseEvent, MouseEventHandler, Dispatch, SetStateAction } from 'react';\nimport { Flex } from '@chakra-ui/react';\nimport { Icon } from 'components/Icon/icon.component';\n\ninterface AvatarRemoveButtonProps {\n  handleRemoveButtonClick?: MouseEventHandler<HTMLDivElement>;\n  isBeingHovered: boolean;\n  setIsBeingHovered: Dispatch<SetStateAction<boolean>>;\n}\n\nconst AvatarRemoveButton = ({\n  handleRemoveButtonClick,\n  isBeingHovered,\n  setIsBeingHovered,\n}: AvatarRemoveButtonProps): JSX.Element => {\n  const onRemoveButtonClick = useCallback(\n    (e: MouseEvent<HTMLDivElement>) => {\n      e.stopPropagation();\n\n      if (handleRemoveButtonClick) {\n        handleRemoveButtonClick(e);\n      }\n    },\n    [handleRemoveButtonClick],\n  );\n  return (\n    <Flex\n      className=\"Avatar__RemoveButton\"\n      backgroundColor=\"background.default\"\n      borderRadius=\"full\"\n      cursor=\"pointer\"\n      position=\"absolute\"\n      top=\"-6px\"\n      h={4}\n      w={4}\n      right=\"-6px\"\n      justify=\"center\"\n      align=\"center\"\n      onClick={onRemoveButtonClick}\n      onMouseEnter={(): void => setIsBeingHovered(true)}\n      zIndex=\"tooltip\"\n      onMouseLeave={(): void => setIsBeingHovered(false)}\n    >\n      <Icon variant=\"default\" name=\"closeCircleSolid\" size={isBeingHovered ? 'sm' : 'xs'} />\n    </Flex>\n  );\n};\n\nexport default AvatarRemoveButton;\n","import { Box } from '@chakra-ui/react';\nimport { Picture } from 'components/Picture';\nimport React from 'react';\n\ninterface AvatarImageProps {\n  src: string;\n  webpSrc: string;\n}\n\nconst AvatarImage = ({ src, webpSrc }: AvatarImageProps): JSX.Element => {\n  return (\n    <Box className=\"Avatar__Image\">\n      <Picture\n        src={src}\n        webpSrc={webpSrc}\n        imgProps={{\n          w: '100%',\n          h: '100%',\n          objectFit: 'cover',\n          borderRadius: 'full',\n          position: 'absolute',\n          top: 0,\n          left: 0,\n        }}\n      />\n    </Box>\n  );\n};\n\nexport default AvatarImage;\n","import React, { useState, useMemo, MouseEventHandler } from 'react';\nimport { Placement, Avatar as CAvatar, AvatarProps as CAvatarProps } from '@chakra-ui/react';\nimport { Icon } from '../Icon/icon.component';\nimport { Tooltip } from '../Tooltip/tooltip.component';\nimport { AvatarSize, AvatarType, AvatarVariant } from './avatar.types';\nimport { getNextIconSize } from 'shared/utils/sizes';\nimport { AvatarBadge, AvatarBadgeProps } from './components/avatarBadge.component';\nimport { IconName } from '../../icons';\nimport AvatarRemoveButton from './components/avatarRemoveButton.component';\nimport AvatarImage from './components/avatarImage.component';\n\nexport interface KAvatarProps {\n  badgeProps?: AvatarBadgeProps;\n  handleClick?: MouseEventHandler<HTMLSpanElement>;\n  handleRemoveButtonClick?: MouseEventHandler<HTMLDivElement>;\n  hideBorder?: boolean;\n  iconName?: IconName;\n  name?: string;\n  randomizeVariant?: boolean;\n  randomizationType?: AvatarType;\n  showBadge?: boolean;\n  showRemoveButton?: boolean;\n  showTooltip?: boolean;\n  size?: AvatarSize;\n  src?: string;\n  tooltipPlacement?: Placement;\n  tooltipText?: string;\n  variant?: AvatarVariant;\n  webpSrc?: string;\n}\n\nexport type AvatarProps = KAvatarProps & CAvatarProps;\n\nconst getRandomizedAvatarVariant = (charCode: number, type: AvatarType): AvatarVariant => {\n  if (charCode >= 65 && charCode <= 77) {\n    return type === 'outline' ? 'outlineAccent' : 'accent';\n  } else {\n    return type === 'outline' ? 'outlineAccentSubtle' : 'accentSubtle';\n  }\n};\n\nexport const Avatar = ({\n  badgeProps,\n  handleClick,\n  handleRemoveButtonClick,\n  hideBorder = false,\n  iconName,\n  name = '',\n  randomizeVariant = false,\n  randomizationType = 'outline',\n  showBadge = false,\n  showRemoveButton = false,\n  showTooltip = true,\n  size = 'md',\n  src,\n  tooltipPlacement = 'bottom',\n  tooltipText,\n  variant = 'default',\n  webpSrc,\n  ...rest\n}: AvatarProps): JSX.Element => {\n  const [isHoveringAvatar, setIsHoveringAvatar] = useState(false);\n  const [isHoveringRemoveButton, setIsHoveringRemoveButton] = useState(false);\n  const shouldHideRemoveButton = size === 'xs';\n\n  let _variant = variant;\n\n  if (randomizeVariant) {\n    _variant = getRandomizedAvatarVariant(name.charCodeAt(0), randomizationType);\n  }\n\n  // These styles are not defined in the config file because they\n  // should only be applied if the avatar has a click handler defined\n  const hoverActiveStyles = useMemo(() => {\n    let styles = {\n      _hover: {\n        img: { opacity: 1 },\n        _after: {\n          content: '\"\"',\n          backgroundColor: 'background.alpha.hover',\n          w: '110%',\n          h: '110%',\n          borderRadius: 'full',\n          position: 'absolute',\n        },\n      },\n      _active: {\n        img: { opacity: 1 },\n        _after: {\n          content: '\"\"',\n          backgroundColor: 'background.alpha.pressed',\n          w: '110%',\n          h: '110%',\n          borderRadius: 'full',\n          position: 'absolute',\n        },\n      },\n    };\n\n    if (variant === 'contrast') {\n      styles._hover._after.backgroundColor = 'background.alphaContrast.hover';\n      styles._active._after.backgroundColor = 'background.alphaContrast.pressed';\n    }\n\n    return styles;\n  }, [variant]);\n\n  const avatarMarkup = (\n    <CAvatar\n      name={iconName ? '' : name}\n      size={size}\n      src={!!webpSrc ? undefined : src}\n      variant={_variant}\n      boxShadow=\"0 0 0 1px var(--chakra-colors-border-strongContrast)\"\n      borderWidth={hideBorder ? '0px' : '2px'}\n      cursor=\"default\"\n      {...(iconName && {\n        icon: <Icon name={iconName} size={getNextIconSize(size, true, size === 'sm' || size === 'xs' ? 2 : 1)} />,\n      })}\n      {...(handleClick && {\n        onClick: handleClick,\n        cursor: 'pointer',\n        ...hoverActiveStyles,\n      })}\n      onMouseEnter={(): void => setIsHoveringAvatar(true)}\n      onMouseLeave={(): void => setIsHoveringAvatar(false)}\n      {...rest}\n    >\n      {showRemoveButton && isHoveringAvatar && !shouldHideRemoveButton && (\n        <AvatarRemoveButton\n          handleRemoveButtonClick={handleRemoveButtonClick}\n          isBeingHovered={isHoveringRemoveButton}\n          setIsBeingHovered={setIsHoveringRemoveButton}\n        />\n      )}\n      {showBadge && <AvatarBadge avatarSize={size} {...badgeProps} />}\n      {webpSrc && src && <AvatarImage src={src} webpSrc={webpSrc} />}\n    </CAvatar>\n  );\n\n  if (showTooltip && !isHoveringRemoveButton) {\n    return (\n      <Tooltip label={tooltipText || name} placement={tooltipPlacement}>\n        {avatarMarkup}\n      </Tooltip>\n    );\n  }\n\n  return avatarMarkup;\n};\n"],"names":["getNextIconSize","size","larger","count","nextSize","AvatarBadge","avatarSize","iconName","bg","borderColor","iconVariant","position","useSmallBadge","useMemo","React","createElement","CAvatarBadge","borderWidth","boxSize","transform","parentSizeString","_d","_b","_a","AvatarConfig","sizes","container","_c","height","toString","parentSize","Number","replace","translation","getBadgeTransform","Icon","name","variant","AvatarRemoveButton","handleRemoveButtonClick","isBeingHovered","setIsBeingHovered","onRemoveButtonClick","useCallback","e","stopPropagation","Flex","className","backgroundColor","borderRadius","cursor","top","h","w","right","justify","align","onClick","onMouseEnter","zIndex","onMouseLeave","AvatarImage","src","webpSrc","Box","Picture","imgProps","objectFit","left","badgeProps","handleClick","hideBorder","randomizeVariant","randomizationType","showBadge","showRemoveButton","showTooltip","tooltipPlacement","tooltipText","rest","__rest","isHoveringAvatar","setIsHoveringAvatar","useState","isHoveringRemoveButton","setIsHoveringRemoveButton","shouldHideRemoveButton","_variant","charCode","type","charCodeAt","hoverActiveStyles","styles","_hover","img","opacity","_after","content","_active","avatarMarkup","CAvatar","Avatar","Object","assign","undefined","boxShadow","icon","Tooltip","label","placement"],"mappings":"yaAGO,MAAMA,EAAkB,CAACC,EAA6BC,GAAS,EAAMC,EAAQ,KAClF,IAAIC,EACJ,OAAQH,GACN,IAAK,KACHG,EAAWF,EAAS,KAAO,KAC3B,MACF,IAAK,KACHE,EAAWF,EAAS,KAAO,KAC3B,MACF,IAAK,KACHE,EAAWF,EAAS,KAAO,KAC3B,MACF,IAAK,KACHE,EAAWF,EAAS,KAAO,KAC3B,MACF,IAAK,KACHE,EAAWF,EAAS,MAAQ,KAC5B,MACF,IAAK,MACHE,EAAWF,EAAS,MAAQ,KAC5B,MACF,QACEE,EAAWH,EAQf,OAJIE,EAAQ,IACVC,EAAWJ,EAAgBI,EAAUF,EAAQC,EAAQ,IAGhDC,GCVIC,EAAc,EACzBC,WAAAA,EACAC,SAAAA,EACAC,GAAAA,EAAK,kBACLC,YAAAA,EAAc,wBACdC,YAAAA,EAAc,OACdC,SAAAA,EAAW,kBAEX,MAAMC,EAAgBC,WAAQ,IAAqB,OAAfP,IAAwBC,GAAU,CAACA,EAAUD,IA6BjF,OACEQ,EAAAA,QAACC,cAAAC,EAAAA,YACC,CAAAP,YAAaA,EACbQ,YAAY,MACZT,GAAIA,EACJU,QAASN,EAAgB,OAAS,OAClCO,UAjCsB,CAACR,gBACzB,MAAMS,EAEgB,QAFGC,EAEb,kBADVC,UAAAC,EAAAC,eAAaC,4BAAQnB,yBACpBoB,iBAAS,IAAAC,OAAA,EAAAA,EAAEC,cAAQ,IAAAP,OAAA,EAAAA,EAAAQ,WAChBC,EAAaC,OAAOX,MAAAA,OAAgB,EAAhBA,EAAkBY,QAAQ,KAAM,KACpDC,EAA6B,OAAf3B,EAAsBwB,EAAa,EAAIA,EAAa,EAExE,OAAQnB,GACN,IAAK,UACH,OAAOC,GAAgC,OAAfN,EACpB,cAA4B,KAAf2B,SAAyC,KAAfA,OACvC,cAA4B,IAAfA,SAAwC,IAAfA,OAC5C,IAAK,WACH,OAAOrB,GAAgC,OAAfN,EACpB,aAAa2B,EAAc,UAAwB,KAAfA,OACpC,aAAaA,EAAc,SAAuB,IAAfA,OACzC,IAAK,aACH,OAAOrB,GAAgC,OAAfN,EACpB,cAA4B,KAAf2B,QAA0BA,EAAc,QACrD,cAA4B,IAAfA,QAAyBA,EAAc,OAC1D,QACE,OAAOrB,GAAgC,OAAfN,EACpB,aAAa2B,EAAc,SAASA,EAAc,QAClD,aAAaA,EAAc,QAAQA,EAAc,SAU5CC,CAAkBvB,KAE3BC,GAAiBL,GAAYO,EAAA,QAAAC,cAACoB,EAAIA,KAAA,CAACC,KAAM7B,EAAU8B,QAAS3B,EAAaT,KAAM,SC1DjFqC,EAAqB,EACzBC,wBAAAA,EACAC,eAAAA,EACAC,kBAAAA,MAEA,MAAMC,EAAsBC,eACzBC,IACCA,EAAEC,kBAEEN,GACFA,EAAwBK,KAG5B,CAACL,IAEH,OACEzB,EAAAA,QAAAC,cAAC+B,EAAIA,KAAA,CACHC,UAAU,uBACVC,gBAAgB,qBAChBC,aAAa,OACbC,OAAO,UACPvC,SAAS,WACTwC,IAAI,OACJC,EAAG,EACHC,EAAG,EACHC,MAAM,OACNC,QAAQ,SACRC,MAAM,SACNC,QAASf,EACTgB,aAAc,IAAYjB,GAAkB,GAC5CkB,OAAO,UACPC,aAAc,IAAYnB,GAAkB,IAE5C3B,EAAAA,QAACC,cAAAoB,EAAAA,KAAK,CAAAE,QAAQ,UAAUD,KAAK,mBAAmBnC,KAAMuC,EAAiB,KAAO,SClC9EqB,EAAc,EAAGC,IAAAA,EAAKC,QAAAA,KAExBjD,EAAC,QAAAC,cAAAiD,EAAGA,IAAC,CAAAjB,UAAU,iBACbjC,UAACC,cAAAkD,EAAAA,QACC,CAAAH,IAAKA,EACLC,QAASA,EACTG,SAAU,CACRb,EAAG,OACHD,EAAG,OACHe,UAAW,QACXlB,aAAc,OACdtC,SAAU,WACVwC,IAAK,EACLiB,KAAM,qBCmBO7C,QAAA8C,WACrBA,EAAUC,YACVA,EAAW/B,wBACXA,EAAuBgC,WACvBA,GAAa,EAAKhE,SAClBA,EAAQ6B,KACRA,EAAO,GAAEoC,iBACTA,GAAmB,EAAKC,kBACxBA,EAAoB,UAASC,UAC7BA,GAAY,EAAKC,iBACjBA,GAAmB,EAAKC,YACxBA,GAAc,EAAI3E,KAClBA,EAAO,KAAI6D,IACXA,EAAGe,iBACHA,EAAmB,SAAQC,YAC3BA,EAAWzC,QACXA,EAAU,UAAS0B,QACnBA,GAAOxC,EACJwD,EAlBkBC,EAAAA,OAAAzD,EAAA,CAAA,aAAA,cAAA,0BAAA,aAAA,WAAA,OAAA,mBAAA,oBAAA,YAAA,mBAAA,cAAA,OAAA,MAAA,mBAAA,cAAA,UAAA,YAoBrB,MAAO0D,EAAkBC,GAAuBC,EAAQA,UAAC,IAClDC,EAAwBC,GAA6BF,EAAQA,UAAC,GAC/DG,EAAkC,OAATrF,EAE/B,IAAIsF,EAAWlD,EAhCkB,IAACmD,EAAkBC,EAkChDjB,IAlC8BgB,EAmCMpD,EAAKsD,WAAW,GAnCJD,EAmCQhB,EAA1Dc,EAlCEC,GAAY,IAAMA,GAAY,GAChB,YAATC,EAAqB,gBAAkB,SAE9B,YAATA,EAAqB,sBAAwB,gBAoCtD,MAAME,EAAoB9E,EAAAA,SAAQ,KAChC,IAAI+E,EAAS,CACXC,OAAQ,CACNC,IAAK,CAAEC,QAAS,GAChBC,OAAQ,CACNC,QAAS,KACTjD,gBAAiB,yBACjBK,EAAG,OACHD,EAAG,OACHH,aAAc,OACdtC,SAAU,aAGduF,QAAS,CACPJ,IAAK,CAAEC,QAAS,GAChBC,OAAQ,CACNC,QAAS,KACTjD,gBAAiB,2BACjBK,EAAG,OACHD,EAAG,OACHH,aAAc,OACdtC,SAAU,cAUhB,MALgB,aAAZ0B,IACFuD,EAAOC,OAAOG,OAAOhD,gBAAkB,iCACvC4C,EAAOM,QAAQF,OAAOhD,gBAAkB,oCAGnC4C,IACN,CAACvD,IAEE8D,EACJrF,EAAA,QAAAC,cAACqF,EAAOC,OAAAC,OAAAC,OAAA,CACNnE,KAAM7B,EAAW,GAAK6B,EACtBnC,KAAMA,EACN6D,IAAOC,OAAUyC,EAAY1C,EAC7BzB,QAASkD,EACTkB,UAAU,uDACVxF,YAAasD,EAAa,MAAQ,MAClCrB,OAAO,WACF3C,GAAY,CACfmG,KAAM5F,EAAA,QAAAC,cAACoB,EAAAA,KAAI,CAACC,KAAM7B,EAAUN,KAAMD,EAAgBC,GAAM,EAAe,OAATA,GAA0B,OAATA,EAAgB,EAAI,MAEhGqE,GACHgC,OAAAC,OAAA,CAAA9C,QAASa,EACTpB,OAAQ,WACLyC,IAELjC,aAAc,IAAYwB,GAAoB,GAC9CtB,aAAc,IAAYsB,GAAoB,IAC1CH,GAEHJ,GAAoBM,IAAqBK,GACxCxE,EAAC,QAAAC,cAAAuB,EACC,CAAAC,wBAAyBA,EACzBC,eAAgB4C,EAChB3C,kBAAmB4C,IAGtBX,GAAa5D,wBAACT,EAAWiG,OAAAC,OAAA,CAACjG,WAAYL,GAAUoE,IAChDN,GAAWD,GAAOhD,UAACC,cAAA8C,GAAYC,IAAKA,EAAKC,QAASA,KAIvD,OAAIa,IAAgBQ,EAEhBtE,UAACC,cAAA4F,EAAOA,QAAC,CAAAC,MAAO9B,GAAe1C,EAAMyE,UAAWhC,GAC7CsB,GAKAA"}

package/build/{avatarGroup.component-262bc798.js → avatarGroup.component-36ff0d62.js}

@@ -1,2 +1,2 @@
-"use strict";var e=require("react"),t=require("./avatar.component-bc86fb97.js"),a=require("./chakra-ui-avatar.esm-eee70d3a.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=n(e);exports.AvatarGroup=({addButtonTooltipText:n,avatars:r,handleAddButtonClick:l,handleRemoveButtonClick:i,max:s=3,showAddButton:u=!0,showRemoveAvatarButton:m=!1,size:d="md"})=>{const c=e.useMemo((()=>r.map((e=>e.name)).join(", ")),[r]),v="lg"===d||"md"===d?-2:-1;return o.default.createElement(a.AvatarGroup,{size:d,spacing:v,alignItems:"flex-start"},r.length>s?o.default.createElement(t.Avatar,{name:`${r.length}`,size:d,variant:"contrast",showRemoveButton:!1,tooltipText:c}):r.map((e=>o.default.createElement(t.Avatar,Object.assign({},e,{key:e.name,size:d,showRemoveButton:m,handleRemoveButtonClick:i})))),u&&o.default.createElement(t.Avatar,{variant:"dashed",iconName:"plus",handleClick:l,tooltipText:n,size:d}))};
-//# sourceMappingURL=avatarGroup.component-262bc798.js.map
+"use strict";var e=require("react"),t=require("./avatar.component-433a4ec2.js"),a=require("./chakra-ui-avatar.esm-eee70d3a.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=n(e);exports.AvatarGroup=({addButtonTooltipText:n,avatars:r,handleAddButtonClick:l,handleRemoveButtonClick:i,max:s=3,showAddButton:u=!0,showRemoveAvatarButton:m=!1,size:d="md"})=>{const c=e.useMemo((()=>r.map((e=>e.name)).join(", ")),[r]),v="lg"===d||"md"===d?-2:-1;return o.default.createElement(a.AvatarGroup,{size:d,spacing:v,alignItems:"flex-start"},r.length>s?o.default.createElement(t.Avatar,{name:`${r.length}`,size:d,variant:"contrast",showRemoveButton:!1,tooltipText:c}):r.map((e=>o.default.createElement(t.Avatar,Object.assign({},e,{key:e.name,size:d,showRemoveButton:m,handleRemoveButtonClick:i})))),u&&o.default.createElement(t.Avatar,{variant:"dashed",iconName:"plus",handleClick:l,tooltipText:n,size:d}))};
+//# sourceMappingURL=avatarGroup.component-36ff0d62.js.map

package/build/{avatarGroup.component-262bc798.js.map → avatarGroup.component-36ff0d62.js.map}

@@ -1 +1 @@
-{"version":3,"file":"avatarGroup.component-262bc798.js","sources":["../src/components/AvatarGroup/avatarGroup.component.tsx"],"sourcesContent":["import { AvatarGroup as CAvatarGroup } from '@chakra-ui/react';\nimport React, { useMemo } from 'react';\nimport { Avatar, AvatarProps } from '../Avatar/avatar.component';\nimport { AvatarSize } from '../Avatar/avatar.types';\n\nexport interface AvatarGroupProps {\n  addButtonTooltipText?: string;\n  avatars: AvatarProps[];\n  handleAddButtonClick?: () => void;\n  handleRemoveButtonClick?: () => void;\n  max?: number;\n  showAddButton?: boolean;\n  showRemoveAvatarButton?: boolean;\n  size?: AvatarSize;\n}\n\nexport const AvatarGroup = ({\n  addButtonTooltipText,\n  avatars,\n  handleAddButtonClick,\n  handleRemoveButtonClick,\n  max = 3,\n  showAddButton = true,\n  showRemoveAvatarButton = false,\n  size = 'md',\n}: AvatarGroupProps): JSX.Element => {\n  const mergedNames = useMemo(() => avatars.map((avatar) => avatar.name).join(', '), [avatars]);\n  const spacing = size === 'lg' || size === 'md' ? -2 : -1;\n\n  return (\n    <CAvatarGroup size={size} spacing={spacing} alignItems=\"flex-start\">\n      {avatars.length > max ? (\n        <Avatar\n          name={`${avatars.length}`}\n          size={size}\n          variant=\"contrast\"\n          showRemoveButton={false}\n          tooltipText={mergedNames}\n        />\n      ) : (\n        avatars.map((avatar) => (\n          <Avatar\n            {...avatar}\n            key={avatar.name}\n            size={size}\n            showRemoveButton={showRemoveAvatarButton}\n            handleRemoveButtonClick={handleRemoveButtonClick}\n          />\n        ))\n      )}\n      {showAddButton && (\n        <Avatar\n          variant=\"dashed\"\n          iconName=\"plus\"\n          handleClick={handleAddButtonClick}\n          tooltipText={addButtonTooltipText}\n          size={size}\n        />\n      )}\n    </CAvatarGroup>\n  );\n};\n"],"names":["addButtonTooltipText","avatars","handleAddButtonClick","handleRemoveButtonClick","max","showAddButton","showRemoveAvatarButton","size","mergedNames","useMemo","map","avatar","name","join","spacing","React","createElement","CAvatarGroup","alignItems","length","Avatar","variant","showRemoveButton","tooltipText","Object","assign","key","iconName","handleClick"],"mappings":"uOAgB2B,EACzBA,qBAAAA,EACAC,QAAAA,EACAC,qBAAAA,EACAC,wBAAAA,EACAC,IAAAA,EAAM,EACNC,cAAAA,GAAgB,EAChBC,uBAAAA,GAAyB,EACzBC,KAAAA,EAAO,SAEP,MAAMC,EAAcC,EAAOA,SAAC,IAAMR,EAAQS,KAAKC,GAAWA,EAAOC,OAAMC,KAAK,OAAO,CAACZ,IAC9Ea,EAAmB,OAATP,GAA0B,OAATA,GAAiB,GAAK,EAEvD,OACEQ,EAAA,QAAAC,cAACC,EAAAA,YAAY,CAACV,KAAMA,EAAMO,QAASA,EAASI,WAAW,cACpDjB,EAAQkB,OAASf,EAChBW,UAAAC,cAACI,EAAAA,OACC,CAAAR,KAAM,GAAGX,EAAQkB,SACjBZ,KAAMA,EACNc,QAAQ,WACRC,kBAAkB,EAClBC,YAAaf,IAGfP,EAAQS,KAAKC,GACXI,EAAC,QAAAC,cAAAI,EAAAA,OACKI,OAAAC,OAAA,GAAAd,GACJe,IAAKf,EAAOC,KACZL,KAAMA,EACNe,iBAAkBhB,EAClBH,wBAAyBA,OAI9BE,GACCU,EAAC,QAAAC,cAAAI,EAAAA,OACC,CAAAC,QAAQ,SACRM,SAAS,OACTC,YAAa1B,EACbqB,YAAavB,EACbO,KAAMA"}
+{"version":3,"file":"avatarGroup.component-36ff0d62.js","sources":["../src/components/AvatarGroup/avatarGroup.component.tsx"],"sourcesContent":["import { AvatarGroup as CAvatarGroup } from '@chakra-ui/react';\nimport React, { useMemo } from 'react';\nimport { Avatar, AvatarProps } from '../Avatar/avatar.component';\nimport { AvatarSize } from '../Avatar/avatar.types';\n\nexport interface AvatarGroupProps {\n  addButtonTooltipText?: string;\n  avatars: AvatarProps[];\n  handleAddButtonClick?: () => void;\n  handleRemoveButtonClick?: () => void;\n  max?: number;\n  showAddButton?: boolean;\n  showRemoveAvatarButton?: boolean;\n  size?: AvatarSize;\n}\n\nexport const AvatarGroup = ({\n  addButtonTooltipText,\n  avatars,\n  handleAddButtonClick,\n  handleRemoveButtonClick,\n  max = 3,\n  showAddButton = true,\n  showRemoveAvatarButton = false,\n  size = 'md',\n}: AvatarGroupProps): JSX.Element => {\n  const mergedNames = useMemo(() => avatars.map((avatar) => avatar.name).join(', '), [avatars]);\n  const spacing = size === 'lg' || size === 'md' ? -2 : -1;\n\n  return (\n    <CAvatarGroup size={size} spacing={spacing} alignItems=\"flex-start\">\n      {avatars.length > max ? (\n        <Avatar\n          name={`${avatars.length}`}\n          size={size}\n          variant=\"contrast\"\n          showRemoveButton={false}\n          tooltipText={mergedNames}\n        />\n      ) : (\n        avatars.map((avatar) => (\n          <Avatar\n            {...avatar}\n            key={avatar.name}\n            size={size}\n            showRemoveButton={showRemoveAvatarButton}\n            handleRemoveButtonClick={handleRemoveButtonClick}\n          />\n        ))\n      )}\n      {showAddButton && (\n        <Avatar\n          variant=\"dashed\"\n          iconName=\"plus\"\n          handleClick={handleAddButtonClick}\n          tooltipText={addButtonTooltipText}\n          size={size}\n        />\n      )}\n    </CAvatarGroup>\n  );\n};\n"],"names":["addButtonTooltipText","avatars","handleAddButtonClick","handleRemoveButtonClick","max","showAddButton","showRemoveAvatarButton","size","mergedNames","useMemo","map","avatar","name","join","spacing","React","createElement","CAvatarGroup","alignItems","length","Avatar","variant","showRemoveButton","tooltipText","Object","assign","key","iconName","handleClick"],"mappings":"uOAgB2B,EACzBA,qBAAAA,EACAC,QAAAA,EACAC,qBAAAA,EACAC,wBAAAA,EACAC,IAAAA,EAAM,EACNC,cAAAA,GAAgB,EAChBC,uBAAAA,GAAyB,EACzBC,KAAAA,EAAO,SAEP,MAAMC,EAAcC,EAAOA,SAAC,IAAMR,EAAQS,KAAKC,GAAWA,EAAOC,OAAMC,KAAK,OAAO,CAACZ,IAC9Ea,EAAmB,OAATP,GAA0B,OAATA,GAAiB,GAAK,EAEvD,OACEQ,EAAA,QAAAC,cAACC,EAAAA,YAAY,CAACV,KAAMA,EAAMO,QAASA,EAASI,WAAW,cACpDjB,EAAQkB,OAASf,EAChBW,UAAAC,cAACI,EAAAA,OACC,CAAAR,KAAM,GAAGX,EAAQkB,SACjBZ,KAAMA,EACNc,QAAQ,WACRC,kBAAkB,EAClBC,YAAaf,IAGfP,EAAQS,KAAKC,GACXI,EAAC,QAAAC,cAAAI,EAAAA,OACKI,OAAAC,OAAA,GAAAd,GACJe,IAAKf,EAAOC,KACZL,KAAMA,EACNe,iBAAkBhB,EAClBH,wBAAyBA,OAI9BE,GACCU,EAAC,QAAAC,cAAAI,EAAAA,OACC,CAAAC,QAAQ,SACRM,SAAS,OACTC,YAAa1B,EACbqB,YAAavB,EACbO,KAAMA"}

package/build/avatarGroup.component-5c3fe7c2.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react"),t=require("./avatar.component-05bcf698.js"),a=require("./chakra-ui-avatar.esm-eee70d3a.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=n(e);exports.AvatarGroup=({addButtonTooltipText:n,avatars:r,handleAddButtonClick:l,handleRemoveButtonClick:i,max:s=3,showAddButton:u=!0,showRemoveAvatarButton:m=!1,size:d="md"})=>{const c=e.useMemo((()=>r.map((e=>e.name)).join(", ")),[r]),v="lg"===d||"md"===d?-2:-1;return o.default.createElement(a.AvatarGroup,{size:d,spacing:v,alignItems:"flex-start"},r.length>s?o.default.createElement(t.Avatar,{name:`${r.length}`,size:d,variant:"contrast",showRemoveButton:!1,tooltipText:c}):r.map((e=>o.default.createElement(t.Avatar,Object.assign({},e,{key:e.name,size:d,showRemoveButton:m,handleRemoveButtonClick:i})))),u&&o.default.createElement(t.Avatar,{variant:"dashed",iconName:"plus",handleClick:l,tooltipText:n,size:d}))};
+//# sourceMappingURL=avatarGroup.component-5c3fe7c2.js.map

package/build/{avatarGroup.component-98140be9.js.map → avatarGroup.component-5c3fe7c2.js.map}

@@ -1 +1 @@
-{"version":3,"file":"avatarGroup.component-98140be9.js","sources":["../src/components/AvatarGroup/avatarGroup.component.tsx"],"sourcesContent":["import { AvatarGroup as CAvatarGroup } from '@chakra-ui/react';\nimport React, { useMemo } from 'react';\nimport { Avatar, AvatarProps } from '../Avatar/avatar.component';\nimport { AvatarSize } from '../Avatar/avatar.types';\n\nexport interface AvatarGroupProps {\n  addButtonTooltipText?: string;\n  avatars: AvatarProps[];\n  handleAddButtonClick?: () => void;\n  handleRemoveButtonClick?: () => void;\n  max?: number;\n  showAddButton?: boolean;\n  showRemoveAvatarButton?: boolean;\n  size?: AvatarSize;\n}\n\nexport const AvatarGroup = ({\n  addButtonTooltipText,\n  avatars,\n  handleAddButtonClick,\n  handleRemoveButtonClick,\n  max = 3,\n  showAddButton = true,\n  showRemoveAvatarButton = false,\n  size = 'md',\n}: AvatarGroupProps): JSX.Element => {\n  const mergedNames = useMemo(() => avatars.map((avatar) => avatar.name).join(', '), [avatars]);\n  const spacing = size === 'lg' || size === 'md' ? -2 : -1;\n\n  return (\n    <CAvatarGroup size={size} spacing={spacing} alignItems=\"flex-start\">\n      {avatars.length > max ? (\n        <Avatar\n          name={`${avatars.length}`}\n          size={size}\n          variant=\"contrast\"\n          showRemoveButton={false}\n          tooltipText={mergedNames}\n        />\n      ) : (\n        avatars.map((avatar) => (\n          <Avatar\n            {...avatar}\n            key={avatar.name}\n            size={size}\n            showRemoveButton={showRemoveAvatarButton}\n            handleRemoveButtonClick={handleRemoveButtonClick}\n          />\n        ))\n      )}\n      {showAddButton && (\n        <Avatar\n          variant=\"dashed\"\n          iconName=\"plus\"\n          handleClick={handleAddButtonClick}\n          tooltipText={addButtonTooltipText}\n          size={size}\n        />\n      )}\n    </CAvatarGroup>\n  );\n};\n"],"names":["addButtonTooltipText","avatars","handleAddButtonClick","handleRemoveButtonClick","max","showAddButton","showRemoveAvatarButton","size","mergedNames","useMemo","map","avatar","name","join","spacing","React","createElement","CAvatarGroup","alignItems","length","Avatar","variant","showRemoveButton","tooltipText","Object","assign","key","iconName","handleClick"],"mappings":"uOAgB2B,EACzBA,qBAAAA,EACAC,QAAAA,EACAC,qBAAAA,EACAC,wBAAAA,EACAC,IAAAA,EAAM,EACNC,cAAAA,GAAgB,EAChBC,uBAAAA,GAAyB,EACzBC,KAAAA,EAAO,SAEP,MAAMC,EAAcC,EAAOA,SAAC,IAAMR,EAAQS,KAAKC,GAAWA,EAAOC,OAAMC,KAAK,OAAO,CAACZ,IAC9Ea,EAAmB,OAATP,GAA0B,OAATA,GAAiB,GAAK,EAEvD,OACEQ,EAAA,QAAAC,cAACC,EAAAA,YAAY,CAACV,KAAMA,EAAMO,QAASA,EAASI,WAAW,cACpDjB,EAAQkB,OAASf,EAChBW,UAAAC,cAACI,EAAAA,OACC,CAAAR,KAAM,GAAGX,EAAQkB,SACjBZ,KAAMA,EACNc,QAAQ,WACRC,kBAAkB,EAClBC,YAAaf,IAGfP,EAAQS,KAAKC,GACXI,EAAC,QAAAC,cAAAI,EAAAA,OACKI,OAAAC,OAAA,GAAAd,GACJe,IAAKf,EAAOC,KACZL,KAAMA,EACNe,iBAAkBhB,EAClBH,wBAAyBA,OAI9BE,GACCU,EAAC,QAAAC,cAAAI,EAAAA,OACC,CAAAC,QAAQ,SACRM,SAAS,OACTC,YAAa1B,EACbqB,YAAavB,EACbO,KAAMA"}
+{"version":3,"file":"avatarGroup.component-5c3fe7c2.js","sources":["../src/components/AvatarGroup/avatarGroup.component.tsx"],"sourcesContent":["import { AvatarGroup as CAvatarGroup } from '@chakra-ui/react';\nimport React, { useMemo } from 'react';\nimport { Avatar, AvatarProps } from '../Avatar/avatar.component';\nimport { AvatarSize } from '../Avatar/avatar.types';\n\nexport interface AvatarGroupProps {\n  addButtonTooltipText?: string;\n  avatars: AvatarProps[];\n  handleAddButtonClick?: () => void;\n  handleRemoveButtonClick?: () => void;\n  max?: number;\n  showAddButton?: boolean;\n  showRemoveAvatarButton?: boolean;\n  size?: AvatarSize;\n}\n\nexport const AvatarGroup = ({\n  addButtonTooltipText,\n  avatars,\n  handleAddButtonClick,\n  handleRemoveButtonClick,\n  max = 3,\n  showAddButton = true,\n  showRemoveAvatarButton = false,\n  size = 'md',\n}: AvatarGroupProps): JSX.Element => {\n  const mergedNames = useMemo(() => avatars.map((avatar) => avatar.name).join(', '), [avatars]);\n  const spacing = size === 'lg' || size === 'md' ? -2 : -1;\n\n  return (\n    <CAvatarGroup size={size} spacing={spacing} alignItems=\"flex-start\">\n      {avatars.length > max ? (\n        <Avatar\n          name={`${avatars.length}`}\n          size={size}\n          variant=\"contrast\"\n          showRemoveButton={false}\n          tooltipText={mergedNames}\n        />\n      ) : (\n        avatars.map((avatar) => (\n          <Avatar\n            {...avatar}\n            key={avatar.name}\n            size={size}\n            showRemoveButton={showRemoveAvatarButton}\n            handleRemoveButtonClick={handleRemoveButtonClick}\n          />\n        ))\n      )}\n      {showAddButton && (\n        <Avatar\n          variant=\"dashed\"\n          iconName=\"plus\"\n          handleClick={handleAddButtonClick}\n          tooltipText={addButtonTooltipText}\n          size={size}\n        />\n      )}\n    </CAvatarGroup>\n  );\n};\n"],"names":["addButtonTooltipText","avatars","handleAddButtonClick","handleRemoveButtonClick","max","showAddButton","showRemoveAvatarButton","size","mergedNames","useMemo","map","avatar","name","join","spacing","React","createElement","CAvatarGroup","alignItems","length","Avatar","variant","showRemoveButton","tooltipText","Object","assign","key","iconName","handleClick"],"mappings":"uOAgB2B,EACzBA,qBAAAA,EACAC,QAAAA,EACAC,qBAAAA,EACAC,wBAAAA,EACAC,IAAAA,EAAM,EACNC,cAAAA,GAAgB,EAChBC,uBAAAA,GAAyB,EACzBC,KAAAA,EAAO,SAEP,MAAMC,EAAcC,EAAOA,SAAC,IAAMR,EAAQS,KAAKC,GAAWA,EAAOC,OAAMC,KAAK,OAAO,CAACZ,IAC9Ea,EAAmB,OAATP,GAA0B,OAATA,GAAiB,GAAK,EAEvD,OACEQ,EAAA,QAAAC,cAACC,EAAAA,YAAY,CAACV,KAAMA,EAAMO,QAASA,EAASI,WAAW,cACpDjB,EAAQkB,OAASf,EAChBW,UAAAC,cAACI,EAAAA,OACC,CAAAR,KAAM,GAAGX,EAAQkB,SACjBZ,KAAMA,EACNc,QAAQ,WACRC,kBAAkB,EAClBC,YAAaf,IAGfP,EAAQS,KAAKC,GACXI,EAAC,QAAAC,cAAAI,EAAAA,OACKI,OAAAC,OAAA,GAAAd,GACJe,IAAKf,EAAOC,KACZL,KAAMA,EACNe,iBAAkBhB,EAClBH,wBAAyBA,OAI9BE,GACCU,EAAC,QAAAC,cAAAI,EAAAA,OACC,CAAAC,QAAQ,SACRM,SAAS,OACTC,YAAa1B,EACbqB,YAAavB,EACbO,KAAMA"}

package/build/{button.component-967d0def.js → button.component-0b765852.js}

@@ -1,2 +1,2 @@
-"use strict";var e=require("./tslib.es6-194b75fc.js"),t=require("react"),n=require("./icon.component-d618e1f5.js"),r=require("./chakra-ui-button.esm-bd065780.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=i(t);const o=t.forwardRef(((i,o)=>{var{iconName:s,size:c="md",iconPosition:u,isOnContrast:l=!1,variant:f="primary",children:d}=i,m=e.__rest(i,["iconName","size","iconPosition","isOnContrast","variant","children"]);const p=t.useMemo((()=>`${f}${l?"OnContrast":""}`),[l,f]);if(s){const e=a.default.createElement(n.Icon,{size:c,name:s});if(!d){const t=s.replace(/([A-Z])/g," $1").replace(/^\w/,(e=>e.toUpperCase()));return a.default.createElement(r.IconButton,Object.assign({variant:p,ref:o,"aria-label":t,icon:e,size:c},m))}m["right"===u?"rightIcon":"leftIcon"]=e}return a.default.createElement(r.Button,Object.assign({fontWeight:"bold",cursor:"pointer",ref:o,size:c,iconSpacing:"sm"===c||"xs"===c?"4px":"8px",borderRadius:"base",variant:p},m),d)}));o.displayName="Button",exports.Button=o;
-//# sourceMappingURL=button.component-967d0def.js.map
+"use strict";var e=require("./tslib.es6-d6f17add.js"),t=require("react"),n=require("./icon.component-d618e1f5.js"),r=require("./chakra-ui-button.esm-bd065780.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=i(t);const o=t.forwardRef(((i,o)=>{var{iconName:s,size:c="md",iconPosition:u,isOnContrast:d=!1,variant:l="primary",children:f}=i,m=e.__rest(i,["iconName","size","iconPosition","isOnContrast","variant","children"]);const p=t.useMemo((()=>`${l}${d?"OnContrast":""}`),[d,l]);if(s){const e=a.default.createElement(n.Icon,{size:c,name:s});if(!f){const t=s.replace(/([A-Z])/g," $1").replace(/^\w/,(e=>e.toUpperCase()));return a.default.createElement(r.IconButton,Object.assign({variant:p,ref:o,"aria-label":t,icon:e,size:c},m))}m["right"===u?"rightIcon":"leftIcon"]=e}return a.default.createElement(r.Button,Object.assign({fontWeight:"bold",cursor:"pointer",ref:o,size:c,iconSpacing:"sm"===c||"xs"===c?"4px":"8px",borderRadius:"base",variant:p},m),f)}));o.displayName="Button",exports.Button=o;
+//# sourceMappingURL=button.component-0b765852.js.map