@flipdish/portal-library 8.5.6 → 8.6.0

package/dist/components/molecules/TextBlock/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/molecules/TextBlock/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport IconContainer from '@fd/components/atoms/IconContainer';\nimport Link from '@fd/components/atoms/Link';\nimport Typography from '@fd/components/atoms/Typography';\n\n/**\n * Props for the TextBlock component.\n * Displays a flexible content block with optional icon, heading, secondary text, and link.\n */\nexport interface TextBlockProps {\n  /** Optional CSS class name for custom styling */\n  className?: string;\n  /** Controls visibility of the icon */\n  icon?: boolean;\n  /** Accessible label for the icon (used by screen readers) */\n  iconAriaLabel?: string;\n  /** Controls visibility of the heading */\n  heading?: boolean;\n  /** Controls visibility of the secondary text */\n  secondaryText?: boolean;\n  /** Controls visibility of the text link */\n  textLink?: boolean;\n  /** Text content for the heading */\n  headingValue?: string;\n  /** Text content for the secondary text */\n  secondaryTextValue?: string;\n  /** React node to render as the icon */\n  iconComponent?: React.ReactNode;\n  /** Text content for the link */\n  textLinkContent?: string;\n  /** URL for the text link */\n  textLinkHref?: string;\n  /** Horizontal alignment of content */\n  align?: 'center' | 'left';\n  /** Unique identifier for data-fd attribute */\n  fdKey?: string;\n}\n\nconst StyledContainer = styled(Box, {\n  shouldForwardProp: (prop) => !['align'].includes(prop as string),\n})<{ align?: 'center' | 'left' }>(({ theme, align = 'left' }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(2),\n  paddingTop: theme.spacing(2),\n  alignItems: align === 'center' ? 'center' : 'flex-start',\n  textAlign: align === 'center' ? 'center' : 'left',\n}));\n\nconst StyledTextContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(1),\n  width: '100%',\n}));\n\n/**\n * TextBlock component for displaying flexible content blocks with optional elements.\n *\n * This component provides a flexible layout for displaying content with optional icon,\n * heading, secondary text, and link elements. All elements can be individually controlled\n * for visibility and content, making it suitable for various use cases like feature cards,\n * informational blocks, or call-to-action sections.\n *\n * @param props - Component props\n * @returns A styled content block with optional icon, heading, secondary text, and link\n */\nexport const TextBlock: React.FC<TextBlockProps> = ({\n  className,\n  icon = true,\n  iconAriaLabel = 'Icon',\n  heading = true,\n  secondaryText = true,\n  textLink = true,\n  headingValue,\n  secondaryTextValue,\n  iconComponent,\n  textLinkContent = 'Label',\n  textLinkHref,\n  align = 'left',\n  fdKey,\n}) => {\n  // Validate textLinkHref when textLink is enabled\n  const isValidHref = textLinkHref && textLinkHref.trim() !== '' && textLinkHref !== '#';\n\n  if (import.meta.env.DEV && textLink && !isValidHref) {\n    console.warn(\n      'TextBlock: textLink is enabled but textLinkHref is missing, empty, or set to \"#\". ' +\n        'The link will not be rendered. Please provide a valid href when textLink is true.',\n    );\n  }\n\n  return (\n    <StyledContainer align={align} className={className} data-fd={fdKey}>\n      {icon && iconComponent && (\n        <IconContainer ariaLabel={iconAriaLabel} icon={iconComponent} style=\"filled\" tone=\"brand\" />\n      )}\n\n      {(heading || secondaryText) && (\n        <StyledTextContainer>\n          {heading && (\n            <Typography\n              sx={(theme) => ({\n                color: theme.palette.semantic?.text?.['text-strong'] || theme.palette.text.primary,\n                margin: 0,\n              })}\n              variant=\"h3Strong\"\n            >\n              {headingValue}\n            </Typography>\n          )}\n          {secondaryText && (\n            <Typography\n              sx={(theme) => ({\n                color: theme.palette.semantic?.text?.['text-weak'] || theme.palette.text.secondary,\n                margin: 0,\n              })}\n              variant=\"b1Weak\"\n            >\n              {secondaryTextValue}\n            </Typography>\n          )}\n        </StyledTextContainer>\n      )}\n\n      {textLink && isValidHref && (\n        <Link\n          fdKey={fdKey ? `${fdKey}-link` : 'text-block-link'}\n          href={textLinkHref}\n          size=\"body\"\n          sx={{ whiteSpace: 'nowrap' }}\n          tone=\"Brand\"\n          underline={true}\n          weight=\"bold\"\n        >\n          {textLinkContent}\n        </Link>\n      )}\n    </StyledContainer>\n  );\n};\n\nexport default TextBlock;\n"],"names":["StyledContainer","styled","Box","shouldForwardProp","prop","includes","theme","align","display","flexDirection","gap","spacing","paddingTop","alignItems","textAlign","StyledTextContainer","width","TextBlock","className","icon","iconAriaLabel","heading","secondaryText","textLink","headingValue","secondaryTextValue","iconComponent","textLinkContent","textLinkHref","fdKey","isValidHref","trim","undefined","DEV","console","warn","_jsxs","children","_jsx","IconContainer","ariaLabel","style","tone","Typography","sx","color","palette","semantic","text","primary","margin","variant","secondary","Link","href","size","whiteSpace","underline","weight"],"mappings":"kUA0CA,MAAMA,EAAkBC,EAAAA,OAAOC,EAAK,CAClCC,kBAAoBC,IAAU,CAAC,SAASC,SAASD,IAD3BH,EAEU,EAAGK,QAAOC,QAAQ,WAAQ,CAC1DC,QAAS,OACTC,cAAe,SACfC,IAAKJ,EAAMK,QAAQ,GACnBC,WAAYN,EAAMK,QAAQ,GAC1BE,WAAsB,WAAVN,EAAqB,SAAW,aAC5CO,UAAqB,WAAVP,EAAqB,SAAW,WAGvCQ,EAAsBd,EAAAA,OAAOC,EAAPD,EAAY,EAAGK,YAAO,CAChDE,QAAS,OACTC,cAAe,SACfC,IAAKJ,EAAMK,QAAQ,GACnBK,MAAO,WAcIC,EAAsC,EACjDC,YACAC,QAAO,EACPC,gBAAgB,OAChBC,WAAU,EACVC,iBAAgB,EAChBC,YAAW,EACXC,eACAC,qBACAC,gBACAC,kBAAkB,QAClBC,eACArB,QAAQ,OACRsB,YAGA,MAAMC,EAAcF,GAAwC,KAAxBA,EAAaG,QAAkC,MAAjBH,EASlE,YAPII,GAAgBC,KAAOV,IAAaO,GACtCI,QAAQC,KACN,uKAMFC,EAAAA,KAACpC,EAAe,CAACO,MAAOA,EAAOW,UAAWA,EAAS,UAAWW,EAAKQ,SAAA,CAChElB,GAAQO,GACPY,EAAAA,IAACC,EAAa,CAACC,UAAWpB,EAAeD,KAAMO,EAAee,MAAM,SAASC,KAAK,WAGlFrB,GAAWC,IACXc,EAAAA,KAACrB,EAAmB,CAAAsB,SAAA,CACjBhB,GACCiB,EAAAA,IAACK,EAAU,CACTC,GAAKtC,IAAK,CACRuC,MAAOvC,EAAMwC,QAAQC,UAAUC,OAAO,gBAAkB1C,EAAMwC,QAAQE,KAAKC,QAC3EC,OAAQ,IAEVC,QAAQ,oBAEP3B,IAGJF,GACCgB,EAAAA,IAACK,GACCC,GAAKtC,IAAK,CACRuC,MAAOvC,EAAMwC,QAAQC,UAAUC,OAAO,cAAgB1C,EAAMwC,QAAQE,KAAKI,UACzEF,OAAQ,IAEVC,QAAQ,SAAQd,SAEfZ,OAMRF,GAAYO,GACXQ,EAAAA,IAACe,EAAAA,KAAI,CACHxB,MAAOA,EAAQ,GAAGA,SAAe,kBACjCyB,KAAM1B,EACN2B,KAAK,OACLX,GAAI,CAAEY,WAAY,UAClBd,KAAK,QACLe,WAAW,EACXC,OAAO,OAAMrB,SAEZV"}
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/molecules/TextBlock/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport IconContainer from '@fd/components/atoms/IconContainer';\nimport Link from '@fd/components/atoms/Link';\nimport Typography from '@fd/components/atoms/Typography';\n\n/**\n * Props for the TextBlock component.\n * Displays a flexible content block with optional icon, heading, secondary text, and link.\n */\nexport interface TextBlockProps {\n  /** Optional CSS class name for custom styling */\n  className?: string;\n  /** Controls visibility of the icon */\n  icon?: boolean;\n  /** Accessible label for the icon (used by screen readers) */\n  iconAriaLabel?: string;\n  /** Controls visibility of the heading */\n  heading?: boolean;\n  /** Controls visibility of the secondary text */\n  secondaryText?: boolean;\n  /** Controls visibility of the text link */\n  textLink?: boolean;\n  /** Text content for the heading */\n  headingValue?: string;\n  /** Text content for the secondary text */\n  secondaryTextValue?: string;\n  /** React node to render as the icon */\n  iconComponent?: React.ReactNode;\n  /** Text content for the link */\n  textLinkContent?: string;\n  /** URL for the text link */\n  textLinkHref?: string;\n  /** Horizontal alignment of content */\n  align?: 'center' | 'left';\n  /** Unique identifier for data-fd attribute */\n  fdKey?: string;\n}\n\nconst StyledContainer = styled(Box, {\n  shouldForwardProp: (prop) => !['align'].includes(prop as string),\n})<{ align?: 'center' | 'left' }>(({ theme, align = 'left' }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(2),\n  paddingTop: theme.spacing(2),\n  alignItems: align === 'center' ? 'center' : 'flex-start',\n  textAlign: align === 'center' ? 'center' : 'left',\n}));\n\nconst StyledTextContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(1),\n  width: '100%',\n}));\n\n/**\n * TextBlock component for displaying flexible content blocks with optional elements.\n *\n * This component provides a flexible layout for displaying content with optional icon,\n * heading, secondary text, and link elements. All elements can be individually controlled\n * for visibility and content, making it suitable for various use cases like feature cards,\n * informational blocks, or call-to-action sections.\n *\n * @param props - Component props\n * @returns A styled content block with optional icon, heading, secondary text, and link\n */\nexport const TextBlock: React.FC<TextBlockProps> = ({\n  className,\n  icon = true,\n  iconAriaLabel = 'Icon',\n  heading = true,\n  secondaryText = true,\n  textLink = true,\n  headingValue,\n  secondaryTextValue,\n  iconComponent,\n  textLinkContent = 'Label',\n  textLinkHref,\n  align = 'left',\n  fdKey,\n}) => {\n  // Validate textLinkHref when textLink is enabled\n  const isValidHref = textLinkHref && textLinkHref.trim() !== '' && textLinkHref !== '#';\n\n  if (import.meta.env.DEV && textLink && !isValidHref) {\n    console.warn(\n      'TextBlock: textLink is enabled but textLinkHref is missing, empty, or set to \"#\". ' +\n        'The link will not be rendered. Please provide a valid href when textLink is true.',\n    );\n  }\n\n  return (\n    <StyledContainer align={align} className={className} data-fd={fdKey}>\n      {icon && iconComponent && (\n        <IconContainer ariaLabel={iconAriaLabel} icon={iconComponent} style=\"filled\" tone=\"brand\" />\n      )}\n\n      {(heading || secondaryText) && (\n        <StyledTextContainer>\n          {heading && (\n            <Typography\n              sx={(theme) => ({\n                color: theme.palette.semantic?.text?.['text-strong'] || theme.palette.text.primary,\n                margin: 0,\n              })}\n              variant=\"h3Strong\"\n            >\n              {headingValue}\n            </Typography>\n          )}\n          {secondaryText && (\n            <Typography\n              sx={(theme) => ({\n                color: theme.palette.semantic?.text?.['text-weak'] || theme.palette.text.secondary,\n                margin: 0,\n              })}\n              variant=\"b1Weak\"\n            >\n              {secondaryTextValue}\n            </Typography>\n          )}\n        </StyledTextContainer>\n      )}\n\n      {textLink && isValidHref && (\n        <Link\n          fdKey={fdKey ? `${fdKey}-link` : 'text-block-link'}\n          href={textLinkHref}\n          size=\"body\"\n          sx={{ whiteSpace: 'nowrap' }}\n          tone=\"Brand\"\n          underline={true}\n          weight=\"bold\"\n        >\n          {textLinkContent}\n        </Link>\n      )}\n    </StyledContainer>\n  );\n};\n\nexport default TextBlock;\n"],"names":["StyledContainer","styled","Box","shouldForwardProp","prop","includes","theme","align","display","flexDirection","gap","spacing","paddingTop","alignItems","textAlign","StyledTextContainer","width","TextBlock","className","icon","iconAriaLabel","heading","secondaryText","textLink","headingValue","secondaryTextValue","iconComponent","textLinkContent","textLinkHref","fdKey","isValidHref","trim","undefined","DEV","console","warn","_jsxs","children","_jsx","IconContainer","ariaLabel","style","tone","Typography","sx","color","palette","semantic","text","primary","margin","variant","secondary","Link","href","size","whiteSpace","underline","weight"],"mappings":"kUA0CA,MAAMA,EAAkBC,EAAAA,OAAOC,EAAK,CAClCC,kBAAoBC,IAAU,CAAC,SAASC,SAASD,IAD3BH,CAEU,EAAGK,QAAOC,QAAQ,WAAQ,CAC1DC,QAAS,OACTC,cAAe,SACfC,IAAKJ,EAAMK,QAAQ,GACnBC,WAAYN,EAAMK,QAAQ,GAC1BE,WAAsB,WAAVN,EAAqB,SAAW,aAC5CO,UAAqB,WAAVP,EAAqB,SAAW,UAGvCQ,EAAsBd,EAAAA,OAAOC,EAAPD,CAAY,EAAGK,YAAO,CAChDE,QAAS,OACTC,cAAe,SACfC,IAAKJ,EAAMK,QAAQ,GACnBK,MAAO,UAcIC,EAAsC,EACjDC,YACAC,QAAO,EACPC,gBAAgB,OAChBC,WAAU,EACVC,iBAAgB,EAChBC,YAAW,EACXC,eACAC,qBACAC,gBACAC,kBAAkB,QAClBC,eACArB,QAAQ,OACRsB,YAGA,MAAMC,EAAcF,GAAwC,KAAxBA,EAAaG,QAAkC,MAAjBH,EASlE,YAPII,GAAgBC,KAAOV,IAAaO,GACtCI,QAAQC,KACN,uKAMFC,EAAAA,KAACpC,EAAe,CAACO,MAAOA,EAAOW,UAAWA,EAAS,UAAWW,EAAKQ,SAAA,CAChElB,GAAQO,GACPY,EAAAA,IAACC,EAAa,CAACC,UAAWpB,EAAeD,KAAMO,EAAee,MAAM,SAASC,KAAK,WAGlFrB,GAAWC,IACXc,EAAAA,KAACrB,EAAmB,CAAAsB,SAAA,CACjBhB,GACCiB,EAAAA,IAACK,EAAU,CACTC,GAAKtC,IAAK,CACRuC,MAAOvC,EAAMwC,QAAQC,UAAUC,OAAO,gBAAkB1C,EAAMwC,QAAQE,KAAKC,QAC3EC,OAAQ,IAEVC,QAAQ,oBAEP3B,IAGJF,GACCgB,EAAAA,IAACK,GACCC,GAAKtC,IAAK,CACRuC,MAAOvC,EAAMwC,QAAQC,UAAUC,OAAO,cAAgB1C,EAAMwC,QAAQE,KAAKI,UACzEF,OAAQ,IAEVC,QAAQ,SAAQd,SAEfZ,OAMRF,GAAYO,GACXQ,EAAAA,IAACe,EAAAA,KAAI,CACHxB,MAAOA,EAAQ,GAAGA,SAAe,kBACjCyB,KAAM1B,EACN2B,KAAK,OACLX,GAAI,CAAEY,WAAY,UAClBd,KAAK,QACLe,WAAW,EACXC,OAAO,OAAMrB,SAEZV"}

package/dist/components/molecules/TextBlock/index.js

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import"react";import{styled as i}from"@mui/material/styles";import n from"@mui/material/Box";import a from"../../atoms/IconContainer/index.js";import{Link as r}from"../../atoms/Link/index.js";import o from"@mui/material/Typography";const l=i(n,{shouldForwardProp:e=>!["align"].includes(e)})((({theme:e,align:t="left"})=>({display:"flex",flexDirection:"column",gap:e.spacing(2),paddingTop:e.spacing(2),alignItems:"center"===t?"center":"flex-start",textAlign:"center"===t?"center":"left"}))),s=i(n)((({theme:e})=>({display:"flex",flexDirection:"column",gap:e.spacing(1),width:"100%"}))),c=({className:i,icon:n=!0,iconAriaLabel:c="Icon",heading:m=!0,secondaryText:d=!0,textLink:p=!0,headingValue:x,secondaryTextValue:f,iconComponent:g,textLinkContent:h="Label",textLinkHref:u,align:k="left",fdKey:y})=>{const b=u&&""!==u.trim()&&"#"!==u;return import.meta.env.DEV&&p&&!b&&console.warn('TextBlock: textLink is enabled but textLinkHref is missing, empty, or set to "#". The link will not be rendered. Please provide a valid href when textLink is true.'),e(l,{align:k,className:i,"data-fd":y,children:[n&&g&&t(a,{ariaLabel:c,icon:g,style:"filled",tone:"brand"}),(m||d)&&e(s,{children:[m&&t(o,{sx:e=>({color:e.palette.semantic?.text?.["text-strong"]||e.palette.text.primary,margin:0}),variant:"h3Strong",children:x}),d&&t(o,{sx:e=>({color:e.palette.semantic?.text?.["text-weak"]||e.palette.text.secondary,margin:0}),variant:"b1Weak",children:f})]}),p&&b&&t(r,{fdKey:y?`${y}-link`:"text-block-link",href:u,size:"body",sx:{whiteSpace:"nowrap"},tone:"Brand",underline:!0,weight:"bold",children:h})]})};export{c as TextBlock,c as default};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import"react";import{styled as i}from"@mui/material/styles";import n from"@mui/material/Box";import a from"../../atoms/IconContainer/index.js";import{Link as r}from"../../atoms/Link/index.js";import o from"@mui/material/Typography";const l=i(n,{shouldForwardProp:e=>!["align"].includes(e)})(({theme:e,align:t="left"})=>({display:"flex",flexDirection:"column",gap:e.spacing(2),paddingTop:e.spacing(2),alignItems:"center"===t?"center":"flex-start",textAlign:"center"===t?"center":"left"})),s=i(n)(({theme:e})=>({display:"flex",flexDirection:"column",gap:e.spacing(1),width:"100%"})),c=({className:i,icon:n=!0,iconAriaLabel:c="Icon",heading:m=!0,secondaryText:d=!0,textLink:p=!0,headingValue:x,secondaryTextValue:f,iconComponent:g,textLinkContent:h="Label",textLinkHref:u,align:k="left",fdKey:y})=>{const b=u&&""!==u.trim()&&"#"!==u;return import.meta.env.DEV&&p&&!b&&console.warn('TextBlock: textLink is enabled but textLinkHref is missing, empty, or set to "#". The link will not be rendered. Please provide a valid href when textLink is true.'),e(l,{align:k,className:i,"data-fd":y,children:[n&&g&&t(a,{ariaLabel:c,icon:g,style:"filled",tone:"brand"}),(m||d)&&e(s,{children:[m&&t(o,{sx:e=>({color:e.palette.semantic?.text?.["text-strong"]||e.palette.text.primary,margin:0}),variant:"h3Strong",children:x}),d&&t(o,{sx:e=>({color:e.palette.semantic?.text?.["text-weak"]||e.palette.text.secondary,margin:0}),variant:"b1Weak",children:f})]}),p&&b&&t(r,{fdKey:y?`${y}-link`:"text-block-link",href:u,size:"body",sx:{whiteSpace:"nowrap"},tone:"Brand",underline:!0,weight:"bold",children:h})]})};export{c as TextBlock,c as default};
 //# sourceMappingURL=index.js.map

package/dist/components/molecules/TextBlock/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/molecules/TextBlock/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport IconContainer from '@fd/components/atoms/IconContainer';\nimport Link from '@fd/components/atoms/Link';\nimport Typography from '@fd/components/atoms/Typography';\n\n/**\n * Props for the TextBlock component.\n * Displays a flexible content block with optional icon, heading, secondary text, and link.\n */\nexport interface TextBlockProps {\n  /** Optional CSS class name for custom styling */\n  className?: string;\n  /** Controls visibility of the icon */\n  icon?: boolean;\n  /** Accessible label for the icon (used by screen readers) */\n  iconAriaLabel?: string;\n  /** Controls visibility of the heading */\n  heading?: boolean;\n  /** Controls visibility of the secondary text */\n  secondaryText?: boolean;\n  /** Controls visibility of the text link */\n  textLink?: boolean;\n  /** Text content for the heading */\n  headingValue?: string;\n  /** Text content for the secondary text */\n  secondaryTextValue?: string;\n  /** React node to render as the icon */\n  iconComponent?: React.ReactNode;\n  /** Text content for the link */\n  textLinkContent?: string;\n  /** URL for the text link */\n  textLinkHref?: string;\n  /** Horizontal alignment of content */\n  align?: 'center' | 'left';\n  /** Unique identifier for data-fd attribute */\n  fdKey?: string;\n}\n\nconst StyledContainer = styled(Box, {\n  shouldForwardProp: (prop) => !['align'].includes(prop as string),\n})<{ align?: 'center' | 'left' }>(({ theme, align = 'left' }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(2),\n  paddingTop: theme.spacing(2),\n  alignItems: align === 'center' ? 'center' : 'flex-start',\n  textAlign: align === 'center' ? 'center' : 'left',\n}));\n\nconst StyledTextContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(1),\n  width: '100%',\n}));\n\n/**\n * TextBlock component for displaying flexible content blocks with optional elements.\n *\n * This component provides a flexible layout for displaying content with optional icon,\n * heading, secondary text, and link elements. All elements can be individually controlled\n * for visibility and content, making it suitable for various use cases like feature cards,\n * informational blocks, or call-to-action sections.\n *\n * @param props - Component props\n * @returns A styled content block with optional icon, heading, secondary text, and link\n */\nexport const TextBlock: React.FC<TextBlockProps> = ({\n  className,\n  icon = true,\n  iconAriaLabel = 'Icon',\n  heading = true,\n  secondaryText = true,\n  textLink = true,\n  headingValue,\n  secondaryTextValue,\n  iconComponent,\n  textLinkContent = 'Label',\n  textLinkHref,\n  align = 'left',\n  fdKey,\n}) => {\n  // Validate textLinkHref when textLink is enabled\n  const isValidHref = textLinkHref && textLinkHref.trim() !== '' && textLinkHref !== '#';\n\n  if (import.meta.env.DEV && textLink && !isValidHref) {\n    console.warn(\n      'TextBlock: textLink is enabled but textLinkHref is missing, empty, or set to \"#\". ' +\n        'The link will not be rendered. Please provide a valid href when textLink is true.',\n    );\n  }\n\n  return (\n    <StyledContainer align={align} className={className} data-fd={fdKey}>\n      {icon && iconComponent && (\n        <IconContainer ariaLabel={iconAriaLabel} icon={iconComponent} style=\"filled\" tone=\"brand\" />\n      )}\n\n      {(heading || secondaryText) && (\n        <StyledTextContainer>\n          {heading && (\n            <Typography\n              sx={(theme) => ({\n                color: theme.palette.semantic?.text?.['text-strong'] || theme.palette.text.primary,\n                margin: 0,\n              })}\n              variant=\"h3Strong\"\n            >\n              {headingValue}\n            </Typography>\n          )}\n          {secondaryText && (\n            <Typography\n              sx={(theme) => ({\n                color: theme.palette.semantic?.text?.['text-weak'] || theme.palette.text.secondary,\n                margin: 0,\n              })}\n              variant=\"b1Weak\"\n            >\n              {secondaryTextValue}\n            </Typography>\n          )}\n        </StyledTextContainer>\n      )}\n\n      {textLink && isValidHref && (\n        <Link\n          fdKey={fdKey ? `${fdKey}-link` : 'text-block-link'}\n          href={textLinkHref}\n          size=\"body\"\n          sx={{ whiteSpace: 'nowrap' }}\n          tone=\"Brand\"\n          underline={true}\n          weight=\"bold\"\n        >\n          {textLinkContent}\n        </Link>\n      )}\n    </StyledContainer>\n  );\n};\n\nexport default TextBlock;\n"],"names":["StyledContainer","styled","Box","shouldForwardProp","prop","includes","theme","align","display","flexDirection","gap","spacing","paddingTop","alignItems","textAlign","StyledTextContainer","width","TextBlock","className","icon","iconAriaLabel","heading","secondaryText","textLink","headingValue","secondaryTextValue","iconComponent","textLinkContent","textLinkHref","fdKey","isValidHref","trim","env","DEV","console","warn","_jsxs","children","_jsx","IconContainer","ariaLabel","style","tone","Typography","sx","color","palette","semantic","text","primary","margin","variant","secondary","Link","href","size","whiteSpace","underline","weight"],"mappings":"0RA0CA,MAAMA,EAAkBC,EAAOC,EAAK,CAClCC,kBAAoBC,IAAU,CAAC,SAASC,SAASD,IAD3BH,EAEU,EAAGK,QAAOC,QAAQ,WAAQ,CAC1DC,QAAS,OACTC,cAAe,SACfC,IAAKJ,EAAMK,QAAQ,GACnBC,WAAYN,EAAMK,QAAQ,GAC1BE,WAAsB,WAAVN,EAAqB,SAAW,aAC5CO,UAAqB,WAAVP,EAAqB,SAAW,WAGvCQ,EAAsBd,EAAOC,EAAPD,EAAY,EAAGK,YAAO,CAChDE,QAAS,OACTC,cAAe,SACfC,IAAKJ,EAAMK,QAAQ,GACnBK,MAAO,WAcIC,EAAsC,EACjDC,YACAC,QAAO,EACPC,gBAAgB,OAChBC,WAAU,EACVC,iBAAgB,EAChBC,YAAW,EACXC,eACAC,qBACAC,gBACAC,kBAAkB,QAClBC,eACArB,QAAQ,OACRsB,YAGA,MAAMC,EAAcF,GAAwC,KAAxBA,EAAaG,QAAkC,MAAjBH,EASlE,mBAPgBI,IAAIC,KAAOV,IAAaO,GACtCI,QAAQC,KACN,uKAMFC,EAACpC,EAAe,CAACO,MAAOA,EAAOW,UAAWA,EAAS,UAAWW,EAAKQ,SAAA,CAChElB,GAAQO,GACPY,EAACC,EAAa,CAACC,UAAWpB,EAAeD,KAAMO,EAAee,MAAM,SAASC,KAAK,WAGlFrB,GAAWC,IACXc,EAACrB,EAAmB,CAAAsB,SAAA,CACjBhB,GACCiB,EAACK,EAAU,CACTC,GAAKtC,IAAK,CACRuC,MAAOvC,EAAMwC,QAAQC,UAAUC,OAAO,gBAAkB1C,EAAMwC,QAAQE,KAAKC,QAC3EC,OAAQ,IAEVC,QAAQ,oBAEP3B,IAGJF,GACCgB,EAACK,GACCC,GAAKtC,IAAK,CACRuC,MAAOvC,EAAMwC,QAAQC,UAAUC,OAAO,cAAgB1C,EAAMwC,QAAQE,KAAKI,UACzEF,OAAQ,IAEVC,QAAQ,SAAQd,SAEfZ,OAMRF,GAAYO,GACXQ,EAACe,EAAI,CACHxB,MAAOA,EAAQ,GAAGA,SAAe,kBACjCyB,KAAM1B,EACN2B,KAAK,OACLX,GAAI,CAAEY,WAAY,UAClBd,KAAK,QACLe,WAAW,EACXC,OAAO,OAAMrB,SAEZV"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/molecules/TextBlock/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport IconContainer from '@fd/components/atoms/IconContainer';\nimport Link from '@fd/components/atoms/Link';\nimport Typography from '@fd/components/atoms/Typography';\n\n/**\n * Props for the TextBlock component.\n * Displays a flexible content block with optional icon, heading, secondary text, and link.\n */\nexport interface TextBlockProps {\n  /** Optional CSS class name for custom styling */\n  className?: string;\n  /** Controls visibility of the icon */\n  icon?: boolean;\n  /** Accessible label for the icon (used by screen readers) */\n  iconAriaLabel?: string;\n  /** Controls visibility of the heading */\n  heading?: boolean;\n  /** Controls visibility of the secondary text */\n  secondaryText?: boolean;\n  /** Controls visibility of the text link */\n  textLink?: boolean;\n  /** Text content for the heading */\n  headingValue?: string;\n  /** Text content for the secondary text */\n  secondaryTextValue?: string;\n  /** React node to render as the icon */\n  iconComponent?: React.ReactNode;\n  /** Text content for the link */\n  textLinkContent?: string;\n  /** URL for the text link */\n  textLinkHref?: string;\n  /** Horizontal alignment of content */\n  align?: 'center' | 'left';\n  /** Unique identifier for data-fd attribute */\n  fdKey?: string;\n}\n\nconst StyledContainer = styled(Box, {\n  shouldForwardProp: (prop) => !['align'].includes(prop as string),\n})<{ align?: 'center' | 'left' }>(({ theme, align = 'left' }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(2),\n  paddingTop: theme.spacing(2),\n  alignItems: align === 'center' ? 'center' : 'flex-start',\n  textAlign: align === 'center' ? 'center' : 'left',\n}));\n\nconst StyledTextContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(1),\n  width: '100%',\n}));\n\n/**\n * TextBlock component for displaying flexible content blocks with optional elements.\n *\n * This component provides a flexible layout for displaying content with optional icon,\n * heading, secondary text, and link elements. All elements can be individually controlled\n * for visibility and content, making it suitable for various use cases like feature cards,\n * informational blocks, or call-to-action sections.\n *\n * @param props - Component props\n * @returns A styled content block with optional icon, heading, secondary text, and link\n */\nexport const TextBlock: React.FC<TextBlockProps> = ({\n  className,\n  icon = true,\n  iconAriaLabel = 'Icon',\n  heading = true,\n  secondaryText = true,\n  textLink = true,\n  headingValue,\n  secondaryTextValue,\n  iconComponent,\n  textLinkContent = 'Label',\n  textLinkHref,\n  align = 'left',\n  fdKey,\n}) => {\n  // Validate textLinkHref when textLink is enabled\n  const isValidHref = textLinkHref && textLinkHref.trim() !== '' && textLinkHref !== '#';\n\n  if (import.meta.env.DEV && textLink && !isValidHref) {\n    console.warn(\n      'TextBlock: textLink is enabled but textLinkHref is missing, empty, or set to \"#\". ' +\n        'The link will not be rendered. Please provide a valid href when textLink is true.',\n    );\n  }\n\n  return (\n    <StyledContainer align={align} className={className} data-fd={fdKey}>\n      {icon && iconComponent && (\n        <IconContainer ariaLabel={iconAriaLabel} icon={iconComponent} style=\"filled\" tone=\"brand\" />\n      )}\n\n      {(heading || secondaryText) && (\n        <StyledTextContainer>\n          {heading && (\n            <Typography\n              sx={(theme) => ({\n                color: theme.palette.semantic?.text?.['text-strong'] || theme.palette.text.primary,\n                margin: 0,\n              })}\n              variant=\"h3Strong\"\n            >\n              {headingValue}\n            </Typography>\n          )}\n          {secondaryText && (\n            <Typography\n              sx={(theme) => ({\n                color: theme.palette.semantic?.text?.['text-weak'] || theme.palette.text.secondary,\n                margin: 0,\n              })}\n              variant=\"b1Weak\"\n            >\n              {secondaryTextValue}\n            </Typography>\n          )}\n        </StyledTextContainer>\n      )}\n\n      {textLink && isValidHref && (\n        <Link\n          fdKey={fdKey ? `${fdKey}-link` : 'text-block-link'}\n          href={textLinkHref}\n          size=\"body\"\n          sx={{ whiteSpace: 'nowrap' }}\n          tone=\"Brand\"\n          underline={true}\n          weight=\"bold\"\n        >\n          {textLinkContent}\n        </Link>\n      )}\n    </StyledContainer>\n  );\n};\n\nexport default TextBlock;\n"],"names":["StyledContainer","styled","Box","shouldForwardProp","prop","includes","theme","align","display","flexDirection","gap","spacing","paddingTop","alignItems","textAlign","StyledTextContainer","width","TextBlock","className","icon","iconAriaLabel","heading","secondaryText","textLink","headingValue","secondaryTextValue","iconComponent","textLinkContent","textLinkHref","fdKey","isValidHref","trim","env","DEV","console","warn","_jsxs","children","_jsx","IconContainer","ariaLabel","style","tone","Typography","sx","color","palette","semantic","text","primary","margin","variant","secondary","Link","href","size","whiteSpace","underline","weight"],"mappings":"0RA0CA,MAAMA,EAAkBC,EAAOC,EAAK,CAClCC,kBAAoBC,IAAU,CAAC,SAASC,SAASD,IAD3BH,CAEU,EAAGK,QAAOC,QAAQ,WAAQ,CAC1DC,QAAS,OACTC,cAAe,SACfC,IAAKJ,EAAMK,QAAQ,GACnBC,WAAYN,EAAMK,QAAQ,GAC1BE,WAAsB,WAAVN,EAAqB,SAAW,aAC5CO,UAAqB,WAAVP,EAAqB,SAAW,UAGvCQ,EAAsBd,EAAOC,EAAPD,CAAY,EAAGK,YAAO,CAChDE,QAAS,OACTC,cAAe,SACfC,IAAKJ,EAAMK,QAAQ,GACnBK,MAAO,UAcIC,EAAsC,EACjDC,YACAC,QAAO,EACPC,gBAAgB,OAChBC,WAAU,EACVC,iBAAgB,EAChBC,YAAW,EACXC,eACAC,qBACAC,gBACAC,kBAAkB,QAClBC,eACArB,QAAQ,OACRsB,YAGA,MAAMC,EAAcF,GAAwC,KAAxBA,EAAaG,QAAkC,MAAjBH,EASlE,mBAPgBI,IAAIC,KAAOV,IAAaO,GACtCI,QAAQC,KACN,uKAMFC,EAACpC,EAAe,CAACO,MAAOA,EAAOW,UAAWA,EAAS,UAAWW,EAAKQ,SAAA,CAChElB,GAAQO,GACPY,EAACC,EAAa,CAACC,UAAWpB,EAAeD,KAAMO,EAAee,MAAM,SAASC,KAAK,WAGlFrB,GAAWC,IACXc,EAACrB,EAAmB,CAAAsB,SAAA,CACjBhB,GACCiB,EAACK,EAAU,CACTC,GAAKtC,IAAK,CACRuC,MAAOvC,EAAMwC,QAAQC,UAAUC,OAAO,gBAAkB1C,EAAMwC,QAAQE,KAAKC,QAC3EC,OAAQ,IAEVC,QAAQ,oBAEP3B,IAGJF,GACCgB,EAACK,GACCC,GAAKtC,IAAK,CACRuC,MAAOvC,EAAMwC,QAAQC,UAAUC,OAAO,cAAgB1C,EAAMwC,QAAQE,KAAKI,UACzEF,OAAQ,IAEVC,QAAQ,SAAQd,SAEfZ,OAMRF,GAAYO,GACXQ,EAACe,EAAI,CACHxB,MAAOA,EAAQ,GAAGA,SAAe,kBACjCyB,KAAM1B,EACN2B,KAAK,OACLX,GAAI,CAAEY,WAAY,UAClBd,KAAK,QACLe,WAAW,EACXC,OAAO,OAAMrB,SAEZV"}

package/dist/components/molecules/Tooltip/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/Box"),i=require("@mui/material/styles"),r=require("@mui/material/Tooltip"),n=require("../../atoms/Button/index.cjs.js"),a=require("../../atoms/Link/index.cjs.js"),o=require("@mui/material/Typography"),s=require("../ButtonGroup/index.cjs.js");const l=e=>({"bottom-right":"top-end","bottom-left":"top-start","bottom-center":"top",left:"left",right:"right"}[e]??"top"),c=i.styled((({className:t,...i})=>e.jsx(r,{...i,classes:{popper:t}})),{shouldForwardProp:e=>"isLarge"!==e})((({theme:e,isLarge:t})=>({"& .MuiTooltip-tooltip":{backgroundColor:e.palette.semantic.background["background-inverse"],color:e.palette.semantic.text["text-weak"],borderRadius:e.radius["radius-8"],paddingLeft:e.spacing(2),paddingRight:e.spacing(2),paddingTop:t?e.spacing(2):e.spacing(1),paddingBottom:t?e.spacing(2):e.spacing(1),width:t?"332px":"auto",boxShadow:e.customShadows?.overlay},"& .MuiTooltip-arrow":{color:e.palette.semantic.background["background-inverse"]}}))),d=i.styled(t)((({theme:e})=>({display:"flex",flexDirection:"column",marginTop:e.spacing(.5),gap:e.spacing(1),alignItems:"flex-start",justifyContent:"center",width:"100%"}))),p=i.styled(t)((()=>({display:"flex",alignItems:"center",width:"100%",justifyContent:"space-between"}))),u=i.styled(o)((({theme:e})=>({color:e.palette.semantic.text["text-inverse-strong"]}))),g=i.styled(o)((({theme:e})=>({color:e.palette.semantic.text["text-inverse-weak"]}))),m=i.styled(t)((()=>({display:"flex",justifyContent:"flex-end",flexGrow:1}))),x=({children:t,title:i,description:r,textLink:o,size:x="small",actionButtons:h,placement:f="bottom-center",...y})=>{const j="large"===x,b=Boolean(o||h),k=e.jsxs(e.Fragment,{children:[e.jsx(u,{variant:j?"captionStrong":"captionWeak",children:i}),j&&r&&e.jsxs(d,{children:[e.jsx(g,{variant:"captionWeak",children:r}),b&&e.jsxs(p,{children:[(()=>{if(o)return e.jsx(a.Link,{fdKey:o.fdKey,href:o.href,iconLeft:o.iconLeft,iconRight:o.iconRight,size:"caption",tone:"Inverse Strong",underline:!1,weight:"bold",children:o.children})})(),(()=>{if(h)return Array.isArray(h)?e.jsx(s,{align:"right",layout:"horizontal",order:"default",size:"small",children:h.map(((t,i)=>{const r=`action-button-${i}`;return e.jsx(n.Button,{fdKey:t.label,onClick:t.onClick,tone:"inverse",variant:t.variant,children:t.label},r)}))}):e.jsx(m,{children:e.jsx(n.Button,{fdKey:h.label,onClick:h.onClick,size:"small",tone:"inverse",variant:h.variant,children:h.label})})})()]})]})]});return e.jsx(c,{...y,arrow:!0,isLarge:j,placement:l(f),title:k,children:t})};exports.Tooltip=x,exports.default=x;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@mui/material/Box"),i=require("@mui/material/styles"),r=require("@mui/material/Tooltip"),n=require("../../atoms/Button/index.cjs.js"),a=require("../../atoms/Link/index.cjs.js"),o=require("@mui/material/Typography"),s=require("../ButtonGroup/index.cjs.js");const l=e=>({"bottom-right":"top-end","bottom-left":"top-start","bottom-center":"top",left:"left",right:"right"}[e]??"top"),c=i.styled(({className:t,...i})=>e.jsx(r,{...i,classes:{popper:t}}),{shouldForwardProp:e=>"isLarge"!==e})(({theme:e,isLarge:t})=>({"& .MuiTooltip-tooltip":{backgroundColor:e.palette.semantic.background["background-inverse"],color:e.palette.semantic.text["text-weak"],borderRadius:e.radius["radius-8"],paddingLeft:e.spacing(2),paddingRight:e.spacing(2),paddingTop:t?e.spacing(2):e.spacing(1),paddingBottom:t?e.spacing(2):e.spacing(1),width:t?"332px":"auto",boxShadow:e.customShadows?.overlay},"& .MuiTooltip-arrow":{color:e.palette.semantic.background["background-inverse"]}})),d=i.styled(t)(({theme:e})=>({display:"flex",flexDirection:"column",marginTop:e.spacing(.5),gap:e.spacing(1),alignItems:"flex-start",justifyContent:"center",width:"100%"})),p=i.styled(t)(()=>({display:"flex",alignItems:"center",width:"100%",justifyContent:"space-between"})),u=i.styled(o)(({theme:e})=>({color:e.palette.semantic.text["text-inverse-strong"]})),g=i.styled(o)(({theme:e})=>({color:e.palette.semantic.text["text-inverse-weak"]})),m=i.styled(t)(()=>({display:"flex",justifyContent:"flex-end",flexGrow:1})),x=({children:t,title:i,description:r,textLink:o,size:x="small",actionButtons:h,placement:f="bottom-center",...y})=>{const j="large"===x,b=Boolean(o||h),k=e.jsxs(e.Fragment,{children:[e.jsx(u,{variant:j?"captionStrong":"captionWeak",children:i}),j&&r&&e.jsxs(d,{children:[e.jsx(g,{variant:"captionWeak",children:r}),b&&e.jsxs(p,{children:[(()=>{if(o)return e.jsx(a.Link,{fdKey:o.fdKey,href:o.href,iconLeft:o.iconLeft,iconRight:o.iconRight,size:"caption",tone:"Inverse Strong",underline:!1,weight:"bold",children:o.children})})(),(()=>{if(h)return Array.isArray(h)?e.jsx(s,{align:"right",layout:"horizontal",order:"default",size:"small",children:h.map((t,i)=>{const r=`action-button-${i}`;return e.jsx(n.Button,{fdKey:t.label,onClick:t.onClick,tone:"inverse",variant:t.variant,children:t.label},r)})}):e.jsx(m,{children:e.jsx(n.Button,{fdKey:h.label,onClick:h.onClick,size:"small",tone:"inverse",variant:h.variant,children:h.label})})})()]})]})]});return e.jsx(c,{...y,arrow:!0,isLarge:j,placement:l(f),title:k,children:t})};exports.Tooltip=x,exports.default=x;
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/molecules/Tooltip/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/molecules/Tooltip/index.tsx"],"sourcesContent":["import Box from '@mui/material/Box';\nimport { styled } from '@mui/material/styles';\nimport MUITooltip, { type TooltipProps as MUITooltipProps } from '@mui/material/Tooltip';\n\nimport Button from '@fd/components/atoms/Button';\nimport type { ButtonType } from '@fd/components/atoms/Button/getButtonStyles';\nimport Link, { type StyledLinkProps } from '@fd/components/atoms/Link';\nimport Typography from '@fd/components/atoms/Typography';\nimport ButtonGroup from '@fd/components/molecules/ButtonGroup';\n\ntype TooltipPlacement = 'bottom-center' | 'bottom-left' | 'bottom-right' | 'left' | 'right';\n\n// Map custom placement values to MUI placement values\nconst mapPlacementToMUI = (placement: TooltipPlacement): MUITooltipProps['placement'] => {\n  const placementMap: Record<TooltipPlacement, MUITooltipProps['placement']> = {\n    'bottom-right': 'top-end',\n    'bottom-left': 'top-start',\n    'bottom-center': 'top',\n    left: 'left',\n    right: 'right',\n  };\n\n  return placementMap[placement] ?? 'top';\n};\n\nconst StyledTooltip = styled(\n  ({ className, ...props }: MUITooltipProps) => <MUITooltip {...props} classes={{ popper: className }} />,\n  { shouldForwardProp: (prop) => prop !== 'isLarge' },\n)<{ isLarge: boolean }>(({ theme, isLarge }) => ({\n  '& .MuiTooltip-tooltip': {\n    backgroundColor: theme.palette.semantic.background['background-inverse'],\n    color: theme.palette.semantic.text['text-weak'],\n    borderRadius: theme.radius['radius-8'],\n    paddingLeft: theme.spacing(2),\n    paddingRight: theme.spacing(2),\n    paddingTop: isLarge ? theme.spacing(2) : theme.spacing(1),\n    paddingBottom: isLarge ? theme.spacing(2) : theme.spacing(1),\n    width: isLarge ? '332px' : 'auto',\n    boxShadow: theme.customShadows?.overlay,\n  },\n  '& .MuiTooltip-arrow': {\n    color: theme.palette.semantic.background['background-inverse'],\n  },\n}));\n\nconst StyledTooltipContent = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  marginTop: theme.spacing(0.5),\n  gap: theme.spacing(1),\n  alignItems: 'flex-start',\n  justifyContent: 'center',\n  width: '100%',\n}));\n\nconst StyledTooltipActionContainer = styled(Box)(() => ({\n  display: 'flex',\n  alignItems: 'center',\n  width: '100%',\n  justifyContent: 'space-between',\n}));\n\nconst StyledTitle = styled(Typography)(({ theme }) => ({\n  color: theme.palette.semantic.text['text-inverse-strong'],\n}));\n\nconst StyledDescription = styled(Typography)(({ theme }) => ({\n  color: theme.palette.semantic.text['text-inverse-weak'],\n}));\n\nconst StyledSingleButtonContainer = styled(Box)(() => ({\n  display: 'flex',\n  justifyContent: 'flex-end',\n  flexGrow: 1,\n}));\n\n/** Props for the ActionButton component */\nexport interface ActionButton {\n  /** Text label for the action button */\n  label: string;\n  /** Visual variant of the action button */\n  variant?: ButtonType;\n  /** Callback function when the action button is clicked */\n  onClick: () => void;\n}\n\n/** Props for the Tooltip component */\nexport interface TooltipProps extends Omit<MUITooltipProps, 'arrow' | 'placement'> {\n  /** Placement of the tooltip */\n  placement?: TooltipPlacement;\n  /** Size of the tooltip */\n  size?: 'large' | 'small';\n  /** Description of the tooltip */\n  description?: string;\n  /** Action buttons of the tooltip */\n  actionButtons?: ActionButton | ActionButton[];\n  /** Text link of the tooltip */\n  textLink?: StyledLinkProps;\n}\n\n/**\n * A floating message that’s displayed on hover or press of an interactive element.\n *\n * @param props - The component props\n * @returns A component with a tooltip\n */\nexport const Tooltip = ({\n  children,\n  title,\n  description,\n  textLink,\n  size = 'small',\n  actionButtons,\n  placement = 'bottom-center',\n  ...props\n}: TooltipProps): JSX.Element => {\n  const isLarge = size === 'large';\n\n  const renderTextLink = (): React.ReactNode => {\n    if (!textLink) {\n      return undefined;\n    }\n\n    return (\n      <Link\n        fdKey={textLink.fdKey}\n        href={textLink.href}\n        iconLeft={textLink.iconLeft}\n        iconRight={textLink.iconRight}\n        size=\"caption\"\n        tone=\"Inverse Strong\"\n        underline={false}\n        weight=\"bold\"\n      >\n        {textLink.children}\n      </Link>\n    );\n  };\n\n  const renderActions = (): React.ReactNode => {\n    if (!actionButtons) {\n      return undefined;\n    }\n\n    if (Array.isArray(actionButtons)) {\n      return (\n        <ButtonGroup align=\"right\" layout=\"horizontal\" order=\"default\" size=\"small\">\n          {actionButtons.map((button, index) => {\n            const key = `action-button-${index}`;\n\n            return (\n              <Button\n                key={key}\n                fdKey={button.label}\n                onClick={button.onClick}\n                tone=\"inverse\"\n                variant={button.variant}\n              >\n                {button.label}\n              </Button>\n            );\n          })}\n        </ButtonGroup>\n      );\n    }\n\n    return (\n      <StyledSingleButtonContainer>\n        <Button\n          fdKey={actionButtons.label}\n          onClick={actionButtons.onClick}\n          size=\"small\"\n          tone=\"inverse\"\n          variant={actionButtons.variant}\n        >\n          {actionButtons.label}\n        </Button>\n      </StyledSingleButtonContainer>\n    );\n  };\n\n  const hasActionContent = Boolean(textLink || actionButtons);\n\n  const renderTooltipContent = (\n    <>\n      <StyledTitle variant={!isLarge ? 'captionWeak' : 'captionStrong'}>{title}</StyledTitle>\n      {isLarge && description && (\n        <StyledTooltipContent>\n          <StyledDescription variant=\"captionWeak\">{description}</StyledDescription>\n          {hasActionContent && (\n            <StyledTooltipActionContainer>\n              {renderTextLink()}\n              {renderActions()}\n            </StyledTooltipActionContainer>\n          )}\n        </StyledTooltipContent>\n      )}\n    </>\n  );\n\n  return (\n    <StyledTooltip\n      {...props}\n      arrow\n      isLarge={isLarge}\n      placement={mapPlacementToMUI(placement)}\n      title={renderTooltipContent}\n    >\n      {children}\n    </StyledTooltip>\n  );\n};\n\nexport default Tooltip;\n"],"names":["mapPlacementToMUI","placement","left","right","StyledTooltip","styled","className","props","_jsx","MUITooltip","classes","popper","shouldForwardProp","prop","theme","isLarge","backgroundColor","palette","semantic","background","color","text","borderRadius","radius","paddingLeft","spacing","paddingRight","paddingTop","paddingBottom","width","boxShadow","customShadows","overlay","StyledTooltipContent","Box","display","flexDirection","marginTop","gap","alignItems","justifyContent","StyledTooltipActionContainer","StyledTitle","Typography","StyledDescription","StyledSingleButtonContainer","flexGrow","Tooltip","children","title","description","textLink","size","actionButtons","hasActionContent","Boolean","renderTooltipContent","_jsxs","_Fragment","variant","Link","fdKey","href","iconLeft","iconRight","tone","underline","weight","renderTextLink","Array","isArray","ButtonGroup","align","layout","order","map","button","index","key","Button","label","onClick","renderActions","arrow"],"mappings":"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"}
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/molecules/Tooltip/index.tsx"],"sourcesContent":["import Box from '@mui/material/Box';\nimport { styled } from '@mui/material/styles';\nimport MUITooltip, { type TooltipProps as MUITooltipProps } from '@mui/material/Tooltip';\n\nimport Button from '@fd/components/atoms/Button';\nimport type { ButtonType } from '@fd/components/atoms/Button/getButtonStyles';\nimport Link, { type StyledLinkProps } from '@fd/components/atoms/Link';\nimport Typography from '@fd/components/atoms/Typography';\nimport ButtonGroup from '@fd/components/molecules/ButtonGroup';\n\ntype TooltipPlacement = 'bottom-center' | 'bottom-left' | 'bottom-right' | 'left' | 'right';\n\n// Map custom placement values to MUI placement values\nconst mapPlacementToMUI = (placement: TooltipPlacement): MUITooltipProps['placement'] => {\n  const placementMap: Record<TooltipPlacement, MUITooltipProps['placement']> = {\n    'bottom-right': 'top-end',\n    'bottom-left': 'top-start',\n    'bottom-center': 'top',\n    left: 'left',\n    right: 'right',\n  };\n\n  return placementMap[placement] ?? 'top';\n};\n\nconst StyledTooltip = styled(\n  ({ className, ...props }: MUITooltipProps) => <MUITooltip {...props} classes={{ popper: className }} />,\n  { shouldForwardProp: (prop) => prop !== 'isLarge' },\n)<{ isLarge: boolean }>(({ theme, isLarge }) => ({\n  '& .MuiTooltip-tooltip': {\n    backgroundColor: theme.palette.semantic.background['background-inverse'],\n    color: theme.palette.semantic.text['text-weak'],\n    borderRadius: theme.radius['radius-8'],\n    paddingLeft: theme.spacing(2),\n    paddingRight: theme.spacing(2),\n    paddingTop: isLarge ? theme.spacing(2) : theme.spacing(1),\n    paddingBottom: isLarge ? theme.spacing(2) : theme.spacing(1),\n    width: isLarge ? '332px' : 'auto',\n    boxShadow: theme.customShadows?.overlay,\n  },\n  '& .MuiTooltip-arrow': {\n    color: theme.palette.semantic.background['background-inverse'],\n  },\n}));\n\nconst StyledTooltipContent = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  marginTop: theme.spacing(0.5),\n  gap: theme.spacing(1),\n  alignItems: 'flex-start',\n  justifyContent: 'center',\n  width: '100%',\n}));\n\nconst StyledTooltipActionContainer = styled(Box)(() => ({\n  display: 'flex',\n  alignItems: 'center',\n  width: '100%',\n  justifyContent: 'space-between',\n}));\n\nconst StyledTitle = styled(Typography)(({ theme }) => ({\n  color: theme.palette.semantic.text['text-inverse-strong'],\n}));\n\nconst StyledDescription = styled(Typography)(({ theme }) => ({\n  color: theme.palette.semantic.text['text-inverse-weak'],\n}));\n\nconst StyledSingleButtonContainer = styled(Box)(() => ({\n  display: 'flex',\n  justifyContent: 'flex-end',\n  flexGrow: 1,\n}));\n\n/** Props for the ActionButton component */\nexport interface ActionButton {\n  /** Text label for the action button */\n  label: string;\n  /** Visual variant of the action button */\n  variant?: ButtonType;\n  /** Callback function when the action button is clicked */\n  onClick: () => void;\n}\n\n/** Props for the Tooltip component */\nexport interface TooltipProps extends Omit<MUITooltipProps, 'arrow' | 'placement'> {\n  /** Placement of the tooltip */\n  placement?: TooltipPlacement;\n  /** Size of the tooltip */\n  size?: 'large' | 'small';\n  /** Description of the tooltip */\n  description?: string;\n  /** Action buttons of the tooltip */\n  actionButtons?: ActionButton | ActionButton[];\n  /** Text link of the tooltip */\n  textLink?: StyledLinkProps;\n}\n\n/**\n * A floating message that’s displayed on hover or press of an interactive element.\n *\n * @param props - The component props\n * @returns A component with a tooltip\n */\nexport const Tooltip = ({\n  children,\n  title,\n  description,\n  textLink,\n  size = 'small',\n  actionButtons,\n  placement = 'bottom-center',\n  ...props\n}: TooltipProps): JSX.Element => {\n  const isLarge = size === 'large';\n\n  const renderTextLink = (): React.ReactNode => {\n    if (!textLink) {\n      return undefined;\n    }\n\n    return (\n      <Link\n        fdKey={textLink.fdKey}\n        href={textLink.href}\n        iconLeft={textLink.iconLeft}\n        iconRight={textLink.iconRight}\n        size=\"caption\"\n        tone=\"Inverse Strong\"\n        underline={false}\n        weight=\"bold\"\n      >\n        {textLink.children}\n      </Link>\n    );\n  };\n\n  const renderActions = (): React.ReactNode => {\n    if (!actionButtons) {\n      return undefined;\n    }\n\n    if (Array.isArray(actionButtons)) {\n      return (\n        <ButtonGroup align=\"right\" layout=\"horizontal\" order=\"default\" size=\"small\">\n          {actionButtons.map((button, index) => {\n            const key = `action-button-${index}`;\n\n            return (\n              <Button\n                key={key}\n                fdKey={button.label}\n                onClick={button.onClick}\n                tone=\"inverse\"\n                variant={button.variant}\n              >\n                {button.label}\n              </Button>\n            );\n          })}\n        </ButtonGroup>\n      );\n    }\n\n    return (\n      <StyledSingleButtonContainer>\n        <Button\n          fdKey={actionButtons.label}\n          onClick={actionButtons.onClick}\n          size=\"small\"\n          tone=\"inverse\"\n          variant={actionButtons.variant}\n        >\n          {actionButtons.label}\n        </Button>\n      </StyledSingleButtonContainer>\n    );\n  };\n\n  const hasActionContent = Boolean(textLink || actionButtons);\n\n  const renderTooltipContent = (\n    <>\n      <StyledTitle variant={!isLarge ? 'captionWeak' : 'captionStrong'}>{title}</StyledTitle>\n      {isLarge && description && (\n        <StyledTooltipContent>\n          <StyledDescription variant=\"captionWeak\">{description}</StyledDescription>\n          {hasActionContent && (\n            <StyledTooltipActionContainer>\n              {renderTextLink()}\n              {renderActions()}\n            </StyledTooltipActionContainer>\n          )}\n        </StyledTooltipContent>\n      )}\n    </>\n  );\n\n  return (\n    <StyledTooltip\n      {...props}\n      arrow\n      isLarge={isLarge}\n      placement={mapPlacementToMUI(placement)}\n      title={renderTooltipContent}\n    >\n      {children}\n    </StyledTooltip>\n  );\n};\n\nexport default Tooltip;\n"],"names":["mapPlacementToMUI","placement","left","right","StyledTooltip","styled","className","props","_jsx","MUITooltip","classes","popper","shouldForwardProp","prop","theme","isLarge","backgroundColor","palette","semantic","background","color","text","borderRadius","radius","paddingLeft","spacing","paddingRight","paddingTop","paddingBottom","width","boxShadow","customShadows","overlay","StyledTooltipContent","Box","display","flexDirection","marginTop","gap","alignItems","justifyContent","StyledTooltipActionContainer","StyledTitle","Typography","StyledDescription","StyledSingleButtonContainer","flexGrow","Tooltip","children","title","description","textLink","size","actionButtons","hasActionContent","Boolean","renderTooltipContent","_jsxs","_Fragment","variant","Link","fdKey","href","iconLeft","iconRight","tone","underline","weight","renderTextLink","Array","isArray","ButtonGroup","align","layout","order","map","button","index","key","Button","label","onClick","renderActions","arrow"],"mappings":"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"}

package/dist/components/molecules/Tooltip/index.js

@@ -1,2 +1,2 @@
-import{jsx as t,jsxs as e,Fragment as i}from"react/jsx-runtime";import o from"@mui/material/Box";import{styled as r}from"@mui/material/styles";import n from"@mui/material/Tooltip";import{Button as a}from"../../atoms/Button/index.js";import{Link as l}from"../../atoms/Link/index.js";import s from"@mui/material/Typography";import c from"../ButtonGroup/index.js";const p=t=>({"bottom-right":"top-end","bottom-left":"top-start","bottom-center":"top",left:"left",right:"right"}[t]??"top"),d=r((({className:e,...i})=>t(n,{...i,classes:{popper:e}})),{shouldForwardProp:t=>"isLarge"!==t})((({theme:t,isLarge:e})=>({"& .MuiTooltip-tooltip":{backgroundColor:t.palette.semantic.background["background-inverse"],color:t.palette.semantic.text["text-weak"],borderRadius:t.radius["radius-8"],paddingLeft:t.spacing(2),paddingRight:t.spacing(2),paddingTop:e?t.spacing(2):t.spacing(1),paddingBottom:e?t.spacing(2):t.spacing(1),width:e?"332px":"auto",boxShadow:t.customShadows?.overlay},"& .MuiTooltip-arrow":{color:t.palette.semantic.background["background-inverse"]}}))),m=r(o)((({theme:t})=>({display:"flex",flexDirection:"column",marginTop:t.spacing(.5),gap:t.spacing(1),alignItems:"flex-start",justifyContent:"center",width:"100%"}))),g=r(o)((()=>({display:"flex",alignItems:"center",width:"100%",justifyContent:"space-between"}))),h=r(s)((({theme:t})=>({color:t.palette.semantic.text["text-inverse-strong"]}))),u=r(s)((({theme:t})=>({color:t.palette.semantic.text["text-inverse-weak"]}))),f=r(o)((()=>({display:"flex",justifyContent:"flex-end",flexGrow:1}))),x=({children:o,title:r,description:n,textLink:s,size:x="small",actionButtons:b,placement:y="bottom-center",...k})=>{const v="large"===x,w=Boolean(s||b),C=e(i,{children:[t(h,{variant:v?"captionStrong":"captionWeak",children:r}),v&&n&&e(m,{children:[t(u,{variant:"captionWeak",children:n}),w&&e(g,{children:[(()=>{if(s)return t(l,{fdKey:s.fdKey,href:s.href,iconLeft:s.iconLeft,iconRight:s.iconRight,size:"caption",tone:"Inverse Strong",underline:!1,weight:"bold",children:s.children})})(),(()=>{if(b)return Array.isArray(b)?t(c,{align:"right",layout:"horizontal",order:"default",size:"small",children:b.map(((e,i)=>{const o=`action-button-${i}`;return t(a,{fdKey:e.label,onClick:e.onClick,tone:"inverse",variant:e.variant,children:e.label},o)}))}):t(f,{children:t(a,{fdKey:b.label,onClick:b.onClick,size:"small",tone:"inverse",variant:b.variant,children:b.label})})})()]})]})]});return t(d,{...k,arrow:!0,isLarge:v,placement:p(y),title:C,children:o})};export{x as Tooltip,x as default};
+import{jsx as t,jsxs as e,Fragment as i}from"react/jsx-runtime";import o from"@mui/material/Box";import{styled as r}from"@mui/material/styles";import n from"@mui/material/Tooltip";import{Button as a}from"../../atoms/Button/index.js";import{Link as l}from"../../atoms/Link/index.js";import s from"@mui/material/Typography";import c from"../ButtonGroup/index.js";const p=t=>({"bottom-right":"top-end","bottom-left":"top-start","bottom-center":"top",left:"left",right:"right"}[t]??"top"),d=r(({className:e,...i})=>t(n,{...i,classes:{popper:e}}),{shouldForwardProp:t=>"isLarge"!==t})(({theme:t,isLarge:e})=>({"& .MuiTooltip-tooltip":{backgroundColor:t.palette.semantic.background["background-inverse"],color:t.palette.semantic.text["text-weak"],borderRadius:t.radius["radius-8"],paddingLeft:t.spacing(2),paddingRight:t.spacing(2),paddingTop:e?t.spacing(2):t.spacing(1),paddingBottom:e?t.spacing(2):t.spacing(1),width:e?"332px":"auto",boxShadow:t.customShadows?.overlay},"& .MuiTooltip-arrow":{color:t.palette.semantic.background["background-inverse"]}})),m=r(o)(({theme:t})=>({display:"flex",flexDirection:"column",marginTop:t.spacing(.5),gap:t.spacing(1),alignItems:"flex-start",justifyContent:"center",width:"100%"})),g=r(o)(()=>({display:"flex",alignItems:"center",width:"100%",justifyContent:"space-between"})),h=r(s)(({theme:t})=>({color:t.palette.semantic.text["text-inverse-strong"]})),u=r(s)(({theme:t})=>({color:t.palette.semantic.text["text-inverse-weak"]})),f=r(o)(()=>({display:"flex",justifyContent:"flex-end",flexGrow:1})),x=({children:o,title:r,description:n,textLink:s,size:x="small",actionButtons:b,placement:y="bottom-center",...k})=>{const v="large"===x,w=Boolean(s||b),C=e(i,{children:[t(h,{variant:v?"captionStrong":"captionWeak",children:r}),v&&n&&e(m,{children:[t(u,{variant:"captionWeak",children:n}),w&&e(g,{children:[(()=>{if(s)return t(l,{fdKey:s.fdKey,href:s.href,iconLeft:s.iconLeft,iconRight:s.iconRight,size:"caption",tone:"Inverse Strong",underline:!1,weight:"bold",children:s.children})})(),(()=>{if(b)return Array.isArray(b)?t(c,{align:"right",layout:"horizontal",order:"default",size:"small",children:b.map((e,i)=>{const o=`action-button-${i}`;return t(a,{fdKey:e.label,onClick:e.onClick,tone:"inverse",variant:e.variant,children:e.label},o)})}):t(f,{children:t(a,{fdKey:b.label,onClick:b.onClick,size:"small",tone:"inverse",variant:b.variant,children:b.label})})})()]})]})]});return t(d,{...k,arrow:!0,isLarge:v,placement:p(y),title:C,children:o})};export{x as Tooltip,x as default};
 //# sourceMappingURL=index.js.map

package/dist/components/molecules/Tooltip/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/molecules/Tooltip/index.tsx"],"sourcesContent":["import Box from '@mui/material/Box';\nimport { styled } from '@mui/material/styles';\nimport MUITooltip, { type TooltipProps as MUITooltipProps } from '@mui/material/Tooltip';\n\nimport Button from '@fd/components/atoms/Button';\nimport type { ButtonType } from '@fd/components/atoms/Button/getButtonStyles';\nimport Link, { type StyledLinkProps } from '@fd/components/atoms/Link';\nimport Typography from '@fd/components/atoms/Typography';\nimport ButtonGroup from '@fd/components/molecules/ButtonGroup';\n\ntype TooltipPlacement = 'bottom-center' | 'bottom-left' | 'bottom-right' | 'left' | 'right';\n\n// Map custom placement values to MUI placement values\nconst mapPlacementToMUI = (placement: TooltipPlacement): MUITooltipProps['placement'] => {\n  const placementMap: Record<TooltipPlacement, MUITooltipProps['placement']> = {\n    'bottom-right': 'top-end',\n    'bottom-left': 'top-start',\n    'bottom-center': 'top',\n    left: 'left',\n    right: 'right',\n  };\n\n  return placementMap[placement] ?? 'top';\n};\n\nconst StyledTooltip = styled(\n  ({ className, ...props }: MUITooltipProps) => <MUITooltip {...props} classes={{ popper: className }} />,\n  { shouldForwardProp: (prop) => prop !== 'isLarge' },\n)<{ isLarge: boolean }>(({ theme, isLarge }) => ({\n  '& .MuiTooltip-tooltip': {\n    backgroundColor: theme.palette.semantic.background['background-inverse'],\n    color: theme.palette.semantic.text['text-weak'],\n    borderRadius: theme.radius['radius-8'],\n    paddingLeft: theme.spacing(2),\n    paddingRight: theme.spacing(2),\n    paddingTop: isLarge ? theme.spacing(2) : theme.spacing(1),\n    paddingBottom: isLarge ? theme.spacing(2) : theme.spacing(1),\n    width: isLarge ? '332px' : 'auto',\n    boxShadow: theme.customShadows?.overlay,\n  },\n  '& .MuiTooltip-arrow': {\n    color: theme.palette.semantic.background['background-inverse'],\n  },\n}));\n\nconst StyledTooltipContent = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  marginTop: theme.spacing(0.5),\n  gap: theme.spacing(1),\n  alignItems: 'flex-start',\n  justifyContent: 'center',\n  width: '100%',\n}));\n\nconst StyledTooltipActionContainer = styled(Box)(() => ({\n  display: 'flex',\n  alignItems: 'center',\n  width: '100%',\n  justifyContent: 'space-between',\n}));\n\nconst StyledTitle = styled(Typography)(({ theme }) => ({\n  color: theme.palette.semantic.text['text-inverse-strong'],\n}));\n\nconst StyledDescription = styled(Typography)(({ theme }) => ({\n  color: theme.palette.semantic.text['text-inverse-weak'],\n}));\n\nconst StyledSingleButtonContainer = styled(Box)(() => ({\n  display: 'flex',\n  justifyContent: 'flex-end',\n  flexGrow: 1,\n}));\n\n/** Props for the ActionButton component */\nexport interface ActionButton {\n  /** Text label for the action button */\n  label: string;\n  /** Visual variant of the action button */\n  variant?: ButtonType;\n  /** Callback function when the action button is clicked */\n  onClick: () => void;\n}\n\n/** Props for the Tooltip component */\nexport interface TooltipProps extends Omit<MUITooltipProps, 'arrow' | 'placement'> {\n  /** Placement of the tooltip */\n  placement?: TooltipPlacement;\n  /** Size of the tooltip */\n  size?: 'large' | 'small';\n  /** Description of the tooltip */\n  description?: string;\n  /** Action buttons of the tooltip */\n  actionButtons?: ActionButton | ActionButton[];\n  /** Text link of the tooltip */\n  textLink?: StyledLinkProps;\n}\n\n/**\n * A floating message that’s displayed on hover or press of an interactive element.\n *\n * @param props - The component props\n * @returns A component with a tooltip\n */\nexport const Tooltip = ({\n  children,\n  title,\n  description,\n  textLink,\n  size = 'small',\n  actionButtons,\n  placement = 'bottom-center',\n  ...props\n}: TooltipProps): JSX.Element => {\n  const isLarge = size === 'large';\n\n  const renderTextLink = (): React.ReactNode => {\n    if (!textLink) {\n      return undefined;\n    }\n\n    return (\n      <Link\n        fdKey={textLink.fdKey}\n        href={textLink.href}\n        iconLeft={textLink.iconLeft}\n        iconRight={textLink.iconRight}\n        size=\"caption\"\n        tone=\"Inverse Strong\"\n        underline={false}\n        weight=\"bold\"\n      >\n        {textLink.children}\n      </Link>\n    );\n  };\n\n  const renderActions = (): React.ReactNode => {\n    if (!actionButtons) {\n      return undefined;\n    }\n\n    if (Array.isArray(actionButtons)) {\n      return (\n        <ButtonGroup align=\"right\" layout=\"horizontal\" order=\"default\" size=\"small\">\n          {actionButtons.map((button, index) => {\n            const key = `action-button-${index}`;\n\n            return (\n              <Button\n                key={key}\n                fdKey={button.label}\n                onClick={button.onClick}\n                tone=\"inverse\"\n                variant={button.variant}\n              >\n                {button.label}\n              </Button>\n            );\n          })}\n        </ButtonGroup>\n      );\n    }\n\n    return (\n      <StyledSingleButtonContainer>\n        <Button\n          fdKey={actionButtons.label}\n          onClick={actionButtons.onClick}\n          size=\"small\"\n          tone=\"inverse\"\n          variant={actionButtons.variant}\n        >\n          {actionButtons.label}\n        </Button>\n      </StyledSingleButtonContainer>\n    );\n  };\n\n  const hasActionContent = Boolean(textLink || actionButtons);\n\n  const renderTooltipContent = (\n    <>\n      <StyledTitle variant={!isLarge ? 'captionWeak' : 'captionStrong'}>{title}</StyledTitle>\n      {isLarge && description && (\n        <StyledTooltipContent>\n          <StyledDescription variant=\"captionWeak\">{description}</StyledDescription>\n          {hasActionContent && (\n            <StyledTooltipActionContainer>\n              {renderTextLink()}\n              {renderActions()}\n            </StyledTooltipActionContainer>\n          )}\n        </StyledTooltipContent>\n      )}\n    </>\n  );\n\n  return (\n    <StyledTooltip\n      {...props}\n      arrow\n      isLarge={isLarge}\n      placement={mapPlacementToMUI(placement)}\n      title={renderTooltipContent}\n    >\n      {children}\n    </StyledTooltip>\n  );\n};\n\nexport default Tooltip;\n"],"names":["mapPlacementToMUI","placement","left","right","StyledTooltip","styled","className","props","_jsx","MUITooltip","classes","popper","shouldForwardProp","prop","theme","isLarge","backgroundColor","palette","semantic","background","color","text","borderRadius","radius","paddingLeft","spacing","paddingRight","paddingTop","paddingBottom","width","boxShadow","customShadows","overlay","StyledTooltipContent","Box","display","flexDirection","marginTop","gap","alignItems","justifyContent","StyledTooltipActionContainer","StyledTitle","Typography","StyledDescription","StyledSingleButtonContainer","flexGrow","Tooltip","children","title","description","textLink","size","actionButtons","hasActionContent","Boolean","renderTooltipContent","_jsxs","_Fragment","variant","Link","fdKey","href","iconLeft","iconRight","tone","underline","weight","renderTextLink","Array","isArray","ButtonGroup","align","layout","order","map","button","index","key","Button","label","onClick","renderActions","arrow"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/molecules/Tooltip/index.tsx"],"sourcesContent":["import Box from '@mui/material/Box';\nimport { styled } from '@mui/material/styles';\nimport MUITooltip, { type TooltipProps as MUITooltipProps } from '@mui/material/Tooltip';\n\nimport Button from '@fd/components/atoms/Button';\nimport type { ButtonType } from '@fd/components/atoms/Button/getButtonStyles';\nimport Link, { type StyledLinkProps } from '@fd/components/atoms/Link';\nimport Typography from '@fd/components/atoms/Typography';\nimport ButtonGroup from '@fd/components/molecules/ButtonGroup';\n\ntype TooltipPlacement = 'bottom-center' | 'bottom-left' | 'bottom-right' | 'left' | 'right';\n\n// Map custom placement values to MUI placement values\nconst mapPlacementToMUI = (placement: TooltipPlacement): MUITooltipProps['placement'] => {\n  const placementMap: Record<TooltipPlacement, MUITooltipProps['placement']> = {\n    'bottom-right': 'top-end',\n    'bottom-left': 'top-start',\n    'bottom-center': 'top',\n    left: 'left',\n    right: 'right',\n  };\n\n  return placementMap[placement] ?? 'top';\n};\n\nconst StyledTooltip = styled(\n  ({ className, ...props }: MUITooltipProps) => <MUITooltip {...props} classes={{ popper: className }} />,\n  { shouldForwardProp: (prop) => prop !== 'isLarge' },\n)<{ isLarge: boolean }>(({ theme, isLarge }) => ({\n  '& .MuiTooltip-tooltip': {\n    backgroundColor: theme.palette.semantic.background['background-inverse'],\n    color: theme.palette.semantic.text['text-weak'],\n    borderRadius: theme.radius['radius-8'],\n    paddingLeft: theme.spacing(2),\n    paddingRight: theme.spacing(2),\n    paddingTop: isLarge ? theme.spacing(2) : theme.spacing(1),\n    paddingBottom: isLarge ? theme.spacing(2) : theme.spacing(1),\n    width: isLarge ? '332px' : 'auto',\n    boxShadow: theme.customShadows?.overlay,\n  },\n  '& .MuiTooltip-arrow': {\n    color: theme.palette.semantic.background['background-inverse'],\n  },\n}));\n\nconst StyledTooltipContent = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  marginTop: theme.spacing(0.5),\n  gap: theme.spacing(1),\n  alignItems: 'flex-start',\n  justifyContent: 'center',\n  width: '100%',\n}));\n\nconst StyledTooltipActionContainer = styled(Box)(() => ({\n  display: 'flex',\n  alignItems: 'center',\n  width: '100%',\n  justifyContent: 'space-between',\n}));\n\nconst StyledTitle = styled(Typography)(({ theme }) => ({\n  color: theme.palette.semantic.text['text-inverse-strong'],\n}));\n\nconst StyledDescription = styled(Typography)(({ theme }) => ({\n  color: theme.palette.semantic.text['text-inverse-weak'],\n}));\n\nconst StyledSingleButtonContainer = styled(Box)(() => ({\n  display: 'flex',\n  justifyContent: 'flex-end',\n  flexGrow: 1,\n}));\n\n/** Props for the ActionButton component */\nexport interface ActionButton {\n  /** Text label for the action button */\n  label: string;\n  /** Visual variant of the action button */\n  variant?: ButtonType;\n  /** Callback function when the action button is clicked */\n  onClick: () => void;\n}\n\n/** Props for the Tooltip component */\nexport interface TooltipProps extends Omit<MUITooltipProps, 'arrow' | 'placement'> {\n  /** Placement of the tooltip */\n  placement?: TooltipPlacement;\n  /** Size of the tooltip */\n  size?: 'large' | 'small';\n  /** Description of the tooltip */\n  description?: string;\n  /** Action buttons of the tooltip */\n  actionButtons?: ActionButton | ActionButton[];\n  /** Text link of the tooltip */\n  textLink?: StyledLinkProps;\n}\n\n/**\n * A floating message that’s displayed on hover or press of an interactive element.\n *\n * @param props - The component props\n * @returns A component with a tooltip\n */\nexport const Tooltip = ({\n  children,\n  title,\n  description,\n  textLink,\n  size = 'small',\n  actionButtons,\n  placement = 'bottom-center',\n  ...props\n}: TooltipProps): JSX.Element => {\n  const isLarge = size === 'large';\n\n  const renderTextLink = (): React.ReactNode => {\n    if (!textLink) {\n      return undefined;\n    }\n\n    return (\n      <Link\n        fdKey={textLink.fdKey}\n        href={textLink.href}\n        iconLeft={textLink.iconLeft}\n        iconRight={textLink.iconRight}\n        size=\"caption\"\n        tone=\"Inverse Strong\"\n        underline={false}\n        weight=\"bold\"\n      >\n        {textLink.children}\n      </Link>\n    );\n  };\n\n  const renderActions = (): React.ReactNode => {\n    if (!actionButtons) {\n      return undefined;\n    }\n\n    if (Array.isArray(actionButtons)) {\n      return (\n        <ButtonGroup align=\"right\" layout=\"horizontal\" order=\"default\" size=\"small\">\n          {actionButtons.map((button, index) => {\n            const key = `action-button-${index}`;\n\n            return (\n              <Button\n                key={key}\n                fdKey={button.label}\n                onClick={button.onClick}\n                tone=\"inverse\"\n                variant={button.variant}\n              >\n                {button.label}\n              </Button>\n            );\n          })}\n        </ButtonGroup>\n      );\n    }\n\n    return (\n      <StyledSingleButtonContainer>\n        <Button\n          fdKey={actionButtons.label}\n          onClick={actionButtons.onClick}\n          size=\"small\"\n          tone=\"inverse\"\n          variant={actionButtons.variant}\n        >\n          {actionButtons.label}\n        </Button>\n      </StyledSingleButtonContainer>\n    );\n  };\n\n  const hasActionContent = Boolean(textLink || actionButtons);\n\n  const renderTooltipContent = (\n    <>\n      <StyledTitle variant={!isLarge ? 'captionWeak' : 'captionStrong'}>{title}</StyledTitle>\n      {isLarge && description && (\n        <StyledTooltipContent>\n          <StyledDescription variant=\"captionWeak\">{description}</StyledDescription>\n          {hasActionContent && (\n            <StyledTooltipActionContainer>\n              {renderTextLink()}\n              {renderActions()}\n            </StyledTooltipActionContainer>\n          )}\n        </StyledTooltipContent>\n      )}\n    </>\n  );\n\n  return (\n    <StyledTooltip\n      {...props}\n      arrow\n      isLarge={isLarge}\n      placement={mapPlacementToMUI(placement)}\n      title={renderTooltipContent}\n    >\n      {children}\n    </StyledTooltip>\n  );\n};\n\nexport default Tooltip;\n"],"names":["mapPlacementToMUI","placement","left","right","StyledTooltip","styled","className","props","_jsx","MUITooltip","classes","popper","shouldForwardProp","prop","theme","isLarge","backgroundColor","palette","semantic","background","color","text","borderRadius","radius","paddingLeft","spacing","paddingRight","paddingTop","paddingBottom","width","boxShadow","customShadows","overlay","StyledTooltipContent","Box","display","flexDirection","marginTop","gap","alignItems","justifyContent","StyledTooltipActionContainer","StyledTitle","Typography","StyledDescription","StyledSingleButtonContainer","flexGrow","Tooltip","children","title","description","textLink","size","actionButtons","hasActionContent","Boolean","renderTooltipContent","_jsxs","_Fragment","variant","Link","fdKey","href","iconLeft","iconRight","tone","underline","weight","renderTextLink","Array","isArray","ButtonGroup","align","layout","order","map","button","index","key","Button","label","onClick","renderActions","arrow"],"mappings":"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"}

package/dist/components/organisms/AssetManager/LibraryTabContent/LibraryTabContentSkeleton.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime");require("react");var i=require("@mui/material/styles"),t=require("@mui/material/Box"),r=require("@mui/material/Grid2"),a=require("@mui/material/Skeleton");const s=i.styled(r)((()=>({listStyle:"none",margin:0,padding:0}))),n=i.styled(t)((({theme:e})=>({borderRadius:e.radius["radius-16"],border:`1px solid ${e.palette.semantic.stroke["stroke-weak"]}`,overflow:"hidden"}))),l=i.styled(t)((({theme:e})=>({padding:e.spacing(2)}))),o=["skeleton-1","skeleton-2","skeleton-3","skeleton-4","skeleton-5","skeleton-6"];module.exports=()=>e.jsx(s,{container:!0,"aria-busy":"true","aria-label":"Loading assets",component:"ul",spacing:1,children:o.map((i=>e.jsx(r,{component:"li",size:{widescreen:4,desktop:4,mobile:6,tablet:4},children:e.jsxs(n,{children:[e.jsx(a,{animation:"wave",height:204,variant:"rectangular"}),e.jsx(l,{children:e.jsx(a,{animation:"wave",height:20,variant:"text",width:"80%"})})]})},i)))});
+"use strict";var e=require("react/jsx-runtime");require("react");var i=require("@mui/material/styles"),t=require("@mui/material/Box"),r=require("@mui/material/Grid2"),a=require("@mui/material/Skeleton");const s=i.styled(r)(()=>({listStyle:"none",margin:0,padding:0})),n=i.styled(t)(({theme:e})=>({borderRadius:e.radius["radius-16"],border:`1px solid ${e.palette.semantic.stroke["stroke-weak"]}`,overflow:"hidden"})),l=i.styled(t)(({theme:e})=>({padding:e.spacing(2)})),o=["skeleton-1","skeleton-2","skeleton-3","skeleton-4","skeleton-5","skeleton-6"];module.exports=()=>e.jsx(s,{container:!0,"aria-busy":"true","aria-label":"Loading assets",component:"ul",spacing:1,children:o.map(i=>e.jsx(r,{component:"li",size:{widescreen:4,desktop:4,mobile:6,tablet:4},children:e.jsxs(n,{children:[e.jsx(a,{animation:"wave",height:204,variant:"rectangular"}),e.jsx(l,{children:e.jsx(a,{animation:"wave",height:20,variant:"text",width:"80%"})})]})},i))});
 //# sourceMappingURL=LibraryTabContentSkeleton.cjs.js.map

package/dist/components/organisms/AssetManager/LibraryTabContent/LibraryTabContentSkeleton.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"LibraryTabContentSkeleton.cjs.js","sources":["../../../../../src/components/organisms/AssetManager/LibraryTabContent/LibraryTabContentSkeleton.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport Grid from '@fd/components/atoms/Grid';\nimport Skeleton from '@fd/components/atoms/Skeleton';\n\nconst StyledList = styled(Grid)<{ component: string }>(() => ({\n  listStyle: 'none',\n  margin: 0,\n  padding: 0,\n}));\n\nconst StyledSkeletonCard = styled(Box)(({ theme }) => ({\n  borderRadius: theme.radius['radius-16'],\n  border: `1px solid ${theme.palette.semantic.stroke['stroke-weak']}`,\n  overflow: 'hidden',\n}));\n\nconst StyledSkeletonContent = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(2),\n}));\n\nconst SKELETON_IDS = ['skeleton-1', 'skeleton-2', 'skeleton-3', 'skeleton-4', 'skeleton-5', 'skeleton-6'];\n\n/**\n * Skeleton loading state for the LibraryTabContent component.\n * Displays a grid of skeleton cards that match the layout of actual asset cards.\n *\n * @returns The skeleton loading grid\n */\nconst LibraryTabContentSkeleton: React.FC = () => {\n  return (\n    <StyledList container aria-busy=\"true\" aria-label=\"Loading assets\" component=\"ul\" spacing={1}>\n      {SKELETON_IDS.map((skeletonId) => (\n        <Grid key={skeletonId} component=\"li\" size={{ widescreen: 4, desktop: 4, mobile: 6, tablet: 4 }}>\n          <StyledSkeletonCard>\n            <Skeleton animation=\"wave\" height={204} variant=\"rectangular\" />\n            <StyledSkeletonContent>\n              <Skeleton animation=\"wave\" height={20} variant=\"text\" width=\"80%\" />\n            </StyledSkeletonContent>\n          </StyledSkeletonCard>\n        </Grid>\n      ))}\n    </StyledList>\n  );\n};\n\nexport default LibraryTabContentSkeleton;\n"],"names":["StyledList","styled","Grid","listStyle","margin","padding","StyledSkeletonCard","Box","theme","borderRadius","radius","border","palette","semantic","stroke","overflow","StyledSkeletonContent","spacing","SKELETON_IDS","_jsx","container","component","children","map","skeletonId","size","widescreen","desktop","mobile","tablet","_jsxs","Skeleton","animation","height","variant","width"],"mappings":"2MAQA,MAAMA,EAAaC,EAAAA,OAAOC,EAAPD,EAAoC,KAAA,CACrDE,UAAW,OACXC,OAAQ,EACRC,QAAS,MAGLC,EAAqBL,EAAAA,OAAOM,EAAPN,EAAY,EAAGO,YAAO,CAC/CC,aAAcD,EAAME,OAAO,aAC3BC,OAAQ,aAAaH,EAAMI,QAAQC,SAASC,OAAO,iBACnDC,SAAU,aAGNC,EAAwBf,EAAAA,OAAOM,EAAPN,EAAY,EAAGO,YAAO,CAClDH,QAASG,EAAMS,QAAQ,OAGnBC,EAAe,CAAC,aAAc,aAAc,aAAc,aAAc,aAAc,6BAQhD,IAExCC,EAAAA,IAACnB,EAAU,CAACoB,WAAS,EAAA,YAAW,OAAM,aAAY,iBAAiBC,UAAU,KAAKJ,QAAS,EAACK,SACzFJ,EAAaK,KAAKC,GACjBL,EAAAA,IAACjB,EAAI,CAAkBmB,UAAU,KAAKI,KAAM,CAAEC,WAAY,EAAGC,QAAS,EAAGC,OAAQ,EAAGC,OAAQ,GAAGP,SAC7FQ,EAAAA,KAACxB,EAAkB,CAAAgB,SAAA,CACjBH,EAAAA,IAACY,EAAQ,CAACC,UAAU,OAAOC,OAAQ,IAAKC,QAAQ,gBAChDf,EAAAA,IAACH,EAAqB,CAAAM,SACpBH,EAAAA,IAACY,GAASC,UAAU,OAAOC,OAAQ,GAAIC,QAAQ,OAAOC,MAAM,cAJvDX"}
+{"version":3,"file":"LibraryTabContentSkeleton.cjs.js","sources":["../../../../../src/components/organisms/AssetManager/LibraryTabContent/LibraryTabContentSkeleton.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport Grid from '@fd/components/atoms/Grid';\nimport Skeleton from '@fd/components/atoms/Skeleton';\n\nconst StyledList = styled(Grid)<{ component: string }>(() => ({\n  listStyle: 'none',\n  margin: 0,\n  padding: 0,\n}));\n\nconst StyledSkeletonCard = styled(Box)(({ theme }) => ({\n  borderRadius: theme.radius['radius-16'],\n  border: `1px solid ${theme.palette.semantic.stroke['stroke-weak']}`,\n  overflow: 'hidden',\n}));\n\nconst StyledSkeletonContent = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(2),\n}));\n\nconst SKELETON_IDS = ['skeleton-1', 'skeleton-2', 'skeleton-3', 'skeleton-4', 'skeleton-5', 'skeleton-6'];\n\n/**\n * Skeleton loading state for the LibraryTabContent component.\n * Displays a grid of skeleton cards that match the layout of actual asset cards.\n *\n * @returns The skeleton loading grid\n */\nconst LibraryTabContentSkeleton: React.FC = () => {\n  return (\n    <StyledList container aria-busy=\"true\" aria-label=\"Loading assets\" component=\"ul\" spacing={1}>\n      {SKELETON_IDS.map((skeletonId) => (\n        <Grid key={skeletonId} component=\"li\" size={{ widescreen: 4, desktop: 4, mobile: 6, tablet: 4 }}>\n          <StyledSkeletonCard>\n            <Skeleton animation=\"wave\" height={204} variant=\"rectangular\" />\n            <StyledSkeletonContent>\n              <Skeleton animation=\"wave\" height={20} variant=\"text\" width=\"80%\" />\n            </StyledSkeletonContent>\n          </StyledSkeletonCard>\n        </Grid>\n      ))}\n    </StyledList>\n  );\n};\n\nexport default LibraryTabContentSkeleton;\n"],"names":["StyledList","styled","Grid","listStyle","margin","padding","StyledSkeletonCard","Box","theme","borderRadius","radius","border","palette","semantic","stroke","overflow","StyledSkeletonContent","spacing","SKELETON_IDS","_jsx","container","component","children","map","skeletonId","size","widescreen","desktop","mobile","tablet","_jsxs","Skeleton","animation","height","variant","width"],"mappings":"2MAQA,MAAMA,EAAaC,EAAAA,OAAOC,EAAPD,CAAoC,KAAA,CACrDE,UAAW,OACXC,OAAQ,EACRC,QAAS,KAGLC,EAAqBL,EAAAA,OAAOM,EAAPN,CAAY,EAAGO,YAAO,CAC/CC,aAAcD,EAAME,OAAO,aAC3BC,OAAQ,aAAaH,EAAMI,QAAQC,SAASC,OAAO,iBACnDC,SAAU,YAGNC,EAAwBf,EAAAA,OAAOM,EAAPN,CAAY,EAAGO,YAAO,CAClDH,QAASG,EAAMS,QAAQ,MAGnBC,EAAe,CAAC,aAAc,aAAc,aAAc,aAAc,aAAc,6BAQhD,IAExCC,EAAAA,IAACnB,EAAU,CAACoB,WAAS,EAAA,YAAW,OAAM,aAAY,iBAAiBC,UAAU,KAAKJ,QAAS,EAACK,SACzFJ,EAAaK,IAAKC,GACjBL,EAAAA,IAACjB,EAAI,CAAkBmB,UAAU,KAAKI,KAAM,CAAEC,WAAY,EAAGC,QAAS,EAAGC,OAAQ,EAAGC,OAAQ,GAAGP,SAC7FQ,EAAAA,KAACxB,EAAkB,CAAAgB,SAAA,CACjBH,EAAAA,IAACY,EAAQ,CAACC,UAAU,OAAOC,OAAQ,IAAKC,QAAQ,gBAChDf,EAAAA,IAACH,EAAqB,CAAAM,SACpBH,EAAAA,IAACY,GAASC,UAAU,OAAOC,OAAQ,GAAIC,QAAQ,OAAOC,MAAM,cAJvDX"}

package/dist/components/organisms/AssetManager/LibraryTabContent/LibraryTabContentSkeleton.js

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import"react";import{styled as i}from"@mui/material/styles";import a from"@mui/material/Box";import r from"@mui/material/Grid2";import o from"@mui/material/Skeleton";const n=i(r)((()=>({listStyle:"none",margin:0,padding:0}))),m=i(a)((({theme:e})=>({borderRadius:e.radius["radius-16"],border:`1px solid ${e.palette.semantic.stroke["stroke-weak"]}`,overflow:"hidden"}))),l=i(a)((({theme:e})=>({padding:e.spacing(2)}))),s=["skeleton-1","skeleton-2","skeleton-3","skeleton-4","skeleton-5","skeleton-6"],d=()=>e(n,{container:!0,"aria-busy":"true","aria-label":"Loading assets",component:"ul",spacing:1,children:s.map((i=>e(r,{component:"li",size:{widescreen:4,desktop:4,mobile:6,tablet:4},children:t(m,{children:[e(o,{animation:"wave",height:204,variant:"rectangular"}),e(l,{children:e(o,{animation:"wave",height:20,variant:"text",width:"80%"})})]})},i)))});export{d as default};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import"react";import{styled as i}from"@mui/material/styles";import a from"@mui/material/Box";import r from"@mui/material/Grid2";import o from"@mui/material/Skeleton";const n=i(r)(()=>({listStyle:"none",margin:0,padding:0})),m=i(a)(({theme:e})=>({borderRadius:e.radius["radius-16"],border:`1px solid ${e.palette.semantic.stroke["stroke-weak"]}`,overflow:"hidden"})),l=i(a)(({theme:e})=>({padding:e.spacing(2)})),s=["skeleton-1","skeleton-2","skeleton-3","skeleton-4","skeleton-5","skeleton-6"],d=()=>e(n,{container:!0,"aria-busy":"true","aria-label":"Loading assets",component:"ul",spacing:1,children:s.map(i=>e(r,{component:"li",size:{widescreen:4,desktop:4,mobile:6,tablet:4},children:t(m,{children:[e(o,{animation:"wave",height:204,variant:"rectangular"}),e(l,{children:e(o,{animation:"wave",height:20,variant:"text",width:"80%"})})]})},i))});export{d as default};
 //# sourceMappingURL=LibraryTabContentSkeleton.js.map

package/dist/components/organisms/AssetManager/LibraryTabContent/LibraryTabContentSkeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"LibraryTabContentSkeleton.js","sources":["../../../../../src/components/organisms/AssetManager/LibraryTabContent/LibraryTabContentSkeleton.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport Grid from '@fd/components/atoms/Grid';\nimport Skeleton from '@fd/components/atoms/Skeleton';\n\nconst StyledList = styled(Grid)<{ component: string }>(() => ({\n  listStyle: 'none',\n  margin: 0,\n  padding: 0,\n}));\n\nconst StyledSkeletonCard = styled(Box)(({ theme }) => ({\n  borderRadius: theme.radius['radius-16'],\n  border: `1px solid ${theme.palette.semantic.stroke['stroke-weak']}`,\n  overflow: 'hidden',\n}));\n\nconst StyledSkeletonContent = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(2),\n}));\n\nconst SKELETON_IDS = ['skeleton-1', 'skeleton-2', 'skeleton-3', 'skeleton-4', 'skeleton-5', 'skeleton-6'];\n\n/**\n * Skeleton loading state for the LibraryTabContent component.\n * Displays a grid of skeleton cards that match the layout of actual asset cards.\n *\n * @returns The skeleton loading grid\n */\nconst LibraryTabContentSkeleton: React.FC = () => {\n  return (\n    <StyledList container aria-busy=\"true\" aria-label=\"Loading assets\" component=\"ul\" spacing={1}>\n      {SKELETON_IDS.map((skeletonId) => (\n        <Grid key={skeletonId} component=\"li\" size={{ widescreen: 4, desktop: 4, mobile: 6, tablet: 4 }}>\n          <StyledSkeletonCard>\n            <Skeleton animation=\"wave\" height={204} variant=\"rectangular\" />\n            <StyledSkeletonContent>\n              <Skeleton animation=\"wave\" height={20} variant=\"text\" width=\"80%\" />\n            </StyledSkeletonContent>\n          </StyledSkeletonCard>\n        </Grid>\n      ))}\n    </StyledList>\n  );\n};\n\nexport default LibraryTabContentSkeleton;\n"],"names":["StyledList","styled","Grid","listStyle","margin","padding","StyledSkeletonCard","Box","theme","borderRadius","radius","border","palette","semantic","stroke","overflow","StyledSkeletonContent","spacing","SKELETON_IDS","LibraryTabContentSkeleton","_jsx","container","component","children","map","skeletonId","size","widescreen","desktop","mobile","tablet","_jsxs","Skeleton","animation","height","variant","width"],"mappings":"wNAQA,MAAMA,EAAaC,EAAOC,EAAPD,EAAoC,KAAA,CACrDE,UAAW,OACXC,OAAQ,EACRC,QAAS,MAGLC,EAAqBL,EAAOM,EAAPN,EAAY,EAAGO,YAAO,CAC/CC,aAAcD,EAAME,OAAO,aAC3BC,OAAQ,aAAaH,EAAMI,QAAQC,SAASC,OAAO,iBACnDC,SAAU,aAGNC,EAAwBf,EAAOM,EAAPN,EAAY,EAAGO,YAAO,CAClDH,QAASG,EAAMS,QAAQ,OAGnBC,EAAe,CAAC,aAAc,aAAc,aAAc,aAAc,aAAc,cAQtFC,EAAsC,IAExCC,EAACpB,EAAU,CAACqB,WAAS,EAAA,YAAW,OAAM,aAAY,iBAAiBC,UAAU,KAAKL,QAAS,EAACM,SACzFL,EAAaM,KAAKC,GACjBL,EAAClB,EAAI,CAAkBoB,UAAU,KAAKI,KAAM,CAAEC,WAAY,EAAGC,QAAS,EAAGC,OAAQ,EAAGC,OAAQ,GAAGP,SAC7FQ,EAACzB,EAAkB,CAAAiB,SAAA,CACjBH,EAACY,EAAQ,CAACC,UAAU,OAAOC,OAAQ,IAAKC,QAAQ,gBAChDf,EAACJ,EAAqB,CAAAO,SACpBH,EAACY,GAASC,UAAU,OAAOC,OAAQ,GAAIC,QAAQ,OAAOC,MAAM,cAJvDX"}
+{"version":3,"file":"LibraryTabContentSkeleton.js","sources":["../../../../../src/components/organisms/AssetManager/LibraryTabContent/LibraryTabContentSkeleton.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport Grid from '@fd/components/atoms/Grid';\nimport Skeleton from '@fd/components/atoms/Skeleton';\n\nconst StyledList = styled(Grid)<{ component: string }>(() => ({\n  listStyle: 'none',\n  margin: 0,\n  padding: 0,\n}));\n\nconst StyledSkeletonCard = styled(Box)(({ theme }) => ({\n  borderRadius: theme.radius['radius-16'],\n  border: `1px solid ${theme.palette.semantic.stroke['stroke-weak']}`,\n  overflow: 'hidden',\n}));\n\nconst StyledSkeletonContent = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(2),\n}));\n\nconst SKELETON_IDS = ['skeleton-1', 'skeleton-2', 'skeleton-3', 'skeleton-4', 'skeleton-5', 'skeleton-6'];\n\n/**\n * Skeleton loading state for the LibraryTabContent component.\n * Displays a grid of skeleton cards that match the layout of actual asset cards.\n *\n * @returns The skeleton loading grid\n */\nconst LibraryTabContentSkeleton: React.FC = () => {\n  return (\n    <StyledList container aria-busy=\"true\" aria-label=\"Loading assets\" component=\"ul\" spacing={1}>\n      {SKELETON_IDS.map((skeletonId) => (\n        <Grid key={skeletonId} component=\"li\" size={{ widescreen: 4, desktop: 4, mobile: 6, tablet: 4 }}>\n          <StyledSkeletonCard>\n            <Skeleton animation=\"wave\" height={204} variant=\"rectangular\" />\n            <StyledSkeletonContent>\n              <Skeleton animation=\"wave\" height={20} variant=\"text\" width=\"80%\" />\n            </StyledSkeletonContent>\n          </StyledSkeletonCard>\n        </Grid>\n      ))}\n    </StyledList>\n  );\n};\n\nexport default LibraryTabContentSkeleton;\n"],"names":["StyledList","styled","Grid","listStyle","margin","padding","StyledSkeletonCard","Box","theme","borderRadius","radius","border","palette","semantic","stroke","overflow","StyledSkeletonContent","spacing","SKELETON_IDS","LibraryTabContentSkeleton","_jsx","container","component","children","map","skeletonId","size","widescreen","desktop","mobile","tablet","_jsxs","Skeleton","animation","height","variant","width"],"mappings":"wNAQA,MAAMA,EAAaC,EAAOC,EAAPD,CAAoC,KAAA,CACrDE,UAAW,OACXC,OAAQ,EACRC,QAAS,KAGLC,EAAqBL,EAAOM,EAAPN,CAAY,EAAGO,YAAO,CAC/CC,aAAcD,EAAME,OAAO,aAC3BC,OAAQ,aAAaH,EAAMI,QAAQC,SAASC,OAAO,iBACnDC,SAAU,YAGNC,EAAwBf,EAAOM,EAAPN,CAAY,EAAGO,YAAO,CAClDH,QAASG,EAAMS,QAAQ,MAGnBC,EAAe,CAAC,aAAc,aAAc,aAAc,aAAc,aAAc,cAQtFC,EAAsC,IAExCC,EAACpB,EAAU,CAACqB,WAAS,EAAA,YAAW,OAAM,aAAY,iBAAiBC,UAAU,KAAKL,QAAS,EAACM,SACzFL,EAAaM,IAAKC,GACjBL,EAAClB,EAAI,CAAkBoB,UAAU,KAAKI,KAAM,CAAEC,WAAY,EAAGC,QAAS,EAAGC,OAAQ,EAAGC,OAAQ,GAAGP,SAC7FQ,EAACzB,EAAkB,CAAAiB,SAAA,CACjBH,EAACY,EAAQ,CAACC,UAAU,OAAOC,OAAQ,IAAKC,QAAQ,gBAChDf,EAACJ,EAAqB,CAAAO,SACpBH,EAACY,GAASC,UAAU,OAAOC,OAAQ,GAAIC,QAAQ,OAAOC,MAAM,cAJvDX"}

package/dist/components/organisms/AssetManager/LibraryTabContent/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime");require("react");var t=require("@mui/material/styles"),r=require("@mui/material/Box"),s=require("../../../atoms/Card/index.cjs.js"),i=require("@mui/material/Grid2"),o=require("../../../molecules/EmptyState/index.cjs.js"),a=require("../../../../icons/CheckmarkCircleSolid/index.cjs.js"),l=require("../../../../providers/TranslationProvider.cjs.js"),n=require("./LibraryTabContentSkeleton.cjs.js");const d=t.styled(i)((({theme:e})=>({listStyle:"none",margin:0,padding:e.spacing(1)}))),c=t.styled(r,{shouldForwardProp:e=>"selected"!==e})((({theme:e,selected:t})=>({width:"100%",cursor:"pointer",position:"relative","& .MuiCard-root":{borderWidth:"2px",borderColor:t?e.palette.semantic.stroke["stroke-selected"]:e.palette.semantic.stroke["stroke-weak"]},"&:focus-visible .MuiCard-root":{borderColor:e.palette.semantic.stroke["stroke-selected"],boxShadow:"none"},"&:hover .MuiCard-root":{boxShadow:"0px 4px 16px rgba(0, 0, 0, 0.2)"}}))),p=t.styled(a)((({theme:e})=>({position:"absolute",top:e.spacing(2),left:e.spacing(2),zIndex:1,color:e.palette.semantic.icon["icon-primary"],"& circle":{fill:e.palette.common.white}}))),m=t.styled(r)((({theme:e})=>({padding:e.spacing(4),maxWidth:"100%",overflow:"hidden",boxSizing:"border-box"})));module.exports=({assets:t,isLoading:r,error:a,selectedAssets:u,onAssetClick:x})=>{const{translate:h}=l.useTranslation();return r?e.jsx(n,{}):a?e.jsx(m,{children:e.jsx(o.EmptyState,{description:h("Failed_to_load_assets_please_try_again_later"),title:h("Error_loading_assets")})}):t&&0!==t.length?e.jsx(d,{container:!0,component:"ul",spacing:1,children:t.map((t=>{const r=u.has(t.id);return e.jsx(i,{"aria-selected":r,component:"li",size:{widescreen:4,desktop:4,mobile:6,tablet:4},children:e.jsxs(c,{"aria-label":`${h("Select")} ${t.fileName}`,onClick:()=>x(t),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),x(t))},role:"button",selected:r,tabIndex:0,children:[r&&e.jsx(p,{size:"lg"}),e.jsx(s,{content:t.fileName,heading:"",imageAlt:t.metadata.altText,imageSrc:`${t.url}?h=203&fit=crop`})]})},t.id)}))}):e.jsx(m,{children:e.jsx(o.EmptyState,{description:h("There_are_no_assets_to_display"),title:h("No_assets_found")})})};
+"use strict";var e=require("react/jsx-runtime");require("react");var t=require("@mui/material/styles"),r=require("@mui/material/Box"),s=require("../../../atoms/Card/index.cjs.js"),i=require("@mui/material/Grid2"),o=require("../../../molecules/EmptyState/index.cjs.js"),a=require("../../../../icons/CheckmarkCircleSolid/index.cjs.js"),l=require("../../../../providers/TranslationProvider.cjs.js"),n=require("./LibraryTabContentSkeleton.cjs.js");const d=t.styled(i)(({theme:e})=>({listStyle:"none",margin:0,padding:e.spacing(1)})),c=t.styled(r,{shouldForwardProp:e=>"selected"!==e})(({theme:e,selected:t})=>({width:"100%",cursor:"pointer",position:"relative","& .MuiCard-root":{borderWidth:"2px",borderColor:t?e.palette.semantic.stroke["stroke-selected"]:e.palette.semantic.stroke["stroke-weak"]},"&:focus-visible .MuiCard-root":{borderColor:e.palette.semantic.stroke["stroke-selected"],boxShadow:"none"},"&:hover .MuiCard-root":{boxShadow:"0px 4px 16px rgba(0, 0, 0, 0.2)"}})),p=t.styled(a)(({theme:e})=>({position:"absolute",top:e.spacing(2),left:e.spacing(2),zIndex:1,color:e.palette.semantic.icon["icon-primary"],"& circle":{fill:e.palette.common.white}})),m=t.styled(r)(({theme:e})=>({padding:e.spacing(4),maxWidth:"100%",overflow:"hidden",boxSizing:"border-box"}));module.exports=({assets:t,isLoading:r,error:a,selectedAssets:u,onAssetClick:x})=>{const{translate:h}=l.useTranslation();return r?e.jsx(n,{}):a?e.jsx(m,{children:e.jsx(o.EmptyState,{description:h("Failed_to_load_assets_please_try_again_later"),title:h("Error_loading_assets")})}):t&&0!==t.length?e.jsx(d,{container:!0,component:"ul",spacing:1,children:t.map(t=>{const r=u.has(t.id);return e.jsx(i,{"aria-selected":r,component:"li",size:{widescreen:4,desktop:4,mobile:6,tablet:4},children:e.jsxs(c,{"aria-label":`${h("Select")} ${t.fileName}`,onClick:()=>x(t),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),x(t))},role:"button",selected:r,tabIndex:0,children:[r&&e.jsx(p,{size:"lg"}),e.jsx(s,{content:t.fileName,heading:"",imageAlt:t.metadata.altText,imageSrc:`${t.url}?h=203&fit=crop`})]})},t.id)})}):e.jsx(m,{children:e.jsx(o.EmptyState,{description:h("There_are_no_assets_to_display"),title:h("No_assets_found")})})};
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/organisms/AssetManager/LibraryTabContent/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../../../src/components/organisms/AssetManager/LibraryTabContent/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport Card from '@fd/components/atoms/Card';\nimport Grid from '@fd/components/atoms/Grid';\nimport EmptyState from '@fd/components/molecules/EmptyState';\nimport CheckmarkCircleSolidIcon from '@fd/icons/CheckmarkCircleSolid';\nimport { useTranslation } from '@fd/providers/TranslationProvider';\n\nimport type { Asset } from '../types/assets.type';\nimport LibraryTabContentSkeleton from './LibraryTabContentSkeleton';\n\nconst StyledList = styled(Grid)<{ component: string }>(({ theme }) => ({\n  listStyle: 'none',\n  margin: 0,\n  padding: theme.spacing(1),\n}));\n\nconst StyledCardWrapper = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'selected',\n})<{ selected?: boolean }>(({ theme, selected }) => ({\n  width: '100%',\n  cursor: 'pointer',\n  position: 'relative',\n  '& .MuiCard-root': {\n    // Always use 2px border to prevent layout shift\n    borderWidth: '2px',\n    borderColor: selected\n      ? theme.palette.semantic.stroke['stroke-selected']\n      : theme.palette.semantic.stroke['stroke-weak'],\n  },\n  '&:focus-visible .MuiCard-root': {\n    borderColor: theme.palette.semantic.stroke['stroke-selected'],\n    boxShadow: 'none',\n  },\n  '&:hover .MuiCard-root': {\n    boxShadow: '0px 4px 16px rgba(0, 0, 0, 0.2)',\n  },\n}));\n\nconst StyledCheckmarkIcon = styled(CheckmarkCircleSolidIcon)(({ theme }) => ({\n  position: 'absolute',\n  top: theme.spacing(2),\n  left: theme.spacing(2),\n  zIndex: 1,\n  color: theme.palette.semantic.icon['icon-primary'],\n  '& circle': {\n    fill: theme.palette.common.white,\n  },\n}));\n\nconst StyledErrorContainer = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(4),\n  maxWidth: '100%',\n  overflow: 'hidden',\n  boxSizing: 'border-box',\n}));\n\n/**\n * Props for the LibraryTabContent component.\n * @param assets - Array of assets to display\n * @param isLoading - Whether the assets are being loaded\n * @param error - Error object if fetching assets failed\n * @param selectedAssets - Map of selected assets (id -> Asset) for O(1) lookup performance\n * @param onAssetClick - Callback when an asset is clicked\n */\nexport interface LibraryTabContentProps {\n  /** Array of assets to display */\n  assets?: Asset[];\n  /** Whether the assets are being loaded */\n  isLoading: boolean;\n  /** Error object if fetching assets failed */\n  error: Error | null;\n  /** Map of selected assets (id -> Asset) for O(1) lookup performance */\n  selectedAssets: Map<string, Asset>;\n  /** Callback when an asset is clicked */\n  onAssetClick: (asset: Asset) => void;\n}\n\n/**\n * LibraryTab component displays a grid of assets that can be selected.\n * Receives assets data from parent and displays loading/error states.\n *\n * @param props - The component props\n * @returns The library tab content\n */\nconst LibraryTabContent: React.FC<LibraryTabContentProps> = ({\n  assets,\n  isLoading,\n  error,\n  selectedAssets,\n  onAssetClick,\n}) => {\n  const { translate } = useTranslation();\n\n  if (isLoading) {\n    return <LibraryTabContentSkeleton />;\n  }\n\n  if (error) {\n    return (\n      <StyledErrorContainer>\n        <EmptyState\n          description={translate('Failed_to_load_assets_please_try_again_later')}\n          title={translate('Error_loading_assets')}\n        />\n      </StyledErrorContainer>\n    );\n  }\n\n  if (!assets || assets.length === 0) {\n    return (\n      // TODO: Update empty state when confirmed with design\n      <StyledErrorContainer>\n        <EmptyState\n          description={translate('There_are_no_assets_to_display')}\n          title={translate('No_assets_found')}\n        />\n      </StyledErrorContainer>\n    );\n  }\n\n  return (\n    <StyledList container component=\"ul\" spacing={1}>\n      {assets.map((asset: Asset) => {\n        const isSelected = selectedAssets.has(asset.id);\n        return (\n          <Grid\n            key={asset.id}\n            aria-selected={isSelected}\n            component=\"li\"\n            size={{ widescreen: 4, desktop: 4, mobile: 6, tablet: 4 }}\n          >\n            <StyledCardWrapper\n              aria-label={`${translate('Select')} ${asset.fileName}`}\n              onClick={() => onAssetClick(asset)}\n              onKeyDown={(e) => {\n                if (e.key === 'Enter' || e.key === ' ') {\n                  e.preventDefault();\n                  onAssetClick(asset);\n                }\n              }}\n              role=\"button\"\n              selected={isSelected}\n              tabIndex={0}\n            >\n              {isSelected && <StyledCheckmarkIcon size=\"lg\" />}\n              <Card\n                content={asset.fileName}\n                heading=\"\"\n                imageAlt={asset.metadata.altText}\n                // Image source will be an imgix url, utilise params to render the image in the correct size and format\n                imageSrc={`${asset.url}?h=203&fit=crop`}\n              />\n            </StyledCardWrapper>\n          </Grid>\n        );\n      })}\n    </StyledList>\n  );\n};\n\nexport default LibraryTabContent;\n"],"names":["StyledList","styled","Grid","theme","listStyle","margin","padding","spacing","StyledCardWrapper","Box","shouldForwardProp","prop","selected","width","cursor","position","borderWidth","borderColor","palette","semantic","stroke","boxShadow","StyledCheckmarkIcon","CheckmarkCircleSolidIcon","top","left","zIndex","color","icon","fill","common","white","StyledErrorContainer","maxWidth","overflow","boxSizing","assets","isLoading","error","selectedAssets","onAssetClick","translate","useTranslation","_jsx","LibraryTabContentSkeleton","children","EmptyState","description","title","length","container","component","map","asset","isSelected","has","id","size","widescreen","desktop","mobile","tablet","_jsxs","fileName","onClick","onKeyDown","e","key","preventDefault","role","tabIndex","Card","content","heading","imageAlt","metadata","altText","imageSrc","url"],"mappings":"4bAcA,MAAMA,EAAaC,EAAAA,OAAOC,EAAPD,EAAoC,EAAGE,YAAO,CAC/DC,UAAW,OACXC,OAAQ,EACRC,QAASH,EAAMI,QAAQ,OAGnBC,EAAoBP,EAAAA,OAAOQ,EAAK,CACpCC,kBAAoBC,GAAkB,aAATA,GADLV,EAEC,EAAGE,QAAOS,eAAU,CAC7CC,MAAO,OACPC,OAAQ,UACRC,SAAU,WACV,kBAAmB,CAEjBC,YAAa,MACbC,YAAaL,EACTT,EAAMe,QAAQC,SAASC,OAAO,mBAC9BjB,EAAMe,QAAQC,SAASC,OAAO,gBAEpC,gCAAiC,CAC/BH,YAAad,EAAMe,QAAQC,SAASC,OAAO,mBAC3CC,UAAW,QAEb,wBAAyB,CACvBA,UAAW,uCAITC,EAAsBrB,EAAAA,OAAOsB,EAAPtB,EAAiC,EAAGE,YAAO,CACrEY,SAAU,WACVS,IAAKrB,EAAMI,QAAQ,GACnBkB,KAAMtB,EAAMI,QAAQ,GACpBmB,OAAQ,EACRC,MAAOxB,EAAMe,QAAQC,SAASS,KAAK,gBACnC,WAAY,CACVC,KAAM1B,EAAMe,QAAQY,OAAOC,WAIzBC,EAAuB/B,EAAAA,OAAOQ,EAAPR,EAAY,EAAGE,YAAO,CACjDG,QAASH,EAAMI,QAAQ,GACvB0B,SAAU,OACVC,SAAU,SACVC,UAAW,gCA+B+C,EAC1DC,SACAC,YACAC,QACAC,iBACAC,mBAEA,MAAMC,UAAEA,GAAcC,mBAEtB,OAAIL,EACKM,EAAAA,IAACC,EAAyB,IAG/BN,EAEAK,EAAAA,IAACX,EAAoB,CAAAa,SACnBF,EAAAA,IAACG,EAAAA,WAAU,CACTC,YAAaN,EAAU,gDACvBO,MAAOP,EAAU,4BAMpBL,GAA4B,IAAlBA,EAAOa,OAapBN,EAAAA,IAAC3C,EAAU,CAACkD,WAAS,EAACC,UAAU,KAAK5C,QAAS,WAC3C6B,EAAOgB,KAAKC,IACX,MAAMC,EAAaf,EAAegB,IAAIF,EAAMG,IAC5C,OACEb,EAAAA,IAACzC,EAAI,CAAA,gBAEYoD,EACfH,UAAU,KACVM,KAAM,CAAEC,WAAY,EAAGC,QAAS,EAAGC,OAAQ,EAAGC,OAAQ,GAAGhB,SAEzDiB,EAAAA,KAACtD,EAAiB,CAAA,aACJ,GAAGiC,EAAU,aAAaY,EAAMU,WAC5CC,QAAS,IAAMxB,EAAaa,GAC5BY,UAAYC,IACI,UAAVA,EAAEC,KAA6B,MAAVD,EAAEC,MACzBD,EAAEE,iBACF5B,EAAaa,KAGjBgB,KAAK,SACLzD,SAAU0C,EACVgB,SAAU,YAEThB,GAAcX,EAAAA,IAACrB,EAAmB,CAACmC,KAAK,OACzCd,EAAAA,IAAC4B,EAAI,CACHC,QAASnB,EAAMU,SACfU,QAAQ,GACRC,SAAUrB,EAAMsB,SAASC,QAEzBC,SAAU,GAAGxB,EAAMyB,2BAxBlBzB,EAAMG,SAfjBb,EAAAA,IAACX,YACCW,EAAAA,IAACG,EAAAA,YACCC,YAAaN,EAAU,kCACvBO,MAAOP,EAAU"}
+{"version":3,"file":"index.cjs.js","sources":["../../../../../src/components/organisms/AssetManager/LibraryTabContent/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport Card from '@fd/components/atoms/Card';\nimport Grid from '@fd/components/atoms/Grid';\nimport EmptyState from '@fd/components/molecules/EmptyState';\nimport CheckmarkCircleSolidIcon from '@fd/icons/CheckmarkCircleSolid';\nimport { useTranslation } from '@fd/providers/TranslationProvider';\n\nimport type { Asset } from '../types/assets.type';\nimport LibraryTabContentSkeleton from './LibraryTabContentSkeleton';\n\nconst StyledList = styled(Grid)<{ component: string }>(({ theme }) => ({\n  listStyle: 'none',\n  margin: 0,\n  padding: theme.spacing(1),\n}));\n\nconst StyledCardWrapper = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'selected',\n})<{ selected?: boolean }>(({ theme, selected }) => ({\n  width: '100%',\n  cursor: 'pointer',\n  position: 'relative',\n  '& .MuiCard-root': {\n    // Always use 2px border to prevent layout shift\n    borderWidth: '2px',\n    borderColor: selected\n      ? theme.palette.semantic.stroke['stroke-selected']\n      : theme.palette.semantic.stroke['stroke-weak'],\n  },\n  '&:focus-visible .MuiCard-root': {\n    borderColor: theme.palette.semantic.stroke['stroke-selected'],\n    boxShadow: 'none',\n  },\n  '&:hover .MuiCard-root': {\n    boxShadow: '0px 4px 16px rgba(0, 0, 0, 0.2)',\n  },\n}));\n\nconst StyledCheckmarkIcon = styled(CheckmarkCircleSolidIcon)(({ theme }) => ({\n  position: 'absolute',\n  top: theme.spacing(2),\n  left: theme.spacing(2),\n  zIndex: 1,\n  color: theme.palette.semantic.icon['icon-primary'],\n  '& circle': {\n    fill: theme.palette.common.white,\n  },\n}));\n\nconst StyledErrorContainer = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(4),\n  maxWidth: '100%',\n  overflow: 'hidden',\n  boxSizing: 'border-box',\n}));\n\n/**\n * Props for the LibraryTabContent component.\n * @param assets - Array of assets to display\n * @param isLoading - Whether the assets are being loaded\n * @param error - Error object if fetching assets failed\n * @param selectedAssets - Map of selected assets (id -> Asset) for O(1) lookup performance\n * @param onAssetClick - Callback when an asset is clicked\n */\nexport interface LibraryTabContentProps {\n  /** Array of assets to display */\n  assets?: Asset[];\n  /** Whether the assets are being loaded */\n  isLoading: boolean;\n  /** Error object if fetching assets failed */\n  error: Error | null;\n  /** Map of selected assets (id -> Asset) for O(1) lookup performance */\n  selectedAssets: Map<string, Asset>;\n  /** Callback when an asset is clicked */\n  onAssetClick: (asset: Asset) => void;\n}\n\n/**\n * LibraryTab component displays a grid of assets that can be selected.\n * Receives assets data from parent and displays loading/error states.\n *\n * @param props - The component props\n * @returns The library tab content\n */\nconst LibraryTabContent: React.FC<LibraryTabContentProps> = ({\n  assets,\n  isLoading,\n  error,\n  selectedAssets,\n  onAssetClick,\n}) => {\n  const { translate } = useTranslation();\n\n  if (isLoading) {\n    return <LibraryTabContentSkeleton />;\n  }\n\n  if (error) {\n    return (\n      <StyledErrorContainer>\n        <EmptyState\n          description={translate('Failed_to_load_assets_please_try_again_later')}\n          title={translate('Error_loading_assets')}\n        />\n      </StyledErrorContainer>\n    );\n  }\n\n  if (!assets || assets.length === 0) {\n    return (\n      // TODO: Update empty state when confirmed with design\n      <StyledErrorContainer>\n        <EmptyState\n          description={translate('There_are_no_assets_to_display')}\n          title={translate('No_assets_found')}\n        />\n      </StyledErrorContainer>\n    );\n  }\n\n  return (\n    <StyledList container component=\"ul\" spacing={1}>\n      {assets.map((asset: Asset) => {\n        const isSelected = selectedAssets.has(asset.id);\n        return (\n          <Grid\n            key={asset.id}\n            aria-selected={isSelected}\n            component=\"li\"\n            size={{ widescreen: 4, desktop: 4, mobile: 6, tablet: 4 }}\n          >\n            <StyledCardWrapper\n              aria-label={`${translate('Select')} ${asset.fileName}`}\n              onClick={() => onAssetClick(asset)}\n              onKeyDown={(e) => {\n                if (e.key === 'Enter' || e.key === ' ') {\n                  e.preventDefault();\n                  onAssetClick(asset);\n                }\n              }}\n              role=\"button\"\n              selected={isSelected}\n              tabIndex={0}\n            >\n              {isSelected && <StyledCheckmarkIcon size=\"lg\" />}\n              <Card\n                content={asset.fileName}\n                heading=\"\"\n                imageAlt={asset.metadata.altText}\n                // Image source will be an imgix url, utilise params to render the image in the correct size and format\n                imageSrc={`${asset.url}?h=203&fit=crop`}\n              />\n            </StyledCardWrapper>\n          </Grid>\n        );\n      })}\n    </StyledList>\n  );\n};\n\nexport default LibraryTabContent;\n"],"names":["StyledList","styled","Grid","theme","listStyle","margin","padding","spacing","StyledCardWrapper","Box","shouldForwardProp","prop","selected","width","cursor","position","borderWidth","borderColor","palette","semantic","stroke","boxShadow","StyledCheckmarkIcon","CheckmarkCircleSolidIcon","top","left","zIndex","color","icon","fill","common","white","StyledErrorContainer","maxWidth","overflow","boxSizing","assets","isLoading","error","selectedAssets","onAssetClick","translate","useTranslation","_jsx","LibraryTabContentSkeleton","children","EmptyState","description","title","length","container","component","map","asset","isSelected","has","id","size","widescreen","desktop","mobile","tablet","_jsxs","fileName","onClick","onKeyDown","e","key","preventDefault","role","tabIndex","Card","content","heading","imageAlt","metadata","altText","imageSrc","url"],"mappings":"4bAcA,MAAMA,EAAaC,EAAAA,OAAOC,EAAPD,CAAoC,EAAGE,YAAO,CAC/DC,UAAW,OACXC,OAAQ,EACRC,QAASH,EAAMI,QAAQ,MAGnBC,EAAoBP,EAAAA,OAAOQ,EAAK,CACpCC,kBAAoBC,GAAkB,aAATA,GADLV,CAEC,EAAGE,QAAOS,eAAU,CAC7CC,MAAO,OACPC,OAAQ,UACRC,SAAU,WACV,kBAAmB,CAEjBC,YAAa,MACbC,YAAaL,EACTT,EAAMe,QAAQC,SAASC,OAAO,mBAC9BjB,EAAMe,QAAQC,SAASC,OAAO,gBAEpC,gCAAiC,CAC/BH,YAAad,EAAMe,QAAQC,SAASC,OAAO,mBAC3CC,UAAW,QAEb,wBAAyB,CACvBA,UAAW,sCAITC,EAAsBrB,EAAAA,OAAOsB,EAAPtB,CAAiC,EAAGE,YAAO,CACrEY,SAAU,WACVS,IAAKrB,EAAMI,QAAQ,GACnBkB,KAAMtB,EAAMI,QAAQ,GACpBmB,OAAQ,EACRC,MAAOxB,EAAMe,QAAQC,SAASS,KAAK,gBACnC,WAAY,CACVC,KAAM1B,EAAMe,QAAQY,OAAOC,UAIzBC,EAAuB/B,EAAAA,OAAOQ,EAAPR,CAAY,EAAGE,YAAO,CACjDG,QAASH,EAAMI,QAAQ,GACvB0B,SAAU,OACVC,SAAU,SACVC,UAAW,+BA+B+C,EAC1DC,SACAC,YACAC,QACAC,iBACAC,mBAEA,MAAMC,UAAEA,GAAcC,mBAEtB,OAAIL,EACKM,EAAAA,IAACC,EAAyB,IAG/BN,EAEAK,EAAAA,IAACX,EAAoB,CAAAa,SACnBF,EAAAA,IAACG,EAAAA,WAAU,CACTC,YAAaN,EAAU,gDACvBO,MAAOP,EAAU,4BAMpBL,GAA4B,IAAlBA,EAAOa,OAapBN,EAAAA,IAAC3C,EAAU,CAACkD,WAAS,EAACC,UAAU,KAAK5C,QAAS,WAC3C6B,EAAOgB,IAAKC,IACX,MAAMC,EAAaf,EAAegB,IAAIF,EAAMG,IAC5C,OACEb,EAAAA,IAACzC,EAAI,CAAA,gBAEYoD,EACfH,UAAU,KACVM,KAAM,CAAEC,WAAY,EAAGC,QAAS,EAAGC,OAAQ,EAAGC,OAAQ,GAAGhB,SAEzDiB,EAAAA,KAACtD,EAAiB,CAAA,aACJ,GAAGiC,EAAU,aAAaY,EAAMU,WAC5CC,QAAS,IAAMxB,EAAaa,GAC5BY,UAAYC,IACI,UAAVA,EAAEC,KAA6B,MAAVD,EAAEC,MACzBD,EAAEE,iBACF5B,EAAaa,KAGjBgB,KAAK,SACLzD,SAAU0C,EACVgB,SAAU,YAEThB,GAAcX,EAAAA,IAACrB,EAAmB,CAACmC,KAAK,OACzCd,EAAAA,IAAC4B,EAAI,CACHC,QAASnB,EAAMU,SACfU,QAAQ,GACRC,SAAUrB,EAAMsB,SAASC,QAEzBC,SAAU,GAAGxB,EAAMyB,2BAxBlBzB,EAAMG,QAfjBb,EAAAA,IAACX,YACCW,EAAAA,IAACG,EAAAA,YACCC,YAAaN,EAAU,kCACvBO,MAAOP,EAAU"}

package/dist/components/organisms/AssetManager/LibraryTabContent/index.js

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import"react";import{styled as o}from"@mui/material/styles";import r from"@mui/material/Box";import i from"../../../atoms/Card/index.js";import a from"@mui/material/Grid2";import{EmptyState as s}from"../../../molecules/EmptyState/index.js";import n from"../../../../icons/CheckmarkCircleSolid/index.js";import{useTranslation as l}from"../../../../providers/TranslationProvider.js";import d from"./LibraryTabContentSkeleton.js";const m=o(a)((({theme:e})=>({listStyle:"none",margin:0,padding:e.spacing(1)}))),c=o(r,{shouldForwardProp:e=>"selected"!==e})((({theme:e,selected:t})=>({width:"100%",cursor:"pointer",position:"relative","& .MuiCard-root":{borderWidth:"2px",borderColor:t?e.palette.semantic.stroke["stroke-selected"]:e.palette.semantic.stroke["stroke-weak"]},"&:focus-visible .MuiCard-root":{borderColor:e.palette.semantic.stroke["stroke-selected"],boxShadow:"none"},"&:hover .MuiCard-root":{boxShadow:"0px 4px 16px rgba(0, 0, 0, 0.2)"}}))),p=o(n)((({theme:e})=>({position:"absolute",top:e.spacing(2),left:e.spacing(2),zIndex:1,color:e.palette.semantic.icon["icon-primary"],"& circle":{fill:e.palette.common.white}}))),h=o(r)((({theme:e})=>({padding:e.spacing(4),maxWidth:"100%",overflow:"hidden",boxSizing:"border-box"}))),u=({assets:o,isLoading:r,error:n,selectedAssets:u,onAssetClick:f})=>{const{translate:b}=l();return r?e(d,{}):n?e(h,{children:e(s,{description:b("Failed_to_load_assets_please_try_again_later"),title:b("Error_loading_assets")})}):o&&0!==o.length?e(m,{container:!0,component:"ul",spacing:1,children:o.map((o=>{const r=u.has(o.id);return e(a,{"aria-selected":r,component:"li",size:{widescreen:4,desktop:4,mobile:6,tablet:4},children:t(c,{"aria-label":`${b("Select")} ${o.fileName}`,onClick:()=>f(o),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),f(o))},role:"button",selected:r,tabIndex:0,children:[r&&e(p,{size:"lg"}),e(i,{content:o.fileName,heading:"",imageAlt:o.metadata.altText,imageSrc:`${o.url}?h=203&fit=crop`})]})},o.id)}))}):e(h,{children:e(s,{description:b("There_are_no_assets_to_display"),title:b("No_assets_found")})})};export{u as default};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import"react";import{styled as o}from"@mui/material/styles";import r from"@mui/material/Box";import i from"../../../atoms/Card/index.js";import a from"@mui/material/Grid2";import{EmptyState as s}from"../../../molecules/EmptyState/index.js";import n from"../../../../icons/CheckmarkCircleSolid/index.js";import{useTranslation as l}from"../../../../providers/TranslationProvider.js";import d from"./LibraryTabContentSkeleton.js";const m=o(a)(({theme:e})=>({listStyle:"none",margin:0,padding:e.spacing(1)})),c=o(r,{shouldForwardProp:e=>"selected"!==e})(({theme:e,selected:t})=>({width:"100%",cursor:"pointer",position:"relative","& .MuiCard-root":{borderWidth:"2px",borderColor:t?e.palette.semantic.stroke["stroke-selected"]:e.palette.semantic.stroke["stroke-weak"]},"&:focus-visible .MuiCard-root":{borderColor:e.palette.semantic.stroke["stroke-selected"],boxShadow:"none"},"&:hover .MuiCard-root":{boxShadow:"0px 4px 16px rgba(0, 0, 0, 0.2)"}})),p=o(n)(({theme:e})=>({position:"absolute",top:e.spacing(2),left:e.spacing(2),zIndex:1,color:e.palette.semantic.icon["icon-primary"],"& circle":{fill:e.palette.common.white}})),h=o(r)(({theme:e})=>({padding:e.spacing(4),maxWidth:"100%",overflow:"hidden",boxSizing:"border-box"})),u=({assets:o,isLoading:r,error:n,selectedAssets:u,onAssetClick:f})=>{const{translate:b}=l();return r?e(d,{}):n?e(h,{children:e(s,{description:b("Failed_to_load_assets_please_try_again_later"),title:b("Error_loading_assets")})}):o&&0!==o.length?e(m,{container:!0,component:"ul",spacing:1,children:o.map(o=>{const r=u.has(o.id);return e(a,{"aria-selected":r,component:"li",size:{widescreen:4,desktop:4,mobile:6,tablet:4},children:t(c,{"aria-label":`${b("Select")} ${o.fileName}`,onClick:()=>f(o),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),f(o))},role:"button",selected:r,tabIndex:0,children:[r&&e(p,{size:"lg"}),e(i,{content:o.fileName,heading:"",imageAlt:o.metadata.altText,imageSrc:`${o.url}?h=203&fit=crop`})]})},o.id)})}):e(h,{children:e(s,{description:b("There_are_no_assets_to_display"),title:b("No_assets_found")})})};export{u as default};
 //# sourceMappingURL=index.js.map

package/dist/components/organisms/AssetManager/LibraryTabContent/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/components/organisms/AssetManager/LibraryTabContent/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport Card from '@fd/components/atoms/Card';\nimport Grid from '@fd/components/atoms/Grid';\nimport EmptyState from '@fd/components/molecules/EmptyState';\nimport CheckmarkCircleSolidIcon from '@fd/icons/CheckmarkCircleSolid';\nimport { useTranslation } from '@fd/providers/TranslationProvider';\n\nimport type { Asset } from '../types/assets.type';\nimport LibraryTabContentSkeleton from './LibraryTabContentSkeleton';\n\nconst StyledList = styled(Grid)<{ component: string }>(({ theme }) => ({\n  listStyle: 'none',\n  margin: 0,\n  padding: theme.spacing(1),\n}));\n\nconst StyledCardWrapper = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'selected',\n})<{ selected?: boolean }>(({ theme, selected }) => ({\n  width: '100%',\n  cursor: 'pointer',\n  position: 'relative',\n  '& .MuiCard-root': {\n    // Always use 2px border to prevent layout shift\n    borderWidth: '2px',\n    borderColor: selected\n      ? theme.palette.semantic.stroke['stroke-selected']\n      : theme.palette.semantic.stroke['stroke-weak'],\n  },\n  '&:focus-visible .MuiCard-root': {\n    borderColor: theme.palette.semantic.stroke['stroke-selected'],\n    boxShadow: 'none',\n  },\n  '&:hover .MuiCard-root': {\n    boxShadow: '0px 4px 16px rgba(0, 0, 0, 0.2)',\n  },\n}));\n\nconst StyledCheckmarkIcon = styled(CheckmarkCircleSolidIcon)(({ theme }) => ({\n  position: 'absolute',\n  top: theme.spacing(2),\n  left: theme.spacing(2),\n  zIndex: 1,\n  color: theme.palette.semantic.icon['icon-primary'],\n  '& circle': {\n    fill: theme.palette.common.white,\n  },\n}));\n\nconst StyledErrorContainer = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(4),\n  maxWidth: '100%',\n  overflow: 'hidden',\n  boxSizing: 'border-box',\n}));\n\n/**\n * Props for the LibraryTabContent component.\n * @param assets - Array of assets to display\n * @param isLoading - Whether the assets are being loaded\n * @param error - Error object if fetching assets failed\n * @param selectedAssets - Map of selected assets (id -> Asset) for O(1) lookup performance\n * @param onAssetClick - Callback when an asset is clicked\n */\nexport interface LibraryTabContentProps {\n  /** Array of assets to display */\n  assets?: Asset[];\n  /** Whether the assets are being loaded */\n  isLoading: boolean;\n  /** Error object if fetching assets failed */\n  error: Error | null;\n  /** Map of selected assets (id -> Asset) for O(1) lookup performance */\n  selectedAssets: Map<string, Asset>;\n  /** Callback when an asset is clicked */\n  onAssetClick: (asset: Asset) => void;\n}\n\n/**\n * LibraryTab component displays a grid of assets that can be selected.\n * Receives assets data from parent and displays loading/error states.\n *\n * @param props - The component props\n * @returns The library tab content\n */\nconst LibraryTabContent: React.FC<LibraryTabContentProps> = ({\n  assets,\n  isLoading,\n  error,\n  selectedAssets,\n  onAssetClick,\n}) => {\n  const { translate } = useTranslation();\n\n  if (isLoading) {\n    return <LibraryTabContentSkeleton />;\n  }\n\n  if (error) {\n    return (\n      <StyledErrorContainer>\n        <EmptyState\n          description={translate('Failed_to_load_assets_please_try_again_later')}\n          title={translate('Error_loading_assets')}\n        />\n      </StyledErrorContainer>\n    );\n  }\n\n  if (!assets || assets.length === 0) {\n    return (\n      // TODO: Update empty state when confirmed with design\n      <StyledErrorContainer>\n        <EmptyState\n          description={translate('There_are_no_assets_to_display')}\n          title={translate('No_assets_found')}\n        />\n      </StyledErrorContainer>\n    );\n  }\n\n  return (\n    <StyledList container component=\"ul\" spacing={1}>\n      {assets.map((asset: Asset) => {\n        const isSelected = selectedAssets.has(asset.id);\n        return (\n          <Grid\n            key={asset.id}\n            aria-selected={isSelected}\n            component=\"li\"\n            size={{ widescreen: 4, desktop: 4, mobile: 6, tablet: 4 }}\n          >\n            <StyledCardWrapper\n              aria-label={`${translate('Select')} ${asset.fileName}`}\n              onClick={() => onAssetClick(asset)}\n              onKeyDown={(e) => {\n                if (e.key === 'Enter' || e.key === ' ') {\n                  e.preventDefault();\n                  onAssetClick(asset);\n                }\n              }}\n              role=\"button\"\n              selected={isSelected}\n              tabIndex={0}\n            >\n              {isSelected && <StyledCheckmarkIcon size=\"lg\" />}\n              <Card\n                content={asset.fileName}\n                heading=\"\"\n                imageAlt={asset.metadata.altText}\n                // Image source will be an imgix url, utilise params to render the image in the correct size and format\n                imageSrc={`${asset.url}?h=203&fit=crop`}\n              />\n            </StyledCardWrapper>\n          </Grid>\n        );\n      })}\n    </StyledList>\n  );\n};\n\nexport default LibraryTabContent;\n"],"names":["StyledList","styled","Grid","theme","listStyle","margin","padding","spacing","StyledCardWrapper","Box","shouldForwardProp","prop","selected","width","cursor","position","borderWidth","borderColor","palette","semantic","stroke","boxShadow","StyledCheckmarkIcon","CheckmarkCircleSolidIcon","top","left","zIndex","color","icon","fill","common","white","StyledErrorContainer","maxWidth","overflow","boxSizing","LibraryTabContent","assets","isLoading","error","selectedAssets","onAssetClick","translate","useTranslation","_jsx","LibraryTabContentSkeleton","children","EmptyState","description","title","length","container","component","map","asset","isSelected","has","id","size","widescreen","desktop","mobile","tablet","_jsxs","fileName","onClick","onKeyDown","e","key","preventDefault","role","tabIndex","Card","content","heading","imageAlt","metadata","altText","imageSrc","url"],"mappings":"6dAcA,MAAMA,EAAaC,EAAOC,EAAPD,EAAoC,EAAGE,YAAO,CAC/DC,UAAW,OACXC,OAAQ,EACRC,QAASH,EAAMI,QAAQ,OAGnBC,EAAoBP,EAAOQ,EAAK,CACpCC,kBAAoBC,GAAkB,aAATA,GADLV,EAEC,EAAGE,QAAOS,eAAU,CAC7CC,MAAO,OACPC,OAAQ,UACRC,SAAU,WACV,kBAAmB,CAEjBC,YAAa,MACbC,YAAaL,EACTT,EAAMe,QAAQC,SAASC,OAAO,mBAC9BjB,EAAMe,QAAQC,SAASC,OAAO,gBAEpC,gCAAiC,CAC/BH,YAAad,EAAMe,QAAQC,SAASC,OAAO,mBAC3CC,UAAW,QAEb,wBAAyB,CACvBA,UAAW,uCAITC,EAAsBrB,EAAOsB,EAAPtB,EAAiC,EAAGE,YAAO,CACrEY,SAAU,WACVS,IAAKrB,EAAMI,QAAQ,GACnBkB,KAAMtB,EAAMI,QAAQ,GACpBmB,OAAQ,EACRC,MAAOxB,EAAMe,QAAQC,SAASS,KAAK,gBACnC,WAAY,CACVC,KAAM1B,EAAMe,QAAQY,OAAOC,WAIzBC,EAAuB/B,EAAOQ,EAAPR,EAAY,EAAGE,YAAO,CACjDG,QAASH,EAAMI,QAAQ,GACvB0B,SAAU,OACVC,SAAU,SACVC,UAAW,iBA+BPC,EAAsD,EAC1DC,SACAC,YACAC,QACAC,iBACAC,mBAEA,MAAMC,UAAEA,GAAcC,IAEtB,OAAIL,EACKM,EAACC,EAAyB,IAG/BN,EAEAK,EAACZ,EAAoB,CAAAc,SACnBF,EAACG,EAAU,CACTC,YAAaN,EAAU,gDACvBO,MAAOP,EAAU,4BAMpBL,GAA4B,IAAlBA,EAAOa,OAapBN,EAAC5C,EAAU,CAACmD,WAAS,EAACC,UAAU,KAAK7C,QAAS,WAC3C8B,EAAOgB,KAAKC,IACX,MAAMC,EAAaf,EAAegB,IAAIF,EAAMG,IAC5C,OACEb,EAAC1C,EAAI,CAAA,gBAEYqD,EACfH,UAAU,KACVM,KAAM,CAAEC,WAAY,EAAGC,QAAS,EAAGC,OAAQ,EAAGC,OAAQ,GAAGhB,SAEzDiB,EAACvD,EAAiB,CAAA,aACJ,GAAGkC,EAAU,aAAaY,EAAMU,WAC5CC,QAAS,IAAMxB,EAAaa,GAC5BY,UAAYC,IACI,UAAVA,EAAEC,KAA6B,MAAVD,EAAEC,MACzBD,EAAEE,iBACF5B,EAAaa,KAGjBgB,KAAK,SACL1D,SAAU2C,EACVgB,SAAU,YAEThB,GAAcX,EAACtB,EAAmB,CAACoC,KAAK,OACzCd,EAAC4B,EAAI,CACHC,QAASnB,EAAMU,SACfU,QAAQ,GACRC,SAAUrB,EAAMsB,SAASC,QAEzBC,SAAU,GAAGxB,EAAMyB,2BAxBlBzB,EAAMG,SAfjBb,EAACZ,YACCY,EAACG,GACCC,YAAaN,EAAU,kCACvBO,MAAOP,EAAU"}
+{"version":3,"file":"index.js","sources":["../../../../../src/components/organisms/AssetManager/LibraryTabContent/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport Card from '@fd/components/atoms/Card';\nimport Grid from '@fd/components/atoms/Grid';\nimport EmptyState from '@fd/components/molecules/EmptyState';\nimport CheckmarkCircleSolidIcon from '@fd/icons/CheckmarkCircleSolid';\nimport { useTranslation } from '@fd/providers/TranslationProvider';\n\nimport type { Asset } from '../types/assets.type';\nimport LibraryTabContentSkeleton from './LibraryTabContentSkeleton';\n\nconst StyledList = styled(Grid)<{ component: string }>(({ theme }) => ({\n  listStyle: 'none',\n  margin: 0,\n  padding: theme.spacing(1),\n}));\n\nconst StyledCardWrapper = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'selected',\n})<{ selected?: boolean }>(({ theme, selected }) => ({\n  width: '100%',\n  cursor: 'pointer',\n  position: 'relative',\n  '& .MuiCard-root': {\n    // Always use 2px border to prevent layout shift\n    borderWidth: '2px',\n    borderColor: selected\n      ? theme.palette.semantic.stroke['stroke-selected']\n      : theme.palette.semantic.stroke['stroke-weak'],\n  },\n  '&:focus-visible .MuiCard-root': {\n    borderColor: theme.palette.semantic.stroke['stroke-selected'],\n    boxShadow: 'none',\n  },\n  '&:hover .MuiCard-root': {\n    boxShadow: '0px 4px 16px rgba(0, 0, 0, 0.2)',\n  },\n}));\n\nconst StyledCheckmarkIcon = styled(CheckmarkCircleSolidIcon)(({ theme }) => ({\n  position: 'absolute',\n  top: theme.spacing(2),\n  left: theme.spacing(2),\n  zIndex: 1,\n  color: theme.palette.semantic.icon['icon-primary'],\n  '& circle': {\n    fill: theme.palette.common.white,\n  },\n}));\n\nconst StyledErrorContainer = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(4),\n  maxWidth: '100%',\n  overflow: 'hidden',\n  boxSizing: 'border-box',\n}));\n\n/**\n * Props for the LibraryTabContent component.\n * @param assets - Array of assets to display\n * @param isLoading - Whether the assets are being loaded\n * @param error - Error object if fetching assets failed\n * @param selectedAssets - Map of selected assets (id -> Asset) for O(1) lookup performance\n * @param onAssetClick - Callback when an asset is clicked\n */\nexport interface LibraryTabContentProps {\n  /** Array of assets to display */\n  assets?: Asset[];\n  /** Whether the assets are being loaded */\n  isLoading: boolean;\n  /** Error object if fetching assets failed */\n  error: Error | null;\n  /** Map of selected assets (id -> Asset) for O(1) lookup performance */\n  selectedAssets: Map<string, Asset>;\n  /** Callback when an asset is clicked */\n  onAssetClick: (asset: Asset) => void;\n}\n\n/**\n * LibraryTab component displays a grid of assets that can be selected.\n * Receives assets data from parent and displays loading/error states.\n *\n * @param props - The component props\n * @returns The library tab content\n */\nconst LibraryTabContent: React.FC<LibraryTabContentProps> = ({\n  assets,\n  isLoading,\n  error,\n  selectedAssets,\n  onAssetClick,\n}) => {\n  const { translate } = useTranslation();\n\n  if (isLoading) {\n    return <LibraryTabContentSkeleton />;\n  }\n\n  if (error) {\n    return (\n      <StyledErrorContainer>\n        <EmptyState\n          description={translate('Failed_to_load_assets_please_try_again_later')}\n          title={translate('Error_loading_assets')}\n        />\n      </StyledErrorContainer>\n    );\n  }\n\n  if (!assets || assets.length === 0) {\n    return (\n      // TODO: Update empty state when confirmed with design\n      <StyledErrorContainer>\n        <EmptyState\n          description={translate('There_are_no_assets_to_display')}\n          title={translate('No_assets_found')}\n        />\n      </StyledErrorContainer>\n    );\n  }\n\n  return (\n    <StyledList container component=\"ul\" spacing={1}>\n      {assets.map((asset: Asset) => {\n        const isSelected = selectedAssets.has(asset.id);\n        return (\n          <Grid\n            key={asset.id}\n            aria-selected={isSelected}\n            component=\"li\"\n            size={{ widescreen: 4, desktop: 4, mobile: 6, tablet: 4 }}\n          >\n            <StyledCardWrapper\n              aria-label={`${translate('Select')} ${asset.fileName}`}\n              onClick={() => onAssetClick(asset)}\n              onKeyDown={(e) => {\n                if (e.key === 'Enter' || e.key === ' ') {\n                  e.preventDefault();\n                  onAssetClick(asset);\n                }\n              }}\n              role=\"button\"\n              selected={isSelected}\n              tabIndex={0}\n            >\n              {isSelected && <StyledCheckmarkIcon size=\"lg\" />}\n              <Card\n                content={asset.fileName}\n                heading=\"\"\n                imageAlt={asset.metadata.altText}\n                // Image source will be an imgix url, utilise params to render the image in the correct size and format\n                imageSrc={`${asset.url}?h=203&fit=crop`}\n              />\n            </StyledCardWrapper>\n          </Grid>\n        );\n      })}\n    </StyledList>\n  );\n};\n\nexport default LibraryTabContent;\n"],"names":["StyledList","styled","Grid","theme","listStyle","margin","padding","spacing","StyledCardWrapper","Box","shouldForwardProp","prop","selected","width","cursor","position","borderWidth","borderColor","palette","semantic","stroke","boxShadow","StyledCheckmarkIcon","CheckmarkCircleSolidIcon","top","left","zIndex","color","icon","fill","common","white","StyledErrorContainer","maxWidth","overflow","boxSizing","LibraryTabContent","assets","isLoading","error","selectedAssets","onAssetClick","translate","useTranslation","_jsx","LibraryTabContentSkeleton","children","EmptyState","description","title","length","container","component","map","asset","isSelected","has","id","size","widescreen","desktop","mobile","tablet","_jsxs","fileName","onClick","onKeyDown","e","key","preventDefault","role","tabIndex","Card","content","heading","imageAlt","metadata","altText","imageSrc","url"],"mappings":"6dAcA,MAAMA,EAAaC,EAAOC,EAAPD,CAAoC,EAAGE,YAAO,CAC/DC,UAAW,OACXC,OAAQ,EACRC,QAASH,EAAMI,QAAQ,MAGnBC,EAAoBP,EAAOQ,EAAK,CACpCC,kBAAoBC,GAAkB,aAATA,GADLV,CAEC,EAAGE,QAAOS,eAAU,CAC7CC,MAAO,OACPC,OAAQ,UACRC,SAAU,WACV,kBAAmB,CAEjBC,YAAa,MACbC,YAAaL,EACTT,EAAMe,QAAQC,SAASC,OAAO,mBAC9BjB,EAAMe,QAAQC,SAASC,OAAO,gBAEpC,gCAAiC,CAC/BH,YAAad,EAAMe,QAAQC,SAASC,OAAO,mBAC3CC,UAAW,QAEb,wBAAyB,CACvBA,UAAW,sCAITC,EAAsBrB,EAAOsB,EAAPtB,CAAiC,EAAGE,YAAO,CACrEY,SAAU,WACVS,IAAKrB,EAAMI,QAAQ,GACnBkB,KAAMtB,EAAMI,QAAQ,GACpBmB,OAAQ,EACRC,MAAOxB,EAAMe,QAAQC,SAASS,KAAK,gBACnC,WAAY,CACVC,KAAM1B,EAAMe,QAAQY,OAAOC,UAIzBC,EAAuB/B,EAAOQ,EAAPR,CAAY,EAAGE,YAAO,CACjDG,QAASH,EAAMI,QAAQ,GACvB0B,SAAU,OACVC,SAAU,SACVC,UAAW,gBA+BPC,EAAsD,EAC1DC,SACAC,YACAC,QACAC,iBACAC,mBAEA,MAAMC,UAAEA,GAAcC,IAEtB,OAAIL,EACKM,EAACC,EAAyB,IAG/BN,EAEAK,EAACZ,EAAoB,CAAAc,SACnBF,EAACG,EAAU,CACTC,YAAaN,EAAU,gDACvBO,MAAOP,EAAU,4BAMpBL,GAA4B,IAAlBA,EAAOa,OAapBN,EAAC5C,EAAU,CAACmD,WAAS,EAACC,UAAU,KAAK7C,QAAS,WAC3C8B,EAAOgB,IAAKC,IACX,MAAMC,EAAaf,EAAegB,IAAIF,EAAMG,IAC5C,OACEb,EAAC1C,EAAI,CAAA,gBAEYqD,EACfH,UAAU,KACVM,KAAM,CAAEC,WAAY,EAAGC,QAAS,EAAGC,OAAQ,EAAGC,OAAQ,GAAGhB,SAEzDiB,EAACvD,EAAiB,CAAA,aACJ,GAAGkC,EAAU,aAAaY,EAAMU,WAC5CC,QAAS,IAAMxB,EAAaa,GAC5BY,UAAYC,IACI,UAAVA,EAAEC,KAA6B,MAAVD,EAAEC,MACzBD,EAAEE,iBACF5B,EAAaa,KAGjBgB,KAAK,SACL1D,SAAU2C,EACVgB,SAAU,YAEThB,GAAcX,EAACtB,EAAmB,CAACoC,KAAK,OACzCd,EAAC4B,EAAI,CACHC,QAASnB,EAAMU,SACfU,QAAQ,GACRC,SAAUrB,EAAMsB,SAASC,QAEzBC,SAAU,GAAGxB,EAAMyB,2BAxBlBzB,EAAMG,QAfjBb,EAACZ,YACCY,EAACG,GACCC,YAAaN,EAAU,kCACvBO,MAAOP,EAAU"}

package/dist/components/organisms/AssetManager/__mocks__/mockAssets.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const e=(e={})=>({...{id:"asset_e3454351fw5",fileName:"Mock Asset.jpg",contentType:"image/jpeg",url:"./images/pizza-horizontal.jpg",fileSize:1e3,createdBy:"Mock User",updatedBy:"Mock User",updatedAt:(new Date).toISOString(),createdAt:(new Date).toISOString(),orgId:"org10121",brandId:"br1",type:"Image",metadata:{tags:["mock"]}},...e}),a={data:[e({id:"asset_e3454351fw5",fileName:"Pizza Special.jpg",createdBy:"John Doe",updatedBy:"John Doe",metadata:{tags:["pizza","food"],altText:"Delicious pizza with toppings"}}),e({id:"asset_et351fw6",fileName:"Burger Combo.jpg",createdBy:"Jane Smith",updatedBy:"Jane Smith",metadata:{tags:["burger","food"],altText:"Juicy burger with fries"}}),e({id:"asset_f351fw7",fileName:"Salad Fresh.jpg",createdBy:"Bob Johnson",updatedBy:"Bob Johnson",metadata:{tags:["salad","healthy"],altText:"Fresh green salad"}}),e({id:"asset_g351fw8",fileName:"Pasta Delight.jpg",createdBy:"Alice Brown",updatedBy:"Alice Brown",metadata:{tags:["pasta","italian"]}}),e({id:"asset_h351fw9",fileName:"Dessert Special.jpg",createdBy:"Charlie Davis",updatedBy:"Charlie Davis",metadata:{tags:["dessert","sweet"]}})]};exports.createMockAsset=e,exports.createMockAssets=(a,t)=>Array.from({length:a},((a,s)=>{const i=t?.[s]||{};return e({id:(s+1).toString(),fileName:`Mock Asset ${s+1}.jpg`,...i})})),exports.mockAssets=a;
+"use strict";const e=(e={})=>({...{id:"asset_e3454351fw5",fileName:"Mock Asset.jpg",contentType:"image/jpeg",url:"./images/pizza-horizontal.jpg",fileSize:1e3,createdBy:"Mock User",updatedBy:"Mock User",updatedAt:(new Date).toISOString(),createdAt:(new Date).toISOString(),orgId:"org10121",brandId:"br1",type:"Image",metadata:{tags:["mock"]}},...e}),a={data:[e({id:"asset_e3454351fw5",fileName:"Pizza Special.jpg",createdBy:"John Doe",updatedBy:"John Doe",metadata:{tags:["pizza","food"],altText:"Delicious pizza with toppings"}}),e({id:"asset_et351fw6",fileName:"Burger Combo.jpg",createdBy:"Jane Smith",updatedBy:"Jane Smith",metadata:{tags:["burger","food"],altText:"Juicy burger with fries"}}),e({id:"asset_f351fw7",fileName:"Salad Fresh.jpg",createdBy:"Bob Johnson",updatedBy:"Bob Johnson",metadata:{tags:["salad","healthy"],altText:"Fresh green salad"}}),e({id:"asset_g351fw8",fileName:"Pasta Delight.jpg",createdBy:"Alice Brown",updatedBy:"Alice Brown",metadata:{tags:["pasta","italian"]}}),e({id:"asset_h351fw9",fileName:"Dessert Special.jpg",createdBy:"Charlie Davis",updatedBy:"Charlie Davis",metadata:{tags:["dessert","sweet"]}})]};exports.createMockAsset=e,exports.createMockAssets=(a,t)=>Array.from({length:a},(a,s)=>{const i=t?.[s]||{};return e({id:(s+1).toString(),fileName:`Mock Asset ${s+1}.jpg`,...i})}),exports.mockAssets=a;
 //# sourceMappingURL=mockAssets.cjs.js.map

package/dist/components/organisms/AssetManager/__mocks__/mockAssets.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"mockAssets.cjs.js","sources":["../../../../../src/components/organisms/AssetManager/__mocks__/mockAssets.ts"],"sourcesContent":["import type { Asset, AssetType, ListAssetsResponse } from '../types/assets.type';\n\n/**\n * Factory function to create a mock asset with customizable properties\n * @param overrides - Partial asset properties to override defaults\n * @returns A complete mock asset\n */\nexport const createMockAsset = (overrides: Partial<Asset> = {}): Asset => {\n  const defaultAsset: Asset = {\n    id: 'asset_e3454351fw5',\n    fileName: 'Mock Asset.jpg',\n    contentType: 'image/jpeg',\n    url: './images/pizza-horizontal.jpg',\n    fileSize: 1000,\n    createdBy: 'Mock User',\n    updatedBy: 'Mock User',\n    updatedAt: new Date().toISOString(),\n    createdAt: new Date().toISOString(),\n    orgId: 'org10121',\n    brandId: 'br1',\n    type: 'Image' as unknown as AssetType,\n    metadata: { tags: ['mock'] },\n  };\n\n  return { ...defaultAsset, ...overrides };\n};\n\n/**\n * Generate multiple mock assets\n * @param count - Number of assets to generate\n * @param overridesArray - Optional array of overrides for each asset\n * @returns Array of mock assets\n */\nexport const createMockAssets = (count: number, overridesArray?: Array<Partial<Asset>>): Asset[] => {\n  return Array.from({ length: count }, (_, index) => {\n    const baseOverrides = overridesArray?.[index] || {};\n    return createMockAsset({\n      id: (index + 1).toString(),\n      fileName: `Mock Asset ${index + 1}.jpg`,\n      ...baseOverrides,\n    });\n  });\n};\n\n/**\n * Pre-defined mock assets for common testing scenarios\n */\nexport const mockAssets: ListAssetsResponse = {\n  data: [\n    createMockAsset({\n      id: 'asset_e3454351fw5',\n      fileName: 'Pizza Special.jpg',\n      createdBy: 'John Doe',\n      updatedBy: 'John Doe',\n      metadata: { tags: ['pizza', 'food'], altText: 'Delicious pizza with toppings' },\n    }),\n    createMockAsset({\n      id: 'asset_et351fw6',\n      fileName: 'Burger Combo.jpg',\n      createdBy: 'Jane Smith',\n      updatedBy: 'Jane Smith',\n      metadata: { tags: ['burger', 'food'], altText: 'Juicy burger with fries' },\n    }),\n    createMockAsset({\n      id: 'asset_f351fw7',\n      fileName: 'Salad Fresh.jpg',\n      createdBy: 'Bob Johnson',\n      updatedBy: 'Bob Johnson',\n      metadata: { tags: ['salad', 'healthy'], altText: 'Fresh green salad' },\n    }),\n    createMockAsset({\n      id: 'asset_g351fw8',\n      fileName: 'Pasta Delight.jpg',\n      createdBy: 'Alice Brown',\n      updatedBy: 'Alice Brown',\n      metadata: { tags: ['pasta', 'italian'] },\n    }),\n    createMockAsset({\n      id: 'asset_h351fw9',\n      fileName: 'Dessert Special.jpg',\n      createdBy: 'Charlie Davis',\n      updatedBy: 'Charlie Davis',\n      metadata: { tags: ['dessert', 'sweet'] },\n    }),\n  ],\n};\n"],"names":["createMockAsset","overrides","id","fileName","contentType","url","fileSize","createdBy","updatedBy","updatedAt","Date","toISOString","createdAt","orgId","brandId","type","metadata","tags","mockAssets","data","altText","count","overridesArray","Array","from","length","_","index","baseOverrides","toString"],"mappings":"mBAOaA,EAAkB,CAACC,EAA4B,MAiBnD,IAhBqB,CAC1BC,GAAI,oBACJC,SAAU,iBACVC,YAAa,aACbC,IAAK,gCACLC,SAAU,IACVC,UAAW,YACXC,UAAW,YACXC,WAAW,IAAIC,MAAOC,cACtBC,WAAW,IAAIF,MAAOC,cACtBE,MAAO,WACPC,QAAS,MACTC,KAAM,QACNC,SAAU,CAAEC,KAAM,CAAC,aAGQhB,IAuBlBiB,EAAiC,CAC5CC,KAAM,CACJnB,EAAgB,CACdE,GAAI,oBACJC,SAAU,oBACVI,UAAW,WACXC,UAAW,WACXQ,SAAU,CAAEC,KAAM,CAAC,QAAS,QAASG,QAAS,mCAEhDpB,EAAgB,CACdE,GAAI,iBACJC,SAAU,mBACVI,UAAW,aACXC,UAAW,aACXQ,SAAU,CAAEC,KAAM,CAAC,SAAU,QAASG,QAAS,6BAEjDpB,EAAgB,CACdE,GAAI,gBACJC,SAAU,kBACVI,UAAW,cACXC,UAAW,cACXQ,SAAU,CAAEC,KAAM,CAAC,QAAS,WAAYG,QAAS,uBAEnDpB,EAAgB,CACdE,GAAI,gBACJC,SAAU,oBACVI,UAAW,cACXC,UAAW,cACXQ,SAAU,CAAEC,KAAM,CAAC,QAAS,cAE9BjB,EAAgB,CACdE,GAAI,gBACJC,SAAU,sBACVI,UAAW,gBACXC,UAAW,gBACXQ,SAAU,CAAEC,KAAM,CAAC,UAAW,iEAjDJ,CAACI,EAAeC,IACvCC,MAAMC,KAAK,CAAEC,OAAQJ,IAAS,CAACK,EAAGC,KACvC,MAAMC,EAAgBN,IAAiBK,IAAU,CAAA,EACjD,OAAO3B,EAAgB,CACrBE,IAAKyB,EAAQ,GAAGE,WAChB1B,SAAU,cAAcwB,EAAQ,WAC7BC"}
+{"version":3,"file":"mockAssets.cjs.js","sources":["../../../../../src/components/organisms/AssetManager/__mocks__/mockAssets.ts"],"sourcesContent":["import type { Asset, AssetType, ListAssetsResponse } from '../types/assets.type';\n\n/**\n * Factory function to create a mock asset with customizable properties\n * @param overrides - Partial asset properties to override defaults\n * @returns A complete mock asset\n */\nexport const createMockAsset = (overrides: Partial<Asset> = {}): Asset => {\n  const defaultAsset: Asset = {\n    id: 'asset_e3454351fw5',\n    fileName: 'Mock Asset.jpg',\n    contentType: 'image/jpeg',\n    url: './images/pizza-horizontal.jpg',\n    fileSize: 1000,\n    createdBy: 'Mock User',\n    updatedBy: 'Mock User',\n    updatedAt: new Date().toISOString(),\n    createdAt: new Date().toISOString(),\n    orgId: 'org10121',\n    brandId: 'br1',\n    type: 'Image' as unknown as AssetType,\n    metadata: { tags: ['mock'] },\n  };\n\n  return { ...defaultAsset, ...overrides };\n};\n\n/**\n * Generate multiple mock assets\n * @param count - Number of assets to generate\n * @param overridesArray - Optional array of overrides for each asset\n * @returns Array of mock assets\n */\nexport const createMockAssets = (count: number, overridesArray?: Array<Partial<Asset>>): Asset[] => {\n  return Array.from({ length: count }, (_, index) => {\n    const baseOverrides = overridesArray?.[index] || {};\n    return createMockAsset({\n      id: (index + 1).toString(),\n      fileName: `Mock Asset ${index + 1}.jpg`,\n      ...baseOverrides,\n    });\n  });\n};\n\n/**\n * Pre-defined mock assets for common testing scenarios\n */\nexport const mockAssets: ListAssetsResponse = {\n  data: [\n    createMockAsset({\n      id: 'asset_e3454351fw5',\n      fileName: 'Pizza Special.jpg',\n      createdBy: 'John Doe',\n      updatedBy: 'John Doe',\n      metadata: { tags: ['pizza', 'food'], altText: 'Delicious pizza with toppings' },\n    }),\n    createMockAsset({\n      id: 'asset_et351fw6',\n      fileName: 'Burger Combo.jpg',\n      createdBy: 'Jane Smith',\n      updatedBy: 'Jane Smith',\n      metadata: { tags: ['burger', 'food'], altText: 'Juicy burger with fries' },\n    }),\n    createMockAsset({\n      id: 'asset_f351fw7',\n      fileName: 'Salad Fresh.jpg',\n      createdBy: 'Bob Johnson',\n      updatedBy: 'Bob Johnson',\n      metadata: { tags: ['salad', 'healthy'], altText: 'Fresh green salad' },\n    }),\n    createMockAsset({\n      id: 'asset_g351fw8',\n      fileName: 'Pasta Delight.jpg',\n      createdBy: 'Alice Brown',\n      updatedBy: 'Alice Brown',\n      metadata: { tags: ['pasta', 'italian'] },\n    }),\n    createMockAsset({\n      id: 'asset_h351fw9',\n      fileName: 'Dessert Special.jpg',\n      createdBy: 'Charlie Davis',\n      updatedBy: 'Charlie Davis',\n      metadata: { tags: ['dessert', 'sweet'] },\n    }),\n  ],\n};\n"],"names":["createMockAsset","overrides","id","fileName","contentType","url","fileSize","createdBy","updatedBy","updatedAt","Date","toISOString","createdAt","orgId","brandId","type","metadata","tags","mockAssets","data","altText","count","overridesArray","Array","from","length","_","index","baseOverrides","toString"],"mappings":"mBAOaA,EAAkB,CAACC,EAA4B,MAiBnD,IAhBqB,CAC1BC,GAAI,oBACJC,SAAU,iBACVC,YAAa,aACbC,IAAK,gCACLC,SAAU,IACVC,UAAW,YACXC,UAAW,YACXC,WAAW,IAAIC,MAAOC,cACtBC,WAAW,IAAIF,MAAOC,cACtBE,MAAO,WACPC,QAAS,MACTC,KAAM,QACNC,SAAU,CAAEC,KAAM,CAAC,aAGQhB,IAuBlBiB,EAAiC,CAC5CC,KAAM,CACJnB,EAAgB,CACdE,GAAI,oBACJC,SAAU,oBACVI,UAAW,WACXC,UAAW,WACXQ,SAAU,CAAEC,KAAM,CAAC,QAAS,QAASG,QAAS,mCAEhDpB,EAAgB,CACdE,GAAI,iBACJC,SAAU,mBACVI,UAAW,aACXC,UAAW,aACXQ,SAAU,CAAEC,KAAM,CAAC,SAAU,QAASG,QAAS,6BAEjDpB,EAAgB,CACdE,GAAI,gBACJC,SAAU,kBACVI,UAAW,cACXC,UAAW,cACXQ,SAAU,CAAEC,KAAM,CAAC,QAAS,WAAYG,QAAS,uBAEnDpB,EAAgB,CACdE,GAAI,gBACJC,SAAU,oBACVI,UAAW,cACXC,UAAW,cACXQ,SAAU,CAAEC,KAAM,CAAC,QAAS,cAE9BjB,EAAgB,CACdE,GAAI,gBACJC,SAAU,sBACVI,UAAW,gBACXC,UAAW,gBACXQ,SAAU,CAAEC,KAAM,CAAC,UAAW,iEAjDJ,CAACI,EAAeC,IACvCC,MAAMC,KAAK,CAAEC,OAAQJ,GAAS,CAACK,EAAGC,KACvC,MAAMC,EAAgBN,IAAiBK,IAAU,CAAA,EACjD,OAAO3B,EAAgB,CACrBE,IAAKyB,EAAQ,GAAGE,WAChB1B,SAAU,cAAcwB,EAAQ,WAC7BC"}

package/dist/components/organisms/AssetManager/__mocks__/mockAssets.js

@@ -1,2 +1,2 @@
-const e=(e={})=>({...{id:"asset_e3454351fw5",fileName:"Mock Asset.jpg",contentType:"image/jpeg",url:"./images/pizza-horizontal.jpg",fileSize:1e3,createdBy:"Mock User",updatedBy:"Mock User",updatedAt:(new Date).toISOString(),createdAt:(new Date).toISOString(),orgId:"org10121",brandId:"br1",type:"Image",metadata:{tags:["mock"]}},...e}),a=(a,t)=>Array.from({length:a},((a,i)=>{const s=t?.[i]||{};return e({id:(i+1).toString(),fileName:`Mock Asset ${i+1}.jpg`,...s})})),t={data:[e({id:"asset_e3454351fw5",fileName:"Pizza Special.jpg",createdBy:"John Doe",updatedBy:"John Doe",metadata:{tags:["pizza","food"],altText:"Delicious pizza with toppings"}}),e({id:"asset_et351fw6",fileName:"Burger Combo.jpg",createdBy:"Jane Smith",updatedBy:"Jane Smith",metadata:{tags:["burger","food"],altText:"Juicy burger with fries"}}),e({id:"asset_f351fw7",fileName:"Salad Fresh.jpg",createdBy:"Bob Johnson",updatedBy:"Bob Johnson",metadata:{tags:["salad","healthy"],altText:"Fresh green salad"}}),e({id:"asset_g351fw8",fileName:"Pasta Delight.jpg",createdBy:"Alice Brown",updatedBy:"Alice Brown",metadata:{tags:["pasta","italian"]}}),e({id:"asset_h351fw9",fileName:"Dessert Special.jpg",createdBy:"Charlie Davis",updatedBy:"Charlie Davis",metadata:{tags:["dessert","sweet"]}})]};export{e as createMockAsset,a as createMockAssets,t as mockAssets};
+const e=(e={})=>({...{id:"asset_e3454351fw5",fileName:"Mock Asset.jpg",contentType:"image/jpeg",url:"./images/pizza-horizontal.jpg",fileSize:1e3,createdBy:"Mock User",updatedBy:"Mock User",updatedAt:(new Date).toISOString(),createdAt:(new Date).toISOString(),orgId:"org10121",brandId:"br1",type:"Image",metadata:{tags:["mock"]}},...e}),a=(a,t)=>Array.from({length:a},(a,i)=>{const s=t?.[i]||{};return e({id:(i+1).toString(),fileName:`Mock Asset ${i+1}.jpg`,...s})}),t={data:[e({id:"asset_e3454351fw5",fileName:"Pizza Special.jpg",createdBy:"John Doe",updatedBy:"John Doe",metadata:{tags:["pizza","food"],altText:"Delicious pizza with toppings"}}),e({id:"asset_et351fw6",fileName:"Burger Combo.jpg",createdBy:"Jane Smith",updatedBy:"Jane Smith",metadata:{tags:["burger","food"],altText:"Juicy burger with fries"}}),e({id:"asset_f351fw7",fileName:"Salad Fresh.jpg",createdBy:"Bob Johnson",updatedBy:"Bob Johnson",metadata:{tags:["salad","healthy"],altText:"Fresh green salad"}}),e({id:"asset_g351fw8",fileName:"Pasta Delight.jpg",createdBy:"Alice Brown",updatedBy:"Alice Brown",metadata:{tags:["pasta","italian"]}}),e({id:"asset_h351fw9",fileName:"Dessert Special.jpg",createdBy:"Charlie Davis",updatedBy:"Charlie Davis",metadata:{tags:["dessert","sweet"]}})]};export{e as createMockAsset,a as createMockAssets,t as mockAssets};
 //# sourceMappingURL=mockAssets.js.map

package/dist/components/organisms/AssetManager/__mocks__/mockAssets.js.map

@@ -1 +1 @@
-{"version":3,"file":"mockAssets.js","sources":["../../../../../src/components/organisms/AssetManager/__mocks__/mockAssets.ts"],"sourcesContent":["import type { Asset, AssetType, ListAssetsResponse } from '../types/assets.type';\n\n/**\n * Factory function to create a mock asset with customizable properties\n * @param overrides - Partial asset properties to override defaults\n * @returns A complete mock asset\n */\nexport const createMockAsset = (overrides: Partial<Asset> = {}): Asset => {\n  const defaultAsset: Asset = {\n    id: 'asset_e3454351fw5',\n    fileName: 'Mock Asset.jpg',\n    contentType: 'image/jpeg',\n    url: './images/pizza-horizontal.jpg',\n    fileSize: 1000,\n    createdBy: 'Mock User',\n    updatedBy: 'Mock User',\n    updatedAt: new Date().toISOString(),\n    createdAt: new Date().toISOString(),\n    orgId: 'org10121',\n    brandId: 'br1',\n    type: 'Image' as unknown as AssetType,\n    metadata: { tags: ['mock'] },\n  };\n\n  return { ...defaultAsset, ...overrides };\n};\n\n/**\n * Generate multiple mock assets\n * @param count - Number of assets to generate\n * @param overridesArray - Optional array of overrides for each asset\n * @returns Array of mock assets\n */\nexport const createMockAssets = (count: number, overridesArray?: Array<Partial<Asset>>): Asset[] => {\n  return Array.from({ length: count }, (_, index) => {\n    const baseOverrides = overridesArray?.[index] || {};\n    return createMockAsset({\n      id: (index + 1).toString(),\n      fileName: `Mock Asset ${index + 1}.jpg`,\n      ...baseOverrides,\n    });\n  });\n};\n\n/**\n * Pre-defined mock assets for common testing scenarios\n */\nexport const mockAssets: ListAssetsResponse = {\n  data: [\n    createMockAsset({\n      id: 'asset_e3454351fw5',\n      fileName: 'Pizza Special.jpg',\n      createdBy: 'John Doe',\n      updatedBy: 'John Doe',\n      metadata: { tags: ['pizza', 'food'], altText: 'Delicious pizza with toppings' },\n    }),\n    createMockAsset({\n      id: 'asset_et351fw6',\n      fileName: 'Burger Combo.jpg',\n      createdBy: 'Jane Smith',\n      updatedBy: 'Jane Smith',\n      metadata: { tags: ['burger', 'food'], altText: 'Juicy burger with fries' },\n    }),\n    createMockAsset({\n      id: 'asset_f351fw7',\n      fileName: 'Salad Fresh.jpg',\n      createdBy: 'Bob Johnson',\n      updatedBy: 'Bob Johnson',\n      metadata: { tags: ['salad', 'healthy'], altText: 'Fresh green salad' },\n    }),\n    createMockAsset({\n      id: 'asset_g351fw8',\n      fileName: 'Pasta Delight.jpg',\n      createdBy: 'Alice Brown',\n      updatedBy: 'Alice Brown',\n      metadata: { tags: ['pasta', 'italian'] },\n    }),\n    createMockAsset({\n      id: 'asset_h351fw9',\n      fileName: 'Dessert Special.jpg',\n      createdBy: 'Charlie Davis',\n      updatedBy: 'Charlie Davis',\n      metadata: { tags: ['dessert', 'sweet'] },\n    }),\n  ],\n};\n"],"names":["createMockAsset","overrides","id","fileName","contentType","url","fileSize","createdBy","updatedBy","updatedAt","Date","toISOString","createdAt","orgId","brandId","type","metadata","tags","createMockAssets","count","overridesArray","Array","from","length","_","index","baseOverrides","toString","mockAssets","data","altText"],"mappings":"MAOaA,EAAkB,CAACC,EAA4B,MAiBnD,IAhBqB,CAC1BC,GAAI,oBACJC,SAAU,iBACVC,YAAa,aACbC,IAAK,gCACLC,SAAU,IACVC,UAAW,YACXC,UAAW,YACXC,WAAW,IAAIC,MAAOC,cACtBC,WAAW,IAAIF,MAAOC,cACtBE,MAAO,WACPC,QAAS,MACTC,KAAM,QACNC,SAAU,CAAEC,KAAM,CAAC,aAGQhB,IASlBiB,EAAmB,CAACC,EAAeC,IACvCC,MAAMC,KAAK,CAAEC,OAAQJ,IAAS,CAACK,EAAGC,KACvC,MAAMC,EAAgBN,IAAiBK,IAAU,CAAA,EACjD,OAAOzB,EAAgB,CACrBE,IAAKuB,EAAQ,GAAGE,WAChBxB,SAAU,cAAcsB,EAAQ,WAC7BC,OAQIE,EAAiC,CAC5CC,KAAM,CACJ7B,EAAgB,CACdE,GAAI,oBACJC,SAAU,oBACVI,UAAW,WACXC,UAAW,WACXQ,SAAU,CAAEC,KAAM,CAAC,QAAS,QAASa,QAAS,mCAEhD9B,EAAgB,CACdE,GAAI,iBACJC,SAAU,mBACVI,UAAW,aACXC,UAAW,aACXQ,SAAU,CAAEC,KAAM,CAAC,SAAU,QAASa,QAAS,6BAEjD9B,EAAgB,CACdE,GAAI,gBACJC,SAAU,kBACVI,UAAW,cACXC,UAAW,cACXQ,SAAU,CAAEC,KAAM,CAAC,QAAS,WAAYa,QAAS,uBAEnD9B,EAAgB,CACdE,GAAI,gBACJC,SAAU,oBACVI,UAAW,cACXC,UAAW,cACXQ,SAAU,CAAEC,KAAM,CAAC,QAAS,cAE9BjB,EAAgB,CACdE,GAAI,gBACJC,SAAU,sBACVI,UAAW,gBACXC,UAAW,gBACXQ,SAAU,CAAEC,KAAM,CAAC,UAAW"}
+{"version":3,"file":"mockAssets.js","sources":["../../../../../src/components/organisms/AssetManager/__mocks__/mockAssets.ts"],"sourcesContent":["import type { Asset, AssetType, ListAssetsResponse } from '../types/assets.type';\n\n/**\n * Factory function to create a mock asset with customizable properties\n * @param overrides - Partial asset properties to override defaults\n * @returns A complete mock asset\n */\nexport const createMockAsset = (overrides: Partial<Asset> = {}): Asset => {\n  const defaultAsset: Asset = {\n    id: 'asset_e3454351fw5',\n    fileName: 'Mock Asset.jpg',\n    contentType: 'image/jpeg',\n    url: './images/pizza-horizontal.jpg',\n    fileSize: 1000,\n    createdBy: 'Mock User',\n    updatedBy: 'Mock User',\n    updatedAt: new Date().toISOString(),\n    createdAt: new Date().toISOString(),\n    orgId: 'org10121',\n    brandId: 'br1',\n    type: 'Image' as unknown as AssetType,\n    metadata: { tags: ['mock'] },\n  };\n\n  return { ...defaultAsset, ...overrides };\n};\n\n/**\n * Generate multiple mock assets\n * @param count - Number of assets to generate\n * @param overridesArray - Optional array of overrides for each asset\n * @returns Array of mock assets\n */\nexport const createMockAssets = (count: number, overridesArray?: Array<Partial<Asset>>): Asset[] => {\n  return Array.from({ length: count }, (_, index) => {\n    const baseOverrides = overridesArray?.[index] || {};\n    return createMockAsset({\n      id: (index + 1).toString(),\n      fileName: `Mock Asset ${index + 1}.jpg`,\n      ...baseOverrides,\n    });\n  });\n};\n\n/**\n * Pre-defined mock assets for common testing scenarios\n */\nexport const mockAssets: ListAssetsResponse = {\n  data: [\n    createMockAsset({\n      id: 'asset_e3454351fw5',\n      fileName: 'Pizza Special.jpg',\n      createdBy: 'John Doe',\n      updatedBy: 'John Doe',\n      metadata: { tags: ['pizza', 'food'], altText: 'Delicious pizza with toppings' },\n    }),\n    createMockAsset({\n      id: 'asset_et351fw6',\n      fileName: 'Burger Combo.jpg',\n      createdBy: 'Jane Smith',\n      updatedBy: 'Jane Smith',\n      metadata: { tags: ['burger', 'food'], altText: 'Juicy burger with fries' },\n    }),\n    createMockAsset({\n      id: 'asset_f351fw7',\n      fileName: 'Salad Fresh.jpg',\n      createdBy: 'Bob Johnson',\n      updatedBy: 'Bob Johnson',\n      metadata: { tags: ['salad', 'healthy'], altText: 'Fresh green salad' },\n    }),\n    createMockAsset({\n      id: 'asset_g351fw8',\n      fileName: 'Pasta Delight.jpg',\n      createdBy: 'Alice Brown',\n      updatedBy: 'Alice Brown',\n      metadata: { tags: ['pasta', 'italian'] },\n    }),\n    createMockAsset({\n      id: 'asset_h351fw9',\n      fileName: 'Dessert Special.jpg',\n      createdBy: 'Charlie Davis',\n      updatedBy: 'Charlie Davis',\n      metadata: { tags: ['dessert', 'sweet'] },\n    }),\n  ],\n};\n"],"names":["createMockAsset","overrides","id","fileName","contentType","url","fileSize","createdBy","updatedBy","updatedAt","Date","toISOString","createdAt","orgId","brandId","type","metadata","tags","createMockAssets","count","overridesArray","Array","from","length","_","index","baseOverrides","toString","mockAssets","data","altText"],"mappings":"MAOaA,EAAkB,CAACC,EAA4B,MAiBnD,IAhBqB,CAC1BC,GAAI,oBACJC,SAAU,iBACVC,YAAa,aACbC,IAAK,gCACLC,SAAU,IACVC,UAAW,YACXC,UAAW,YACXC,WAAW,IAAIC,MAAOC,cACtBC,WAAW,IAAIF,MAAOC,cACtBE,MAAO,WACPC,QAAS,MACTC,KAAM,QACNC,SAAU,CAAEC,KAAM,CAAC,aAGQhB,IASlBiB,EAAmB,CAACC,EAAeC,IACvCC,MAAMC,KAAK,CAAEC,OAAQJ,GAAS,CAACK,EAAGC,KACvC,MAAMC,EAAgBN,IAAiBK,IAAU,CAAA,EACjD,OAAOzB,EAAgB,CACrBE,IAAKuB,EAAQ,GAAGE,WAChBxB,SAAU,cAAcsB,EAAQ,WAC7BC,MAQIE,EAAiC,CAC5CC,KAAM,CACJ7B,EAAgB,CACdE,GAAI,oBACJC,SAAU,oBACVI,UAAW,WACXC,UAAW,WACXQ,SAAU,CAAEC,KAAM,CAAC,QAAS,QAASa,QAAS,mCAEhD9B,EAAgB,CACdE,GAAI,iBACJC,SAAU,mBACVI,UAAW,aACXC,UAAW,aACXQ,SAAU,CAAEC,KAAM,CAAC,SAAU,QAASa,QAAS,6BAEjD9B,EAAgB,CACdE,GAAI,gBACJC,SAAU,kBACVI,UAAW,cACXC,UAAW,cACXQ,SAAU,CAAEC,KAAM,CAAC,QAAS,WAAYa,QAAS,uBAEnD9B,EAAgB,CACdE,GAAI,gBACJC,SAAU,oBACVI,UAAW,cACXC,UAAW,cACXQ,SAAU,CAAEC,KAAM,CAAC,QAAS,cAE9BjB,EAAgB,CACdE,GAAI,gBACJC,SAAU,sBACVI,UAAW,gBACXC,UAAW,gBACXQ,SAAU,CAAEC,KAAM,CAAC,UAAW"}

package/dist/components/organisms/AssetManager/hooks/useAssetSelection.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react");exports.useAssetSelection=({maxSelect:s})=>{const[t,a]=e.useState(new Map);return{selectedAssetsMap:t,handleAssetClick:e.useCallback((e=>{a((t=>{const a=t.has(e.id),c=new Map(t);return a?c.delete(e.id):1===s?(c.clear(),c.set(e.id,e)):c.size<s&&c.set(e.id,e),c}))}),[s]),clearSelection:e.useCallback((()=>{a(new Map)}),[]),addAssetsToSelection:e.useCallback((e=>{a((t=>{const a=new Map(t);for(const t of e)a.size<s&&a.set(t.id,t);return a}))}),[s])}};
+"use strict";var e=require("react");exports.useAssetSelection=({maxSelect:s})=>{const[t,a]=e.useState(new Map);return{selectedAssetsMap:t,handleAssetClick:e.useCallback(e=>{a(t=>{const a=t.has(e.id),c=new Map(t);return a?c.delete(e.id):1===s?(c.clear(),c.set(e.id,e)):c.size<s&&c.set(e.id,e),c})},[s]),clearSelection:e.useCallback(()=>{a(new Map)},[]),addAssetsToSelection:e.useCallback(e=>{a(t=>{const a=new Map(t);for(const t of e)a.size<s&&a.set(t.id,t);return a})},[s])}};
 //# sourceMappingURL=useAssetSelection.cjs.js.map

package/dist/components/organisms/AssetManager/hooks/useAssetSelection.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAssetSelection.cjs.js","sources":["../../../../../src/components/organisms/AssetManager/hooks/useAssetSelection.ts"],"sourcesContent":["import { useCallback, useState } from 'react';\n\nimport type { Asset } from '../types/assets.type';\n\ninterface UseAssetSelectionOptions {\n  maxSelect: number;\n}\n\ninterface UseAssetSelectionReturn {\n  selectedAssetsMap: Map<string, Asset>;\n  handleAssetClick: (asset: Asset) => void;\n  clearSelection: () => void;\n  addAssetsToSelection: (assets: Asset[]) => void;\n}\n\n/**\n * Custom hook to manage asset selection state and logic\n * @param options - Configuration options including maxSelect limit\n * @returns Selection state and handlers\n */\nexport const useAssetSelection = ({ maxSelect }: UseAssetSelectionOptions): UseAssetSelectionReturn => {\n  const [selectedAssetsMap, setSelectedAssetsMap] = useState<Map<string, Asset>>(new Map());\n\n  const handleAssetClick = useCallback(\n    (asset: Asset): void => {\n      setSelectedAssetsMap((prevMap) => {\n        const isSelected = prevMap.has(asset.id);\n        const newMap = new Map(prevMap);\n\n        if (isSelected) {\n          // Always allow deselecting an already selected asset\n          newMap.delete(asset.id);\n        } else if (maxSelect === 1) {\n          // Single select mode: replace selection\n          newMap.clear();\n          newMap.set(asset.id, asset);\n        } else if (newMap.size < maxSelect) {\n          // Multi-select mode: add if under limit\n          newMap.set(asset.id, asset);\n        }\n        // If at max limit and trying to select a new asset, do nothing\n        return newMap;\n      });\n    },\n    [maxSelect],\n  );\n\n  const clearSelection = useCallback((): void => {\n    setSelectedAssetsMap(new Map());\n  }, []);\n\n  const addAssetsToSelection = useCallback(\n    (assets: Asset[]): void => {\n      setSelectedAssetsMap((prevMap) => {\n        const newMap = new Map(prevMap);\n        // Add uploaded assets to selection, respecting maxSelect limit\n        for (const asset of assets) {\n          if (newMap.size < maxSelect) {\n            newMap.set(asset.id, asset);\n          }\n        }\n        return newMap;\n      });\n    },\n    [maxSelect],\n  );\n\n  return {\n    selectedAssetsMap,\n    handleAssetClick,\n    clearSelection,\n    addAssetsToSelection,\n  };\n};\n"],"names":["maxSelect","selectedAssetsMap","setSelectedAssetsMap","useState","Map","handleAssetClick","useCallback","asset","prevMap","isSelected","has","id","newMap","delete","clear","set","size","clearSelection","addAssetsToSelection","assets"],"mappings":"8DAoBiC,EAAGA,gBAClC,MAAOC,EAAmBC,GAAwBC,EAAAA,SAA6B,IAAIC,KA8CnF,MAAO,CACLH,oBACAI,iBA9CuBC,eACtBC,IACCL,GAAsBM,IACpB,MAAMC,EAAaD,EAAQE,IAAIH,EAAMI,IAC/BC,EAAS,IAAIR,IAAII,GAcvB,OAZIC,EAEFG,EAAOC,OAAON,EAAMI,IACG,IAAdX,GAETY,EAAOE,QACPF,EAAOG,IAAIR,EAAMI,GAAIJ,IACZK,EAAOI,KAAOhB,GAEvBY,EAAOG,IAAIR,EAAMI,GAAIJ,GAGhBK,OAGX,CAACZ,IA0BDiB,eAvBqBX,EAAAA,aAAY,KACjCJ,EAAqB,IAAIE,OACxB,IAsBDc,qBApB2BZ,eAC1Ba,IACCjB,GAAsBM,IACpB,MAAMI,EAAS,IAAIR,IAAII,GAEvB,IAAK,MAAMD,KAASY,EACdP,EAAOI,KAAOhB,GAChBY,EAAOG,IAAIR,EAAMI,GAAIJ,GAGzB,OAAOK,OAGX,CAACZ"}
+{"version":3,"file":"useAssetSelection.cjs.js","sources":["../../../../../src/components/organisms/AssetManager/hooks/useAssetSelection.ts"],"sourcesContent":["import { useCallback, useState } from 'react';\n\nimport type { Asset } from '../types/assets.type';\n\ninterface UseAssetSelectionOptions {\n  maxSelect: number;\n}\n\ninterface UseAssetSelectionReturn {\n  selectedAssetsMap: Map<string, Asset>;\n  handleAssetClick: (asset: Asset) => void;\n  clearSelection: () => void;\n  addAssetsToSelection: (assets: Asset[]) => void;\n}\n\n/**\n * Custom hook to manage asset selection state and logic\n * @param options - Configuration options including maxSelect limit\n * @returns Selection state and handlers\n */\nexport const useAssetSelection = ({ maxSelect }: UseAssetSelectionOptions): UseAssetSelectionReturn => {\n  const [selectedAssetsMap, setSelectedAssetsMap] = useState<Map<string, Asset>>(new Map());\n\n  const handleAssetClick = useCallback(\n    (asset: Asset): void => {\n      setSelectedAssetsMap((prevMap) => {\n        const isSelected = prevMap.has(asset.id);\n        const newMap = new Map(prevMap);\n\n        if (isSelected) {\n          // Always allow deselecting an already selected asset\n          newMap.delete(asset.id);\n        } else if (maxSelect === 1) {\n          // Single select mode: replace selection\n          newMap.clear();\n          newMap.set(asset.id, asset);\n        } else if (newMap.size < maxSelect) {\n          // Multi-select mode: add if under limit\n          newMap.set(asset.id, asset);\n        }\n        // If at max limit and trying to select a new asset, do nothing\n        return newMap;\n      });\n    },\n    [maxSelect],\n  );\n\n  const clearSelection = useCallback((): void => {\n    setSelectedAssetsMap(new Map());\n  }, []);\n\n  const addAssetsToSelection = useCallback(\n    (assets: Asset[]): void => {\n      setSelectedAssetsMap((prevMap) => {\n        const newMap = new Map(prevMap);\n        // Add uploaded assets to selection, respecting maxSelect limit\n        for (const asset of assets) {\n          if (newMap.size < maxSelect) {\n            newMap.set(asset.id, asset);\n          }\n        }\n        return newMap;\n      });\n    },\n    [maxSelect],\n  );\n\n  return {\n    selectedAssetsMap,\n    handleAssetClick,\n    clearSelection,\n    addAssetsToSelection,\n  };\n};\n"],"names":["maxSelect","selectedAssetsMap","setSelectedAssetsMap","useState","Map","handleAssetClick","useCallback","asset","prevMap","isSelected","has","id","newMap","delete","clear","set","size","clearSelection","addAssetsToSelection","assets"],"mappings":"8DAoBiC,EAAGA,gBAClC,MAAOC,EAAmBC,GAAwBC,EAAAA,SAA6B,IAAIC,KA8CnF,MAAO,CACLH,oBACAI,iBA9CuBC,cACtBC,IACCL,EAAsBM,IACpB,MAAMC,EAAaD,EAAQE,IAAIH,EAAMI,IAC/BC,EAAS,IAAIR,IAAII,GAcvB,OAZIC,EAEFG,EAAOC,OAAON,EAAMI,IACG,IAAdX,GAETY,EAAOE,QACPF,EAAOG,IAAIR,EAAMI,GAAIJ,IACZK,EAAOI,KAAOhB,GAEvBY,EAAOG,IAAIR,EAAMI,GAAIJ,GAGhBK,KAGX,CAACZ,IA0BDiB,eAvBqBX,EAAAA,YAAY,KACjCJ,EAAqB,IAAIE,MACxB,IAsBDc,qBApB2BZ,cAC1Ba,IACCjB,EAAsBM,IACpB,MAAMI,EAAS,IAAIR,IAAII,GAEvB,IAAK,MAAMD,KAASY,EACdP,EAAOI,KAAOhB,GAChBY,EAAOG,IAAIR,EAAMI,GAAIJ,GAGzB,OAAOK,KAGX,CAACZ"}

package/dist/components/organisms/AssetManager/hooks/useAssetSelection.js

@@ -1,2 +1,2 @@
-import{useState as e,useCallback as t}from"react";const s=({maxSelect:s})=>{const[n,c]=e(new Map);return{selectedAssetsMap:n,handleAssetClick:t((e=>{c((t=>{const n=t.has(e.id),c=new Map(t);return n?c.delete(e.id):1===s?(c.clear(),c.set(e.id,e)):c.size<s&&c.set(e.id,e),c}))}),[s]),clearSelection:t((()=>{c(new Map)}),[]),addAssetsToSelection:t((e=>{c((t=>{const n=new Map(t);for(const t of e)n.size<s&&n.set(t.id,t);return n}))}),[s])}};export{s as useAssetSelection};
+import{useState as e,useCallback as t}from"react";const s=({maxSelect:s})=>{const[n,c]=e(new Map);return{selectedAssetsMap:n,handleAssetClick:t(e=>{c(t=>{const n=t.has(e.id),c=new Map(t);return n?c.delete(e.id):1===s?(c.clear(),c.set(e.id,e)):c.size<s&&c.set(e.id,e),c})},[s]),clearSelection:t(()=>{c(new Map)},[]),addAssetsToSelection:t(e=>{c(t=>{const n=new Map(t);for(const t of e)n.size<s&&n.set(t.id,t);return n})},[s])}};export{s as useAssetSelection};
 //# sourceMappingURL=useAssetSelection.js.map