@flipdish/portal-library 7.10.4 → 7.10.6

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"),s=require("@mui/material/Box"),r=require("../../../atoms/Card/index.cjs.js"),i=require("../../../atoms/CircularProgress/index.cjs.js"),a=require("@mui/material/Grid2"),o=require("../../../molecules/EmptyState/index.cjs.js"),l=require("../../../../icons/CheckmarkCircleSolid/index.cjs.js"),n=require("../hooks/useAssets.cjs.js");const d=t.styled(a)((()=>({listStyle:"none",margin:0,padding:0}))),c=t.styled(s,{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"]:"transparent",boxShadow:t?"none":`inset 0 0 0 1px ${e.palette.semantic.stroke["stroke-weak"]}`},"&:focus-visible .MuiCard-root":{borderColor:e.palette.semantic.stroke["stroke-selected"],boxShadow:"none"}}))),m=t.styled(l)((({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}}))),p=t.styled(s)((({theme:e})=>({display:"flex",justifyContent:"center",alignItems:"center",minHeight:"200px",padding:e.spacing(4)}))),u=t.styled(s)((({theme:e})=>({padding:e.spacing(4)})));module.exports=({orgId:t,brandId:s,enabled:l,selectedAssets:x,onAssetClick:g})=>{const{data:j,isLoading:h,error:y}=n.useGetAssets(t,l,s);return h?e.jsx(p,{children:e.jsx(i.CircularProgress,{size:"large"})}):y?e.jsx(u,{children:e.jsx(o.EmptyState,{description:"Failed to load assets. Please try again later.",title:"Error loading assets"})}):j&&0!==j.length?e.jsx(d,{container:!0,component:"ul",spacing:1,children:j.map((t=>{const s=x.has(t.id);return e.jsx(a,{"aria-selected":s,component:"li",size:{widescreen:3,desktop:3,mobile:6,tablet:4},children:e.jsxs(c,{"aria-label":"Select "+t.fileName,onClick:()=>g(t),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),g(t))},role:"button",selected:s,tabIndex:0,children:[s&&e.jsx(m,{size:"lg"}),e.jsx(r,{content:t.fileName,heading:"",imageAlt:t.metadata.altText,imageSrc:t.url})]})},t.id)}))}):e.jsx(u,{children:e.jsx(o.EmptyState,{description:"No assets available to display.",title:"No assets found"})})};
+"use strict";var e=require("react/jsx-runtime");require("react");var t=require("@mui/material/styles"),s=require("@mui/material/Box"),r=require("../../../atoms/Card/index.cjs.js"),i=require("../../../atoms/CircularProgress/index.cjs.js"),a=require("@mui/material/Grid2"),o=require("../../../molecules/EmptyState/index.cjs.js"),l=require("../../../../icons/CheckmarkCircleSolid/index.cjs.js"),n=require("../hooks/useGetAssets.cjs.js");const d=t.styled(a)((()=>({listStyle:"none",margin:0,padding:0}))),c=t.styled(s,{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"]:"transparent",boxShadow:t?"none":`inset 0 0 0 1px ${e.palette.semantic.stroke["stroke-weak"]}`},"&:focus-visible .MuiCard-root":{borderColor:e.palette.semantic.stroke["stroke-selected"],boxShadow:"none"}}))),m=t.styled(l)((({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}}))),p=t.styled(s)((({theme:e})=>({display:"flex",justifyContent:"center",alignItems:"center",minHeight:"200px",padding:e.spacing(4)}))),u=t.styled(s)((({theme:e})=>({padding:e.spacing(4)})));module.exports=({orgId:t,brandId:s,enabled:l,selectedAssets:x,onAssetClick:g})=>{const{data:j,isLoading:h,error:y}=n.useGetAssets(t,l,s);return h?e.jsx(p,{children:e.jsx(i.CircularProgress,{size:"large"})}):y?e.jsx(u,{children:e.jsx(o.EmptyState,{description:"Failed to load assets. Please try again later.",title:"Error loading assets"})}):j&&0!==j.data.length?e.jsx(d,{container:!0,component:"ul",spacing:1,children:j.data.map((t=>{const s=x.has(t.id);return e.jsx(a,{"aria-selected":s,component:"li",size:{widescreen:3,desktop:3,mobile:6,tablet:4},children:e.jsxs(c,{"aria-label":"Select "+t.fileName,onClick:()=>g(t),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),g(t))},role:"button",selected:s,tabIndex:0,children:[s&&e.jsx(m,{size:"lg"}),e.jsx(r,{content:t.fileName,heading:"",imageAlt:t.metadata.altText,imageSrc:t.url})]})},t.id)}))}):e.jsx(u,{children:e.jsx(o.EmptyState,{description:"No assets available to display.",title:"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 CircularProgress from '@fd/components/atoms/CircularProgress';\nimport Grid from '@fd/components/atoms/Grid';\nimport EmptyState from '@fd/components/molecules/EmptyState';\nimport CheckmarkCircleSolidIcon from '@fd/icons/CheckmarkCircleSolid';\n\nimport { useGetAssets } from '../hooks/useAssets';\nimport type { Asset } from '../types';\n\nconst StyledList = styled(Grid)<{ component: string }>(() => ({\n  listStyle: 'none',\n  margin: 0,\n  padding: 0,\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 ? theme.palette.semantic.stroke['stroke-selected'] : 'transparent',\n    // Use box-shadow to create the visual 1px border when not selected\n    // This prevents layout shift while maintaining the visual appearance\n    boxShadow: selected ? 'none' : `inset 0 0 0 1px ${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}));\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 StyledLoadingContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  justifyContent: 'center',\n  alignItems: 'center',\n  minHeight: '200px',\n  padding: theme.spacing(4),\n}));\n\nconst StyledErrorContainer = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(4),\n}));\n\n/**\n * Props for the LibraryTabContent component.\n * @param orgId - Organization ID for fetching assets\n * @param brandId - Brand ID for fetching assets\n * @param enabled - Whether the component is enabled (for conditional fetching)\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  /** Organization ID for fetching assets */\n  orgId: string;\n  /** Brand ID for fetching assets */\n  brandId?: string;\n  /** Whether the component is enabled (for conditional fetching) */\n  enabled: boolean;\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 * Handles fetching assets internally 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  orgId,\n  brandId,\n  enabled,\n  selectedAssets,\n  onAssetClick,\n}) => {\n  const { data: assets, isLoading, error } = useGetAssets(orgId, enabled, brandId);\n\n  if (isLoading) {\n    return (\n      <StyledLoadingContainer>\n        <CircularProgress size=\"large\" />\n      </StyledLoadingContainer>\n    );\n  }\n\n  if (error) {\n    return (\n      <StyledErrorContainer>\n        <EmptyState\n          description=\"Failed to load assets. Please try again later.\"\n          title=\"Error loading assets\"\n        />\n      </StyledErrorContainer>\n    );\n  }\n\n  if (!assets || assets.length === 0) {\n    return (\n      <StyledErrorContainer>\n        <EmptyState description=\"No assets available to display.\" title=\"No assets found\" />\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: 3, desktop: 3, mobile: 6, tablet: 4 }}\n          >\n            <StyledCardWrapper\n              aria-label={'Select ' + asset.fileName} // TODO: translate this text when translate provider is added\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                imageSrc={asset.url}\n              />\n            </StyledCardWrapper>\n          </Grid>\n        );\n      })}\n    </StyledList>\n  );\n};\n\nexport default LibraryTabContent;\n"],"names":["StyledList","styled","Grid","listStyle","margin","padding","StyledCardWrapper","Box","shouldForwardProp","prop","theme","selected","width","cursor","position","borderWidth","borderColor","palette","semantic","stroke","boxShadow","StyledCheckmarkIcon","CheckmarkCircleSolidIcon","top","spacing","left","zIndex","color","icon","fill","common","white","StyledLoadingContainer","display","justifyContent","alignItems","minHeight","StyledErrorContainer","orgId","brandId","enabled","selectedAssets","onAssetClick","data","assets","isLoading","error","useGetAssets","_jsx","children","CircularProgress","size","EmptyState","description","title","length","container","component","map","asset","isSelected","has","id","widescreen","desktop","mobile","tablet","_jsxs","fileName","onClick","onKeyDown","e","key","preventDefault","role","tabIndex","Card","content","heading","imageAlt","metadata","altText","imageSrc","url"],"mappings":"+aAcA,MAAMA,EAAaC,EAAAA,OAAOC,EAAPD,EAAoC,KAAA,CACrDE,UAAW,OACXC,OAAQ,EACRC,QAAS,MAGLC,EAAoBL,EAAAA,OAAOM,EAAK,CACpCC,kBAAoBC,GAAkB,aAATA,GADLR,EAEC,EAAGS,QAAOC,eAAU,CAC7CC,MAAO,OACPC,OAAQ,UACRC,SAAU,WACV,kBAAmB,CAEjBC,YAAa,MACbC,YAAaL,EAAWD,EAAMO,QAAQC,SAASC,OAAO,mBAAqB,cAG3EC,UAAWT,EAAW,OAAS,mBAAmBD,EAAMO,QAAQC,SAASC,OAAO,kBAElF,gCAAiC,CAC/BH,YAAaN,EAAMO,QAAQC,SAASC,OAAO,mBAC3CC,UAAW,YAITC,EAAsBpB,EAAAA,OAAOqB,EAAPrB,EAAiC,EAAGS,YAAO,CACrEI,SAAU,WACVS,IAAKb,EAAMc,QAAQ,GACnBC,KAAMf,EAAMc,QAAQ,GACpBE,OAAQ,EACRC,MAAOjB,EAAMO,QAAQC,SAASU,KAAK,gBACnC,WAAY,CACVC,KAAMnB,EAAMO,QAAQa,OAAOC,WAIzBC,EAAyB/B,EAAAA,OAAOM,EAAPN,EAAY,EAAGS,YAAO,CACnDuB,QAAS,OACTC,eAAgB,SAChBC,WAAY,SACZC,UAAW,QACX/B,QAASK,EAAMc,QAAQ,OAGnBa,EAAuBpC,EAAAA,OAAOM,EAAPN,EAAY,EAAGS,YAAO,CACjDL,QAASK,EAAMc,QAAQ,sBA+BmC,EAC1Dc,QACAC,UACAC,UACAC,iBACAC,mBAEA,MAAQC,KAAMC,EAAMC,UAAEA,EAASC,MAAEA,GAAUC,eAAaT,EAAOE,EAASD,GAExE,OAAIM,EAEAG,EAAAA,IAAChB,EAAsB,CAAAiB,SACrBD,EAAAA,IAACE,EAAAA,iBAAgB,CAACC,KAAK,YAKzBL,EAEAE,MAACX,EAAoB,CAAAY,SACnBD,EAAAA,IAACI,EAAAA,WAAU,CACTC,YAAY,iDACZC,MAAM,2BAMTV,GAA4B,IAAlBA,EAAOW,OASpBP,EAAAA,IAAChD,EAAU,CAACwD,WAAS,EAACC,UAAU,KAAKjC,QAAS,WAC3CoB,EAAOc,KAAKC,IACX,MAAMC,EAAanB,EAAeoB,IAAIF,EAAMG,IAC5C,OACEd,EAAAA,IAAC9C,EAAI,CAAA,gBAEY0D,EACfH,UAAU,KACVN,KAAM,CAAEY,WAAY,EAAGC,QAAS,EAAGC,OAAQ,EAAGC,OAAQ,GAAGjB,SAEzDkB,EAAAA,KAAC7D,EAAiB,CAAA,aACJ,UAAYqD,EAAMS,SAC9BC,QAAS,IAAM3B,EAAaiB,GAC5BW,UAAYC,IACI,UAAVA,EAAEC,KAA6B,MAAVD,EAAEC,MACzBD,EAAEE,iBACF/B,EAAaiB,KAGjBe,KAAK,SACL/D,SAAUiD,EACVe,SAAU,EAAC1B,SAAA,CAEVW,GAAcZ,EAAAA,IAAC3B,EAAmB,CAAC8B,KAAK,OACzCH,EAAAA,IAAC4B,EAAI,CACHC,QAASlB,EAAMS,SACfU,QAAQ,GACRC,SAAUpB,EAAMqB,SAASC,QACzBC,SAAUvB,EAAMwB,UAvBfxB,EAAMG,SAZjBd,MAACX,EAAoB,CAAAY,SACnBD,EAAAA,IAACI,EAAAA,WAAU,CAACC,YAAY,kCAAkCC,MAAM"}
+{"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 CircularProgress from '@fd/components/atoms/CircularProgress';\nimport Grid from '@fd/components/atoms/Grid';\nimport EmptyState from '@fd/components/molecules/EmptyState';\nimport CheckmarkCircleSolidIcon from '@fd/icons/CheckmarkCircleSolid';\n\nimport { useGetAssets } from '../hooks/useGetAssets';\nimport type { Asset } from '../types';\n\nconst StyledList = styled(Grid)<{ component: string }>(() => ({\n  listStyle: 'none',\n  margin: 0,\n  padding: 0,\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 ? theme.palette.semantic.stroke['stroke-selected'] : 'transparent',\n    // Use box-shadow to create the visual 1px border when not selected\n    // This prevents layout shift while maintaining the visual appearance\n    boxShadow: selected ? 'none' : `inset 0 0 0 1px ${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}));\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 StyledLoadingContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  justifyContent: 'center',\n  alignItems: 'center',\n  minHeight: '200px',\n  padding: theme.spacing(4),\n}));\n\nconst StyledErrorContainer = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(4),\n}));\n\n/**\n * Props for the LibraryTabContent component.\n * @param orgId - Organization ID for fetching assets\n * @param brandId - Brand ID for fetching assets\n * @param enabled - Whether the component is enabled (for conditional fetching)\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  /** Organization ID for fetching assets */\n  orgId: string;\n  /** Brand ID for fetching assets */\n  brandId?: string;\n  /** Whether the component is enabled (for conditional fetching) */\n  enabled: boolean;\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 * Handles fetching assets internally 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  orgId,\n  brandId,\n  enabled,\n  selectedAssets,\n  onAssetClick,\n}) => {\n  const { data: assetResponse, isLoading, error } = useGetAssets(orgId, enabled, brandId);\n\n  if (isLoading) {\n    return (\n      <StyledLoadingContainer>\n        <CircularProgress size=\"large\" />\n      </StyledLoadingContainer>\n    );\n  }\n\n  if (error) {\n    return (\n      <StyledErrorContainer>\n        <EmptyState\n          description=\"Failed to load assets. Please try again later.\"\n          title=\"Error loading assets\"\n        />\n      </StyledErrorContainer>\n    );\n  }\n\n  if (!assetResponse || assetResponse.data.length === 0) {\n    return (\n      <StyledErrorContainer>\n        <EmptyState description=\"No assets available to display.\" title=\"No assets found\" />\n      </StyledErrorContainer>\n    );\n  }\n\n  return (\n    <StyledList container component=\"ul\" spacing={1}>\n      {assetResponse.data.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: 3, desktop: 3, mobile: 6, tablet: 4 }}\n          >\n            <StyledCardWrapper\n              aria-label={'Select ' + asset.fileName} // TODO: translate this text when translate provider is added\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                imageSrc={asset.url}\n              />\n            </StyledCardWrapper>\n          </Grid>\n        );\n      })}\n    </StyledList>\n  );\n};\n\nexport default LibraryTabContent;\n"],"names":["StyledList","styled","Grid","listStyle","margin","padding","StyledCardWrapper","Box","shouldForwardProp","prop","theme","selected","width","cursor","position","borderWidth","borderColor","palette","semantic","stroke","boxShadow","StyledCheckmarkIcon","CheckmarkCircleSolidIcon","top","spacing","left","zIndex","color","icon","fill","common","white","StyledLoadingContainer","display","justifyContent","alignItems","minHeight","StyledErrorContainer","orgId","brandId","enabled","selectedAssets","onAssetClick","data","assetResponse","isLoading","error","useGetAssets","_jsx","children","CircularProgress","size","EmptyState","description","title","length","container","component","map","asset","isSelected","has","id","widescreen","desktop","mobile","tablet","_jsxs","fileName","onClick","onKeyDown","e","key","preventDefault","role","tabIndex","Card","content","heading","imageAlt","metadata","altText","imageSrc","url"],"mappings":"kbAcA,MAAMA,EAAaC,EAAAA,OAAOC,EAAPD,EAAoC,KAAA,CACrDE,UAAW,OACXC,OAAQ,EACRC,QAAS,MAGLC,EAAoBL,EAAAA,OAAOM,EAAK,CACpCC,kBAAoBC,GAAkB,aAATA,GADLR,EAEC,EAAGS,QAAOC,eAAU,CAC7CC,MAAO,OACPC,OAAQ,UACRC,SAAU,WACV,kBAAmB,CAEjBC,YAAa,MACbC,YAAaL,EAAWD,EAAMO,QAAQC,SAASC,OAAO,mBAAqB,cAG3EC,UAAWT,EAAW,OAAS,mBAAmBD,EAAMO,QAAQC,SAASC,OAAO,kBAElF,gCAAiC,CAC/BH,YAAaN,EAAMO,QAAQC,SAASC,OAAO,mBAC3CC,UAAW,YAITC,EAAsBpB,EAAAA,OAAOqB,EAAPrB,EAAiC,EAAGS,YAAO,CACrEI,SAAU,WACVS,IAAKb,EAAMc,QAAQ,GACnBC,KAAMf,EAAMc,QAAQ,GACpBE,OAAQ,EACRC,MAAOjB,EAAMO,QAAQC,SAASU,KAAK,gBACnC,WAAY,CACVC,KAAMnB,EAAMO,QAAQa,OAAOC,WAIzBC,EAAyB/B,EAAAA,OAAOM,EAAPN,EAAY,EAAGS,YAAO,CACnDuB,QAAS,OACTC,eAAgB,SAChBC,WAAY,SACZC,UAAW,QACX/B,QAASK,EAAMc,QAAQ,OAGnBa,EAAuBpC,EAAAA,OAAOM,EAAPN,EAAY,EAAGS,YAAO,CACjDL,QAASK,EAAMc,QAAQ,sBA+BmC,EAC1Dc,QACAC,UACAC,UACAC,iBACAC,mBAEA,MAAQC,KAAMC,EAAaC,UAAEA,EAASC,MAAEA,GAAUC,eAAaT,EAAOE,EAASD,GAE/E,OAAIM,EAEAG,EAAAA,IAAChB,EAAsB,CAAAiB,SACrBD,EAAAA,IAACE,EAAAA,iBAAgB,CAACC,KAAK,YAKzBL,EAEAE,MAACX,EAAoB,CAAAY,SACnBD,EAAAA,IAACI,EAAAA,WAAU,CACTC,YAAY,iDACZC,MAAM,2BAMTV,GAA+C,IAA9BA,EAAcD,KAAKY,OASvCP,EAAAA,IAAChD,EAAU,CAACwD,WAAS,EAACC,UAAU,KAAKjC,QAAS,EAACyB,SAC5CL,EAAcD,KAAKe,KAAKC,IACvB,MAAMC,EAAanB,EAAeoB,IAAIF,EAAMG,IAC5C,OACEd,EAAAA,IAAC9C,EAAI,CAAA,gBAEY0D,EACfH,UAAU,KACVN,KAAM,CAAEY,WAAY,EAAGC,QAAS,EAAGC,OAAQ,EAAGC,OAAQ,GAAGjB,SAEzDkB,EAAAA,KAAC7D,EAAiB,CAAA,aACJ,UAAYqD,EAAMS,SAC9BC,QAAS,IAAM3B,EAAaiB,GAC5BW,UAAYC,IACI,UAAVA,EAAEC,KAA6B,MAAVD,EAAEC,MACzBD,EAAEE,iBACF/B,EAAaiB,KAGjBe,KAAK,SACL/D,SAAUiD,EACVe,SAAU,EAAC1B,SAAA,CAEVW,GAAcZ,EAAAA,IAAC3B,EAAmB,CAAC8B,KAAK,OACzCH,EAAAA,IAAC4B,EAAI,CACHC,QAASlB,EAAMS,SACfU,QAAQ,GACRC,SAAUpB,EAAMqB,SAASC,QACzBC,SAAUvB,EAAMwB,UAvBfxB,EAAMG,SAZjBd,MAACX,EAAoB,CAAAY,SACnBD,EAAAA,IAACI,EAAAA,WAAU,CAACC,YAAY,kCAAkCC,MAAM"}

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 i from"@mui/material/Box";import r from"../../../atoms/Card/index.js";import{CircularProgress as a}from"../../../atoms/CircularProgress/index.js";import s from"@mui/material/Grid2";import{EmptyState as n}from"../../../molecules/EmptyState/index.js";import l from"../../../../icons/CheckmarkCircleSolid/index.js";import{useGetAssets as d}from"../hooks/useAssets.js";const m=o(s)((()=>({listStyle:"none",margin:0,padding:0}))),c=o(i,{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"]:"transparent",boxShadow:t?"none":`inset 0 0 0 1px ${e.palette.semantic.stroke["stroke-weak"]}`},"&:focus-visible .MuiCard-root":{borderColor:e.palette.semantic.stroke["stroke-selected"],boxShadow:"none"}}))),p=o(l)((({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}}))),g=o(i)((({theme:e})=>({display:"flex",justifyContent:"center",alignItems:"center",minHeight:"200px",padding:e.spacing(4)}))),h=o(i)((({theme:e})=>({padding:e.spacing(4)}))),u=({orgId:o,brandId:i,enabled:l,selectedAssets:u,onAssetClick:f})=>{const{data:x,isLoading:b,error:k}=d(o,l,i);return b?e(g,{children:e(a,{size:"large"})}):k?e(h,{children:e(n,{description:"Failed to load assets. Please try again later.",title:"Error loading assets"})}):x&&0!==x.length?e(m,{container:!0,component:"ul",spacing:1,children:x.map((o=>{const i=u.has(o.id);return e(s,{"aria-selected":i,component:"li",size:{widescreen:3,desktop:3,mobile:6,tablet:4},children:t(c,{"aria-label":"Select "+o.fileName,onClick:()=>f(o),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),f(o))},role:"button",selected:i,tabIndex:0,children:[i&&e(p,{size:"lg"}),e(r,{content:o.fileName,heading:"",imageAlt:o.metadata.altText,imageSrc:o.url})]})},o.id)}))}):e(h,{children:e(n,{description:"No assets available to display.",title:"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 i from"@mui/material/Box";import r from"../../../atoms/Card/index.js";import{CircularProgress as a}from"../../../atoms/CircularProgress/index.js";import s from"@mui/material/Grid2";import{EmptyState as n}from"../../../molecules/EmptyState/index.js";import l from"../../../../icons/CheckmarkCircleSolid/index.js";import{useGetAssets as d}from"../hooks/useGetAssets.js";const m=o(s)((()=>({listStyle:"none",margin:0,padding:0}))),c=o(i,{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"]:"transparent",boxShadow:t?"none":`inset 0 0 0 1px ${e.palette.semantic.stroke["stroke-weak"]}`},"&:focus-visible .MuiCard-root":{borderColor:e.palette.semantic.stroke["stroke-selected"],boxShadow:"none"}}))),p=o(l)((({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}}))),g=o(i)((({theme:e})=>({display:"flex",justifyContent:"center",alignItems:"center",minHeight:"200px",padding:e.spacing(4)}))),h=o(i)((({theme:e})=>({padding:e.spacing(4)}))),u=({orgId:o,brandId:i,enabled:l,selectedAssets:u,onAssetClick:f})=>{const{data:x,isLoading:b,error:k}=d(o,l,i);return b?e(g,{children:e(a,{size:"large"})}):k?e(h,{children:e(n,{description:"Failed to load assets. Please try again later.",title:"Error loading assets"})}):x&&0!==x.data.length?e(m,{container:!0,component:"ul",spacing:1,children:x.data.map((o=>{const i=u.has(o.id);return e(s,{"aria-selected":i,component:"li",size:{widescreen:3,desktop:3,mobile:6,tablet:4},children:t(c,{"aria-label":"Select "+o.fileName,onClick:()=>f(o),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),f(o))},role:"button",selected:i,tabIndex:0,children:[i&&e(p,{size:"lg"}),e(r,{content:o.fileName,heading:"",imageAlt:o.metadata.altText,imageSrc:o.url})]})},o.id)}))}):e(h,{children:e(n,{description:"No assets available to display.",title:"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 CircularProgress from '@fd/components/atoms/CircularProgress';\nimport Grid from '@fd/components/atoms/Grid';\nimport EmptyState from '@fd/components/molecules/EmptyState';\nimport CheckmarkCircleSolidIcon from '@fd/icons/CheckmarkCircleSolid';\n\nimport { useGetAssets } from '../hooks/useAssets';\nimport type { Asset } from '../types';\n\nconst StyledList = styled(Grid)<{ component: string }>(() => ({\n  listStyle: 'none',\n  margin: 0,\n  padding: 0,\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 ? theme.palette.semantic.stroke['stroke-selected'] : 'transparent',\n    // Use box-shadow to create the visual 1px border when not selected\n    // This prevents layout shift while maintaining the visual appearance\n    boxShadow: selected ? 'none' : `inset 0 0 0 1px ${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}));\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 StyledLoadingContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  justifyContent: 'center',\n  alignItems: 'center',\n  minHeight: '200px',\n  padding: theme.spacing(4),\n}));\n\nconst StyledErrorContainer = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(4),\n}));\n\n/**\n * Props for the LibraryTabContent component.\n * @param orgId - Organization ID for fetching assets\n * @param brandId - Brand ID for fetching assets\n * @param enabled - Whether the component is enabled (for conditional fetching)\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  /** Organization ID for fetching assets */\n  orgId: string;\n  /** Brand ID for fetching assets */\n  brandId?: string;\n  /** Whether the component is enabled (for conditional fetching) */\n  enabled: boolean;\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 * Handles fetching assets internally 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  orgId,\n  brandId,\n  enabled,\n  selectedAssets,\n  onAssetClick,\n}) => {\n  const { data: assets, isLoading, error } = useGetAssets(orgId, enabled, brandId);\n\n  if (isLoading) {\n    return (\n      <StyledLoadingContainer>\n        <CircularProgress size=\"large\" />\n      </StyledLoadingContainer>\n    );\n  }\n\n  if (error) {\n    return (\n      <StyledErrorContainer>\n        <EmptyState\n          description=\"Failed to load assets. Please try again later.\"\n          title=\"Error loading assets\"\n        />\n      </StyledErrorContainer>\n    );\n  }\n\n  if (!assets || assets.length === 0) {\n    return (\n      <StyledErrorContainer>\n        <EmptyState description=\"No assets available to display.\" title=\"No assets found\" />\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: 3, desktop: 3, mobile: 6, tablet: 4 }}\n          >\n            <StyledCardWrapper\n              aria-label={'Select ' + asset.fileName} // TODO: translate this text when translate provider is added\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                imageSrc={asset.url}\n              />\n            </StyledCardWrapper>\n          </Grid>\n        );\n      })}\n    </StyledList>\n  );\n};\n\nexport default LibraryTabContent;\n"],"names":["StyledList","styled","Grid","listStyle","margin","padding","StyledCardWrapper","Box","shouldForwardProp","prop","theme","selected","width","cursor","position","borderWidth","borderColor","palette","semantic","stroke","boxShadow","StyledCheckmarkIcon","CheckmarkCircleSolidIcon","top","spacing","left","zIndex","color","icon","fill","common","white","StyledLoadingContainer","display","justifyContent","alignItems","minHeight","StyledErrorContainer","LibraryTabContent","orgId","brandId","enabled","selectedAssets","onAssetClick","data","assets","isLoading","error","useGetAssets","_jsx","children","CircularProgress","size","EmptyState","description","title","length","container","component","map","asset","isSelected","has","id","widescreen","desktop","mobile","tablet","_jsxs","fileName","onClick","onKeyDown","e","key","preventDefault","role","tabIndex","Card","content","heading","imageAlt","metadata","altText","imageSrc","url"],"mappings":"keAcA,MAAMA,EAAaC,EAAOC,EAAPD,EAAoC,KAAA,CACrDE,UAAW,OACXC,OAAQ,EACRC,QAAS,MAGLC,EAAoBL,EAAOM,EAAK,CACpCC,kBAAoBC,GAAkB,aAATA,GADLR,EAEC,EAAGS,QAAOC,eAAU,CAC7CC,MAAO,OACPC,OAAQ,UACRC,SAAU,WACV,kBAAmB,CAEjBC,YAAa,MACbC,YAAaL,EAAWD,EAAMO,QAAQC,SAASC,OAAO,mBAAqB,cAG3EC,UAAWT,EAAW,OAAS,mBAAmBD,EAAMO,QAAQC,SAASC,OAAO,kBAElF,gCAAiC,CAC/BH,YAAaN,EAAMO,QAAQC,SAASC,OAAO,mBAC3CC,UAAW,YAITC,EAAsBpB,EAAOqB,EAAPrB,EAAiC,EAAGS,YAAO,CACrEI,SAAU,WACVS,IAAKb,EAAMc,QAAQ,GACnBC,KAAMf,EAAMc,QAAQ,GACpBE,OAAQ,EACRC,MAAOjB,EAAMO,QAAQC,SAASU,KAAK,gBACnC,WAAY,CACVC,KAAMnB,EAAMO,QAAQa,OAAOC,WAIzBC,EAAyB/B,EAAOM,EAAPN,EAAY,EAAGS,YAAO,CACnDuB,QAAS,OACTC,eAAgB,SAChBC,WAAY,SACZC,UAAW,QACX/B,QAASK,EAAMc,QAAQ,OAGnBa,EAAuBpC,EAAOM,EAAPN,EAAY,EAAGS,YAAO,CACjDL,QAASK,EAAMc,QAAQ,OA+BnBc,EAAsD,EAC1DC,QACAC,UACAC,UACAC,iBACAC,mBAEA,MAAQC,KAAMC,EAAMC,UAAEA,EAASC,MAAEA,GAAUC,EAAaT,EAAOE,EAASD,GAExE,OAAIM,EAEAG,EAACjB,EAAsB,CAAAkB,SACrBD,EAACE,EAAgB,CAACC,KAAK,YAKzBL,EAEAE,EAACZ,EAAoB,CAAAa,SACnBD,EAACI,EAAU,CACTC,YAAY,iDACZC,MAAM,2BAMTV,GAA4B,IAAlBA,EAAOW,OASpBP,EAACjD,EAAU,CAACyD,WAAS,EAACC,UAAU,KAAKlC,QAAS,WAC3CqB,EAAOc,KAAKC,IACX,MAAMC,EAAanB,EAAeoB,IAAIF,EAAMG,IAC5C,OACEd,EAAC/C,EAAI,CAAA,gBAEY2D,EACfH,UAAU,KACVN,KAAM,CAAEY,WAAY,EAAGC,QAAS,EAAGC,OAAQ,EAAGC,OAAQ,GAAGjB,SAEzDkB,EAAC9D,EAAiB,CAAA,aACJ,UAAYsD,EAAMS,SAC9BC,QAAS,IAAM3B,EAAaiB,GAC5BW,UAAYC,IACI,UAAVA,EAAEC,KAA6B,MAAVD,EAAEC,MACzBD,EAAEE,iBACF/B,EAAaiB,KAGjBe,KAAK,SACLhE,SAAUkD,EACVe,SAAU,EAAC1B,SAAA,CAEVW,GAAcZ,EAAC5B,EAAmB,CAAC+B,KAAK,OACzCH,EAAC4B,EAAI,CACHC,QAASlB,EAAMS,SACfU,QAAQ,GACRC,SAAUpB,EAAMqB,SAASC,QACzBC,SAAUvB,EAAMwB,UAvBfxB,EAAMG,SAZjBd,EAACZ,EAAoB,CAAAa,SACnBD,EAACI,EAAU,CAACC,YAAY,kCAAkCC,MAAM"}
+{"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 CircularProgress from '@fd/components/atoms/CircularProgress';\nimport Grid from '@fd/components/atoms/Grid';\nimport EmptyState from '@fd/components/molecules/EmptyState';\nimport CheckmarkCircleSolidIcon from '@fd/icons/CheckmarkCircleSolid';\n\nimport { useGetAssets } from '../hooks/useGetAssets';\nimport type { Asset } from '../types';\n\nconst StyledList = styled(Grid)<{ component: string }>(() => ({\n  listStyle: 'none',\n  margin: 0,\n  padding: 0,\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 ? theme.palette.semantic.stroke['stroke-selected'] : 'transparent',\n    // Use box-shadow to create the visual 1px border when not selected\n    // This prevents layout shift while maintaining the visual appearance\n    boxShadow: selected ? 'none' : `inset 0 0 0 1px ${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}));\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 StyledLoadingContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  justifyContent: 'center',\n  alignItems: 'center',\n  minHeight: '200px',\n  padding: theme.spacing(4),\n}));\n\nconst StyledErrorContainer = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(4),\n}));\n\n/**\n * Props for the LibraryTabContent component.\n * @param orgId - Organization ID for fetching assets\n * @param brandId - Brand ID for fetching assets\n * @param enabled - Whether the component is enabled (for conditional fetching)\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  /** Organization ID for fetching assets */\n  orgId: string;\n  /** Brand ID for fetching assets */\n  brandId?: string;\n  /** Whether the component is enabled (for conditional fetching) */\n  enabled: boolean;\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 * Handles fetching assets internally 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  orgId,\n  brandId,\n  enabled,\n  selectedAssets,\n  onAssetClick,\n}) => {\n  const { data: assetResponse, isLoading, error } = useGetAssets(orgId, enabled, brandId);\n\n  if (isLoading) {\n    return (\n      <StyledLoadingContainer>\n        <CircularProgress size=\"large\" />\n      </StyledLoadingContainer>\n    );\n  }\n\n  if (error) {\n    return (\n      <StyledErrorContainer>\n        <EmptyState\n          description=\"Failed to load assets. Please try again later.\"\n          title=\"Error loading assets\"\n        />\n      </StyledErrorContainer>\n    );\n  }\n\n  if (!assetResponse || assetResponse.data.length === 0) {\n    return (\n      <StyledErrorContainer>\n        <EmptyState description=\"No assets available to display.\" title=\"No assets found\" />\n      </StyledErrorContainer>\n    );\n  }\n\n  return (\n    <StyledList container component=\"ul\" spacing={1}>\n      {assetResponse.data.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: 3, desktop: 3, mobile: 6, tablet: 4 }}\n          >\n            <StyledCardWrapper\n              aria-label={'Select ' + asset.fileName} // TODO: translate this text when translate provider is added\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                imageSrc={asset.url}\n              />\n            </StyledCardWrapper>\n          </Grid>\n        );\n      })}\n    </StyledList>\n  );\n};\n\nexport default LibraryTabContent;\n"],"names":["StyledList","styled","Grid","listStyle","margin","padding","StyledCardWrapper","Box","shouldForwardProp","prop","theme","selected","width","cursor","position","borderWidth","borderColor","palette","semantic","stroke","boxShadow","StyledCheckmarkIcon","CheckmarkCircleSolidIcon","top","spacing","left","zIndex","color","icon","fill","common","white","StyledLoadingContainer","display","justifyContent","alignItems","minHeight","StyledErrorContainer","LibraryTabContent","orgId","brandId","enabled","selectedAssets","onAssetClick","data","assetResponse","isLoading","error","useGetAssets","_jsx","children","CircularProgress","size","EmptyState","description","title","length","container","component","map","asset","isSelected","has","id","widescreen","desktop","mobile","tablet","_jsxs","fileName","onClick","onKeyDown","e","key","preventDefault","role","tabIndex","Card","content","heading","imageAlt","metadata","altText","imageSrc","url"],"mappings":"qeAcA,MAAMA,EAAaC,EAAOC,EAAPD,EAAoC,KAAA,CACrDE,UAAW,OACXC,OAAQ,EACRC,QAAS,MAGLC,EAAoBL,EAAOM,EAAK,CACpCC,kBAAoBC,GAAkB,aAATA,GADLR,EAEC,EAAGS,QAAOC,eAAU,CAC7CC,MAAO,OACPC,OAAQ,UACRC,SAAU,WACV,kBAAmB,CAEjBC,YAAa,MACbC,YAAaL,EAAWD,EAAMO,QAAQC,SAASC,OAAO,mBAAqB,cAG3EC,UAAWT,EAAW,OAAS,mBAAmBD,EAAMO,QAAQC,SAASC,OAAO,kBAElF,gCAAiC,CAC/BH,YAAaN,EAAMO,QAAQC,SAASC,OAAO,mBAC3CC,UAAW,YAITC,EAAsBpB,EAAOqB,EAAPrB,EAAiC,EAAGS,YAAO,CACrEI,SAAU,WACVS,IAAKb,EAAMc,QAAQ,GACnBC,KAAMf,EAAMc,QAAQ,GACpBE,OAAQ,EACRC,MAAOjB,EAAMO,QAAQC,SAASU,KAAK,gBACnC,WAAY,CACVC,KAAMnB,EAAMO,QAAQa,OAAOC,WAIzBC,EAAyB/B,EAAOM,EAAPN,EAAY,EAAGS,YAAO,CACnDuB,QAAS,OACTC,eAAgB,SAChBC,WAAY,SACZC,UAAW,QACX/B,QAASK,EAAMc,QAAQ,OAGnBa,EAAuBpC,EAAOM,EAAPN,EAAY,EAAGS,YAAO,CACjDL,QAASK,EAAMc,QAAQ,OA+BnBc,EAAsD,EAC1DC,QACAC,UACAC,UACAC,iBACAC,mBAEA,MAAQC,KAAMC,EAAaC,UAAEA,EAASC,MAAEA,GAAUC,EAAaT,EAAOE,EAASD,GAE/E,OAAIM,EAEAG,EAACjB,EAAsB,CAAAkB,SACrBD,EAACE,EAAgB,CAACC,KAAK,YAKzBL,EAEAE,EAACZ,EAAoB,CAAAa,SACnBD,EAACI,EAAU,CACTC,YAAY,iDACZC,MAAM,2BAMTV,GAA+C,IAA9BA,EAAcD,KAAKY,OASvCP,EAACjD,EAAU,CAACyD,WAAS,EAACC,UAAU,KAAKlC,QAAS,EAAC0B,SAC5CL,EAAcD,KAAKe,KAAKC,IACvB,MAAMC,EAAanB,EAAeoB,IAAIF,EAAMG,IAC5C,OACEd,EAAC/C,EAAI,CAAA,gBAEY2D,EACfH,UAAU,KACVN,KAAM,CAAEY,WAAY,EAAGC,QAAS,EAAGC,OAAQ,EAAGC,OAAQ,GAAGjB,SAEzDkB,EAAC9D,EAAiB,CAAA,aACJ,UAAYsD,EAAMS,SAC9BC,QAAS,IAAM3B,EAAaiB,GAC5BW,UAAYC,IACI,UAAVA,EAAEC,KAA6B,MAAVD,EAAEC,MACzBD,EAAEE,iBACF/B,EAAaiB,KAGjBe,KAAK,SACLhE,SAAUkD,EACVe,SAAU,EAAC1B,SAAA,CAEVW,GAAcZ,EAAC5B,EAAmB,CAAC+B,KAAK,OACzCH,EAAC4B,EAAI,CACHC,QAASlB,EAAMS,SACfU,QAAQ,GACRC,SAAUpB,EAAMqB,SAASC,QACzBC,SAAUvB,EAAMwB,UAvBfxB,EAAMG,SAZjBd,EAACZ,EAAoB,CAAAa,SACnBD,EAACI,EAAU,CAACC,YAAY,kCAAkCC,MAAM"}

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

@@ -1,2 +1,2 @@
-"use strict";var e=require("../types/index.cjs.js");const a=(a={})=>({...{id:"1",fileName:"Mock Asset.jpg",contentType:"image/jpeg",url:"./images/pizza-horizontal.jpg",createdBy:"Mock User",updatedBy:"Mock User",updatedAt:(new Date).toISOString(),uploadedAt:(new Date).toISOString(),orgId:"10121",brandId:"1",type:e.AssetType.IMAGE,metadata:{tags:["mock"]}},...a}),t=[a({id:"1",fileName:"Pizza Special.jpg",createdBy:"John Doe",updatedBy:"John Doe",metadata:{tags:["pizza","food"],altText:"Delicious pizza with toppings"}}),a({id:"2",fileName:"Burger Combo.jpg",createdBy:"Jane Smith",updatedBy:"Jane Smith",metadata:{tags:["burger","food"],altText:"Juicy burger with fries"}}),a({id:"3",fileName:"Salad Fresh.jpg",createdBy:"Bob Johnson",updatedBy:"Bob Johnson",metadata:{tags:["salad","healthy"],altText:"Fresh green salad"}}),a({id:"4",fileName:"Pasta Delight.jpg",createdBy:"Alice Brown",updatedBy:"Alice Brown",metadata:{tags:["pasta","italian"]}}),a({id:"5",fileName:"Dessert Special.jpg",createdBy:"Charlie Davis",updatedBy:"Charlie Davis",metadata:{tags:["dessert","sweet"]}})];exports.createMockAsset=a,exports.createMockAssets=(e,t)=>Array.from({length:e},((e,s)=>{const i=t?.[s]||{};return a({id:(s+1).toString(),fileName:`Mock Asset ${s+1}.jpg`,...i})})),exports.mockAssets=t;
+"use strict";var e=require("../types/index.cjs.js");const a=(a={})=>({...{id:"asset_e3454351fw5",fileName:"Mock Asset.jpg",contentType:"image/jpeg",url:"./images/pizza-horizontal.jpg",createdBy:"Mock User",updatedBy:"Mock User",updatedAt:(new Date).toISOString(),uploadedAt:(new Date).toISOString(),orgId:"org10121",brandId:"br1",type:e.AssetType.IMAGE,metadata:{tags:["mock"]}},...a}),t={data:[a({id:"asset_e3454351fw5",fileName:"Pizza Special.jpg",createdBy:"John Doe",updatedBy:"John Doe",metadata:{tags:["pizza","food"],altText:"Delicious pizza with toppings"}}),a({id:"asset_et351fw6",fileName:"Burger Combo.jpg",createdBy:"Jane Smith",updatedBy:"Jane Smith",metadata:{tags:["burger","food"],altText:"Juicy burger with fries"}}),a({id:"asset_f351fw7",fileName:"Salad Fresh.jpg",createdBy:"Bob Johnson",updatedBy:"Bob Johnson",metadata:{tags:["salad","healthy"],altText:"Fresh green salad"}}),a({id:"asset_g351fw8",fileName:"Pasta Delight.jpg",createdBy:"Alice Brown",updatedBy:"Alice Brown",metadata:{tags:["pasta","italian"]}}),a({id:"asset_h351fw9",fileName:"Dessert Special.jpg",createdBy:"Charlie Davis",updatedBy:"Charlie Davis",metadata:{tags:["dessert","sweet"]}})]};exports.createMockAsset=a,exports.createMockAssets=(e,t)=>Array.from({length:e},((e,s)=>{const i=t?.[s]||{};return a({id:(s+1).toString(),fileName:`Mock Asset ${s+1}.jpg`,...i})})),exports.mockAssets=t;
 //# 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 } from '../types';\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: '1',\n    fileName: 'Mock Asset.jpg',\n    contentType: 'image/jpeg',\n    url: './images/pizza-horizontal.jpg',\n    createdBy: 'Mock User',\n    updatedBy: 'Mock User',\n    updatedAt: new Date().toISOString(),\n    uploadedAt: new Date().toISOString(),\n    orgId: '10121',\n    brandId: '1',\n    type: AssetType.IMAGE,\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: Asset[] = [\n  createMockAsset({\n    id: '1',\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: '2',\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: '3',\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: '4',\n    fileName: 'Pasta Delight.jpg',\n    createdBy: 'Alice Brown',\n    updatedBy: 'Alice Brown',\n    metadata: { tags: ['pasta', 'italian'] },\n  }),\n  createMockAsset({\n    id: '5',\n    fileName: 'Dessert Special.jpg',\n    createdBy: 'Charlie Davis',\n    updatedBy: 'Charlie Davis',\n    metadata: { tags: ['dessert', 'sweet'] },\n  }),\n];\n"],"names":["createMockAsset","overrides","id","fileName","contentType","url","createdBy","updatedBy","updatedAt","Date","toISOString","uploadedAt","orgId","brandId","type","AssetType","IMAGE","metadata","tags","mockAssets","altText","count","overridesArray","Array","from","length","_","index","baseOverrides","toString"],"mappings":"0DAOaA,EAAkB,CAACC,EAA4B,MAgBnD,IAfqB,CAC1BC,GAAI,IACJC,SAAU,iBACVC,YAAa,aACbC,IAAK,gCACLC,UAAW,YACXC,UAAW,YACXC,WAAW,IAAIC,MAAOC,cACtBC,YAAY,IAAIF,MAAOC,cACvBE,MAAO,QACPC,QAAS,IACTC,KAAMC,EAAAA,UAAUC,MAChBC,SAAU,CAAEC,KAAM,CAAC,aAGQjB,IAuBlBkB,EAAsB,CACjCnB,EAAgB,CACdE,GAAI,IACJC,SAAU,oBACVG,UAAW,WACXC,UAAW,WACXU,SAAU,CAAEC,KAAM,CAAC,QAAS,QAASE,QAAS,mCAEhDpB,EAAgB,CACdE,GAAI,IACJC,SAAU,mBACVG,UAAW,aACXC,UAAW,aACXU,SAAU,CAAEC,KAAM,CAAC,SAAU,QAASE,QAAS,6BAEjDpB,EAAgB,CACdE,GAAI,IACJC,SAAU,kBACVG,UAAW,cACXC,UAAW,cACXU,SAAU,CAAEC,KAAM,CAAC,QAAS,WAAYE,QAAS,uBAEnDpB,EAAgB,CACdE,GAAI,IACJC,SAAU,oBACVG,UAAW,cACXC,UAAW,cACXU,SAAU,CAAEC,KAAM,CAAC,QAAS,cAE9BlB,EAAgB,CACdE,GAAI,IACJC,SAAU,sBACVG,UAAW,gBACXC,UAAW,gBACXU,SAAU,CAAEC,KAAM,CAAC,UAAW,gEAhDF,CAACG,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, type AssetResponse, AssetType } from '../types';\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    createdBy: 'Mock User',\n    updatedBy: 'Mock User',\n    updatedAt: new Date().toISOString(),\n    uploadedAt: new Date().toISOString(),\n    orgId: 'org10121',\n    brandId: 'br1',\n    type: AssetType.IMAGE,\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: AssetResponse = {\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","createdBy","updatedBy","updatedAt","Date","toISOString","uploadedAt","orgId","brandId","type","AssetType","IMAGE","metadata","tags","mockAssets","data","altText","count","overridesArray","Array","from","length","_","index","baseOverrides","toString"],"mappings":"0DAOaA,EAAkB,CAACC,EAA4B,MAgBnD,IAfqB,CAC1BC,GAAI,oBACJC,SAAU,iBACVC,YAAa,aACbC,IAAK,gCACLC,UAAW,YACXC,UAAW,YACXC,WAAW,IAAIC,MAAOC,cACtBC,YAAY,IAAIF,MAAOC,cACvBE,MAAO,WACPC,QAAS,MACTC,KAAMC,EAAAA,UAAUC,MAChBC,SAAU,CAAEC,KAAM,CAAC,aAGQjB,IAuBlBkB,EAA4B,CACvCC,KAAM,CACJpB,EAAgB,CACdE,GAAI,oBACJC,SAAU,oBACVG,UAAW,WACXC,UAAW,WACXU,SAAU,CAAEC,KAAM,CAAC,QAAS,QAASG,QAAS,mCAEhDrB,EAAgB,CACdE,GAAI,iBACJC,SAAU,mBACVG,UAAW,aACXC,UAAW,aACXU,SAAU,CAAEC,KAAM,CAAC,SAAU,QAASG,QAAS,6BAEjDrB,EAAgB,CACdE,GAAI,gBACJC,SAAU,kBACVG,UAAW,cACXC,UAAW,cACXU,SAAU,CAAEC,KAAM,CAAC,QAAS,WAAYG,QAAS,uBAEnDrB,EAAgB,CACdE,GAAI,gBACJC,SAAU,oBACVG,UAAW,cACXC,UAAW,cACXU,SAAU,CAAEC,KAAM,CAAC,QAAS,cAE9BlB,EAAgB,CACdE,GAAI,gBACJC,SAAU,sBACVG,UAAW,gBACXC,UAAW,gBACXU,SAAU,CAAEC,KAAM,CAAC,UAAW,iEAjDJ,CAACI,EAAeC,IACvCC,MAAMC,KAAK,CAAEC,OAAQJ,IAAS,CAACK,EAAGC,KACvC,MAAMC,EAAgBN,IAAiBK,IAAU,CAAA,EACjD,OAAO5B,EAAgB,CACrBE,IAAK0B,EAAQ,GAAGE,WAChB3B,SAAU,cAAcyB,EAAQ,WAC7BC"}

package/dist/components/organisms/AssetManager/__mocks__/mockAssets.d.ts

@@ -1,4 +1,4 @@
-import { Asset } from '../types/index.js';
+import { Asset, AssetResponse } from '../types/index.js';
 
 /**
  * Factory function to create a mock asset with customizable properties
@@ -16,6 +16,6 @@ declare const createMockAssets: (count: number, overridesArray?: Array<Partial<A
 /**
  * Pre-defined mock assets for common testing scenarios
  */
-declare const mockAssets: Asset[];
+declare const mockAssets: AssetResponse;
 
 export { createMockAsset, createMockAssets, mockAssets };

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

@@ -1,2 +1,2 @@
-import{AssetType as e}from"../types/index.js";const a=(a={})=>({...{id:"1",fileName:"Mock Asset.jpg",contentType:"image/jpeg",url:"./images/pizza-horizontal.jpg",createdBy:"Mock User",updatedBy:"Mock User",updatedAt:(new Date).toISOString(),uploadedAt:(new Date).toISOString(),orgId:"10121",brandId:"1",type:e.IMAGE,metadata:{tags:["mock"]}},...a}),t=(e,t)=>Array.from({length:e},((e,i)=>{const d=t?.[i]||{};return a({id:(i+1).toString(),fileName:`Mock Asset ${i+1}.jpg`,...d})})),i=[a({id:"1",fileName:"Pizza Special.jpg",createdBy:"John Doe",updatedBy:"John Doe",metadata:{tags:["pizza","food"],altText:"Delicious pizza with toppings"}}),a({id:"2",fileName:"Burger Combo.jpg",createdBy:"Jane Smith",updatedBy:"Jane Smith",metadata:{tags:["burger","food"],altText:"Juicy burger with fries"}}),a({id:"3",fileName:"Salad Fresh.jpg",createdBy:"Bob Johnson",updatedBy:"Bob Johnson",metadata:{tags:["salad","healthy"],altText:"Fresh green salad"}}),a({id:"4",fileName:"Pasta Delight.jpg",createdBy:"Alice Brown",updatedBy:"Alice Brown",metadata:{tags:["pasta","italian"]}}),a({id:"5",fileName:"Dessert Special.jpg",createdBy:"Charlie Davis",updatedBy:"Charlie Davis",metadata:{tags:["dessert","sweet"]}})];export{a as createMockAsset,t as createMockAssets,i as mockAssets};
+import{AssetType as e}from"../types/index.js";const a=(a={})=>({...{id:"asset_e3454351fw5",fileName:"Mock Asset.jpg",contentType:"image/jpeg",url:"./images/pizza-horizontal.jpg",createdBy:"Mock User",updatedBy:"Mock User",updatedAt:(new Date).toISOString(),uploadedAt:(new Date).toISOString(),orgId:"org10121",brandId:"br1",type:e.IMAGE,metadata:{tags:["mock"]}},...a}),t=(e,t)=>Array.from({length:e},((e,s)=>{const d=t?.[s]||{};return a({id:(s+1).toString(),fileName:`Mock Asset ${s+1}.jpg`,...d})})),s={data:[a({id:"asset_e3454351fw5",fileName:"Pizza Special.jpg",createdBy:"John Doe",updatedBy:"John Doe",metadata:{tags:["pizza","food"],altText:"Delicious pizza with toppings"}}),a({id:"asset_et351fw6",fileName:"Burger Combo.jpg",createdBy:"Jane Smith",updatedBy:"Jane Smith",metadata:{tags:["burger","food"],altText:"Juicy burger with fries"}}),a({id:"asset_f351fw7",fileName:"Salad Fresh.jpg",createdBy:"Bob Johnson",updatedBy:"Bob Johnson",metadata:{tags:["salad","healthy"],altText:"Fresh green salad"}}),a({id:"asset_g351fw8",fileName:"Pasta Delight.jpg",createdBy:"Alice Brown",updatedBy:"Alice Brown",metadata:{tags:["pasta","italian"]}}),a({id:"asset_h351fw9",fileName:"Dessert Special.jpg",createdBy:"Charlie Davis",updatedBy:"Charlie Davis",metadata:{tags:["dessert","sweet"]}})]};export{a as createMockAsset,t as createMockAssets,s 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 } from '../types';\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: '1',\n    fileName: 'Mock Asset.jpg',\n    contentType: 'image/jpeg',\n    url: './images/pizza-horizontal.jpg',\n    createdBy: 'Mock User',\n    updatedBy: 'Mock User',\n    updatedAt: new Date().toISOString(),\n    uploadedAt: new Date().toISOString(),\n    orgId: '10121',\n    brandId: '1',\n    type: AssetType.IMAGE,\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: Asset[] = [\n  createMockAsset({\n    id: '1',\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: '2',\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: '3',\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: '4',\n    fileName: 'Pasta Delight.jpg',\n    createdBy: 'Alice Brown',\n    updatedBy: 'Alice Brown',\n    metadata: { tags: ['pasta', 'italian'] },\n  }),\n  createMockAsset({\n    id: '5',\n    fileName: 'Dessert Special.jpg',\n    createdBy: 'Charlie Davis',\n    updatedBy: 'Charlie Davis',\n    metadata: { tags: ['dessert', 'sweet'] },\n  }),\n];\n"],"names":["createMockAsset","overrides","id","fileName","contentType","url","createdBy","updatedBy","updatedAt","Date","toISOString","uploadedAt","orgId","brandId","type","AssetType","IMAGE","metadata","tags","createMockAssets","count","overridesArray","Array","from","length","_","index","baseOverrides","toString","mockAssets","altText"],"mappings":"oDAOaA,EAAkB,CAACC,EAA4B,MAgBnD,IAfqB,CAC1BC,GAAI,IACJC,SAAU,iBACVC,YAAa,aACbC,IAAK,gCACLC,UAAW,YACXC,UAAW,YACXC,WAAW,IAAIC,MAAOC,cACtBC,YAAY,IAAIF,MAAOC,cACvBE,MAAO,QACPC,QAAS,IACTC,KAAMC,EAAUC,MAChBC,SAAU,CAAEC,KAAM,CAAC,aAGQjB,IASlBkB,EAAmB,CAACC,EAAeC,IACvCC,MAAMC,KAAK,CAAEC,OAAQJ,IAAS,CAACK,EAAGC,KACvC,MAAMC,EAAgBN,IAAiBK,IAAU,CAAA,EACjD,OAAO1B,EAAgB,CACrBE,IAAKwB,EAAQ,GAAGE,WAChBzB,SAAU,cAAcuB,EAAQ,WAC7BC,OAQIE,EAAsB,CACjC7B,EAAgB,CACdE,GAAI,IACJC,SAAU,oBACVG,UAAW,WACXC,UAAW,WACXU,SAAU,CAAEC,KAAM,CAAC,QAAS,QAASY,QAAS,mCAEhD9B,EAAgB,CACdE,GAAI,IACJC,SAAU,mBACVG,UAAW,aACXC,UAAW,aACXU,SAAU,CAAEC,KAAM,CAAC,SAAU,QAASY,QAAS,6BAEjD9B,EAAgB,CACdE,GAAI,IACJC,SAAU,kBACVG,UAAW,cACXC,UAAW,cACXU,SAAU,CAAEC,KAAM,CAAC,QAAS,WAAYY,QAAS,uBAEnD9B,EAAgB,CACdE,GAAI,IACJC,SAAU,oBACVG,UAAW,cACXC,UAAW,cACXU,SAAU,CAAEC,KAAM,CAAC,QAAS,cAE9BlB,EAAgB,CACdE,GAAI,IACJC,SAAU,sBACVG,UAAW,gBACXC,UAAW,gBACXU,SAAU,CAAEC,KAAM,CAAC,UAAW"}
+{"version":3,"file":"mockAssets.js","sources":["../../../../../src/components/organisms/AssetManager/__mocks__/mockAssets.ts"],"sourcesContent":["import { type Asset, type AssetResponse, AssetType } from '../types';\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    createdBy: 'Mock User',\n    updatedBy: 'Mock User',\n    updatedAt: new Date().toISOString(),\n    uploadedAt: new Date().toISOString(),\n    orgId: 'org10121',\n    brandId: 'br1',\n    type: AssetType.IMAGE,\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: AssetResponse = {\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","createdBy","updatedBy","updatedAt","Date","toISOString","uploadedAt","orgId","brandId","type","AssetType","IMAGE","metadata","tags","createMockAssets","count","overridesArray","Array","from","length","_","index","baseOverrides","toString","mockAssets","data","altText"],"mappings":"oDAOaA,EAAkB,CAACC,EAA4B,MAgBnD,IAfqB,CAC1BC,GAAI,oBACJC,SAAU,iBACVC,YAAa,aACbC,IAAK,gCACLC,UAAW,YACXC,UAAW,YACXC,WAAW,IAAIC,MAAOC,cACtBC,YAAY,IAAIF,MAAOC,cACvBE,MAAO,WACPC,QAAS,MACTC,KAAMC,EAAUC,MAChBC,SAAU,CAAEC,KAAM,CAAC,aAGQjB,IASlBkB,EAAmB,CAACC,EAAeC,IACvCC,MAAMC,KAAK,CAAEC,OAAQJ,IAAS,CAACK,EAAGC,KACvC,MAAMC,EAAgBN,IAAiBK,IAAU,CAAA,EACjD,OAAO1B,EAAgB,CACrBE,IAAKwB,EAAQ,GAAGE,WAChBzB,SAAU,cAAcuB,EAAQ,WAC7BC,OAQIE,EAA4B,CACvCC,KAAM,CACJ9B,EAAgB,CACdE,GAAI,oBACJC,SAAU,oBACVG,UAAW,WACXC,UAAW,WACXU,SAAU,CAAEC,KAAM,CAAC,QAAS,QAASa,QAAS,mCAEhD/B,EAAgB,CACdE,GAAI,iBACJC,SAAU,mBACVG,UAAW,aACXC,UAAW,aACXU,SAAU,CAAEC,KAAM,CAAC,SAAU,QAASa,QAAS,6BAEjD/B,EAAgB,CACdE,GAAI,gBACJC,SAAU,kBACVG,UAAW,cACXC,UAAW,cACXU,SAAU,CAAEC,KAAM,CAAC,QAAS,WAAYa,QAAS,uBAEnD/B,EAAgB,CACdE,GAAI,gBACJC,SAAU,oBACVG,UAAW,cACXC,UAAW,cACXU,SAAU,CAAEC,KAAM,CAAC,QAAS,cAE9BlB,EAAgB,CACdE,GAAI,gBACJC,SAAU,sBACVG,UAAW,gBACXC,UAAW,gBACXU,SAAU,CAAEC,KAAM,CAAC,UAAW"}

package/dist/components/organisms/AssetManager/hooks/{useAssets.cjs.js → useGetAssets.cjs.js}

@@ -1,2 +1,2 @@
 "use strict";var e=require("../../../../utilities/timeUtilities.cjs.js"),s=require("@tanstack/react-query"),t=require("../services/asset.service.cjs.js");exports.useGetAssets=(r,i,u)=>s.useQuery({queryKey:[t.getAssetsKey,r,u],queryFn:()=>t.getAssets(r,u),gcTime:e.TEN_MINUTES,enabled:i});
-//# sourceMappingURL=useAssets.cjs.js.map
+//# sourceMappingURL=useGetAssets.cjs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useGetAssets.cjs.js","sources":["../../../../../src/components/organisms/AssetManager/hooks/useGetAssets.ts"],"sourcesContent":["import { TEN_MINUTES } from '@fd/utilities/timeUtilities';\nimport { useQuery, type UseQueryResult } from '@tanstack/react-query';\n\nimport { getAssets, getAssetsKey } from '../services/asset.service';\nimport type { AssetResponse } from '../types';\n\n/**\n * Hook to fetch assets from the API\n * Automatically determines the API URL based on environment and orgId\n * @param orgId - Organization ID\n * @param enabled - Whether the query should be enabled\n * @param brandId - Brand ID\n * @returns Query result with assets data, loading state, and error state\n */\nexport const useGetAssets = (\n  orgId: string,\n  enabled: boolean,\n  brandId?: string,\n): UseQueryResult<AssetResponse, Error> => {\n  return useQuery<AssetResponse, Error>({\n    queryKey: [getAssetsKey, orgId, brandId],\n    queryFn: () => getAssets(orgId, brandId),\n    gcTime: TEN_MINUTES,\n    enabled,\n  });\n};\n"],"names":["orgId","enabled","brandId","useQuery","queryKey","getAssetsKey","queryFn","getAssets","gcTime","TEN_MINUTES"],"mappings":"+KAc4B,CAC1BA,EACAC,EACAC,IAEOC,WAA+B,CACpCC,SAAU,CAACC,EAAAA,aAAcL,EAAOE,GAChCI,QAAS,IAAMC,EAAAA,UAAUP,EAAOE,GAChCM,OAAQC,EAAAA,YACRR"}

package/dist/components/organisms/AssetManager/hooks/{useAssets.js → useGetAssets.js}

@@ -1,2 +1,2 @@
 import{TEN_MINUTES as e}from"../../../../utilities/timeUtilities.js";import{useQuery as t}from"@tanstack/react-query";import{getAssets as i,getAssetsKey as r}from"../services/asset.service.js";const s=(s,m,o)=>t({queryKey:[r,s,o],queryFn:()=>i(s,o),gcTime:e,enabled:m});export{s as useGetAssets};
-//# sourceMappingURL=useAssets.js.map
+//# sourceMappingURL=useGetAssets.js.map

package/dist/components/organisms/AssetManager/hooks/useGetAssets.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useGetAssets.js","sources":["../../../../../src/components/organisms/AssetManager/hooks/useGetAssets.ts"],"sourcesContent":["import { TEN_MINUTES } from '@fd/utilities/timeUtilities';\nimport { useQuery, type UseQueryResult } from '@tanstack/react-query';\n\nimport { getAssets, getAssetsKey } from '../services/asset.service';\nimport type { AssetResponse } from '../types';\n\n/**\n * Hook to fetch assets from the API\n * Automatically determines the API URL based on environment and orgId\n * @param orgId - Organization ID\n * @param enabled - Whether the query should be enabled\n * @param brandId - Brand ID\n * @returns Query result with assets data, loading state, and error state\n */\nexport const useGetAssets = (\n  orgId: string,\n  enabled: boolean,\n  brandId?: string,\n): UseQueryResult<AssetResponse, Error> => {\n  return useQuery<AssetResponse, Error>({\n    queryKey: [getAssetsKey, orgId, brandId],\n    queryFn: () => getAssets(orgId, brandId),\n    gcTime: TEN_MINUTES,\n    enabled,\n  });\n};\n"],"names":["useGetAssets","orgId","enabled","brandId","useQuery","queryKey","getAssetsKey","queryFn","getAssets","gcTime","TEN_MINUTES"],"mappings":"iMAcO,MAAMA,EAAe,CAC1BC,EACAC,EACAC,IAEOC,EAA+B,CACpCC,SAAU,CAACC,EAAcL,EAAOE,GAChCI,QAAS,IAAMC,EAAUP,EAAOE,GAChCM,OAAQC,EACRR"}

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

@@ -0,0 +1,2 @@
+"use strict";var e=require("@tanstack/react-query"),s=require("../services/asset.service.cjs.js");exports.useUploadAsset=()=>{const t=e.useQueryClient();return e.useMutation({mutationFn:s.uploadAsset,onSuccess:(e,r)=>{t.invalidateQueries({queryKey:[s.getAssetsKey,r.orgId,r.brandId]})}})};
+//# sourceMappingURL=useUploadAsset.cjs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useUploadAsset.cjs.js","sources":["../../../../../src/components/organisms/AssetManager/hooks/useUploadAsset.ts"],"sourcesContent":["import { useMutation, type UseMutationResult, useQueryClient } from '@tanstack/react-query';\n\nimport { getAssetsKey, uploadAsset, type UploadAssetParams } from '../services/asset.service';\nimport type { UploadAssetResponse } from '../types';\n\n/**\n * Hook to upload assets to the API\n * Automatically invalidates the assets query after successful upload\n * @returns Mutation result with mutate function, loading state, and error state\n */\nexport const useUploadAsset = (): UseMutationResult<UploadAssetResponse, Error, UploadAssetParams> => {\n  const queryClient = useQueryClient();\n\n  return useMutation<UploadAssetResponse, Error, UploadAssetParams>({\n    mutationFn: uploadAsset,\n    onSuccess: (_, variables) => {\n      // Invalidate assets query for the specific orgId and brandId to refetch the list\n      void queryClient.invalidateQueries({\n        queryKey: [getAssetsKey, variables.orgId, variables.brandId],\n      });\n    },\n  });\n};\n"],"names":["queryClient","useQueryClient","useMutation","mutationFn","uploadAsset","onSuccess","_","variables","invalidateQueries","queryKey","getAssetsKey","orgId","brandId"],"mappings":"yHAU8B,KAC5B,MAAMA,EAAcC,EAAAA,iBAEpB,OAAOC,cAA2D,CAChEC,WAAYC,EAAAA,YACZC,UAAW,CAACC,EAAGC,KAERP,EAAYQ,kBAAkB,CACjCC,SAAU,CAACC,EAAAA,aAAcH,EAAUI,MAAOJ,EAAUK"}

package/dist/components/organisms/AssetManager/hooks/useUploadAsset.d.ts

@@ -0,0 +1,12 @@
+import { UseMutationResult } from '@tanstack/react-query';
+import { UploadAssetParams } from '../services/asset.service.js';
+import { UploadAssetResponse } from '../types/index.js';
+
+/**
+ * Hook to upload assets to the API
+ * Automatically invalidates the assets query after successful upload
+ * @returns Mutation result with mutate function, loading state, and error state
+ */
+declare const useUploadAsset: () => UseMutationResult<UploadAssetResponse, Error, UploadAssetParams>;
+
+export { useUploadAsset };

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

@@ -0,0 +1,2 @@
+import{useQueryClient as e,useMutation as r}from"@tanstack/react-query";import{uploadAsset as t,getAssetsKey as s}from"../services/asset.service.js";const o=()=>{const o=e();return r({mutationFn:t,onSuccess:(e,r)=>{o.invalidateQueries({queryKey:[s,r.orgId,r.brandId]})}})};export{o as useUploadAsset};
+//# sourceMappingURL=useUploadAsset.js.map

package/dist/components/organisms/AssetManager/hooks/useUploadAsset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useUploadAsset.js","sources":["../../../../../src/components/organisms/AssetManager/hooks/useUploadAsset.ts"],"sourcesContent":["import { useMutation, type UseMutationResult, useQueryClient } from '@tanstack/react-query';\n\nimport { getAssetsKey, uploadAsset, type UploadAssetParams } from '../services/asset.service';\nimport type { UploadAssetResponse } from '../types';\n\n/**\n * Hook to upload assets to the API\n * Automatically invalidates the assets query after successful upload\n * @returns Mutation result with mutate function, loading state, and error state\n */\nexport const useUploadAsset = (): UseMutationResult<UploadAssetResponse, Error, UploadAssetParams> => {\n  const queryClient = useQueryClient();\n\n  return useMutation<UploadAssetResponse, Error, UploadAssetParams>({\n    mutationFn: uploadAsset,\n    onSuccess: (_, variables) => {\n      // Invalidate assets query for the specific orgId and brandId to refetch the list\n      void queryClient.invalidateQueries({\n        queryKey: [getAssetsKey, variables.orgId, variables.brandId],\n      });\n    },\n  });\n};\n"],"names":["useUploadAsset","queryClient","useQueryClient","useMutation","mutationFn","uploadAsset","onSuccess","_","variables","invalidateQueries","queryKey","getAssetsKey","orgId","brandId"],"mappings":"qJAUO,MAAMA,EAAiB,KAC5B,MAAMC,EAAcC,IAEpB,OAAOC,EAA2D,CAChEC,WAAYC,EACZC,UAAW,CAACC,EAAGC,KAERP,EAAYQ,kBAAkB,CACjCC,SAAU,CAACC,EAAcH,EAAUI,MAAOJ,EAAUK"}

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

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),a=require("react"),l=require("@mui/material/styles"),r=require("@mui/material/Box"),s=require("@mui/material/Tab"),i=require("../../molecules/Modal/index.cjs.js"),t=require("../../molecules/Tabs/index.cjs.js"),n=require("@tanstack/react-query"),c=require("./LibraryTabContent/index.cjs.js"),o=require("./UploadTabContent/index.cjs.js");const u=l.styled(r)((({theme:e})=>({marginBottom:e.spacing(3)}))),d=new n.QueryClient;module.exports=({open:l,onClose:r,onSelect:b,orgId:m,brandId:p,maxSelect:y=1})=>{const[C,j]=a.useState(new Map),[x,g]=a.useState("library"),[k,q]=a.useState([]);a.useEffect((()=>{l||(j(new Map),q([]))}),[l]);const v=a.useCallback((()=>{j(new Map),r()}),[r]),h=a.useCallback((()=>{const e=Array.from(C.values());b&&e.length>0&&b(e),j(new Map),r()}),[b,C,r]),f=a.useCallback((e=>{j((a=>{const l=a.has(e.id),r=new Map(a);return l?r.delete(e.id):1===y?(r.clear(),r.set(e.id,e)):r.size<y&&r.set(e.id,e),r}))}),[y]),S=a.useCallback((()=>{q([]),g("library")}),[]),M=a.useCallback((e=>{const a=e.map((e=>({file:e})));q((e=>[...e,...a]))}),[]),w=a.useCallback((e=>{q((a=>a.filter((a=>a.file!==e))))}),[]),I=a.useMemo((()=>{const e={label:"Cancel",onClick:v,variant:"secondary",tone:"neutral",id:"asset-manager-cancel"},a={library:[e,{label:"Select",onClick:h,variant:"primary",disabled:0===C.size,id:"asset-manager-select"}],upload:[e,{label:"Save",onClick:S,disabled:0===k.length,variant:"primary",id:"asset-manager-upload"}]};return a[x]??a.library}),[x,C.size,k.length,v,h,S]);return e.jsx(n.QueryClientProvider,{client:d,children:e.jsxs(i,{actions:I,onClose:v,open:l,size:"large",title:"library"===x?"Select Images":"Upload Images",children:[e.jsx(u,{children:e.jsxs(t,{fdKey:"asset-manager-tabs",onChange:(e,a)=>g(a),value:x,children:[e.jsx(s,{label:"Upload",value:"upload"}),e.jsx(s,{label:"Library",value:"library"})]})}),"library"===x?e.jsx(c,{brandId:p,enabled:l,onAssetClick:f,orgId:m,selectedAssets:C}):e.jsx(o,{files:k,onRemove:w,onUpload:M})]})})};
+"use strict";var e=require("react/jsx-runtime"),a=require("react"),r=require("@mui/material/styles"),s=require("@mui/material/Box"),l=require("@mui/material/Tab"),i=require("../../molecules/Modal/index.cjs.js"),n=require("../../molecules/Tabs/index.cjs.js"),t=require("@tanstack/react-query"),o=require("./hooks/useUploadAsset.cjs.js"),c=require("./LibraryTabContent/index.cjs.js"),d=require("./UploadTabContent/index.cjs.js");const u=r.styled(s)((({theme:e})=>({marginBottom:e.spacing(3)}))),b=new t.QueryClient,m=({open:r,onClose:s,onSelect:t,orgId:b,brandId:m,maxSelect:p=1})=>{const[j,y]=a.useState(new Map),[g,C]=a.useState("library"),[x,k]=a.useState([]),q=o.useUploadAsset();a.useEffect((()=>{r||(y(new Map),k([]))}),[r]);const f=a.useCallback((()=>{y(new Map),s()}),[s]),h=a.useCallback((()=>{const e=Array.from(j.values());t&&e.length>0&&t(e),y(new Map),s()}),[t,j,s]),v=a.useCallback((e=>{y((a=>{const r=a.has(e.id),s=new Map(a);return r?s.delete(e.id):1===p?(s.clear(),s.set(e.id,e)):s.size<p&&s.set(e.id,e),s}))}),[p]),S=a.useCallback((()=>{q.mutate({orgId:b,brandId:m,files:x.map((e=>e.file))},{onSuccess:()=>{k([]),C("library")},onError:e=>{console.error("Upload failed:",e)}})}),[b,m,x,q]),I=a.useCallback((e=>{const a=e.map((e=>({file:e})));k((e=>[...e,...a]))}),[]),M=a.useCallback((e=>{k((a=>a.filter((a=>a.file!==e))))}),[]),U=a.useMemo((()=>{const e={label:"Cancel",onClick:f,variant:"secondary",tone:"neutral",id:"asset-manager-cancel"},a={library:[e,{label:"Select",onClick:h,variant:"primary",disabled:0===j.size,id:"asset-manager-select"}],upload:[e,{label:"Save",onClick:S,disabled:0===x.length||q.isPending,variant:"primary",id:"asset-manager-upload"}]};return a[g]??a.library}),[g,j.size,x.length,q.isPending,f,h,S]);return e.jsxs(i,{actions:U,onClose:f,open:r,size:"large",title:"library"===g?"Select Images":"Upload Images",children:[e.jsx(u,{children:e.jsxs(n,{fdKey:"asset-manager-tabs",onChange:(e,a)=>C(a),value:g,children:[e.jsx(l,{label:"Upload",value:"upload"}),e.jsx(l,{label:"Library",value:"library"})]})}),"library"===g?e.jsx(c,{brandId:m,enabled:r,onAssetClick:v,orgId:b,selectedAssets:j}):e.jsx(d,{files:x,onRemove:M,onUpload:I})]})};module.exports=a=>e.jsx(t.QueryClientProvider,{client:b,children:e.jsx(m,{...a})});
 //# sourceMappingURL=index.cjs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/organisms/AssetManager/index.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport Tab from '@fd/components/atoms/Tab';\nimport Modal, { type ModalAction } from '@fd/components/molecules/Modal';\nimport Tabs from '@fd/components/molecules/Tabs';\nimport { QueryClient, QueryClientProvider } from '@tanstack/react-query';\n\nimport type { FileUploadState } from '../FileUpload';\nimport LibraryTabContent from './LibraryTabContent';\nimport type { Asset } from './types';\nimport UploadAssetContent from './UploadTabContent';\n\nconst StyledTabsContainer = styled(Box)(({ theme }) => ({\n  marginBottom: theme.spacing(3),\n}));\n\n/**\n * Props for the AssetManager component.\n * Provides a modal interface for selecting images from a grid display.\n * It supports both single and multiple image selection modes with configurable limits.\n *\n * import AssetManager from '@flipdish/portal-library/components/organisms/AssetManager';\n *\n * ```tsx\n * import AssetManager from '@flipdish/portal-library/components/organisms/AssetManager';\n */\nexport interface AssetManagerProps {\n  /** Whether the asset manager modal is open */\n  open: boolean;\n  /** Callback function when the modal is closed or cancelled */\n  onClose: () => void;\n  /** Callback function when assets are selected */\n  onSelect?: (selectedAssets: Asset[]) => void;\n  /**\n   * Organization ID for fetching assets\n   */\n  orgId: string;\n  /** Brand ID for fetching assets */\n  brandId?: string;\n  /** Maximum number of assets that can be selected. Defaults to 1 */\n  maxSelect?: number;\n}\n\n// Create a QueryClient instance for the AssetManager component\n// This allows the component to be used without requiring clients to wrap it in QueryClientProvider\nconst queryClient = new QueryClient();\n\n/**\n * AssetManager component used to select assets from the library or upload new assets.\n * Can manage assets at a organization or brand level.\n *\n * @example\n * ```tsx\n * <AssetManager\n *   open={isOpen}\n *   onClose={() => setIsOpen(false)}\n *   onSelect={(assets) => console.log(assets)}\n *   orgId=\"org123\"\n *   brandId=\"brand456\"\n *   maxSelect={3}\n * />\n * ```\n */\nconst AssetManager: React.FC<AssetManagerProps> = ({\n  open,\n  onClose,\n  onSelect,\n  orgId,\n  brandId,\n  maxSelect = 1,\n}) => {\n  // Use Map for O(1) lookup performance and direct access to Asset objects\n  const [selectedAssetsMap, setSelectedAssetsMap] = useState<Map<string, Asset>>(new Map());\n  const [selectedTab, setSelectedTab] = useState<string>('library');\n  const [uploadedFiles, setUploadedFiles] = useState<FileUploadState[]>([]);\n\n  // Reset selection when modal opens/closes\n  useEffect(() => {\n    if (!open) {\n      setSelectedAssetsMap(new Map());\n      setUploadedFiles([]);\n    }\n  }, [open]);\n\n  const handleCancel = useCallback((): void => {\n    setSelectedAssetsMap(new Map());\n    onClose();\n  }, [onClose]);\n\n  const handleSelect = useCallback((): void => {\n    const selectedAssets = Array.from(selectedAssetsMap.values());\n    if (onSelect && selectedAssets.length > 0) {\n      onSelect(selectedAssets);\n    }\n    setSelectedAssetsMap(new Map());\n    onClose();\n  }, [onSelect, selectedAssetsMap, onClose]);\n\n  // TODO: translate titles\n  const getTitle = (): string => {\n    switch (selectedTab) {\n      case 'library':\n        return 'Select Images';\n      default:\n        return 'Upload Images';\n    }\n  };\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 handleSaveAssets = useCallback((): void => {\n    // TODO: call Upload asset api\n    setUploadedFiles([]);\n    setSelectedTab('library');\n  }, []);\n\n  const handleUpload = useCallback((files: File[]): void => {\n    // Add files with uploading state\n    const newFiles: FileUploadState[] = files.map((file) => ({\n      file,\n    }));\n    setUploadedFiles((prev) => [...prev, ...newFiles]);\n  }, []);\n\n  const handleRemove = useCallback((fileToRemove: File): void => {\n    setUploadedFiles((prev) => prev.filter((fileState) => fileState.file !== fileToRemove));\n  }, []);\n\n  // Tab-specific action button configurations\n  // TODO: translate button labels\n  const actionButtons = useMemo<ModalAction[]>(() => {\n    // Common cancel button configuration\n    const cancelButton: ModalAction = {\n      label: 'Cancel',\n      onClick: handleCancel,\n      variant: 'secondary',\n      tone: 'neutral',\n      id: 'asset-manager-cancel',\n    };\n\n    const tabActions: Record<string, ModalAction[]> = {\n      library: [\n        cancelButton,\n        {\n          label: 'Select',\n          onClick: handleSelect,\n          variant: 'primary',\n          disabled: selectedAssetsMap.size === 0,\n          id: 'asset-manager-select',\n        },\n      ],\n      upload: [\n        cancelButton,\n        {\n          label: 'Save',\n          onClick: handleSaveAssets,\n          disabled: uploadedFiles.length === 0,\n          variant: 'primary',\n          id: 'asset-manager-upload',\n        },\n      ],\n    };\n\n    return tabActions[selectedTab] ?? (tabActions['library'] as ModalAction[]);\n  }, [\n    selectedTab,\n    selectedAssetsMap.size,\n    uploadedFiles.length,\n    handleCancel,\n    handleSelect,\n    handleSaveAssets,\n  ]);\n\n  return (\n    <QueryClientProvider client={queryClient}>\n      <Modal actions={actionButtons} onClose={handleCancel} open={open} size=\"large\" title={getTitle()}>\n        <StyledTabsContainer>\n          <Tabs\n            fdKey=\"asset-manager-tabs\"\n            onChange={(_, value: string) => setSelectedTab(value)}\n            value={selectedTab}\n          >\n            <Tab label=\"Upload\" value=\"upload\" />\n            <Tab label=\"Library\" value=\"library\" />\n          </Tabs>\n        </StyledTabsContainer>\n        {selectedTab === 'library' ? (\n          <LibraryTabContent\n            brandId={brandId}\n            enabled={open}\n            onAssetClick={handleAssetClick}\n            orgId={orgId}\n            selectedAssets={selectedAssetsMap}\n          />\n        ) : (\n          <UploadAssetContent files={uploadedFiles} onRemove={handleRemove} onUpload={handleUpload} />\n        )}\n      </Modal>\n    </QueryClientProvider>\n  );\n};\n\nexport default AssetManager;\n"],"names":["StyledTabsContainer","styled","Box","theme","marginBottom","spacing","queryClient","QueryClient","open","onClose","onSelect","orgId","brandId","maxSelect","selectedAssetsMap","setSelectedAssetsMap","useState","Map","selectedTab","setSelectedTab","uploadedFiles","setUploadedFiles","useEffect","handleCancel","useCallback","handleSelect","selectedAssets","Array","from","values","length","handleAssetClick","asset","prevMap","isSelected","has","id","newMap","delete","clear","set","size","handleSaveAssets","handleUpload","files","newFiles","map","file","prev","handleRemove","fileToRemove","filter","fileState","actionButtons","useMemo","cancelButton","label","onClick","variant","tone","tabActions","library","disabled","upload","_jsx","QueryClientProvider","client","children","_jsxs","Modal","actions","title","Tabs","fdKey","onChange","_","value","Tab","LibraryTabContent","enabled","onAssetClick","UploadAssetContent","onRemove","onUpload"],"mappings":"gYAeA,MAAMA,EAAsBC,EAAAA,OAAOC,EAAPD,EAAY,EAAGE,YAAO,CAChDC,aAAcD,EAAME,QAAQ,OAgCxBC,EAAc,IAAIC,EAAAA,2BAkB0B,EAChDC,OACAC,UACAC,WACAC,QACAC,UACAC,YAAY,MAGZ,MAAOC,EAAmBC,GAAwBC,EAAAA,SAA6B,IAAIC,MAC5EC,EAAaC,GAAkBH,EAAAA,SAAiB,YAChDI,EAAeC,GAAoBL,EAAAA,SAA4B,IAGtEM,EAAAA,WAAU,KACHd,IACHO,EAAqB,IAAIE,KACzBI,EAAiB,OAElB,CAACb,IAEJ,MAAMe,EAAeC,EAAAA,aAAY,KAC/BT,EAAqB,IAAIE,KACzBR,MACC,CAACA,IAEEgB,EAAeD,EAAAA,aAAY,KAC/B,MAAME,EAAiBC,MAAMC,KAAKd,EAAkBe,UAChDnB,GAAYgB,EAAeI,OAAS,GACtCpB,EAASgB,GAEXX,EAAqB,IAAIE,KACzBR,MACC,CAACC,EAAUI,EAAmBL,IAY3BsB,EAAmBP,eACtBQ,IACCjB,GAAsBkB,IACpB,MAAMC,EAAaD,EAAQE,IAAIH,EAAMI,IAC/BC,EAAS,IAAIpB,IAAIgB,GAcvB,OAZIC,EAEFG,EAAOC,OAAON,EAAMI,IACG,IAAdvB,GAETwB,EAAOE,QACPF,EAAOG,IAAIR,EAAMI,GAAIJ,IACZK,EAAOI,KAAO5B,GAEvBwB,EAAOG,IAAIR,EAAMI,GAAIJ,GAGhBK,OAGX,CAACxB,IAGG6B,EAAmBlB,EAAAA,aAAY,KAEnCH,EAAiB,IACjBF,EAAe,aACd,IAEGwB,EAAenB,eAAaoB,IAEhC,MAAMC,EAA8BD,EAAME,KAAKC,IAAI,CACjDA,WAEF1B,GAAkB2B,GAAS,IAAIA,KAASH,OACvC,IAEGI,EAAezB,eAAa0B,IAChC7B,GAAkB2B,GAASA,EAAKG,QAAQC,GAAcA,EAAUL,OAASG,QACxE,IAIGG,EAAgBC,EAAAA,SAAuB,KAE3C,MAAMC,EAA4B,CAChCC,MAAO,SACPC,QAASlC,EACTmC,QAAS,YACTC,KAAM,UACNvB,GAAI,wBAGAwB,EAA4C,CAChDC,QAAS,CACPN,EACA,CACEC,MAAO,SACPC,QAAShC,EACTiC,QAAS,UACTI,SAAqC,IAA3BhD,EAAkB2B,KAC5BL,GAAI,yBAGR2B,OAAQ,CACNR,EACA,CACEC,MAAO,OACPC,QAASf,EACToB,SAAmC,IAAzB1C,EAAcU,OACxB4B,QAAS,UACTtB,GAAI,0BAKV,OAAOwB,EAAW1C,IAAiB0C,EAAoB,UACtD,CACD1C,EACAJ,EAAkB2B,KAClBrB,EAAcU,OACdP,EACAE,EACAiB,IAGF,OACEsB,EAAAA,IAACC,EAAAA,oBAAmB,CAACC,OAAQ5D,EAAW6D,SACtCC,EAAAA,KAACC,EAAK,CAACC,QAASjB,EAAe5C,QAASc,EAAcf,KAAMA,EAAMiC,KAAK,QAAQ8B,MAhG1E,YADCrD,EAEG,gBAEA,0BA8FP8C,EAAAA,IAAChE,EAAmB,CAAAmE,SAClBC,EAAAA,KAACI,EAAI,CACHC,MAAM,qBACNC,SAAU,CAACC,EAAGC,IAAkBzD,EAAeyD,GAC/CA,MAAO1D,EAAWiD,SAAA,CAElBH,MAACa,EAAG,CAACrB,MAAM,SAASoB,MAAM,WAC1BZ,EAAAA,IAACa,EAAG,CAACrB,MAAM,UAAUoB,MAAM,iBAGd,YAAhB1D,EACC8C,MAACc,EAAiB,CAChBlE,QAASA,EACTmE,QAASvE,EACTwE,aAAcjD,EACdpB,MAAOA,EACPe,eAAgBZ,IAGlBkD,MAACiB,EAAkB,CAACrC,MAAOxB,EAAe8D,SAAUjC,EAAckC,SAAUxC"}
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/organisms/AssetManager/index.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport Tab from '@fd/components/atoms/Tab';\nimport Modal, { type ModalAction } from '@fd/components/molecules/Modal';\nimport Tabs from '@fd/components/molecules/Tabs';\nimport { QueryClient, QueryClientProvider } from '@tanstack/react-query';\n\nimport type { FileUploadState } from '../FileUpload';\nimport { useUploadAsset } from './hooks/useUploadAsset';\nimport LibraryTabContent from './LibraryTabContent';\nimport type { Asset } from './types';\nimport UploadAssetContent from './UploadTabContent';\n\nconst StyledTabsContainer = styled(Box)(({ theme }) => ({\n  marginBottom: theme.spacing(3),\n}));\n\n/**\n * Props for the AssetManager component.\n * Provides a modal interface for selecting images from a grid display.\n * It supports both single and multiple image selection modes with configurable limits.\n *\n * import AssetManager from '@flipdish/portal-library/components/organisms/AssetManager';\n *\n * ```tsx\n * import AssetManager from '@flipdish/portal-library/components/organisms/AssetManager';\n */\nexport interface AssetManagerProps {\n  /** Whether the asset manager modal is open */\n  open: boolean;\n  /** Callback function when the modal is closed or cancelled */\n  onClose: () => void;\n  /** Callback function when assets are selected */\n  onSelect?: (selectedAssets: Asset[]) => void;\n  /**\n   * Organization ID for fetching assets\n   */\n  orgId: string;\n  /** Brand ID for fetching assets */\n  brandId?: string;\n  /** Maximum number of assets that can be selected. Defaults to 1 */\n  maxSelect?: number;\n}\n\n// Create a QueryClient instance for the AssetManager component\n// This allows the component to be used without requiring clients to wrap it in QueryClientProvider\nconst queryClient = new QueryClient();\n\n/**\n * Inner component that contains the AssetManager logic.\n * Must be rendered inside QueryClientProvider to use React Query hooks.\n */\nconst AssetManagerContent: React.FC<AssetManagerProps> = ({\n  open,\n  onClose,\n  onSelect,\n  orgId,\n  brandId,\n  maxSelect = 1,\n}) => {\n  // Use Map for O(1) lookup performance and direct access to Asset objects\n  const [selectedAssetsMap, setSelectedAssetsMap] = useState<Map<string, Asset>>(new Map());\n  const [selectedTab, setSelectedTab] = useState<string>('library');\n  const [uploadedFiles, setUploadedFiles] = useState<FileUploadState[]>([]);\n  const uploadMutation = useUploadAsset();\n\n  // Reset selection when modal opens/closes\n  useEffect(() => {\n    if (!open) {\n      setSelectedAssetsMap(new Map());\n      setUploadedFiles([]);\n    }\n  }, [open]);\n\n  const handleCancel = useCallback((): void => {\n    setSelectedAssetsMap(new Map());\n    onClose();\n  }, [onClose]);\n\n  const handleSelect = useCallback((): void => {\n    const selectedAssets = Array.from(selectedAssetsMap.values());\n    if (onSelect && selectedAssets.length > 0) {\n      onSelect(selectedAssets);\n    }\n    setSelectedAssetsMap(new Map());\n    onClose();\n  }, [onSelect, selectedAssetsMap, onClose]);\n\n  // TODO: translate titles\n  const getTitle = (): string => {\n    switch (selectedTab) {\n      case 'library':\n        return 'Select Images';\n      default:\n        return 'Upload Images';\n    }\n  };\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 handleSaveAssets = useCallback((): void => {\n    uploadMutation.mutate(\n      {\n        orgId,\n        brandId,\n        files: uploadedFiles.map((file) => file.file),\n      },\n      {\n        onSuccess: () => {\n          // Clear uploaded files and switch to library tab\n          setUploadedFiles([]);\n          setSelectedTab('library');\n        },\n        onError: (error) => {\n          console.error('Upload failed:', error);\n          // Error handling - you could add a snackbar notification here\n        },\n      },\n    );\n  }, [orgId, brandId, uploadedFiles, uploadMutation]);\n\n  const handleUpload = useCallback((files: File[]): void => {\n    // Add files with uploading state\n    const newFiles: FileUploadState[] = files.map((file) => ({\n      file,\n    }));\n    setUploadedFiles((prev) => [...prev, ...newFiles]);\n  }, []);\n\n  const handleRemove = useCallback((fileToRemove: File): void => {\n    setUploadedFiles((prev) => prev.filter((fileState) => fileState.file !== fileToRemove));\n  }, []);\n\n  // Tab-specific action button configurations\n  // TODO: translate button labels\n  const actionButtons = useMemo<ModalAction[]>(() => {\n    // Common cancel button configuration\n    const cancelButton: ModalAction = {\n      label: 'Cancel',\n      onClick: handleCancel,\n      variant: 'secondary',\n      tone: 'neutral',\n      id: 'asset-manager-cancel',\n    };\n\n    const tabActions: Record<string, ModalAction[]> = {\n      library: [\n        cancelButton,\n        {\n          label: 'Select',\n          onClick: handleSelect,\n          variant: 'primary',\n          disabled: selectedAssetsMap.size === 0,\n          id: 'asset-manager-select',\n        },\n      ],\n      upload: [\n        cancelButton,\n        {\n          label: 'Save',\n          onClick: handleSaveAssets,\n          disabled: uploadedFiles.length === 0 || uploadMutation.isPending,\n          variant: 'primary',\n          id: 'asset-manager-upload',\n        },\n      ],\n    };\n\n    return tabActions[selectedTab] ?? (tabActions['library'] as ModalAction[]);\n  }, [\n    selectedTab,\n    selectedAssetsMap.size,\n    uploadedFiles.length,\n    uploadMutation.isPending,\n    handleCancel,\n    handleSelect,\n    handleSaveAssets,\n  ]);\n\n  return (\n    <Modal actions={actionButtons} onClose={handleCancel} open={open} size=\"large\" title={getTitle()}>\n      <StyledTabsContainer>\n        <Tabs\n          fdKey=\"asset-manager-tabs\"\n          onChange={(_, value: string) => setSelectedTab(value)}\n          value={selectedTab}\n        >\n          <Tab label=\"Upload\" value=\"upload\" />\n          <Tab label=\"Library\" value=\"library\" />\n        </Tabs>\n      </StyledTabsContainer>\n      {selectedTab === 'library' ? (\n        <LibraryTabContent\n          brandId={brandId}\n          enabled={open}\n          onAssetClick={handleAssetClick}\n          orgId={orgId}\n          selectedAssets={selectedAssetsMap}\n        />\n      ) : (\n        <UploadAssetContent files={uploadedFiles} onRemove={handleRemove} onUpload={handleUpload} />\n      )}\n    </Modal>\n  );\n};\n\n/**\n * AssetManager component used to select assets from the library or upload new assets.\n * Can manage assets at a organization or brand level.\n *\n * @example\n * ```tsx\n * <AssetManager\n *   open={isOpen}\n *   onClose={() => setIsOpen(false)}\n *   onSelect={(assets) => console.log(assets)}\n *   orgId=\"org123\"\n *   brandId=\"brand456\"\n *   maxSelect={3}\n * />\n * ```\n */\nconst AssetManager: React.FC<AssetManagerProps> = (props) => {\n  return (\n    <QueryClientProvider client={queryClient}>\n      <AssetManagerContent {...props} />\n    </QueryClientProvider>\n  );\n};\n\nexport default AssetManager;\n"],"names":["StyledTabsContainer","styled","Box","theme","marginBottom","spacing","queryClient","QueryClient","AssetManagerContent","open","onClose","onSelect","orgId","brandId","maxSelect","selectedAssetsMap","setSelectedAssetsMap","useState","Map","selectedTab","setSelectedTab","uploadedFiles","setUploadedFiles","uploadMutation","useUploadAsset","useEffect","handleCancel","useCallback","handleSelect","selectedAssets","Array","from","values","length","handleAssetClick","asset","prevMap","isSelected","has","id","newMap","delete","clear","set","size","handleSaveAssets","mutate","files","map","file","onSuccess","onError","error","console","handleUpload","newFiles","prev","handleRemove","fileToRemove","filter","fileState","actionButtons","useMemo","cancelButton","label","onClick","variant","tone","tabActions","library","disabled","upload","isPending","_jsxs","Modal","actions","title","children","_jsx","Tabs","fdKey","onChange","_","value","Tab","LibraryTabContent","enabled","onAssetClick","UploadAssetContent","onRemove","onUpload","props","QueryClientProvider","client"],"mappings":"2aAgBA,MAAMA,EAAsBC,EAAAA,OAAOC,EAAPD,EAAY,EAAGE,YAAO,CAChDC,aAAcD,EAAME,QAAQ,OAgCxBC,EAAc,IAAIC,EAAAA,YAMlBC,EAAmD,EACvDC,OACAC,UACAC,WACAC,QACAC,UACAC,YAAY,MAGZ,MAAOC,EAAmBC,GAAwBC,EAAAA,SAA6B,IAAIC,MAC5EC,EAAaC,GAAkBH,EAAAA,SAAiB,YAChDI,EAAeC,GAAoBL,EAAAA,SAA4B,IAChEM,EAAiBC,EAAAA,iBAGvBC,EAAAA,WAAU,KACHhB,IACHO,EAAqB,IAAIE,KACzBI,EAAiB,OAElB,CAACb,IAEJ,MAAMiB,EAAeC,EAAAA,aAAY,KAC/BX,EAAqB,IAAIE,KACzBR,MACC,CAACA,IAEEkB,EAAeD,EAAAA,aAAY,KAC/B,MAAME,EAAiBC,MAAMC,KAAKhB,EAAkBiB,UAChDrB,GAAYkB,EAAeI,OAAS,GACtCtB,EAASkB,GAEXb,EAAqB,IAAIE,KACzBR,MACC,CAACC,EAAUI,EAAmBL,IAY3BwB,EAAmBP,eACtBQ,IACCnB,GAAsBoB,IACpB,MAAMC,EAAaD,EAAQE,IAAIH,EAAMI,IAC/BC,EAAS,IAAItB,IAAIkB,GAcvB,OAZIC,EAEFG,EAAOC,OAAON,EAAMI,IACG,IAAdzB,GAET0B,EAAOE,QACPF,EAAOG,IAAIR,EAAMI,GAAIJ,IACZK,EAAOI,KAAO9B,GAEvB0B,EAAOG,IAAIR,EAAMI,GAAIJ,GAGhBK,OAGX,CAAC1B,IAGG+B,EAAmBlB,EAAAA,aAAY,KACnCJ,EAAeuB,OACb,CACElC,QACAC,UACAkC,MAAO1B,EAAc2B,KAAKC,GAASA,EAAKA,QAE1C,CACEC,UAAW,KAET5B,EAAiB,IACjBF,EAAe,YAEjB+B,QAAUC,IACRC,QAAQD,MAAM,iBAAkBA,QAKrC,CAACxC,EAAOC,EAASQ,EAAeE,IAE7B+B,EAAe3B,eAAaoB,IAEhC,MAAMQ,EAA8BR,EAAMC,KAAKC,IAAI,CACjDA,WAEF3B,GAAkBkC,GAAS,IAAIA,KAASD,OACvC,IAEGE,EAAe9B,eAAa+B,IAChCpC,GAAkBkC,GAASA,EAAKG,QAAQC,GAAcA,EAAUX,OAASS,QACxE,IAIGG,EAAgBC,EAAAA,SAAuB,KAE3C,MAAMC,EAA4B,CAChCC,MAAO,SACPC,QAASvC,EACTwC,QAAS,YACTC,KAAM,UACN5B,GAAI,wBAGA6B,EAA4C,CAChDC,QAAS,CACPN,EACA,CACEC,MAAO,SACPC,QAASrC,EACTsC,QAAS,UACTI,SAAqC,IAA3BvD,EAAkB6B,KAC5BL,GAAI,yBAGRgC,OAAQ,CACNR,EACA,CACEC,MAAO,OACPC,QAASpB,EACTyB,SAAmC,IAAzBjD,EAAcY,QAAgBV,EAAeiD,UACvDN,QAAS,UACT3B,GAAI,0BAKV,OAAO6B,EAAWjD,IAAiBiD,EAAoB,UACtD,CACDjD,EACAJ,EAAkB6B,KAClBvB,EAAcY,OACdV,EAAeiD,UACf9C,EACAE,EACAiB,IAGF,OACE4B,EAAAA,KAACC,EAAK,CAACC,QAASd,EAAenD,QAASgB,EAAcjB,KAAMA,EAAMmC,KAAK,QAAQgC,MA/GxE,YADCzD,EAEG,gBAEA,gBA4GqF0D,SAAA,CAC9FC,EAAAA,IAAC9E,EAAmB,CAAA6E,SAClBJ,EAAAA,KAACM,EAAI,CACHC,MAAM,qBACNC,SAAU,CAACC,EAAGC,IAAkB/D,EAAe+D,GAC/CA,MAAOhE,EAAW0D,SAAA,CAElBC,EAAAA,IAACM,EAAG,CAACpB,MAAM,SAASmB,MAAM,WAC1BL,EAAAA,IAACM,EAAG,CAACpB,MAAM,UAAUmB,MAAM,iBAGd,YAAhBhE,EACC2D,EAAAA,IAACO,EAAiB,CAChBxE,QAASA,EACTyE,QAAS7E,EACT8E,aAAcrD,EACdtB,MAAOA,EACPiB,eAAgBd,IAGlB+D,MAACU,EAAkB,CAACzC,MAAO1B,EAAeoE,SAAUhC,EAAciC,SAAUpC,uBAsBjCqC,GAE/Cb,MAACc,EAAAA,oBAAmB,CAACC,OAAQvF,EAAWuE,SACtCC,EAAAA,IAACtE,EAAmB,IAAKmF"}

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

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as a}from"react/jsx-runtime";import{useState as r,useEffect as l,useCallback as t,useMemo as i}from"react";import{styled as n}from"@mui/material/styles";import o from"@mui/material/Box";import s from"@mui/material/Tab";import m from"../../molecules/Modal/index.js";import d from"../../molecules/Tabs/index.js";import{QueryClient as c,QueryClientProvider as p}from"@tanstack/react-query";import b from"./LibraryTabContent/index.js";import u from"./UploadTabContent/index.js";const f=n(o)((({theme:e})=>({marginBottom:e.spacing(3)}))),y=new c,g=({open:n,onClose:o,onSelect:c,orgId:g,brandId:h,maxSelect:C=1})=>{const[v,x]=r(new Map),[w,I]=r("library"),[M,j]=r([]);l((()=>{n||(x(new Map),j([]))}),[n]);const k=t((()=>{x(new Map),o()}),[o]),S=t((()=>{const e=Array.from(v.values());c&&e.length>0&&c(e),x(new Map),o()}),[c,v,o]),z=t((e=>{x((a=>{const r=a.has(e.id),l=new Map(a);return r?l.delete(e.id):1===C?(l.clear(),l.set(e.id,e)):l.size<C&&l.set(e.id,e),l}))}),[C]),T=t((()=>{j([]),I("library")}),[]),U=t((e=>{const a=e.map((e=>({file:e})));j((e=>[...e,...a]))}),[]),A=t((e=>{j((a=>a.filter((a=>a.file!==e))))}),[]),B=i((()=>{const e={label:"Cancel",onClick:k,variant:"secondary",tone:"neutral",id:"asset-manager-cancel"},a={library:[e,{label:"Select",onClick:S,variant:"primary",disabled:0===v.size,id:"asset-manager-select"}],upload:[e,{label:"Save",onClick:T,disabled:0===M.length,variant:"primary",id:"asset-manager-upload"}]};return a[w]??a.library}),[w,v.size,M.length,k,S,T]);return e(p,{client:y,children:a(m,{actions:B,onClose:k,open:n,size:"large",title:"library"===w?"Select Images":"Upload Images",children:[e(f,{children:a(d,{fdKey:"asset-manager-tabs",onChange:(e,a)=>I(a),value:w,children:[e(s,{label:"Upload",value:"upload"}),e(s,{label:"Library",value:"library"})]})}),"library"===w?e(b,{brandId:h,enabled:n,onAssetClick:z,orgId:g,selectedAssets:v}):e(u,{files:M,onRemove:A,onUpload:U})]})})};export{g as default};
+import{jsx as e,jsxs as a}from"react/jsx-runtime";import{useState as r,useEffect as l,useCallback as o,useMemo as i}from"react";import{styled as n}from"@mui/material/styles";import t from"@mui/material/Box";import s from"@mui/material/Tab";import m from"../../molecules/Modal/index.js";import d from"../../molecules/Tabs/index.js";import{QueryClient as c,QueryClientProvider as p}from"@tanstack/react-query";import{useUploadAsset as b}from"./hooks/useUploadAsset.js";import u from"./LibraryTabContent/index.js";import f from"./UploadTabContent/index.js";const g=n(t)((({theme:e})=>({marginBottom:e.spacing(3)}))),y=new c,h=({open:n,onClose:t,onSelect:c,orgId:p,brandId:y,maxSelect:h=1})=>{const[C,v]=r(new Map),[x,I]=r("library"),[j,k]=r([]),w=b();l((()=>{n||(v(new Map),k([]))}),[n]);const M=o((()=>{v(new Map),t()}),[t]),S=o((()=>{const e=Array.from(C.values());c&&e.length>0&&c(e),v(new Map),t()}),[c,C,t]),U=o((e=>{v((a=>{const r=a.has(e.id),l=new Map(a);return r?l.delete(e.id):1===h?(l.clear(),l.set(e.id,e)):l.size<h&&l.set(e.id,e),l}))}),[h]),z=o((()=>{w.mutate({orgId:p,brandId:y,files:j.map((e=>e.file))},{onSuccess:()=>{k([]),I("library")},onError:e=>{console.error("Upload failed:",e)}})}),[p,y,j,w]),A=o((e=>{const a=e.map((e=>({file:e})));k((e=>[...e,...a]))}),[]),T=o((e=>{k((a=>a.filter((a=>a.file!==e))))}),[]),B=i((()=>{const e={label:"Cancel",onClick:M,variant:"secondary",tone:"neutral",id:"asset-manager-cancel"},a={library:[e,{label:"Select",onClick:S,variant:"primary",disabled:0===C.size,id:"asset-manager-select"}],upload:[e,{label:"Save",onClick:z,disabled:0===j.length||w.isPending,variant:"primary",id:"asset-manager-upload"}]};return a[x]??a.library}),[x,C.size,j.length,w.isPending,M,S,z]);return a(m,{actions:B,onClose:M,open:n,size:"large",title:"library"===x?"Select Images":"Upload Images",children:[e(g,{children:a(d,{fdKey:"asset-manager-tabs",onChange:(e,a)=>I(a),value:x,children:[e(s,{label:"Upload",value:"upload"}),e(s,{label:"Library",value:"library"})]})}),"library"===x?e(u,{brandId:y,enabled:n,onAssetClick:U,orgId:p,selectedAssets:C}):e(f,{files:j,onRemove:T,onUpload:A})]})},C=a=>e(p,{client:y,children:e(h,{...a})});export{C as default};
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/organisms/AssetManager/index.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport Tab from '@fd/components/atoms/Tab';\nimport Modal, { type ModalAction } from '@fd/components/molecules/Modal';\nimport Tabs from '@fd/components/molecules/Tabs';\nimport { QueryClient, QueryClientProvider } from '@tanstack/react-query';\n\nimport type { FileUploadState } from '../FileUpload';\nimport LibraryTabContent from './LibraryTabContent';\nimport type { Asset } from './types';\nimport UploadAssetContent from './UploadTabContent';\n\nconst StyledTabsContainer = styled(Box)(({ theme }) => ({\n  marginBottom: theme.spacing(3),\n}));\n\n/**\n * Props for the AssetManager component.\n * Provides a modal interface for selecting images from a grid display.\n * It supports both single and multiple image selection modes with configurable limits.\n *\n * import AssetManager from '@flipdish/portal-library/components/organisms/AssetManager';\n *\n * ```tsx\n * import AssetManager from '@flipdish/portal-library/components/organisms/AssetManager';\n */\nexport interface AssetManagerProps {\n  /** Whether the asset manager modal is open */\n  open: boolean;\n  /** Callback function when the modal is closed or cancelled */\n  onClose: () => void;\n  /** Callback function when assets are selected */\n  onSelect?: (selectedAssets: Asset[]) => void;\n  /**\n   * Organization ID for fetching assets\n   */\n  orgId: string;\n  /** Brand ID for fetching assets */\n  brandId?: string;\n  /** Maximum number of assets that can be selected. Defaults to 1 */\n  maxSelect?: number;\n}\n\n// Create a QueryClient instance for the AssetManager component\n// This allows the component to be used without requiring clients to wrap it in QueryClientProvider\nconst queryClient = new QueryClient();\n\n/**\n * AssetManager component used to select assets from the library or upload new assets.\n * Can manage assets at a organization or brand level.\n *\n * @example\n * ```tsx\n * <AssetManager\n *   open={isOpen}\n *   onClose={() => setIsOpen(false)}\n *   onSelect={(assets) => console.log(assets)}\n *   orgId=\"org123\"\n *   brandId=\"brand456\"\n *   maxSelect={3}\n * />\n * ```\n */\nconst AssetManager: React.FC<AssetManagerProps> = ({\n  open,\n  onClose,\n  onSelect,\n  orgId,\n  brandId,\n  maxSelect = 1,\n}) => {\n  // Use Map for O(1) lookup performance and direct access to Asset objects\n  const [selectedAssetsMap, setSelectedAssetsMap] = useState<Map<string, Asset>>(new Map());\n  const [selectedTab, setSelectedTab] = useState<string>('library');\n  const [uploadedFiles, setUploadedFiles] = useState<FileUploadState[]>([]);\n\n  // Reset selection when modal opens/closes\n  useEffect(() => {\n    if (!open) {\n      setSelectedAssetsMap(new Map());\n      setUploadedFiles([]);\n    }\n  }, [open]);\n\n  const handleCancel = useCallback((): void => {\n    setSelectedAssetsMap(new Map());\n    onClose();\n  }, [onClose]);\n\n  const handleSelect = useCallback((): void => {\n    const selectedAssets = Array.from(selectedAssetsMap.values());\n    if (onSelect && selectedAssets.length > 0) {\n      onSelect(selectedAssets);\n    }\n    setSelectedAssetsMap(new Map());\n    onClose();\n  }, [onSelect, selectedAssetsMap, onClose]);\n\n  // TODO: translate titles\n  const getTitle = (): string => {\n    switch (selectedTab) {\n      case 'library':\n        return 'Select Images';\n      default:\n        return 'Upload Images';\n    }\n  };\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 handleSaveAssets = useCallback((): void => {\n    // TODO: call Upload asset api\n    setUploadedFiles([]);\n    setSelectedTab('library');\n  }, []);\n\n  const handleUpload = useCallback((files: File[]): void => {\n    // Add files with uploading state\n    const newFiles: FileUploadState[] = files.map((file) => ({\n      file,\n    }));\n    setUploadedFiles((prev) => [...prev, ...newFiles]);\n  }, []);\n\n  const handleRemove = useCallback((fileToRemove: File): void => {\n    setUploadedFiles((prev) => prev.filter((fileState) => fileState.file !== fileToRemove));\n  }, []);\n\n  // Tab-specific action button configurations\n  // TODO: translate button labels\n  const actionButtons = useMemo<ModalAction[]>(() => {\n    // Common cancel button configuration\n    const cancelButton: ModalAction = {\n      label: 'Cancel',\n      onClick: handleCancel,\n      variant: 'secondary',\n      tone: 'neutral',\n      id: 'asset-manager-cancel',\n    };\n\n    const tabActions: Record<string, ModalAction[]> = {\n      library: [\n        cancelButton,\n        {\n          label: 'Select',\n          onClick: handleSelect,\n          variant: 'primary',\n          disabled: selectedAssetsMap.size === 0,\n          id: 'asset-manager-select',\n        },\n      ],\n      upload: [\n        cancelButton,\n        {\n          label: 'Save',\n          onClick: handleSaveAssets,\n          disabled: uploadedFiles.length === 0,\n          variant: 'primary',\n          id: 'asset-manager-upload',\n        },\n      ],\n    };\n\n    return tabActions[selectedTab] ?? (tabActions['library'] as ModalAction[]);\n  }, [\n    selectedTab,\n    selectedAssetsMap.size,\n    uploadedFiles.length,\n    handleCancel,\n    handleSelect,\n    handleSaveAssets,\n  ]);\n\n  return (\n    <QueryClientProvider client={queryClient}>\n      <Modal actions={actionButtons} onClose={handleCancel} open={open} size=\"large\" title={getTitle()}>\n        <StyledTabsContainer>\n          <Tabs\n            fdKey=\"asset-manager-tabs\"\n            onChange={(_, value: string) => setSelectedTab(value)}\n            value={selectedTab}\n          >\n            <Tab label=\"Upload\" value=\"upload\" />\n            <Tab label=\"Library\" value=\"library\" />\n          </Tabs>\n        </StyledTabsContainer>\n        {selectedTab === 'library' ? (\n          <LibraryTabContent\n            brandId={brandId}\n            enabled={open}\n            onAssetClick={handleAssetClick}\n            orgId={orgId}\n            selectedAssets={selectedAssetsMap}\n          />\n        ) : (\n          <UploadAssetContent files={uploadedFiles} onRemove={handleRemove} onUpload={handleUpload} />\n        )}\n      </Modal>\n    </QueryClientProvider>\n  );\n};\n\nexport default AssetManager;\n"],"names":["StyledTabsContainer","styled","Box","theme","marginBottom","spacing","queryClient","QueryClient","AssetManager","open","onClose","onSelect","orgId","brandId","maxSelect","selectedAssetsMap","setSelectedAssetsMap","useState","Map","selectedTab","setSelectedTab","uploadedFiles","setUploadedFiles","useEffect","handleCancel","useCallback","handleSelect","selectedAssets","Array","from","values","length","handleAssetClick","asset","prevMap","isSelected","has","id","newMap","delete","clear","set","size","handleSaveAssets","handleUpload","files","newFiles","map","file","prev","handleRemove","fileToRemove","filter","fileState","actionButtons","useMemo","cancelButton","label","onClick","variant","tone","tabActions","library","disabled","upload","_jsx","QueryClientProvider","client","children","_jsxs","Modal","actions","title","Tabs","fdKey","onChange","_","value","Tab","LibraryTabContent","enabled","onAssetClick","UploadAssetContent","onRemove","onUpload"],"mappings":"+eAeA,MAAMA,EAAsBC,EAAOC,EAAPD,EAAY,EAAGE,YAAO,CAChDC,aAAcD,EAAME,QAAQ,OAgCxBC,EAAc,IAAIC,EAkBlBC,EAA4C,EAChDC,OACAC,UACAC,WACAC,QACAC,UACAC,YAAY,MAGZ,MAAOC,EAAmBC,GAAwBC,EAA6B,IAAIC,MAC5EC,EAAaC,GAAkBH,EAAiB,YAChDI,EAAeC,GAAoBL,EAA4B,IAGtEM,GAAU,KACHd,IACHO,EAAqB,IAAIE,KACzBI,EAAiB,OAElB,CAACb,IAEJ,MAAMe,EAAeC,GAAY,KAC/BT,EAAqB,IAAIE,KACzBR,MACC,CAACA,IAEEgB,EAAeD,GAAY,KAC/B,MAAME,EAAiBC,MAAMC,KAAKd,EAAkBe,UAChDnB,GAAYgB,EAAeI,OAAS,GACtCpB,EAASgB,GAEXX,EAAqB,IAAIE,KACzBR,MACC,CAACC,EAAUI,EAAmBL,IAY3BsB,EAAmBP,GACtBQ,IACCjB,GAAsBkB,IACpB,MAAMC,EAAaD,EAAQE,IAAIH,EAAMI,IAC/BC,EAAS,IAAIpB,IAAIgB,GAcvB,OAZIC,EAEFG,EAAOC,OAAON,EAAMI,IACG,IAAdvB,GAETwB,EAAOE,QACPF,EAAOG,IAAIR,EAAMI,GAAIJ,IACZK,EAAOI,KAAO5B,GAEvBwB,EAAOG,IAAIR,EAAMI,GAAIJ,GAGhBK,OAGX,CAACxB,IAGG6B,EAAmBlB,GAAY,KAEnCH,EAAiB,IACjBF,EAAe,aACd,IAEGwB,EAAenB,GAAaoB,IAEhC,MAAMC,EAA8BD,EAAME,KAAKC,IAAI,CACjDA,WAEF1B,GAAkB2B,GAAS,IAAIA,KAASH,OACvC,IAEGI,EAAezB,GAAa0B,IAChC7B,GAAkB2B,GAASA,EAAKG,QAAQC,GAAcA,EAAUL,OAASG,QACxE,IAIGG,EAAgBC,GAAuB,KAE3C,MAAMC,EAA4B,CAChCC,MAAO,SACPC,QAASlC,EACTmC,QAAS,YACTC,KAAM,UACNvB,GAAI,wBAGAwB,EAA4C,CAChDC,QAAS,CACPN,EACA,CACEC,MAAO,SACPC,QAAShC,EACTiC,QAAS,UACTI,SAAqC,IAA3BhD,EAAkB2B,KAC5BL,GAAI,yBAGR2B,OAAQ,CACNR,EACA,CACEC,MAAO,OACPC,QAASf,EACToB,SAAmC,IAAzB1C,EAAcU,OACxB4B,QAAS,UACTtB,GAAI,0BAKV,OAAOwB,EAAW1C,IAAiB0C,EAAoB,UACtD,CACD1C,EACAJ,EAAkB2B,KAClBrB,EAAcU,OACdP,EACAE,EACAiB,IAGF,OACEsB,EAACC,EAAmB,CAACC,OAAQ7D,EAAW8D,SACtCC,EAACC,EAAK,CAACC,QAASjB,EAAe5C,QAASc,EAAcf,KAAMA,EAAMiC,KAAK,QAAQ8B,MAhG1E,YADCrD,EAEG,gBAEA,0BA8FP8C,EAACjE,EAAmB,CAAAoE,SAClBC,EAACI,EAAI,CACHC,MAAM,qBACNC,SAAU,CAACC,EAAGC,IAAkBzD,EAAeyD,GAC/CA,MAAO1D,EAAWiD,SAAA,CAElBH,EAACa,EAAG,CAACrB,MAAM,SAASoB,MAAM,WAC1BZ,EAACa,EAAG,CAACrB,MAAM,UAAUoB,MAAM,iBAGd,YAAhB1D,EACC8C,EAACc,EAAiB,CAChBlE,QAASA,EACTmE,QAASvE,EACTwE,aAAcjD,EACdpB,MAAOA,EACPe,eAAgBZ,IAGlBkD,EAACiB,EAAkB,CAACrC,MAAOxB,EAAe8D,SAAUjC,EAAckC,SAAUxC"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/organisms/AssetManager/index.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport Tab from '@fd/components/atoms/Tab';\nimport Modal, { type ModalAction } from '@fd/components/molecules/Modal';\nimport Tabs from '@fd/components/molecules/Tabs';\nimport { QueryClient, QueryClientProvider } from '@tanstack/react-query';\n\nimport type { FileUploadState } from '../FileUpload';\nimport { useUploadAsset } from './hooks/useUploadAsset';\nimport LibraryTabContent from './LibraryTabContent';\nimport type { Asset } from './types';\nimport UploadAssetContent from './UploadTabContent';\n\nconst StyledTabsContainer = styled(Box)(({ theme }) => ({\n  marginBottom: theme.spacing(3),\n}));\n\n/**\n * Props for the AssetManager component.\n * Provides a modal interface for selecting images from a grid display.\n * It supports both single and multiple image selection modes with configurable limits.\n *\n * import AssetManager from '@flipdish/portal-library/components/organisms/AssetManager';\n *\n * ```tsx\n * import AssetManager from '@flipdish/portal-library/components/organisms/AssetManager';\n */\nexport interface AssetManagerProps {\n  /** Whether the asset manager modal is open */\n  open: boolean;\n  /** Callback function when the modal is closed or cancelled */\n  onClose: () => void;\n  /** Callback function when assets are selected */\n  onSelect?: (selectedAssets: Asset[]) => void;\n  /**\n   * Organization ID for fetching assets\n   */\n  orgId: string;\n  /** Brand ID for fetching assets */\n  brandId?: string;\n  /** Maximum number of assets that can be selected. Defaults to 1 */\n  maxSelect?: number;\n}\n\n// Create a QueryClient instance for the AssetManager component\n// This allows the component to be used without requiring clients to wrap it in QueryClientProvider\nconst queryClient = new QueryClient();\n\n/**\n * Inner component that contains the AssetManager logic.\n * Must be rendered inside QueryClientProvider to use React Query hooks.\n */\nconst AssetManagerContent: React.FC<AssetManagerProps> = ({\n  open,\n  onClose,\n  onSelect,\n  orgId,\n  brandId,\n  maxSelect = 1,\n}) => {\n  // Use Map for O(1) lookup performance and direct access to Asset objects\n  const [selectedAssetsMap, setSelectedAssetsMap] = useState<Map<string, Asset>>(new Map());\n  const [selectedTab, setSelectedTab] = useState<string>('library');\n  const [uploadedFiles, setUploadedFiles] = useState<FileUploadState[]>([]);\n  const uploadMutation = useUploadAsset();\n\n  // Reset selection when modal opens/closes\n  useEffect(() => {\n    if (!open) {\n      setSelectedAssetsMap(new Map());\n      setUploadedFiles([]);\n    }\n  }, [open]);\n\n  const handleCancel = useCallback((): void => {\n    setSelectedAssetsMap(new Map());\n    onClose();\n  }, [onClose]);\n\n  const handleSelect = useCallback((): void => {\n    const selectedAssets = Array.from(selectedAssetsMap.values());\n    if (onSelect && selectedAssets.length > 0) {\n      onSelect(selectedAssets);\n    }\n    setSelectedAssetsMap(new Map());\n    onClose();\n  }, [onSelect, selectedAssetsMap, onClose]);\n\n  // TODO: translate titles\n  const getTitle = (): string => {\n    switch (selectedTab) {\n      case 'library':\n        return 'Select Images';\n      default:\n        return 'Upload Images';\n    }\n  };\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 handleSaveAssets = useCallback((): void => {\n    uploadMutation.mutate(\n      {\n        orgId,\n        brandId,\n        files: uploadedFiles.map((file) => file.file),\n      },\n      {\n        onSuccess: () => {\n          // Clear uploaded files and switch to library tab\n          setUploadedFiles([]);\n          setSelectedTab('library');\n        },\n        onError: (error) => {\n          console.error('Upload failed:', error);\n          // Error handling - you could add a snackbar notification here\n        },\n      },\n    );\n  }, [orgId, brandId, uploadedFiles, uploadMutation]);\n\n  const handleUpload = useCallback((files: File[]): void => {\n    // Add files with uploading state\n    const newFiles: FileUploadState[] = files.map((file) => ({\n      file,\n    }));\n    setUploadedFiles((prev) => [...prev, ...newFiles]);\n  }, []);\n\n  const handleRemove = useCallback((fileToRemove: File): void => {\n    setUploadedFiles((prev) => prev.filter((fileState) => fileState.file !== fileToRemove));\n  }, []);\n\n  // Tab-specific action button configurations\n  // TODO: translate button labels\n  const actionButtons = useMemo<ModalAction[]>(() => {\n    // Common cancel button configuration\n    const cancelButton: ModalAction = {\n      label: 'Cancel',\n      onClick: handleCancel,\n      variant: 'secondary',\n      tone: 'neutral',\n      id: 'asset-manager-cancel',\n    };\n\n    const tabActions: Record<string, ModalAction[]> = {\n      library: [\n        cancelButton,\n        {\n          label: 'Select',\n          onClick: handleSelect,\n          variant: 'primary',\n          disabled: selectedAssetsMap.size === 0,\n          id: 'asset-manager-select',\n        },\n      ],\n      upload: [\n        cancelButton,\n        {\n          label: 'Save',\n          onClick: handleSaveAssets,\n          disabled: uploadedFiles.length === 0 || uploadMutation.isPending,\n          variant: 'primary',\n          id: 'asset-manager-upload',\n        },\n      ],\n    };\n\n    return tabActions[selectedTab] ?? (tabActions['library'] as ModalAction[]);\n  }, [\n    selectedTab,\n    selectedAssetsMap.size,\n    uploadedFiles.length,\n    uploadMutation.isPending,\n    handleCancel,\n    handleSelect,\n    handleSaveAssets,\n  ]);\n\n  return (\n    <Modal actions={actionButtons} onClose={handleCancel} open={open} size=\"large\" title={getTitle()}>\n      <StyledTabsContainer>\n        <Tabs\n          fdKey=\"asset-manager-tabs\"\n          onChange={(_, value: string) => setSelectedTab(value)}\n          value={selectedTab}\n        >\n          <Tab label=\"Upload\" value=\"upload\" />\n          <Tab label=\"Library\" value=\"library\" />\n        </Tabs>\n      </StyledTabsContainer>\n      {selectedTab === 'library' ? (\n        <LibraryTabContent\n          brandId={brandId}\n          enabled={open}\n          onAssetClick={handleAssetClick}\n          orgId={orgId}\n          selectedAssets={selectedAssetsMap}\n        />\n      ) : (\n        <UploadAssetContent files={uploadedFiles} onRemove={handleRemove} onUpload={handleUpload} />\n      )}\n    </Modal>\n  );\n};\n\n/**\n * AssetManager component used to select assets from the library or upload new assets.\n * Can manage assets at a organization or brand level.\n *\n * @example\n * ```tsx\n * <AssetManager\n *   open={isOpen}\n *   onClose={() => setIsOpen(false)}\n *   onSelect={(assets) => console.log(assets)}\n *   orgId=\"org123\"\n *   brandId=\"brand456\"\n *   maxSelect={3}\n * />\n * ```\n */\nconst AssetManager: React.FC<AssetManagerProps> = (props) => {\n  return (\n    <QueryClientProvider client={queryClient}>\n      <AssetManagerContent {...props} />\n    </QueryClientProvider>\n  );\n};\n\nexport default AssetManager;\n"],"names":["StyledTabsContainer","styled","Box","theme","marginBottom","spacing","queryClient","QueryClient","AssetManagerContent","open","onClose","onSelect","orgId","brandId","maxSelect","selectedAssetsMap","setSelectedAssetsMap","useState","Map","selectedTab","setSelectedTab","uploadedFiles","setUploadedFiles","uploadMutation","useUploadAsset","useEffect","handleCancel","useCallback","handleSelect","selectedAssets","Array","from","values","length","handleAssetClick","asset","prevMap","isSelected","has","id","newMap","delete","clear","set","size","handleSaveAssets","mutate","files","map","file","onSuccess","onError","error","console","handleUpload","newFiles","prev","handleRemove","fileToRemove","filter","fileState","actionButtons","useMemo","cancelButton","label","onClick","variant","tone","tabActions","library","disabled","upload","isPending","_jsxs","Modal","actions","title","children","_jsx","Tabs","fdKey","onChange","_","value","Tab","LibraryTabContent","enabled","onAssetClick","UploadAssetContent","onRemove","onUpload","AssetManager","props","QueryClientProvider","client"],"mappings":"0iBAgBA,MAAMA,EAAsBC,EAAOC,EAAPD,EAAY,EAAGE,YAAO,CAChDC,aAAcD,EAAME,QAAQ,OAgCxBC,EAAc,IAAIC,EAMlBC,EAAmD,EACvDC,OACAC,UACAC,WACAC,QACAC,UACAC,YAAY,MAGZ,MAAOC,EAAmBC,GAAwBC,EAA6B,IAAIC,MAC5EC,EAAaC,GAAkBH,EAAiB,YAChDI,EAAeC,GAAoBL,EAA4B,IAChEM,EAAiBC,IAGvBC,GAAU,KACHhB,IACHO,EAAqB,IAAIE,KACzBI,EAAiB,OAElB,CAACb,IAEJ,MAAMiB,EAAeC,GAAY,KAC/BX,EAAqB,IAAIE,KACzBR,MACC,CAACA,IAEEkB,EAAeD,GAAY,KAC/B,MAAME,EAAiBC,MAAMC,KAAKhB,EAAkBiB,UAChDrB,GAAYkB,EAAeI,OAAS,GACtCtB,EAASkB,GAEXb,EAAqB,IAAIE,KACzBR,MACC,CAACC,EAAUI,EAAmBL,IAY3BwB,EAAmBP,GACtBQ,IACCnB,GAAsBoB,IACpB,MAAMC,EAAaD,EAAQE,IAAIH,EAAMI,IAC/BC,EAAS,IAAItB,IAAIkB,GAcvB,OAZIC,EAEFG,EAAOC,OAAON,EAAMI,IACG,IAAdzB,GAET0B,EAAOE,QACPF,EAAOG,IAAIR,EAAMI,GAAIJ,IACZK,EAAOI,KAAO9B,GAEvB0B,EAAOG,IAAIR,EAAMI,GAAIJ,GAGhBK,OAGX,CAAC1B,IAGG+B,EAAmBlB,GAAY,KACnCJ,EAAeuB,OACb,CACElC,QACAC,UACAkC,MAAO1B,EAAc2B,KAAKC,GAASA,EAAKA,QAE1C,CACEC,UAAW,KAET5B,EAAiB,IACjBF,EAAe,YAEjB+B,QAAUC,IACRC,QAAQD,MAAM,iBAAkBA,QAKrC,CAACxC,EAAOC,EAASQ,EAAeE,IAE7B+B,EAAe3B,GAAaoB,IAEhC,MAAMQ,EAA8BR,EAAMC,KAAKC,IAAI,CACjDA,WAEF3B,GAAkBkC,GAAS,IAAIA,KAASD,OACvC,IAEGE,EAAe9B,GAAa+B,IAChCpC,GAAkBkC,GAASA,EAAKG,QAAQC,GAAcA,EAAUX,OAASS,QACxE,IAIGG,EAAgBC,GAAuB,KAE3C,MAAMC,EAA4B,CAChCC,MAAO,SACPC,QAASvC,EACTwC,QAAS,YACTC,KAAM,UACN5B,GAAI,wBAGA6B,EAA4C,CAChDC,QAAS,CACPN,EACA,CACEC,MAAO,SACPC,QAASrC,EACTsC,QAAS,UACTI,SAAqC,IAA3BvD,EAAkB6B,KAC5BL,GAAI,yBAGRgC,OAAQ,CACNR,EACA,CACEC,MAAO,OACPC,QAASpB,EACTyB,SAAmC,IAAzBjD,EAAcY,QAAgBV,EAAeiD,UACvDN,QAAS,UACT3B,GAAI,0BAKV,OAAO6B,EAAWjD,IAAiBiD,EAAoB,UACtD,CACDjD,EACAJ,EAAkB6B,KAClBvB,EAAcY,OACdV,EAAeiD,UACf9C,EACAE,EACAiB,IAGF,OACE4B,EAACC,EAAK,CAACC,QAASd,EAAenD,QAASgB,EAAcjB,KAAMA,EAAMmC,KAAK,QAAQgC,MA/GxE,YADCzD,EAEG,gBAEA,gBA4GqF0D,SAAA,CAC9FC,EAAC9E,EAAmB,CAAA6E,SAClBJ,EAACM,EAAI,CACHC,MAAM,qBACNC,SAAU,CAACC,EAAGC,IAAkB/D,EAAe+D,GAC/CA,MAAOhE,EAAW0D,SAAA,CAElBC,EAACM,EAAG,CAACpB,MAAM,SAASmB,MAAM,WAC1BL,EAACM,EAAG,CAACpB,MAAM,UAAUmB,MAAM,iBAGd,YAAhBhE,EACC2D,EAACO,EAAiB,CAChBxE,QAASA,EACTyE,QAAS7E,EACT8E,aAAcrD,EACdtB,MAAOA,EACPiB,eAAgBd,IAGlB+D,EAACU,EAAkB,CAACzC,MAAO1B,EAAeoE,SAAUhC,EAAciC,SAAUpC,QAsB9EqC,EAA6CC,GAE/Cd,EAACe,EAAmB,CAACC,OAAQxF,EAAWuE,SACtCC,EAACtE,EAAmB,IAAKoF"}

package/dist/components/organisms/AssetManager/services/asset.service.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const t=(t,s)=>{if(!t)return;const e=s?`?brandId=${s}`:"";return`${(()=>{const t=window.location?.host?.includes("portal.flipdish.com");return t?"https://asset-management-service.portal.flipdish.com":"https://asset-management-service.portal.flipdishdev.com"})()}/${t}/assets${e}`};exports.getAssets=async(s,e)=>{const r=t(s,e);if(!r)throw new Error("Organization ID is required to fetch assets");const o=await fetch(r,{method:"GET",credentials:"include"});if(!o.ok)throw new Error(`Failed to fetch assets: ${o.statusText}`);return await o.json()},exports.getAssetsKey="getAssets";
+"use strict";const t=()=>{const t=window.location?.host?.includes("portal.flipdish.com");return t?"https://api.portal.flipdish.com/assets":"https://api-prod-staging.portal.flipdishdev.com/assets"};exports.getAssets=async(s,e)=>{const o=((s,e)=>{if(!s)return;const o=e?`?brandId=${e}`:"";return`${t()}/orgs/${s}/assets${o}`})(s,e);if(!o)throw new Error("Organization ID is required to fetch assets");const r=await fetch(o,{method:"GET",credentials:"include"});if(!r.ok)throw new Error(`Failed to fetch assets: ${r.statusText}`);return await r.json()},exports.getAssetsKey="getAssets",exports.uploadAsset=async s=>{const{orgId:e,brandId:o,files:r}=s;if(!e)throw new Error("Organization ID is required to upload assets");if(!r||0===r.length)throw new Error("At least one file is required to upload");const a=`${t()}/orgs/${e}/assets/upload`,i=new FormData;r.forEach((t=>{i.append("files",t)})),o&&i.append("brandId",o);const n=await fetch(a,{method:"POST",credentials:"include",body:i});if(!n.ok)throw new Error(`Failed to upload assets: ${n.statusText}`);return await n.json()},exports.uploadAssetKey="uploadAsset";
 //# sourceMappingURL=asset.service.cjs.js.map

package/dist/components/organisms/AssetManager/services/asset.service.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"asset.service.cjs.js","sources":["../../../../../src/components/organisms/AssetManager/services/asset.service.ts"],"sourcesContent":["import type { Asset } from '../types';\n\nexport const getAssetsKey = 'getAssets';\n\nconst PROD_API_URL = 'https://asset-management-service.portal.flipdish.com';\nconst DEV_STAGING_API_URL = 'https://asset-management-service.portal.flipdishdev.com';\n\n/**\n * Gets the asset management API base URL based on the current environment\n * @returns The appropriate API URL for the current environment\n */\nconst getAssetManagementApiUrl = (): string => {\n  const isProd = window.location?.host?.includes('portal.flipdish.com');\n\n  if (isProd) {\n    return PROD_API_URL;\n  }\n\n  return DEV_STAGING_API_URL;\n};\n\n/**\n * Builds the complete API URL for fetching assets\n * @param orgId - Optional organization ID.\n * @param brandId - Optional brand ID.\n * @returns The complete API URL or undefined if no orgId available\n */\nconst buildApiUrl = (orgId: string, brandId?: string): string | undefined => {\n  if (!orgId) return undefined;\n  const brandIdQueryParam = brandId ? `?brandId=${brandId}` : '';\n  const baseUrl = getAssetManagementApiUrl();\n  return `${baseUrl}/${orgId}/assets${brandIdQueryParam}`;\n};\n\n/**\n * Fetches assets from the asset management service API\n * @param orgId - organization ID.\n * @param brandId - brand ID.\n * @returns Promise resolving to an array of assets\n */\nexport const getAssets = async (orgId: string, brandId?: string): Promise<Asset[]> => {\n  const apiUrl = buildApiUrl(orgId, brandId);\n\n  if (!apiUrl) {\n    throw new Error('Organization ID is required to fetch assets');\n  }\n\n  const response = await fetch(apiUrl, {\n    method: 'GET',\n    credentials: 'include',\n  });\n\n  if (!response.ok) {\n    throw new Error(`Failed to fetch assets: ${response.statusText}`);\n  }\n\n  return (await response.json()) as Asset[];\n};\n"],"names":["buildApiUrl","orgId","brandId","brandIdQueryParam","isProd","window","location","host","includes","getAssetManagementApiUrl","async","apiUrl","Error","response","fetch","method","credentials","ok","statusText","json"],"mappings":"aAEO,MAyBDA,EAAc,CAACC,EAAeC,KAClC,IAAKD,EAAO,OACZ,MAAME,EAAoBD,EAAU,YAAYA,IAAY,GAE5D,MAAO,GApBwB,MAC/B,MAAME,EAASC,OAAOC,UAAUC,MAAMC,SAAS,uBAE/C,OAAIJ,EAVe,uDACO,2DAyBVK,MACKR,WAAeE,uBASbO,MAAOT,EAAeC,KAC7C,MAAMS,EAASX,EAAYC,EAAOC,GAElC,IAAKS,EACH,MAAM,IAAIC,MAAM,+CAGlB,MAAMC,QAAiBC,MAAMH,EAAQ,CACnCI,OAAQ,MACRC,YAAa,YAGf,IAAKH,EAASI,GACZ,MAAM,IAAIL,MAAM,2BAA2BC,EAASK,cAGtD,aAAcL,EAASM,6BAtDG"}
+{"version":3,"file":"asset.service.cjs.js","sources":["../../../../../src/components/organisms/AssetManager/services/asset.service.ts"],"sourcesContent":["import type { AssetResponse, UploadAssetResponse } from '../types';\n\nexport const getAssetsKey = 'getAssets';\nexport const uploadAssetKey = 'uploadAsset';\n\nconst PROD_API_URL = 'https://api.portal.flipdish.com/assets';\nconst DEV_STAGING_API_URL = 'https://api-prod-staging.portal.flipdishdev.com/assets';\n\n/**\n * Gets the asset management API base URL based on the current environment\n * @returns The appropriate API URL for the current environment\n */\nconst getAssetManagementApiUrl = (): string => {\n  const isProd = window.location?.host?.includes('portal.flipdish.com');\n\n  if (isProd) {\n    return PROD_API_URL;\n  }\n\n  return DEV_STAGING_API_URL;\n};\n\n/**\n * Builds the complete API URL for fetching assets\n * @param orgId - Optional organization ID.\n * @param brandId - Optional brand ID.\n * @returns The complete API URL or undefined if no orgId available\n */\nconst buildApiUrl = (orgId: string, brandId?: string): string | undefined => {\n  if (!orgId) return undefined;\n  const brandIdQueryParam = brandId ? `?brandId=${brandId}` : '';\n  const baseUrl = getAssetManagementApiUrl();\n  return `${baseUrl}/orgs/${orgId}/assets${brandIdQueryParam}`;\n};\n\n/**\n * Fetches assets from the asset management service API\n * @param orgId - organization ID.\n * @param brandId - brand ID.\n * @returns Promise resolving to an array of assets\n */\nexport const getAssets = async (orgId: string, brandId?: string): Promise<AssetResponse> => {\n  const apiUrl = buildApiUrl(orgId, brandId);\n\n  if (!apiUrl) {\n    throw new Error('Organization ID is required to fetch assets');\n  }\n\n  const response = await fetch(apiUrl, {\n    method: 'GET',\n    credentials: 'include',\n  });\n\n  if (!response.ok) {\n    throw new Error(`Failed to fetch assets: ${response.statusText}`);\n  }\n\n  return (await response.json()) as AssetResponse;\n};\n\n/**\n * Upload parameters for asset upload\n */\nexport interface UploadAssetParams {\n  /** Organization ID */\n  orgId: string;\n  /** Optional brand ID */\n  brandId?: string;\n  /** The files to upload */\n  files: File[];\n}\n\n/**\n * Uploads multiple assets to the asset management service API\n * @param params - Upload parameters containing orgId, brandId, and files\n * @returns Promise resolving to an array of uploaded assets\n */\nexport const uploadAsset = async (params: UploadAssetParams): Promise<UploadAssetResponse> => {\n  const { orgId, brandId, files } = params;\n\n  if (!orgId) {\n    throw new Error('Organization ID is required to upload assets');\n  }\n\n  if (!files || files.length === 0) {\n    throw new Error('At least one file is required to upload');\n  }\n\n  const baseUrl = getAssetManagementApiUrl();\n  const apiUrl = `${baseUrl}/orgs/${orgId}/assets/upload`;\n\n  const formData = new FormData();\n\n  // Append all files under the 'files' key\n  files.forEach((file) => {\n    formData.append('files', file);\n  });\n\n  if (brandId) {\n    formData.append('brandId', brandId);\n  }\n\n  const response = await fetch(apiUrl, {\n    method: 'POST',\n    credentials: 'include',\n    body: formData,\n  });\n\n  if (!response.ok) {\n    throw new Error(`Failed to upload assets: ${response.statusText}`);\n  }\n\n  return (await response.json()) as UploadAssetResponse;\n};\n"],"names":["getAssetManagementApiUrl","isProd","window","location","host","includes","async","orgId","brandId","apiUrl","brandIdQueryParam","buildApiUrl","Error","response","fetch","method","credentials","ok","statusText","json","params","files","length","formData","FormData","forEach","file","append","body"],"mappings":"aAEO,MAUDA,EAA2B,KAC/B,MAAMC,EAASC,OAAOC,UAAUC,MAAMC,SAAS,uBAE/C,OAAIJ,EAVe,yCACO,4EAmCHK,MAAOC,EAAeC,KAC7C,MAAMC,EAdY,EAACF,EAAeC,KAClC,IAAKD,EAAO,OACZ,MAAMG,EAAoBF,EAAU,YAAYA,IAAY,GAE5D,MAAO,GADSR,YACUO,WAAeG,KAU1BC,CAAYJ,EAAOC,GAElC,IAAKC,EACH,MAAM,IAAIG,MAAM,+CAGlB,MAAMC,QAAiBC,MAAML,EAAQ,CACnCM,OAAQ,MACRC,YAAa,YAGf,IAAKH,EAASI,GACZ,MAAM,IAAIL,MAAM,2BAA2BC,EAASK,cAGtD,aAAcL,EAASM,6BAvDG,gCA2EDb,MAAOc,IAChC,MAAMb,MAAEA,EAAKC,QAAEA,EAAOa,MAAEA,GAAUD,EAElC,IAAKb,EACH,MAAM,IAAIK,MAAM,gDAGlB,IAAKS,GAA0B,IAAjBA,EAAMC,OAClB,MAAM,IAAIV,MAAM,2CAGlB,MACMH,EAAS,GADCT,YACkBO,kBAE5BgB,EAAW,IAAIC,SAGrBH,EAAMI,SAASC,IACbH,EAASI,OAAO,QAASD,MAGvBlB,GACFe,EAASI,OAAO,UAAWnB,GAG7B,MAAMK,QAAiBC,MAAML,EAAQ,CACnCM,OAAQ,OACRC,YAAa,UACbY,KAAML,IAGR,IAAKV,EAASI,GACZ,MAAM,IAAIL,MAAM,4BAA4BC,EAASK,cAGvD,aAAcL,EAASM,+BA7GK"}

package/dist/components/organisms/AssetManager/services/asset.service.d.ts

@@ -1,12 +1,31 @@
-import { Asset } from '../types/index.js';
+import { AssetResponse, UploadAssetResponse } from '../types/index.js';
 
 declare const getAssetsKey = "getAssets";
+declare const uploadAssetKey = "uploadAsset";
 /**
  * Fetches assets from the asset management service API
  * @param orgId - organization ID.
  * @param brandId - brand ID.
  * @returns Promise resolving to an array of assets
  */
-declare const getAssets: (orgId: string, brandId?: string) => Promise<Asset[]>;
+declare const getAssets: (orgId: string, brandId?: string) => Promise<AssetResponse>;
+/**
+ * Upload parameters for asset upload
+ */
+interface UploadAssetParams {
+    /** Organization ID */
+    orgId: string;
+    /** Optional brand ID */
+    brandId?: string;
+    /** The files to upload */
+    files: File[];
+}
+/**
+ * Uploads multiple assets to the asset management service API
+ * @param params - Upload parameters containing orgId, brandId, and files
+ * @returns Promise resolving to an array of uploaded assets
+ */
+declare const uploadAsset: (params: UploadAssetParams) => Promise<UploadAssetResponse>;
 
-export { getAssets, getAssetsKey };
+export { getAssets, getAssetsKey, uploadAsset, uploadAssetKey };
+export type { UploadAssetParams };

package/dist/components/organisms/AssetManager/services/asset.service.js

@@ -1,2 +1,2 @@
-const t="getAssets",s=(t,s)=>{if(!t)return;const e=s?`?brandId=${s}`:"";return`${(()=>{const t=window.location?.host?.includes("portal.flipdish.com");return t?"https://asset-management-service.portal.flipdish.com":"https://asset-management-service.portal.flipdishdev.com"})()}/${t}/assets${e}`},e=async(t,e)=>{const r=s(t,e);if(!r)throw new Error("Organization ID is required to fetch assets");const o=await fetch(r,{method:"GET",credentials:"include"});if(!o.ok)throw new Error(`Failed to fetch assets: ${o.statusText}`);return await o.json()};export{e as getAssets,t as getAssetsKey};
+const t="getAssets",s="uploadAsset",e=()=>{const t=window.location?.host?.includes("portal.flipdish.com");return t?"https://api.portal.flipdish.com/assets":"https://api-prod-staging.portal.flipdishdev.com/assets"},o=async(t,s)=>{const o=((t,s)=>{if(!t)return;const o=s?`?brandId=${s}`:"";return`${e()}/orgs/${t}/assets${o}`})(t,s);if(!o)throw new Error("Organization ID is required to fetch assets");const r=await fetch(o,{method:"GET",credentials:"include"});if(!r.ok)throw new Error(`Failed to fetch assets: ${r.statusText}`);return await r.json()},r=async t=>{const{orgId:s,brandId:o,files:r}=t;if(!s)throw new Error("Organization ID is required to upload assets");if(!r||0===r.length)throw new Error("At least one file is required to upload");const a=`${e()}/orgs/${s}/assets/upload`,n=new FormData;r.forEach((t=>{n.append("files",t)})),o&&n.append("brandId",o);const i=await fetch(a,{method:"POST",credentials:"include",body:n});if(!i.ok)throw new Error(`Failed to upload assets: ${i.statusText}`);return await i.json()};export{o as getAssets,t as getAssetsKey,r as uploadAsset,s as uploadAssetKey};
 //# sourceMappingURL=asset.service.js.map

package/dist/components/organisms/AssetManager/services/asset.service.js.map

@@ -1 +1 @@
-{"version":3,"file":"asset.service.js","sources":["../../../../../src/components/organisms/AssetManager/services/asset.service.ts"],"sourcesContent":["import type { Asset } from '../types';\n\nexport const getAssetsKey = 'getAssets';\n\nconst PROD_API_URL = 'https://asset-management-service.portal.flipdish.com';\nconst DEV_STAGING_API_URL = 'https://asset-management-service.portal.flipdishdev.com';\n\n/**\n * Gets the asset management API base URL based on the current environment\n * @returns The appropriate API URL for the current environment\n */\nconst getAssetManagementApiUrl = (): string => {\n  const isProd = window.location?.host?.includes('portal.flipdish.com');\n\n  if (isProd) {\n    return PROD_API_URL;\n  }\n\n  return DEV_STAGING_API_URL;\n};\n\n/**\n * Builds the complete API URL for fetching assets\n * @param orgId - Optional organization ID.\n * @param brandId - Optional brand ID.\n * @returns The complete API URL or undefined if no orgId available\n */\nconst buildApiUrl = (orgId: string, brandId?: string): string | undefined => {\n  if (!orgId) return undefined;\n  const brandIdQueryParam = brandId ? `?brandId=${brandId}` : '';\n  const baseUrl = getAssetManagementApiUrl();\n  return `${baseUrl}/${orgId}/assets${brandIdQueryParam}`;\n};\n\n/**\n * Fetches assets from the asset management service API\n * @param orgId - organization ID.\n * @param brandId - brand ID.\n * @returns Promise resolving to an array of assets\n */\nexport const getAssets = async (orgId: string, brandId?: string): Promise<Asset[]> => {\n  const apiUrl = buildApiUrl(orgId, brandId);\n\n  if (!apiUrl) {\n    throw new Error('Organization ID is required to fetch assets');\n  }\n\n  const response = await fetch(apiUrl, {\n    method: 'GET',\n    credentials: 'include',\n  });\n\n  if (!response.ok) {\n    throw new Error(`Failed to fetch assets: ${response.statusText}`);\n  }\n\n  return (await response.json()) as Asset[];\n};\n"],"names":["getAssetsKey","buildApiUrl","orgId","brandId","brandIdQueryParam","isProd","window","location","host","includes","getAssetManagementApiUrl","getAssets","async","apiUrl","Error","response","fetch","method","credentials","ok","statusText","json"],"mappings":"AAEO,MAAMA,EAAe,YAyBtBC,EAAc,CAACC,EAAeC,KAClC,IAAKD,EAAO,OACZ,MAAME,EAAoBD,EAAU,YAAYA,IAAY,GAE5D,MAAO,GApBwB,MAC/B,MAAME,EAASC,OAAOC,UAAUC,MAAMC,SAAS,uBAE/C,OAAIJ,EAVe,uDACO,2DAyBVK,MACKR,WAAeE,KASzBO,EAAYC,MAAOV,EAAeC,KAC7C,MAAMU,EAASZ,EAAYC,EAAOC,GAElC,IAAKU,EACH,MAAM,IAAIC,MAAM,+CAGlB,MAAMC,QAAiBC,MAAMH,EAAQ,CACnCI,OAAQ,MACRC,YAAa,YAGf,IAAKH,EAASI,GACZ,MAAM,IAAIL,MAAM,2BAA2BC,EAASK,cAGtD,aAAcL,EAASM"}
+{"version":3,"file":"asset.service.js","sources":["../../../../../src/components/organisms/AssetManager/services/asset.service.ts"],"sourcesContent":["import type { AssetResponse, UploadAssetResponse } from '../types';\n\nexport const getAssetsKey = 'getAssets';\nexport const uploadAssetKey = 'uploadAsset';\n\nconst PROD_API_URL = 'https://api.portal.flipdish.com/assets';\nconst DEV_STAGING_API_URL = 'https://api-prod-staging.portal.flipdishdev.com/assets';\n\n/**\n * Gets the asset management API base URL based on the current environment\n * @returns The appropriate API URL for the current environment\n */\nconst getAssetManagementApiUrl = (): string => {\n  const isProd = window.location?.host?.includes('portal.flipdish.com');\n\n  if (isProd) {\n    return PROD_API_URL;\n  }\n\n  return DEV_STAGING_API_URL;\n};\n\n/**\n * Builds the complete API URL for fetching assets\n * @param orgId - Optional organization ID.\n * @param brandId - Optional brand ID.\n * @returns The complete API URL or undefined if no orgId available\n */\nconst buildApiUrl = (orgId: string, brandId?: string): string | undefined => {\n  if (!orgId) return undefined;\n  const brandIdQueryParam = brandId ? `?brandId=${brandId}` : '';\n  const baseUrl = getAssetManagementApiUrl();\n  return `${baseUrl}/orgs/${orgId}/assets${brandIdQueryParam}`;\n};\n\n/**\n * Fetches assets from the asset management service API\n * @param orgId - organization ID.\n * @param brandId - brand ID.\n * @returns Promise resolving to an array of assets\n */\nexport const getAssets = async (orgId: string, brandId?: string): Promise<AssetResponse> => {\n  const apiUrl = buildApiUrl(orgId, brandId);\n\n  if (!apiUrl) {\n    throw new Error('Organization ID is required to fetch assets');\n  }\n\n  const response = await fetch(apiUrl, {\n    method: 'GET',\n    credentials: 'include',\n  });\n\n  if (!response.ok) {\n    throw new Error(`Failed to fetch assets: ${response.statusText}`);\n  }\n\n  return (await response.json()) as AssetResponse;\n};\n\n/**\n * Upload parameters for asset upload\n */\nexport interface UploadAssetParams {\n  /** Organization ID */\n  orgId: string;\n  /** Optional brand ID */\n  brandId?: string;\n  /** The files to upload */\n  files: File[];\n}\n\n/**\n * Uploads multiple assets to the asset management service API\n * @param params - Upload parameters containing orgId, brandId, and files\n * @returns Promise resolving to an array of uploaded assets\n */\nexport const uploadAsset = async (params: UploadAssetParams): Promise<UploadAssetResponse> => {\n  const { orgId, brandId, files } = params;\n\n  if (!orgId) {\n    throw new Error('Organization ID is required to upload assets');\n  }\n\n  if (!files || files.length === 0) {\n    throw new Error('At least one file is required to upload');\n  }\n\n  const baseUrl = getAssetManagementApiUrl();\n  const apiUrl = `${baseUrl}/orgs/${orgId}/assets/upload`;\n\n  const formData = new FormData();\n\n  // Append all files under the 'files' key\n  files.forEach((file) => {\n    formData.append('files', file);\n  });\n\n  if (brandId) {\n    formData.append('brandId', brandId);\n  }\n\n  const response = await fetch(apiUrl, {\n    method: 'POST',\n    credentials: 'include',\n    body: formData,\n  });\n\n  if (!response.ok) {\n    throw new Error(`Failed to upload assets: ${response.statusText}`);\n  }\n\n  return (await response.json()) as UploadAssetResponse;\n};\n"],"names":["getAssetsKey","uploadAssetKey","getAssetManagementApiUrl","isProd","window","location","host","includes","getAssets","async","orgId","brandId","apiUrl","brandIdQueryParam","buildApiUrl","Error","response","fetch","method","credentials","ok","statusText","json","uploadAsset","params","files","length","formData","FormData","forEach","file","append","body"],"mappings":"AAEO,MAAMA,EAAe,YACfC,EAAiB,cASxBC,EAA2B,KAC/B,MAAMC,EAASC,OAAOC,UAAUC,MAAMC,SAAS,uBAE/C,OAAIJ,EAVe,yCACO,0DAmCfK,EAAYC,MAAOC,EAAeC,KAC7C,MAAMC,EAdY,EAACF,EAAeC,KAClC,IAAKD,EAAO,OACZ,MAAMG,EAAoBF,EAAU,YAAYA,IAAY,GAE5D,MAAO,GADST,YACUQ,WAAeG,KAU1BC,CAAYJ,EAAOC,GAElC,IAAKC,EACH,MAAM,IAAIG,MAAM,+CAGlB,MAAMC,QAAiBC,MAAML,EAAQ,CACnCM,OAAQ,MACRC,YAAa,YAGf,IAAKH,EAASI,GACZ,MAAM,IAAIL,MAAM,2BAA2BC,EAASK,cAGtD,aAAcL,EAASM,QAoBZC,EAAcd,MAAOe,IAChC,MAAMd,MAAEA,EAAKC,QAAEA,EAAOc,MAAEA,GAAUD,EAElC,IAAKd,EACH,MAAM,IAAIK,MAAM,gDAGlB,IAAKU,GAA0B,IAAjBA,EAAMC,OAClB,MAAM,IAAIX,MAAM,2CAGlB,MACMH,EAAS,GADCV,YACkBQ,kBAE5BiB,EAAW,IAAIC,SAGrBH,EAAMI,SAASC,IACbH,EAASI,OAAO,QAASD,MAGvBnB,GACFgB,EAASI,OAAO,UAAWpB,GAG7B,MAAMK,QAAiBC,MAAML,EAAQ,CACnCM,OAAQ,OACRC,YAAa,UACba,KAAML,IAGR,IAAKX,EAASI,GACZ,MAAM,IAAIL,MAAM,4BAA4BC,EAASK,cAGvD,aAAcL,EAASM"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../../../src/components/organisms/AssetManager/types/index.ts"],"sourcesContent":["export enum AssetType {\n  VIDEO = 'VIDEO',\n  IMAGE = 'IMAGE',\n}\n\nexport interface AssetMetadata {\n  altText?: string;\n  tags: string[];\n  dimensions?: {\n    width: number;\n    height: number;\n  };\n}\n\nexport interface Asset {\n  id: string;\n  fileName: string;\n  contentType: string; // MIME type like \"image/jpeg\", \"video/mp4\"\n  createdBy: string;\n  updatedBy: string;\n  updatedAt: string;\n  uploadedAt: string;\n  url: string;\n  orgId: string;\n  brandId: string | null;\n  type: AssetType;\n  metadata: AssetMetadata;\n}\n"],"names":["AssetType"],"mappings":"aAAA,IAAYA,EAAAA,QAAAA,eAAAA,GAAAA,EAAAA,QAAAA,YAAAA,kBAAS,CAAA,IACnB,MAAA,QACAA,EAAA,MAAA"}
+{"version":3,"file":"index.cjs.js","sources":["../../../../../src/components/organisms/AssetManager/types/index.ts"],"sourcesContent":["export enum AssetType {\n  VIDEO = 'VIDEO',\n  IMAGE = 'IMAGE',\n}\n\nexport interface AssetMetadata {\n  altText?: string;\n  tags: string[];\n  dimensions?: {\n    width: number;\n    height: number;\n  };\n}\n\nexport interface Asset {\n  id: string;\n  fileName: string;\n  contentType: string; // MIME type like \"image/jpeg\", \"video/mp4\"\n  createdBy: string;\n  updatedBy: string;\n  updatedAt: string;\n  uploadedAt: string;\n  url: string;\n  orgId: string;\n  brandId: string | null;\n  type: AssetType;\n  metadata: AssetMetadata;\n}\n\nexport interface AssetResponse {\n  data: Asset[];\n}\n\nexport interface UploadedAsset {\n  id: string;\n  fileName: string;\n  uploadedAt: string;\n  url: string;\n}\n\nexport interface UploadAssetResponse {\n  data: UploadedAsset[];\n}\n"],"names":["AssetType"],"mappings":"aAAA,IAAYA,EAAAA,QAAAA,eAAAA,GAAAA,EAAAA,QAAAA,YAAAA,kBAAS,CAAA,IACnB,MAAA,QACAA,EAAA,MAAA"}