npm - @flipdish/portal-library - Versions diffs - 8.5.6 → 8.6.0 - Mend

@flipdish/portal-library 8.5.6 → 8.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2302) hide show

package/dist/components/molecules/GenericTable/GenericTableBody/index.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs.js","sources":["../../../../../src/components/molecules/GenericTable/GenericTableBody/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Skeleton from '@mui/material/Skeleton';\nimport { styled } from '@mui/material/styles';\nimport MuiTableBody from '@mui/material/TableBody';\nimport TableCell from '@mui/material/TableCell';\nimport TableRow from '@mui/material/TableRow';\n\nimport GenericTableBodyRow from '../GenericTableBodyRow';\n\nexport interface GenericTableColumns {\n columnName: string;\n columnTitle: string;\n columnType: 'Custom' \| 'String';\n align?: 'left' \| 'right';\n isVisible: boolean;\n ordinal: number;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n customComponent?: (data: any, row: any) => JSX.Element;\n tooltip?: string;\n hideWhenEmpty?: boolean;\n}\n\nconst StyledTableCell = styled(TableCell, {\n shouldForwardProp: (prop) =>\n prop !== 'align' &&\n prop !== 'titleCell' &&\n prop !== 'warning' &&\n prop !== 'sticky' &&\n prop !== 'isTitleRow',\n})<{ align: string; titleCell: boolean; warning: boolean; sticky: boolean; isTitleRow: boolean }>(\n ({ align, titleCell, warning, sticky, isTitleRow }) => ({\n textAlign: align,\n fontWeight: titleCell \|\| isTitleRow ? 'bold' : 'normal',\n backgroundColor: warning ? '#ffcccb' : 'inherit',\n position: sticky ? 'sticky' : 'static',\n }),\n);\n\nexport interface TableCellProps {\n colIdx: number;\n colName: string;\n hasWarning?: boolean;\n hasTitle?: boolean;\n meta: { [key: string]: GenericTableColumns };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n row: Record<string, any>;\n type: 'normal' \| 'sticky';\n}\n\nconst RenderTableCell: React.FC<TableCellProps> = ({\n colIdx,\n colName,\n hasWarning,\n hasTitle,\n meta,\n row,\n type,\n}) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n const prop = row[colName];\n const align = meta[colName]?.align ?? 'left';\n const hideWhenEmpty = meta[colName]?.hideWhenEmpty ?? false;\n const fallbackValue = hideWhenEmpty ? '' : '-';\n const tableCellProps = {\n align,\n warning: hasWarning ?? false,\n titleCell: hasTitle ?? false,\n sticky: type === 'sticky' && colIdx === 0,\n 'data-fd': `col-${colName}`,\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n isTitleRow: row['isTitleRow'] ?? false,\n };\n\n // When prop is a React element render it as is\n // eslint-disable-next-line @typescript-eslint/no-unsafe-argument\n if (React.isValidElement(prop)) {\n return <StyledTableCell {...tableCellProps}>{prop}</StyledTableCell>;\n }\n\n switch (meta[colName]?.columnType) {\n case 'String':\n return <StyledTableCell {...tableCellProps}>{prop ?? fallbackValue}</StyledTableCell>;\n case 'Custom':\n return (\n <StyledTableCell {...tableCellProps}>\n {prop ? meta[colName]?.customComponent?.(prop, row) : fallbackValue}\n </StyledTableCell>\n );\n default:\n return <StyledTableCell {...tableCellProps}>{prop ?? fallbackValue}</StyledTableCell>;\n }\n};\n\ninterface TableBodyProps {\n columns: Set<string>;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n data?: any[];\n loading?: boolean;\n meta?: { [key: string]: GenericTableColumns };\n // eslint-disable-next-line @typescript-eslint/ban-types\n onRowClick?: Function;\n type: 'normal' \| 'sticky';\n}\n\nconst GenericTableBody: React.FC<TableBodyProps> = ({ columns, data, loading, type, onRowClick, meta }) => {\n const rowsPerPage = 5;\n return (\n <MuiTableBody>\n {loading\n ? Array.from(Array(rowsPerPage)).map((_, idx) => (\n // eslint-disable-next-line react/no-array-index-key\n <TableRow key={`row-loader-${idx}`} data-fd=\"row-loader\">\n {Array.from(columns).map((columnName, colIdx) => (\n <StyledTableCell\n // eslint-disable-next-line react/no-array-index-key\n key={`col-${columnName}-loader-${colIdx}`}\n align={'left'}\n data-fd={`col-${columnName}`}\n isTitleRow={false}\n sticky={false}\n titleCell={false}\n warning={false}\n >\n <Skeleton height={22} width=\"90%\" />\n </StyledTableCell>\n ))}\n </TableRow>\n ))\n : data?.map((row, rowIdx) => (\n <GenericTableBodyRow\n // eslint-disable-next-line react/no-array-index-key\n key={`row-${rowIdx}`}\n onRowClick={onRowClick}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n row={row}\n tableRowTestKey={rowIdx.toString()}\n >\n {Array.from(columns).map((colName, colIdx) => (\n <RenderTableCell\n // eslint-disable-next-line react/no-array-index-key\n key={`cell-${colName}-${colIdx}`}\n colIdx={colIdx}\n colName={colName}\n meta={meta ?? {}}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n row={row}\n type={type}\n />\n ))}\n </GenericTableBodyRow>\n ))}\n </MuiTableBody>\n );\n};\n\nexport default GenericTableBody;\n"],"names":["StyledTableCell","styled","TableCell","shouldForwardProp","prop","align","titleCell","warning","sticky","isTitleRow","textAlign","fontWeight","backgroundColor","position","RenderTableCell","colIdx","colName","hasWarning","hasTitle","meta","row","type","fallbackValue","hideWhenEmpty","tableCellProps","React","isValidElement","_jsx","children","columnType","customComponent","columns","data","loading","onRowClick","MuiTableBody","Array","from","map","_","idx","TableRow","columnName","Skeleton","height","width","rowIdx","GenericTableBodyRow","tableRowTestKey","toString"],"mappings":"wSAuBA,MAAMA,EAAkBC,EAAAA,OAAOC,EAAW,CACxCC,kBAAoBC,GACT,UAATA,GACS,cAATA,GACS,YAATA,GACS,WAATA,GACS,eAATA,GANoBH,~~EAQtB~~,EAAGI,QAAOC,YAAWC,UAASC,SAAQC,iBAAY,CAChDC,UAAWL,EACXM,WAAYL,GAAaG,EAAa,OAAS,SAC/CG,gBAAiBL,EAAU,UAAY,UACvCM,SAAUL,EAAS,SAAW,~~aAe5BM~~,EAA4C,EAChDC,SACAC,UACAC,aACAC,WACAC,OACAC,MACAC,WAGA,MAAMjB,EAAOgB,EAAIJ,GACXX,EAAQc,EAAKH,IAAUX,OAAS,OAEhCiB,EADgBH,EAAKH,IAAUO,gBAAiB,EAChB,GAAK,IACrCC,EAAiB,CACrBnB,QACAE,QAASU,IAAc,EACvBX,UAAWY,IAAY,EACvBV,OAAiB,WAATa,GAAgC,IAAXN,EAC7B,UAAW,OAAOC,IAElBP,WAAYW,EAAgB,aAAK,GAKnC,GAAIK,EAAMC,eAAetB,GACvB,OAAOuB,EAAAA,IAAC3B,EAAe,IAAKwB,EAAcI,SAAGxB,IAG/C,OAAQe,EAAKH,IAAUa,YACrB,IAAK,SAQL,QACE,OAAOF,EAAAA,IAAC3B,EAAe,IAAKwB,WAAiBpB,GAAQkB,IAPvD,IAAK,SACH,OACEK,EAAAA,IAAC3B,EAAe,IAAKwB,EAAcI,SAChCxB,EAAOe,EAAKH,IAAUc,kBAAkB1B,EAAMgB,GAAOE,qBAmBb,EAAGS,UAASC,OAAMC,UAASZ,OAAMa,aAAYf,UAG5FQ,EAAAA,IAACQ,EAAY,CAAAP,SACVK,EACGG,MAAMC,KAAKD,MAJC,IAImBE,~~KAAI~~,CAACC,EAAGC,IAErCb,EAAAA,IAACc,aAA2C,aAAYb,SACrDQ,MAAMC,KAAKN,GAASO,~~KAAI~~,CAACI,EAAY3B,IACpCY,EAAAA,IAAC3B,GAGCK,MAAO,OAAM,UACJ,OAAOqC,IAChBjC,YAAY,EACZD,QAAQ,EACRF,WAAW,EACXC,SAAS,EAAKqB,SAEdD,MAACgB,EAAQ,CAACC,OAAQ,GAAIC,MAAM,SARvB,OAAOH,YAAqB3B,~~QAJxB~~,cAAcyB,~~OAiB~~/BR,GAAMM,~~KAAI~~,CAAClB,EAAK0B,IACdnB,EAAAA,IAACoB,EAGC,CAAAb,WAAYA,EAEZd,IAAKA,EACL4B,gBAAiBF,EAAOG,WAAUrB,SAEjCQ,MAAMC,KAAKN,GAASO,~~KAAI~~,CAACtB,EAASD,IACjCY,EAAAA,IAACb,GAGCC,OAAQA,EACRC,QAASA,EACTG,KAAMA,GAAQ,CAAA,EAEdC,IAAKA,EACLC,KAAMA,GAND,QAAQL,KAAWD,~~QATvB~~,OAAO+B"}
1	+ {"version":3,"file":"index.cjs.js","sources":["../../../../../src/components/molecules/GenericTable/GenericTableBody/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Skeleton from '@mui/material/Skeleton';\nimport { styled } from '@mui/material/styles';\nimport MuiTableBody from '@mui/material/TableBody';\nimport TableCell from '@mui/material/TableCell';\nimport TableRow from '@mui/material/TableRow';\n\nimport GenericTableBodyRow from '../GenericTableBodyRow';\n\nexport interface GenericTableColumns {\n columnName: string;\n columnTitle: string;\n columnType: 'Custom' \| 'String';\n align?: 'left' \| 'right';\n isVisible: boolean;\n ordinal: number;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n customComponent?: (data: any, row: any) => JSX.Element;\n tooltip?: string;\n hideWhenEmpty?: boolean;\n}\n\nconst StyledTableCell = styled(TableCell, {\n shouldForwardProp: (prop) =>\n prop !== 'align' &&\n prop !== 'titleCell' &&\n prop !== 'warning' &&\n prop !== 'sticky' &&\n prop !== 'isTitleRow',\n})<{ align: string; titleCell: boolean; warning: boolean; sticky: boolean; isTitleRow: boolean }>(\n ({ align, titleCell, warning, sticky, isTitleRow }) => ({\n textAlign: align,\n fontWeight: titleCell \|\| isTitleRow ? 'bold' : 'normal',\n backgroundColor: warning ? '#ffcccb' : 'inherit',\n position: sticky ? 'sticky' : 'static',\n }),\n);\n\nexport interface TableCellProps {\n colIdx: number;\n colName: string;\n hasWarning?: boolean;\n hasTitle?: boolean;\n meta: { [key: string]: GenericTableColumns };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n row: Record<string, any>;\n type: 'normal' \| 'sticky';\n}\n\nconst RenderTableCell: React.FC<TableCellProps> = ({\n colIdx,\n colName,\n hasWarning,\n hasTitle,\n meta,\n row,\n type,\n}) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n const prop = row[colName];\n const align = meta[colName]?.align ?? 'left';\n const hideWhenEmpty = meta[colName]?.hideWhenEmpty ?? false;\n const fallbackValue = hideWhenEmpty ? '' : '-';\n const tableCellProps = {\n align,\n warning: hasWarning ?? false,\n titleCell: hasTitle ?? false,\n sticky: type === 'sticky' && colIdx === 0,\n 'data-fd': `col-${colName}`,\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n isTitleRow: row['isTitleRow'] ?? false,\n };\n\n // When prop is a React element render it as is\n // eslint-disable-next-line @typescript-eslint/no-unsafe-argument\n if (React.isValidElement(prop)) {\n return <StyledTableCell {...tableCellProps}>{prop}</StyledTableCell>;\n }\n\n switch (meta[colName]?.columnType) {\n case 'String':\n return <StyledTableCell {...tableCellProps}>{prop ?? fallbackValue}</StyledTableCell>;\n case 'Custom':\n return (\n <StyledTableCell {...tableCellProps}>\n {prop ? meta[colName]?.customComponent?.(prop, row) : fallbackValue}\n </StyledTableCell>\n );\n default:\n return <StyledTableCell {...tableCellProps}>{prop ?? fallbackValue}</StyledTableCell>;\n }\n};\n\ninterface TableBodyProps {\n columns: Set<string>;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n data?: any[];\n loading?: boolean;\n meta?: { [key: string]: GenericTableColumns };\n // eslint-disable-next-line @typescript-eslint/ban-types\n onRowClick?: Function;\n type: 'normal' \| 'sticky';\n}\n\nconst GenericTableBody: React.FC<TableBodyProps> = ({ columns, data, loading, type, onRowClick, meta }) => {\n const rowsPerPage = 5;\n return (\n <MuiTableBody>\n {loading\n ? Array.from(Array(rowsPerPage)).map((_, idx) => (\n // eslint-disable-next-line react/no-array-index-key\n <TableRow key={`row-loader-${idx}`} data-fd=\"row-loader\">\n {Array.from(columns).map((columnName, colIdx) => (\n <StyledTableCell\n // eslint-disable-next-line react/no-array-index-key\n key={`col-${columnName}-loader-${colIdx}`}\n align={'left'}\n data-fd={`col-${columnName}`}\n isTitleRow={false}\n sticky={false}\n titleCell={false}\n warning={false}\n >\n <Skeleton height={22} width=\"90%\" />\n </StyledTableCell>\n ))}\n </TableRow>\n ))\n : data?.map((row, rowIdx) => (\n <GenericTableBodyRow\n // eslint-disable-next-line react/no-array-index-key\n key={`row-${rowIdx}`}\n onRowClick={onRowClick}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n row={row}\n tableRowTestKey={rowIdx.toString()}\n >\n {Array.from(columns).map((colName, colIdx) => (\n <RenderTableCell\n // eslint-disable-next-line react/no-array-index-key\n key={`cell-${colName}-${colIdx}`}\n colIdx={colIdx}\n colName={colName}\n meta={meta ?? {}}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n row={row}\n type={type}\n />\n ))}\n </GenericTableBodyRow>\n ))}\n </MuiTableBody>\n );\n};\n\nexport default GenericTableBody;\n"],"names":["StyledTableCell","styled","TableCell","shouldForwardProp","prop","align","titleCell","warning","sticky","isTitleRow","textAlign","fontWeight","backgroundColor","position","RenderTableCell","colIdx","colName","hasWarning","hasTitle","meta","row","type","fallbackValue","hideWhenEmpty","tableCellProps","React","isValidElement","_jsx","children","columnType","customComponent","columns","data","loading","onRowClick","MuiTableBody","Array","from","map","_","idx","TableRow","columnName","Skeleton","height","width","rowIdx","GenericTableBodyRow","tableRowTestKey","toString"],"mappings":"wSAuBA,MAAMA,EAAkBC,EAAAA,OAAOC,EAAW,CACxCC,kBAAoBC,GACT,UAATA,GACS,cAATA,GACS,YAATA,GACS,WAATA,GACS,eAATA,GANoBH,CAQtB,EAAGI,QAAOC,YAAWC,UAASC,SAAQC,iBAAY,CAChDC,UAAWL,EACXM,WAAYL,GAAaG,EAAa,OAAS,SAC/CG,gBAAiBL,EAAU,UAAY,UACvCM,SAAUL,EAAS,SAAW,YAe5BM,EAA4C,EAChDC,SACAC,UACAC,aACAC,WACAC,OACAC,MACAC,WAGA,MAAMjB,EAAOgB,EAAIJ,GACXX,EAAQc,EAAKH,IAAUX,OAAS,OAEhCiB,EADgBH,EAAKH,IAAUO,gBAAiB,EAChB,GAAK,IACrCC,EAAiB,CACrBnB,QACAE,QAASU,IAAc,EACvBX,UAAWY,IAAY,EACvBV,OAAiB,WAATa,GAAgC,IAAXN,EAC7B,UAAW,OAAOC,IAElBP,WAAYW,EAAgB,aAAK,GAKnC,GAAIK,EAAMC,eAAetB,GACvB,OAAOuB,EAAAA,IAAC3B,EAAe,IAAKwB,EAAcI,SAAGxB,IAG/C,OAAQe,EAAKH,IAAUa,YACrB,IAAK,SAQL,QACE,OAAOF,EAAAA,IAAC3B,EAAe,IAAKwB,WAAiBpB,GAAQkB,IAPvD,IAAK,SACH,OACEK,EAAAA,IAAC3B,EAAe,IAAKwB,EAAcI,SAChCxB,EAAOe,EAAKH,IAAUc,kBAAkB1B,EAAMgB,GAAOE,qBAmBb,EAAGS,UAASC,OAAMC,UAASZ,OAAMa,aAAYf,UAG5FQ,EAAAA,IAACQ,EAAY,CAAAP,SACVK,EACGG,MAAMC,KAAKD,MAJC,IAImBE,IAAI,CAACC,EAAGC,IAErCb,EAAAA,IAACc,aAA2C,aAAYb,SACrDQ,MAAMC,KAAKN,GAASO,IAAI,CAACI,EAAY3B,IACpCY,EAAAA,IAAC3B,GAGCK,MAAO,OAAM,UACJ,OAAOqC,IAChBjC,YAAY,EACZD,QAAQ,EACRF,WAAW,EACXC,SAAS,EAAKqB,SAEdD,MAACgB,EAAQ,CAACC,OAAQ,GAAIC,MAAM,SARvB,OAAOH,YAAqB3B,OAJxB,cAAcyB,MAiB/BR,GAAMM,IAAI,CAAClB,EAAK0B,IACdnB,EAAAA,IAACoB,EAGC,CAAAb,WAAYA,EAEZd,IAAKA,EACL4B,gBAAiBF,EAAOG,WAAUrB,SAEjCQ,MAAMC,KAAKN,GAASO,IAAI,CAACtB,EAASD,IACjCY,EAAAA,IAACb,GAGCC,OAAQA,EACRC,QAASA,EACTG,KAAMA,GAAQ,CAAA,EAEdC,IAAKA,EACLC,KAAMA,GAND,QAAQL,KAAWD,OATvB,OAAO+B"}

package/dist/components/molecules/GenericTable/GenericTableBody/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as t}from"react/jsx-runtime";import i from"react";import e from"@mui/material/Skeleton";import{styled as r}from"@mui/material/styles";import l from"@mui/material/TableBody";import o from"@mui/material/TableCell";import a from"@mui/material/TableRow";import n from"../GenericTableBodyRow/index.js";const m=r(o,{shouldForwardProp:t=>"align"!==t&&"titleCell"!==t&&"warning"!==t&&"sticky"!==t&&"isTitleRow"!==t})((({align:t,titleCell:i,warning:e,sticky:r,isTitleRow:l})=>({textAlign:t,fontWeight:i||l?"bold":"normal",backgroundColor:e?"#ffcccb":"inherit",position:r?"sticky":"static"}))),c=({colIdx:e,colName:r,hasWarning:l,hasTitle:o,meta:a,row:n,type:c})=>{const d=n[r],s=a[r]?.align??"left",w=a[r]?.hideWhenEmpty??!1?"":"-",f={align:s,warning:l??!1,titleCell:o??!1,sticky:"sticky"===c&&0===e,"data-fd":`col-${r}`,isTitleRow:n.isTitleRow??!1};if(i.isValidElement(d))return t(m,{...f,children:d});switch(a[r]?.columnType){case"String":default:return t(m,{...f,children:d??w});case"Custom":return t(m,{...f,children:d?a[r]?.customComponent?.(d,n):w})}},d=({columns:i,data:r,loading:o,type:d,onRowClick:s,meta:w})=>t(l,{children:o?Array.from(Array(5)).map(((r,l)=>t(a,{"data-fd":"row-loader",children:Array.from(i).map(((i,r)=>t(m,{align:"left","data-fd":`col-${i}`,isTitleRow:!1,sticky:!1,titleCell:!1,warning:!1,children:t(e,{height:22,width:"90%"})},`col-${i}-loader-${r}`)))},`row-loader-${l}`))):r?.map(((e,r)=>t(n,{onRowClick:s,row:e,tableRowTestKey:r.toString(),children:Array.from(i).map(((i,r)=>t(c,{colIdx:r,colName:i,meta:w??{},row:e,type:d},`cell-${i}-${r}`)))},`row-${r}`)))});export{d as default};
+import{jsx as t}from"react/jsx-runtime";import i from"react";import e from"@mui/material/Skeleton";import{styled as r}from"@mui/material/styles";import l from"@mui/material/TableBody";import o from"@mui/material/TableCell";import a from"@mui/material/TableRow";import n from"../GenericTableBodyRow/index.js";const m=r(o,{shouldForwardProp:t=>"align"!==t&&"titleCell"!==t&&"warning"!==t&&"sticky"!==t&&"isTitleRow"!==t})(({align:t,titleCell:i,warning:e,sticky:r,isTitleRow:l})=>({textAlign:t,fontWeight:i||l?"bold":"normal",backgroundColor:e?"#ffcccb":"inherit",position:r?"sticky":"static"})),c=({colIdx:e,colName:r,hasWarning:l,hasTitle:o,meta:a,row:n,type:c})=>{const d=n[r],s=a[r]?.align??"left",w=a[r]?.hideWhenEmpty??!1?"":"-",f={align:s,warning:l??!1,titleCell:o??!1,sticky:"sticky"===c&&0===e,"data-fd":`col-${r}`,isTitleRow:n.isTitleRow??!1};if(i.isValidElement(d))return t(m,{...f,children:d});switch(a[r]?.columnType){case"String":default:return t(m,{...f,children:d??w});case"Custom":return t(m,{...f,children:d?a[r]?.customComponent?.(d,n):w})}},d=({columns:i,data:r,loading:o,type:d,onRowClick:s,meta:w})=>t(l,{children:o?Array.from(Array(5)).map((r,l)=>t(a,{"data-fd":"row-loader",children:Array.from(i).map((i,r)=>t(m,{align:"left","data-fd":`col-${i}`,isTitleRow:!1,sticky:!1,titleCell:!1,warning:!1,children:t(e,{height:22,width:"90%"})},`col-${i}-loader-${r}`))},`row-loader-${l}`)):r?.map((e,r)=>t(n,{onRowClick:s,row:e,tableRowTestKey:r.toString(),children:Array.from(i).map((i,r)=>t(c,{colIdx:r,colName:i,meta:w??{},row:e,type:d},`cell-${i}-${r}`))},`row-${r}`))});export{d as default};
 //# sourceMappingURL=index.js.map

package/dist/components/molecules/GenericTable/GenericTableBody/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../../../src/components/molecules/GenericTable/GenericTableBody/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Skeleton from '@mui/material/Skeleton';\nimport { styled } from '@mui/material/styles';\nimport MuiTableBody from '@mui/material/TableBody';\nimport TableCell from '@mui/material/TableCell';\nimport TableRow from '@mui/material/TableRow';\n\nimport GenericTableBodyRow from '../GenericTableBodyRow';\n\nexport interface GenericTableColumns {\n columnName: string;\n columnTitle: string;\n columnType: 'Custom' \| 'String';\n align?: 'left' \| 'right';\n isVisible: boolean;\n ordinal: number;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n customComponent?: (data: any, row: any) => JSX.Element;\n tooltip?: string;\n hideWhenEmpty?: boolean;\n}\n\nconst StyledTableCell = styled(TableCell, {\n shouldForwardProp: (prop) =>\n prop !== 'align' &&\n prop !== 'titleCell' &&\n prop !== 'warning' &&\n prop !== 'sticky' &&\n prop !== 'isTitleRow',\n})<{ align: string; titleCell: boolean; warning: boolean; sticky: boolean; isTitleRow: boolean }>(\n ({ align, titleCell, warning, sticky, isTitleRow }) => ({\n textAlign: align,\n fontWeight: titleCell \|\| isTitleRow ? 'bold' : 'normal',\n backgroundColor: warning ? '#ffcccb' : 'inherit',\n position: sticky ? 'sticky' : 'static',\n }),\n);\n\nexport interface TableCellProps {\n colIdx: number;\n colName: string;\n hasWarning?: boolean;\n hasTitle?: boolean;\n meta: { [key: string]: GenericTableColumns };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n row: Record<string, any>;\n type: 'normal' \| 'sticky';\n}\n\nconst RenderTableCell: React.FC<TableCellProps> = ({\n colIdx,\n colName,\n hasWarning,\n hasTitle,\n meta,\n row,\n type,\n}) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n const prop = row[colName];\n const align = meta[colName]?.align ?? 'left';\n const hideWhenEmpty = meta[colName]?.hideWhenEmpty ?? false;\n const fallbackValue = hideWhenEmpty ? '' : '-';\n const tableCellProps = {\n align,\n warning: hasWarning ?? false,\n titleCell: hasTitle ?? false,\n sticky: type === 'sticky' && colIdx === 0,\n 'data-fd': `col-${colName}`,\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n isTitleRow: row['isTitleRow'] ?? false,\n };\n\n // When prop is a React element render it as is\n // eslint-disable-next-line @typescript-eslint/no-unsafe-argument\n if (React.isValidElement(prop)) {\n return <StyledTableCell {...tableCellProps}>{prop}</StyledTableCell>;\n }\n\n switch (meta[colName]?.columnType) {\n case 'String':\n return <StyledTableCell {...tableCellProps}>{prop ?? fallbackValue}</StyledTableCell>;\n case 'Custom':\n return (\n <StyledTableCell {...tableCellProps}>\n {prop ? meta[colName]?.customComponent?.(prop, row) : fallbackValue}\n </StyledTableCell>\n );\n default:\n return <StyledTableCell {...tableCellProps}>{prop ?? fallbackValue}</StyledTableCell>;\n }\n};\n\ninterface TableBodyProps {\n columns: Set<string>;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n data?: any[];\n loading?: boolean;\n meta?: { [key: string]: GenericTableColumns };\n // eslint-disable-next-line @typescript-eslint/ban-types\n onRowClick?: Function;\n type: 'normal' \| 'sticky';\n}\n\nconst GenericTableBody: React.FC<TableBodyProps> = ({ columns, data, loading, type, onRowClick, meta }) => {\n const rowsPerPage = 5;\n return (\n <MuiTableBody>\n {loading\n ? Array.from(Array(rowsPerPage)).map((_, idx) => (\n // eslint-disable-next-line react/no-array-index-key\n <TableRow key={`row-loader-${idx}`} data-fd=\"row-loader\">\n {Array.from(columns).map((columnName, colIdx) => (\n <StyledTableCell\n // eslint-disable-next-line react/no-array-index-key\n key={`col-${columnName}-loader-${colIdx}`}\n align={'left'}\n data-fd={`col-${columnName}`}\n isTitleRow={false}\n sticky={false}\n titleCell={false}\n warning={false}\n >\n <Skeleton height={22} width=\"90%\" />\n </StyledTableCell>\n ))}\n </TableRow>\n ))\n : data?.map((row, rowIdx) => (\n <GenericTableBodyRow\n // eslint-disable-next-line react/no-array-index-key\n key={`row-${rowIdx}`}\n onRowClick={onRowClick}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n row={row}\n tableRowTestKey={rowIdx.toString()}\n >\n {Array.from(columns).map((colName, colIdx) => (\n <RenderTableCell\n // eslint-disable-next-line react/no-array-index-key\n key={`cell-${colName}-${colIdx}`}\n colIdx={colIdx}\n colName={colName}\n meta={meta ?? {}}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n row={row}\n type={type}\n />\n ))}\n </GenericTableBodyRow>\n ))}\n </MuiTableBody>\n );\n};\n\nexport default GenericTableBody;\n"],"names":["StyledTableCell","styled","TableCell","shouldForwardProp","prop","align","titleCell","warning","sticky","isTitleRow","textAlign","fontWeight","backgroundColor","position","RenderTableCell","colIdx","colName","hasWarning","hasTitle","meta","row","type","fallbackValue","hideWhenEmpty","tableCellProps","React","isValidElement","_jsx","children","columnType","customComponent","GenericTableBody","columns","data","loading","onRowClick","MuiTableBody","Array","from","map","_","idx","TableRow","columnName","Skeleton","height","width","rowIdx","GenericTableBodyRow","tableRowTestKey","toString"],"mappings":"oTAuBA,MAAMA,EAAkBC,EAAOC,EAAW,CACxCC,kBAAoBC,GACT,UAATA,GACS,cAATA,GACS,YAATA,GACS,WAATA,GACS,eAATA,GANoBH,~~EAQtB~~,EAAGI,QAAOC,YAAWC,UAASC,SAAQC,iBAAY,CAChDC,UAAWL,EACXM,WAAYL,GAAaG,EAAa,OAAS,SAC/CG,gBAAiBL,EAAU,UAAY,UACvCM,SAAUL,EAAS,SAAW,~~aAe5BM~~,EAA4C,EAChDC,SACAC,UACAC,aACAC,WACAC,OACAC,MACAC,WAGA,MAAMjB,EAAOgB,EAAIJ,GACXX,EAAQc,EAAKH,IAAUX,OAAS,OAEhCiB,EADgBH,EAAKH,IAAUO,gBAAiB,EAChB,GAAK,IACrCC,EAAiB,CACrBnB,QACAE,QAASU,IAAc,EACvBX,UAAWY,IAAY,EACvBV,OAAiB,WAATa,GAAgC,IAAXN,EAC7B,UAAW,OAAOC,IAElBP,WAAYW,EAAgB,aAAK,GAKnC,GAAIK,EAAMC,eAAetB,GACvB,OAAOuB,EAAC3B,EAAe,IAAKwB,EAAcI,SAAGxB,IAG/C,OAAQe,EAAKH,IAAUa,YACrB,IAAK,SAQL,QACE,OAAOF,EAAC3B,EAAe,IAAKwB,WAAiBpB,GAAQkB,IAPvD,IAAK,SACH,OACEK,EAAC3B,EAAe,IAAKwB,EAAcI,SAChCxB,EAAOe,EAAKH,IAAUc,kBAAkB1B,EAAMgB,GAAOE,MAmB1DS,EAA6C,EAAGC,UAASC,OAAMC,UAASb,OAAMc,aAAYhB,UAG5FQ,EAACS,EAAY,CAAAR,SACVM,EACGG,MAAMC,KAAKD,MAJC,IAImBE,~~KAAI~~,CAACC,EAAGC,IAErCd,EAACe,aAA2C,aAAYd,SACrDS,MAAMC,KAAKN,GAASO,~~KAAI~~,CAACI,EAAY5B,IACpCY,EAAC3B,GAGCK,MAAO,OAAM,UACJ,OAAOsC,IAChBlC,YAAY,EACZD,QAAQ,EACRF,WAAW,EACXC,SAAS,EAAKqB,SAEdD,EAACiB,EAAQ,CAACC,OAAQ,GAAIC,MAAM,SARvB,OAAOH,YAAqB5B,~~QAJxB~~,cAAc0B,~~OAiB~~/BR,GAAMM,~~KAAI~~,CAACnB,EAAK2B,IACdpB,EAACqB,EAGC,CAAAb,WAAYA,EAEZf,IAAKA,EACL6B,gBAAiBF,EAAOG,WAAUtB,SAEjCS,MAAMC,KAAKN,GAASO,~~KAAI~~,CAACvB,EAASD,IACjCY,EAACb,GAGCC,OAAQA,EACRC,QAASA,EACTG,KAAMA,GAAQ,CAAA,EAEdC,IAAKA,EACLC,KAAMA,GAND,QAAQL,KAAWD,~~QATvB~~,OAAOgC"}
1	+ {"version":3,"file":"index.js","sources":["../../../../../src/components/molecules/GenericTable/GenericTableBody/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Skeleton from '@mui/material/Skeleton';\nimport { styled } from '@mui/material/styles';\nimport MuiTableBody from '@mui/material/TableBody';\nimport TableCell from '@mui/material/TableCell';\nimport TableRow from '@mui/material/TableRow';\n\nimport GenericTableBodyRow from '../GenericTableBodyRow';\n\nexport interface GenericTableColumns {\n columnName: string;\n columnTitle: string;\n columnType: 'Custom' \| 'String';\n align?: 'left' \| 'right';\n isVisible: boolean;\n ordinal: number;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n customComponent?: (data: any, row: any) => JSX.Element;\n tooltip?: string;\n hideWhenEmpty?: boolean;\n}\n\nconst StyledTableCell = styled(TableCell, {\n shouldForwardProp: (prop) =>\n prop !== 'align' &&\n prop !== 'titleCell' &&\n prop !== 'warning' &&\n prop !== 'sticky' &&\n prop !== 'isTitleRow',\n})<{ align: string; titleCell: boolean; warning: boolean; sticky: boolean; isTitleRow: boolean }>(\n ({ align, titleCell, warning, sticky, isTitleRow }) => ({\n textAlign: align,\n fontWeight: titleCell \|\| isTitleRow ? 'bold' : 'normal',\n backgroundColor: warning ? '#ffcccb' : 'inherit',\n position: sticky ? 'sticky' : 'static',\n }),\n);\n\nexport interface TableCellProps {\n colIdx: number;\n colName: string;\n hasWarning?: boolean;\n hasTitle?: boolean;\n meta: { [key: string]: GenericTableColumns };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n row: Record<string, any>;\n type: 'normal' \| 'sticky';\n}\n\nconst RenderTableCell: React.FC<TableCellProps> = ({\n colIdx,\n colName,\n hasWarning,\n hasTitle,\n meta,\n row,\n type,\n}) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n const prop = row[colName];\n const align = meta[colName]?.align ?? 'left';\n const hideWhenEmpty = meta[colName]?.hideWhenEmpty ?? false;\n const fallbackValue = hideWhenEmpty ? '' : '-';\n const tableCellProps = {\n align,\n warning: hasWarning ?? false,\n titleCell: hasTitle ?? false,\n sticky: type === 'sticky' && colIdx === 0,\n 'data-fd': `col-${colName}`,\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n isTitleRow: row['isTitleRow'] ?? false,\n };\n\n // When prop is a React element render it as is\n // eslint-disable-next-line @typescript-eslint/no-unsafe-argument\n if (React.isValidElement(prop)) {\n return <StyledTableCell {...tableCellProps}>{prop}</StyledTableCell>;\n }\n\n switch (meta[colName]?.columnType) {\n case 'String':\n return <StyledTableCell {...tableCellProps}>{prop ?? fallbackValue}</StyledTableCell>;\n case 'Custom':\n return (\n <StyledTableCell {...tableCellProps}>\n {prop ? meta[colName]?.customComponent?.(prop, row) : fallbackValue}\n </StyledTableCell>\n );\n default:\n return <StyledTableCell {...tableCellProps}>{prop ?? fallbackValue}</StyledTableCell>;\n }\n};\n\ninterface TableBodyProps {\n columns: Set<string>;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n data?: any[];\n loading?: boolean;\n meta?: { [key: string]: GenericTableColumns };\n // eslint-disable-next-line @typescript-eslint/ban-types\n onRowClick?: Function;\n type: 'normal' \| 'sticky';\n}\n\nconst GenericTableBody: React.FC<TableBodyProps> = ({ columns, data, loading, type, onRowClick, meta }) => {\n const rowsPerPage = 5;\n return (\n <MuiTableBody>\n {loading\n ? Array.from(Array(rowsPerPage)).map((_, idx) => (\n // eslint-disable-next-line react/no-array-index-key\n <TableRow key={`row-loader-${idx}`} data-fd=\"row-loader\">\n {Array.from(columns).map((columnName, colIdx) => (\n <StyledTableCell\n // eslint-disable-next-line react/no-array-index-key\n key={`col-${columnName}-loader-${colIdx}`}\n align={'left'}\n data-fd={`col-${columnName}`}\n isTitleRow={false}\n sticky={false}\n titleCell={false}\n warning={false}\n >\n <Skeleton height={22} width=\"90%\" />\n </StyledTableCell>\n ))}\n </TableRow>\n ))\n : data?.map((row, rowIdx) => (\n <GenericTableBodyRow\n // eslint-disable-next-line react/no-array-index-key\n key={`row-${rowIdx}`}\n onRowClick={onRowClick}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n row={row}\n tableRowTestKey={rowIdx.toString()}\n >\n {Array.from(columns).map((colName, colIdx) => (\n <RenderTableCell\n // eslint-disable-next-line react/no-array-index-key\n key={`cell-${colName}-${colIdx}`}\n colIdx={colIdx}\n colName={colName}\n meta={meta ?? {}}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n row={row}\n type={type}\n />\n ))}\n </GenericTableBodyRow>\n ))}\n </MuiTableBody>\n );\n};\n\nexport default GenericTableBody;\n"],"names":["StyledTableCell","styled","TableCell","shouldForwardProp","prop","align","titleCell","warning","sticky","isTitleRow","textAlign","fontWeight","backgroundColor","position","RenderTableCell","colIdx","colName","hasWarning","hasTitle","meta","row","type","fallbackValue","hideWhenEmpty","tableCellProps","React","isValidElement","_jsx","children","columnType","customComponent","GenericTableBody","columns","data","loading","onRowClick","MuiTableBody","Array","from","map","_","idx","TableRow","columnName","Skeleton","height","width","rowIdx","GenericTableBodyRow","tableRowTestKey","toString"],"mappings":"oTAuBA,MAAMA,EAAkBC,EAAOC,EAAW,CACxCC,kBAAoBC,GACT,UAATA,GACS,cAATA,GACS,YAATA,GACS,WAATA,GACS,eAATA,GANoBH,CAQtB,EAAGI,QAAOC,YAAWC,UAASC,SAAQC,iBAAY,CAChDC,UAAWL,EACXM,WAAYL,GAAaG,EAAa,OAAS,SAC/CG,gBAAiBL,EAAU,UAAY,UACvCM,SAAUL,EAAS,SAAW,YAe5BM,EAA4C,EAChDC,SACAC,UACAC,aACAC,WACAC,OACAC,MACAC,WAGA,MAAMjB,EAAOgB,EAAIJ,GACXX,EAAQc,EAAKH,IAAUX,OAAS,OAEhCiB,EADgBH,EAAKH,IAAUO,gBAAiB,EAChB,GAAK,IACrCC,EAAiB,CACrBnB,QACAE,QAASU,IAAc,EACvBX,UAAWY,IAAY,EACvBV,OAAiB,WAATa,GAAgC,IAAXN,EAC7B,UAAW,OAAOC,IAElBP,WAAYW,EAAgB,aAAK,GAKnC,GAAIK,EAAMC,eAAetB,GACvB,OAAOuB,EAAC3B,EAAe,IAAKwB,EAAcI,SAAGxB,IAG/C,OAAQe,EAAKH,IAAUa,YACrB,IAAK,SAQL,QACE,OAAOF,EAAC3B,EAAe,IAAKwB,WAAiBpB,GAAQkB,IAPvD,IAAK,SACH,OACEK,EAAC3B,EAAe,IAAKwB,EAAcI,SAChCxB,EAAOe,EAAKH,IAAUc,kBAAkB1B,EAAMgB,GAAOE,MAmB1DS,EAA6C,EAAGC,UAASC,OAAMC,UAASb,OAAMc,aAAYhB,UAG5FQ,EAACS,EAAY,CAAAR,SACVM,EACGG,MAAMC,KAAKD,MAJC,IAImBE,IAAI,CAACC,EAAGC,IAErCd,EAACe,aAA2C,aAAYd,SACrDS,MAAMC,KAAKN,GAASO,IAAI,CAACI,EAAY5B,IACpCY,EAAC3B,GAGCK,MAAO,OAAM,UACJ,OAAOsC,IAChBlC,YAAY,EACZD,QAAQ,EACRF,WAAW,EACXC,SAAS,EAAKqB,SAEdD,EAACiB,EAAQ,CAACC,OAAQ,GAAIC,MAAM,SARvB,OAAOH,YAAqB5B,OAJxB,cAAc0B,MAiB/BR,GAAMM,IAAI,CAACnB,EAAK2B,IACdpB,EAACqB,EAGC,CAAAb,WAAYA,EAEZf,IAAKA,EACL6B,gBAAiBF,EAAOG,WAAUtB,SAEjCS,MAAMC,KAAKN,GAASO,IAAI,CAACvB,EAASD,IACjCY,EAACb,GAGCC,OAAQA,EACRC,QAASA,EACTG,KAAMA,GAAQ,CAAA,EAEdC,IAAKA,EACLC,KAAMA,GAND,QAAQL,KAAWD,OATvB,OAAOgC"}

package/dist/components/molecules/GenericTable/GenericTableBodyRow/index.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime");require("react");var r=require("@mui/material/styles"),t=require("@mui/material/TableRow");const i=r.styled(t,{shouldForwardProp:e=>"isTitleRow"!==e})((({theme:e,isTitleRow:r})=>r?{backgroundColor:e.palette.semantic.background["background-sunken"]}:{}));module.exports=r=>{const{onRowClick:o,row:a,children:l,tableRowTestKey:s}=r,c=e=>{e.preventDefault(),o?.(a)};return o?e.jsx(i,{"data-fd":`row-clickable-${s}`,hover:void 0!==c,isTitleRow:a.isTitleRow??!1,onClick:c,children:l}):e.jsx(t,{"data-fd":`row-${s}`,children:l})};
+"use strict";var e=require("react/jsx-runtime");require("react");var r=require("@mui/material/styles"),t=require("@mui/material/TableRow");const i=r.styled(t,{shouldForwardProp:e=>"isTitleRow"!==e})(({theme:e,isTitleRow:r})=>r?{backgroundColor:e.palette.semantic.background["background-sunken"]}:{});module.exports=r=>{const{onRowClick:o,row:a,children:l,tableRowTestKey:s}=r,c=e=>{e.preventDefault(),o?.(a)};return o?e.jsx(i,{"data-fd":`row-clickable-${s}`,hover:void 0!==c,isTitleRow:a.isTitleRow??!1,onClick:c,children:l}):e.jsx(t,{"data-fd":`row-${s}`,children:l})};
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/molecules/GenericTable/GenericTableBodyRow/index.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs.js","sources":["../../../../../src/components/molecules/GenericTable/GenericTableBodyRow/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\nimport TableRow from '@mui/material/TableRow';\n\nexport interface TableBodyRowProps {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n row: any;\n // eslint-disable-next-line @typescript-eslint/ban-types\n onRowClick?: Function;\n tableRowTestKey: string;\n}\n\nconst StyledTableRow = styled(TableRow, {\n shouldForwardProp: (prop) => prop !== 'isTitleRow',\n})<{ isTitleRow: boolean }>(({ theme, isTitleRow }) => {\n if (!isTitleRow) {\n return {};\n }\n\n return {\n backgroundColor: theme.palette.semantic.background['background-sunken'],\n };\n});\n\ntype TableBodyRowProp = TableBodyRowProps & { children: React.ReactNode };\n\nconst GenericTableBodyRow: React.FC<React.PropsWithChildren<TableBodyRowProp>> = (props) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n const { onRowClick, row, children, tableRowTestKey } = props;\n\n const onClick = (event: React.MouseEvent<HTMLTableRowElement>): void => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n event.preventDefault();\n onRowClick?.(row);\n };\n\n if (onRowClick) {\n return (\n <StyledTableRow\n data-fd={`row-clickable-${tableRowTestKey}`}\n hover={onClick !== undefined}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access\n isTitleRow={row['isTitleRow'] ?? false}\n onClick={onClick}\n >\n {children}\n </StyledTableRow>\n );\n }\n\n return <TableRow data-fd={`row-${tableRowTestKey}`}>{children}</TableRow>;\n};\n\nexport default GenericTableBodyRow;\n"],"names":["StyledTableRow","styled","TableRow","shouldForwardProp","prop","theme","isTitleRow","backgroundColor","palette","semantic","background","props","onRowClick","row","children","tableRowTestKey","onClick","event","preventDefault","_jsx","hover","undefined"],"mappings":"2IAaA,MAAMA,EAAiBC,EAAAA,OAAOC,EAAU,CACtCC,kBAAoBC,GAAkB,eAATA,GADRH,~~EAEK~~,EAAGI,QAAOC,gBAC/BA,EAIE,CACLC,gBAAiBF,EAAMG,QAAQC,SAASC,WAAW,sBAJ5C,CAAA,~~mBAUuEC~~,IAEhF,MAAMC,WAAEA,EAAUC,IAAEA,EAAGC,SAAEA,EAAQC,gBAAEA,GAAoBJ,EAEjDK,EAAWC,IAEfA,EAAMC,iBACNN,IAAaC,IAGf,OAAID,EAEAO,EAAAA,IAACnB,EAAc,CAAA,UACJ,iBAAiBe,IAC1BK,WAAmBC,IAAZL,EAEPV,WAAYO,EAAgB,aAAK,EACjCG,QAASA,EAAOF,SAEfA,IAKAK,EAAAA,IAACjB,EAAQ,CAAA,UAAU,OAAOa,IAAiBD,SAAGA"}
1	+ {"version":3,"file":"index.cjs.js","sources":["../../../../../src/components/molecules/GenericTable/GenericTableBodyRow/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\nimport TableRow from '@mui/material/TableRow';\n\nexport interface TableBodyRowProps {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n row: any;\n // eslint-disable-next-line @typescript-eslint/ban-types\n onRowClick?: Function;\n tableRowTestKey: string;\n}\n\nconst StyledTableRow = styled(TableRow, {\n shouldForwardProp: (prop) => prop !== 'isTitleRow',\n})<{ isTitleRow: boolean }>(({ theme, isTitleRow }) => {\n if (!isTitleRow) {\n return {};\n }\n\n return {\n backgroundColor: theme.palette.semantic.background['background-sunken'],\n };\n});\n\ntype TableBodyRowProp = TableBodyRowProps & { children: React.ReactNode };\n\nconst GenericTableBodyRow: React.FC<React.PropsWithChildren<TableBodyRowProp>> = (props) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n const { onRowClick, row, children, tableRowTestKey } = props;\n\n const onClick = (event: React.MouseEvent<HTMLTableRowElement>): void => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n event.preventDefault();\n onRowClick?.(row);\n };\n\n if (onRowClick) {\n return (\n <StyledTableRow\n data-fd={`row-clickable-${tableRowTestKey}`}\n hover={onClick !== undefined}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access\n isTitleRow={row['isTitleRow'] ?? false}\n onClick={onClick}\n >\n {children}\n </StyledTableRow>\n );\n }\n\n return <TableRow data-fd={`row-${tableRowTestKey}`}>{children}</TableRow>;\n};\n\nexport default GenericTableBodyRow;\n"],"names":["StyledTableRow","styled","TableRow","shouldForwardProp","prop","theme","isTitleRow","backgroundColor","palette","semantic","background","props","onRowClick","row","children","tableRowTestKey","onClick","event","preventDefault","_jsx","hover","undefined"],"mappings":"2IAaA,MAAMA,EAAiBC,EAAAA,OAAOC,EAAU,CACtCC,kBAAoBC,GAAkB,eAATA,GADRH,CAEK,EAAGI,QAAOC,gBAC/BA,EAIE,CACLC,gBAAiBF,EAAMG,QAAQC,SAASC,WAAW,sBAJ5C,CAAA,kBAUuEC,IAEhF,MAAMC,WAAEA,EAAUC,IAAEA,EAAGC,SAAEA,EAAQC,gBAAEA,GAAoBJ,EAEjDK,EAAWC,IAEfA,EAAMC,iBACNN,IAAaC,IAGf,OAAID,EAEAO,EAAAA,IAACnB,EAAc,CAAA,UACJ,iBAAiBe,IAC1BK,WAAmBC,IAAZL,EAEPV,WAAYO,EAAgB,aAAK,EACjCG,QAASA,EAAOF,SAEfA,IAKAK,EAAAA,IAACjB,EAAQ,CAAA,UAAU,OAAOa,IAAiBD,SAAGA"}

package/dist/components/molecules/GenericTable/GenericTableBodyRow/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as o}from"react/jsx-runtime";import"react";import{styled as e}from"@mui/material/styles";import r from"@mui/material/TableRow";const t=e(r,{shouldForwardProp:o=>"isTitleRow"!==o})((({theme:o,isTitleRow:e})=>e?{backgroundColor:o.palette.semantic.background["background-sunken"]}:{})),i=e=>{const{onRowClick:i,row:a,children:l,tableRowTestKey:n}=e,c=o=>{o.preventDefault(),i?.(a)};return i?o(t,{"data-fd":`row-clickable-${n}`,hover:void 0!==c,isTitleRow:a.isTitleRow??!1,onClick:c,children:l}):o(r,{"data-fd":`row-${n}`,children:l})};export{i as default};
+import{jsx as o}from"react/jsx-runtime";import"react";import{styled as e}from"@mui/material/styles";import r from"@mui/material/TableRow";const t=e(r,{shouldForwardProp:o=>"isTitleRow"!==o})(({theme:o,isTitleRow:e})=>e?{backgroundColor:o.palette.semantic.background["background-sunken"]}:{}),i=e=>{const{onRowClick:i,row:a,children:l,tableRowTestKey:n}=e,c=o=>{o.preventDefault(),i?.(a)};return i?o(t,{"data-fd":`row-clickable-${n}`,hover:void 0!==c,isTitleRow:a.isTitleRow??!1,onClick:c,children:l}):o(r,{"data-fd":`row-${n}`,children:l})};export{i as default};
 //# sourceMappingURL=index.js.map

package/dist/components/molecules/GenericTable/GenericTableBodyRow/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../../../src/components/molecules/GenericTable/GenericTableBodyRow/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\nimport TableRow from '@mui/material/TableRow';\n\nexport interface TableBodyRowProps {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n row: any;\n // eslint-disable-next-line @typescript-eslint/ban-types\n onRowClick?: Function;\n tableRowTestKey: string;\n}\n\nconst StyledTableRow = styled(TableRow, {\n shouldForwardProp: (prop) => prop !== 'isTitleRow',\n})<{ isTitleRow: boolean }>(({ theme, isTitleRow }) => {\n if (!isTitleRow) {\n return {};\n }\n\n return {\n backgroundColor: theme.palette.semantic.background['background-sunken'],\n };\n});\n\ntype TableBodyRowProp = TableBodyRowProps & { children: React.ReactNode };\n\nconst GenericTableBodyRow: React.FC<React.PropsWithChildren<TableBodyRowProp>> = (props) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n const { onRowClick, row, children, tableRowTestKey } = props;\n\n const onClick = (event: React.MouseEvent<HTMLTableRowElement>): void => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n event.preventDefault();\n onRowClick?.(row);\n };\n\n if (onRowClick) {\n return (\n <StyledTableRow\n data-fd={`row-clickable-${tableRowTestKey}`}\n hover={onClick !== undefined}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access\n isTitleRow={row['isTitleRow'] ?? false}\n onClick={onClick}\n >\n {children}\n </StyledTableRow>\n );\n }\n\n return <TableRow data-fd={`row-${tableRowTestKey}`}>{children}</TableRow>;\n};\n\nexport default GenericTableBodyRow;\n"],"names":["StyledTableRow","styled","TableRow","shouldForwardProp","prop","theme","isTitleRow","backgroundColor","palette","semantic","background","GenericTableBodyRow","props","onRowClick","row","children","tableRowTestKey","onClick","event","preventDefault","_jsx","hover","undefined"],"mappings":"0IAaA,MAAMA,EAAiBC,EAAOC,EAAU,CACtCC,kBAAoBC,GAAkB,eAATA,GADRH,~~EAEK~~,EAAGI,QAAOC,gBAC/BA,EAIE,CACLC,gBAAiBF,EAAMG,QAAQC,SAASC,WAAW,sBAJ5C,CAAA,~~IAULC~~,EAA4EC,IAEhF,MAAMC,WAAEA,EAAUC,IAAEA,EAAGC,SAAEA,EAAQC,gBAAEA,GAAoBJ,EAEjDK,EAAWC,IAEfA,EAAMC,iBACNN,IAAaC,IAGf,OAAID,EAEAO,EAACpB,EAAc,CAAA,UACJ,iBAAiBgB,IAC1BK,WAAmBC,IAAZL,EAEPX,WAAYQ,EAAgB,aAAK,EACjCG,QAASA,EAAOF,SAEfA,IAKAK,EAAClB,EAAQ,CAAA,UAAU,OAAOc,IAAiBD,SAAGA"}
1	+ {"version":3,"file":"index.js","sources":["../../../../../src/components/molecules/GenericTable/GenericTableBodyRow/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\nimport TableRow from '@mui/material/TableRow';\n\nexport interface TableBodyRowProps {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n row: any;\n // eslint-disable-next-line @typescript-eslint/ban-types\n onRowClick?: Function;\n tableRowTestKey: string;\n}\n\nconst StyledTableRow = styled(TableRow, {\n shouldForwardProp: (prop) => prop !== 'isTitleRow',\n})<{ isTitleRow: boolean }>(({ theme, isTitleRow }) => {\n if (!isTitleRow) {\n return {};\n }\n\n return {\n backgroundColor: theme.palette.semantic.background['background-sunken'],\n };\n});\n\ntype TableBodyRowProp = TableBodyRowProps & { children: React.ReactNode };\n\nconst GenericTableBodyRow: React.FC<React.PropsWithChildren<TableBodyRowProp>> = (props) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n const { onRowClick, row, children, tableRowTestKey } = props;\n\n const onClick = (event: React.MouseEvent<HTMLTableRowElement>): void => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n event.preventDefault();\n onRowClick?.(row);\n };\n\n if (onRowClick) {\n return (\n <StyledTableRow\n data-fd={`row-clickable-${tableRowTestKey}`}\n hover={onClick !== undefined}\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access\n isTitleRow={row['isTitleRow'] ?? false}\n onClick={onClick}\n >\n {children}\n </StyledTableRow>\n );\n }\n\n return <TableRow data-fd={`row-${tableRowTestKey}`}>{children}</TableRow>;\n};\n\nexport default GenericTableBodyRow;\n"],"names":["StyledTableRow","styled","TableRow","shouldForwardProp","prop","theme","isTitleRow","backgroundColor","palette","semantic","background","GenericTableBodyRow","props","onRowClick","row","children","tableRowTestKey","onClick","event","preventDefault","_jsx","hover","undefined"],"mappings":"0IAaA,MAAMA,EAAiBC,EAAOC,EAAU,CACtCC,kBAAoBC,GAAkB,eAATA,GADRH,CAEK,EAAGI,QAAOC,gBAC/BA,EAIE,CACLC,gBAAiBF,EAAMG,QAAQC,SAASC,WAAW,sBAJ5C,CAAA,GAULC,EAA4EC,IAEhF,MAAMC,WAAEA,EAAUC,IAAEA,EAAGC,SAAEA,EAAQC,gBAAEA,GAAoBJ,EAEjDK,EAAWC,IAEfA,EAAMC,iBACNN,IAAaC,IAGf,OAAID,EAEAO,EAACpB,EAAc,CAAA,UACJ,iBAAiBgB,IAC1BK,WAAmBC,IAAZL,EAEPX,WAAYQ,EAAgB,aAAK,EACjCG,QAASA,EAAOF,SAEfA,IAKAK,EAAClB,EAAQ,CAAA,UAAU,OAAOc,IAAiBD,SAAGA"}

package/dist/components/molecules/GenericTable/GenericTableTitle/index.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var i=require("react/jsx-runtime");require("react");var e=require("@mui/material/styles"),t=require("@mui/material/Typography"),r=require("@mui/material/Grid2");const a=e.styled(r,{shouldForwardProp:i=>"titlePadding"!==i})((({theme:i,titlePadding:e})=>{switch(e){case"small":return{padding:i.spacing(3,0,1.5),[i.breakpoints.down("tablet")]:{padding:i.spacing(3,2,1.5)}};case"medium":return{padding:i.spacing(4,0,2),[i.breakpoints.down("tablet")]:{padding:i.spacing(4,2,2)}};default:return{padding:0}}})),d=e.styled(t)({width:191,height:16,fontSize:12,fontWeight:"normal",lineHeight:1.33,letterSpacing:.4,color:"rgba(0, 0, 0, 0.38)"});module.exports=({maxGridWidth:e=12,subTitle:n,title:l,children:s,titlePadding:c="medium"})=>i.jsxs(a,{container:!0,titlePadding:c,children:[i.jsxs(r,{size:{base:e,mobile:e},children:[l&&i.jsx(t,{variant:"h5",children:l}),n&&i.jsx("div",{children:i.jsx(d,{variant:"caption",children:n})})]}),s]});
+"use strict";var i=require("react/jsx-runtime");require("react");var e=require("@mui/material/styles"),t=require("@mui/material/Typography"),r=require("@mui/material/Grid2");const a=e.styled(r,{shouldForwardProp:i=>"titlePadding"!==i})(({theme:i,titlePadding:e})=>{switch(e){case"small":return{padding:i.spacing(3,0,1.5),[i.breakpoints.down("tablet")]:{padding:i.spacing(3,2,1.5)}};case"medium":return{padding:i.spacing(4,0,2),[i.breakpoints.down("tablet")]:{padding:i.spacing(4,2,2)}};default:return{padding:0}}}),d=e.styled(t)({width:191,height:16,fontSize:12,fontWeight:"normal",lineHeight:1.33,letterSpacing:.4,color:"rgba(0, 0, 0, 0.38)"});module.exports=({maxGridWidth:e=12,subTitle:n,title:l,children:s,titlePadding:c="medium"})=>i.jsxs(a,{container:!0,titlePadding:c,children:[i.jsxs(r,{size:{base:e,mobile:e},children:[l&&i.jsx(t,{variant:"h5",children:l}),n&&i.jsx("div",{children:i.jsx(d,{variant:"caption",children:n})})]}),s]});
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/molecules/GenericTable/GenericTableTitle/index.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs.js","sources":["../../../../../src/components/molecules/GenericTable/GenericTableTitle/index.tsx"],"sourcesContent":["import { type ReactNode } from 'react';\n\nimport { styled } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\n\nimport Grid, { type GridSize } from '../../../atoms/Grid';\n\ninterface OuterProps {\n maxGridWidth?: GridSize;\n subTitle?: string;\n title?: string;\n children?: ReactNode;\n titlePadding?: 'medium' \| 'small';\n}\n\nconst HeaderContainer = styled(Grid, {\n shouldForwardProp: (prop) => prop !== 'titlePadding',\n})<{ titlePadding: OuterProps['titlePadding'] }>(({ theme, titlePadding }) => {\n switch (titlePadding) {\n case 'small':\n return {\n padding: theme.spacing(3, 0, 1.5),\n [theme.breakpoints.down('tablet')]: {\n padding: theme.spacing(3, 2, 1.5),\n },\n };\n case 'medium':\n return {\n padding: theme.spacing(4, 0, 2),\n [theme.breakpoints.down('tablet')]: {\n padding: theme.spacing(4, 2, 2),\n },\n };\n default:\n return { padding: 0 };\n }\n});\n\nconst SubTitle = styled(Typography)({\n width: 191,\n height: 16,\n fontSize: 12,\n fontWeight: 'normal',\n lineHeight: 1.33,\n letterSpacing: 0.4,\n color: 'rgba(0, 0, 0, 0.38)',\n});\n\nconst GenericTableTitle = ({\n maxGridWidth = 12,\n subTitle,\n title,\n children,\n titlePadding = 'medium',\n}: OuterProps): JSX.Element => {\n return (\n <HeaderContainer container titlePadding={titlePadding}>\n <Grid size={{ base: maxGridWidth, mobile: maxGridWidth }}>\n {title && <Typography variant=\"h5\">{title}</Typography>}\n {subTitle && (\n <div>\n <SubTitle variant=\"caption\">{subTitle}</SubTitle>\n </div>\n )}\n </Grid>\n\n {children}\n </HeaderContainer>\n );\n};\n\nexport default GenericTableTitle;\n"],"names":["HeaderContainer","styled","Grid","shouldForwardProp","prop","theme","titlePadding","padding","spacing","breakpoints","down","SubTitle","Typography","width","height","fontSize","fontWeight","lineHeight","letterSpacing","color","maxGridWidth","subTitle","title","children","_jsxs","container","size","base","mobile","_jsx","variant"],"mappings":"8KAeA,MAAMA,EAAkBC,EAAAA,OAAOC,EAAM,CACnCC,kBAAoBC,GAAkB,iBAATA,GADPH,~~EAEyB~~,EAAGI,QAAOC,mBACzD,OAAQA,GACN,IAAK,QACH,MAAO,CACLC,QAASF,EAAMG,QAAQ,EAAG,EAAG,KAC7B,CAACH,EAAMI,YAAYC,KAAK,WAAY,CAClCH,QAASF,EAAMG,QAAQ,EAAG,EAAG,OAGnC,IAAK,SACH,MAAO,CACLD,QAASF,EAAMG,QAAQ,EAAG,EAAG,GAC7B,CAACH,EAAMI,YAAYC,KAAK,WAAY,CAClCH,QAASF,EAAMG,QAAQ,EAAG,EAAG,KAGnC,QACE,MAAO,CAAED,QAAS,~~OAIlBI~~,EAAWV,EAAAA,OAAOW,EAAPX,CAAmB,CAClCY,MAAO,IACPC,OAAQ,GACRC,SAAU,GACVC,WAAY,SACZC,WAAY,KACZC,cAAe,GACfC,MAAO,uCAGiB,EACxBC,eAAe,GACfC,WACAC,QACAC,WACAjB,eAAe,YAGbkB,EAAAA,KAACxB,EAAe,CAACyB,WAAS,EAACnB,aAAcA,EAAYiB,SAAA,CACnDC,OAACtB,EAAI,CAACwB,KAAM,CAAEC,KAAMP,EAAcQ,OAAQR,GAAcG,SAAA,CACrDD,GAASO,EAAAA,IAACjB,EAAU,CAACkB,QAAQ,KAAIP,SAAED,IACnCD,GACCQ,EAAAA,IAAA,MAAA,CAAAN,SACEM,MAAClB,EAAQ,CAACmB,QAAQ,UAASP,SAAEF,SAKlCE"}
1	+ {"version":3,"file":"index.cjs.js","sources":["../../../../../src/components/molecules/GenericTable/GenericTableTitle/index.tsx"],"sourcesContent":["import { type ReactNode } from 'react';\n\nimport { styled } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\n\nimport Grid, { type GridSize } from '../../../atoms/Grid';\n\ninterface OuterProps {\n maxGridWidth?: GridSize;\n subTitle?: string;\n title?: string;\n children?: ReactNode;\n titlePadding?: 'medium' \| 'small';\n}\n\nconst HeaderContainer = styled(Grid, {\n shouldForwardProp: (prop) => prop !== 'titlePadding',\n})<{ titlePadding: OuterProps['titlePadding'] }>(({ theme, titlePadding }) => {\n switch (titlePadding) {\n case 'small':\n return {\n padding: theme.spacing(3, 0, 1.5),\n [theme.breakpoints.down('tablet')]: {\n padding: theme.spacing(3, 2, 1.5),\n },\n };\n case 'medium':\n return {\n padding: theme.spacing(4, 0, 2),\n [theme.breakpoints.down('tablet')]: {\n padding: theme.spacing(4, 2, 2),\n },\n };\n default:\n return { padding: 0 };\n }\n});\n\nconst SubTitle = styled(Typography)({\n width: 191,\n height: 16,\n fontSize: 12,\n fontWeight: 'normal',\n lineHeight: 1.33,\n letterSpacing: 0.4,\n color: 'rgba(0, 0, 0, 0.38)',\n});\n\nconst GenericTableTitle = ({\n maxGridWidth = 12,\n subTitle,\n title,\n children,\n titlePadding = 'medium',\n}: OuterProps): JSX.Element => {\n return (\n <HeaderContainer container titlePadding={titlePadding}>\n <Grid size={{ base: maxGridWidth, mobile: maxGridWidth }}>\n {title && <Typography variant=\"h5\">{title}</Typography>}\n {subTitle && (\n <div>\n <SubTitle variant=\"caption\">{subTitle}</SubTitle>\n </div>\n )}\n </Grid>\n\n {children}\n </HeaderContainer>\n );\n};\n\nexport default GenericTableTitle;\n"],"names":["HeaderContainer","styled","Grid","shouldForwardProp","prop","theme","titlePadding","padding","spacing","breakpoints","down","SubTitle","Typography","width","height","fontSize","fontWeight","lineHeight","letterSpacing","color","maxGridWidth","subTitle","title","children","_jsxs","container","size","base","mobile","_jsx","variant"],"mappings":"8KAeA,MAAMA,EAAkBC,EAAAA,OAAOC,EAAM,CACnCC,kBAAoBC,GAAkB,iBAATA,GADPH,CAEyB,EAAGI,QAAOC,mBACzD,OAAQA,GACN,IAAK,QACH,MAAO,CACLC,QAASF,EAAMG,QAAQ,EAAG,EAAG,KAC7B,CAACH,EAAMI,YAAYC,KAAK,WAAY,CAClCH,QAASF,EAAMG,QAAQ,EAAG,EAAG,OAGnC,IAAK,SACH,MAAO,CACLD,QAASF,EAAMG,QAAQ,EAAG,EAAG,GAC7B,CAACH,EAAMI,YAAYC,KAAK,WAAY,CAClCH,QAASF,EAAMG,QAAQ,EAAG,EAAG,KAGnC,QACE,MAAO,CAAED,QAAS,MAIlBI,EAAWV,EAAAA,OAAOW,EAAPX,CAAmB,CAClCY,MAAO,IACPC,OAAQ,GACRC,SAAU,GACVC,WAAY,SACZC,WAAY,KACZC,cAAe,GACfC,MAAO,uCAGiB,EACxBC,eAAe,GACfC,WACAC,QACAC,WACAjB,eAAe,YAGbkB,EAAAA,KAACxB,EAAe,CAACyB,WAAS,EAACnB,aAAcA,EAAYiB,SAAA,CACnDC,OAACtB,EAAI,CAACwB,KAAM,CAAEC,KAAMP,EAAcQ,OAAQR,GAAcG,SAAA,CACrDD,GAASO,EAAAA,IAACjB,EAAU,CAACkB,QAAQ,KAAIP,SAAED,IACnCD,GACCQ,EAAAA,IAAA,MAAA,CAAAN,SACEM,MAAClB,EAAQ,CAACmB,QAAQ,UAASP,SAAEF,SAKlCE"}

package/dist/components/molecules/GenericTable/GenericTableTitle/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as i,jsx as t}from"react/jsx-runtime";import"react";import{styled as e}from"@mui/material/styles";import a from"@mui/material/Typography";import r from"@mui/material/Grid2";const n=e(r,{shouldForwardProp:i=>"titlePadding"!==i})((({theme:i,titlePadding:t})=>{switch(t){case"small":return{padding:i.spacing(3,0,1.5),[i.breakpoints.down("tablet")]:{padding:i.spacing(3,2,1.5)}};case"medium":return{padding:i.spacing(4,0,2),[i.breakpoints.down("tablet")]:{padding:i.spacing(4,2,2)}};default:return{padding:0}}})),d=e(a)({width:191,height:16,fontSize:12,fontWeight:"normal",lineHeight:1.33,letterSpacing:.4,color:"rgba(0, 0, 0, 0.38)"}),l=({maxGridWidth:e=12,subTitle:l,title:o,children:m,titlePadding:p="medium"})=>i(n,{container:!0,titlePadding:p,children:[i(r,{size:{base:e,mobile:e},children:[o&&t(a,{variant:"h5",children:o}),l&&t("div",{children:t(d,{variant:"caption",children:l})})]}),m]});export{l as default};
+import{jsxs as i,jsx as t}from"react/jsx-runtime";import"react";import{styled as e}from"@mui/material/styles";import a from"@mui/material/Typography";import r from"@mui/material/Grid2";const n=e(r,{shouldForwardProp:i=>"titlePadding"!==i})(({theme:i,titlePadding:t})=>{switch(t){case"small":return{padding:i.spacing(3,0,1.5),[i.breakpoints.down("tablet")]:{padding:i.spacing(3,2,1.5)}};case"medium":return{padding:i.spacing(4,0,2),[i.breakpoints.down("tablet")]:{padding:i.spacing(4,2,2)}};default:return{padding:0}}}),d=e(a)({width:191,height:16,fontSize:12,fontWeight:"normal",lineHeight:1.33,letterSpacing:.4,color:"rgba(0, 0, 0, 0.38)"}),l=({maxGridWidth:e=12,subTitle:l,title:o,children:m,titlePadding:p="medium"})=>i(n,{container:!0,titlePadding:p,children:[i(r,{size:{base:e,mobile:e},children:[o&&t(a,{variant:"h5",children:o}),l&&t("div",{children:t(d,{variant:"caption",children:l})})]}),m]});export{l as default};
 //# sourceMappingURL=index.js.map

package/dist/components/molecules/GenericTable/GenericTableTitle/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../../../src/components/molecules/GenericTable/GenericTableTitle/index.tsx"],"sourcesContent":["import { type ReactNode } from 'react';\n\nimport { styled } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\n\nimport Grid, { type GridSize } from '../../../atoms/Grid';\n\ninterface OuterProps {\n maxGridWidth?: GridSize;\n subTitle?: string;\n title?: string;\n children?: ReactNode;\n titlePadding?: 'medium' \| 'small';\n}\n\nconst HeaderContainer = styled(Grid, {\n shouldForwardProp: (prop) => prop !== 'titlePadding',\n})<{ titlePadding: OuterProps['titlePadding'] }>(({ theme, titlePadding }) => {\n switch (titlePadding) {\n case 'small':\n return {\n padding: theme.spacing(3, 0, 1.5),\n [theme.breakpoints.down('tablet')]: {\n padding: theme.spacing(3, 2, 1.5),\n },\n };\n case 'medium':\n return {\n padding: theme.spacing(4, 0, 2),\n [theme.breakpoints.down('tablet')]: {\n padding: theme.spacing(4, 2, 2),\n },\n };\n default:\n return { padding: 0 };\n }\n});\n\nconst SubTitle = styled(Typography)({\n width: 191,\n height: 16,\n fontSize: 12,\n fontWeight: 'normal',\n lineHeight: 1.33,\n letterSpacing: 0.4,\n color: 'rgba(0, 0, 0, 0.38)',\n});\n\nconst GenericTableTitle = ({\n maxGridWidth = 12,\n subTitle,\n title,\n children,\n titlePadding = 'medium',\n}: OuterProps): JSX.Element => {\n return (\n <HeaderContainer container titlePadding={titlePadding}>\n <Grid size={{ base: maxGridWidth, mobile: maxGridWidth }}>\n {title && <Typography variant=\"h5\">{title}</Typography>}\n {subTitle && (\n <div>\n <SubTitle variant=\"caption\">{subTitle}</SubTitle>\n </div>\n )}\n </Grid>\n\n {children}\n </HeaderContainer>\n );\n};\n\nexport default GenericTableTitle;\n"],"names":["HeaderContainer","styled","Grid","shouldForwardProp","prop","theme","titlePadding","padding","spacing","breakpoints","down","SubTitle","Typography","width","height","fontSize","fontWeight","lineHeight","letterSpacing","color","GenericTableTitle","maxGridWidth","subTitle","title","children","_jsxs","container","size","base","mobile","_jsx","variant"],"mappings":"yLAeA,MAAMA,EAAkBC,EAAOC,EAAM,CACnCC,kBAAoBC,GAAkB,iBAATA,GADPH,~~EAEyB~~,EAAGI,QAAOC,mBACzD,OAAQA,GACN,IAAK,QACH,MAAO,CACLC,QAASF,EAAMG,QAAQ,EAAG,EAAG,KAC7B,CAACH,EAAMI,YAAYC,KAAK,WAAY,CAClCH,QAASF,EAAMG,QAAQ,EAAG,EAAG,OAGnC,IAAK,SACH,MAAO,CACLD,QAASF,EAAMG,QAAQ,EAAG,EAAG,GAC7B,CAACH,EAAMI,YAAYC,KAAK,WAAY,CAClCH,QAASF,EAAMG,QAAQ,EAAG,EAAG,KAGnC,QACE,MAAO,CAAED,QAAS,~~OAIlBI~~,EAAWV,EAAOW,EAAPX,CAAmB,CAClCY,MAAO,IACPC,OAAQ,GACRC,SAAU,GACVC,WAAY,SACZC,WAAY,KACZC,cAAe,GACfC,MAAO,wBAGHC,EAAoB,EACxBC,eAAe,GACfC,WACAC,QACAC,WACAlB,eAAe,YAGbmB,EAACzB,EAAe,CAAC0B,WAAS,EAACpB,aAAcA,EAAYkB,SAAA,CACnDC,EAACvB,EAAI,CAACyB,KAAM,CAAEC,KAAMP,EAAcQ,OAAQR,GAAcG,SAAA,CACrDD,GAASO,EAAClB,EAAU,CAACmB,QAAQ,KAAIP,SAAED,IACnCD,GACCQ,EAAA,MAAA,CAAAN,SACEM,EAACnB,EAAQ,CAACoB,QAAQ,UAASP,SAAEF,SAKlCE"}
1	+ {"version":3,"file":"index.js","sources":["../../../../../src/components/molecules/GenericTable/GenericTableTitle/index.tsx"],"sourcesContent":["import { type ReactNode } from 'react';\n\nimport { styled } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\n\nimport Grid, { type GridSize } from '../../../atoms/Grid';\n\ninterface OuterProps {\n maxGridWidth?: GridSize;\n subTitle?: string;\n title?: string;\n children?: ReactNode;\n titlePadding?: 'medium' \| 'small';\n}\n\nconst HeaderContainer = styled(Grid, {\n shouldForwardProp: (prop) => prop !== 'titlePadding',\n})<{ titlePadding: OuterProps['titlePadding'] }>(({ theme, titlePadding }) => {\n switch (titlePadding) {\n case 'small':\n return {\n padding: theme.spacing(3, 0, 1.5),\n [theme.breakpoints.down('tablet')]: {\n padding: theme.spacing(3, 2, 1.5),\n },\n };\n case 'medium':\n return {\n padding: theme.spacing(4, 0, 2),\n [theme.breakpoints.down('tablet')]: {\n padding: theme.spacing(4, 2, 2),\n },\n };\n default:\n return { padding: 0 };\n }\n});\n\nconst SubTitle = styled(Typography)({\n width: 191,\n height: 16,\n fontSize: 12,\n fontWeight: 'normal',\n lineHeight: 1.33,\n letterSpacing: 0.4,\n color: 'rgba(0, 0, 0, 0.38)',\n});\n\nconst GenericTableTitle = ({\n maxGridWidth = 12,\n subTitle,\n title,\n children,\n titlePadding = 'medium',\n}: OuterProps): JSX.Element => {\n return (\n <HeaderContainer container titlePadding={titlePadding}>\n <Grid size={{ base: maxGridWidth, mobile: maxGridWidth }}>\n {title && <Typography variant=\"h5\">{title}</Typography>}\n {subTitle && (\n <div>\n <SubTitle variant=\"caption\">{subTitle}</SubTitle>\n </div>\n )}\n </Grid>\n\n {children}\n </HeaderContainer>\n );\n};\n\nexport default GenericTableTitle;\n"],"names":["HeaderContainer","styled","Grid","shouldForwardProp","prop","theme","titlePadding","padding","spacing","breakpoints","down","SubTitle","Typography","width","height","fontSize","fontWeight","lineHeight","letterSpacing","color","GenericTableTitle","maxGridWidth","subTitle","title","children","_jsxs","container","size","base","mobile","_jsx","variant"],"mappings":"yLAeA,MAAMA,EAAkBC,EAAOC,EAAM,CACnCC,kBAAoBC,GAAkB,iBAATA,GADPH,CAEyB,EAAGI,QAAOC,mBACzD,OAAQA,GACN,IAAK,QACH,MAAO,CACLC,QAASF,EAAMG,QAAQ,EAAG,EAAG,KAC7B,CAACH,EAAMI,YAAYC,KAAK,WAAY,CAClCH,QAASF,EAAMG,QAAQ,EAAG,EAAG,OAGnC,IAAK,SACH,MAAO,CACLD,QAASF,EAAMG,QAAQ,EAAG,EAAG,GAC7B,CAACH,EAAMI,YAAYC,KAAK,WAAY,CAClCH,QAASF,EAAMG,QAAQ,EAAG,EAAG,KAGnC,QACE,MAAO,CAAED,QAAS,MAIlBI,EAAWV,EAAOW,EAAPX,CAAmB,CAClCY,MAAO,IACPC,OAAQ,GACRC,SAAU,GACVC,WAAY,SACZC,WAAY,KACZC,cAAe,GACfC,MAAO,wBAGHC,EAAoB,EACxBC,eAAe,GACfC,WACAC,QACAC,WACAlB,eAAe,YAGbmB,EAACzB,EAAe,CAAC0B,WAAS,EAACpB,aAAcA,EAAYkB,SAAA,CACnDC,EAACvB,EAAI,CAACyB,KAAM,CAAEC,KAAMP,EAAcQ,OAAQR,GAAcG,SAAA,CACrDD,GAASO,EAAClB,EAAU,CAACmB,QAAQ,KAAIP,SAAED,IACnCD,GACCQ,EAAA,MAAA,CAAAN,SACEM,EAACnB,EAAQ,CAACoB,QAAQ,UAASP,SAAEF,SAKlCE"}

package/dist/components/molecules/GenericTable/HighlightScrollbar.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("react");const t=require("@mui/material/styles").styled("div")((({hovered:e,isScrolling:r,theme:t})=>({overflowX:"auto","&::-webkit-scrollbar":{padding:"2px 0",height:"6px",border:`1px solid ${t.palette.divider}`},"&::-webkit-scrollbar-track":{background:t.palette.background.paper},"&::-webkit-scrollbar-thumb":{background:e?"rgba(5, 20, 158, 0.3)":t.palette.background.paper,borderRadius:"3px"},"&::-webkit-scrollbar-thumb:horizontal:active, &::-webkit-scrollbar-thumb:vertical:active":{background:e?"rgba(5, 20, 158, 0.6)":t.palette.background.paper},"&:hover .sticky":{boxShadow:r?`0px 2px 6px ${t.palette.background.paper}`:"none",transition:"box-shadow 200ms"}})));module.exports=o=>{const{children:a,onScroll:l,setIsScrolling:i,setScrollStarted:c}=o,[s,n]=r.useState(!1);return e.jsx(t,{hovered:s,isScrolling:!!i,onMouseEnter:()=>n(!0),onMouseLeave:()=>{n(!1),i&&i(!1),c&&c(!1)},onScroll:l,children:a})};
+"use strict";var e=require("react/jsx-runtime"),r=require("react");const t=require("@mui/material/styles").styled("div")(({hovered:e,isScrolling:r,theme:t})=>({overflowX:"auto","&::-webkit-scrollbar":{padding:"2px 0",height:"6px",border:`1px solid ${t.palette.divider}`},"&::-webkit-scrollbar-track":{background:t.palette.background.paper},"&::-webkit-scrollbar-thumb":{background:e?"rgba(5, 20, 158, 0.3)":t.palette.background.paper,borderRadius:"3px"},"&::-webkit-scrollbar-thumb:horizontal:active, &::-webkit-scrollbar-thumb:vertical:active":{background:e?"rgba(5, 20, 158, 0.6)":t.palette.background.paper},"&:hover .sticky":{boxShadow:r?`0px 2px 6px ${t.palette.background.paper}`:"none",transition:"box-shadow 200ms"}}));module.exports=o=>{const{children:a,onScroll:l,setIsScrolling:i,setScrollStarted:c}=o,[s,n]=r.useState(!1);return e.jsx(t,{hovered:s,isScrolling:!!i,onMouseEnter:()=>n(!0),onMouseLeave:()=>{n(!1),i&&i(!1),c&&c(!1)},onScroll:l,children:a})};
 //# sourceMappingURL=HighlightScrollbar.cjs.js.map

package/dist/components/molecules/GenericTable/HighlightScrollbar.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HighlightScrollbar.cjs.js","sources":["../../../../src/components/molecules/GenericTable/HighlightScrollbar.tsx"],"sourcesContent":["import React, { useState } from 'react';\n\nimport styled from '@fd/utilities/styledUtilities';\n\ninterface HighlightScrollbarProps {\n children: React.ReactNode;\n onScroll?: () => void;\n setIsScrolling?: React.Dispatch<React.SetStateAction<boolean>>;\n setScrollStarted?: React.Dispatch<React.SetStateAction<boolean>>;\n}\n\ninterface ContainerProps {\n hovered: boolean;\n isScrolling: boolean;\n}\n\nconst StyledContainer = styled('div')<ContainerProps>(({ hovered, isScrolling, theme }) => ({\n overflowX: 'auto',\n '&::-webkit-scrollbar': {\n padding: '2px 0',\n height: '6px',\n border: `1px solid ${theme.palette.divider}`,\n },\n '&::-webkit-scrollbar-track': {\n background: theme.palette.background.paper,\n },\n '&::-webkit-scrollbar-thumb': {\n background: hovered ? 'rgba(5, 20, 158, 0.3)' : theme.palette.background.paper,\n borderRadius: '3px',\n },\n '&::-webkit-scrollbar-thumb:horizontal:active, &::-webkit-scrollbar-thumb:vertical:active': {\n background: hovered ? 'rgba(5, 20, 158, 0.6)' : theme.palette.background.paper,\n },\n '&:hover .sticky': {\n boxShadow: isScrolling ? `0px 2px 6px ${theme.palette.background.paper}` : 'none',\n transition: 'box-shadow 200ms',\n },\n}));\n\nconst HighlightScrollbar: React.FC<React.PropsWithChildren<HighlightScrollbarProps>> = (props) => {\n const { children, onScroll, setIsScrolling, setScrollStarted } = props;\n const [hoveredTable, setHoveredTable] = useState(false);\n\n const highlightScrollbar = () => setHoveredTable(true);\n\n const fadeScrollbar = () => {\n setHoveredTable(false);\n if (setIsScrolling) setIsScrolling(false);\n if (setScrollStarted) setScrollStarted(false);\n };\n\n return (\n <StyledContainer\n hovered={hoveredTable}\n isScrolling={!!setIsScrolling}\n onMouseEnter={highlightScrollbar}\n onMouseLeave={fadeScrollbar}\n onScroll={onScroll}\n >\n {children}\n </StyledContainer>\n );\n};\n\nexport default HighlightScrollbar;\n"],"names":["StyledContainer","styled","hovered","isScrolling","theme","overflowX","padding","height","border","palette","divider","background","paper","borderRadius","boxShadow","transition","props","children","onScroll","setIsScrolling","setScrollStarted","hoveredTable","setHoveredTable","useState","_jsx","onMouseEnter","onMouseLeave"],"mappings":"mEAgBA,MAAMA,kCAAkBC,OAAO,MAAPA,~~EAA8B~~,EAAGC,UAASC,cAAaC,YAAO,CACpFC,UAAW,OACX,uBAAwB,CACtBC,QAAS,QACTC,OAAQ,MACRC,OAAQ,aAAaJ,EAAMK,QAAQC,WAErC,6BAA8B,CAC5BC,WAAYP,EAAMK,QAAQE,WAAWC,OAEvC,6BAA8B,CAC5BD,WAAYT,EAAU,wBAA0BE,EAAMK,QAAQE,WAAWC,MACzEC,aAAc,OAEhB,2FAA4F,CAC1FF,WAAYT,EAAU,wBAA0BE,EAAMK,QAAQE,WAAWC,OAE3E,kBAAmB,CACjBE,UAAWX,EAAc,eAAeC,EAAMK,QAAQE,WAAWC,QAAU,OAC3EG,WAAY,~~uCAIwEC~~,IACtF,MAAMC,SAAEA,EAAQC,SAAEA,EAAQC,eAAEA,EAAcC,iBAAEA,GAAqBJ,GAC1DK,EAAcC,GAAmBC,EAAAA,UAAS,GAUjD,OACEC,EAAAA,IAACxB,EAAe,CACdE,QAASmB,EACTlB,cAAegB,EACfM,aAZuB,IAAMH,GAAgB,GAa7CI,aAXkB,KACpBJ,GAAgB,GACZH,GAAgBA,GAAe,GAC/BC,GAAkBA,GAAiB,IASrCF,SAAUA,EAAQD,SAEjBA"}
1	+ {"version":3,"file":"HighlightScrollbar.cjs.js","sources":["../../../../src/components/molecules/GenericTable/HighlightScrollbar.tsx"],"sourcesContent":["import React, { useState } from 'react';\n\nimport styled from '@fd/utilities/styledUtilities';\n\ninterface HighlightScrollbarProps {\n children: React.ReactNode;\n onScroll?: () => void;\n setIsScrolling?: React.Dispatch<React.SetStateAction<boolean>>;\n setScrollStarted?: React.Dispatch<React.SetStateAction<boolean>>;\n}\n\ninterface ContainerProps {\n hovered: boolean;\n isScrolling: boolean;\n}\n\nconst StyledContainer = styled('div')<ContainerProps>(({ hovered, isScrolling, theme }) => ({\n overflowX: 'auto',\n '&::-webkit-scrollbar': {\n padding: '2px 0',\n height: '6px',\n border: `1px solid ${theme.palette.divider}`,\n },\n '&::-webkit-scrollbar-track': {\n background: theme.palette.background.paper,\n },\n '&::-webkit-scrollbar-thumb': {\n background: hovered ? 'rgba(5, 20, 158, 0.3)' : theme.palette.background.paper,\n borderRadius: '3px',\n },\n '&::-webkit-scrollbar-thumb:horizontal:active, &::-webkit-scrollbar-thumb:vertical:active': {\n background: hovered ? 'rgba(5, 20, 158, 0.6)' : theme.palette.background.paper,\n },\n '&:hover .sticky': {\n boxShadow: isScrolling ? `0px 2px 6px ${theme.palette.background.paper}` : 'none',\n transition: 'box-shadow 200ms',\n },\n}));\n\nconst HighlightScrollbar: React.FC<React.PropsWithChildren<HighlightScrollbarProps>> = (props) => {\n const { children, onScroll, setIsScrolling, setScrollStarted } = props;\n const [hoveredTable, setHoveredTable] = useState(false);\n\n const highlightScrollbar = () => setHoveredTable(true);\n\n const fadeScrollbar = () => {\n setHoveredTable(false);\n if (setIsScrolling) setIsScrolling(false);\n if (setScrollStarted) setScrollStarted(false);\n };\n\n return (\n <StyledContainer\n hovered={hoveredTable}\n isScrolling={!!setIsScrolling}\n onMouseEnter={highlightScrollbar}\n onMouseLeave={fadeScrollbar}\n onScroll={onScroll}\n >\n {children}\n </StyledContainer>\n );\n};\n\nexport default HighlightScrollbar;\n"],"names":["StyledContainer","styled","hovered","isScrolling","theme","overflowX","padding","height","border","palette","divider","background","paper","borderRadius","boxShadow","transition","props","children","onScroll","setIsScrolling","setScrollStarted","hoveredTable","setHoveredTable","useState","_jsx","onMouseEnter","onMouseLeave"],"mappings":"mEAgBA,MAAMA,kCAAkBC,OAAO,MAAPA,CAA8B,EAAGC,UAASC,cAAaC,YAAO,CACpFC,UAAW,OACX,uBAAwB,CACtBC,QAAS,QACTC,OAAQ,MACRC,OAAQ,aAAaJ,EAAMK,QAAQC,WAErC,6BAA8B,CAC5BC,WAAYP,EAAMK,QAAQE,WAAWC,OAEvC,6BAA8B,CAC5BD,WAAYT,EAAU,wBAA0BE,EAAMK,QAAQE,WAAWC,MACzEC,aAAc,OAEhB,2FAA4F,CAC1FF,WAAYT,EAAU,wBAA0BE,EAAMK,QAAQE,WAAWC,OAE3E,kBAAmB,CACjBE,UAAWX,EAAc,eAAeC,EAAMK,QAAQE,WAAWC,QAAU,OAC3EG,WAAY,sCAIwEC,IACtF,MAAMC,SAAEA,EAAQC,SAAEA,EAAQC,eAAEA,EAAcC,iBAAEA,GAAqBJ,GAC1DK,EAAcC,GAAmBC,EAAAA,UAAS,GAUjD,OACEC,EAAAA,IAACxB,EAAe,CACdE,QAASmB,EACTlB,cAAegB,EACfM,aAZuB,IAAMH,GAAgB,GAa7CI,aAXkB,KACpBJ,GAAgB,GACZH,GAAgBA,GAAe,GAC/BC,GAAkBA,GAAiB,IASrCF,SAAUA,EAAQD,SAEjBA"}

package/dist/components/molecules/GenericTable/HighlightScrollbar.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as r}from"react/jsx-runtime";import{useState as e}from"react";import{styled as o}from"@mui/material/styles";const t=o("div")((({hovered:r,isScrolling:e,theme:o})=>({overflowX:"auto","&::-webkit-scrollbar":{padding:"2px 0",height:"6px",border:`1px solid ${o.palette.divider}`},"&::-webkit-scrollbar-track":{background:o.palette.background.paper},"&::-webkit-scrollbar-thumb":{background:r?"rgba(5, 20, 158, 0.3)":o.palette.background.paper,borderRadius:"3px"},"&::-webkit-scrollbar-thumb:horizontal:active, &::-webkit-scrollbar-thumb:vertical:active":{background:r?"rgba(5, 20, 158, 0.6)":o.palette.background.paper},"&:hover .sticky":{boxShadow:e?`0px 2px 6px ${o.palette.background.paper}`:"none",transition:"box-shadow 200ms"}}))),a=o=>{const{children:a,onScroll:l,setIsScrolling:i,setScrollStarted:c}=o,[n,b]=e(!1);return r(t,{hovered:n,isScrolling:!!i,onMouseEnter:()=>b(!0),onMouseLeave:()=>{b(!1),i&&i(!1),c&&c(!1)},onScroll:l,children:a})};export{a as default};
+import{jsx as r}from"react/jsx-runtime";import{useState as e}from"react";import{styled as o}from"@mui/material/styles";const t=o("div")(({hovered:r,isScrolling:e,theme:o})=>({overflowX:"auto","&::-webkit-scrollbar":{padding:"2px 0",height:"6px",border:`1px solid ${o.palette.divider}`},"&::-webkit-scrollbar-track":{background:o.palette.background.paper},"&::-webkit-scrollbar-thumb":{background:r?"rgba(5, 20, 158, 0.3)":o.palette.background.paper,borderRadius:"3px"},"&::-webkit-scrollbar-thumb:horizontal:active, &::-webkit-scrollbar-thumb:vertical:active":{background:r?"rgba(5, 20, 158, 0.6)":o.palette.background.paper},"&:hover .sticky":{boxShadow:e?`0px 2px 6px ${o.palette.background.paper}`:"none",transition:"box-shadow 200ms"}})),a=o=>{const{children:a,onScroll:l,setIsScrolling:i,setScrollStarted:c}=o,[n,b]=e(!1);return r(t,{hovered:n,isScrolling:!!i,onMouseEnter:()=>b(!0),onMouseLeave:()=>{b(!1),i&&i(!1),c&&c(!1)},onScroll:l,children:a})};export{a as default};
 //# sourceMappingURL=HighlightScrollbar.js.map

package/dist/components/molecules/GenericTable/HighlightScrollbar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HighlightScrollbar.js","sources":["../../../../src/components/molecules/GenericTable/HighlightScrollbar.tsx"],"sourcesContent":["import React, { useState } from 'react';\n\nimport styled from '@fd/utilities/styledUtilities';\n\ninterface HighlightScrollbarProps {\n children: React.ReactNode;\n onScroll?: () => void;\n setIsScrolling?: React.Dispatch<React.SetStateAction<boolean>>;\n setScrollStarted?: React.Dispatch<React.SetStateAction<boolean>>;\n}\n\ninterface ContainerProps {\n hovered: boolean;\n isScrolling: boolean;\n}\n\nconst StyledContainer = styled('div')<ContainerProps>(({ hovered, isScrolling, theme }) => ({\n overflowX: 'auto',\n '&::-webkit-scrollbar': {\n padding: '2px 0',\n height: '6px',\n border: `1px solid ${theme.palette.divider}`,\n },\n '&::-webkit-scrollbar-track': {\n background: theme.palette.background.paper,\n },\n '&::-webkit-scrollbar-thumb': {\n background: hovered ? 'rgba(5, 20, 158, 0.3)' : theme.palette.background.paper,\n borderRadius: '3px',\n },\n '&::-webkit-scrollbar-thumb:horizontal:active, &::-webkit-scrollbar-thumb:vertical:active': {\n background: hovered ? 'rgba(5, 20, 158, 0.6)' : theme.palette.background.paper,\n },\n '&:hover .sticky': {\n boxShadow: isScrolling ? `0px 2px 6px ${theme.palette.background.paper}` : 'none',\n transition: 'box-shadow 200ms',\n },\n}));\n\nconst HighlightScrollbar: React.FC<React.PropsWithChildren<HighlightScrollbarProps>> = (props) => {\n const { children, onScroll, setIsScrolling, setScrollStarted } = props;\n const [hoveredTable, setHoveredTable] = useState(false);\n\n const highlightScrollbar = () => setHoveredTable(true);\n\n const fadeScrollbar = () => {\n setHoveredTable(false);\n if (setIsScrolling) setIsScrolling(false);\n if (setScrollStarted) setScrollStarted(false);\n };\n\n return (\n <StyledContainer\n hovered={hoveredTable}\n isScrolling={!!setIsScrolling}\n onMouseEnter={highlightScrollbar}\n onMouseLeave={fadeScrollbar}\n onScroll={onScroll}\n >\n {children}\n </StyledContainer>\n );\n};\n\nexport default HighlightScrollbar;\n"],"names":["StyledContainer","styled","hovered","isScrolling","theme","overflowX","padding","height","border","palette","divider","background","paper","borderRadius","boxShadow","transition","HighlightScrollbar","props","children","onScroll","setIsScrolling","setScrollStarted","hoveredTable","setHoveredTable","useState","_jsx","onMouseEnter","onMouseLeave"],"mappings":"uHAgBA,MAAMA,EAAkBC,EAAO,MAAPA,~~EAA8B~~,EAAGC,UAASC,cAAaC,YAAO,CACpFC,UAAW,OACX,uBAAwB,CACtBC,QAAS,QACTC,OAAQ,MACRC,OAAQ,aAAaJ,EAAMK,QAAQC,WAErC,6BAA8B,CAC5BC,WAAYP,EAAMK,QAAQE,WAAWC,OAEvC,6BAA8B,CAC5BD,WAAYT,EAAU,wBAA0BE,EAAMK,QAAQE,WAAWC,MACzEC,aAAc,OAEhB,2FAA4F,CAC1FF,WAAYT,EAAU,wBAA0BE,EAAMK,QAAQE,WAAWC,OAE3E,kBAAmB,CACjBE,UAAWX,EAAc,eAAeC,EAAMK,QAAQE,WAAWC,QAAU,OAC3EG,WAAY,~~wBAIVC~~,EAAkFC,IACtF,MAAMC,SAAEA,EAAQC,SAAEA,EAAQC,eAAEA,EAAcC,iBAAEA,GAAqBJ,GAC1DK,EAAcC,GAAmBC,GAAS,GAUjD,OACEC,EAACzB,EAAe,CACdE,QAASoB,EACTnB,cAAeiB,EACfM,aAZuB,IAAMH,GAAgB,GAa7CI,aAXkB,KACpBJ,GAAgB,GACZH,GAAgBA,GAAe,GAC/BC,GAAkBA,GAAiB,IASrCF,SAAUA,EAAQD,SAEjBA"}
1	+ {"version":3,"file":"HighlightScrollbar.js","sources":["../../../../src/components/molecules/GenericTable/HighlightScrollbar.tsx"],"sourcesContent":["import React, { useState } from 'react';\n\nimport styled from '@fd/utilities/styledUtilities';\n\ninterface HighlightScrollbarProps {\n children: React.ReactNode;\n onScroll?: () => void;\n setIsScrolling?: React.Dispatch<React.SetStateAction<boolean>>;\n setScrollStarted?: React.Dispatch<React.SetStateAction<boolean>>;\n}\n\ninterface ContainerProps {\n hovered: boolean;\n isScrolling: boolean;\n}\n\nconst StyledContainer = styled('div')<ContainerProps>(({ hovered, isScrolling, theme }) => ({\n overflowX: 'auto',\n '&::-webkit-scrollbar': {\n padding: '2px 0',\n height: '6px',\n border: `1px solid ${theme.palette.divider}`,\n },\n '&::-webkit-scrollbar-track': {\n background: theme.palette.background.paper,\n },\n '&::-webkit-scrollbar-thumb': {\n background: hovered ? 'rgba(5, 20, 158, 0.3)' : theme.palette.background.paper,\n borderRadius: '3px',\n },\n '&::-webkit-scrollbar-thumb:horizontal:active, &::-webkit-scrollbar-thumb:vertical:active': {\n background: hovered ? 'rgba(5, 20, 158, 0.6)' : theme.palette.background.paper,\n },\n '&:hover .sticky': {\n boxShadow: isScrolling ? `0px 2px 6px ${theme.palette.background.paper}` : 'none',\n transition: 'box-shadow 200ms',\n },\n}));\n\nconst HighlightScrollbar: React.FC<React.PropsWithChildren<HighlightScrollbarProps>> = (props) => {\n const { children, onScroll, setIsScrolling, setScrollStarted } = props;\n const [hoveredTable, setHoveredTable] = useState(false);\n\n const highlightScrollbar = () => setHoveredTable(true);\n\n const fadeScrollbar = () => {\n setHoveredTable(false);\n if (setIsScrolling) setIsScrolling(false);\n if (setScrollStarted) setScrollStarted(false);\n };\n\n return (\n <StyledContainer\n hovered={hoveredTable}\n isScrolling={!!setIsScrolling}\n onMouseEnter={highlightScrollbar}\n onMouseLeave={fadeScrollbar}\n onScroll={onScroll}\n >\n {children}\n </StyledContainer>\n );\n};\n\nexport default HighlightScrollbar;\n"],"names":["StyledContainer","styled","hovered","isScrolling","theme","overflowX","padding","height","border","palette","divider","background","paper","borderRadius","boxShadow","transition","HighlightScrollbar","props","children","onScroll","setIsScrolling","setScrollStarted","hoveredTable","setHoveredTable","useState","_jsx","onMouseEnter","onMouseLeave"],"mappings":"uHAgBA,MAAMA,EAAkBC,EAAO,MAAPA,CAA8B,EAAGC,UAASC,cAAaC,YAAO,CACpFC,UAAW,OACX,uBAAwB,CACtBC,QAAS,QACTC,OAAQ,MACRC,OAAQ,aAAaJ,EAAMK,QAAQC,WAErC,6BAA8B,CAC5BC,WAAYP,EAAMK,QAAQE,WAAWC,OAEvC,6BAA8B,CAC5BD,WAAYT,EAAU,wBAA0BE,EAAMK,QAAQE,WAAWC,MACzEC,aAAc,OAEhB,2FAA4F,CAC1FF,WAAYT,EAAU,wBAA0BE,EAAMK,QAAQE,WAAWC,OAE3E,kBAAmB,CACjBE,UAAWX,EAAc,eAAeC,EAAMK,QAAQE,WAAWC,QAAU,OAC3EG,WAAY,uBAIVC,EAAkFC,IACtF,MAAMC,SAAEA,EAAQC,SAAEA,EAAQC,eAAEA,EAAcC,iBAAEA,GAAqBJ,GAC1DK,EAAcC,GAAmBC,GAAS,GAUjD,OACEC,EAACzB,EAAe,CACdE,QAASoB,EACTnB,cAAeiB,EACfM,aAZuB,IAAMH,GAAgB,GAa7CI,aAXkB,KACpBJ,GAAgB,GACZH,GAAgBA,GAAe,GAC/BC,GAAkBA,GAAiB,IASrCF,SAAUA,EAAQD,SAEjBA"}

package/dist/components/molecules/GenericTable/index.cjs.js CHANGED Viewed

@@ -12,7 +12,7 @@
     background: #f5f5f5;
     border-radius: 3px;
   }
-`,p=n.styled(t,{shouldForwardProp:e=>"isSticky"!==e&&"titleVariant"!==e})((({theme:e,isSticky:i,titleVariant:t})=>({fontSize:13,fontWeight:"light"===t?400:e.typography.fontWeightMedium,color:"light"===t?e.palette.semantic.text["text-weak"]:e.palette.semantic.text["text-strong"],padding:e.spacing(1.25,2),whiteSpace:"nowrap",position:i?"sticky":"relative",zIndex:i?1:"auto"}))),b=n.styled("div")`
+`,p=n.styled(t,{shouldForwardProp:e=>"isSticky"!==e&&"titleVariant"!==e})(({theme:e,isSticky:i,titleVariant:t})=>({fontSize:13,fontWeight:"light"===t?400:e.typography.fontWeightMedium,color:"light"===t?e.palette.semantic.text["text-weak"]:e.palette.semantic.text["text-strong"],padding:e.spacing(1.25,2),whiteSpace:"nowrap",position:i?"sticky":"relative",zIndex:i?1:"auto"})),b=n.styled("div")`
   overflow: hidden;
-`,g=n.styled(l)((({theme:e})=>({marginLeft:e.spacing(.5),svg:{fontSize:e.typography.body1.fontSize}})));module.exports=({data:t,title:l,subTitle:n,showTitle:j=!0,onRowClick:f,loading:y,metadata:k,titleVariant:w="default"})=>{const q=new Set(k.filter((e=>e.isVisible)).sort(((e,i)=>e.ordinal-i.ordinal)).map((e=>e.columnName))),T=k.reduce(((e,i)=>(e[i.columnName]=i,e)),{}),v=d(),S=!s(v.breakpoints.up("tablet")),I=S?"normal":"sticky";return e.jsxs(x,{children:[j&&e.jsx(m,{subTitle:n,title:l}),e.jsx(b,{children:e.jsx(h,{children:e.jsxs(i,{"aria-label":l,"data-fd":"generic-table"+(j?`-${l?.replace(" ","-").toLowerCase()}`:""),sx:{borderTop:"1px solid #e0e0e0",height:"10vh"},children:[e.jsx(r,{children:e.jsx(a,{children:Array.from(q).map(((i,t)=>{const{columnName:r,columnTitle:a,align:l="left",tooltip:s}=T[i]||{};return e.jsx(p,{align:l,isSticky:0===t&&!S,titleVariant:w,children:e.jsxs("div",{children:[e.jsx("span",{children:a}),s&&e.jsx(g,{placement:"right-start",title:s,children:e.jsx(o.IconButton,{"aria-label":"Info",size:"small",children:e.jsx(c,{"data-fd":"InfoOutlinedIcon",size:"sm"})})})]})},r)}))})}),e.jsx(u,{columns:q,data:t,loading:y,meta:T,onRowClick:f,type:I})]})})})]})};
+`,g=n.styled(l)(({theme:e})=>({marginLeft:e.spacing(.5),svg:{fontSize:e.typography.body1.fontSize}}));module.exports=({data:t,title:l,subTitle:n,showTitle:j=!0,onRowClick:f,loading:y,metadata:k,titleVariant:w="default"})=>{const q=new Set(k.filter(e=>e.isVisible).sort((e,i)=>e.ordinal-i.ordinal).map(e=>e.columnName)),T=k.reduce((e,i)=>(e[i.columnName]=i,e),{}),v=d(),S=!s(v.breakpoints.up("tablet")),I=S?"normal":"sticky";return e.jsxs(x,{children:[j&&e.jsx(m,{subTitle:n,title:l}),e.jsx(b,{children:e.jsx(h,{children:e.jsxs(i,{"aria-label":l,"data-fd":"generic-table"+(j?`-${l?.replace(" ","-").toLowerCase()}`:""),sx:{borderTop:"1px solid #e0e0e0",height:"10vh"},children:[e.jsx(r,{children:e.jsx(a,{children:Array.from(q).map((i,t)=>{const{columnName:r,columnTitle:a,align:l="left",tooltip:s}=T[i]||{};return e.jsx(p,{align:l,isSticky:0===t&&!S,titleVariant:w,children:e.jsxs("div",{children:[e.jsx("span",{children:a}),s&&e.jsx(g,{placement:"right-start",title:s,children:e.jsx(o.IconButton,{"aria-label":"Info",size:"small",children:e.jsx(c,{"data-fd":"InfoOutlinedIcon",size:"sm"})})})]})},r)})})}),e.jsx(u,{columns:q,data:t,loading:y,meta:T,onRowClick:f,type:I})]})})})]})};
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/molecules/GenericTable/index.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/molecules/GenericTable/index.tsx"],"sourcesContent":["import Table from '@mui/material/Table';\nimport TableCell from '@mui/material/TableCell';\nimport TableHead from '@mui/material/TableHead';\nimport TableRow from '@mui/material/TableRow';\nimport Tooltip from '@mui/material/Tooltip';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n\nimport IconButton from '@fd/components/atoms/IconButton';\nimport styled from '@fd/utilities/styledUtilities';\nimport useTheme from '@fd/utilities/useTheme';\n\nimport InfoOutlinedIcon from '../../../icons/InformationCircle';\nimport GenericTableBody, { type GenericTableColumns } from './GenericTableBody';\nimport GenericTableTitle from './GenericTableTitle';\nimport HighlightScrollbar from './HighlightScrollbar';\n\ninterface GenericTableProps {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n data?: any[];\n loading?: boolean;\n metadata: GenericTableColumns[];\n // eslint-disable-next-line @typescript-eslint/ban-types\n onRowClick?: Function;\n showTitle?: boolean;\n subTitle?: string;\n title?: string;\n titleVariant?: 'default' \| 'light';\n}\n\nconst StyledContainer = styled('div')`\n overflow-x: auto;\n &::-webkit-scrollbar {\n padding: 2px 0;\n height: 6px;\n border: 1px solid #d5d5d5;\n }\n &::-webkit-scrollbar-track {\n background: #f1f1f1;\n }\n &::-webkit-scrollbar-thumb {\n background: #f5f5f5;\n border-radius: 3px;\n }\n`;\n\nconst StyledTableCell = styled(TableCell, {\n shouldForwardProp: (prop) => prop !== 'isSticky' && prop !== 'titleVariant',\n})<{ isSticky: boolean; titleVariant: 'default' \| 'light' }>(({ theme, isSticky, titleVariant }) => ({\n fontSize: 13,\n fontWeight: titleVariant === 'light' ? 400 : theme.typography.fontWeightMedium,\n color:\n titleVariant === 'light'\n ? theme.palette.semantic.text['text-weak']\n : theme.palette.semantic.text['text-strong'],\n padding: theme.spacing(1.25, 2),\n whiteSpace: 'nowrap',\n position: isSticky ? 'sticky' : 'relative',\n zIndex: isSticky ? 1 : 'auto',\n}));\n\nconst StyledSpacingContainer = styled('div')`\n overflow: hidden;\n`;\n\nconst StyledTooltip = styled(Tooltip)(({ theme }) => ({\n marginLeft: theme.spacing(0.5),\n svg: {\n fontSize: theme.typography.body1.fontSize,\n },\n}));\n\nconst GenericTable = ({\n data,\n title,\n subTitle,\n showTitle = true,\n onRowClick,\n loading,\n metadata,\n titleVariant = 'default',\n}: GenericTableProps) => {\n const columns = new Set(\n metadata\n .filter((m) => m.isVisible)\n .sort((a, b) => a.ordinal - b.ordinal)\n .map((m) => m.columnName),\n );\n const tableMeta = metadata.reduce<{ [key: string]: GenericTableColumns }>((obj, mData) => {\n obj[mData.columnName] = mData;\n return obj;\n }, {});\n\n const theme = useTheme();\n const isMobile = !useMediaQuery(theme.breakpoints.up('tablet'));\n\n // We never want sticky on mobile - only on desktop\n const firstColumnStylePosition = isMobile ? 'normal' : 'sticky';\n\n const renderTableHeader = () => (\n <TableHead>\n <TableRow>\n {Array.from(columns).map((prop, idx) => {\n const { columnName, columnTitle, align = 'left', tooltip } = tableMeta[prop] \|\| {};\n\n return (\n <StyledTableCell\n key={columnName}\n align={align}\n isSticky={idx === 0 && !isMobile}\n titleVariant={titleVariant}\n >\n <div>\n <span>{columnTitle}</span>\n {tooltip && (\n <StyledTooltip placement=\"right-start\" title={tooltip}>\n <IconButton aria-label=\"Info\" size=\"small\">\n <InfoOutlinedIcon data-fd=\"InfoOutlinedIcon\" size=\"sm\" />\n </IconButton>\n </StyledTooltip>\n )}\n </div>\n </StyledTableCell>\n );\n })}\n </TableRow>\n </TableHead>\n );\n\n return (\n <StyledContainer>\n {showTitle && <GenericTableTitle subTitle={subTitle} title={title}></GenericTableTitle>}\n <StyledSpacingContainer>\n <HighlightScrollbar>\n <Table\n aria-label={title}\n data-fd={`generic-table` + (showTitle ? `-${title?.replace(' ', '-').toLowerCase()}` : '')}\n sx={{\n borderTop: '1px solid #e0e0e0',\n height: '10vh',\n }}\n >\n {renderTableHeader()}\n <GenericTableBody\n columns={columns}\n data={data}\n loading={loading}\n meta={tableMeta}\n onRowClick={onRowClick}\n type={firstColumnStylePosition}\n />\n </Table>\n </HighlightScrollbar>\n </StyledSpacingContainer>\n </StyledContainer>\n );\n};\n\nexport default GenericTable;\n"],"names":["StyledContainer","styled","StyledTableCell","TableCell","shouldForwardProp","prop","theme","isSticky","titleVariant","fontSize","fontWeight","typography","fontWeightMedium","color","palette","semantic","text","padding","spacing","whiteSpace","position","zIndex","StyledSpacingContainer","StyledTooltip","Tooltip","marginLeft","svg","body1","data","title","subTitle","showTitle","onRowClick","loading","metadata","columns","Set","filter","m","isVisible","sort","a","b","ordinal","map","columnName","tableMeta","reduce","obj","mData","useTheme","isMobile","useMediaQuery","breakpoints","up","firstColumnStylePosition","_jsxs","children","_jsx","GenericTableTitle","HighlightScrollbar","Table","replace","toLowerCase","sx","borderTop","height","TableHead","TableRow","Array","from","idx","columnTitle","align","tooltip","placement","IconButton","size","InfoOutlinedIcon","GenericTableBody","meta","type"],"mappings":"wkBA6BA,MAAMA,EAAkBC,EAAAA,OAAO,MAAM;;;;;;;;;;;;;;EAgB/BC,EAAkBD,EAAAA,OAAOE,EAAW,CACxCC,kBAAoBC,GAAkB,aAATA,GAAgC,iBAATA,GAD9BJ,~~EAEqC~~,EAAGK,QAAOC,WAAUC,mBAAc,CAC7FC,SAAU,GACVC,WAA6B,UAAjBF,EAA2B,IAAMF,EAAMK,WAAWC,iBAC9DC,MACmB,UAAjBL,EACIF,EAAMQ,QAAQC,SAASC,KAAK,aAC5BV,EAAMQ,QAAQC,SAASC,KAAK,eAClCC,QAASX,EAAMY,QAAQ,KAAM,GAC7BC,WAAY,SACZC,SAAUb,EAAW,SAAW,WAChCc,OAAQd,EAAW,EAAI,~~WAGnBe~~,EAAyBrB,EAAAA,OAAO,MAAM;;EAItCsB,EAAgBtB,EAAAA,OAAOuB,EAAPvB,~~EAAgB~~,EAAGK,YAAO,CAC9CmB,WAAYnB,EAAMY,QAAQ,IAC1BQ,IAAK,CACHjB,SAAUH,EAAMK,WAAWgB,MAAMlB,~~6BAIhB~~,EACnBmB,OACAC,QACAC,WACAC,aAAY,EACZC,aACAC,UACAC,WACA1B,eAAe,cAEf,MAAM2B,EAAU,IAAIC,IAClBF,EACGG,~~QAAQC~~,GAAMA,EAAEC,~~YAChBC~~,~~MAAK~~,CAACC,EAAGC,IAAMD,EAAEE,QAAUD,EAAEC,~~UAC7BC~~,~~KAAKN~~,GAAMA,EAAEO,~~cAEZC~~,EAAYZ,EAASa,~~QAA~~+C,CAACC,EAAKC,KAC9ED,EAAIC,EAAMJ,YAAcI,EACjBD,~~IACN~~,CAAA,GAEG1C,EAAQ4C,IACRC,GAAYC,EAAc9C,EAAM+C,YAAYC,GAAG,WAG/CC,EAA2BJ,EAAW,SAAW,SAgCvD,OACEK,EAAAA,KAACxD,EAAe,CAAAyD,SAAA,CACb1B,GAAa2B,EAAAA,IAACC,EAAiB,CAAC7B,SAAUA,EAAUD,MAAOA,IAC5D6B,EAAAA,IAACpC,EAAsB,CAAAmC,SACrBC,MAACE,EAAkB,CAAAH,SACjBD,EAAAA,KAACK,EAAK,CAAA,aACQhC,YACH,iBAAmBE,EAAY,IAAIF,GAAOiC,QAAQ,IAAK,KAAKC,gBAAkB,IACvFC,GAAI,CACFC,UAAW,oBACXC,OAAQ,QACTT,SAAA,CAxCTC,EAAAA,IAACS,EAAS,CAAAV,SACRC,EAAAA,IAACU,EAAQ,CAAAX,SACNY,MAAMC,KAAKnC,GAASS,~~KAAI~~,CAACvC,EAAMkE,KAC9B,MAAM1B,WAAEA,EAAU2B,YAAEA,EAAWC,MAAEA,EAAQ,OAAMC,QAAEA,GAAY5B,EAAUzC,IAAS,CAAA,EAEhF,OACEqD,MAACxD,EAAe,CAEduE,MAAOA,EACPlE,SAAkB,IAARgE,IAAcpB,EACxB3C,aAAcA,EAAYiD,SAE1BD,EAAAA,sBACEE,EAAAA,IAAA,OAAA,CAAAD,SAAOe,IACNE,GACChB,EAAAA,IAACnC,EAAa,CAACoD,UAAU,cAAc9C,MAAO6C,EAAOjB,SACnDC,EAAAA,IAACkB,aAAU,CAAA,aAAY,OAAOC,KAAK,QAAOpB,SACxCC,MAACoB,EAAgB,CAAA,UAAS,mBAAmBD,KAAK,eAVrDhC,~~UAoCPa~~,MAACqB,EAAgB,CACf5C,QAASA,EACTP,KAAMA,EACNK,QAASA,EACT+C,KAAMlC,EACNd,WAAYA,EACZiD,KAAM1B"}
1	+ {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/molecules/GenericTable/index.tsx"],"sourcesContent":["import Table from '@mui/material/Table';\nimport TableCell from '@mui/material/TableCell';\nimport TableHead from '@mui/material/TableHead';\nimport TableRow from '@mui/material/TableRow';\nimport Tooltip from '@mui/material/Tooltip';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n\nimport IconButton from '@fd/components/atoms/IconButton';\nimport styled from '@fd/utilities/styledUtilities';\nimport useTheme from '@fd/utilities/useTheme';\n\nimport InfoOutlinedIcon from '../../../icons/InformationCircle';\nimport GenericTableBody, { type GenericTableColumns } from './GenericTableBody';\nimport GenericTableTitle from './GenericTableTitle';\nimport HighlightScrollbar from './HighlightScrollbar';\n\ninterface GenericTableProps {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n data?: any[];\n loading?: boolean;\n metadata: GenericTableColumns[];\n // eslint-disable-next-line @typescript-eslint/ban-types\n onRowClick?: Function;\n showTitle?: boolean;\n subTitle?: string;\n title?: string;\n titleVariant?: 'default' \| 'light';\n}\n\nconst StyledContainer = styled('div')`\n overflow-x: auto;\n &::-webkit-scrollbar {\n padding: 2px 0;\n height: 6px;\n border: 1px solid #d5d5d5;\n }\n &::-webkit-scrollbar-track {\n background: #f1f1f1;\n }\n &::-webkit-scrollbar-thumb {\n background: #f5f5f5;\n border-radius: 3px;\n }\n`;\n\nconst StyledTableCell = styled(TableCell, {\n shouldForwardProp: (prop) => prop !== 'isSticky' && prop !== 'titleVariant',\n})<{ isSticky: boolean; titleVariant: 'default' \| 'light' }>(({ theme, isSticky, titleVariant }) => ({\n fontSize: 13,\n fontWeight: titleVariant === 'light' ? 400 : theme.typography.fontWeightMedium,\n color:\n titleVariant === 'light'\n ? theme.palette.semantic.text['text-weak']\n : theme.palette.semantic.text['text-strong'],\n padding: theme.spacing(1.25, 2),\n whiteSpace: 'nowrap',\n position: isSticky ? 'sticky' : 'relative',\n zIndex: isSticky ? 1 : 'auto',\n}));\n\nconst StyledSpacingContainer = styled('div')`\n overflow: hidden;\n`;\n\nconst StyledTooltip = styled(Tooltip)(({ theme }) => ({\n marginLeft: theme.spacing(0.5),\n svg: {\n fontSize: theme.typography.body1.fontSize,\n },\n}));\n\nconst GenericTable = ({\n data,\n title,\n subTitle,\n showTitle = true,\n onRowClick,\n loading,\n metadata,\n titleVariant = 'default',\n}: GenericTableProps) => {\n const columns = new Set(\n metadata\n .filter((m) => m.isVisible)\n .sort((a, b) => a.ordinal - b.ordinal)\n .map((m) => m.columnName),\n );\n const tableMeta = metadata.reduce<{ [key: string]: GenericTableColumns }>((obj, mData) => {\n obj[mData.columnName] = mData;\n return obj;\n }, {});\n\n const theme = useTheme();\n const isMobile = !useMediaQuery(theme.breakpoints.up('tablet'));\n\n // We never want sticky on mobile - only on desktop\n const firstColumnStylePosition = isMobile ? 'normal' : 'sticky';\n\n const renderTableHeader = () => (\n <TableHead>\n <TableRow>\n {Array.from(columns).map((prop, idx) => {\n const { columnName, columnTitle, align = 'left', tooltip } = tableMeta[prop] \|\| {};\n\n return (\n <StyledTableCell\n key={columnName}\n align={align}\n isSticky={idx === 0 && !isMobile}\n titleVariant={titleVariant}\n >\n <div>\n <span>{columnTitle}</span>\n {tooltip && (\n <StyledTooltip placement=\"right-start\" title={tooltip}>\n <IconButton aria-label=\"Info\" size=\"small\">\n <InfoOutlinedIcon data-fd=\"InfoOutlinedIcon\" size=\"sm\" />\n </IconButton>\n </StyledTooltip>\n )}\n </div>\n </StyledTableCell>\n );\n })}\n </TableRow>\n </TableHead>\n );\n\n return (\n <StyledContainer>\n {showTitle && <GenericTableTitle subTitle={subTitle} title={title}></GenericTableTitle>}\n <StyledSpacingContainer>\n <HighlightScrollbar>\n <Table\n aria-label={title}\n data-fd={`generic-table` + (showTitle ? `-${title?.replace(' ', '-').toLowerCase()}` : '')}\n sx={{\n borderTop: '1px solid #e0e0e0',\n height: '10vh',\n }}\n >\n {renderTableHeader()}\n <GenericTableBody\n columns={columns}\n data={data}\n loading={loading}\n meta={tableMeta}\n onRowClick={onRowClick}\n type={firstColumnStylePosition}\n />\n </Table>\n </HighlightScrollbar>\n </StyledSpacingContainer>\n </StyledContainer>\n );\n};\n\nexport default GenericTable;\n"],"names":["StyledContainer","styled","StyledTableCell","TableCell","shouldForwardProp","prop","theme","isSticky","titleVariant","fontSize","fontWeight","typography","fontWeightMedium","color","palette","semantic","text","padding","spacing","whiteSpace","position","zIndex","StyledSpacingContainer","StyledTooltip","Tooltip","marginLeft","svg","body1","data","title","subTitle","showTitle","onRowClick","loading","metadata","columns","Set","filter","m","isVisible","sort","a","b","ordinal","map","columnName","tableMeta","reduce","obj","mData","useTheme","isMobile","useMediaQuery","breakpoints","up","firstColumnStylePosition","_jsxs","children","_jsx","GenericTableTitle","HighlightScrollbar","Table","replace","toLowerCase","sx","borderTop","height","TableHead","TableRow","Array","from","idx","columnTitle","align","tooltip","placement","IconButton","size","InfoOutlinedIcon","GenericTableBody","meta","type"],"mappings":"wkBA6BA,MAAMA,EAAkBC,EAAAA,OAAO,MAAM;;;;;;;;;;;;;;EAgB/BC,EAAkBD,EAAAA,OAAOE,EAAW,CACxCC,kBAAoBC,GAAkB,aAATA,GAAgC,iBAATA,GAD9BJ,CAEqC,EAAGK,QAAOC,WAAUC,mBAAc,CAC7FC,SAAU,GACVC,WAA6B,UAAjBF,EAA2B,IAAMF,EAAMK,WAAWC,iBAC9DC,MACmB,UAAjBL,EACIF,EAAMQ,QAAQC,SAASC,KAAK,aAC5BV,EAAMQ,QAAQC,SAASC,KAAK,eAClCC,QAASX,EAAMY,QAAQ,KAAM,GAC7BC,WAAY,SACZC,SAAUb,EAAW,SAAW,WAChCc,OAAQd,EAAW,EAAI,UAGnBe,EAAyBrB,EAAAA,OAAO,MAAM;;EAItCsB,EAAgBtB,EAAAA,OAAOuB,EAAPvB,CAAgB,EAAGK,YAAO,CAC9CmB,WAAYnB,EAAMY,QAAQ,IAC1BQ,IAAK,CACHjB,SAAUH,EAAMK,WAAWgB,MAAMlB,4BAIhB,EACnBmB,OACAC,QACAC,WACAC,aAAY,EACZC,aACAC,UACAC,WACA1B,eAAe,cAEf,MAAM2B,EAAU,IAAIC,IAClBF,EACGG,OAAQC,GAAMA,EAAEC,WAChBC,KAAK,CAACC,EAAGC,IAAMD,EAAEE,QAAUD,EAAEC,SAC7BC,IAAKN,GAAMA,EAAEO,aAEZC,EAAYZ,EAASa,OAA+C,CAACC,EAAKC,KAC9ED,EAAIC,EAAMJ,YAAcI,EACjBD,GACN,CAAA,GAEG1C,EAAQ4C,IACRC,GAAYC,EAAc9C,EAAM+C,YAAYC,GAAG,WAG/CC,EAA2BJ,EAAW,SAAW,SAgCvD,OACEK,EAAAA,KAACxD,EAAe,CAAAyD,SAAA,CACb1B,GAAa2B,EAAAA,IAACC,EAAiB,CAAC7B,SAAUA,EAAUD,MAAOA,IAC5D6B,EAAAA,IAACpC,EAAsB,CAAAmC,SACrBC,MAACE,EAAkB,CAAAH,SACjBD,EAAAA,KAACK,EAAK,CAAA,aACQhC,YACH,iBAAmBE,EAAY,IAAIF,GAAOiC,QAAQ,IAAK,KAAKC,gBAAkB,IACvFC,GAAI,CACFC,UAAW,oBACXC,OAAQ,QACTT,SAAA,CAxCTC,EAAAA,IAACS,EAAS,CAAAV,SACRC,EAAAA,IAACU,EAAQ,CAAAX,SACNY,MAAMC,KAAKnC,GAASS,IAAI,CAACvC,EAAMkE,KAC9B,MAAM1B,WAAEA,EAAU2B,YAAEA,EAAWC,MAAEA,EAAQ,OAAMC,QAAEA,GAAY5B,EAAUzC,IAAS,CAAA,EAEhF,OACEqD,MAACxD,EAAe,CAEduE,MAAOA,EACPlE,SAAkB,IAARgE,IAAcpB,EACxB3C,aAAcA,EAAYiD,SAE1BD,EAAAA,sBACEE,EAAAA,IAAA,OAAA,CAAAD,SAAOe,IACNE,GACChB,EAAAA,IAACnC,EAAa,CAACoD,UAAU,cAAc9C,MAAO6C,EAAOjB,SACnDC,EAAAA,IAACkB,aAAU,CAAA,aAAY,OAAOC,KAAK,QAAOpB,SACxCC,MAACoB,EAAgB,CAAA,UAAS,mBAAmBD,KAAK,eAVrDhC,SAoCPa,MAACqB,EAAgB,CACf5C,QAASA,EACTP,KAAMA,EACNK,QAASA,EACT+C,KAAMlC,EACNd,WAAYA,EACZiD,KAAM1B"}

package/dist/components/molecules/GenericTable/index.js CHANGED Viewed

@@ -12,7 +12,7 @@ import{jsxs as e,jsx as t}from"react/jsx-runtime";import i from"@mui/material/Ta
     background: #f5f5f5;
     border-radius: 3px;
   }
-`,b=d(r,{shouldForwardProp:e=>"isSticky"!==e&&"titleVariant"!==e})((({theme:e,isSticky:t,titleVariant:i})=>({fontSize:13,fontWeight:"light"===i?400:e.typography.fontWeightMedium,color:"light"===i?e.palette.semantic.text["text-weak"]:e.palette.semantic.text["text-strong"],padding:e.spacing(1.25,2),whiteSpace:"nowrap",position:t?"sticky":"relative",zIndex:t?1:"auto"}))),g=d("div")`
+`,b=d(r,{shouldForwardProp:e=>"isSticky"!==e&&"titleVariant"!==e})(({theme:e,isSticky:t,titleVariant:i})=>({fontSize:13,fontWeight:"light"===i?400:e.typography.fontWeightMedium,color:"light"===i?e.palette.semantic.text["text-weak"]:e.palette.semantic.text["text-strong"],padding:e.spacing(1.25,2),whiteSpace:"nowrap",position:t?"sticky":"relative",zIndex:t?1:"auto"})),g=d("div")`
   overflow: hidden;
-`,x=d(l)((({theme:e})=>({marginLeft:e.spacing(.5),svg:{fontSize:e.typography.body1.fontSize}}))),y=({data:r,title:l,subTitle:d,showTitle:y=!0,onRowClick:k,loading:w,metadata:T,titleVariant:S="default"})=>{const v=new Set(T.filter((e=>e.isVisible)).sort(((e,t)=>e.ordinal-t.ordinal)).map((e=>e.columnName))),j=T.reduce(((e,t)=>(e[t.columnName]=t,e)),{}),z=s(),I=!n(z.breakpoints.up("tablet")),C=I?"normal":"sticky";return e(h,{children:[y&&t(f,{subTitle:d,title:l}),t(g,{children:t(u,{children:e(i,{"aria-label":l,"data-fd":"generic-table"+(y?`-${l?.replace(" ","-").toLowerCase()}`:""),sx:{borderTop:"1px solid #e0e0e0",height:"10vh"},children:[t(a,{children:t(o,{children:Array.from(v).map(((i,r)=>{const{columnName:a,columnTitle:o,align:l="left",tooltip:n}=j[i]||{};return t(b,{align:l,isSticky:0===r&&!I,titleVariant:S,children:e("div",{children:[t("span",{children:o}),n&&t(x,{placement:"right-start",title:n,children:t(m,{"aria-label":"Info",size:"small",children:t(c,{"data-fd":"InfoOutlinedIcon",size:"sm"})})})]})},a)}))})}),t(p,{columns:v,data:r,loading:w,meta:j,onRowClick:k,type:C})]})})})]})};export{y as default};
+`,x=d(l)(({theme:e})=>({marginLeft:e.spacing(.5),svg:{fontSize:e.typography.body1.fontSize}})),y=({data:r,title:l,subTitle:d,showTitle:y=!0,onRowClick:k,loading:w,metadata:T,titleVariant:S="default"})=>{const v=new Set(T.filter(e=>e.isVisible).sort((e,t)=>e.ordinal-t.ordinal).map(e=>e.columnName)),j=T.reduce((e,t)=>(e[t.columnName]=t,e),{}),z=s(),I=!n(z.breakpoints.up("tablet")),C=I?"normal":"sticky";return e(h,{children:[y&&t(f,{subTitle:d,title:l}),t(g,{children:t(u,{children:e(i,{"aria-label":l,"data-fd":"generic-table"+(y?`-${l?.replace(" ","-").toLowerCase()}`:""),sx:{borderTop:"1px solid #e0e0e0",height:"10vh"},children:[t(a,{children:t(o,{children:Array.from(v).map((i,r)=>{const{columnName:a,columnTitle:o,align:l="left",tooltip:n}=j[i]||{};return t(b,{align:l,isSticky:0===r&&!I,titleVariant:S,children:e("div",{children:[t("span",{children:o}),n&&t(x,{placement:"right-start",title:n,children:t(m,{"aria-label":"Info",size:"small",children:t(c,{"data-fd":"InfoOutlinedIcon",size:"sm"})})})]})},a)})})}),t(p,{columns:v,data:r,loading:w,meta:j,onRowClick:k,type:C})]})})})]})};export{y as default};
 //# sourceMappingURL=index.js.map

package/dist/components/molecules/GenericTable/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../../src/components/molecules/GenericTable/index.tsx"],"sourcesContent":["import Table from '@mui/material/Table';\nimport TableCell from '@mui/material/TableCell';\nimport TableHead from '@mui/material/TableHead';\nimport TableRow from '@mui/material/TableRow';\nimport Tooltip from '@mui/material/Tooltip';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n\nimport IconButton from '@fd/components/atoms/IconButton';\nimport styled from '@fd/utilities/styledUtilities';\nimport useTheme from '@fd/utilities/useTheme';\n\nimport InfoOutlinedIcon from '../../../icons/InformationCircle';\nimport GenericTableBody, { type GenericTableColumns } from './GenericTableBody';\nimport GenericTableTitle from './GenericTableTitle';\nimport HighlightScrollbar from './HighlightScrollbar';\n\ninterface GenericTableProps {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n data?: any[];\n loading?: boolean;\n metadata: GenericTableColumns[];\n // eslint-disable-next-line @typescript-eslint/ban-types\n onRowClick?: Function;\n showTitle?: boolean;\n subTitle?: string;\n title?: string;\n titleVariant?: 'default' \| 'light';\n}\n\nconst StyledContainer = styled('div')`\n overflow-x: auto;\n &::-webkit-scrollbar {\n padding: 2px 0;\n height: 6px;\n border: 1px solid #d5d5d5;\n }\n &::-webkit-scrollbar-track {\n background: #f1f1f1;\n }\n &::-webkit-scrollbar-thumb {\n background: #f5f5f5;\n border-radius: 3px;\n }\n`;\n\nconst StyledTableCell = styled(TableCell, {\n shouldForwardProp: (prop) => prop !== 'isSticky' && prop !== 'titleVariant',\n})<{ isSticky: boolean; titleVariant: 'default' \| 'light' }>(({ theme, isSticky, titleVariant }) => ({\n fontSize: 13,\n fontWeight: titleVariant === 'light' ? 400 : theme.typography.fontWeightMedium,\n color:\n titleVariant === 'light'\n ? theme.palette.semantic.text['text-weak']\n : theme.palette.semantic.text['text-strong'],\n padding: theme.spacing(1.25, 2),\n whiteSpace: 'nowrap',\n position: isSticky ? 'sticky' : 'relative',\n zIndex: isSticky ? 1 : 'auto',\n}));\n\nconst StyledSpacingContainer = styled('div')`\n overflow: hidden;\n`;\n\nconst StyledTooltip = styled(Tooltip)(({ theme }) => ({\n marginLeft: theme.spacing(0.5),\n svg: {\n fontSize: theme.typography.body1.fontSize,\n },\n}));\n\nconst GenericTable = ({\n data,\n title,\n subTitle,\n showTitle = true,\n onRowClick,\n loading,\n metadata,\n titleVariant = 'default',\n}: GenericTableProps) => {\n const columns = new Set(\n metadata\n .filter((m) => m.isVisible)\n .sort((a, b) => a.ordinal - b.ordinal)\n .map((m) => m.columnName),\n );\n const tableMeta = metadata.reduce<{ [key: string]: GenericTableColumns }>((obj, mData) => {\n obj[mData.columnName] = mData;\n return obj;\n }, {});\n\n const theme = useTheme();\n const isMobile = !useMediaQuery(theme.breakpoints.up('tablet'));\n\n // We never want sticky on mobile - only on desktop\n const firstColumnStylePosition = isMobile ? 'normal' : 'sticky';\n\n const renderTableHeader = () => (\n <TableHead>\n <TableRow>\n {Array.from(columns).map((prop, idx) => {\n const { columnName, columnTitle, align = 'left', tooltip } = tableMeta[prop] \|\| {};\n\n return (\n <StyledTableCell\n key={columnName}\n align={align}\n isSticky={idx === 0 && !isMobile}\n titleVariant={titleVariant}\n >\n <div>\n <span>{columnTitle}</span>\n {tooltip && (\n <StyledTooltip placement=\"right-start\" title={tooltip}>\n <IconButton aria-label=\"Info\" size=\"small\">\n <InfoOutlinedIcon data-fd=\"InfoOutlinedIcon\" size=\"sm\" />\n </IconButton>\n </StyledTooltip>\n )}\n </div>\n </StyledTableCell>\n );\n })}\n </TableRow>\n </TableHead>\n );\n\n return (\n <StyledContainer>\n {showTitle && <GenericTableTitle subTitle={subTitle} title={title}></GenericTableTitle>}\n <StyledSpacingContainer>\n <HighlightScrollbar>\n <Table\n aria-label={title}\n data-fd={`generic-table` + (showTitle ? `-${title?.replace(' ', '-').toLowerCase()}` : '')}\n sx={{\n borderTop: '1px solid #e0e0e0',\n height: '10vh',\n }}\n >\n {renderTableHeader()}\n <GenericTableBody\n columns={columns}\n data={data}\n loading={loading}\n meta={tableMeta}\n onRowClick={onRowClick}\n type={firstColumnStylePosition}\n />\n </Table>\n </HighlightScrollbar>\n </StyledSpacingContainer>\n </StyledContainer>\n );\n};\n\nexport default GenericTable;\n"],"names":["StyledContainer","styled","StyledTableCell","TableCell","shouldForwardProp","prop","theme","isSticky","titleVariant","fontSize","fontWeight","typography","fontWeightMedium","color","palette","semantic","text","padding","spacing","whiteSpace","position","zIndex","StyledSpacingContainer","StyledTooltip","Tooltip","marginLeft","svg","body1","GenericTable","data","title","subTitle","showTitle","onRowClick","loading","metadata","columns","Set","filter","m","isVisible","sort","a","b","ordinal","map","columnName","tableMeta","reduce","obj","mData","useTheme","isMobile","useMediaQuery","breakpoints","up","firstColumnStylePosition","_jsxs","children","_jsx","GenericTableTitle","HighlightScrollbar","Table","replace","toLowerCase","sx","borderTop","height","TableHead","TableRow","Array","from","idx","columnTitle","align","tooltip","placement","IconButton","size","InfoOutlinedIcon","GenericTableBody","meta","type"],"mappings":"wmBA6BA,MAAMA,EAAkBC,EAAO,MAAM;;;;;;;;;;;;;;EAgB/BC,EAAkBD,EAAOE,EAAW,CACxCC,kBAAoBC,GAAkB,aAATA,GAAgC,iBAATA,GAD9BJ,~~EAEqC~~,EAAGK,QAAOC,WAAUC,mBAAc,CAC7FC,SAAU,GACVC,WAA6B,UAAjBF,EAA2B,IAAMF,EAAMK,WAAWC,iBAC9DC,MACmB,UAAjBL,EACIF,EAAMQ,QAAQC,SAASC,KAAK,aAC5BV,EAAMQ,QAAQC,SAASC,KAAK,eAClCC,QAASX,EAAMY,QAAQ,KAAM,GAC7BC,WAAY,SACZC,SAAUb,EAAW,SAAW,WAChCc,OAAQd,EAAW,EAAI,~~WAGnBe~~,EAAyBrB,EAAO,MAAM;;EAItCsB,EAAgBtB,EAAOuB,EAAPvB,~~EAAgB~~,EAAGK,YAAO,CAC9CmB,WAAYnB,EAAMY,QAAQ,IAC1BQ,IAAK,CACHjB,SAAUH,EAAMK,WAAWgB,MAAMlB,~~cAI~~/BmB,EAAe,EACnBC,OACAC,QACAC,WACAC,aAAY,EACZC,aACAC,UACAC,WACA3B,eAAe,cAEf,MAAM4B,EAAU,IAAIC,IAClBF,EACGG,~~QAAQC~~,GAAMA,EAAEC,~~YAChBC~~,~~MAAK~~,CAACC,EAAGC,IAAMD,EAAEE,QAAUD,EAAEC,~~UAC7BC~~,~~KAAKN~~,GAAMA,EAAEO,~~cAEZC~~,EAAYZ,EAASa,~~QAA~~+C,CAACC,EAAKC,KAC9ED,EAAIC,EAAMJ,YAAcI,EACjBD,~~IACN~~,CAAA,GAEG3C,EAAQ6C,IACRC,GAAYC,EAAc/C,EAAMgD,YAAYC,GAAG,WAG/CC,EAA2BJ,EAAW,SAAW,SAgCvD,OACEK,EAACzD,EAAe,CAAA0D,SAAA,CACb1B,GAAa2B,EAACC,EAAiB,CAAC7B,SAAUA,EAAUD,MAAOA,IAC5D6B,EAACrC,EAAsB,CAAAoC,SACrBC,EAACE,EAAkB,CAAAH,SACjBD,EAACK,EAAK,CAAA,aACQhC,YACH,iBAAmBE,EAAY,IAAIF,GAAOiC,QAAQ,IAAK,KAAKC,gBAAkB,IACvFC,GAAI,CACFC,UAAW,oBACXC,OAAQ,QACTT,SAAA,CAxCTC,EAACS,EAAS,CAAAV,SACRC,EAACU,EAAQ,CAAAX,SACNY,MAAMC,KAAKnC,GAASS,~~KAAI~~,CAACxC,EAAMmE,KAC9B,MAAM1B,WAAEA,EAAU2B,YAAEA,EAAWC,MAAEA,EAAQ,OAAMC,QAAEA,GAAY5B,EAAU1C,IAAS,CAAA,EAEhF,OACEsD,EAACzD,EAAe,CAEdwE,MAAOA,EACPnE,SAAkB,IAARiE,IAAcpB,EACxB5C,aAAcA,EAAYkD,SAE1BD,mBACEE,EAAA,OAAA,CAAAD,SAAOe,IACNE,GACChB,EAACpC,EAAa,CAACqD,UAAU,cAAc9C,MAAO6C,EAAOjB,SACnDC,EAACkB,EAAU,CAAA,aAAY,OAAOC,KAAK,QAAOpB,SACxCC,EAACoB,EAAgB,CAAA,UAAS,mBAAmBD,KAAK,eAVrDhC,~~UAoCPa~~,EAACqB,EAAgB,CACf5C,QAASA,EACTP,KAAMA,EACNK,QAASA,EACT+C,KAAMlC,EACNd,WAAYA,EACZiD,KAAM1B"}
1	+ {"version":3,"file":"index.js","sources":["../../../../src/components/molecules/GenericTable/index.tsx"],"sourcesContent":["import Table from '@mui/material/Table';\nimport TableCell from '@mui/material/TableCell';\nimport TableHead from '@mui/material/TableHead';\nimport TableRow from '@mui/material/TableRow';\nimport Tooltip from '@mui/material/Tooltip';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n\nimport IconButton from '@fd/components/atoms/IconButton';\nimport styled from '@fd/utilities/styledUtilities';\nimport useTheme from '@fd/utilities/useTheme';\n\nimport InfoOutlinedIcon from '../../../icons/InformationCircle';\nimport GenericTableBody, { type GenericTableColumns } from './GenericTableBody';\nimport GenericTableTitle from './GenericTableTitle';\nimport HighlightScrollbar from './HighlightScrollbar';\n\ninterface GenericTableProps {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n data?: any[];\n loading?: boolean;\n metadata: GenericTableColumns[];\n // eslint-disable-next-line @typescript-eslint/ban-types\n onRowClick?: Function;\n showTitle?: boolean;\n subTitle?: string;\n title?: string;\n titleVariant?: 'default' \| 'light';\n}\n\nconst StyledContainer = styled('div')`\n overflow-x: auto;\n &::-webkit-scrollbar {\n padding: 2px 0;\n height: 6px;\n border: 1px solid #d5d5d5;\n }\n &::-webkit-scrollbar-track {\n background: #f1f1f1;\n }\n &::-webkit-scrollbar-thumb {\n background: #f5f5f5;\n border-radius: 3px;\n }\n`;\n\nconst StyledTableCell = styled(TableCell, {\n shouldForwardProp: (prop) => prop !== 'isSticky' && prop !== 'titleVariant',\n})<{ isSticky: boolean; titleVariant: 'default' \| 'light' }>(({ theme, isSticky, titleVariant }) => ({\n fontSize: 13,\n fontWeight: titleVariant === 'light' ? 400 : theme.typography.fontWeightMedium,\n color:\n titleVariant === 'light'\n ? theme.palette.semantic.text['text-weak']\n : theme.palette.semantic.text['text-strong'],\n padding: theme.spacing(1.25, 2),\n whiteSpace: 'nowrap',\n position: isSticky ? 'sticky' : 'relative',\n zIndex: isSticky ? 1 : 'auto',\n}));\n\nconst StyledSpacingContainer = styled('div')`\n overflow: hidden;\n`;\n\nconst StyledTooltip = styled(Tooltip)(({ theme }) => ({\n marginLeft: theme.spacing(0.5),\n svg: {\n fontSize: theme.typography.body1.fontSize,\n },\n}));\n\nconst GenericTable = ({\n data,\n title,\n subTitle,\n showTitle = true,\n onRowClick,\n loading,\n metadata,\n titleVariant = 'default',\n}: GenericTableProps) => {\n const columns = new Set(\n metadata\n .filter((m) => m.isVisible)\n .sort((a, b) => a.ordinal - b.ordinal)\n .map((m) => m.columnName),\n );\n const tableMeta = metadata.reduce<{ [key: string]: GenericTableColumns }>((obj, mData) => {\n obj[mData.columnName] = mData;\n return obj;\n }, {});\n\n const theme = useTheme();\n const isMobile = !useMediaQuery(theme.breakpoints.up('tablet'));\n\n // We never want sticky on mobile - only on desktop\n const firstColumnStylePosition = isMobile ? 'normal' : 'sticky';\n\n const renderTableHeader = () => (\n <TableHead>\n <TableRow>\n {Array.from(columns).map((prop, idx) => {\n const { columnName, columnTitle, align = 'left', tooltip } = tableMeta[prop] \|\| {};\n\n return (\n <StyledTableCell\n key={columnName}\n align={align}\n isSticky={idx === 0 && !isMobile}\n titleVariant={titleVariant}\n >\n <div>\n <span>{columnTitle}</span>\n {tooltip && (\n <StyledTooltip placement=\"right-start\" title={tooltip}>\n <IconButton aria-label=\"Info\" size=\"small\">\n <InfoOutlinedIcon data-fd=\"InfoOutlinedIcon\" size=\"sm\" />\n </IconButton>\n </StyledTooltip>\n )}\n </div>\n </StyledTableCell>\n );\n })}\n </TableRow>\n </TableHead>\n );\n\n return (\n <StyledContainer>\n {showTitle && <GenericTableTitle subTitle={subTitle} title={title}></GenericTableTitle>}\n <StyledSpacingContainer>\n <HighlightScrollbar>\n <Table\n aria-label={title}\n data-fd={`generic-table` + (showTitle ? `-${title?.replace(' ', '-').toLowerCase()}` : '')}\n sx={{\n borderTop: '1px solid #e0e0e0',\n height: '10vh',\n }}\n >\n {renderTableHeader()}\n <GenericTableBody\n columns={columns}\n data={data}\n loading={loading}\n meta={tableMeta}\n onRowClick={onRowClick}\n type={firstColumnStylePosition}\n />\n </Table>\n </HighlightScrollbar>\n </StyledSpacingContainer>\n </StyledContainer>\n );\n};\n\nexport default GenericTable;\n"],"names":["StyledContainer","styled","StyledTableCell","TableCell","shouldForwardProp","prop","theme","isSticky","titleVariant","fontSize","fontWeight","typography","fontWeightMedium","color","palette","semantic","text","padding","spacing","whiteSpace","position","zIndex","StyledSpacingContainer","StyledTooltip","Tooltip","marginLeft","svg","body1","GenericTable","data","title","subTitle","showTitle","onRowClick","loading","metadata","columns","Set","filter","m","isVisible","sort","a","b","ordinal","map","columnName","tableMeta","reduce","obj","mData","useTheme","isMobile","useMediaQuery","breakpoints","up","firstColumnStylePosition","_jsxs","children","_jsx","GenericTableTitle","HighlightScrollbar","Table","replace","toLowerCase","sx","borderTop","height","TableHead","TableRow","Array","from","idx","columnTitle","align","tooltip","placement","IconButton","size","InfoOutlinedIcon","GenericTableBody","meta","type"],"mappings":"wmBA6BA,MAAMA,EAAkBC,EAAO,MAAM;;;;;;;;;;;;;;EAgB/BC,EAAkBD,EAAOE,EAAW,CACxCC,kBAAoBC,GAAkB,aAATA,GAAgC,iBAATA,GAD9BJ,CAEqC,EAAGK,QAAOC,WAAUC,mBAAc,CAC7FC,SAAU,GACVC,WAA6B,UAAjBF,EAA2B,IAAMF,EAAMK,WAAWC,iBAC9DC,MACmB,UAAjBL,EACIF,EAAMQ,QAAQC,SAASC,KAAK,aAC5BV,EAAMQ,QAAQC,SAASC,KAAK,eAClCC,QAASX,EAAMY,QAAQ,KAAM,GAC7BC,WAAY,SACZC,SAAUb,EAAW,SAAW,WAChCc,OAAQd,EAAW,EAAI,UAGnBe,EAAyBrB,EAAO,MAAM;;EAItCsB,EAAgBtB,EAAOuB,EAAPvB,CAAgB,EAAGK,YAAO,CAC9CmB,WAAYnB,EAAMY,QAAQ,IAC1BQ,IAAK,CACHjB,SAAUH,EAAMK,WAAWgB,MAAMlB,aAI/BmB,EAAe,EACnBC,OACAC,QACAC,WACAC,aAAY,EACZC,aACAC,UACAC,WACA3B,eAAe,cAEf,MAAM4B,EAAU,IAAIC,IAClBF,EACGG,OAAQC,GAAMA,EAAEC,WAChBC,KAAK,CAACC,EAAGC,IAAMD,EAAEE,QAAUD,EAAEC,SAC7BC,IAAKN,GAAMA,EAAEO,aAEZC,EAAYZ,EAASa,OAA+C,CAACC,EAAKC,KAC9ED,EAAIC,EAAMJ,YAAcI,EACjBD,GACN,CAAA,GAEG3C,EAAQ6C,IACRC,GAAYC,EAAc/C,EAAMgD,YAAYC,GAAG,WAG/CC,EAA2BJ,EAAW,SAAW,SAgCvD,OACEK,EAACzD,EAAe,CAAA0D,SAAA,CACb1B,GAAa2B,EAACC,EAAiB,CAAC7B,SAAUA,EAAUD,MAAOA,IAC5D6B,EAACrC,EAAsB,CAAAoC,SACrBC,EAACE,EAAkB,CAAAH,SACjBD,EAACK,EAAK,CAAA,aACQhC,YACH,iBAAmBE,EAAY,IAAIF,GAAOiC,QAAQ,IAAK,KAAKC,gBAAkB,IACvFC,GAAI,CACFC,UAAW,oBACXC,OAAQ,QACTT,SAAA,CAxCTC,EAACS,EAAS,CAAAV,SACRC,EAACU,EAAQ,CAAAX,SACNY,MAAMC,KAAKnC,GAASS,IAAI,CAACxC,EAAMmE,KAC9B,MAAM1B,WAAEA,EAAU2B,YAAEA,EAAWC,MAAEA,EAAQ,OAAMC,QAAEA,GAAY5B,EAAU1C,IAAS,CAAA,EAEhF,OACEsD,EAACzD,EAAe,CAEdwE,MAAOA,EACPnE,SAAkB,IAARiE,IAAcpB,EACxB5C,aAAcA,EAAYkD,SAE1BD,mBACEE,EAAA,OAAA,CAAAD,SAAOe,IACNE,GACChB,EAACpC,EAAa,CAACqD,UAAU,cAAc9C,MAAO6C,EAAOjB,SACnDC,EAACkB,EAAU,CAAA,aAAY,OAAOC,KAAK,QAAOpB,SACxCC,EAACoB,EAAgB,CAAA,UAAS,mBAAmBD,KAAK,eAVrDhC,SAoCPa,EAACqB,EAAgB,CACf5C,QAASA,EACTP,KAAMA,EACNK,QAASA,EACT+C,KAAMlC,EACNd,WAAYA,EACZiD,KAAM1B"}

package/dist/components/molecules/Modal/index.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("react"),a=require("@mui/material/Modal"),i=require("@mui/material/Box"),r=require("../../atoms/Button/index.cjs.js"),o=require("@mui/material/Typography"),n=require("@mui/material/Stack"),s=require("@mui/material/styles"),l=require("@mui/material/useMediaQuery"),d=require("@mui/material/styles/useTheme"),c=require("../../../themes/tokens/breakpoints/breakpoints.cjs.js"),u=require("../../atoms/IconContainer/index.cjs.js"),m=require("../../Spacer/index.cjs.js");const p={iconContainer:{default:()=>"neutral",destructive:()=>"destructive"}},x=e=>p.iconContainer[e](),h=s.styled(i,{shouldForwardProp:e=>!["tone","size"].includes(e)})((({theme:e,size:t})=>({position:"absolute",backgroundColor:e.palette.semantic.background["background-overlay"],border:"none",borderRadius:e.radius["radius-16"],padding:e.spacing(4),boxShadow:"0px 1px 6px 0px rgba(0, 0, 0, 0.10), 0px 8px 16px 0px rgba(0, 0, 0, 0.15)",outline:"none",maxHeight:"90vh",overflowY:"auto",top:"50%",left:"50%",transform:"translate(-50%, -50%)",maxWidth:"large"===t?"700px":"500px",width:`calc(100% - ${e.spacing(4)})`,[e.breakpoints.down(c.breakpointValues.tablet)]:{..."small"===t&&{maxWidth:`calc(100% - ${e.spacing(4)})`,width:`calc(100% - ${e.spacing(4)})`,top:"auto",bottom:e.spacing(2),left:e.spacing(2),right:e.spacing(2),transform:"none",maxHeight:"70vh",overflowY:"auto",display:"flex",flexDirection:"column"},..."large"===t&&{height:`calc(100% - ${e.spacing(4)})`,maxHeight:`calc(100% - ${e.spacing(4)})`,overflowY:"auto",display:"flex",flexDirection:"column"}}}))),g=s.styled("img")((({theme:e})=>({width:"100%",height:"auto",borderRadius:e.radius["radius-8"]}))),f=s.styled(n)({justifyContent:"flex-start",alignItems:"center"}),b=s.styled(i)((({theme:e})=>({[e.breakpoints.down(c.breakpointValues.tablet)]:{flexGrow:1,display:"flex",flexDirection:"column",minHeight:"min-content",paddingBottom:e.spacing(3)}}))),j=t.memo((({open:t,onClose:i,tone:n="default",size:s="large",title:p,description:j,property:y,actions:w=[],className:v,fdKey:k,children:q})=>{const z=d(),$=l(z.breakpoints.down(c.breakpointValues.tablet)),C="string"==typeof y,B=w.length>0;return e.jsx(a,{"aria-describedby":`modal-description-${k??"default"}`,"aria-labelledby":`modal-title-${k??"default"}`,className:v,"data-fd":k,onClose:i,open:t,children:e.jsxs(h,{size:s,tone:n,children:[e.jsxs(b,{children:[y&&e.jsxs(e.Fragment,{children:[C?e.jsx(g,{alt:p??"Modal image",src:y}):e.jsx(u,{icon:y,style:"filled",tone:x(n)}),e.jsx(m,{size:16,variant:"horizontal"})]}),p&&e.jsx(o,{component:"h2",id:`modal-title-${k??"default"}`,variant:"h3Strong",children:p}),p&&j&&e.jsx(m,{size:8,variant:"horizontal"}),j&&e.jsx(o,{color:z.palette.semantic.text["text-weak"],id:`modal-description-${k??"default"}`,variant:"b1Weak",children:j}),q&&e.jsxs(e.Fragment,{children:[e.jsx(m,{size:24,variant:"horizontal"}),q]})]}),B&&e.jsxs(e.Fragment,{children:[e.jsx(m,{size:24,variant:"horizontal"}),e.jsx(f,{direction:$?"column":"row-reverse",spacing:2,children:e.jsx(f,{direction:$?"column-reverse":"row",spacing:2,width:$?"100%":"fit-content",children:w.map(((t,a)=>{const{label:i,id:o,...n}=t;return e.jsx(r.Button,{fdKey:o??`modal-action-${i.replace(/\s+/g,"-").toLowerCase()}`,fullWidth:$,...n,children:i},o??`modal-action-${a}-${i.replace(/\s+/g,"-").toLowerCase()}`)}))})})]})]})})}));j.displayName="Modal",module.exports=j;
+"use strict";var e=require("react/jsx-runtime"),t=require("react"),a=require("@mui/material/Modal"),i=require("@mui/material/Box"),r=require("../../atoms/Button/index.cjs.js"),o=require("@mui/material/styles"),n=require("@mui/material/Typography"),s=require("@mui/material/Stack"),l=require("@mui/material/useMediaQuery"),d=require("@mui/material/styles/useTheme"),c=require("../../../themes/tokens/breakpoints/breakpoints.cjs.js"),u=require("../../atoms/IconContainer/index.cjs.js"),m=require("../../Spacer/index.cjs.js");const p={iconContainer:{default:()=>"neutral",destructive:()=>"destructive"}},x=e=>p.iconContainer[e](),h=e=>"destructive"===e?"destructive":"brand",g=o.styled(i,{shouldForwardProp:e=>!["tone","size"].includes(e)})(({theme:e,size:t})=>({position:"absolute",backgroundColor:e.palette.semantic.background["background-overlay"],border:"none",borderRadius:e.radius["radius-16"],padding:e.spacing(4),boxShadow:"0px 1px 6px 0px rgba(0, 0, 0, 0.10), 0px 8px 16px 0px rgba(0, 0, 0, 0.15)",outline:"none",maxHeight:"90vh",overflowY:"auto",top:"50%",left:"50%",transform:"translate(-50%, -50%)",maxWidth:"large"===t?"700px":"500px",width:`calc(100% - ${e.spacing(4)})`,[e.breakpoints.down(c.breakpointValues.tablet)]:{..."small"===t&&{maxWidth:`calc(100% - ${e.spacing(4)})`,width:`calc(100% - ${e.spacing(4)})`,top:"auto",bottom:e.spacing(2),left:e.spacing(2),right:e.spacing(2),transform:"none",maxHeight:"70vh",overflowY:"auto",display:"flex",flexDirection:"column"},..."large"===t&&{height:`calc(100% - ${e.spacing(4)})`,maxHeight:`calc(100% - ${e.spacing(4)})`,overflowY:"auto",display:"flex",flexDirection:"column"}}})),b=o.styled("img")(({theme:e})=>({width:"100%",height:"auto",borderRadius:e.radius["radius-8"]})),f=o.styled(s)({justifyContent:"flex-start",alignItems:"center"}),j=o.styled(i)(({theme:e})=>({[e.breakpoints.down(c.breakpointValues.tablet)]:{flexGrow:1,display:"flex",flexDirection:"column",minHeight:"min-content",paddingBottom:e.spacing(3)}})),y=t.memo(({open:t,onClose:i,tone:o="default",size:s="large",title:p,description:y,property:v,actions:w=[],className:k,fdKey:q,children:z})=>{const $=d(),C=l($.breakpoints.down(c.breakpointValues.tablet)),B="string"==typeof v,F=w.length>0;return e.jsx(a,{"aria-describedby":`modal-description-${q??"default"}`,"aria-labelledby":`modal-title-${q??"default"}`,className:k,"data-fd":q,onClose:i,open:t,children:e.jsxs(g,{size:s,tone:o,children:[e.jsxs(j,{children:[v&&e.jsxs(e.Fragment,{children:[B?e.jsx(b,{alt:p??"Modal image",src:v}):e.jsx(u,{icon:v,style:"filled",tone:x(o)}),e.jsx(m,{size:16,variant:"horizontal"})]}),p&&e.jsx(n,{component:"h2",id:`modal-title-${q??"default"}`,variant:"h3Strong",children:p}),p&&y&&e.jsx(m,{size:8,variant:"horizontal"}),y&&e.jsx(n,{color:$.palette.semantic.text["text-weak"],id:`modal-description-${q??"default"}`,variant:"b1Weak",children:y}),z&&e.jsxs(e.Fragment,{children:[e.jsx(m,{size:24,variant:"horizontal"}),z]})]}),F&&e.jsxs(e.Fragment,{children:[e.jsx(m,{size:24,variant:"horizontal"}),e.jsx(f,{direction:C?"column":"row-reverse",spacing:2,children:e.jsx(f,{direction:C?"column-reverse":"row",spacing:2,width:C?"100%":"fit-content",children:w.map((t,a)=>{const{label:i,id:n,...s}=t;return e.jsx(r.Button,{fdKey:n??`modal-action-${i.replace(/\s+/g,"-").toLowerCase()}`,fullWidth:C,tone:h(o),...s,children:i},n??`modal-action-${a}-${i.replace(/\s+/g,"-").toLowerCase()}`)})})})]})]})})});y.displayName="Modal",module.exports=y;
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/molecules/Modal/index.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/molecules/Modal/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type /\nimport { memo } from 'react';\n\nimport MuiModal from '@mui/material/Modal';\n\nimport Box from '@fd/components/atoms/Box';\nimport Button, { type ButtonProps } from '@fd/components/atoms/Button';\nimport Typography from '@fd/components/atoms/Typography';\nimport Stack from '@fd/components/molecules/Stack';\nimport styled from '@fd/utilities/styledUtilities';\nimport useMediaQuery from '@fd/utilities/useMediaQuery';\nimport useTheme from '@fd/utilities/useTheme';\n\nimport { breakpointValues } from '../../../themes/tokens/breakpoints/breakpoints';\nimport IconContainer, { type IconContainerTones } from '../../atoms/IconContainer';\nimport Spacer from '../../Spacer';\n\n/* Visual tone of the modal /\nexport type ModalTones = 'default' \| 'destructive';\n\n/* Size variants for the modal /\nexport type ModalSizes = 'large' \| 'small';\n\n/* Action button configuration for Modal /\nexport interface ModalAction extends Omit<ButtonProps, 'children' \| 'fdKey' \| 'fullWidth'> {\n /* Label text for the button /\n label: string;\n /* Optional unique identifier for the button /\n id?: string;\n}\n\n/* Props for the Modal component /\nexport interface ModalProps {\n /* Whether the modal is open /\n open: boolean;\n /* Callback function when the modal is closed /\n onClose: () => void;\n /* Visual tone of the modal /\n tone?: ModalTones;\n /* Size variant of the modal /\n size?: ModalSizes;\n /* Main heading text of the modal /\n title?: string;\n /* Detailed description text of the modal /\n description?: string;\n /* Property element to display - can be an image URL (string) or an icon component (ReactNode) /\n property?: React.ReactNode \| string;\n /* Array of action buttons to display /\n actions?: ModalAction[];\n /* Additional CSS class names /\n className?: string;\n /* Test ID for testing and automation /\n fdKey?: string;\n /* Content to display in the modal /\n children?: React.ReactNode;\n}\n\nconst COLOURS = {\n iconContainer: {\n default: (): IconContainerTones => 'neutral',\n destructive: (): IconContainerTones => 'destructive',\n },\n button: {\n default: (): ButtonProps['color'] => 'primary',\n destructive: (): ButtonProps['color'] => 'error',\n },\n};\n\nconst getIconContainerTone = (tone: ModalTones): IconContainerTones => {\n return COLOURS.iconContainer[tone]();\n};\n\ninterface StyledModalBoxProps {\n tone: ModalTones;\n size: ModalSizes;\n}\n\nconst StyledModalBox = styled(Box, {\n shouldForwardProp: (prop) => !['tone', 'size'].includes(prop as string),\n})<StyledModalBoxProps>(({ theme, size }) => ({\n position: 'absolute',\n backgroundColor: theme.palette.semantic.background['background-overlay'],\n border: 'none',\n borderRadius: theme.radius['radius-16'],\n padding: theme.spacing(4),\n boxShadow: '0px 1px 6px 0px rgba(0, 0, 0, 0.10), 0px 8px 16px 0px rgba(0, 0, 0, 0.15)', // TODO: Pull shadow from tokens when setup\n outline: 'none',\n maxHeight: '90vh',\n overflowY: 'auto',\n\n // Desktop styles (default)\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n maxWidth: size === 'large' ? '700px' : '500px',\n width: `calc(100% - ${theme.spacing(4)})`,\n\n // Tablet & Mobile styles\n [theme.breakpoints.down(breakpointValues.tablet)]: {\n // Small size at bottom of screen\n ...(size === 'small' && {\n maxWidth: `calc(100% - ${theme.spacing(4)})`,\n width: `calc(100% - ${theme.spacing(4)})`,\n top: 'auto',\n bottom: theme.spacing(2),\n left: theme.spacing(2),\n right: theme.spacing(2),\n transform: 'none',\n maxHeight: '70vh',\n overflowY: 'auto',\n // Flex layout to push buttons to bottom when content is small\n display: 'flex',\n flexDirection: 'column',\n }),\n\n // Large size takes full screen\n ...(size === 'large' && {\n height: `calc(100% - ${theme.spacing(4)})`,\n maxHeight: `calc(100% - ${theme.spacing(4)})`,\n overflowY: 'auto',\n // Flex layout to push buttons to bottom when content is small\n display: 'flex',\n flexDirection: 'column',\n }),\n },\n}));\n\nconst StyledImage = styled('img')(({ theme }) => ({\n width: '100%',\n height: 'auto',\n borderRadius: theme.radius['radius-8'],\n}));\n\nconst StyledButtonStack = styled(Stack)({\n justifyContent: 'flex-start',\n alignItems: 'center',\n});\n\nconst StyledContentContainer = styled(Box)(({ theme }) => ({\n [theme.breakpoints.down(breakpointValues.tablet)]: {\n flexGrow: 1,\n display: 'flex',\n flexDirection: 'column',\n minHeight: 'min-content',\n paddingBottom: theme.spacing(3),\n },\n}));\n\n/\n Modal component is used to display content that temporarily blocks interaction with the main view.\n * It creates a focused mode for completing tasks or viewing important information without leaving the current page.\n \n The component is wrapped with React.memo to optimize performance by preventing unnecessary\n * re-renders when the component's props haven't changed.\n */\nconst Modal = memo(\n ({\n open,\n onClose,\n tone = 'default',\n size = 'large',\n title,\n description,\n property,\n actions = [],\n className,\n fdKey,\n children,\n }: ModalProps) => {\n const theme = useTheme();\n const isTabletOrMobile = useMediaQuery(theme.breakpoints.down(breakpointValues.tablet));\n\n const isImageUrl = typeof property === 'string';\n const showButtonSection = actions.length > 0;\n\n return (\n <MuiModal\n aria-describedby={`modal-description-${fdKey ?? 'default'}`}\n aria-labelledby={`modal-title-${fdKey ?? 'default'}`}\n className={className}\n data-fd={fdKey}\n onClose={onClose}\n open={open}\n >\n <StyledModalBox size={size} tone={tone}>\n <StyledContentContainer>\n {property && (\n <>\n {isImageUrl ? (\n <StyledImage alt={title ?? 'Modal image'} src={property} />\n ) : (\n <IconContainer icon={property} style=\"filled\" tone={getIconContainerTone(tone)} />\n )}\n <Spacer size={16} variant=\"horizontal\" />\n </>\n )}\n {title && (\n <Typography component=\"h2\" id={`modal-title-${fdKey ?? 'default'}`} variant=\"h3Strong\">\n {title}\n </Typography>\n )}\n {title && description && <Spacer size={8} variant=\"horizontal\" />}\n {description && (\n <Typography\n color={theme.palette.semantic.text['text-weak']}\n id={`modal-description-${fdKey ?? 'default'}`}\n variant=\"b1Weak\"\n >\n {description}\n </Typography>\n )}\n {children && (\n <>\n <Spacer size={24} variant=\"horizontal\" />\n {children}\n </>\n )}\n </StyledContentContainer>\n {showButtonSection && (\n <>\n <Spacer size={24} variant=\"horizontal\" />\n <StyledButtonStack direction={isTabletOrMobile ? 'column' : 'row-reverse'} spacing={2}>\n <StyledButtonStack\n direction={isTabletOrMobile ? 'column-reverse' : 'row'}\n spacing={2}\n width={isTabletOrMobile ? '100%' : 'fit-content'}\n >\n {actions.map((action, index) => {\n const { label, id, ...buttonProps } = action;\n return (\n <Button\n key={id ?? `modal-action-${index}-${label.replace(/\\s+/g, '-').toLowerCase()}`}\n fdKey={id ?? `modal-action-${label.replace(/\\s+/g, '-').toLowerCase()}`}\n fullWidth={isTabletOrMobile}\n {...buttonProps}\n >\n {label}\n </Button>\n );\n })}\n </StyledButtonStack>\n </StyledButtonStack>\n </>\n )}\n </StyledModalBox>\n </MuiModal>\n );\n },\n);\n\nModal.displayName = 'Modal';\n\nexport default Modal;\n"],"names":["COLOURS","iconContainer","default","destructive","getIconContainerTone","tone","StyledModalBox","styled","Box","shouldForwardProp","prop","includes","theme","size","position","backgroundColor","palette","semantic","background","border","borderRadius","radius","padding","spacing","boxShadow","outline","maxHeight","overflowY","top","left","transform","maxWidth","width","breakpoints","down","breakpointValues","tablet","bottom","right","display","flexDirection","height","StyledImage","StyledButtonStack","Stack","justifyContent","alignItems","StyledContentContainer","flexGrow","minHeight","paddingBottom","Modal","memo","open","onClose","title","description","property","actions","className","fdKey","children","useTheme","isTabletOrMobile","useMediaQuery","isImageUrl","showButtonSection","length","_jsx","MuiModal","_jsxs","alt","src","IconContainer","icon","style","Spacer","variant","Typography","component","id","color","text","_Fragment","direction","map","action","index","label","buttonProps","Button","replace","toLowerCase","fullWidth","displayName"],"mappings":"2gBAyDA,MAAMA,EAAU,CACdC,cAAe,CACbC,QAAS,IAA0B,UACnCC,YAAa,IAA0B,gBAQrCC,EAAwBC,GACrBL,EAAQC,cAAcI,KAQzBC,EAAiBC,EAAAA,OAAOC,EAAK,CACjCC,kBAAoBC,IAAU,CAAC,OAAQ,QAAQC,SAASD,IADnCH,EAEC,EAAGK,QAAOC,WAAM,CACtCC,SAAU,WACVC,gBAAiBH,EAAMI,QAAQC,SAASC,WAAW,sBACnDC,OAAQ,OACRC,aAAcR,EAAMS,OAAO,aAC3BC,QAASV,EAAMW,QAAQ,GACvBC,UAAW,4EACXC,QAAS,OACTC,UAAW,OACXC,UAAW,OAGXC,IAAK,MACLC,KAAM,MACNC,UAAW,wBACXC,SAAmB,UAATlB,EAAmB,QAAU,QACvCmB,MAAO,eAAepB,EAAMW,QAAQ,MAGpC,CAACX,EAAMqB,YAAYC,KAAKC,EAAAA,iBAAiBC,SAAU,IAEpC,UAATvB,GAAoB,CACtBkB,SAAU,eAAenB,EAAMW,QAAQ,MACvCS,MAAO,eAAepB,EAAMW,QAAQ,MACpCK,IAAK,OACLS,OAAQzB,EAAMW,QAAQ,GACtBM,KAAMjB,EAAMW,QAAQ,GACpBe,MAAO1B,EAAMW,QAAQ,GACrBO,UAAW,OACXJ,UAAW,OACXC,UAAW,OAEXY,QAAS,OACTC,cAAe,aAIJ,UAAT3B,GAAoB,CACtB4B,OAAQ,eAAe7B,EAAMW,QAAQ,MACrCG,UAAW,eAAed,EAAMW,QAAQ,MACxCI,UAAW,OAEXY,QAAS,OACTC,cAAe,eAKfE,EAAcnC,EAAAA,OAAO,MAAPA,EAAc,EAAGK,YAAO,CAC1CoB,MAAO,OACPS,OAAQ,OACRrB,aAAcR,EAAMS,OAAO,gBAGvBsB,EAAoBpC,EAAAA,OAAOqC,EAAPrC,CAAc,CACtCsC,eAAgB,aAChBC,WAAY,WAGRC,EAAyBxC,EAAAA,OAAOC,EAAPD,EAAY,EAAGK,YAAO,CACnD,CAACA,EAAMqB,YAAYC,KAAKC,EAAAA,iBAAiBC,SAAU,CACjDY,SAAU,EACVT,QAAS,OACTC,cAAe,SACfS,UAAW,cACXC,cAAetC,EAAMW,QAAQ,QAW3B4B,EAAQC,EAAAA,MACZ,EACEC,OACAC,UACAjD,OAAO,UACPQ,OAAO,QACP0C,QACAC,cACAC,WACAC,UAAU,GACVC,YACAC,QACAC,eAEA,MAAMjD,EAAQkD,IACRC,EAAmBC,EAAcpD,EAAMqB,YAAYC,KAAKC,EAAAA,iBAAiBC,SAEzE6B,EAAiC,iBAAbR,EACpBS,EAAoBR,EAAQS,OAAS,EAE3C,OACEC,EAAAA,IAACC,EAAQ,CAAA,mBACW,qBAAqBT,GAAS,YAAW,kBAC1C,eAAeA,GAAS,YACzCD,UAAWA,EAAS,UACXC,EACTN,QAASA,EACTD,KAAMA,EAAIQ,SAEVS,EAAAA,KAAChE,EAAc,CAACO,KAAMA,EAAMR,KAAMA,EAAIwD,SAAA,CACpCS,EAAAA,KAACvB,EAAsB,CAAAc,SAAA,CACpBJ,GACCa,6BACGL,EACCG,EAAAA,IAAC1B,EAAW,CAAC6B,IAAKhB,GAAS,cAAeiB,IAAKf,IAE/CW,MAACK,EAAa,CAACC,KAAMjB,EAAUkB,MAAM,SAAStE,KAAMD,EAAqBC,KAE3E+D,EAAAA,IAACQ,EAAM,CAAC/D,KAAM,GAAIgE,QAAQ,kBAG7BtB,GACCa,MAACU,EAAU,CAACC,UAAU,KAAKC,GAAI,eAAepB,GAAS,YAAaiB,QAAQ,WAAUhB,SACnFN,IAGJA,GAASC,GAAeY,EAAAA,IAACQ,EAAM,CAAC/D,KAAM,EAAGgE,QAAQ,eACjDrB,GACCY,EAAAA,IAACU,EAAU,CACTG,MAAOrE,EAAMI,QAAQC,SAASiE,KAAK,aACnCF,GAAI,qBAAqBpB,GAAS,YAClCiB,QAAQ,SAAQhB,SAEfL,IAGJK,GACCS,OAAAa,EAAAA,SAAA,CAAAtB,SAAA,CACEO,MAACQ,GAAO/D,KAAM,GAAIgE,QAAQ,eACzBhB,QAINK,GACCI,EAAAA,2BACEF,EAAAA,IAACQ,EAAM,CAAC/D,KAAM,GAAIgE,QAAQ,eAC1BT,EAAAA,IAACzB,EAAiB,CAACyC,UAAWrB,EAAmB,SAAW,cAAexC,QAAS,EAACsC,SACnFO,EAAAA,IAACzB,EAAiB,CAChByC,UAAWrB,EAAmB,iBAAmB,MACjDxC,QAAS,EACTS,MAAO+B,EAAmB,OAAS,uBAElCL,EAAQ2B,KAAI,CAACC,EAAQC,KACpB,MAAMC,MAAEA,EAAKR,GAAEA,KAAOS,GAAgBH,EACtC,OACElB,EAAAA,IAACsB,EAAAA,OAAM,CAEL9B,MAAOoB,GAAM,gBAAgBQ,EAAMG,QAAQ,OAAQ,KAAKC,gBACxDC,UAAW9B,KACP0B,WAEHD,GALIR,GAAM,gBAAgBO,KAASC,EAAMG,QAAQ,OAAQ,KAAKC,mCAmBvFzC,EAAM2C,YAAc"}
1	+ {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/molecules/Modal/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type /\nimport { memo } from 'react';\n\nimport MuiModal from '@mui/material/Modal';\n\nimport Box from '@fd/components/atoms/Box';\nimport Button, { type ButtonProps } from '@fd/components/atoms/Button';\nimport { type ButtonTone } from '@fd/components/atoms/Button/getButtonStyles';\nimport Typography from '@fd/components/atoms/Typography';\nimport Stack from '@fd/components/molecules/Stack';\nimport styled from '@fd/utilities/styledUtilities';\nimport useMediaQuery from '@fd/utilities/useMediaQuery';\nimport useTheme from '@fd/utilities/useTheme';\n\nimport { breakpointValues } from '../../../themes/tokens/breakpoints/breakpoints';\nimport IconContainer, { type IconContainerTones } from '../../atoms/IconContainer';\nimport Spacer from '../../Spacer';\n\n/* Visual tone of the modal /\nexport type ModalTones = 'default' \| 'destructive';\n\n/* Size variants for the modal /\nexport type ModalSizes = 'large' \| 'small';\n\n/* Action button configuration for Modal /\nexport interface ModalAction extends Omit<ButtonProps, 'children' \| 'fdKey' \| 'fullWidth'> {\n /* Label text for the button /\n label: string;\n /* Optional unique identifier for the button /\n id?: string;\n}\n\n/* Props for the Modal component /\nexport interface ModalProps {\n /* Whether the modal is open /\n open: boolean;\n /* Callback function when the modal is closed /\n onClose: () => void;\n /* Visual tone of the modal /\n tone?: ModalTones;\n /* Size variant of the modal /\n size?: ModalSizes;\n /* Main heading text of the modal /\n title?: string;\n /* Detailed description text of the modal /\n description?: string;\n /* Property element to display - can be an image URL (string) or an icon component (ReactNode) /\n property?: React.ReactNode \| string;\n /* Array of action buttons to display /\n actions?: ModalAction[];\n /* Additional CSS class names /\n className?: string;\n /* Test ID for testing and automation /\n fdKey?: string;\n /* Content to display in the modal /\n children?: React.ReactNode;\n}\n\nconst COLOURS = {\n iconContainer: {\n default: (): IconContainerTones => 'neutral',\n destructive: (): IconContainerTones => 'destructive',\n },\n button: {\n default: (): ButtonProps['color'] => 'primary',\n destructive: (): ButtonProps['color'] => 'error',\n },\n};\n\nconst getIconContainerTone = (tone: ModalTones): IconContainerTones => {\n return COLOURS.iconContainer[tone]();\n};\n\nconst getButtonTone = (tone: ModalTones): ButtonTone => {\n if (tone === 'destructive') {\n return 'destructive';\n }\n return 'brand';\n};\n\ninterface StyledModalBoxProps {\n tone: ModalTones;\n size: ModalSizes;\n}\n\nconst StyledModalBox = styled(Box, {\n shouldForwardProp: (prop) => !['tone', 'size'].includes(prop as string),\n})<StyledModalBoxProps>(({ theme, size }) => ({\n position: 'absolute',\n backgroundColor: theme.palette.semantic.background['background-overlay'],\n border: 'none',\n borderRadius: theme.radius['radius-16'],\n padding: theme.spacing(4),\n boxShadow: '0px 1px 6px 0px rgba(0, 0, 0, 0.10), 0px 8px 16px 0px rgba(0, 0, 0, 0.15)', // TODO: Pull shadow from tokens when setup\n outline: 'none',\n maxHeight: '90vh',\n overflowY: 'auto',\n\n // Desktop styles (default)\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n maxWidth: size === 'large' ? '700px' : '500px',\n width: `calc(100% - ${theme.spacing(4)})`,\n\n // Tablet & Mobile styles\n [theme.breakpoints.down(breakpointValues.tablet)]: {\n // Small size at bottom of screen\n ...(size === 'small' && {\n maxWidth: `calc(100% - ${theme.spacing(4)})`,\n width: `calc(100% - ${theme.spacing(4)})`,\n top: 'auto',\n bottom: theme.spacing(2),\n left: theme.spacing(2),\n right: theme.spacing(2),\n transform: 'none',\n maxHeight: '70vh',\n overflowY: 'auto',\n // Flex layout to push buttons to bottom when content is small\n display: 'flex',\n flexDirection: 'column',\n }),\n\n // Large size takes full screen\n ...(size === 'large' && {\n height: `calc(100% - ${theme.spacing(4)})`,\n maxHeight: `calc(100% - ${theme.spacing(4)})`,\n overflowY: 'auto',\n // Flex layout to push buttons to bottom when content is small\n display: 'flex',\n flexDirection: 'column',\n }),\n },\n}));\n\nconst StyledImage = styled('img')(({ theme }) => ({\n width: '100%',\n height: 'auto',\n borderRadius: theme.radius['radius-8'],\n}));\n\nconst StyledButtonStack = styled(Stack)({\n justifyContent: 'flex-start',\n alignItems: 'center',\n});\n\nconst StyledContentContainer = styled(Box)(({ theme }) => ({\n [theme.breakpoints.down(breakpointValues.tablet)]: {\n flexGrow: 1,\n display: 'flex',\n flexDirection: 'column',\n minHeight: 'min-content',\n paddingBottom: theme.spacing(3),\n },\n}));\n\n/\n Modal component is used to display content that temporarily blocks interaction with the main view.\n * It creates a focused mode for completing tasks or viewing important information without leaving the current page.\n \n The component is wrapped with React.memo to optimize performance by preventing unnecessary\n * re-renders when the component's props haven't changed.\n */\nconst Modal = memo(\n ({\n open,\n onClose,\n tone = 'default',\n size = 'large',\n title,\n description,\n property,\n actions = [],\n className,\n fdKey,\n children,\n }: ModalProps) => {\n const theme = useTheme();\n const isTabletOrMobile = useMediaQuery(theme.breakpoints.down(breakpointValues.tablet));\n\n const isImageUrl = typeof property === 'string';\n const showButtonSection = actions.length > 0;\n\n return (\n <MuiModal\n aria-describedby={`modal-description-${fdKey ?? 'default'}`}\n aria-labelledby={`modal-title-${fdKey ?? 'default'}`}\n className={className}\n data-fd={fdKey}\n onClose={onClose}\n open={open}\n >\n <StyledModalBox size={size} tone={tone}>\n <StyledContentContainer>\n {property && (\n <>\n {isImageUrl ? (\n <StyledImage alt={title ?? 'Modal image'} src={property} />\n ) : (\n <IconContainer icon={property} style=\"filled\" tone={getIconContainerTone(tone)} />\n )}\n <Spacer size={16} variant=\"horizontal\" />\n </>\n )}\n {title && (\n <Typography component=\"h2\" id={`modal-title-${fdKey ?? 'default'}`} variant=\"h3Strong\">\n {title}\n </Typography>\n )}\n {title && description && <Spacer size={8} variant=\"horizontal\" />}\n {description && (\n <Typography\n color={theme.palette.semantic.text['text-weak']}\n id={`modal-description-${fdKey ?? 'default'}`}\n variant=\"b1Weak\"\n >\n {description}\n </Typography>\n )}\n {children && (\n <>\n <Spacer size={24} variant=\"horizontal\" />\n {children}\n </>\n )}\n </StyledContentContainer>\n {showButtonSection && (\n <>\n <Spacer size={24} variant=\"horizontal\" />\n <StyledButtonStack direction={isTabletOrMobile ? 'column' : 'row-reverse'} spacing={2}>\n <StyledButtonStack\n direction={isTabletOrMobile ? 'column-reverse' : 'row'}\n spacing={2}\n width={isTabletOrMobile ? '100%' : 'fit-content'}\n >\n {actions.map((action, index) => {\n const { label, id, ...buttonProps } = action;\n return (\n <Button\n key={id ?? `modal-action-${index}-${label.replace(/\\s+/g, '-').toLowerCase()}`}\n fdKey={id ?? `modal-action-${label.replace(/\\s+/g, '-').toLowerCase()}`}\n fullWidth={isTabletOrMobile}\n tone={getButtonTone(tone)}\n {...buttonProps}\n >\n {label}\n </Button>\n );\n })}\n </StyledButtonStack>\n </StyledButtonStack>\n </>\n )}\n </StyledModalBox>\n </MuiModal>\n );\n },\n);\n\nModal.displayName = 'Modal';\n\nexport default Modal;\n"],"names":["COLOURS","iconContainer","default","destructive","getIconContainerTone","tone","getButtonTone","StyledModalBox","styled","Box","shouldForwardProp","prop","includes","theme","size","position","backgroundColor","palette","semantic","background","border","borderRadius","radius","padding","spacing","boxShadow","outline","maxHeight","overflowY","top","left","transform","maxWidth","width","breakpoints","down","breakpointValues","tablet","bottom","right","display","flexDirection","height","StyledImage","StyledButtonStack","Stack","justifyContent","alignItems","StyledContentContainer","flexGrow","minHeight","paddingBottom","Modal","memo","open","onClose","title","description","property","actions","className","fdKey","children","useTheme","isTabletOrMobile","useMediaQuery","isImageUrl","showButtonSection","length","_jsx","MuiModal","_jsxs","alt","src","IconContainer","icon","style","Spacer","variant","Typography","component","id","color","text","_Fragment","direction","map","action","index","label","buttonProps","Button","replace","toLowerCase","fullWidth","displayName"],"mappings":"2gBA0DA,MAAMA,EAAU,CACdC,cAAe,CACbC,QAAS,IAA0B,UACnCC,YAAa,IAA0B,gBAQrCC,EAAwBC,GACrBL,EAAQC,cAAcI,KAGzBC,EAAiBD,GACR,gBAATA,EACK,cAEF,QAQHE,EAAiBC,EAAAA,OAAOC,EAAK,CACjCC,kBAAoBC,IAAU,CAAC,OAAQ,QAAQC,SAASD,IADnCH,CAEC,EAAGK,QAAOC,WAAM,CACtCC,SAAU,WACVC,gBAAiBH,EAAMI,QAAQC,SAASC,WAAW,sBACnDC,OAAQ,OACRC,aAAcR,EAAMS,OAAO,aAC3BC,QAASV,EAAMW,QAAQ,GACvBC,UAAW,4EACXC,QAAS,OACTC,UAAW,OACXC,UAAW,OAGXC,IAAK,MACLC,KAAM,MACNC,UAAW,wBACXC,SAAmB,UAATlB,EAAmB,QAAU,QACvCmB,MAAO,eAAepB,EAAMW,QAAQ,MAGpC,CAACX,EAAMqB,YAAYC,KAAKC,EAAAA,iBAAiBC,SAAU,IAEpC,UAATvB,GAAoB,CACtBkB,SAAU,eAAenB,EAAMW,QAAQ,MACvCS,MAAO,eAAepB,EAAMW,QAAQ,MACpCK,IAAK,OACLS,OAAQzB,EAAMW,QAAQ,GACtBM,KAAMjB,EAAMW,QAAQ,GACpBe,MAAO1B,EAAMW,QAAQ,GACrBO,UAAW,OACXJ,UAAW,OACXC,UAAW,OAEXY,QAAS,OACTC,cAAe,aAIJ,UAAT3B,GAAoB,CACtB4B,OAAQ,eAAe7B,EAAMW,QAAQ,MACrCG,UAAW,eAAed,EAAMW,QAAQ,MACxCI,UAAW,OAEXY,QAAS,OACTC,cAAe,cAKfE,EAAcnC,EAAAA,OAAO,MAAPA,CAAc,EAAGK,YAAO,CAC1CoB,MAAO,OACPS,OAAQ,OACRrB,aAAcR,EAAMS,OAAO,eAGvBsB,EAAoBpC,EAAAA,OAAOqC,EAAPrC,CAAc,CACtCsC,eAAgB,aAChBC,WAAY,WAGRC,EAAyBxC,EAAAA,OAAOC,EAAPD,CAAY,EAAGK,YAAO,CACnD,CAACA,EAAMqB,YAAYC,KAAKC,EAAAA,iBAAiBC,SAAU,CACjDY,SAAU,EACVT,QAAS,OACTC,cAAe,SACfS,UAAW,cACXC,cAAetC,EAAMW,QAAQ,OAW3B4B,EAAQC,EAAAA,KACZ,EACEC,OACAC,UACAlD,OAAO,UACPS,OAAO,QACP0C,QACAC,cACAC,WACAC,UAAU,GACVC,YACAC,QACAC,eAEA,MAAMjD,EAAQkD,IACRC,EAAmBC,EAAcpD,EAAMqB,YAAYC,KAAKC,EAAAA,iBAAiBC,SAEzE6B,EAAiC,iBAAbR,EACpBS,EAAoBR,EAAQS,OAAS,EAE3C,OACEC,EAAAA,IAACC,EAAQ,CAAA,mBACW,qBAAqBT,GAAS,YAAW,kBAC1C,eAAeA,GAAS,YACzCD,UAAWA,EAAS,UACXC,EACTN,QAASA,EACTD,KAAMA,EAAIQ,SAEVS,EAAAA,KAAChE,EAAc,CAACO,KAAMA,EAAMT,KAAMA,EAAIyD,SAAA,CACpCS,EAAAA,KAACvB,EAAsB,CAAAc,SAAA,CACpBJ,GACCa,6BACGL,EACCG,EAAAA,IAAC1B,EAAW,CAAC6B,IAAKhB,GAAS,cAAeiB,IAAKf,IAE/CW,MAACK,EAAa,CAACC,KAAMjB,EAAUkB,MAAM,SAASvE,KAAMD,EAAqBC,KAE3EgE,EAAAA,IAACQ,EAAM,CAAC/D,KAAM,GAAIgE,QAAQ,kBAG7BtB,GACCa,MAACU,EAAU,CAACC,UAAU,KAAKC,GAAI,eAAepB,GAAS,YAAaiB,QAAQ,WAAUhB,SACnFN,IAGJA,GAASC,GAAeY,EAAAA,IAACQ,EAAM,CAAC/D,KAAM,EAAGgE,QAAQ,eACjDrB,GACCY,EAAAA,IAACU,EAAU,CACTG,MAAOrE,EAAMI,QAAQC,SAASiE,KAAK,aACnCF,GAAI,qBAAqBpB,GAAS,YAClCiB,QAAQ,SAAQhB,SAEfL,IAGJK,GACCS,OAAAa,EAAAA,SAAA,CAAAtB,SAAA,CACEO,MAACQ,GAAO/D,KAAM,GAAIgE,QAAQ,eACzBhB,QAINK,GACCI,EAAAA,2BACEF,EAAAA,IAACQ,EAAM,CAAC/D,KAAM,GAAIgE,QAAQ,eAC1BT,EAAAA,IAACzB,EAAiB,CAACyC,UAAWrB,EAAmB,SAAW,cAAexC,QAAS,EAACsC,SACnFO,EAAAA,IAACzB,EAAiB,CAChByC,UAAWrB,EAAmB,iBAAmB,MACjDxC,QAAS,EACTS,MAAO+B,EAAmB,OAAS,uBAElCL,EAAQ2B,IAAI,CAACC,EAAQC,KACpB,MAAMC,MAAEA,EAAKR,GAAEA,KAAOS,GAAgBH,EACtC,OACElB,EAAAA,IAACsB,EAAAA,OAAM,CAEL9B,MAAOoB,GAAM,gBAAgBQ,EAAMG,QAAQ,OAAQ,KAAKC,gBACxDC,UAAW9B,EACX3D,KAAMC,EAAcD,MAChBqF,EAAW5B,SAEd2B,GANIR,GAAM,gBAAgBO,KAASC,EAAMG,QAAQ,OAAQ,KAAKC,iCAoBvFzC,EAAM2C,YAAc"}

package/dist/components/molecules/Modal/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import{memo as a}from"react";import o from"@mui/material/Modal";import r from"@mui/material/Box";import{Button as n}from"../../atoms/Button/index.js";import l from"@mui/material/Typography";import s from"@mui/material/Stack";import{styled as d}from"@mui/material/styles";import m from"@mui/material/useMediaQuery";import c from"@mui/material/styles/useTheme";import{breakpointValues as p}from"../../../themes/tokens/breakpoints/breakpoints.js";import u from"../../atoms/IconContainer/index.js";import h from"../../Spacer/index.js";const f={iconContainer:{default:()=>"neutral",destructive:()=>"destructive"}},g=e=>f.iconContainer[e](),x=d(r,{shouldForwardProp:e=>!["tone","size"].includes(e)})((({theme:e,size:t})=>({position:"absolute",backgroundColor:e.palette.semantic.background["background-overlay"],border:"none",borderRadius:e.radius["radius-16"],padding:e.spacing(4),boxShadow:"0px 1px 6px 0px rgba(0, 0, 0, 0.10), 0px 8px 16px 0px rgba(0, 0, 0, 0.15)",outline:"none",maxHeight:"90vh",overflowY:"auto",top:"50%",left:"50%",transform:"translate(-50%, -50%)",maxWidth:"large"===t?"700px":"500px",width:`calc(100% - ${e.spacing(4)})`,[e.breakpoints.down(p.tablet)]:{..."small"===t&&{maxWidth:`calc(100% - ${e.spacing(4)})`,width:`calc(100% - ${e.spacing(4)})`,top:"auto",bottom:e.spacing(2),left:e.spacing(2),right:e.spacing(2),transform:"none",maxHeight:"70vh",overflowY:"auto",display:"flex",flexDirection:"column"},..."large"===t&&{height:`calc(100% - ${e.spacing(4)})`,maxHeight:`calc(100% - ${e.spacing(4)})`,overflowY:"auto",display:"flex",flexDirection:"column"}}}))),b=d("img")((({theme:e})=>({width:"100%",height:"auto",borderRadius:e.radius["radius-8"]}))),w=d(s)({justifyContent:"flex-start",alignItems:"center"}),y=d(r)((({theme:e})=>({[e.breakpoints.down(p.tablet)]:{flexGrow:1,display:"flex",flexDirection:"column",minHeight:"min-content",paddingBottom:e.spacing(3)}}))),v=a((({open:a,onClose:r,tone:s="default",size:d="large",title:f,description:v,property:k,actions:z=[],className:$,fdKey:C,children:j})=>{const H=c(),M=m(H.breakpoints.down(p.tablet)),S="string"==typeof k,W=z.length>0;return e(o,{"aria-describedby":`modal-description-${C??"default"}`,"aria-labelledby":`modal-title-${C??"default"}`,className:$,"data-fd":C,onClose:r,open:a,children:t(x,{size:d,tone:s,children:[t(y,{children:[k&&t(i,{children:[S?e(b,{alt:f??"Modal image",src:k}):e(u,{icon:k,style:"filled",tone:g(s)}),e(h,{size:16,variant:"horizontal"})]}),f&&e(l,{component:"h2",id:`modal-title-${C??"default"}`,variant:"h3Strong",children:f}),f&&v&&e(h,{size:8,variant:"horizontal"}),v&&e(l,{color:H.palette.semantic.text["text-weak"],id:`modal-description-${C??"default"}`,variant:"b1Weak",children:v}),j&&t(i,{children:[e(h,{size:24,variant:"horizontal"}),j]})]}),W&&t(i,{children:[e(h,{size:24,variant:"horizontal"}),e(w,{direction:M?"column":"row-reverse",spacing:2,children:e(w,{direction:M?"column-reverse":"row",spacing:2,width:M?"100%":"fit-content",children:z.map(((t,i)=>{const{label:a,id:o,...r}=t;return e(n,{fdKey:o??`modal-action-${a.replace(/\s+/g,"-").toLowerCase()}`,fullWidth:M,...r,children:a},o??`modal-action-${i}-${a.replace(/\s+/g,"-").toLowerCase()}`)}))})})]})]})})}));v.displayName="Modal";export{v as default};
+import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import{memo as a}from"react";import o from"@mui/material/Modal";import r from"@mui/material/Box";import{Button as n}from"../../atoms/Button/index.js";import{styled as l}from"@mui/material/styles";import s from"@mui/material/Typography";import d from"@mui/material/Stack";import c from"@mui/material/useMediaQuery";import m from"@mui/material/styles/useTheme";import{breakpointValues as p}from"../../../themes/tokens/breakpoints/breakpoints.js";import u from"../../atoms/IconContainer/index.js";import h from"../../Spacer/index.js";const f={iconContainer:{default:()=>"neutral",destructive:()=>"destructive"}},g=e=>f.iconContainer[e](),x=e=>"destructive"===e?"destructive":"brand",b=l(r,{shouldForwardProp:e=>!["tone","size"].includes(e)})(({theme:e,size:t})=>({position:"absolute",backgroundColor:e.palette.semantic.background["background-overlay"],border:"none",borderRadius:e.radius["radius-16"],padding:e.spacing(4),boxShadow:"0px 1px 6px 0px rgba(0, 0, 0, 0.10), 0px 8px 16px 0px rgba(0, 0, 0, 0.15)",outline:"none",maxHeight:"90vh",overflowY:"auto",top:"50%",left:"50%",transform:"translate(-50%, -50%)",maxWidth:"large"===t?"700px":"500px",width:`calc(100% - ${e.spacing(4)})`,[e.breakpoints.down(p.tablet)]:{..."small"===t&&{maxWidth:`calc(100% - ${e.spacing(4)})`,width:`calc(100% - ${e.spacing(4)})`,top:"auto",bottom:e.spacing(2),left:e.spacing(2),right:e.spacing(2),transform:"none",maxHeight:"70vh",overflowY:"auto",display:"flex",flexDirection:"column"},..."large"===t&&{height:`calc(100% - ${e.spacing(4)})`,maxHeight:`calc(100% - ${e.spacing(4)})`,overflowY:"auto",display:"flex",flexDirection:"column"}}})),v=l("img")(({theme:e})=>({width:"100%",height:"auto",borderRadius:e.radius["radius-8"]})),w=l(d)({justifyContent:"flex-start",alignItems:"center"}),y=l(r)(({theme:e})=>({[e.breakpoints.down(p.tablet)]:{flexGrow:1,display:"flex",flexDirection:"column",minHeight:"min-content",paddingBottom:e.spacing(3)}})),k=a(({open:a,onClose:r,tone:l="default",size:d="large",title:f,description:k,property:z,actions:$=[],className:C,fdKey:j,children:H})=>{const M=m(),S=c(M.breakpoints.down(p.tablet)),W="string"==typeof z,B=$.length>0;return e(o,{"aria-describedby":`modal-description-${j??"default"}`,"aria-labelledby":`modal-title-${j??"default"}`,className:C,"data-fd":j,onClose:r,open:a,children:t(b,{size:d,tone:l,children:[t(y,{children:[z&&t(i,{children:[W?e(v,{alt:f??"Modal image",src:z}):e(u,{icon:z,style:"filled",tone:g(l)}),e(h,{size:16,variant:"horizontal"})]}),f&&e(s,{component:"h2",id:`modal-title-${j??"default"}`,variant:"h3Strong",children:f}),f&&k&&e(h,{size:8,variant:"horizontal"}),k&&e(s,{color:M.palette.semantic.text["text-weak"],id:`modal-description-${j??"default"}`,variant:"b1Weak",children:k}),H&&t(i,{children:[e(h,{size:24,variant:"horizontal"}),H]})]}),B&&t(i,{children:[e(h,{size:24,variant:"horizontal"}),e(w,{direction:S?"column":"row-reverse",spacing:2,children:e(w,{direction:S?"column-reverse":"row",spacing:2,width:S?"100%":"fit-content",children:$.map((t,i)=>{const{label:a,id:o,...r}=t;return e(n,{fdKey:o??`modal-action-${a.replace(/\s+/g,"-").toLowerCase()}`,fullWidth:S,tone:x(l),...r,children:a},o??`modal-action-${i}-${a.replace(/\s+/g,"-").toLowerCase()}`)})})})]})]})})});k.displayName="Modal";export{k as default};
 //# sourceMappingURL=index.js.map