@flipdish/portal-library 8.5.7 → 8.6.1

package/dist/components/atoms/Avatar/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/Avatar/index.tsx"],"sourcesContent":["import MuiAvatar, { type AvatarProps as MuiAvatarProps } from '@mui/material/Avatar';\nimport type { CSSObject } from '@mui/material/styles';\n\nimport { fontFamily } from '@fd/themes/tokens/typography/font-family';\nimport { fontSize } from '@fd/themes/tokens/typography/font-size';\nimport { getMobileTextStyle } from '@fd/themes/typography';\nimport styled from '@fd/utilities/styledUtilities';\n\ntype Size = 'large' | 'medium' | 'small' | undefined;\ntype Type = 'icon' | 'initials' | 'logo' | 'photo' | undefined;\n\ninterface CommonProps {\n  /** Size of the avatar, defaults to 'medium' */\n  size?: Size;\n  /** Test ID for testing and automation */\n  fdKey?: string;\n  /** Alternative text for the avatar image */\n  alt?: string;\n}\n\ninterface LogoProps {\n  /** Type of avatar - displays a logo image */\n  type: 'logo';\n  /** Source URL for the logo image */\n  src: string;\n  /** Alternative text for the logo image */\n  alt: string;\n}\n\ninterface PhotoProps {\n  /** Type of avatar - displays a photo image */\n  type: 'photo';\n  /** Source URL for the photo image */\n  src: string;\n  /** Alternative text for the photo image */\n  alt: string;\n}\n\ninterface InitialsProps {\n  /** Aria-label for full name of the displayed initials */\n  ariaLabel?: string;\n  /** Type of avatar - displays initials text */\n  type: 'initials';\n  /** Initials text to display in the avatar */\n  initials: string;\n}\n\ninterface IconProps {\n  /** Type of avatar - displays an icon */\n  type?: 'icon';\n  /** Icon component to display in the avatar */\n  icon?: React.ReactNode;\n}\n\n/** Props for the Avatar component */\nexport type AvatarProps = CommonProps & (IconProps | InitialsProps | LogoProps | PhotoProps);\n\ntype StyledAvatarProps = MuiAvatarProps & {\n  size: Size;\n  type: Type;\n};\n\nconst StyledAvatar = styled(MuiAvatar, {\n  shouldForwardProp: (prop) => prop !== 'size' && prop !== 'type',\n})<StyledAvatarProps>(({ theme, size = 'medium', type }): CSSObject => {\n  const pixels = {\n    small: '32',\n    medium: '48',\n    large: '64',\n  } as const;\n\n  const fontSizes = {\n    small: fontSize.desktop.caption,\n    medium: fontSize.desktop.h4,\n    large: fontSize.desktop.h3,\n  };\n\n  const mobileKeys = {\n    small: 'caption',\n    medium: 'h4',\n    large: 'h3',\n  } as const;\n\n  const dim = pixels[size];\n\n  const customBorderRadius =\n    type !== 'photo'\n      ? {\n          borderRadius: '8px',\n        }\n      : {};\n\n  return {\n    fontStyle: 'normal',\n    fontWeight: 600,\n    fontFamily: fontFamily.desktop.body,\n    fontSize: fontSizes[size],\n    color: theme.palette.grey[700],\n    backgroundColor: '#f5f5f5',\n    width: `${dim}px`,\n    height: `${dim}px`,\n    border: `1px solid #ddd`,\n    ...customBorderRadius,\n\n    [theme.breakpoints.down('tablet')]: {\n      ...getMobileTextStyle(mobileKeys[size]), // mobile typography override\n    },\n  };\n});\n\n/**\n * Avatar component displays user avatars in different formats: photos, logos, initials, or icons.\n * The component automatically adjusts styling based on the avatar type - photos use circular shape\n * while logos use rounded corners. Size can be controlled via the size prop (small, medium, large).\n */\nconst Avatar: React.FC<AvatarProps> = (props) => {\n  const { type, fdKey } = props;\n\n  const getAriaLabel = (): string | undefined => {\n    switch (type) {\n      case 'initials':\n        return props.ariaLabel;\n      default:\n        return undefined;\n    }\n  };\n\n  const getVariant = (): MuiAvatarProps['variant'] => {\n    switch (type) {\n      case 'photo':\n        return 'circular';\n      case 'logo':\n      default:\n        return 'rounded';\n    }\n  };\n\n  const getChildren = (): React.ReactNode => {\n    switch (type) {\n      case 'icon':\n        return props.icon;\n      case 'initials':\n        return props.initials;\n      default:\n        return null;\n    }\n  };\n\n  const getSrc = (): string | undefined => {\n    switch (type) {\n      case 'logo':\n      case 'photo':\n        return props.src;\n      default:\n        return undefined;\n    }\n  };\n\n  return (\n    <StyledAvatar\n      alt={props.alt}\n      aria-hidden={props.type === 'icon'}\n      aria-label={getAriaLabel()}\n      data-fd={fdKey}\n      size={props.size}\n      src={getSrc()}\n      type={props.type}\n      variant={getVariant()}\n    >\n      {getChildren()}\n    </StyledAvatar>\n  );\n};\n\nexport default Avatar;\n"],"names":["StyledAvatar","styled","MuiAvatar","shouldForwardProp","prop","theme","size","type","fontSizes","small","fontSize","desktop","caption","medium","h4","large","h3","dim","customBorderRadius","borderRadius","fontStyle","fontWeight","fontFamily","body","color","palette","grey","backgroundColor","width","height","border","breakpoints","down","getMobileTextStyle","props","fdKey","_jsx","alt","ariaLabel","getAriaLabel","src","getSrc","variant","icon","initials","getChildren"],"mappings":"mQA8DA,MAAMA,kCAAeC,OAAOC,EAAW,CACrCC,kBAAoBC,GAAkB,SAATA,GAA4B,SAATA,GAD7BH,EAEC,EAAGI,QAAOC,OAAO,SAAUC,WAC/C,MAMMC,EAAY,CAChBC,MAAOC,EAAAA,SAASC,QAAQC,QACxBC,OAAQH,EAAAA,SAASC,QAAQG,GACzBC,MAAOL,EAAAA,SAASC,QAAQK,IASpBC,EAlBS,CACbR,MAAO,KACPI,OAAQ,KACRE,MAAO,MAeUT,GAEbY,EACK,UAATX,EACI,CACEY,aAAc,OAEhB,CAAA,EAEN,MAAO,CACLC,UAAW,SACXC,WAAY,IACZC,WAAYA,EAAAA,WAAWX,QAAQY,KAC/Bb,SAAUF,EAAUF,GACpBkB,MAAOnB,EAAMoB,QAAQC,KAAK,KAC1BC,gBAAiB,UACjBC,MAAO,GAAGX,MACVY,OAAQ,GAAGZ,MACXa,OAAQ,oBACLZ,EAEH,CAACb,EAAM0B,YAAYC,KAAK,WAAY,IAC/BC,EAAAA,mBA5BY,CACjBxB,MAAO,UACPI,OAAQ,KACRE,MAAO,MAyB4BT,wBAUA4B,IACrC,MAAM3B,KAAEA,EAAI4B,MAAEA,GAAUD,EA0CxB,OACEE,EAAAA,IAACpC,EAAY,CACXqC,IAAKH,EAAMG,IAAG,cACc,SAAfH,EAAM3B,KAAe,aA3CjB,MACnB,GACO,aADCA,EAEJ,OAAO2B,EAAMI,WAyCHC,GAAc,UACjBJ,EACT7B,KAAM4B,EAAM5B,KACZkC,IAjBW,MACb,OAAQjC,GACN,IAAK,OACL,IAAK,QACH,OAAO2B,EAAMM,IACf,QACE,SAWGC,GACLlC,KAAM2B,EAAM3B,KACZmC,QAtCK,UADCnC,EAEG,WAGA,mBAIO,MAClB,OAAQA,GACN,IAAK,OACH,OAAO2B,EAAMS,KACf,IAAK,WACH,OAAOT,EAAMU,SACf,QACE,OAAO,OAyBRC"}
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/Avatar/index.tsx"],"sourcesContent":["import MuiAvatar, { type AvatarProps as MuiAvatarProps } from '@mui/material/Avatar';\nimport type { CSSObject } from '@mui/material/styles';\n\nimport { fontFamily } from '@fd/themes/tokens/typography/font-family';\nimport { fontSize } from '@fd/themes/tokens/typography/font-size';\nimport { getMobileTextStyle } from '@fd/themes/typography';\nimport styled from '@fd/utilities/styledUtilities';\n\ntype Size = 'large' | 'medium' | 'small' | undefined;\ntype Type = 'icon' | 'initials' | 'logo' | 'photo' | undefined;\n\ninterface CommonProps {\n  /** Size of the avatar, defaults to 'medium' */\n  size?: Size;\n  /** Test ID for testing and automation */\n  fdKey?: string;\n  /** Alternative text for the avatar image */\n  alt?: string;\n}\n\ninterface LogoProps {\n  /** Type of avatar - displays a logo image */\n  type: 'logo';\n  /** Source URL for the logo image */\n  src: string;\n  /** Alternative text for the logo image */\n  alt: string;\n}\n\ninterface PhotoProps {\n  /** Type of avatar - displays a photo image */\n  type: 'photo';\n  /** Source URL for the photo image */\n  src: string;\n  /** Alternative text for the photo image */\n  alt: string;\n}\n\ninterface InitialsProps {\n  /** Aria-label for full name of the displayed initials */\n  ariaLabel?: string;\n  /** Type of avatar - displays initials text */\n  type: 'initials';\n  /** Initials text to display in the avatar */\n  initials: string;\n}\n\ninterface IconProps {\n  /** Type of avatar - displays an icon */\n  type?: 'icon';\n  /** Icon component to display in the avatar */\n  icon?: React.ReactNode;\n}\n\n/** Props for the Avatar component */\nexport type AvatarProps = CommonProps & (IconProps | InitialsProps | LogoProps | PhotoProps);\n\ntype StyledAvatarProps = MuiAvatarProps & {\n  size: Size;\n  type: Type;\n};\n\nconst StyledAvatar = styled(MuiAvatar, {\n  shouldForwardProp: (prop) => prop !== 'size' && prop !== 'type',\n})<StyledAvatarProps>(({ theme, size = 'medium', type }): CSSObject => {\n  const pixels = {\n    small: '32',\n    medium: '48',\n    large: '64',\n  } as const;\n\n  const fontSizes = {\n    small: fontSize.desktop.caption,\n    medium: fontSize.desktop.h4,\n    large: fontSize.desktop.h3,\n  };\n\n  const mobileKeys = {\n    small: 'caption',\n    medium: 'h4',\n    large: 'h3',\n  } as const;\n\n  const dim = pixels[size];\n\n  const customBorderRadius =\n    type !== 'photo'\n      ? {\n          borderRadius: '8px',\n        }\n      : {};\n\n  return {\n    fontStyle: 'normal',\n    fontWeight: 600,\n    fontFamily: fontFamily.desktop.body,\n    fontSize: fontSizes[size],\n    color: theme.palette.grey[700],\n    backgroundColor: '#f5f5f5',\n    width: `${dim}px`,\n    height: `${dim}px`,\n    border: `1px solid #ddd`,\n    ...customBorderRadius,\n\n    [theme.breakpoints.down('tablet')]: {\n      ...getMobileTextStyle(mobileKeys[size]), // mobile typography override\n    },\n  };\n});\n\n/**\n * Avatar component displays user avatars in different formats: photos, logos, initials, or icons.\n * The component automatically adjusts styling based on the avatar type - photos use circular shape\n * while logos use rounded corners. Size can be controlled via the size prop (small, medium, large).\n */\nconst Avatar: React.FC<AvatarProps> = (props) => {\n  const { type, fdKey } = props;\n\n  const getAriaLabel = (): string | undefined => {\n    switch (type) {\n      case 'initials':\n        return props.ariaLabel;\n      default:\n        return undefined;\n    }\n  };\n\n  const getVariant = (): MuiAvatarProps['variant'] => {\n    switch (type) {\n      case 'photo':\n        return 'circular';\n      case 'logo':\n      default:\n        return 'rounded';\n    }\n  };\n\n  const getChildren = (): React.ReactNode => {\n    switch (type) {\n      case 'icon':\n        return props.icon;\n      case 'initials':\n        return props.initials;\n      default:\n        return null;\n    }\n  };\n\n  const getSrc = (): string | undefined => {\n    switch (type) {\n      case 'logo':\n      case 'photo':\n        return props.src;\n      default:\n        return undefined;\n    }\n  };\n\n  return (\n    <StyledAvatar\n      alt={props.alt}\n      aria-hidden={props.type === 'icon'}\n      aria-label={getAriaLabel()}\n      data-fd={fdKey}\n      size={props.size}\n      src={getSrc()}\n      type={props.type}\n      variant={getVariant()}\n    >\n      {getChildren()}\n    </StyledAvatar>\n  );\n};\n\nexport default Avatar;\n"],"names":["StyledAvatar","styled","MuiAvatar","shouldForwardProp","prop","theme","size","type","fontSizes","small","fontSize","desktop","caption","medium","h4","large","h3","dim","customBorderRadius","borderRadius","fontStyle","fontWeight","fontFamily","body","color","palette","grey","backgroundColor","width","height","border","breakpoints","down","getMobileTextStyle","props","fdKey","_jsx","alt","ariaLabel","getAriaLabel","src","getSrc","variant","icon","initials","getChildren"],"mappings":"mQA8DA,MAAMA,kCAAeC,OAAOC,EAAW,CACrCC,kBAAoBC,GAAkB,SAATA,GAA4B,SAATA,GAD7BH,CAEC,EAAGI,QAAOC,OAAO,SAAUC,WAC/C,MAMMC,EAAY,CAChBC,MAAOC,EAAAA,SAASC,QAAQC,QACxBC,OAAQH,EAAAA,SAASC,QAAQG,GACzBC,MAAOL,EAAAA,SAASC,QAAQK,IASpBC,EAlBS,CACbR,MAAO,KACPI,OAAQ,KACRE,MAAO,MAeUT,GAEbY,EACK,UAATX,EACI,CACEY,aAAc,OAEhB,CAAA,EAEN,MAAO,CACLC,UAAW,SACXC,WAAY,IACZC,WAAYA,EAAAA,WAAWX,QAAQY,KAC/Bb,SAAUF,EAAUF,GACpBkB,MAAOnB,EAAMoB,QAAQC,KAAK,KAC1BC,gBAAiB,UACjBC,MAAO,GAAGX,MACVY,OAAQ,GAAGZ,MACXa,OAAQ,oBACLZ,EAEH,CAACb,EAAM0B,YAAYC,KAAK,WAAY,IAC/BC,EAAAA,mBA5BY,CACjBxB,MAAO,UACPI,OAAQ,KACRE,MAAO,MAyB4BT,uBAUA4B,IACrC,MAAM3B,KAAEA,EAAI4B,MAAEA,GAAUD,EA0CxB,OACEE,EAAAA,IAACpC,EAAY,CACXqC,IAAKH,EAAMG,IAAG,cACc,SAAfH,EAAM3B,KAAe,aA3CjB,MACnB,GACO,aADCA,EAEJ,OAAO2B,EAAMI,WAyCHC,GAAc,UACjBJ,EACT7B,KAAM4B,EAAM5B,KACZkC,IAjBW,MACb,OAAQjC,GACN,IAAK,OACL,IAAK,QACH,OAAO2B,EAAMM,IACf,QACE,SAWGC,GACLlC,KAAM2B,EAAM3B,KACZmC,QAtCK,UADCnC,EAEG,WAGA,mBAIO,MAClB,OAAQA,GACN,IAAK,OACH,OAAO2B,EAAMS,KACf,IAAK,WACH,OAAOT,EAAMU,SACf,QACE,OAAO,OAyBRC"}

package/dist/components/atoms/Avatar/index.js

@@ -1,2 +1,2 @@
-import{jsx as t}from"react/jsx-runtime";import e from"@mui/material/Avatar";import{fontFamily as r}from"../../../themes/tokens/typography/font-family.js";import{fontSize as o}from"../../../themes/tokens/typography/font-size.js";import{getMobileTextStyle as a}from"../../../themes/typography.js";import{styled as i}from"@mui/material/styles";const s=i(e,{shouldForwardProp:t=>"size"!==t&&"type"!==t})((({theme:t,size:e="medium",type:i})=>{const s={small:o.desktop.caption,medium:o.desktop.h4,large:o.desktop.h3},l={small:"32",medium:"48",large:"64"}[e],n="photo"!==i?{borderRadius:"8px"}:{};return{fontStyle:"normal",fontWeight:600,fontFamily:r.desktop.body,fontSize:s[e],color:t.palette.grey[700],backgroundColor:"#f5f5f5",width:`${l}px`,height:`${l}px`,border:"1px solid #ddd",...n,[t.breakpoints.down("tablet")]:{...a({small:"caption",medium:"h4",large:"h3"}[e])}}})),l=e=>{const{type:r,fdKey:o}=e;return t(s,{alt:e.alt,"aria-hidden":"icon"===e.type,"aria-label":(()=>{if("initials"===r)return e.ariaLabel})(),"data-fd":o,size:e.size,src:(()=>{switch(r){case"logo":case"photo":return e.src;default:return}})(),type:e.type,variant:"photo"===r?"circular":"rounded",children:(()=>{switch(r){case"icon":return e.icon;case"initials":return e.initials;default:return null}})()})};export{l as default};
+import{jsx as t}from"react/jsx-runtime";import e from"@mui/material/Avatar";import{fontFamily as r}from"../../../themes/tokens/typography/font-family.js";import{fontSize as o}from"../../../themes/tokens/typography/font-size.js";import{getMobileTextStyle as a}from"../../../themes/typography.js";import{styled as i}from"@mui/material/styles";const s=i(e,{shouldForwardProp:t=>"size"!==t&&"type"!==t})(({theme:t,size:e="medium",type:i})=>{const s={small:o.desktop.caption,medium:o.desktop.h4,large:o.desktop.h3},l={small:"32",medium:"48",large:"64"}[e],n="photo"!==i?{borderRadius:"8px"}:{};return{fontStyle:"normal",fontWeight:600,fontFamily:r.desktop.body,fontSize:s[e],color:t.palette.grey[700],backgroundColor:"#f5f5f5",width:`${l}px`,height:`${l}px`,border:"1px solid #ddd",...n,[t.breakpoints.down("tablet")]:{...a({small:"caption",medium:"h4",large:"h3"}[e])}}}),l=e=>{const{type:r,fdKey:o}=e;return t(s,{alt:e.alt,"aria-hidden":"icon"===e.type,"aria-label":(()=>{if("initials"===r)return e.ariaLabel})(),"data-fd":o,size:e.size,src:(()=>{switch(r){case"logo":case"photo":return e.src;default:return}})(),type:e.type,variant:"photo"===r?"circular":"rounded",children:(()=>{switch(r){case"icon":return e.icon;case"initials":return e.initials;default:return null}})()})};export{l as default};
 //# sourceMappingURL=index.js.map

package/dist/components/atoms/Avatar/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/Avatar/index.tsx"],"sourcesContent":["import MuiAvatar, { type AvatarProps as MuiAvatarProps } from '@mui/material/Avatar';\nimport type { CSSObject } from '@mui/material/styles';\n\nimport { fontFamily } from '@fd/themes/tokens/typography/font-family';\nimport { fontSize } from '@fd/themes/tokens/typography/font-size';\nimport { getMobileTextStyle } from '@fd/themes/typography';\nimport styled from '@fd/utilities/styledUtilities';\n\ntype Size = 'large' | 'medium' | 'small' | undefined;\ntype Type = 'icon' | 'initials' | 'logo' | 'photo' | undefined;\n\ninterface CommonProps {\n  /** Size of the avatar, defaults to 'medium' */\n  size?: Size;\n  /** Test ID for testing and automation */\n  fdKey?: string;\n  /** Alternative text for the avatar image */\n  alt?: string;\n}\n\ninterface LogoProps {\n  /** Type of avatar - displays a logo image */\n  type: 'logo';\n  /** Source URL for the logo image */\n  src: string;\n  /** Alternative text for the logo image */\n  alt: string;\n}\n\ninterface PhotoProps {\n  /** Type of avatar - displays a photo image */\n  type: 'photo';\n  /** Source URL for the photo image */\n  src: string;\n  /** Alternative text for the photo image */\n  alt: string;\n}\n\ninterface InitialsProps {\n  /** Aria-label for full name of the displayed initials */\n  ariaLabel?: string;\n  /** Type of avatar - displays initials text */\n  type: 'initials';\n  /** Initials text to display in the avatar */\n  initials: string;\n}\n\ninterface IconProps {\n  /** Type of avatar - displays an icon */\n  type?: 'icon';\n  /** Icon component to display in the avatar */\n  icon?: React.ReactNode;\n}\n\n/** Props for the Avatar component */\nexport type AvatarProps = CommonProps & (IconProps | InitialsProps | LogoProps | PhotoProps);\n\ntype StyledAvatarProps = MuiAvatarProps & {\n  size: Size;\n  type: Type;\n};\n\nconst StyledAvatar = styled(MuiAvatar, {\n  shouldForwardProp: (prop) => prop !== 'size' && prop !== 'type',\n})<StyledAvatarProps>(({ theme, size = 'medium', type }): CSSObject => {\n  const pixels = {\n    small: '32',\n    medium: '48',\n    large: '64',\n  } as const;\n\n  const fontSizes = {\n    small: fontSize.desktop.caption,\n    medium: fontSize.desktop.h4,\n    large: fontSize.desktop.h3,\n  };\n\n  const mobileKeys = {\n    small: 'caption',\n    medium: 'h4',\n    large: 'h3',\n  } as const;\n\n  const dim = pixels[size];\n\n  const customBorderRadius =\n    type !== 'photo'\n      ? {\n          borderRadius: '8px',\n        }\n      : {};\n\n  return {\n    fontStyle: 'normal',\n    fontWeight: 600,\n    fontFamily: fontFamily.desktop.body,\n    fontSize: fontSizes[size],\n    color: theme.palette.grey[700],\n    backgroundColor: '#f5f5f5',\n    width: `${dim}px`,\n    height: `${dim}px`,\n    border: `1px solid #ddd`,\n    ...customBorderRadius,\n\n    [theme.breakpoints.down('tablet')]: {\n      ...getMobileTextStyle(mobileKeys[size]), // mobile typography override\n    },\n  };\n});\n\n/**\n * Avatar component displays user avatars in different formats: photos, logos, initials, or icons.\n * The component automatically adjusts styling based on the avatar type - photos use circular shape\n * while logos use rounded corners. Size can be controlled via the size prop (small, medium, large).\n */\nconst Avatar: React.FC<AvatarProps> = (props) => {\n  const { type, fdKey } = props;\n\n  const getAriaLabel = (): string | undefined => {\n    switch (type) {\n      case 'initials':\n        return props.ariaLabel;\n      default:\n        return undefined;\n    }\n  };\n\n  const getVariant = (): MuiAvatarProps['variant'] => {\n    switch (type) {\n      case 'photo':\n        return 'circular';\n      case 'logo':\n      default:\n        return 'rounded';\n    }\n  };\n\n  const getChildren = (): React.ReactNode => {\n    switch (type) {\n      case 'icon':\n        return props.icon;\n      case 'initials':\n        return props.initials;\n      default:\n        return null;\n    }\n  };\n\n  const getSrc = (): string | undefined => {\n    switch (type) {\n      case 'logo':\n      case 'photo':\n        return props.src;\n      default:\n        return undefined;\n    }\n  };\n\n  return (\n    <StyledAvatar\n      alt={props.alt}\n      aria-hidden={props.type === 'icon'}\n      aria-label={getAriaLabel()}\n      data-fd={fdKey}\n      size={props.size}\n      src={getSrc()}\n      type={props.type}\n      variant={getVariant()}\n    >\n      {getChildren()}\n    </StyledAvatar>\n  );\n};\n\nexport default Avatar;\n"],"names":["StyledAvatar","styled","MuiAvatar","shouldForwardProp","prop","theme","size","type","fontSizes","small","fontSize","desktop","caption","medium","h4","large","h3","dim","customBorderRadius","borderRadius","fontStyle","fontWeight","fontFamily","body","color","palette","grey","backgroundColor","width","height","border","breakpoints","down","getMobileTextStyle","Avatar","props","fdKey","_jsx","alt","ariaLabel","getAriaLabel","src","getSrc","variant","icon","initials","getChildren"],"mappings":"qVA8DA,MAAMA,EAAeC,EAAOC,EAAW,CACrCC,kBAAoBC,GAAkB,SAATA,GAA4B,SAATA,GAD7BH,EAEC,EAAGI,QAAOC,OAAO,SAAUC,WAC/C,MAMMC,EAAY,CAChBC,MAAOC,EAASC,QAAQC,QACxBC,OAAQH,EAASC,QAAQG,GACzBC,MAAOL,EAASC,QAAQK,IASpBC,EAlBS,CACbR,MAAO,KACPI,OAAQ,KACRE,MAAO,MAeUT,GAEbY,EACK,UAATX,EACI,CACEY,aAAc,OAEhB,CAAA,EAEN,MAAO,CACLC,UAAW,SACXC,WAAY,IACZC,WAAYA,EAAWX,QAAQY,KAC/Bb,SAAUF,EAAUF,GACpBkB,MAAOnB,EAAMoB,QAAQC,KAAK,KAC1BC,gBAAiB,UACjBC,MAAO,GAAGX,MACVY,OAAQ,GAAGZ,MACXa,OAAQ,oBACLZ,EAEH,CAACb,EAAM0B,YAAYC,KAAK,WAAY,IAC/BC,EA5BY,CACjBxB,MAAO,UACPI,OAAQ,KACRE,MAAO,MAyB4BT,SAUjC4B,EAAiCC,IACrC,MAAM5B,KAAEA,EAAI6B,MAAEA,GAAUD,EA0CxB,OACEE,EAACrC,EAAY,CACXsC,IAAKH,EAAMG,IAAG,cACc,SAAfH,EAAM5B,KAAe,aA3CjB,MACnB,GACO,aADCA,EAEJ,OAAO4B,EAAMI,WAyCHC,GAAc,UACjBJ,EACT9B,KAAM6B,EAAM7B,KACZmC,IAjBW,MACb,OAAQlC,GACN,IAAK,OACL,IAAK,QACH,OAAO4B,EAAMM,IACf,QACE,SAWGC,GACLnC,KAAM4B,EAAM5B,KACZoC,QAtCK,UADCpC,EAEG,WAGA,mBAIO,MAClB,OAAQA,GACN,IAAK,OACH,OAAO4B,EAAMS,KACf,IAAK,WACH,OAAOT,EAAMU,SACf,QACE,OAAO,OAyBRC"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/Avatar/index.tsx"],"sourcesContent":["import MuiAvatar, { type AvatarProps as MuiAvatarProps } from '@mui/material/Avatar';\nimport type { CSSObject } from '@mui/material/styles';\n\nimport { fontFamily } from '@fd/themes/tokens/typography/font-family';\nimport { fontSize } from '@fd/themes/tokens/typography/font-size';\nimport { getMobileTextStyle } from '@fd/themes/typography';\nimport styled from '@fd/utilities/styledUtilities';\n\ntype Size = 'large' | 'medium' | 'small' | undefined;\ntype Type = 'icon' | 'initials' | 'logo' | 'photo' | undefined;\n\ninterface CommonProps {\n  /** Size of the avatar, defaults to 'medium' */\n  size?: Size;\n  /** Test ID for testing and automation */\n  fdKey?: string;\n  /** Alternative text for the avatar image */\n  alt?: string;\n}\n\ninterface LogoProps {\n  /** Type of avatar - displays a logo image */\n  type: 'logo';\n  /** Source URL for the logo image */\n  src: string;\n  /** Alternative text for the logo image */\n  alt: string;\n}\n\ninterface PhotoProps {\n  /** Type of avatar - displays a photo image */\n  type: 'photo';\n  /** Source URL for the photo image */\n  src: string;\n  /** Alternative text for the photo image */\n  alt: string;\n}\n\ninterface InitialsProps {\n  /** Aria-label for full name of the displayed initials */\n  ariaLabel?: string;\n  /** Type of avatar - displays initials text */\n  type: 'initials';\n  /** Initials text to display in the avatar */\n  initials: string;\n}\n\ninterface IconProps {\n  /** Type of avatar - displays an icon */\n  type?: 'icon';\n  /** Icon component to display in the avatar */\n  icon?: React.ReactNode;\n}\n\n/** Props for the Avatar component */\nexport type AvatarProps = CommonProps & (IconProps | InitialsProps | LogoProps | PhotoProps);\n\ntype StyledAvatarProps = MuiAvatarProps & {\n  size: Size;\n  type: Type;\n};\n\nconst StyledAvatar = styled(MuiAvatar, {\n  shouldForwardProp: (prop) => prop !== 'size' && prop !== 'type',\n})<StyledAvatarProps>(({ theme, size = 'medium', type }): CSSObject => {\n  const pixels = {\n    small: '32',\n    medium: '48',\n    large: '64',\n  } as const;\n\n  const fontSizes = {\n    small: fontSize.desktop.caption,\n    medium: fontSize.desktop.h4,\n    large: fontSize.desktop.h3,\n  };\n\n  const mobileKeys = {\n    small: 'caption',\n    medium: 'h4',\n    large: 'h3',\n  } as const;\n\n  const dim = pixels[size];\n\n  const customBorderRadius =\n    type !== 'photo'\n      ? {\n          borderRadius: '8px',\n        }\n      : {};\n\n  return {\n    fontStyle: 'normal',\n    fontWeight: 600,\n    fontFamily: fontFamily.desktop.body,\n    fontSize: fontSizes[size],\n    color: theme.palette.grey[700],\n    backgroundColor: '#f5f5f5',\n    width: `${dim}px`,\n    height: `${dim}px`,\n    border: `1px solid #ddd`,\n    ...customBorderRadius,\n\n    [theme.breakpoints.down('tablet')]: {\n      ...getMobileTextStyle(mobileKeys[size]), // mobile typography override\n    },\n  };\n});\n\n/**\n * Avatar component displays user avatars in different formats: photos, logos, initials, or icons.\n * The component automatically adjusts styling based on the avatar type - photos use circular shape\n * while logos use rounded corners. Size can be controlled via the size prop (small, medium, large).\n */\nconst Avatar: React.FC<AvatarProps> = (props) => {\n  const { type, fdKey } = props;\n\n  const getAriaLabel = (): string | undefined => {\n    switch (type) {\n      case 'initials':\n        return props.ariaLabel;\n      default:\n        return undefined;\n    }\n  };\n\n  const getVariant = (): MuiAvatarProps['variant'] => {\n    switch (type) {\n      case 'photo':\n        return 'circular';\n      case 'logo':\n      default:\n        return 'rounded';\n    }\n  };\n\n  const getChildren = (): React.ReactNode => {\n    switch (type) {\n      case 'icon':\n        return props.icon;\n      case 'initials':\n        return props.initials;\n      default:\n        return null;\n    }\n  };\n\n  const getSrc = (): string | undefined => {\n    switch (type) {\n      case 'logo':\n      case 'photo':\n        return props.src;\n      default:\n        return undefined;\n    }\n  };\n\n  return (\n    <StyledAvatar\n      alt={props.alt}\n      aria-hidden={props.type === 'icon'}\n      aria-label={getAriaLabel()}\n      data-fd={fdKey}\n      size={props.size}\n      src={getSrc()}\n      type={props.type}\n      variant={getVariant()}\n    >\n      {getChildren()}\n    </StyledAvatar>\n  );\n};\n\nexport default Avatar;\n"],"names":["StyledAvatar","styled","MuiAvatar","shouldForwardProp","prop","theme","size","type","fontSizes","small","fontSize","desktop","caption","medium","h4","large","h3","dim","customBorderRadius","borderRadius","fontStyle","fontWeight","fontFamily","body","color","palette","grey","backgroundColor","width","height","border","breakpoints","down","getMobileTextStyle","Avatar","props","fdKey","_jsx","alt","ariaLabel","getAriaLabel","src","getSrc","variant","icon","initials","getChildren"],"mappings":"qVA8DA,MAAMA,EAAeC,EAAOC,EAAW,CACrCC,kBAAoBC,GAAkB,SAATA,GAA4B,SAATA,GAD7BH,CAEC,EAAGI,QAAOC,OAAO,SAAUC,WAC/C,MAMMC,EAAY,CAChBC,MAAOC,EAASC,QAAQC,QACxBC,OAAQH,EAASC,QAAQG,GACzBC,MAAOL,EAASC,QAAQK,IASpBC,EAlBS,CACbR,MAAO,KACPI,OAAQ,KACRE,MAAO,MAeUT,GAEbY,EACK,UAATX,EACI,CACEY,aAAc,OAEhB,CAAA,EAEN,MAAO,CACLC,UAAW,SACXC,WAAY,IACZC,WAAYA,EAAWX,QAAQY,KAC/Bb,SAAUF,EAAUF,GACpBkB,MAAOnB,EAAMoB,QAAQC,KAAK,KAC1BC,gBAAiB,UACjBC,MAAO,GAAGX,MACVY,OAAQ,GAAGZ,MACXa,OAAQ,oBACLZ,EAEH,CAACb,EAAM0B,YAAYC,KAAK,WAAY,IAC/BC,EA5BY,CACjBxB,MAAO,UACPI,OAAQ,KACRE,MAAO,MAyB4BT,QAUjC4B,EAAiCC,IACrC,MAAM5B,KAAEA,EAAI6B,MAAEA,GAAUD,EA0CxB,OACEE,EAACrC,EAAY,CACXsC,IAAKH,EAAMG,IAAG,cACc,SAAfH,EAAM5B,KAAe,aA3CjB,MACnB,GACO,aADCA,EAEJ,OAAO4B,EAAMI,WAyCHC,GAAc,UACjBJ,EACT9B,KAAM6B,EAAM7B,KACZmC,IAjBW,MACb,OAAQlC,GACN,IAAK,OACL,IAAK,QACH,OAAO4B,EAAMM,IACf,QACE,SAWGC,GACLnC,KAAM4B,EAAM5B,KACZoC,QAtCK,UADCpC,EAEG,WAGA,mBAIO,MAClB,OAAQA,GACN,IAAK,OACH,OAAO4B,EAAMS,KACf,IAAK,WACH,OAAOT,EAAMU,SACf,QACE,OAAO,OAyBRC"}

package/dist/components/atoms/Badge/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@mui/material/Chip"),a=require("@mui/material/styles");const r=(e,t)=>({neutral:{backgroundColor:t.palette.semantic.fill["fill-weak"],borderColor:t.palette.semantic.stroke["stroke-weak"],color:t.palette.semantic.text["text-strong"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-strong"]}},error:{backgroundColor:t.palette.semantic.fill["fill-error-weak"],borderColor:t.palette.semantic.stroke["stroke-error-weak"],color:t.palette.semantic.text["text-error"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-error"]}},warning:{backgroundColor:t.palette.semantic.fill["fill-warning-weak"],borderColor:t.palette.semantic.stroke["stroke-warning-weak"],color:t.palette.semantic.text["text-warning"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-warning"]}},success:{backgroundColor:t.palette.semantic.fill["fill-success-weak"],borderColor:t.palette.semantic.stroke["stroke-success-weak"],color:t.palette.semantic.text["text-success"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-success"]}},information:{backgroundColor:t.palette.semantic.fill["fill-information-weak"],borderColor:t.palette.semantic.stroke["stroke-information-weak"],color:t.palette.semantic.text["text-information"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-information"]}},brand:{backgroundColor:t.palette.semantic.fill["fill-primary-weak"],borderColor:t.palette.semantic.stroke["stroke-primary-weak"],color:t.palette.semantic.text["text-primary"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-primary"]}}}[e]),o=a.styled(t,{shouldForwardProp:e=>"tone"!==e})((({theme:e,tone:t})=>({...r(t,e)}))),i=({className:t,fdKey:a,icon:r,label:i,size:n="medium",tone:l="neutral"})=>e.jsx(o,{className:t,clickable:!1,"data-fd":a,"data-fd-variant":"badge",icon:r,label:i,size:n,tone:l});i.displayName="Badge",exports.BADGE_TONES=["neutral","error","warning","success","information","brand"],exports.Badge=i,exports.default=i;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@mui/material/Chip"),a=require("@mui/material/styles");const r=(e,t)=>({neutral:{backgroundColor:t.palette.semantic.fill["fill-weak"],borderColor:t.palette.semantic.stroke["stroke-weak"],color:t.palette.semantic.text["text-strong"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-strong"]}},error:{backgroundColor:t.palette.semantic.fill["fill-error-weak"],borderColor:t.palette.semantic.stroke["stroke-error-weak"],color:t.palette.semantic.text["text-error"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-error"]}},warning:{backgroundColor:t.palette.semantic.fill["fill-warning-weak"],borderColor:t.palette.semantic.stroke["stroke-warning-weak"],color:t.palette.semantic.text["text-warning"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-warning"]}},success:{backgroundColor:t.palette.semantic.fill["fill-success-weak"],borderColor:t.palette.semantic.stroke["stroke-success-weak"],color:t.palette.semantic.text["text-success"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-success"]}},information:{backgroundColor:t.palette.semantic.fill["fill-information-weak"],borderColor:t.palette.semantic.stroke["stroke-information-weak"],color:t.palette.semantic.text["text-information"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-information"]}},brand:{backgroundColor:t.palette.semantic.fill["fill-primary-weak"],borderColor:t.palette.semantic.stroke["stroke-primary-weak"],color:t.palette.semantic.text["text-primary"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-primary"]}}}[e]),o=a.styled(t,{shouldForwardProp:e=>"tone"!==e})(({theme:e,tone:t})=>({...r(t,e)})),i=({className:t,fdKey:a,icon:r,label:i,size:n="medium",tone:l="neutral"})=>e.jsx(o,{className:t,clickable:!1,"data-fd":a,"data-fd-variant":"badge",icon:r,label:i,size:n,tone:l});i.displayName="Badge",exports.BADGE_TONES=["neutral","error","warning","success","information","brand"],exports.Badge=i,exports.default=i;
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/atoms/Badge/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/Badge/index.tsx"],"sourcesContent":["import MuiChip, { type ChipProps as MuiChipProps } from '@mui/material/Chip';\nimport { styled, type Theme } from '@mui/material/styles';\n\n/** Available visual tones for the Badge component */\nexport const BADGE_TONES = ['neutral', 'error', 'warning', 'success', 'information', 'brand'] as const;\nexport type BadgeTone = (typeof BADGE_TONES)[number];\n\n/** Props for the Badge component */\nexport interface BadgeProps {\n  /** Additional CSS class names */\n  className?: string;\n  /** Test ID for testing and automation */\n  fdKey?: string;\n  /** Optional icon to display within the badge */\n  icon?: MuiChipProps['icon'];\n  /** Text label displayed in the badge */\n  label: string;\n  /** Visual tone/color of the badge */\n  tone?: BadgeTone;\n  /** Size of the badge */\n  size?: MuiChipProps['size'];\n}\n\ninterface StyledBadgeProps {\n  tone: BadgeTone;\n}\n\nconst getToneStyles = (\n  tone: BadgeTone,\n  theme: Theme,\n): {\n  backgroundColor: string;\n  borderColor: string;\n  color: string;\n} => {\n  const colorMap = {\n    neutral: {\n      backgroundColor: theme.palette.semantic.fill['fill-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-weak'],\n      color: theme.palette.semantic.text['text-strong'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-strong'],\n      },\n    },\n    error: {\n      backgroundColor: theme.palette.semantic.fill['fill-error-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-error-weak'],\n      color: theme.palette.semantic.text['text-error'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-error'],\n      },\n    },\n    warning: {\n      backgroundColor: theme.palette.semantic.fill['fill-warning-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-warning-weak'],\n      color: theme.palette.semantic.text['text-warning'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-warning'],\n      },\n    },\n    success: {\n      backgroundColor: theme.palette.semantic.fill['fill-success-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-success-weak'],\n      color: theme.palette.semantic.text['text-success'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-success'],\n      },\n    },\n    information: {\n      backgroundColor: theme.palette.semantic.fill['fill-information-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-information-weak'],\n      color: theme.palette.semantic.text['text-information'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-information'],\n      },\n    },\n    brand: {\n      backgroundColor: theme.palette.semantic.fill['fill-primary-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-primary-weak'],\n      color: theme.palette.semantic.text['text-primary'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-primary'],\n      },\n    },\n  } satisfies Record<BadgeTone, object>;\n\n  return colorMap[tone];\n};\n\nconst StyledBadge = styled(MuiChip, {\n  shouldForwardProp: (prop) => prop !== 'tone',\n})<StyledBadgeProps>(({ theme, tone }) => ({\n  ...getToneStyles(tone, theme),\n}));\n\n/**\n * Badge component is used to highlight and categorize information using short text labels.\n * It supports different visual tones to convey different semantic meanings and can include\n * an optional icon. It is a presentational component and should not be used as a button or link.\n */\nexport const Badge = ({\n  className,\n  fdKey,\n  icon,\n  label,\n  size = 'medium',\n  tone = 'neutral',\n}: BadgeProps): JSX.Element => (\n  <StyledBadge\n    className={className}\n    clickable={false}\n    data-fd={fdKey}\n    data-fd-variant=\"badge\"\n    icon={icon}\n    label={label}\n    size={size}\n    tone={tone}\n  />\n);\n\nBadge.displayName = 'Badge';\n\nexport default Badge;\n"],"names":["getToneStyles","tone","theme","neutral","backgroundColor","palette","semantic","fill","borderColor","stroke","color","text","icon","error","warning","success","information","brand","StyledBadge","styled","MuiChip","shouldForwardProp","prop","Badge","className","fdKey","label","size","_jsx","clickable","displayName"],"mappings":"yKAIO,MAuBDA,EAAgB,CACpBC,EACAC,KAMiB,CACfC,QAAS,CACPC,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,aAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,eAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,eACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,iBAGvCC,MAAO,CACLT,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,mBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,qBAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,cACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,gBAGvCE,QAAS,CACPV,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,qBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,uBAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,gBACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,kBAGvCG,QAAS,CACPX,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,qBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,uBAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,gBACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,kBAGvCI,YAAa,CACXZ,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,yBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,2BAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,oBACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,sBAGvCK,MAAO,CACLb,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,qBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,uBAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,gBACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,mBAKzBX,IAGZiB,EAAcC,EAAAA,OAAOC,EAAS,CAClCC,kBAAoBC,GAAkB,SAATA,GADXH,EAEC,EAAGjB,QAAOD,WAAM,IAChCD,EAAcC,EAAMC,OAQZqB,EAAQ,EACnBC,YACAC,QACAb,OACAc,QACAC,OAAO,SACP1B,OAAO,aAEP2B,EAAAA,IAACV,EAAW,CACVM,UAAWA,EACXK,WAAW,EAAK,UACPJ,EAAK,kBACE,QAChBb,KAAMA,EACNc,MAAOA,EACPC,KAAMA,EACN1B,KAAMA,IAIVsB,EAAMO,YAAc,4BApHO,CAAC,UAAW,QAAS,UAAW,UAAW,cAAe"}
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/Badge/index.tsx"],"sourcesContent":["import MuiChip, { type ChipProps as MuiChipProps } from '@mui/material/Chip';\nimport { styled, type Theme } from '@mui/material/styles';\n\n/** Available visual tones for the Badge component */\nexport const BADGE_TONES = ['neutral', 'error', 'warning', 'success', 'information', 'brand'] as const;\nexport type BadgeTone = (typeof BADGE_TONES)[number];\n\n/** Props for the Badge component */\nexport interface BadgeProps {\n  /** Additional CSS class names */\n  className?: string;\n  /** Test ID for testing and automation */\n  fdKey?: string;\n  /** Optional icon to display within the badge */\n  icon?: MuiChipProps['icon'];\n  /** Text label displayed in the badge */\n  label: string;\n  /** Visual tone/color of the badge */\n  tone?: BadgeTone;\n  /** Size of the badge */\n  size?: MuiChipProps['size'];\n}\n\ninterface StyledBadgeProps {\n  tone: BadgeTone;\n}\n\nconst getToneStyles = (\n  tone: BadgeTone,\n  theme: Theme,\n): {\n  backgroundColor: string;\n  borderColor: string;\n  color: string;\n} => {\n  const colorMap = {\n    neutral: {\n      backgroundColor: theme.palette.semantic.fill['fill-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-weak'],\n      color: theme.palette.semantic.text['text-strong'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-strong'],\n      },\n    },\n    error: {\n      backgroundColor: theme.palette.semantic.fill['fill-error-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-error-weak'],\n      color: theme.palette.semantic.text['text-error'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-error'],\n      },\n    },\n    warning: {\n      backgroundColor: theme.palette.semantic.fill['fill-warning-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-warning-weak'],\n      color: theme.palette.semantic.text['text-warning'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-warning'],\n      },\n    },\n    success: {\n      backgroundColor: theme.palette.semantic.fill['fill-success-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-success-weak'],\n      color: theme.palette.semantic.text['text-success'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-success'],\n      },\n    },\n    information: {\n      backgroundColor: theme.palette.semantic.fill['fill-information-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-information-weak'],\n      color: theme.palette.semantic.text['text-information'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-information'],\n      },\n    },\n    brand: {\n      backgroundColor: theme.palette.semantic.fill['fill-primary-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-primary-weak'],\n      color: theme.palette.semantic.text['text-primary'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-primary'],\n      },\n    },\n  } satisfies Record<BadgeTone, object>;\n\n  return colorMap[tone];\n};\n\nconst StyledBadge = styled(MuiChip, {\n  shouldForwardProp: (prop) => prop !== 'tone',\n})<StyledBadgeProps>(({ theme, tone }) => ({\n  ...getToneStyles(tone, theme),\n}));\n\n/**\n * Badge component is used to highlight and categorize information using short text labels.\n * It supports different visual tones to convey different semantic meanings and can include\n * an optional icon. It is a presentational component and should not be used as a button or link.\n */\nexport const Badge = ({\n  className,\n  fdKey,\n  icon,\n  label,\n  size = 'medium',\n  tone = 'neutral',\n}: BadgeProps): JSX.Element => (\n  <StyledBadge\n    className={className}\n    clickable={false}\n    data-fd={fdKey}\n    data-fd-variant=\"badge\"\n    icon={icon}\n    label={label}\n    size={size}\n    tone={tone}\n  />\n);\n\nBadge.displayName = 'Badge';\n\nexport default Badge;\n"],"names":["getToneStyles","tone","theme","neutral","backgroundColor","palette","semantic","fill","borderColor","stroke","color","text","icon","error","warning","success","information","brand","StyledBadge","styled","MuiChip","shouldForwardProp","prop","Badge","className","fdKey","label","size","_jsx","clickable","displayName"],"mappings":"yKAIO,MAuBDA,EAAgB,CACpBC,EACAC,KAMiB,CACfC,QAAS,CACPC,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,aAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,eAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,eACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,iBAGvCC,MAAO,CACLT,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,mBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,qBAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,cACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,gBAGvCE,QAAS,CACPV,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,qBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,uBAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,gBACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,kBAGvCG,QAAS,CACPX,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,qBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,uBAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,gBACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,kBAGvCI,YAAa,CACXZ,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,yBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,2BAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,oBACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,sBAGvCK,MAAO,CACLb,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,qBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,uBAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,gBACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,mBAKzBX,IAGZiB,EAAcC,EAAAA,OAAOC,EAAS,CAClCC,kBAAoBC,GAAkB,SAATA,GADXH,CAEC,EAAGjB,QAAOD,WAAM,IAChCD,EAAcC,EAAMC,MAQZqB,EAAQ,EACnBC,YACAC,QACAb,OACAc,QACAC,OAAO,SACP1B,OAAO,aAEP2B,EAAAA,IAACV,EAAW,CACVM,UAAWA,EACXK,WAAW,EAAK,UACPJ,EAAK,kBACE,QAChBb,KAAMA,EACNc,MAAOA,EACPC,KAAMA,EACN1B,KAAMA,IAIVsB,EAAMO,YAAc,4BApHO,CAAC,UAAW,QAAS,UAAW,UAAW,cAAe"}

package/dist/components/atoms/Badge/index.js

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import t from"@mui/material/Chip";import{styled as a}from"@mui/material/styles";const o=["neutral","error","warning","success","information","brand"],r=(e,t)=>({neutral:{backgroundColor:t.palette.semantic.fill["fill-weak"],borderColor:t.palette.semantic.stroke["stroke-weak"],color:t.palette.semantic.text["text-strong"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-strong"]}},error:{backgroundColor:t.palette.semantic.fill["fill-error-weak"],borderColor:t.palette.semantic.stroke["stroke-error-weak"],color:t.palette.semantic.text["text-error"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-error"]}},warning:{backgroundColor:t.palette.semantic.fill["fill-warning-weak"],borderColor:t.palette.semantic.stroke["stroke-warning-weak"],color:t.palette.semantic.text["text-warning"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-warning"]}},success:{backgroundColor:t.palette.semantic.fill["fill-success-weak"],borderColor:t.palette.semantic.stroke["stroke-success-weak"],color:t.palette.semantic.text["text-success"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-success"]}},information:{backgroundColor:t.palette.semantic.fill["fill-information-weak"],borderColor:t.palette.semantic.stroke["stroke-information-weak"],color:t.palette.semantic.text["text-information"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-information"]}},brand:{backgroundColor:t.palette.semantic.fill["fill-primary-weak"],borderColor:t.palette.semantic.stroke["stroke-primary-weak"],color:t.palette.semantic.text["text-primary"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-primary"]}}}[e]),i=a(t,{shouldForwardProp:e=>"tone"!==e})((({theme:e,tone:t})=>({...r(t,e)}))),n=({className:t,fdKey:a,icon:o,label:r,size:n="medium",tone:l="neutral"})=>e(i,{className:t,clickable:!1,"data-fd":a,"data-fd-variant":"badge",icon:o,label:r,size:n,tone:l});n.displayName="Badge";export{o as BADGE_TONES,n as Badge,n as default};
+import{jsx as e}from"react/jsx-runtime";import t from"@mui/material/Chip";import{styled as a}from"@mui/material/styles";const o=["neutral","error","warning","success","information","brand"],r=(e,t)=>({neutral:{backgroundColor:t.palette.semantic.fill["fill-weak"],borderColor:t.palette.semantic.stroke["stroke-weak"],color:t.palette.semantic.text["text-strong"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-strong"]}},error:{backgroundColor:t.palette.semantic.fill["fill-error-weak"],borderColor:t.palette.semantic.stroke["stroke-error-weak"],color:t.palette.semantic.text["text-error"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-error"]}},warning:{backgroundColor:t.palette.semantic.fill["fill-warning-weak"],borderColor:t.palette.semantic.stroke["stroke-warning-weak"],color:t.palette.semantic.text["text-warning"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-warning"]}},success:{backgroundColor:t.palette.semantic.fill["fill-success-weak"],borderColor:t.palette.semantic.stroke["stroke-success-weak"],color:t.palette.semantic.text["text-success"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-success"]}},information:{backgroundColor:t.palette.semantic.fill["fill-information-weak"],borderColor:t.palette.semantic.stroke["stroke-information-weak"],color:t.palette.semantic.text["text-information"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-information"]}},brand:{backgroundColor:t.palette.semantic.fill["fill-primary-weak"],borderColor:t.palette.semantic.stroke["stroke-primary-weak"],color:t.palette.semantic.text["text-primary"],'&[data-fd-variant="badge"] .MuiChip-icon':{color:t.palette.semantic.icon["icon-primary"]}}}[e]),i=a(t,{shouldForwardProp:e=>"tone"!==e})(({theme:e,tone:t})=>({...r(t,e)})),n=({className:t,fdKey:a,icon:o,label:r,size:n="medium",tone:l="neutral"})=>e(i,{className:t,clickable:!1,"data-fd":a,"data-fd-variant":"badge",icon:o,label:r,size:n,tone:l});n.displayName="Badge";export{o as BADGE_TONES,n as Badge,n as default};
 //# sourceMappingURL=index.js.map

package/dist/components/atoms/Badge/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/Badge/index.tsx"],"sourcesContent":["import MuiChip, { type ChipProps as MuiChipProps } from '@mui/material/Chip';\nimport { styled, type Theme } from '@mui/material/styles';\n\n/** Available visual tones for the Badge component */\nexport const BADGE_TONES = ['neutral', 'error', 'warning', 'success', 'information', 'brand'] as const;\nexport type BadgeTone = (typeof BADGE_TONES)[number];\n\n/** Props for the Badge component */\nexport interface BadgeProps {\n  /** Additional CSS class names */\n  className?: string;\n  /** Test ID for testing and automation */\n  fdKey?: string;\n  /** Optional icon to display within the badge */\n  icon?: MuiChipProps['icon'];\n  /** Text label displayed in the badge */\n  label: string;\n  /** Visual tone/color of the badge */\n  tone?: BadgeTone;\n  /** Size of the badge */\n  size?: MuiChipProps['size'];\n}\n\ninterface StyledBadgeProps {\n  tone: BadgeTone;\n}\n\nconst getToneStyles = (\n  tone: BadgeTone,\n  theme: Theme,\n): {\n  backgroundColor: string;\n  borderColor: string;\n  color: string;\n} => {\n  const colorMap = {\n    neutral: {\n      backgroundColor: theme.palette.semantic.fill['fill-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-weak'],\n      color: theme.palette.semantic.text['text-strong'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-strong'],\n      },\n    },\n    error: {\n      backgroundColor: theme.palette.semantic.fill['fill-error-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-error-weak'],\n      color: theme.palette.semantic.text['text-error'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-error'],\n      },\n    },\n    warning: {\n      backgroundColor: theme.palette.semantic.fill['fill-warning-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-warning-weak'],\n      color: theme.palette.semantic.text['text-warning'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-warning'],\n      },\n    },\n    success: {\n      backgroundColor: theme.palette.semantic.fill['fill-success-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-success-weak'],\n      color: theme.palette.semantic.text['text-success'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-success'],\n      },\n    },\n    information: {\n      backgroundColor: theme.palette.semantic.fill['fill-information-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-information-weak'],\n      color: theme.palette.semantic.text['text-information'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-information'],\n      },\n    },\n    brand: {\n      backgroundColor: theme.palette.semantic.fill['fill-primary-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-primary-weak'],\n      color: theme.palette.semantic.text['text-primary'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-primary'],\n      },\n    },\n  } satisfies Record<BadgeTone, object>;\n\n  return colorMap[tone];\n};\n\nconst StyledBadge = styled(MuiChip, {\n  shouldForwardProp: (prop) => prop !== 'tone',\n})<StyledBadgeProps>(({ theme, tone }) => ({\n  ...getToneStyles(tone, theme),\n}));\n\n/**\n * Badge component is used to highlight and categorize information using short text labels.\n * It supports different visual tones to convey different semantic meanings and can include\n * an optional icon. It is a presentational component and should not be used as a button or link.\n */\nexport const Badge = ({\n  className,\n  fdKey,\n  icon,\n  label,\n  size = 'medium',\n  tone = 'neutral',\n}: BadgeProps): JSX.Element => (\n  <StyledBadge\n    className={className}\n    clickable={false}\n    data-fd={fdKey}\n    data-fd-variant=\"badge\"\n    icon={icon}\n    label={label}\n    size={size}\n    tone={tone}\n  />\n);\n\nBadge.displayName = 'Badge';\n\nexport default Badge;\n"],"names":["BADGE_TONES","getToneStyles","tone","theme","neutral","backgroundColor","palette","semantic","fill","borderColor","stroke","color","text","icon","error","warning","success","information","brand","StyledBadge","styled","MuiChip","shouldForwardProp","prop","Badge","className","fdKey","label","size","_jsx","clickable","displayName"],"mappings":"wHAIO,MAAMA,EAAc,CAAC,UAAW,QAAS,UAAW,UAAW,cAAe,SAuB/EC,EAAgB,CACpBC,EACAC,KAMiB,CACfC,QAAS,CACPC,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,aAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,eAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,eACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,iBAGvCC,MAAO,CACLT,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,mBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,qBAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,cACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,gBAGvCE,QAAS,CACPV,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,qBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,uBAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,gBACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,kBAGvCG,QAAS,CACPX,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,qBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,uBAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,gBACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,kBAGvCI,YAAa,CACXZ,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,yBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,2BAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,oBACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,sBAGvCK,MAAO,CACLb,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,qBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,uBAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,gBACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,mBAKzBX,IAGZiB,EAAcC,EAAOC,EAAS,CAClCC,kBAAoBC,GAAkB,SAATA,GADXH,EAEC,EAAGjB,QAAOD,WAAM,IAChCD,EAAcC,EAAMC,OAQZqB,EAAQ,EACnBC,YACAC,QACAb,OACAc,QACAC,OAAO,SACP1B,OAAO,aAEP2B,EAACV,EAAW,CACVM,UAAWA,EACXK,WAAW,EAAK,UACPJ,EAAK,kBACE,QAChBb,KAAMA,EACNc,MAAOA,EACPC,KAAMA,EACN1B,KAAMA,IAIVsB,EAAMO,YAAc"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/Badge/index.tsx"],"sourcesContent":["import MuiChip, { type ChipProps as MuiChipProps } from '@mui/material/Chip';\nimport { styled, type Theme } from '@mui/material/styles';\n\n/** Available visual tones for the Badge component */\nexport const BADGE_TONES = ['neutral', 'error', 'warning', 'success', 'information', 'brand'] as const;\nexport type BadgeTone = (typeof BADGE_TONES)[number];\n\n/** Props for the Badge component */\nexport interface BadgeProps {\n  /** Additional CSS class names */\n  className?: string;\n  /** Test ID for testing and automation */\n  fdKey?: string;\n  /** Optional icon to display within the badge */\n  icon?: MuiChipProps['icon'];\n  /** Text label displayed in the badge */\n  label: string;\n  /** Visual tone/color of the badge */\n  tone?: BadgeTone;\n  /** Size of the badge */\n  size?: MuiChipProps['size'];\n}\n\ninterface StyledBadgeProps {\n  tone: BadgeTone;\n}\n\nconst getToneStyles = (\n  tone: BadgeTone,\n  theme: Theme,\n): {\n  backgroundColor: string;\n  borderColor: string;\n  color: string;\n} => {\n  const colorMap = {\n    neutral: {\n      backgroundColor: theme.palette.semantic.fill['fill-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-weak'],\n      color: theme.palette.semantic.text['text-strong'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-strong'],\n      },\n    },\n    error: {\n      backgroundColor: theme.palette.semantic.fill['fill-error-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-error-weak'],\n      color: theme.palette.semantic.text['text-error'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-error'],\n      },\n    },\n    warning: {\n      backgroundColor: theme.palette.semantic.fill['fill-warning-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-warning-weak'],\n      color: theme.palette.semantic.text['text-warning'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-warning'],\n      },\n    },\n    success: {\n      backgroundColor: theme.palette.semantic.fill['fill-success-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-success-weak'],\n      color: theme.palette.semantic.text['text-success'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-success'],\n      },\n    },\n    information: {\n      backgroundColor: theme.palette.semantic.fill['fill-information-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-information-weak'],\n      color: theme.palette.semantic.text['text-information'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-information'],\n      },\n    },\n    brand: {\n      backgroundColor: theme.palette.semantic.fill['fill-primary-weak'],\n      borderColor: theme.palette.semantic.stroke['stroke-primary-weak'],\n      color: theme.palette.semantic.text['text-primary'],\n      '&[data-fd-variant=\"badge\"] .MuiChip-icon': {\n        color: theme.palette.semantic.icon['icon-primary'],\n      },\n    },\n  } satisfies Record<BadgeTone, object>;\n\n  return colorMap[tone];\n};\n\nconst StyledBadge = styled(MuiChip, {\n  shouldForwardProp: (prop) => prop !== 'tone',\n})<StyledBadgeProps>(({ theme, tone }) => ({\n  ...getToneStyles(tone, theme),\n}));\n\n/**\n * Badge component is used to highlight and categorize information using short text labels.\n * It supports different visual tones to convey different semantic meanings and can include\n * an optional icon. It is a presentational component and should not be used as a button or link.\n */\nexport const Badge = ({\n  className,\n  fdKey,\n  icon,\n  label,\n  size = 'medium',\n  tone = 'neutral',\n}: BadgeProps): JSX.Element => (\n  <StyledBadge\n    className={className}\n    clickable={false}\n    data-fd={fdKey}\n    data-fd-variant=\"badge\"\n    icon={icon}\n    label={label}\n    size={size}\n    tone={tone}\n  />\n);\n\nBadge.displayName = 'Badge';\n\nexport default Badge;\n"],"names":["BADGE_TONES","getToneStyles","tone","theme","neutral","backgroundColor","palette","semantic","fill","borderColor","stroke","color","text","icon","error","warning","success","information","brand","StyledBadge","styled","MuiChip","shouldForwardProp","prop","Badge","className","fdKey","label","size","_jsx","clickable","displayName"],"mappings":"wHAIO,MAAMA,EAAc,CAAC,UAAW,QAAS,UAAW,UAAW,cAAe,SAuB/EC,EAAgB,CACpBC,EACAC,KAMiB,CACfC,QAAS,CACPC,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,aAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,eAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,eACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,iBAGvCC,MAAO,CACLT,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,mBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,qBAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,cACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,gBAGvCE,QAAS,CACPV,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,qBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,uBAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,gBACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,kBAGvCG,QAAS,CACPX,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,qBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,uBAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,gBACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,kBAGvCI,YAAa,CACXZ,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,yBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,2BAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,oBACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,sBAGvCK,MAAO,CACLb,gBAAiBF,EAAMG,QAAQC,SAASC,KAAK,qBAC7CC,YAAaN,EAAMG,QAAQC,SAASG,OAAO,uBAC3CC,MAAOR,EAAMG,QAAQC,SAASK,KAAK,gBACnC,2CAA4C,CAC1CD,MAAOR,EAAMG,QAAQC,SAASM,KAAK,mBAKzBX,IAGZiB,EAAcC,EAAOC,EAAS,CAClCC,kBAAoBC,GAAkB,SAATA,GADXH,CAEC,EAAGjB,QAAOD,WAAM,IAChCD,EAAcC,EAAMC,MAQZqB,EAAQ,EACnBC,YACAC,QACAb,OACAc,QACAC,OAAO,SACP1B,OAAO,aAEP2B,EAACV,EAAW,CACVM,UAAWA,EACXK,WAAW,EAAK,UACPJ,EAAK,kBACE,QAChBb,KAAMA,EACNc,MAAOA,EACPC,KAAMA,EACN1B,KAAMA,IAIVsB,EAAMO,YAAc"}

package/dist/components/atoms/BadgeCount/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@mui/material/styles"),r=require("@mui/material/Typography");const s=t.styled("span")((({theme:e,emphasis:t="strong"})=>({minWidth:24,maxWidth:"fit-content",height:24,borderRadius:16,background:"strong"===t?e.palette.semantic.fill["fill-error-strong"]:e.palette.semantic.fill["fill-error-weak"],border:"strong"===t?"none":`1px solid ${e.palette.semantic.stroke["stroke-error-weak"]}`,color:"strong"===t?e.palette.semantic.text["text-inverse-strong"]:e.palette.semantic.text["text-error"],display:"flex",alignItems:"center",justifyContent:"center",padding:"0 8px",boxSizing:"border-box",pointerEvents:"none"}))),i=({children:t,className:i,emphasis:a="strong",fdKey:n})=>e.jsx(s,{className:i,"data-fd":n,emphasis:a,children:e.jsx(r,{variant:"caption",children:t})});exports.BadgeCount=i,exports.default=i;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@mui/material/styles"),r=require("@mui/material/Typography");const s=t.styled("span")(({theme:e,emphasis:t="strong"})=>({minWidth:24,maxWidth:"fit-content",height:24,borderRadius:16,background:"strong"===t?e.palette.semantic.fill["fill-error-strong"]:e.palette.semantic.fill["fill-error-weak"],border:"strong"===t?"none":`1px solid ${e.palette.semantic.stroke["stroke-error-weak"]}`,color:"strong"===t?e.palette.semantic.text["text-inverse-strong"]:e.palette.semantic.text["text-error"],display:"flex",alignItems:"center",justifyContent:"center",padding:"0 8px",boxSizing:"border-box",pointerEvents:"none"})),i=({children:t,className:i,emphasis:a="strong",fdKey:n})=>e.jsx(s,{className:i,"data-fd":n,emphasis:a,children:e.jsx(r,{variant:"caption",children:t})});exports.BadgeCount=i,exports.default=i;
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/atoms/BadgeCount/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/BadgeCount/index.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\n\nimport Typography from '../Typography';\n\nexport interface BadgeCountProps {\n  children?: React.ReactNode;\n  className?: string;\n  emphasis?: 'strong' | 'weak';\n  fdKey?: string;\n}\n\nconst StyledCount = styled('span')<BadgeCountProps>(({ theme, emphasis = 'strong' }) => ({\n  minWidth: 24,\n  maxWidth: 'fit-content',\n  height: 24,\n  borderRadius: 16,\n  background:\n    emphasis === 'strong'\n      ? theme.palette.semantic.fill['fill-error-strong']\n      : theme.palette.semantic.fill['fill-error-weak'],\n  border: emphasis === 'strong' ? 'none' : `1px solid ${theme.palette.semantic.stroke['stroke-error-weak']}`,\n  color:\n    emphasis === 'strong'\n      ? theme.palette.semantic.text['text-inverse-strong']\n      : theme.palette.semantic.text['text-error'],\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  padding: '0 8px',\n  boxSizing: 'border-box',\n  pointerEvents: 'none',\n}));\n\nexport const BadgeCount: React.FC<BadgeCountProps> = ({\n  children,\n  className,\n  emphasis = 'strong',\n  fdKey,\n}) => (\n  <StyledCount className={className} data-fd={fdKey} emphasis={emphasis}>\n    <Typography variant=\"caption\">{children}</Typography>\n  </StyledCount>\n);\n\nexport default BadgeCount;\n"],"names":["StyledCount","styled","theme","emphasis","minWidth","maxWidth","height","borderRadius","background","palette","semantic","fill","border","stroke","color","text","display","alignItems","justifyContent","padding","boxSizing","pointerEvents","BadgeCount","children","className","fdKey","_jsx","Typography","variant"],"mappings":"+KAWA,MAAMA,EAAcC,EAAAA,OAAO,OAAPA,EAAgC,EAAGC,QAAOC,WAAW,aAAU,CACjFC,SAAU,GACVC,SAAU,cACVC,OAAQ,GACRC,aAAc,GACdC,WACe,WAAbL,EACID,EAAMO,QAAQC,SAASC,KAAK,qBAC5BT,EAAMO,QAAQC,SAASC,KAAK,mBAClCC,OAAqB,WAAbT,EAAwB,OAAS,aAAaD,EAAMO,QAAQC,SAASG,OAAO,uBACpFC,MACe,WAAbX,EACID,EAAMO,QAAQC,SAASK,KAAK,uBAC5Bb,EAAMO,QAAQC,SAASK,KAAK,cAClCC,QAAS,OACTC,WAAY,SACZC,eAAgB,SAChBC,QAAS,QACTC,UAAW,aACXC,cAAe,WAGJC,EAAwC,EACnDC,WACAC,YACArB,WAAW,SACXsB,WAEAC,EAAAA,IAAC1B,GAAYwB,UAAWA,EAAS,UAAWC,EAAOtB,SAAUA,EAAQoB,SACnEG,EAAAA,IAACC,EAAU,CAACC,QAAQ,UAASL,SAAEA"}
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/BadgeCount/index.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\n\nimport Typography from '../Typography';\n\nexport interface BadgeCountProps {\n  children?: React.ReactNode;\n  className?: string;\n  emphasis?: 'strong' | 'weak';\n  fdKey?: string;\n}\n\nconst StyledCount = styled('span')<BadgeCountProps>(({ theme, emphasis = 'strong' }) => ({\n  minWidth: 24,\n  maxWidth: 'fit-content',\n  height: 24,\n  borderRadius: 16,\n  background:\n    emphasis === 'strong'\n      ? theme.palette.semantic.fill['fill-error-strong']\n      : theme.palette.semantic.fill['fill-error-weak'],\n  border: emphasis === 'strong' ? 'none' : `1px solid ${theme.palette.semantic.stroke['stroke-error-weak']}`,\n  color:\n    emphasis === 'strong'\n      ? theme.palette.semantic.text['text-inverse-strong']\n      : theme.palette.semantic.text['text-error'],\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  padding: '0 8px',\n  boxSizing: 'border-box',\n  pointerEvents: 'none',\n}));\n\nexport const BadgeCount: React.FC<BadgeCountProps> = ({\n  children,\n  className,\n  emphasis = 'strong',\n  fdKey,\n}) => (\n  <StyledCount className={className} data-fd={fdKey} emphasis={emphasis}>\n    <Typography variant=\"caption\">{children}</Typography>\n  </StyledCount>\n);\n\nexport default BadgeCount;\n"],"names":["StyledCount","styled","theme","emphasis","minWidth","maxWidth","height","borderRadius","background","palette","semantic","fill","border","stroke","color","text","display","alignItems","justifyContent","padding","boxSizing","pointerEvents","BadgeCount","children","className","fdKey","_jsx","Typography","variant"],"mappings":"+KAWA,MAAMA,EAAcC,EAAAA,OAAO,OAAPA,CAAgC,EAAGC,QAAOC,WAAW,aAAU,CACjFC,SAAU,GACVC,SAAU,cACVC,OAAQ,GACRC,aAAc,GACdC,WACe,WAAbL,EACID,EAAMO,QAAQC,SAASC,KAAK,qBAC5BT,EAAMO,QAAQC,SAASC,KAAK,mBAClCC,OAAqB,WAAbT,EAAwB,OAAS,aAAaD,EAAMO,QAAQC,SAASG,OAAO,uBACpFC,MACe,WAAbX,EACID,EAAMO,QAAQC,SAASK,KAAK,uBAC5Bb,EAAMO,QAAQC,SAASK,KAAK,cAClCC,QAAS,OACTC,WAAY,SACZC,eAAgB,SAChBC,QAAS,QACTC,UAAW,aACXC,cAAe,UAGJC,EAAwC,EACnDC,WACAC,YACArB,WAAW,SACXsB,WAEAC,EAAAA,IAAC1B,GAAYwB,UAAWA,EAAS,UAAWC,EAAOtB,SAAUA,EAAQoB,SACnEG,EAAAA,IAACC,EAAU,CAACC,QAAQ,UAASL,SAAEA"}

package/dist/components/atoms/BadgeCount/index.js

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import{styled as t}from"@mui/material/styles";import r from"@mui/material/Typography";const i=t("span")((({theme:e,emphasis:t="strong"})=>({minWidth:24,maxWidth:"fit-content",height:24,borderRadius:16,background:"strong"===t?e.palette.semantic.fill["fill-error-strong"]:e.palette.semantic.fill["fill-error-weak"],border:"strong"===t?"none":`1px solid ${e.palette.semantic.stroke["stroke-error-weak"]}`,color:"strong"===t?e.palette.semantic.text["text-inverse-strong"]:e.palette.semantic.text["text-error"],display:"flex",alignItems:"center",justifyContent:"center",padding:"0 8px",boxSizing:"border-box",pointerEvents:"none"}))),a=({children:t,className:a,emphasis:n="strong",fdKey:o})=>e(i,{className:a,"data-fd":o,emphasis:n,children:e(r,{variant:"caption",children:t})});export{a as BadgeCount,a as default};
+import{jsx as e}from"react/jsx-runtime";import{styled as t}from"@mui/material/styles";import r from"@mui/material/Typography";const i=t("span")(({theme:e,emphasis:t="strong"})=>({minWidth:24,maxWidth:"fit-content",height:24,borderRadius:16,background:"strong"===t?e.palette.semantic.fill["fill-error-strong"]:e.palette.semantic.fill["fill-error-weak"],border:"strong"===t?"none":`1px solid ${e.palette.semantic.stroke["stroke-error-weak"]}`,color:"strong"===t?e.palette.semantic.text["text-inverse-strong"]:e.palette.semantic.text["text-error"],display:"flex",alignItems:"center",justifyContent:"center",padding:"0 8px",boxSizing:"border-box",pointerEvents:"none"})),a=({children:t,className:a,emphasis:n="strong",fdKey:o})=>e(i,{className:a,"data-fd":o,emphasis:n,children:e(r,{variant:"caption",children:t})});export{a as BadgeCount,a as default};
 //# sourceMappingURL=index.js.map

package/dist/components/atoms/BadgeCount/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/BadgeCount/index.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\n\nimport Typography from '../Typography';\n\nexport interface BadgeCountProps {\n  children?: React.ReactNode;\n  className?: string;\n  emphasis?: 'strong' | 'weak';\n  fdKey?: string;\n}\n\nconst StyledCount = styled('span')<BadgeCountProps>(({ theme, emphasis = 'strong' }) => ({\n  minWidth: 24,\n  maxWidth: 'fit-content',\n  height: 24,\n  borderRadius: 16,\n  background:\n    emphasis === 'strong'\n      ? theme.palette.semantic.fill['fill-error-strong']\n      : theme.palette.semantic.fill['fill-error-weak'],\n  border: emphasis === 'strong' ? 'none' : `1px solid ${theme.palette.semantic.stroke['stroke-error-weak']}`,\n  color:\n    emphasis === 'strong'\n      ? theme.palette.semantic.text['text-inverse-strong']\n      : theme.palette.semantic.text['text-error'],\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  padding: '0 8px',\n  boxSizing: 'border-box',\n  pointerEvents: 'none',\n}));\n\nexport const BadgeCount: React.FC<BadgeCountProps> = ({\n  children,\n  className,\n  emphasis = 'strong',\n  fdKey,\n}) => (\n  <StyledCount className={className} data-fd={fdKey} emphasis={emphasis}>\n    <Typography variant=\"caption\">{children}</Typography>\n  </StyledCount>\n);\n\nexport default BadgeCount;\n"],"names":["StyledCount","styled","theme","emphasis","minWidth","maxWidth","height","borderRadius","background","palette","semantic","fill","border","stroke","color","text","display","alignItems","justifyContent","padding","boxSizing","pointerEvents","BadgeCount","children","className","fdKey","_jsx","Typography","variant"],"mappings":"8HAWA,MAAMA,EAAcC,EAAO,OAAPA,EAAgC,EAAGC,QAAOC,WAAW,aAAU,CACjFC,SAAU,GACVC,SAAU,cACVC,OAAQ,GACRC,aAAc,GACdC,WACe,WAAbL,EACID,EAAMO,QAAQC,SAASC,KAAK,qBAC5BT,EAAMO,QAAQC,SAASC,KAAK,mBAClCC,OAAqB,WAAbT,EAAwB,OAAS,aAAaD,EAAMO,QAAQC,SAASG,OAAO,uBACpFC,MACe,WAAbX,EACID,EAAMO,QAAQC,SAASK,KAAK,uBAC5Bb,EAAMO,QAAQC,SAASK,KAAK,cAClCC,QAAS,OACTC,WAAY,SACZC,eAAgB,SAChBC,QAAS,QACTC,UAAW,aACXC,cAAe,WAGJC,EAAwC,EACnDC,WACAC,YACArB,WAAW,SACXsB,WAEAC,EAAC1B,GAAYwB,UAAWA,EAAS,UAAWC,EAAOtB,SAAUA,EAAQoB,SACnEG,EAACC,EAAU,CAACC,QAAQ,UAASL,SAAEA"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/BadgeCount/index.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\n\nimport Typography from '../Typography';\n\nexport interface BadgeCountProps {\n  children?: React.ReactNode;\n  className?: string;\n  emphasis?: 'strong' | 'weak';\n  fdKey?: string;\n}\n\nconst StyledCount = styled('span')<BadgeCountProps>(({ theme, emphasis = 'strong' }) => ({\n  minWidth: 24,\n  maxWidth: 'fit-content',\n  height: 24,\n  borderRadius: 16,\n  background:\n    emphasis === 'strong'\n      ? theme.palette.semantic.fill['fill-error-strong']\n      : theme.palette.semantic.fill['fill-error-weak'],\n  border: emphasis === 'strong' ? 'none' : `1px solid ${theme.palette.semantic.stroke['stroke-error-weak']}`,\n  color:\n    emphasis === 'strong'\n      ? theme.palette.semantic.text['text-inverse-strong']\n      : theme.palette.semantic.text['text-error'],\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  padding: '0 8px',\n  boxSizing: 'border-box',\n  pointerEvents: 'none',\n}));\n\nexport const BadgeCount: React.FC<BadgeCountProps> = ({\n  children,\n  className,\n  emphasis = 'strong',\n  fdKey,\n}) => (\n  <StyledCount className={className} data-fd={fdKey} emphasis={emphasis}>\n    <Typography variant=\"caption\">{children}</Typography>\n  </StyledCount>\n);\n\nexport default BadgeCount;\n"],"names":["StyledCount","styled","theme","emphasis","minWidth","maxWidth","height","borderRadius","background","palette","semantic","fill","border","stroke","color","text","display","alignItems","justifyContent","padding","boxSizing","pointerEvents","BadgeCount","children","className","fdKey","_jsx","Typography","variant"],"mappings":"8HAWA,MAAMA,EAAcC,EAAO,OAAPA,CAAgC,EAAGC,QAAOC,WAAW,aAAU,CACjFC,SAAU,GACVC,SAAU,cACVC,OAAQ,GACRC,aAAc,GACdC,WACe,WAAbL,EACID,EAAMO,QAAQC,SAASC,KAAK,qBAC5BT,EAAMO,QAAQC,SAASC,KAAK,mBAClCC,OAAqB,WAAbT,EAAwB,OAAS,aAAaD,EAAMO,QAAQC,SAASG,OAAO,uBACpFC,MACe,WAAbX,EACID,EAAMO,QAAQC,SAASK,KAAK,uBAC5Bb,EAAMO,QAAQC,SAASK,KAAK,cAClCC,QAAS,OACTC,WAAY,SACZC,eAAgB,SAChBC,QAAS,QACTC,UAAW,aACXC,cAAe,UAGJC,EAAwC,EACnDC,WACAC,YACArB,WAAW,SACXsB,WAEAC,EAAC1B,GAAYwB,UAAWA,EAAS,UAAWC,EAAOtB,SAAUA,EAAQoB,SACnEG,EAACC,EAAU,CAACC,QAAQ,UAASL,SAAEA"}

package/dist/components/atoms/BadgeDot/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");const s=require("@mui/material/styles").styled("span")((({theme:e,size:s="small"})=>{let t=8;return"medium"===s&&(t=12),"large"===s&&(t=16),{display:"inline-block",width:t,height:t,borderRadius:"50%",background:e.palette.semantic.fill["fill-error-strong"],pointerEvents:"none"}})),t=({className:t,fdKey:r,size:a="small"})=>e.jsx(s,{className:t,"data-fd":r,size:a});exports.BadgeDot=t,exports.default=t;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");const s=require("@mui/material/styles").styled("span")(({theme:e,size:s="small"})=>{let t=8;return"medium"===s&&(t=12),"large"===s&&(t=16),{display:"inline-block",width:t,height:t,borderRadius:"50%",background:e.palette.semantic.fill["fill-error-strong"],pointerEvents:"none"}}),t=({className:t,fdKey:r,size:a="small"})=>e.jsx(s,{className:t,"data-fd":r,size:a});exports.BadgeDot=t,exports.default=t;
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/atoms/BadgeDot/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/BadgeDot/index.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\n\nexport interface BadgeDotProps {\n  className?: string;\n  fdKey?: string;\n  size?: 'large' | 'medium' | 'small';\n}\n\nconst StyledDot = styled('span')<BadgeDotProps>(({ theme, size = 'small' }) => {\n  let dimension = 8;\n  if (size === 'medium') dimension = 12;\n  if (size === 'large') dimension = 16;\n  return {\n    display: 'inline-block',\n    width: dimension,\n    height: dimension,\n    borderRadius: '50%',\n    background: theme.palette.semantic.fill['fill-error-strong'],\n    pointerEvents: 'none',\n  };\n});\n\nexport const BadgeDot: React.FC<BadgeDotProps> = ({ className, fdKey, size = 'small' }) => (\n  <StyledDot className={className} data-fd={fdKey} size={size} />\n);\n\nexport default BadgeDot;\n"],"names":["StyledDot","styled","theme","size","dimension","display","width","height","borderRadius","background","palette","semantic","fill","pointerEvents","BadgeDot","className","fdKey","_jsx"],"mappings":"uGAQA,MAAMA,kCAAYC,OAAO,OAAPA,EAA8B,EAAGC,QAAOC,OAAO,YAC/D,IAAIC,EAAY,EAGhB,MAFa,WAATD,IAAmBC,EAAY,IACtB,UAATD,IAAkBC,EAAY,IAC3B,CACLC,QAAS,eACTC,MAAOF,EACPG,OAAQH,EACRI,aAAc,MACdC,WAAYP,EAAMQ,QAAQC,SAASC,KAAK,qBACxCC,cAAe,WAINC,EAAoC,EAAGC,YAAWC,QAAOb,OAAO,WAC3Ec,EAAAA,IAACjB,EAAS,CAACe,UAAWA,EAAS,UAAWC,EAAOb,KAAMA"}
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/BadgeDot/index.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\n\nexport interface BadgeDotProps {\n  className?: string;\n  fdKey?: string;\n  size?: 'large' | 'medium' | 'small';\n}\n\nconst StyledDot = styled('span')<BadgeDotProps>(({ theme, size = 'small' }) => {\n  let dimension = 8;\n  if (size === 'medium') dimension = 12;\n  if (size === 'large') dimension = 16;\n  return {\n    display: 'inline-block',\n    width: dimension,\n    height: dimension,\n    borderRadius: '50%',\n    background: theme.palette.semantic.fill['fill-error-strong'],\n    pointerEvents: 'none',\n  };\n});\n\nexport const BadgeDot: React.FC<BadgeDotProps> = ({ className, fdKey, size = 'small' }) => (\n  <StyledDot className={className} data-fd={fdKey} size={size} />\n);\n\nexport default BadgeDot;\n"],"names":["StyledDot","styled","theme","size","dimension","display","width","height","borderRadius","background","palette","semantic","fill","pointerEvents","BadgeDot","className","fdKey","_jsx"],"mappings":"uGAQA,MAAMA,kCAAYC,OAAO,OAAPA,CAA8B,EAAGC,QAAOC,OAAO,YAC/D,IAAIC,EAAY,EAGhB,MAFa,WAATD,IAAmBC,EAAY,IACtB,UAATD,IAAkBC,EAAY,IAC3B,CACLC,QAAS,eACTC,MAAOF,EACPG,OAAQH,EACRI,aAAc,MACdC,WAAYP,EAAMQ,QAAQC,SAASC,KAAK,qBACxCC,cAAe,UAINC,EAAoC,EAAGC,YAAWC,QAAOb,OAAO,WAC3Ec,EAAAA,IAACjB,EAAS,CAACe,UAAWA,EAAS,UAAWC,EAAOb,KAAMA"}

package/dist/components/atoms/BadgeDot/index.js

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import{styled as t}from"@mui/material/styles";const a=t("span")((({theme:e,size:t="small"})=>{let a=8;return"medium"===t&&(a=12),"large"===t&&(a=16),{display:"inline-block",width:a,height:a,borderRadius:"50%",background:e.palette.semantic.fill["fill-error-strong"],pointerEvents:"none"}})),s=({className:t,fdKey:s,size:i="small"})=>e(a,{className:t,"data-fd":s,size:i});export{s as BadgeDot,s as default};
+import{jsx as e}from"react/jsx-runtime";import{styled as t}from"@mui/material/styles";const a=t("span")(({theme:e,size:t="small"})=>{let a=8;return"medium"===t&&(a=12),"large"===t&&(a=16),{display:"inline-block",width:a,height:a,borderRadius:"50%",background:e.palette.semantic.fill["fill-error-strong"],pointerEvents:"none"}}),s=({className:t,fdKey:s,size:i="small"})=>e(a,{className:t,"data-fd":s,size:i});export{s as BadgeDot,s as default};
 //# sourceMappingURL=index.js.map

package/dist/components/atoms/BadgeDot/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/BadgeDot/index.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\n\nexport interface BadgeDotProps {\n  className?: string;\n  fdKey?: string;\n  size?: 'large' | 'medium' | 'small';\n}\n\nconst StyledDot = styled('span')<BadgeDotProps>(({ theme, size = 'small' }) => {\n  let dimension = 8;\n  if (size === 'medium') dimension = 12;\n  if (size === 'large') dimension = 16;\n  return {\n    display: 'inline-block',\n    width: dimension,\n    height: dimension,\n    borderRadius: '50%',\n    background: theme.palette.semantic.fill['fill-error-strong'],\n    pointerEvents: 'none',\n  };\n});\n\nexport const BadgeDot: React.FC<BadgeDotProps> = ({ className, fdKey, size = 'small' }) => (\n  <StyledDot className={className} data-fd={fdKey} size={size} />\n);\n\nexport default BadgeDot;\n"],"names":["StyledDot","styled","theme","size","dimension","display","width","height","borderRadius","background","palette","semantic","fill","pointerEvents","BadgeDot","className","fdKey","_jsx"],"mappings":"sFAQA,MAAMA,EAAYC,EAAO,OAAPA,EAA8B,EAAGC,QAAOC,OAAO,YAC/D,IAAIC,EAAY,EAGhB,MAFa,WAATD,IAAmBC,EAAY,IACtB,UAATD,IAAkBC,EAAY,IAC3B,CACLC,QAAS,eACTC,MAAOF,EACPG,OAAQH,EACRI,aAAc,MACdC,WAAYP,EAAMQ,QAAQC,SAASC,KAAK,qBACxCC,cAAe,WAINC,EAAoC,EAAGC,YAAWC,QAAOb,OAAO,WAC3Ec,EAACjB,EAAS,CAACe,UAAWA,EAAS,UAAWC,EAAOb,KAAMA"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/BadgeDot/index.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\n\nexport interface BadgeDotProps {\n  className?: string;\n  fdKey?: string;\n  size?: 'large' | 'medium' | 'small';\n}\n\nconst StyledDot = styled('span')<BadgeDotProps>(({ theme, size = 'small' }) => {\n  let dimension = 8;\n  if (size === 'medium') dimension = 12;\n  if (size === 'large') dimension = 16;\n  return {\n    display: 'inline-block',\n    width: dimension,\n    height: dimension,\n    borderRadius: '50%',\n    background: theme.palette.semantic.fill['fill-error-strong'],\n    pointerEvents: 'none',\n  };\n});\n\nexport const BadgeDot: React.FC<BadgeDotProps> = ({ className, fdKey, size = 'small' }) => (\n  <StyledDot className={className} data-fd={fdKey} size={size} />\n);\n\nexport default BadgeDot;\n"],"names":["StyledDot","styled","theme","size","dimension","display","width","height","borderRadius","background","palette","semantic","fill","pointerEvents","BadgeDot","className","fdKey","_jsx"],"mappings":"sFAQA,MAAMA,EAAYC,EAAO,OAAPA,CAA8B,EAAGC,QAAOC,OAAO,YAC/D,IAAIC,EAAY,EAGhB,MAFa,WAATD,IAAmBC,EAAY,IACtB,UAATD,IAAkBC,EAAY,IAC3B,CACLC,QAAS,eACTC,MAAOF,EACPG,OAAQH,EACRI,aAAc,MACdC,WAAYP,EAAMQ,QAAQC,SAASC,KAAK,qBACxCC,cAAe,UAINC,EAAoC,EAAGC,YAAWC,QAAOb,OAAO,WAC3Ec,EAACjB,EAAS,CAACe,UAAWA,EAAS,UAAWC,EAAOb,KAAMA"}

package/dist/components/atoms/BreadCrumbs/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("react"),r=require("@mui/material/Breadcrumbs"),a=require("@mui/material/styles"),i=require("@mui/material/useMediaQuery"),l=require("../Link/index.cjs.js"),n=require("../../../icons/ArrowLeft02/index.cjs.js"),s=require("../../../themes/typography.cjs.js");const o=a.styled(r)((({theme:e})=>({"& .MuiBreadcrumbs-separator":{color:e.palette.semantic.text["text-weak"],marginLeft:e.spacing(1),marginRight:e.spacing(1)}}))),u=a.styled("button")((({theme:e})=>({display:"inline-flex",alignItems:"center",background:"none",border:"none",color:e.palette.semantic.text["text-weak"],cursor:"pointer",padding:e.spacing(.5),borderRadius:e.radius?.["radius-4"]||"4px",transition:"background-color 0.2s ease-in-out",fontFamily:s.typography.b1Weak.fontFamily,fontSize:s.typography.b1Weak.fontSize,lineHeight:s.typography.b1Weak.lineHeight,fontWeight:s.typography.b1Weak.fontWeight,letterSpacing:s.typography.b1Weak.letterSpacing,"&:hover":{backgroundColor:e.palette.semantic.fill["fill-hover"]},"&:focus-visible":{outline:`2px solid ${e.palette.semantic.stroke["stroke-focus"]}`,outlineOffset:"2px"}}))),p=a.styled("span")((({theme:e})=>({fontSize:s.typography.b1Weak.fontSize,lineHeight:s.typography.b1Weak.lineHeight,color:e.palette.semantic.text["text-weak"],fontWeight:s.typography.b1Weak.fontWeight,fontFamily:s.typography.b1Weak.fontFamily,letterSpacing:s.typography.b1Weak.letterSpacing}))),c=t.memo((({ariaLabel:r,ariaLabelEllipsis:s,className:c,fdKey:h,items:d,type:b="default"})=>{const[f,g]=t.useState(!1),y=a.useTheme(),m=i(y.breakpoints.down("tablet"));if(!d?.length)return null;const k=[];if(("collapsed"===b||"default"===b&&m)&&d.length>2&&!f){const t=d[0],r=d[d.length-1];if(!t||!r)return null;k.push(e.jsx(l.Link,{fdKey:`breadcrumb-${t.label}`,href:t.href,iconLeft:e.jsx(n,{size:"sm"}),size:"body",tone:"Neutral Weak",underline:!1,weight:"regular",children:t.label},`first-${t.label}-${t.href||""}`)),k.push(e.jsx(u,{"aria-label":s??void 0,onClick:()=>g(!0),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),g(!0))},type:"button",children:"..."},"ellipsis")),k.push(e.jsx(p,{"aria-current":"page",children:r.label},`current-${r.label}-${r.href||""}`))}else{const t=d.map(((t,r)=>{const a=0===r;return r===d.length-1?e.jsx(p,{"aria-current":"page",children:t.label},`current-${t.label}-${t.href||""}`):a?e.jsx(l.Link,{fdKey:`breadcrumb-${t.label}`,href:t.href,iconLeft:e.jsx(n,{size:"sm"}),size:"body",tone:"Neutral Weak",underline:!1,weight:"regular",children:t.label},`first-${t.label}-${t.href||""}`):e.jsx(l.Link,{fdKey:`breadcrumb-${t.label}`,href:t.href,size:"body",tone:"Neutral Weak",underline:!1,weight:"regular",children:t.label},`middle-${t.label}-${t.href||""}`)}));k.push(...t)}return e.jsx(o,{"aria-label":r??void 0,className:c,"data-fd":h,separator:"/",children:k})}));c.displayName="BreadCrumbs",module.exports=c;
+"use strict";var e=require("react/jsx-runtime"),t=require("react"),r=require("@mui/material/Breadcrumbs"),a=require("@mui/material/styles"),i=require("@mui/material/useMediaQuery"),l=require("../Link/index.cjs.js"),n=require("../../../icons/ArrowLeft02/index.cjs.js"),s=require("../../../themes/typography.cjs.js");const o=a.styled(r)(({theme:e})=>({"& .MuiBreadcrumbs-separator":{color:e.palette.semantic.text["text-weak"],marginLeft:e.spacing(1),marginRight:e.spacing(1)}})),u=a.styled("button")(({theme:e})=>({display:"inline-flex",alignItems:"center",background:"none",border:"none",color:e.palette.semantic.text["text-weak"],cursor:"pointer",padding:e.spacing(.5),borderRadius:e.radius?.["radius-4"]||"4px",transition:"background-color 0.2s ease-in-out",fontFamily:s.typography.b1Weak.fontFamily,fontSize:s.typography.b1Weak.fontSize,lineHeight:s.typography.b1Weak.lineHeight,fontWeight:s.typography.b1Weak.fontWeight,letterSpacing:s.typography.b1Weak.letterSpacing,"&:hover":{backgroundColor:e.palette.semantic.fill["fill-hover"]},"&:focus-visible":{outline:`2px solid ${e.palette.semantic.stroke["stroke-focus"]}`,outlineOffset:"2px"}})),p=a.styled("span")(({theme:e})=>({fontSize:s.typography.b1Weak.fontSize,lineHeight:s.typography.b1Weak.lineHeight,color:e.palette.semantic.text["text-weak"],fontWeight:s.typography.b1Weak.fontWeight,fontFamily:s.typography.b1Weak.fontFamily,letterSpacing:s.typography.b1Weak.letterSpacing})),c=t.memo(({ariaLabel:r,ariaLabelEllipsis:s,className:c,fdKey:h,items:d,type:b="default"})=>{const[f,g]=t.useState(!1),y=a.useTheme(),m=i(y.breakpoints.down("tablet"));if(!d?.length)return null;const k=[];if(("collapsed"===b||"default"===b&&m)&&d.length>2&&!f){const t=d[0],r=d[d.length-1];if(!t||!r)return null;k.push(e.jsx(l.Link,{fdKey:`breadcrumb-${t.label}`,href:t.href,iconLeft:e.jsx(n,{size:"sm"}),size:"body",tone:"Neutral Weak",underline:!1,weight:"regular",children:t.label},`first-${t.label}-${t.href||""}`)),k.push(e.jsx(u,{"aria-label":s??void 0,onClick:()=>g(!0),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),g(!0))},type:"button",children:"..."},"ellipsis")),k.push(e.jsx(p,{"aria-current":"page",children:r.label},`current-${r.label}-${r.href||""}`))}else{const t=d.map((t,r)=>{const a=0===r;return r===d.length-1?e.jsx(p,{"aria-current":"page",children:t.label},`current-${t.label}-${t.href||""}`):a?e.jsx(l.Link,{fdKey:`breadcrumb-${t.label}`,href:t.href,iconLeft:e.jsx(n,{size:"sm"}),size:"body",tone:"Neutral Weak",underline:!1,weight:"regular",children:t.label},`first-${t.label}-${t.href||""}`):e.jsx(l.Link,{fdKey:`breadcrumb-${t.label}`,href:t.href,size:"body",tone:"Neutral Weak",underline:!1,weight:"regular",children:t.label},`middle-${t.label}-${t.href||""}`)});k.push(...t)}return e.jsx(o,{"aria-label":r??void 0,className:c,"data-fd":h,separator:"/",children:k})});c.displayName="BreadCrumbs",module.exports=c;
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/atoms/BreadCrumbs/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/BreadCrumbs/index.tsx"],"sourcesContent":["import { memo, useState } from 'react';\n\nimport BreadcrumbsMUI from '@mui/material/Breadcrumbs';\nimport { styled, useTheme } from '@mui/material/styles';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n\nimport Link from '@fd/components/atoms/Link';\nimport ArrowLeft02Icon from '@fd/icons/ArrowLeft02';\nimport { typography } from '@fd/themes/typography';\n\nexport interface BreadcrumbItem {\n  label: string;\n  href?: string;\n}\n\nexport type BreadCrumbsType = 'collapsed' | 'default';\n\nexport interface BreadCrumbsProps {\n  ariaLabel?: string;\n  ariaLabelEllipsis?: string;\n  className?: string;\n  fdKey?: string;\n  items: BreadcrumbItem[];\n  type?: BreadCrumbsType;\n}\n\nconst StyledBreadcrumbs = styled(BreadcrumbsMUI)(({ theme }) => ({\n  '& .MuiBreadcrumbs-separator': {\n    color: theme.palette.semantic.text['text-weak'],\n    marginLeft: theme.spacing(1),\n    marginRight: theme.spacing(1),\n  },\n}));\n\nconst StyledEllipsisButton = styled('button')(({ theme }) => ({\n  display: 'inline-flex',\n  alignItems: 'center',\n  background: 'none',\n  border: 'none',\n  color: theme.palette.semantic.text['text-weak'],\n  cursor: 'pointer',\n  padding: theme.spacing(0.5),\n  borderRadius: theme.radius?.['radius-4'] || '4px',\n  transition: 'background-color 0.2s ease-in-out',\n  fontFamily: typography.b1Weak.fontFamily,\n  fontSize: typography.b1Weak.fontSize,\n  lineHeight: typography.b1Weak.lineHeight,\n  fontWeight: typography.b1Weak.fontWeight,\n  letterSpacing: typography.b1Weak.letterSpacing,\n\n  '&:hover': {\n    backgroundColor: theme.palette.semantic.fill['fill-hover'],\n  },\n\n  '&:focus-visible': {\n    outline: `2px solid ${theme.palette.semantic.stroke['stroke-focus']}`,\n    outlineOffset: '2px',\n  },\n}));\n\nconst StyledCurrentPage = styled('span')(({ theme }) => ({\n  fontSize: typography.b1Weak.fontSize,\n  lineHeight: typography.b1Weak.lineHeight,\n  color: theme.palette.semantic.text['text-weak'],\n  fontWeight: typography.b1Weak.fontWeight,\n  fontFamily: typography.b1Weak.fontFamily,\n  letterSpacing: typography.b1Weak.letterSpacing,\n}));\n\nconst BreadCrumbs = memo(\n  ({ ariaLabel, ariaLabelEllipsis, className, fdKey, items, type = 'default' }: BreadCrumbsProps) => {\n    const [isExpanded, setIsExpanded] = useState(false);\n    const theme = useTheme();\n    const isSmallScreen = useMediaQuery(theme.breakpoints.down('tablet'));\n\n    if (!items?.length) {\n      return null;\n    }\n\n    const shouldCollapse =\n      (type === 'collapsed' || (type === 'default' && isSmallScreen)) && items.length > 2 && !isExpanded;\n\n    // Build breadcrumb items array\n    const breadcrumbItems: React.ReactNode[] = [];\n\n    if (shouldCollapse) {\n      const firstItem = items[0];\n      const lastItem = items[items.length - 1];\n      if (!firstItem || !lastItem) {\n        return null;\n      }\n      // First item\n      breadcrumbItems.push(\n        <Link\n          key={`first-${firstItem.label}-${firstItem.href || ''}`}\n          fdKey={`breadcrumb-${firstItem.label}`}\n          href={firstItem.href}\n          iconLeft={<ArrowLeft02Icon size=\"sm\" />}\n          size=\"body\"\n          tone=\"Neutral Weak\"\n          underline={false}\n          weight=\"regular\"\n        >\n          {firstItem.label}\n        </Link>,\n      );\n\n      // Ellipsis\n      breadcrumbItems.push(\n        <StyledEllipsisButton\n          key=\"ellipsis\"\n          aria-label={ariaLabelEllipsis ?? undefined}\n          onClick={() => setIsExpanded(true)}\n          onKeyDown={(e) => {\n            if (e.key === 'Enter' || e.key === ' ') {\n              e.preventDefault();\n              setIsExpanded(true);\n            }\n          }}\n          type=\"button\"\n        >\n          ...\n        </StyledEllipsisButton>,\n      );\n\n      // Last item\n      breadcrumbItems.push(\n        <StyledCurrentPage key={`current-${lastItem.label}-${lastItem.href || ''}`} aria-current=\"page\">\n          {lastItem.label}\n        </StyledCurrentPage>,\n      );\n    } else {\n      // Default/expanded mode: show all items\n      const allItems = items.map((item, index) => {\n        const isFirst = index === 0;\n        const isLast = index === items.length - 1;\n\n        if (isLast) {\n          return (\n            <StyledCurrentPage key={`current-${item.label}-${item.href || ''}`} aria-current=\"page\">\n              {item.label}\n            </StyledCurrentPage>\n          );\n        }\n        if (isFirst) {\n          return (\n            <Link\n              key={`first-${item.label}-${item.href || ''}`}\n              fdKey={`breadcrumb-${item.label}`}\n              href={item.href}\n              iconLeft={<ArrowLeft02Icon size=\"sm\" />}\n              size=\"body\"\n              tone=\"Neutral Weak\"\n              underline={false}\n              weight=\"regular\"\n            >\n              {item.label}\n            </Link>\n          );\n        }\n        return (\n          <Link\n            key={`middle-${item.label}-${item.href || ''}`}\n            fdKey={`breadcrumb-${item.label}`}\n            href={item.href}\n            size=\"body\"\n            tone=\"Neutral Weak\"\n            underline={false}\n            weight=\"regular\"\n          >\n            {item.label}\n          </Link>\n        );\n      });\n      breadcrumbItems.push(...allItems);\n    }\n\n    return (\n      <StyledBreadcrumbs\n        aria-label={ariaLabel ?? undefined}\n        className={className}\n        data-fd={fdKey}\n        separator=\"/\"\n      >\n        {breadcrumbItems}\n      </StyledBreadcrumbs>\n    );\n  },\n);\n\nBreadCrumbs.displayName = 'BreadCrumbs';\n\nexport default BreadCrumbs;\n"],"names":["StyledBreadcrumbs","styled","BreadcrumbsMUI","theme","color","palette","semantic","text","marginLeft","spacing","marginRight","StyledEllipsisButton","display","alignItems","background","border","cursor","padding","borderRadius","radius","transition","fontFamily","typography","b1Weak","fontSize","lineHeight","fontWeight","letterSpacing","backgroundColor","fill","outline","stroke","outlineOffset","StyledCurrentPage","BreadCrumbs","memo","ariaLabel","ariaLabelEllipsis","className","fdKey","items","type","isExpanded","setIsExpanded","useState","useTheme","isSmallScreen","useMediaQuery","breakpoints","down","length","breadcrumbItems","firstItem","lastItem","push","_jsx","Link","label","href","iconLeft","ArrowLeft02Icon","size","tone","underline","weight","undefined","onClick","onKeyDown","e","key","preventDefault","children","allItems","map","item","index","isFirst","separator","displayName"],"mappings":"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"}
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/BreadCrumbs/index.tsx"],"sourcesContent":["import { memo, useState } from 'react';\n\nimport BreadcrumbsMUI from '@mui/material/Breadcrumbs';\nimport { styled, useTheme } from '@mui/material/styles';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n\nimport Link from '@fd/components/atoms/Link';\nimport ArrowLeft02Icon from '@fd/icons/ArrowLeft02';\nimport { typography } from '@fd/themes/typography';\n\nexport interface BreadcrumbItem {\n  label: string;\n  href?: string;\n}\n\nexport type BreadCrumbsType = 'collapsed' | 'default';\n\nexport interface BreadCrumbsProps {\n  ariaLabel?: string;\n  ariaLabelEllipsis?: string;\n  className?: string;\n  fdKey?: string;\n  items: BreadcrumbItem[];\n  type?: BreadCrumbsType;\n}\n\nconst StyledBreadcrumbs = styled(BreadcrumbsMUI)(({ theme }) => ({\n  '& .MuiBreadcrumbs-separator': {\n    color: theme.palette.semantic.text['text-weak'],\n    marginLeft: theme.spacing(1),\n    marginRight: theme.spacing(1),\n  },\n}));\n\nconst StyledEllipsisButton = styled('button')(({ theme }) => ({\n  display: 'inline-flex',\n  alignItems: 'center',\n  background: 'none',\n  border: 'none',\n  color: theme.palette.semantic.text['text-weak'],\n  cursor: 'pointer',\n  padding: theme.spacing(0.5),\n  borderRadius: theme.radius?.['radius-4'] || '4px',\n  transition: 'background-color 0.2s ease-in-out',\n  fontFamily: typography.b1Weak.fontFamily,\n  fontSize: typography.b1Weak.fontSize,\n  lineHeight: typography.b1Weak.lineHeight,\n  fontWeight: typography.b1Weak.fontWeight,\n  letterSpacing: typography.b1Weak.letterSpacing,\n\n  '&:hover': {\n    backgroundColor: theme.palette.semantic.fill['fill-hover'],\n  },\n\n  '&:focus-visible': {\n    outline: `2px solid ${theme.palette.semantic.stroke['stroke-focus']}`,\n    outlineOffset: '2px',\n  },\n}));\n\nconst StyledCurrentPage = styled('span')(({ theme }) => ({\n  fontSize: typography.b1Weak.fontSize,\n  lineHeight: typography.b1Weak.lineHeight,\n  color: theme.palette.semantic.text['text-weak'],\n  fontWeight: typography.b1Weak.fontWeight,\n  fontFamily: typography.b1Weak.fontFamily,\n  letterSpacing: typography.b1Weak.letterSpacing,\n}));\n\nconst BreadCrumbs = memo(\n  ({ ariaLabel, ariaLabelEllipsis, className, fdKey, items, type = 'default' }: BreadCrumbsProps) => {\n    const [isExpanded, setIsExpanded] = useState(false);\n    const theme = useTheme();\n    const isSmallScreen = useMediaQuery(theme.breakpoints.down('tablet'));\n\n    if (!items?.length) {\n      return null;\n    }\n\n    const shouldCollapse =\n      (type === 'collapsed' || (type === 'default' && isSmallScreen)) && items.length > 2 && !isExpanded;\n\n    // Build breadcrumb items array\n    const breadcrumbItems: React.ReactNode[] = [];\n\n    if (shouldCollapse) {\n      const firstItem = items[0];\n      const lastItem = items[items.length - 1];\n      if (!firstItem || !lastItem) {\n        return null;\n      }\n      // First item\n      breadcrumbItems.push(\n        <Link\n          key={`first-${firstItem.label}-${firstItem.href || ''}`}\n          fdKey={`breadcrumb-${firstItem.label}`}\n          href={firstItem.href}\n          iconLeft={<ArrowLeft02Icon size=\"sm\" />}\n          size=\"body\"\n          tone=\"Neutral Weak\"\n          underline={false}\n          weight=\"regular\"\n        >\n          {firstItem.label}\n        </Link>,\n      );\n\n      // Ellipsis\n      breadcrumbItems.push(\n        <StyledEllipsisButton\n          key=\"ellipsis\"\n          aria-label={ariaLabelEllipsis ?? undefined}\n          onClick={() => setIsExpanded(true)}\n          onKeyDown={(e) => {\n            if (e.key === 'Enter' || e.key === ' ') {\n              e.preventDefault();\n              setIsExpanded(true);\n            }\n          }}\n          type=\"button\"\n        >\n          ...\n        </StyledEllipsisButton>,\n      );\n\n      // Last item\n      breadcrumbItems.push(\n        <StyledCurrentPage key={`current-${lastItem.label}-${lastItem.href || ''}`} aria-current=\"page\">\n          {lastItem.label}\n        </StyledCurrentPage>,\n      );\n    } else {\n      // Default/expanded mode: show all items\n      const allItems = items.map((item, index) => {\n        const isFirst = index === 0;\n        const isLast = index === items.length - 1;\n\n        if (isLast) {\n          return (\n            <StyledCurrentPage key={`current-${item.label}-${item.href || ''}`} aria-current=\"page\">\n              {item.label}\n            </StyledCurrentPage>\n          );\n        }\n        if (isFirst) {\n          return (\n            <Link\n              key={`first-${item.label}-${item.href || ''}`}\n              fdKey={`breadcrumb-${item.label}`}\n              href={item.href}\n              iconLeft={<ArrowLeft02Icon size=\"sm\" />}\n              size=\"body\"\n              tone=\"Neutral Weak\"\n              underline={false}\n              weight=\"regular\"\n            >\n              {item.label}\n            </Link>\n          );\n        }\n        return (\n          <Link\n            key={`middle-${item.label}-${item.href || ''}`}\n            fdKey={`breadcrumb-${item.label}`}\n            href={item.href}\n            size=\"body\"\n            tone=\"Neutral Weak\"\n            underline={false}\n            weight=\"regular\"\n          >\n            {item.label}\n          </Link>\n        );\n      });\n      breadcrumbItems.push(...allItems);\n    }\n\n    return (\n      <StyledBreadcrumbs\n        aria-label={ariaLabel ?? undefined}\n        className={className}\n        data-fd={fdKey}\n        separator=\"/\"\n      >\n        {breadcrumbItems}\n      </StyledBreadcrumbs>\n    );\n  },\n);\n\nBreadCrumbs.displayName = 'BreadCrumbs';\n\nexport default BreadCrumbs;\n"],"names":["StyledBreadcrumbs","styled","BreadcrumbsMUI","theme","color","palette","semantic","text","marginLeft","spacing","marginRight","StyledEllipsisButton","display","alignItems","background","border","cursor","padding","borderRadius","radius","transition","fontFamily","typography","b1Weak","fontSize","lineHeight","fontWeight","letterSpacing","backgroundColor","fill","outline","stroke","outlineOffset","StyledCurrentPage","BreadCrumbs","memo","ariaLabel","ariaLabelEllipsis","className","fdKey","items","type","isExpanded","setIsExpanded","useState","useTheme","isSmallScreen","useMediaQuery","breakpoints","down","length","breadcrumbItems","firstItem","lastItem","push","_jsx","Link","label","href","iconLeft","ArrowLeft02Icon","size","tone","underline","weight","undefined","onClick","onKeyDown","e","key","preventDefault","children","allItems","map","item","index","isFirst","separator","displayName"],"mappings":"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"}

package/dist/components/atoms/BreadCrumbs/index.js

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import{memo as t,useState as r}from"react";import a from"@mui/material/Breadcrumbs";import{styled as i,useTheme as l}from"@mui/material/styles";import n from"@mui/material/useMediaQuery";import{Link as o}from"../Link/index.js";import s from"../../../icons/ArrowLeft02/index.js";import{typography as f}from"../../../themes/typography.js";const c=i(a)((({theme:e})=>({"& .MuiBreadcrumbs-separator":{color:e.palette.semantic.text["text-weak"],marginLeft:e.spacing(1),marginRight:e.spacing(1)}}))),u=i("button")((({theme:e})=>({display:"inline-flex",alignItems:"center",background:"none",border:"none",color:e.palette.semantic.text["text-weak"],cursor:"pointer",padding:e.spacing(.5),borderRadius:e.radius?.["radius-4"]||"4px",transition:"background-color 0.2s ease-in-out",fontFamily:f.b1Weak.fontFamily,fontSize:f.b1Weak.fontSize,lineHeight:f.b1Weak.lineHeight,fontWeight:f.b1Weak.fontWeight,letterSpacing:f.b1Weak.letterSpacing,"&:hover":{backgroundColor:e.palette.semantic.fill["fill-hover"]},"&:focus-visible":{outline:`2px solid ${e.palette.semantic.stroke["stroke-focus"]}`,outlineOffset:"2px"}}))),m=i("span")((({theme:e})=>({fontSize:f.b1Weak.fontSize,lineHeight:f.b1Weak.lineHeight,color:e.palette.semantic.text["text-weak"],fontWeight:f.b1Weak.fontWeight,fontFamily:f.b1Weak.fontFamily,letterSpacing:f.b1Weak.letterSpacing}))),d=t((({ariaLabel:t,ariaLabelEllipsis:a,className:i,fdKey:f,items:d,type:b="default"})=>{const[p,h]=r(!1),g=l(),k=n(g.breakpoints.down("tablet"));if(!d?.length)return null;const y=[];if(("collapsed"===b||"default"===b&&k)&&d.length>2&&!p){const t=d[0],r=d[d.length-1];if(!t||!r)return null;y.push(e(o,{fdKey:`breadcrumb-${t.label}`,href:t.href,iconLeft:e(s,{size:"sm"}),size:"body",tone:"Neutral Weak",underline:!1,weight:"regular",children:t.label},`first-${t.label}-${t.href||""}`)),y.push(e(u,{"aria-label":a??void 0,onClick:()=>h(!0),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),h(!0))},type:"button",children:"..."},"ellipsis")),y.push(e(m,{"aria-current":"page",children:r.label},`current-${r.label}-${r.href||""}`))}else{const t=d.map(((t,r)=>{const a=0===r;return r===d.length-1?e(m,{"aria-current":"page",children:t.label},`current-${t.label}-${t.href||""}`):a?e(o,{fdKey:`breadcrumb-${t.label}`,href:t.href,iconLeft:e(s,{size:"sm"}),size:"body",tone:"Neutral Weak",underline:!1,weight:"regular",children:t.label},`first-${t.label}-${t.href||""}`):e(o,{fdKey:`breadcrumb-${t.label}`,href:t.href,size:"body",tone:"Neutral Weak",underline:!1,weight:"regular",children:t.label},`middle-${t.label}-${t.href||""}`)}));y.push(...t)}return e(c,{"aria-label":t??void 0,className:i,"data-fd":f,separator:"/",children:y})}));d.displayName="BreadCrumbs";export{d as default};
+import{jsx as e}from"react/jsx-runtime";import{memo as t,useState as r}from"react";import a from"@mui/material/Breadcrumbs";import{styled as i,useTheme as l}from"@mui/material/styles";import n from"@mui/material/useMediaQuery";import{Link as o}from"../Link/index.js";import s from"../../../icons/ArrowLeft02/index.js";import{typography as f}from"../../../themes/typography.js";const c=i(a)(({theme:e})=>({"& .MuiBreadcrumbs-separator":{color:e.palette.semantic.text["text-weak"],marginLeft:e.spacing(1),marginRight:e.spacing(1)}})),u=i("button")(({theme:e})=>({display:"inline-flex",alignItems:"center",background:"none",border:"none",color:e.palette.semantic.text["text-weak"],cursor:"pointer",padding:e.spacing(.5),borderRadius:e.radius?.["radius-4"]||"4px",transition:"background-color 0.2s ease-in-out",fontFamily:f.b1Weak.fontFamily,fontSize:f.b1Weak.fontSize,lineHeight:f.b1Weak.lineHeight,fontWeight:f.b1Weak.fontWeight,letterSpacing:f.b1Weak.letterSpacing,"&:hover":{backgroundColor:e.palette.semantic.fill["fill-hover"]},"&:focus-visible":{outline:`2px solid ${e.palette.semantic.stroke["stroke-focus"]}`,outlineOffset:"2px"}})),m=i("span")(({theme:e})=>({fontSize:f.b1Weak.fontSize,lineHeight:f.b1Weak.lineHeight,color:e.palette.semantic.text["text-weak"],fontWeight:f.b1Weak.fontWeight,fontFamily:f.b1Weak.fontFamily,letterSpacing:f.b1Weak.letterSpacing})),d=t(({ariaLabel:t,ariaLabelEllipsis:a,className:i,fdKey:f,items:d,type:b="default"})=>{const[p,h]=r(!1),g=l(),k=n(g.breakpoints.down("tablet"));if(!d?.length)return null;const y=[];if(("collapsed"===b||"default"===b&&k)&&d.length>2&&!p){const t=d[0],r=d[d.length-1];if(!t||!r)return null;y.push(e(o,{fdKey:`breadcrumb-${t.label}`,href:t.href,iconLeft:e(s,{size:"sm"}),size:"body",tone:"Neutral Weak",underline:!1,weight:"regular",children:t.label},`first-${t.label}-${t.href||""}`)),y.push(e(u,{"aria-label":a??void 0,onClick:()=>h(!0),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),h(!0))},type:"button",children:"..."},"ellipsis")),y.push(e(m,{"aria-current":"page",children:r.label},`current-${r.label}-${r.href||""}`))}else{const t=d.map((t,r)=>{const a=0===r;return r===d.length-1?e(m,{"aria-current":"page",children:t.label},`current-${t.label}-${t.href||""}`):a?e(o,{fdKey:`breadcrumb-${t.label}`,href:t.href,iconLeft:e(s,{size:"sm"}),size:"body",tone:"Neutral Weak",underline:!1,weight:"regular",children:t.label},`first-${t.label}-${t.href||""}`):e(o,{fdKey:`breadcrumb-${t.label}`,href:t.href,size:"body",tone:"Neutral Weak",underline:!1,weight:"regular",children:t.label},`middle-${t.label}-${t.href||""}`)});y.push(...t)}return e(c,{"aria-label":t??void 0,className:i,"data-fd":f,separator:"/",children:y})});d.displayName="BreadCrumbs";export{d as default};
 //# sourceMappingURL=index.js.map

package/dist/components/atoms/BreadCrumbs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/BreadCrumbs/index.tsx"],"sourcesContent":["import { memo, useState } from 'react';\n\nimport BreadcrumbsMUI from '@mui/material/Breadcrumbs';\nimport { styled, useTheme } from '@mui/material/styles';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n\nimport Link from '@fd/components/atoms/Link';\nimport ArrowLeft02Icon from '@fd/icons/ArrowLeft02';\nimport { typography } from '@fd/themes/typography';\n\nexport interface BreadcrumbItem {\n  label: string;\n  href?: string;\n}\n\nexport type BreadCrumbsType = 'collapsed' | 'default';\n\nexport interface BreadCrumbsProps {\n  ariaLabel?: string;\n  ariaLabelEllipsis?: string;\n  className?: string;\n  fdKey?: string;\n  items: BreadcrumbItem[];\n  type?: BreadCrumbsType;\n}\n\nconst StyledBreadcrumbs = styled(BreadcrumbsMUI)(({ theme }) => ({\n  '& .MuiBreadcrumbs-separator': {\n    color: theme.palette.semantic.text['text-weak'],\n    marginLeft: theme.spacing(1),\n    marginRight: theme.spacing(1),\n  },\n}));\n\nconst StyledEllipsisButton = styled('button')(({ theme }) => ({\n  display: 'inline-flex',\n  alignItems: 'center',\n  background: 'none',\n  border: 'none',\n  color: theme.palette.semantic.text['text-weak'],\n  cursor: 'pointer',\n  padding: theme.spacing(0.5),\n  borderRadius: theme.radius?.['radius-4'] || '4px',\n  transition: 'background-color 0.2s ease-in-out',\n  fontFamily: typography.b1Weak.fontFamily,\n  fontSize: typography.b1Weak.fontSize,\n  lineHeight: typography.b1Weak.lineHeight,\n  fontWeight: typography.b1Weak.fontWeight,\n  letterSpacing: typography.b1Weak.letterSpacing,\n\n  '&:hover': {\n    backgroundColor: theme.palette.semantic.fill['fill-hover'],\n  },\n\n  '&:focus-visible': {\n    outline: `2px solid ${theme.palette.semantic.stroke['stroke-focus']}`,\n    outlineOffset: '2px',\n  },\n}));\n\nconst StyledCurrentPage = styled('span')(({ theme }) => ({\n  fontSize: typography.b1Weak.fontSize,\n  lineHeight: typography.b1Weak.lineHeight,\n  color: theme.palette.semantic.text['text-weak'],\n  fontWeight: typography.b1Weak.fontWeight,\n  fontFamily: typography.b1Weak.fontFamily,\n  letterSpacing: typography.b1Weak.letterSpacing,\n}));\n\nconst BreadCrumbs = memo(\n  ({ ariaLabel, ariaLabelEllipsis, className, fdKey, items, type = 'default' }: BreadCrumbsProps) => {\n    const [isExpanded, setIsExpanded] = useState(false);\n    const theme = useTheme();\n    const isSmallScreen = useMediaQuery(theme.breakpoints.down('tablet'));\n\n    if (!items?.length) {\n      return null;\n    }\n\n    const shouldCollapse =\n      (type === 'collapsed' || (type === 'default' && isSmallScreen)) && items.length > 2 && !isExpanded;\n\n    // Build breadcrumb items array\n    const breadcrumbItems: React.ReactNode[] = [];\n\n    if (shouldCollapse) {\n      const firstItem = items[0];\n      const lastItem = items[items.length - 1];\n      if (!firstItem || !lastItem) {\n        return null;\n      }\n      // First item\n      breadcrumbItems.push(\n        <Link\n          key={`first-${firstItem.label}-${firstItem.href || ''}`}\n          fdKey={`breadcrumb-${firstItem.label}`}\n          href={firstItem.href}\n          iconLeft={<ArrowLeft02Icon size=\"sm\" />}\n          size=\"body\"\n          tone=\"Neutral Weak\"\n          underline={false}\n          weight=\"regular\"\n        >\n          {firstItem.label}\n        </Link>,\n      );\n\n      // Ellipsis\n      breadcrumbItems.push(\n        <StyledEllipsisButton\n          key=\"ellipsis\"\n          aria-label={ariaLabelEllipsis ?? undefined}\n          onClick={() => setIsExpanded(true)}\n          onKeyDown={(e) => {\n            if (e.key === 'Enter' || e.key === ' ') {\n              e.preventDefault();\n              setIsExpanded(true);\n            }\n          }}\n          type=\"button\"\n        >\n          ...\n        </StyledEllipsisButton>,\n      );\n\n      // Last item\n      breadcrumbItems.push(\n        <StyledCurrentPage key={`current-${lastItem.label}-${lastItem.href || ''}`} aria-current=\"page\">\n          {lastItem.label}\n        </StyledCurrentPage>,\n      );\n    } else {\n      // Default/expanded mode: show all items\n      const allItems = items.map((item, index) => {\n        const isFirst = index === 0;\n        const isLast = index === items.length - 1;\n\n        if (isLast) {\n          return (\n            <StyledCurrentPage key={`current-${item.label}-${item.href || ''}`} aria-current=\"page\">\n              {item.label}\n            </StyledCurrentPage>\n          );\n        }\n        if (isFirst) {\n          return (\n            <Link\n              key={`first-${item.label}-${item.href || ''}`}\n              fdKey={`breadcrumb-${item.label}`}\n              href={item.href}\n              iconLeft={<ArrowLeft02Icon size=\"sm\" />}\n              size=\"body\"\n              tone=\"Neutral Weak\"\n              underline={false}\n              weight=\"regular\"\n            >\n              {item.label}\n            </Link>\n          );\n        }\n        return (\n          <Link\n            key={`middle-${item.label}-${item.href || ''}`}\n            fdKey={`breadcrumb-${item.label}`}\n            href={item.href}\n            size=\"body\"\n            tone=\"Neutral Weak\"\n            underline={false}\n            weight=\"regular\"\n          >\n            {item.label}\n          </Link>\n        );\n      });\n      breadcrumbItems.push(...allItems);\n    }\n\n    return (\n      <StyledBreadcrumbs\n        aria-label={ariaLabel ?? undefined}\n        className={className}\n        data-fd={fdKey}\n        separator=\"/\"\n      >\n        {breadcrumbItems}\n      </StyledBreadcrumbs>\n    );\n  },\n);\n\nBreadCrumbs.displayName = 'BreadCrumbs';\n\nexport default BreadCrumbs;\n"],"names":["StyledBreadcrumbs","styled","BreadcrumbsMUI","theme","color","palette","semantic","text","marginLeft","spacing","marginRight","StyledEllipsisButton","display","alignItems","background","border","cursor","padding","borderRadius","radius","transition","fontFamily","typography","b1Weak","fontSize","lineHeight","fontWeight","letterSpacing","backgroundColor","fill","outline","stroke","outlineOffset","StyledCurrentPage","BreadCrumbs","memo","ariaLabel","ariaLabelEllipsis","className","fdKey","items","type","isExpanded","setIsExpanded","useState","useTheme","isSmallScreen","useMediaQuery","breakpoints","down","length","breadcrumbItems","firstItem","lastItem","push","_jsx","Link","label","href","iconLeft","ArrowLeft02Icon","size","tone","underline","weight","undefined","onClick","onKeyDown","e","key","preventDefault","children","allItems","map","item","index","isFirst","separator","displayName"],"mappings":"yXA0BA,MAAMA,EAAoBC,EAAOC,EAAPD,EAAuB,EAAGE,YAAO,CACzD,8BAA+B,CAC7BC,MAAOD,EAAME,QAAQC,SAASC,KAAK,aACnCC,WAAYL,EAAMM,QAAQ,GAC1BC,YAAaP,EAAMM,QAAQ,QAIzBE,EAAuBV,EAAO,SAAPA,EAAiB,EAAGE,YAAO,CACtDS,QAAS,cACTC,WAAY,SACZC,WAAY,OACZC,OAAQ,OACRX,MAAOD,EAAME,QAAQC,SAASC,KAAK,aACnCS,OAAQ,UACRC,QAASd,EAAMM,QAAQ,IACvBS,aAAcf,EAAMgB,SAAS,aAAe,MAC5CC,WAAY,oCACZC,WAAYC,EAAWC,OAAOF,WAC9BG,SAAUF,EAAWC,OAAOC,SAC5BC,WAAYH,EAAWC,OAAOE,WAC9BC,WAAYJ,EAAWC,OAAOG,WAC9BC,cAAeL,EAAWC,OAAOI,cAEjC,UAAW,CACTC,gBAAiBzB,EAAME,QAAQC,SAASuB,KAAK,eAG/C,kBAAmB,CACjBC,QAAS,aAAa3B,EAAME,QAAQC,SAASyB,OAAO,kBACpDC,cAAe,WAIbC,EAAoBhC,EAAO,OAAPA,EAAe,EAAGE,YAAO,CACjDqB,SAAUF,EAAWC,OAAOC,SAC5BC,WAAYH,EAAWC,OAAOE,WAC9BrB,MAAOD,EAAME,QAAQC,SAASC,KAAK,aACnCmB,WAAYJ,EAAWC,OAAOG,WAC9BL,WAAYC,EAAWC,OAAOF,WAC9BM,cAAeL,EAAWC,OAAOI,kBAG7BO,EAAcC,GAClB,EAAGC,YAAWC,oBAAmBC,YAAWC,QAAOC,QAAOC,OAAO,cAC/D,MAAOC,EAAYC,GAAiBC,GAAS,GACvCzC,EAAQ0C,IACRC,EAAgBC,EAAc5C,EAAM6C,YAAYC,KAAK,WAE3D,IAAKT,GAAOU,OACV,OAAO,KAGT,MAIMC,EAAqC,GAE3C,IALY,cAATV,GAAkC,YAATA,GAAsBK,IAAmBN,EAAMU,OAAS,IAAMR,EAKtE,CAClB,MAAMU,EAAYZ,EAAM,GAClBa,EAAWb,EAAMA,EAAMU,OAAS,GACtC,IAAKE,IAAcC,EACjB,OAAO,KAGTF,EAAgBG,KACdC,EAACC,EAAI,CAEHjB,MAAO,cAAca,EAAUK,QAC/BC,KAAMN,EAAUM,KAChBC,SAAUJ,EAACK,EAAe,CAACC,KAAK,OAChCA,KAAK,OACLC,KAAK,eACLC,WAAW,EACXC,OAAO,mBAENZ,EAAUK,OATN,SAASL,EAAUK,SAASL,EAAUM,MAAQ,OAcvDP,EAAgBG,KACdC,EAAC5C,gBAEa0B,QAAqB4B,EACjCC,QAAS,IAAMvB,GAAc,GAC7BwB,UAAYC,IACI,UAAVA,EAAEC,KAA6B,MAAVD,EAAEC,MACzBD,EAAEE,iBACF3B,GAAc,KAGlBF,KAAK,yBATD,aAgBRU,EAAgBG,KACdC,EAACtB,kBAAwF,OAAMsC,SAC5FlB,EAASI,OADY,WAAWJ,EAASI,SAASJ,EAASK,MAAQ,MAI1E,KAAO,CAEL,MAAMc,EAAWhC,EAAMiC,KAAI,CAACC,EAAMC,KAChC,MAAMC,EAAoB,IAAVD,EAGhB,OAFeA,IAAUnC,EAAMU,OAAS,EAIpCK,EAACtB,EAAiB,CAAA,eAA+D,OAAMsC,SACpFG,EAAKjB,OADgB,WAAWiB,EAAKjB,SAASiB,EAAKhB,MAAQ,MAK9DkB,EAEArB,EAACC,EAAI,CAEHjB,MAAO,cAAcmC,EAAKjB,QAC1BC,KAAMgB,EAAKhB,KACXC,SAAUJ,EAACK,EAAe,CAACC,KAAK,OAChCA,KAAK,OACLC,KAAK,eACLC,WAAW,EACXC,OAAO,UAASO,SAEfG,EAAKjB,OATD,SAASiB,EAAKjB,SAASiB,EAAKhB,MAAQ,MAc7CH,EAACC,EAAI,CAEHjB,MAAO,cAAcmC,EAAKjB,QAC1BC,KAAMgB,EAAKhB,KACXG,KAAK,OACLC,KAAK,eACLC,WAAW,EACXC,OAAO,UAASO,SAEfG,EAAKjB,OARD,UAAUiB,EAAKjB,SAASiB,EAAKhB,MAAQ,SAYhDP,EAAgBG,QAAQkB,EAC1B,CAEA,OACEjB,EAACvD,EAAiB,CAAA,aACJoC,QAAa6B,EACzB3B,UAAWA,EAAS,UACXC,EACTsC,UAAU,IAAGN,SAEZpB,OAMTjB,EAAY4C,YAAc"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/BreadCrumbs/index.tsx"],"sourcesContent":["import { memo, useState } from 'react';\n\nimport BreadcrumbsMUI from '@mui/material/Breadcrumbs';\nimport { styled, useTheme } from '@mui/material/styles';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n\nimport Link from '@fd/components/atoms/Link';\nimport ArrowLeft02Icon from '@fd/icons/ArrowLeft02';\nimport { typography } from '@fd/themes/typography';\n\nexport interface BreadcrumbItem {\n  label: string;\n  href?: string;\n}\n\nexport type BreadCrumbsType = 'collapsed' | 'default';\n\nexport interface BreadCrumbsProps {\n  ariaLabel?: string;\n  ariaLabelEllipsis?: string;\n  className?: string;\n  fdKey?: string;\n  items: BreadcrumbItem[];\n  type?: BreadCrumbsType;\n}\n\nconst StyledBreadcrumbs = styled(BreadcrumbsMUI)(({ theme }) => ({\n  '& .MuiBreadcrumbs-separator': {\n    color: theme.palette.semantic.text['text-weak'],\n    marginLeft: theme.spacing(1),\n    marginRight: theme.spacing(1),\n  },\n}));\n\nconst StyledEllipsisButton = styled('button')(({ theme }) => ({\n  display: 'inline-flex',\n  alignItems: 'center',\n  background: 'none',\n  border: 'none',\n  color: theme.palette.semantic.text['text-weak'],\n  cursor: 'pointer',\n  padding: theme.spacing(0.5),\n  borderRadius: theme.radius?.['radius-4'] || '4px',\n  transition: 'background-color 0.2s ease-in-out',\n  fontFamily: typography.b1Weak.fontFamily,\n  fontSize: typography.b1Weak.fontSize,\n  lineHeight: typography.b1Weak.lineHeight,\n  fontWeight: typography.b1Weak.fontWeight,\n  letterSpacing: typography.b1Weak.letterSpacing,\n\n  '&:hover': {\n    backgroundColor: theme.palette.semantic.fill['fill-hover'],\n  },\n\n  '&:focus-visible': {\n    outline: `2px solid ${theme.palette.semantic.stroke['stroke-focus']}`,\n    outlineOffset: '2px',\n  },\n}));\n\nconst StyledCurrentPage = styled('span')(({ theme }) => ({\n  fontSize: typography.b1Weak.fontSize,\n  lineHeight: typography.b1Weak.lineHeight,\n  color: theme.palette.semantic.text['text-weak'],\n  fontWeight: typography.b1Weak.fontWeight,\n  fontFamily: typography.b1Weak.fontFamily,\n  letterSpacing: typography.b1Weak.letterSpacing,\n}));\n\nconst BreadCrumbs = memo(\n  ({ ariaLabel, ariaLabelEllipsis, className, fdKey, items, type = 'default' }: BreadCrumbsProps) => {\n    const [isExpanded, setIsExpanded] = useState(false);\n    const theme = useTheme();\n    const isSmallScreen = useMediaQuery(theme.breakpoints.down('tablet'));\n\n    if (!items?.length) {\n      return null;\n    }\n\n    const shouldCollapse =\n      (type === 'collapsed' || (type === 'default' && isSmallScreen)) && items.length > 2 && !isExpanded;\n\n    // Build breadcrumb items array\n    const breadcrumbItems: React.ReactNode[] = [];\n\n    if (shouldCollapse) {\n      const firstItem = items[0];\n      const lastItem = items[items.length - 1];\n      if (!firstItem || !lastItem) {\n        return null;\n      }\n      // First item\n      breadcrumbItems.push(\n        <Link\n          key={`first-${firstItem.label}-${firstItem.href || ''}`}\n          fdKey={`breadcrumb-${firstItem.label}`}\n          href={firstItem.href}\n          iconLeft={<ArrowLeft02Icon size=\"sm\" />}\n          size=\"body\"\n          tone=\"Neutral Weak\"\n          underline={false}\n          weight=\"regular\"\n        >\n          {firstItem.label}\n        </Link>,\n      );\n\n      // Ellipsis\n      breadcrumbItems.push(\n        <StyledEllipsisButton\n          key=\"ellipsis\"\n          aria-label={ariaLabelEllipsis ?? undefined}\n          onClick={() => setIsExpanded(true)}\n          onKeyDown={(e) => {\n            if (e.key === 'Enter' || e.key === ' ') {\n              e.preventDefault();\n              setIsExpanded(true);\n            }\n          }}\n          type=\"button\"\n        >\n          ...\n        </StyledEllipsisButton>,\n      );\n\n      // Last item\n      breadcrumbItems.push(\n        <StyledCurrentPage key={`current-${lastItem.label}-${lastItem.href || ''}`} aria-current=\"page\">\n          {lastItem.label}\n        </StyledCurrentPage>,\n      );\n    } else {\n      // Default/expanded mode: show all items\n      const allItems = items.map((item, index) => {\n        const isFirst = index === 0;\n        const isLast = index === items.length - 1;\n\n        if (isLast) {\n          return (\n            <StyledCurrentPage key={`current-${item.label}-${item.href || ''}`} aria-current=\"page\">\n              {item.label}\n            </StyledCurrentPage>\n          );\n        }\n        if (isFirst) {\n          return (\n            <Link\n              key={`first-${item.label}-${item.href || ''}`}\n              fdKey={`breadcrumb-${item.label}`}\n              href={item.href}\n              iconLeft={<ArrowLeft02Icon size=\"sm\" />}\n              size=\"body\"\n              tone=\"Neutral Weak\"\n              underline={false}\n              weight=\"regular\"\n            >\n              {item.label}\n            </Link>\n          );\n        }\n        return (\n          <Link\n            key={`middle-${item.label}-${item.href || ''}`}\n            fdKey={`breadcrumb-${item.label}`}\n            href={item.href}\n            size=\"body\"\n            tone=\"Neutral Weak\"\n            underline={false}\n            weight=\"regular\"\n          >\n            {item.label}\n          </Link>\n        );\n      });\n      breadcrumbItems.push(...allItems);\n    }\n\n    return (\n      <StyledBreadcrumbs\n        aria-label={ariaLabel ?? undefined}\n        className={className}\n        data-fd={fdKey}\n        separator=\"/\"\n      >\n        {breadcrumbItems}\n      </StyledBreadcrumbs>\n    );\n  },\n);\n\nBreadCrumbs.displayName = 'BreadCrumbs';\n\nexport default BreadCrumbs;\n"],"names":["StyledBreadcrumbs","styled","BreadcrumbsMUI","theme","color","palette","semantic","text","marginLeft","spacing","marginRight","StyledEllipsisButton","display","alignItems","background","border","cursor","padding","borderRadius","radius","transition","fontFamily","typography","b1Weak","fontSize","lineHeight","fontWeight","letterSpacing","backgroundColor","fill","outline","stroke","outlineOffset","StyledCurrentPage","BreadCrumbs","memo","ariaLabel","ariaLabelEllipsis","className","fdKey","items","type","isExpanded","setIsExpanded","useState","useTheme","isSmallScreen","useMediaQuery","breakpoints","down","length","breadcrumbItems","firstItem","lastItem","push","_jsx","Link","label","href","iconLeft","ArrowLeft02Icon","size","tone","underline","weight","undefined","onClick","onKeyDown","e","key","preventDefault","children","allItems","map","item","index","isFirst","separator","displayName"],"mappings":"yXA0BA,MAAMA,EAAoBC,EAAOC,EAAPD,CAAuB,EAAGE,YAAO,CACzD,8BAA+B,CAC7BC,MAAOD,EAAME,QAAQC,SAASC,KAAK,aACnCC,WAAYL,EAAMM,QAAQ,GAC1BC,YAAaP,EAAMM,QAAQ,OAIzBE,EAAuBV,EAAO,SAAPA,CAAiB,EAAGE,YAAO,CACtDS,QAAS,cACTC,WAAY,SACZC,WAAY,OACZC,OAAQ,OACRX,MAAOD,EAAME,QAAQC,SAASC,KAAK,aACnCS,OAAQ,UACRC,QAASd,EAAMM,QAAQ,IACvBS,aAAcf,EAAMgB,SAAS,aAAe,MAC5CC,WAAY,oCACZC,WAAYC,EAAWC,OAAOF,WAC9BG,SAAUF,EAAWC,OAAOC,SAC5BC,WAAYH,EAAWC,OAAOE,WAC9BC,WAAYJ,EAAWC,OAAOG,WAC9BC,cAAeL,EAAWC,OAAOI,cAEjC,UAAW,CACTC,gBAAiBzB,EAAME,QAAQC,SAASuB,KAAK,eAG/C,kBAAmB,CACjBC,QAAS,aAAa3B,EAAME,QAAQC,SAASyB,OAAO,kBACpDC,cAAe,UAIbC,EAAoBhC,EAAO,OAAPA,CAAe,EAAGE,YAAO,CACjDqB,SAAUF,EAAWC,OAAOC,SAC5BC,WAAYH,EAAWC,OAAOE,WAC9BrB,MAAOD,EAAME,QAAQC,SAASC,KAAK,aACnCmB,WAAYJ,EAAWC,OAAOG,WAC9BL,WAAYC,EAAWC,OAAOF,WAC9BM,cAAeL,EAAWC,OAAOI,iBAG7BO,EAAcC,EAClB,EAAGC,YAAWC,oBAAmBC,YAAWC,QAAOC,QAAOC,OAAO,cAC/D,MAAOC,EAAYC,GAAiBC,GAAS,GACvCzC,EAAQ0C,IACRC,EAAgBC,EAAc5C,EAAM6C,YAAYC,KAAK,WAE3D,IAAKT,GAAOU,OACV,OAAO,KAGT,MAIMC,EAAqC,GAE3C,IALY,cAATV,GAAkC,YAATA,GAAsBK,IAAmBN,EAAMU,OAAS,IAAMR,EAKtE,CAClB,MAAMU,EAAYZ,EAAM,GAClBa,EAAWb,EAAMA,EAAMU,OAAS,GACtC,IAAKE,IAAcC,EACjB,OAAO,KAGTF,EAAgBG,KACdC,EAACC,EAAI,CAEHjB,MAAO,cAAca,EAAUK,QAC/BC,KAAMN,EAAUM,KAChBC,SAAUJ,EAACK,EAAe,CAACC,KAAK,OAChCA,KAAK,OACLC,KAAK,eACLC,WAAW,EACXC,OAAO,mBAENZ,EAAUK,OATN,SAASL,EAAUK,SAASL,EAAUM,MAAQ,OAcvDP,EAAgBG,KACdC,EAAC5C,gBAEa0B,QAAqB4B,EACjCC,QAAS,IAAMvB,GAAc,GAC7BwB,UAAYC,IACI,UAAVA,EAAEC,KAA6B,MAAVD,EAAEC,MACzBD,EAAEE,iBACF3B,GAAc,KAGlBF,KAAK,yBATD,aAgBRU,EAAgBG,KACdC,EAACtB,kBAAwF,OAAMsC,SAC5FlB,EAASI,OADY,WAAWJ,EAASI,SAASJ,EAASK,MAAQ,MAI1E,KAAO,CAEL,MAAMc,EAAWhC,EAAMiC,IAAI,CAACC,EAAMC,KAChC,MAAMC,EAAoB,IAAVD,EAGhB,OAFeA,IAAUnC,EAAMU,OAAS,EAIpCK,EAACtB,EAAiB,CAAA,eAA+D,OAAMsC,SACpFG,EAAKjB,OADgB,WAAWiB,EAAKjB,SAASiB,EAAKhB,MAAQ,MAK9DkB,EAEArB,EAACC,EAAI,CAEHjB,MAAO,cAAcmC,EAAKjB,QAC1BC,KAAMgB,EAAKhB,KACXC,SAAUJ,EAACK,EAAe,CAACC,KAAK,OAChCA,KAAK,OACLC,KAAK,eACLC,WAAW,EACXC,OAAO,UAASO,SAEfG,EAAKjB,OATD,SAASiB,EAAKjB,SAASiB,EAAKhB,MAAQ,MAc7CH,EAACC,EAAI,CAEHjB,MAAO,cAAcmC,EAAKjB,QAC1BC,KAAMgB,EAAKhB,KACXG,KAAK,OACLC,KAAK,eACLC,WAAW,EACXC,OAAO,UAASO,SAEfG,EAAKjB,OARD,UAAUiB,EAAKjB,SAASiB,EAAKhB,MAAQ,QAYhDP,EAAgBG,QAAQkB,EAC1B,CAEA,OACEjB,EAACvD,EAAiB,CAAA,aACJoC,QAAa6B,EACzB3B,UAAWA,EAAS,UACXC,EACTsC,UAAU,IAAGN,SAEZpB,MAMTjB,EAAY4C,YAAc"}

package/dist/components/atoms/Button/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");require("react");var t=require("@mui/material/Button"),r=require("@mui/material/styles"),i=require("./getButtonStyles.cjs.js");const a=r.styled(t,{shouldForwardProp:e=>!["casingOverride","customVariant","tone"].includes(e)})((({theme:e,customVariant:t="primary",tone:r="brand",casingOverride:a="none",fullWidth:n=!1})=>{const o=i(e,t,r);return{...o.default,width:n?"100%":"fit-content",maxWidth:n?"100%":"fit-content",textTransform:a,transition:"all 0.2s ease-in-out","&:hover":{...o.hover},"&:focus":{outline:"none"},"&:focus-visible":{...o.focus},"&:active":{...o.press},"&:disabled":{...o.disabled,cursor:"not-allowed"}}})),n={primary:"contained",secondary:"outlined",tertiary:"text"},o=({casingOverride:t="none",children:r,className:i,disabled:o=!1,endIcon:s,fdKey:d,form:l,fullWidth:u=!1,href:c,loading:m=!1,onKeyDown:f,size:h="medium",startIcon:p,target:v,tone:y,type:g="button",variant:b="primary",...x})=>e.jsx(a,{...x,disableRipple:!0,casingOverride:t,className:i,customVariant:b,"data-fd":d,"data-tone":y,disabled:o,endIcon:s,form:l,fullWidth:u,href:c,loading:m,loadingPosition:"start",size:h,startIcon:p,target:v,tone:y,type:g,variant:n[b],children:r});exports.Button=o,exports.default=o;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");require("react");var t=require("@mui/material/Button"),r=require("@mui/material/styles"),i=require("./getButtonStyles.cjs.js");const a=r.styled(t,{shouldForwardProp:e=>!["casingOverride","customVariant","tone"].includes(e)})(({theme:e,customVariant:t="primary",tone:r="brand",casingOverride:a="none",fullWidth:n=!1})=>{const o=i(e,t,r);return{...o.default,width:n?"100%":"fit-content",maxWidth:n?"100%":"fit-content",textTransform:a,transition:"all 0.2s ease-in-out","&:hover":{...o.hover},"&:focus":{outline:"none"},"&:focus-visible":{...o.focus},"&:active":{...o.press},"&:disabled":{...o.disabled,cursor:"not-allowed"}}}),n={primary:"contained",secondary:"outlined",tertiary:"text"},o=({casingOverride:t="none",children:r,className:i,disabled:o=!1,endIcon:s,fdKey:d,form:l,fullWidth:u=!1,href:c,loading:m=!1,onKeyDown:f,size:h="medium",startIcon:p,target:v,tone:y,type:g="button",variant:b="primary",...x})=>e.jsx(a,{...x,disableRipple:!0,casingOverride:t,className:i,customVariant:b,"data-fd":d,"data-tone":y,disabled:o,endIcon:s,form:l,fullWidth:u,href:c,loading:m,loadingPosition:"start",size:h,startIcon:p,target:v,tone:y,type:g,variant:n[b],children:r});exports.Button=o,exports.default=o;
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/atoms/Button/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/Button/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport MuiButton, { type ButtonProps as MuiButtonProps } from '@mui/material/Button';\nimport { styled } from '@mui/material/styles';\n\nimport getButtonStyles, { type ButtonTone, type ButtonType } from './getButtonStyles';\n\ntype CasingOverride = 'capitalize' | 'lowercase' | 'none' | 'uppercase';\n\nexport interface ButtonProps extends Omit<MuiButtonProps, 'variant'> {\n  className?: string;\n  children: React.ReactNode;\n  disabled?: boolean;\n  form?: string;\n  fullWidth?: boolean;\n  casingOverride?: CasingOverride;\n  type?: 'button' | 'reset' | 'submit';\n  fdKey: string;\n  variant?: ButtonType;\n  tone?: ButtonTone;\n  target?: '_blank';\n  startIcon?: React.ReactNode;\n  endIcon?: React.ReactNode;\n  loading?: boolean;\n}\n\nconst StyledButton = styled(MuiButton, {\n  shouldForwardProp: (prop) => !['casingOverride', 'customVariant', 'tone'].includes(prop as string),\n})<{ casingOverride?: CasingOverride; customVariant?: ButtonType; tone?: ButtonTone }>(({\n  theme,\n  customVariant = 'primary',\n  tone = 'brand',\n  casingOverride = 'none',\n  fullWidth = false,\n}) => {\n  const styles = getButtonStyles(theme, customVariant, tone);\n\n  return {\n    ...styles.default,\n    width: fullWidth ? '100%' : 'fit-content',\n    maxWidth: fullWidth ? '100%' : 'fit-content',\n    textTransform: casingOverride,\n    transition: 'all 0.2s ease-in-out',\n\n    '&:hover': { ...styles.hover },\n    '&:focus': {\n      outline: 'none', // Removes the focus ring on click\n    },\n    // focus visible so that the focus ring only shows for keyboard users\n    '&:focus-visible': { ...styles.focus },\n    '&:active': { ...styles.press },\n    '&:disabled': { ...styles.disabled, cursor: 'not-allowed' },\n  };\n});\n\nconst MUI_VARIANT_MAP = {\n  primary: 'contained',\n  secondary: 'outlined',\n  tertiary: 'text',\n};\n\nexport const Button = ({\n  casingOverride = 'none',\n  children,\n  className,\n  disabled = false,\n  endIcon,\n  fdKey,\n  form,\n  fullWidth = false,\n  href,\n  loading = false,\n  onKeyDown,\n  size = 'medium',\n  startIcon,\n  target,\n  tone,\n  type = 'button',\n  variant = 'primary',\n  ...props\n}: ButtonProps): JSX.Element => {\n  return (\n    <StyledButton\n      {...props}\n      disableRipple\n      casingOverride={casingOverride}\n      className={className}\n      customVariant={variant}\n      data-fd={fdKey}\n      data-tone={tone}\n      disabled={disabled}\n      endIcon={endIcon}\n      form={form}\n      fullWidth={fullWidth}\n      href={href}\n      loading={loading}\n      loadingPosition=\"start\"\n      size={size}\n      startIcon={startIcon}\n      // @ts-expect-error - target is not a valid prop for MuiButton\n      target={target}\n      tone={tone}\n      type={type}\n      variant={MUI_VARIANT_MAP[variant] as MuiButtonProps['variant']}\n    >\n      {children}\n    </StyledButton>\n  );\n};\n\nexport default Button;\n"],"names":["StyledButton","styled","MuiButton","shouldForwardProp","prop","includes","theme","customVariant","tone","casingOverride","fullWidth","styles","getButtonStyles","default","width","maxWidth","textTransform","transition","hover","outline","focus","press","disabled","cursor","MUI_VARIANT_MAP","primary","secondary","tertiary","Button","children","className","endIcon","fdKey","form","href","loading","onKeyDown","size","startIcon","target","type","variant","props","_jsx","disableRipple","loadingPosition"],"mappings":"sOA0BA,MAAMA,EAAeC,EAAAA,OAAOC,EAAW,CACrCC,kBAAoBC,IAAU,CAAC,iBAAkB,gBAAiB,QAAQC,SAASD,IADhEH,EAEkE,EACrFK,QACAC,gBAAgB,UAChBC,OAAO,QACPC,iBAAiB,OACjBC,aAAY,MAEZ,MAAMC,EAASC,EAAgBN,EAAOC,EAAeC,GAErD,MAAO,IACFG,EAAOE,QACVC,MAAOJ,EAAY,OAAS,cAC5BK,SAAUL,EAAY,OAAS,cAC/BM,cAAeP,EACfQ,WAAY,uBAEZ,UAAW,IAAKN,EAAOO,OACvB,UAAW,CACTC,QAAS,QAGX,kBAAmB,IAAKR,EAAOS,OAC/B,WAAY,IAAKT,EAAOU,OACxB,aAAc,IAAKV,EAAOW,SAAUC,OAAQ,mBAI1CC,EAAkB,CACtBC,QAAS,YACTC,UAAW,WACXC,SAAU,QAGCC,EAAS,EACpBnB,iBAAiB,OACjBoB,WACAC,YACAR,YAAW,EACXS,UACAC,QACAC,OACAvB,aAAY,EACZwB,OACAC,WAAU,EACVC,YACAC,OAAO,SACPC,YACAC,SACA/B,OACAgC,OAAO,SACPC,UAAU,aACPC,KAGDC,EAAAA,IAAC3C,EAAY,IACP0C,EACJE,eAAa,EACbnC,eAAgBA,EAChBqB,UAAWA,EACXvB,cAAekC,EAAO,UACbT,EAAK,YACHxB,EACXc,SAAUA,EACVS,QAASA,EACTE,KAAMA,EACNvB,UAAWA,EACXwB,KAAMA,EACNC,QAASA,EACTU,gBAAgB,QAChBR,KAAMA,EACNC,UAAWA,EAEXC,OAAQA,EACR/B,KAAMA,EACNgC,KAAMA,EACNC,QAASjB,EAAgBiB,GAAqCZ,SAE7DA"}
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/Button/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport MuiButton, { type ButtonProps as MuiButtonProps } from '@mui/material/Button';\nimport { styled } from '@mui/material/styles';\n\nimport getButtonStyles, { type ButtonTone, type ButtonType } from './getButtonStyles';\n\ntype CasingOverride = 'capitalize' | 'lowercase' | 'none' | 'uppercase';\n\nexport interface ButtonProps extends Omit<MuiButtonProps, 'variant'> {\n  className?: string;\n  children: React.ReactNode;\n  disabled?: boolean;\n  form?: string;\n  fullWidth?: boolean;\n  casingOverride?: CasingOverride;\n  type?: 'button' | 'reset' | 'submit';\n  fdKey: string;\n  variant?: ButtonType;\n  tone?: ButtonTone;\n  target?: '_blank';\n  startIcon?: React.ReactNode;\n  endIcon?: React.ReactNode;\n  loading?: boolean;\n}\n\nconst StyledButton = styled(MuiButton, {\n  shouldForwardProp: (prop) => !['casingOverride', 'customVariant', 'tone'].includes(prop as string),\n})<{ casingOverride?: CasingOverride; customVariant?: ButtonType; tone?: ButtonTone }>(({\n  theme,\n  customVariant = 'primary',\n  tone = 'brand',\n  casingOverride = 'none',\n  fullWidth = false,\n}) => {\n  const styles = getButtonStyles(theme, customVariant, tone);\n\n  return {\n    ...styles.default,\n    width: fullWidth ? '100%' : 'fit-content',\n    maxWidth: fullWidth ? '100%' : 'fit-content',\n    textTransform: casingOverride,\n    transition: 'all 0.2s ease-in-out',\n\n    '&:hover': { ...styles.hover },\n    '&:focus': {\n      outline: 'none', // Removes the focus ring on click\n    },\n    // focus visible so that the focus ring only shows for keyboard users\n    '&:focus-visible': { ...styles.focus },\n    '&:active': { ...styles.press },\n    '&:disabled': { ...styles.disabled, cursor: 'not-allowed' },\n  };\n});\n\nconst MUI_VARIANT_MAP = {\n  primary: 'contained',\n  secondary: 'outlined',\n  tertiary: 'text',\n};\n\nexport const Button = ({\n  casingOverride = 'none',\n  children,\n  className,\n  disabled = false,\n  endIcon,\n  fdKey,\n  form,\n  fullWidth = false,\n  href,\n  loading = false,\n  onKeyDown,\n  size = 'medium',\n  startIcon,\n  target,\n  tone,\n  type = 'button',\n  variant = 'primary',\n  ...props\n}: ButtonProps): JSX.Element => {\n  return (\n    <StyledButton\n      {...props}\n      disableRipple\n      casingOverride={casingOverride}\n      className={className}\n      customVariant={variant}\n      data-fd={fdKey}\n      data-tone={tone}\n      disabled={disabled}\n      endIcon={endIcon}\n      form={form}\n      fullWidth={fullWidth}\n      href={href}\n      loading={loading}\n      loadingPosition=\"start\"\n      size={size}\n      startIcon={startIcon}\n      // @ts-expect-error - target is not a valid prop for MuiButton\n      target={target}\n      tone={tone}\n      type={type}\n      variant={MUI_VARIANT_MAP[variant] as MuiButtonProps['variant']}\n    >\n      {children}\n    </StyledButton>\n  );\n};\n\nexport default Button;\n"],"names":["StyledButton","styled","MuiButton","shouldForwardProp","prop","includes","theme","customVariant","tone","casingOverride","fullWidth","styles","getButtonStyles","default","width","maxWidth","textTransform","transition","hover","outline","focus","press","disabled","cursor","MUI_VARIANT_MAP","primary","secondary","tertiary","Button","children","className","endIcon","fdKey","form","href","loading","onKeyDown","size","startIcon","target","type","variant","props","_jsx","disableRipple","loadingPosition"],"mappings":"sOA0BA,MAAMA,EAAeC,EAAAA,OAAOC,EAAW,CACrCC,kBAAoBC,IAAU,CAAC,iBAAkB,gBAAiB,QAAQC,SAASD,IADhEH,CAEkE,EACrFK,QACAC,gBAAgB,UAChBC,OAAO,QACPC,iBAAiB,OACjBC,aAAY,MAEZ,MAAMC,EAASC,EAAgBN,EAAOC,EAAeC,GAErD,MAAO,IACFG,EAAOE,QACVC,MAAOJ,EAAY,OAAS,cAC5BK,SAAUL,EAAY,OAAS,cAC/BM,cAAeP,EACfQ,WAAY,uBAEZ,UAAW,IAAKN,EAAOO,OACvB,UAAW,CACTC,QAAS,QAGX,kBAAmB,IAAKR,EAAOS,OAC/B,WAAY,IAAKT,EAAOU,OACxB,aAAc,IAAKV,EAAOW,SAAUC,OAAQ,kBAI1CC,EAAkB,CACtBC,QAAS,YACTC,UAAW,WACXC,SAAU,QAGCC,EAAS,EACpBnB,iBAAiB,OACjBoB,WACAC,YACAR,YAAW,EACXS,UACAC,QACAC,OACAvB,aAAY,EACZwB,OACAC,WAAU,EACVC,YACAC,OAAO,SACPC,YACAC,SACA/B,OACAgC,OAAO,SACPC,UAAU,aACPC,KAGDC,EAAAA,IAAC3C,EAAY,IACP0C,EACJE,eAAa,EACbnC,eAAgBA,EAChBqB,UAAWA,EACXvB,cAAekC,EAAO,UACbT,EAAK,YACHxB,EACXc,SAAUA,EACVS,QAASA,EACTE,KAAMA,EACNvB,UAAWA,EACXwB,KAAMA,EACNC,QAASA,EACTU,gBAAgB,QAChBR,KAAMA,EACNC,UAAWA,EAEXC,OAAQA,EACR/B,KAAMA,EACNgC,KAAMA,EACNC,QAASjB,EAAgBiB,GAAqCZ,SAE7DA"}

package/dist/components/atoms/Button/index.js

@@ -1,2 +1,2 @@
-import{jsx as t}from"react/jsx-runtime";import"react";import e from"@mui/material/Button";import{styled as r}from"@mui/material/styles";import i from"./getButtonStyles.js";const a=r(e,{shouldForwardProp:t=>!["casingOverride","customVariant","tone"].includes(t)})((({theme:t,customVariant:e="primary",tone:r="brand",casingOverride:a="none",fullWidth:o=!1})=>{const n=i(t,e,r);return{...n.default,width:o?"100%":"fit-content",maxWidth:o?"100%":"fit-content",textTransform:a,transition:"all 0.2s ease-in-out","&:hover":{...n.hover},"&:focus":{outline:"none"},"&:focus-visible":{...n.focus},"&:active":{...n.press},"&:disabled":{...n.disabled,cursor:"not-allowed"}}})),o={primary:"contained",secondary:"outlined",tertiary:"text"},n=({casingOverride:e="none",children:r,className:i,disabled:n=!1,endIcon:s,fdKey:d,form:l,fullWidth:c=!1,href:m,loading:u=!1,onKeyDown:f,size:p="medium",startIcon:h,target:y,tone:g,type:v="button",variant:b="primary",...x})=>t(a,{...x,disableRipple:!0,casingOverride:e,className:i,customVariant:b,"data-fd":d,"data-tone":g,disabled:n,endIcon:s,form:l,fullWidth:c,href:m,loading:u,loadingPosition:"start",size:p,startIcon:h,target:y,tone:g,type:v,variant:o[b],children:r});export{n as Button,n as default};
+import{jsx as t}from"react/jsx-runtime";import"react";import e from"@mui/material/Button";import{styled as r}from"@mui/material/styles";import i from"./getButtonStyles.js";const a=r(e,{shouldForwardProp:t=>!["casingOverride","customVariant","tone"].includes(t)})(({theme:t,customVariant:e="primary",tone:r="brand",casingOverride:a="none",fullWidth:o=!1})=>{const n=i(t,e,r);return{...n.default,width:o?"100%":"fit-content",maxWidth:o?"100%":"fit-content",textTransform:a,transition:"all 0.2s ease-in-out","&:hover":{...n.hover},"&:focus":{outline:"none"},"&:focus-visible":{...n.focus},"&:active":{...n.press},"&:disabled":{...n.disabled,cursor:"not-allowed"}}}),o={primary:"contained",secondary:"outlined",tertiary:"text"},n=({casingOverride:e="none",children:r,className:i,disabled:n=!1,endIcon:s,fdKey:d,form:l,fullWidth:c=!1,href:m,loading:u=!1,onKeyDown:f,size:p="medium",startIcon:h,target:y,tone:g,type:v="button",variant:b="primary",...x})=>t(a,{...x,disableRipple:!0,casingOverride:e,className:i,customVariant:b,"data-fd":d,"data-tone":g,disabled:n,endIcon:s,form:l,fullWidth:c,href:m,loading:u,loadingPosition:"start",size:p,startIcon:h,target:y,tone:g,type:v,variant:o[b],children:r});export{n as Button,n as default};
 //# sourceMappingURL=index.js.map

package/dist/components/atoms/Button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/Button/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport MuiButton, { type ButtonProps as MuiButtonProps } from '@mui/material/Button';\nimport { styled } from '@mui/material/styles';\n\nimport getButtonStyles, { type ButtonTone, type ButtonType } from './getButtonStyles';\n\ntype CasingOverride = 'capitalize' | 'lowercase' | 'none' | 'uppercase';\n\nexport interface ButtonProps extends Omit<MuiButtonProps, 'variant'> {\n  className?: string;\n  children: React.ReactNode;\n  disabled?: boolean;\n  form?: string;\n  fullWidth?: boolean;\n  casingOverride?: CasingOverride;\n  type?: 'button' | 'reset' | 'submit';\n  fdKey: string;\n  variant?: ButtonType;\n  tone?: ButtonTone;\n  target?: '_blank';\n  startIcon?: React.ReactNode;\n  endIcon?: React.ReactNode;\n  loading?: boolean;\n}\n\nconst StyledButton = styled(MuiButton, {\n  shouldForwardProp: (prop) => !['casingOverride', 'customVariant', 'tone'].includes(prop as string),\n})<{ casingOverride?: CasingOverride; customVariant?: ButtonType; tone?: ButtonTone }>(({\n  theme,\n  customVariant = 'primary',\n  tone = 'brand',\n  casingOverride = 'none',\n  fullWidth = false,\n}) => {\n  const styles = getButtonStyles(theme, customVariant, tone);\n\n  return {\n    ...styles.default,\n    width: fullWidth ? '100%' : 'fit-content',\n    maxWidth: fullWidth ? '100%' : 'fit-content',\n    textTransform: casingOverride,\n    transition: 'all 0.2s ease-in-out',\n\n    '&:hover': { ...styles.hover },\n    '&:focus': {\n      outline: 'none', // Removes the focus ring on click\n    },\n    // focus visible so that the focus ring only shows for keyboard users\n    '&:focus-visible': { ...styles.focus },\n    '&:active': { ...styles.press },\n    '&:disabled': { ...styles.disabled, cursor: 'not-allowed' },\n  };\n});\n\nconst MUI_VARIANT_MAP = {\n  primary: 'contained',\n  secondary: 'outlined',\n  tertiary: 'text',\n};\n\nexport const Button = ({\n  casingOverride = 'none',\n  children,\n  className,\n  disabled = false,\n  endIcon,\n  fdKey,\n  form,\n  fullWidth = false,\n  href,\n  loading = false,\n  onKeyDown,\n  size = 'medium',\n  startIcon,\n  target,\n  tone,\n  type = 'button',\n  variant = 'primary',\n  ...props\n}: ButtonProps): JSX.Element => {\n  return (\n    <StyledButton\n      {...props}\n      disableRipple\n      casingOverride={casingOverride}\n      className={className}\n      customVariant={variant}\n      data-fd={fdKey}\n      data-tone={tone}\n      disabled={disabled}\n      endIcon={endIcon}\n      form={form}\n      fullWidth={fullWidth}\n      href={href}\n      loading={loading}\n      loadingPosition=\"start\"\n      size={size}\n      startIcon={startIcon}\n      // @ts-expect-error - target is not a valid prop for MuiButton\n      target={target}\n      tone={tone}\n      type={type}\n      variant={MUI_VARIANT_MAP[variant] as MuiButtonProps['variant']}\n    >\n      {children}\n    </StyledButton>\n  );\n};\n\nexport default Button;\n"],"names":["StyledButton","styled","MuiButton","shouldForwardProp","prop","includes","theme","customVariant","tone","casingOverride","fullWidth","styles","getButtonStyles","default","width","maxWidth","textTransform","transition","hover","outline","focus","press","disabled","cursor","MUI_VARIANT_MAP","primary","secondary","tertiary","Button","children","className","endIcon","fdKey","form","href","loading","onKeyDown","size","startIcon","target","type","variant","props","_jsx","disableRipple","loadingPosition"],"mappings":"4KA0BA,MAAMA,EAAeC,EAAOC,EAAW,CACrCC,kBAAoBC,IAAU,CAAC,iBAAkB,gBAAiB,QAAQC,SAASD,IADhEH,EAEkE,EACrFK,QACAC,gBAAgB,UAChBC,OAAO,QACPC,iBAAiB,OACjBC,aAAY,MAEZ,MAAMC,EAASC,EAAgBN,EAAOC,EAAeC,GAErD,MAAO,IACFG,EAAOE,QACVC,MAAOJ,EAAY,OAAS,cAC5BK,SAAUL,EAAY,OAAS,cAC/BM,cAAeP,EACfQ,WAAY,uBAEZ,UAAW,IAAKN,EAAOO,OACvB,UAAW,CACTC,QAAS,QAGX,kBAAmB,IAAKR,EAAOS,OAC/B,WAAY,IAAKT,EAAOU,OACxB,aAAc,IAAKV,EAAOW,SAAUC,OAAQ,mBAI1CC,EAAkB,CACtBC,QAAS,YACTC,UAAW,WACXC,SAAU,QAGCC,EAAS,EACpBnB,iBAAiB,OACjBoB,WACAC,YACAR,YAAW,EACXS,UACAC,QACAC,OACAvB,aAAY,EACZwB,OACAC,WAAU,EACVC,YACAC,OAAO,SACPC,YACAC,SACA/B,OACAgC,OAAO,SACPC,UAAU,aACPC,KAGDC,EAAC3C,EAAY,IACP0C,EACJE,eAAa,EACbnC,eAAgBA,EAChBqB,UAAWA,EACXvB,cAAekC,EAAO,UACbT,EAAK,YACHxB,EACXc,SAAUA,EACVS,QAASA,EACTE,KAAMA,EACNvB,UAAWA,EACXwB,KAAMA,EACNC,QAASA,EACTU,gBAAgB,QAChBR,KAAMA,EACNC,UAAWA,EAEXC,OAAQA,EACR/B,KAAMA,EACNgC,KAAMA,EACNC,QAASjB,EAAgBiB,GAAqCZ,SAE7DA"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/Button/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport MuiButton, { type ButtonProps as MuiButtonProps } from '@mui/material/Button';\nimport { styled } from '@mui/material/styles';\n\nimport getButtonStyles, { type ButtonTone, type ButtonType } from './getButtonStyles';\n\ntype CasingOverride = 'capitalize' | 'lowercase' | 'none' | 'uppercase';\n\nexport interface ButtonProps extends Omit<MuiButtonProps, 'variant'> {\n  className?: string;\n  children: React.ReactNode;\n  disabled?: boolean;\n  form?: string;\n  fullWidth?: boolean;\n  casingOverride?: CasingOverride;\n  type?: 'button' | 'reset' | 'submit';\n  fdKey: string;\n  variant?: ButtonType;\n  tone?: ButtonTone;\n  target?: '_blank';\n  startIcon?: React.ReactNode;\n  endIcon?: React.ReactNode;\n  loading?: boolean;\n}\n\nconst StyledButton = styled(MuiButton, {\n  shouldForwardProp: (prop) => !['casingOverride', 'customVariant', 'tone'].includes(prop as string),\n})<{ casingOverride?: CasingOverride; customVariant?: ButtonType; tone?: ButtonTone }>(({\n  theme,\n  customVariant = 'primary',\n  tone = 'brand',\n  casingOverride = 'none',\n  fullWidth = false,\n}) => {\n  const styles = getButtonStyles(theme, customVariant, tone);\n\n  return {\n    ...styles.default,\n    width: fullWidth ? '100%' : 'fit-content',\n    maxWidth: fullWidth ? '100%' : 'fit-content',\n    textTransform: casingOverride,\n    transition: 'all 0.2s ease-in-out',\n\n    '&:hover': { ...styles.hover },\n    '&:focus': {\n      outline: 'none', // Removes the focus ring on click\n    },\n    // focus visible so that the focus ring only shows for keyboard users\n    '&:focus-visible': { ...styles.focus },\n    '&:active': { ...styles.press },\n    '&:disabled': { ...styles.disabled, cursor: 'not-allowed' },\n  };\n});\n\nconst MUI_VARIANT_MAP = {\n  primary: 'contained',\n  secondary: 'outlined',\n  tertiary: 'text',\n};\n\nexport const Button = ({\n  casingOverride = 'none',\n  children,\n  className,\n  disabled = false,\n  endIcon,\n  fdKey,\n  form,\n  fullWidth = false,\n  href,\n  loading = false,\n  onKeyDown,\n  size = 'medium',\n  startIcon,\n  target,\n  tone,\n  type = 'button',\n  variant = 'primary',\n  ...props\n}: ButtonProps): JSX.Element => {\n  return (\n    <StyledButton\n      {...props}\n      disableRipple\n      casingOverride={casingOverride}\n      className={className}\n      customVariant={variant}\n      data-fd={fdKey}\n      data-tone={tone}\n      disabled={disabled}\n      endIcon={endIcon}\n      form={form}\n      fullWidth={fullWidth}\n      href={href}\n      loading={loading}\n      loadingPosition=\"start\"\n      size={size}\n      startIcon={startIcon}\n      // @ts-expect-error - target is not a valid prop for MuiButton\n      target={target}\n      tone={tone}\n      type={type}\n      variant={MUI_VARIANT_MAP[variant] as MuiButtonProps['variant']}\n    >\n      {children}\n    </StyledButton>\n  );\n};\n\nexport default Button;\n"],"names":["StyledButton","styled","MuiButton","shouldForwardProp","prop","includes","theme","customVariant","tone","casingOverride","fullWidth","styles","getButtonStyles","default","width","maxWidth","textTransform","transition","hover","outline","focus","press","disabled","cursor","MUI_VARIANT_MAP","primary","secondary","tertiary","Button","children","className","endIcon","fdKey","form","href","loading","onKeyDown","size","startIcon","target","type","variant","props","_jsx","disableRipple","loadingPosition"],"mappings":"4KA0BA,MAAMA,EAAeC,EAAOC,EAAW,CACrCC,kBAAoBC,IAAU,CAAC,iBAAkB,gBAAiB,QAAQC,SAASD,IADhEH,CAEkE,EACrFK,QACAC,gBAAgB,UAChBC,OAAO,QACPC,iBAAiB,OACjBC,aAAY,MAEZ,MAAMC,EAASC,EAAgBN,EAAOC,EAAeC,GAErD,MAAO,IACFG,EAAOE,QACVC,MAAOJ,EAAY,OAAS,cAC5BK,SAAUL,EAAY,OAAS,cAC/BM,cAAeP,EACfQ,WAAY,uBAEZ,UAAW,IAAKN,EAAOO,OACvB,UAAW,CACTC,QAAS,QAGX,kBAAmB,IAAKR,EAAOS,OAC/B,WAAY,IAAKT,EAAOU,OACxB,aAAc,IAAKV,EAAOW,SAAUC,OAAQ,kBAI1CC,EAAkB,CACtBC,QAAS,YACTC,UAAW,WACXC,SAAU,QAGCC,EAAS,EACpBnB,iBAAiB,OACjBoB,WACAC,YACAR,YAAW,EACXS,UACAC,QACAC,OACAvB,aAAY,EACZwB,OACAC,WAAU,EACVC,YACAC,OAAO,SACPC,YACAC,SACA/B,OACAgC,OAAO,SACPC,UAAU,aACPC,KAGDC,EAAC3C,EAAY,IACP0C,EACJE,eAAa,EACbnC,eAAgBA,EAChBqB,UAAWA,EACXvB,cAAekC,EAAO,UACbT,EAAK,YACHxB,EACXc,SAAUA,EACVS,QAASA,EACTE,KAAMA,EACNvB,UAAWA,EACXwB,KAAMA,EACNC,QAASA,EACTU,gBAAgB,QAChBR,KAAMA,EACNC,UAAWA,EAEXC,OAAQA,EACR/B,KAAMA,EACNgC,KAAMA,EACNC,QAASjB,EAAgBiB,GAAqCZ,SAE7DA"}

package/dist/components/atoms/Card/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("@mui/material/Box"),r=require("@mui/material/Card"),i=require("@mui/material/CardContent"),a=require("@mui/material/CardMedia"),n=require("@mui/material/styles"),s=require("@mui/material/Typography"),o=require("../../../icons/ArrowRight02/index.cjs.js"),l=require("../Badge/index.cjs.js"),d=require("../IconContainer/index.cjs.js"),c=require("../Link/index.cjs.js");const m=n.styled(r)((({theme:e,type:t})=>({borderRadius:e.radius["radius-16"],border:`1px solid ${e.palette.semantic.stroke["stroke-weak"]}`,..."horizontal"===t&&{display:"flex",flexDirection:"row",overflow:"hidden"}}))),h=n.styled(i)((({theme:e,type:t})=>({"&:last-child":{paddingBottom:e.spacing(2)},..."horizontal"===t&&{flex:1,display:"flex",flexDirection:"column",justifyContent:"space-between"}}))),p=n.styled(t)((({theme:e})=>({display:"flex",alignItems:"flex-start",gap:e.spacing(2),flex:1}))),x=n.styled(t)((()=>({flex:1,display:"flex",flexDirection:"column"}))),u=n.styled(s)((({theme:e})=>({marginBottom:e.spacing(1)}))),g=n.styled(s)((({theme:e})=>({color:e.palette.semantic.text["text-weak"]}))),y=n.styled(t)((({theme:e})=>({marginTop:e.spacing(1.5)}))),f=n.styled(c.Link)((({theme:e})=>({display:"flex",alignItems:"center",gap:e.spacing(1)}))),j=n.styled(a)((({theme:e,type:t})=>({..."horizontal"===t?{width:200,height:"auto",borderRight:`1px solid ${e.palette.semantic.stroke["stroke-weak"]}`,borderBottom:"none",flexShrink:0}:{height:204,borderBottom:`1px solid ${e.palette.semantic.stroke["stroke-weak"]}`}}))),k=n.styled(t,{shouldForwardProp:e=>!["hasIcon","hasBadge"].includes(e)})((({theme:e,hasIcon:t,hasBadge:r})=>({display:"flex",flexDirection:"row",justifyContent:r&&!t?"flex-end":"space-between",alignItems:"flex-start",gap:e.spacing(2),marginBottom:e.spacing(1.5)})));module.exports=({fdKey:t,heading:r,content:i,imageSrc:a,imageAlt:n,icon:s,badge:c,link:w,onMouseEnter:b,onMouseLeave:B,type:C="vertical",...q})=>{if(s&&(v=s,v?.type!==d))throw new Error("Card icon prop must be an IconContainer component");var v;if(c&&!(e=>e?.type===l.Badge)(c))throw new Error("Card badge prop must be a Badge component");const I=!!c||!!s,M=()=>w?e.jsx(y,{children:e.jsx(f,{fdKey:`card-link-${w.label}`,href:w.href,iconRight:e.jsx(o,{}),onClick:w.onClick,underline:!1,children:w.label})}):null,z=()=>r?e.jsx(u,{variant:"h4Strong",children:r}):null,D=()=>e.jsx(g,{variant:"b1Weak",children:i});return e.jsxs(m,{"data-fd":t,type:C,...q,onMouseEnter:b,onMouseLeave:B,children:[a?e.jsx(j,{alt:n||"",component:"img",image:a,type:C}):null,e.jsx(h,{type:C,children:"horizontal"===C?e.jsxs(e.Fragment,{children:[e.jsxs(p,{children:[s&&s,e.jsxs(x,{children:[z(),D()]}),c&&c]}),M()]}):e.jsxs(e.Fragment,{children:[I&&e.jsxs(k,{hasBadge:!!c,hasIcon:!!s,children:[s&&s,c&&c]}),z(),D(),M()]})})]})};
+"use strict";var e=require("react/jsx-runtime"),t=require("@mui/material/Box"),r=require("@mui/material/Card"),i=require("@mui/material/CardContent"),a=require("@mui/material/CardMedia"),n=require("@mui/material/styles"),s=require("@mui/material/Typography"),o=require("../../../icons/ArrowRight02/index.cjs.js"),l=require("../Badge/index.cjs.js"),d=require("../IconContainer/index.cjs.js"),c=require("../Link/index.cjs.js");const m=n.styled(r)(({theme:e,type:t})=>({borderRadius:e.radius["radius-16"],border:`1px solid ${e.palette.semantic.stroke["stroke-weak"]}`,..."horizontal"===t&&{display:"flex",flexDirection:"row",overflow:"hidden"}})),h=n.styled(i)(({theme:e,type:t})=>({"&:last-child":{paddingBottom:e.spacing(2)},..."horizontal"===t&&{flex:1,display:"flex",flexDirection:"column",justifyContent:"space-between"}})),p=n.styled(t)(({theme:e})=>({display:"flex",alignItems:"flex-start",gap:e.spacing(2),flex:1})),x=n.styled(t)(()=>({flex:1,display:"flex",flexDirection:"column"})),u=n.styled(s)(({theme:e})=>({marginBottom:e.spacing(1)})),g=n.styled(s)(({theme:e})=>({color:e.palette.semantic.text["text-weak"]})),y=n.styled(t)(({theme:e})=>({marginTop:e.spacing(1.5)})),f=n.styled(c.Link)(({theme:e})=>({display:"flex",alignItems:"center",gap:e.spacing(1)})),j=n.styled(a)(({theme:e,type:t})=>({..."horizontal"===t?{width:200,height:"auto",borderRight:`1px solid ${e.palette.semantic.stroke["stroke-weak"]}`,borderBottom:"none",flexShrink:0}:{height:204,borderBottom:`1px solid ${e.palette.semantic.stroke["stroke-weak"]}`}})),k=n.styled(t,{shouldForwardProp:e=>!["hasIcon","hasBadge"].includes(e)})(({theme:e,hasIcon:t,hasBadge:r})=>({display:"flex",flexDirection:"row",justifyContent:r&&!t?"flex-end":"space-between",alignItems:"flex-start",gap:e.spacing(2),marginBottom:e.spacing(1.5)}));module.exports=({fdKey:t,heading:r,content:i,imageSrc:a,imageAlt:n,icon:s,badge:c,link:w,onMouseEnter:b,onMouseLeave:B,type:C="vertical",...q})=>{if(s&&(v=s,v?.type!==d))throw new Error("Card icon prop must be an IconContainer component");var v;if(c&&!(e=>e?.type===l.Badge)(c))throw new Error("Card badge prop must be a Badge component");const I=!!c||!!s,M=()=>w?e.jsx(y,{children:e.jsx(f,{fdKey:`card-link-${w.label}`,href:w.href,iconRight:e.jsx(o,{}),onClick:w.onClick,underline:!1,children:w.label})}):null,z=()=>r?e.jsx(u,{variant:"h4Strong",children:r}):null,D=()=>e.jsx(g,{variant:"b1Weak",children:i});return e.jsxs(m,{"data-fd":t,type:C,...q,onMouseEnter:b,onMouseLeave:B,children:[a?e.jsx(j,{alt:n||"",component:"img",image:a,type:C}):null,e.jsx(h,{type:C,children:"horizontal"===C?e.jsxs(e.Fragment,{children:[e.jsxs(p,{children:[s&&s,e.jsxs(x,{children:[z(),D()]}),c&&c]}),M()]}):e.jsxs(e.Fragment,{children:[I&&e.jsxs(k,{hasBadge:!!c,hasIcon:!!s,children:[s&&s,c&&c]}),z(),D(),M()]})})]})};
 //# sourceMappingURL=index.cjs.js.map