@owp/core 2.1.7 → 2.2.0

package/dist/components/OwpTable/OwpTable.js

@@ -26,7 +26,7 @@ const g = /* @__PURE__ */ l((t) => t ? Object.keys(t).filter((o) => !o.includes(
     fontWeight: "normal",
     src: "url('/assets/vendors/Grid/Styles/Roboto-Light.ttf') format('truetype')"
   }
-}, y = {
+}, S = {
   fontFamily: "RobotoLight, sans-serif",
   fontSize: "14px",
   fontWeight: "normal",
@@ -100,7 +100,7 @@ const I = /* @__PURE__ */ l(({
   },
   "& .MuiTableCell-root": r ? {
     boxSizing: "border-box",
-    ...y,
+    ...S,
     overflow: "hidden",
     textOverflow: "ellipsis",
     verticalAlign: "middle",
@@ -110,15 +110,15 @@ const I = /* @__PURE__ */ l(({
     padding: "7px 10px",
     borderLeft: `1px solid ${t.palette.divider}`,
     borderRight: `1px solid ${t.palette.divider}`,
-    "&:first-of-type": {
+    "&:first-child": {
       borderLeft: "none"
     },
-    "&:last-of-type": {
+    "&:last-child": {
       borderRight: "none"
     }
   },
   "& th": r ? {
-    ...y,
+    ...S,
     backgroundColor: "#586980",
     borderTop: "1px solid #6F7F94",
     borderBottom: "1px solid #6F7F94",
@@ -153,7 +153,7 @@ const I = /* @__PURE__ */ l(({
       borderTopRightRadius: "inherit"
     }
   }
-})), S = T(z)`
+})), y = T(z)`
   /* &:last-child th,
   &:last-child td {
     border-bottom: 0;
@@ -180,30 +180,30 @@ function lo({
       footerSlot: t ? /* @__PURE__ */ e(G, { totalCount: typeof a > "u" ? r.length : a }) : void 0,
       className: v(n.tableLayout && "w-full", n.className),
       children: [
-        /* @__PURE__ */ e(j, { children: b.map((i, d) => /* @__PURE__ */ e(S, { children: g(i).map((p) => /* @__PURE__ */ e(
+        /* @__PURE__ */ e(j, { children: b.map((i, p) => /* @__PURE__ */ e(y, { children: g(i).map((d) => /* @__PURE__ */ e(
           h,
           {
             className: "whitespace-pre-wrap",
-            sx: u(i, p),
-            colSpan: w(i, p, "ColSpan"),
-            rowSpan: w(i, p, "RowSpan"),
+            sx: u(i, d),
+            colSpan: w(i, d, "ColSpan"),
+            rowSpan: w(i, d, "RowSpan"),
             align: "center",
-            children: i[p]
+            children: i[d]
           },
-          `table-header-${d}-${p}`
-        )) }, `table-header-${d}`)) }),
-        /* @__PURE__ */ e(E, { children: r.map((i, d) => {
-          const p = i;
-          return /* @__PURE__ */ e(S, { children: s.map((m) => /* @__PURE__ */ e(
+          `table-header-${p}-${d}`
+        )) }, `table-header-${p}`)) }),
+        /* @__PURE__ */ e(E, { children: r.map((i, p) => {
+          const d = i;
+          return /* @__PURE__ */ e(y, { children: s.map((m) => /* @__PURE__ */ e(
             h,
             {
               className: "whitespace-pre-wrap h-64",
-              sx: u(p, m),
+              sx: u(d, m),
               align: "center",
-              children: p[m]
+              children: d[m]
             },
-            `table-row-cell-${d}-${m}`
-          )) }, `table-row-${d}`);
+            `table-row-cell-${p}-${m}`
+          )) }, `table-row-${p}`);
         }) })
       ]
     }
@@ -214,6 +214,6 @@ export {
   lo as OwpTable,
   G as OwpTableTotalCount,
   I as StyledTable,
-  S as StyledTableRow
+  y as StyledTableRow
 };
 //# sourceMappingURL=OwpTable.js.map

package/dist/components/OwpTable/OwpTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"OwpTable.js","sources":["../../../src/components/OwpTable/OwpTable.tsx"],"sourcesContent":["import { Divider, styled, Typography, type SxProps, type Theme } from '@mui/material';\nimport clsx from 'clsx';\nimport GlobalStyles from '@mui/material/GlobalStyles';\nimport Paper from '@mui/material/Paper';\nimport Table, { type TableProps } from '@mui/material/Table';\nimport TableBody from '@mui/material/TableBody';\nimport TableCell from '@mui/material/TableCell';\nimport TableContainer, { type TableContainerProps } from '@mui/material/TableContainer';\nimport TableHead from '@mui/material/TableHead';\nimport TableRow from '@mui/material/TableRow';\nimport { isArray, isEmpty, isNumber } from 'es-toolkit/compat';\nimport { type ReactNode, useMemo } from 'react';\n\ntype OwpTableCellValue = string | number;\ntype OwpTableHeaderRow = Record<string, OwpTableCellValue>;\ntype OwpTableRowData = Record<string, unknown>;\n\nconst getTableColumnKeys = (row?: Record<string, unknown>) => {\n  if (!row) {\n    return [];\n  }\n\n  return Object.keys(row).filter((keyName) => !keyName.includes('Span'));\n};\n\nconst getTableCellSx = (row: Record<string, unknown>, keyName: string) => {\n  return (row[`${keyName}Sx`] as SxProps<Theme>) ?? {};\n};\n\nconst getTableCellSpan = (\n  row: Record<string, unknown>,\n  keyName: string,\n  spanType: 'ColSpan' | 'RowSpan',\n) => {\n  return (row[`${keyName}${spanType}`] as number | undefined) ?? undefined;\n};\n\nconst mergeSx = (...styles: Array<SxProps<Theme> | undefined | false>): SxProps<Theme> =>\n  styles.reduce<Array<Exclude<SxProps<Theme>, readonly unknown[]>>>((acc, style) => {\n    if (!style) {\n      return acc;\n    }\n\n    return [...acc, ...(isArray(style) ? style : [style])];\n  }, []) as SxProps<Theme>;\n\nconst treeGridContainerSx = {\n  border: 0,\n  borderRadius: 0,\n  overflow: 'visible',\n} as const;\n\nconst treeGridFontFaceStyles = {\n  '@font-face': {\n    fontFamily: 'RobotoLight',\n    fontStyle: 'normal',\n    fontWeight: 'normal',\n    src: \"url('/assets/vendors/Grid/Styles/Roboto-Light.ttf') format('truetype')\",\n  },\n} as const;\n\nconst treeGridFontSx = {\n  fontFamily: 'RobotoLight, sans-serif',\n  fontSize: '14px',\n  fontWeight: 'normal',\n  lineHeight: '16px',\n} as const;\n\ninterface StyledTableProps extends TableProps {\n  canBodyFullHeight?: boolean;\n  canUseTreeGridStyle?: boolean;\n  containerProps?: TableContainerProps;\n  footerSlot?: ReactNode;\n  tableLayout?: 'auto' | 'fixed';\n  title?: string;\n  children: ReactNode;\n}\n\ntype StyledTableInnerProps = Pick<StyledTableProps, 'canBodyFullHeight' | 'canUseTreeGridStyle'>;\n\n/**\n * 총 row 수 표시 영역\n * @param totalCount 전체 row 수\n */\nexport function OwpTableTotalCount({ totalCount }: { totalCount?: number }) {\n  return (\n    <>\n      <Divider />\n      <Typography className=\"h-[30px] w-full pr-12 my-8\" align=\"right\">\n        전체: {isNumber(totalCount) ? totalCount.toLocaleString() : 0} 건\n      </Typography>\n    </>\n  );\n}\n\n/**\n * StyledTable 스타일 컴포넌트\n * @param canBodyFullHeight body full height 사용 여부\n * @param canUseTreeGridStyle TreeGrid 스타일 사용 여부\n * @param children 하위 콘텐츠\n * @param containerProps containerProps props\n * @param footerSlot footer 영역\n * @param tableLayout tableLayout 값\n */\nexport const StyledTable = ({\n  canBodyFullHeight,\n  canUseTreeGridStyle,\n  children,\n  className,\n  containerProps,\n  footerSlot,\n  tableLayout,\n  ...tableProps\n}: StyledTableProps) => {\n  return (\n    <>\n      {canUseTreeGridStyle && <GlobalStyles styles={treeGridFontFaceStyles} />}\n      <TableContainer\n        component={Paper}\n        variant=\"outlined\"\n        {...containerProps}\n        sx={mergeSx(\n          canUseTreeGridStyle && treeGridContainerSx,\n          canBodyFullHeight && { height: '100%' },\n          containerProps?.sx,\n        )}\n      >\n        <StyledTableInner\n          {...tableProps}\n          canBodyFullHeight={canBodyFullHeight}\n          canUseTreeGridStyle={canUseTreeGridStyle}\n          className={clsx(\n            canBodyFullHeight && 'h-full',\n            tableLayout === 'fixed' ? 'table-fixed' : tableLayout === 'auto' ? 'table-auto' : '',\n            className,\n          )}\n        >\n          {children}\n        </StyledTableInner>\n        {footerSlot}\n      </TableContainer>\n    </>\n  );\n};\n\nconst StyledTableInner = styled(Table, {\n  shouldForwardProp: (prop) => prop !== 'canBodyFullHeight' && prop !== 'canUseTreeGridStyle',\n})<StyledTableInnerProps>(({ theme, canBodyFullHeight, canUseTreeGridStyle }) => ({\n  ...(canBodyFullHeight && {\n    height: '100%',\n  }),\n  ...(canBodyFullHeight && {\n    '& .MuiTableBody-root': {\n      height: '100%',\n    },\n    '& .MuiTableBody-root > .MuiTableRow-root': {\n      height: '100%',\n    },\n  }),\n  '& .MuiTableCell-root': canUseTreeGridStyle\n    ? {\n        boxSizing: 'border-box',\n        ...treeGridFontSx,\n        overflow: 'hidden',\n        textOverflow: 'ellipsis',\n        verticalAlign: 'middle',\n        whiteSpace: 'nowrap',\n      }\n    : {\n        fontSize: '1.7rem',\n        padding: '7px 10px',\n        borderLeft: `1px solid ${theme.palette.divider}`,\n        borderRight: `1px solid ${theme.palette.divider}`,\n        '&:first-of-type': {\n          borderLeft: 'none',\n        },\n        '&:last-of-type': {\n          borderRight: 'none',\n        },\n      },\n  '& th': canUseTreeGridStyle\n    ? {\n        ...treeGridFontSx,\n        backgroundColor: '#586980',\n        borderTop: '1px solid #6F7F94',\n        borderBottom: '1px solid #6F7F94',\n        borderLeft: 0,\n        borderRight: '1px solid #6F7F94',\n        color: 'white',\n        height: 33,\n        minHeight: 33,\n        padding: '7px 2px 6px 10px',\n        '&:first-of-type': {\n          borderLeft: '1px solid #6F7F94',\n        },\n      }\n    : {\n        backgroundColor: theme.palette.grey[200],\n        fontWeight: 600,\n      },\n  '& td': canUseTreeGridStyle\n    ? {\n        borderBottom: '1px solid #CDD8E4',\n        borderLeft: 0,\n        borderRight: '1px solid #CDD8E4',\n        color: '#111112',\n        padding: '7px 10px 6px',\n        '&:first-of-type': {\n          borderLeft: '1px solid #CDD8E4',\n        },\n      }\n    : {},\n  ...(canUseTreeGridStyle && {\n    '& tbody > tr:first-of-type > th:first-of-type': {\n      borderTopLeftRadius: 'inherit',\n    },\n    '& tbody > tr:first-of-type > td:last-of-type': {\n      borderTopRightRadius: 'inherit',\n    },\n  }),\n}));\n\nexport const StyledTableRow = styled(TableRow)`\n  /* &:last-child th,\n  &:last-child td {\n    border-bottom: 0;\n  } */\n`;\n\ninterface OwpTableProps<T> extends Omit<StyledTableProps, 'children'> {\n  canTotalCountRow?: boolean;\n  headers: OwpTableHeaderRow | OwpTableHeaderRow[];\n  rows: T[];\n  totalCount?: number;\n}\n\n/**\n * OwpTable 컴포넌트\n * @param canTotalCountRow 전체 row 수 표시 여부\n * @param headers headers 값\n * @param rows 행 데이터 목록\n * @param totalCount 전체 row 수\n */\nexport function OwpTable<T>({\n  canTotalCountRow = false,\n  headers,\n  rows,\n  totalCount,\n  ...restTableProps\n}: OwpTableProps<T>) {\n  const resolvedHeaderRows = useMemo(\n    () => (isArray(headers) ? headers : isEmpty(headers) ? [] : [headers]),\n    [headers],\n  );\n  const commonKeyListData = useMemo(\n    () => getTableColumnKeys(isArray(headers) ? headers[0] : headers),\n    [headers],\n  );\n\n  return (\n    <StyledTable\n      {...restTableProps}\n      footerSlot={\n        canTotalCountRow ? (\n          <OwpTableTotalCount totalCount={typeof totalCount === 'undefined' ? rows.length : totalCount} />\n        ) : undefined\n      }\n      className={clsx(restTableProps.tableLayout && 'w-full', restTableProps.className)}\n    >\n      <TableHead>\n        {resolvedHeaderRows.map((headerData, index) => (\n          <StyledTableRow key={`table-header-${index}`}>\n            {getTableColumnKeys(headerData).map((keyName) => (\n              <TableCell\n                key={`table-header-${index}-${keyName}`}\n                className=\"whitespace-pre-wrap\"\n                sx={getTableCellSx(headerData, keyName)}\n                colSpan={getTableCellSpan(headerData, keyName, 'ColSpan')}\n                rowSpan={getTableCellSpan(headerData, keyName, 'RowSpan')}\n                align=\"center\"\n              >\n                {headerData[keyName]}\n              </TableCell>\n            ))}\n          </StyledTableRow>\n        ))}\n      </TableHead>\n      <TableBody>\n        {rows.map((row, index) => {\n          const currentRow = row as OwpTableRowData;\n\n          return (\n            <StyledTableRow key={`table-row-${index}`}>\n              {commonKeyListData.map((keyName) => (\n                <TableCell\n                  key={`table-row-cell-${index}-${keyName}`}\n                  className=\"whitespace-pre-wrap h-64\"\n                  sx={getTableCellSx(currentRow, keyName)}\n                  align=\"center\"\n                >\n                  {currentRow[keyName] as ReactNode}\n                </TableCell>\n              ))}\n            </StyledTableRow>\n          );\n        })}\n      </TableBody>\n    </StyledTable>\n  );\n}\n"],"names":["getTableColumnKeys","__name","row","keyName","getTableCellSx","getTableCellSpan","spanType","mergeSx","styles","acc","style","isArray","treeGridContainerSx","treeGridFontFaceStyles","treeGridFontSx","OwpTableTotalCount","totalCount","jsxs","Fragment","jsx","Divider","Typography","isNumber","StyledTable","canBodyFullHeight","canUseTreeGridStyle","children","className","containerProps","footerSlot","tableLayout","tableProps","GlobalStyles","TableContainer","Paper","StyledTableInner","clsx","styled","Table","prop","theme","StyledTableRow","TableRow","OwpTable","canTotalCountRow","headers","rows","restTableProps","resolvedHeaderRows","useMemo","isEmpty","commonKeyListData","TableHead","headerData","index","TableCell","TableBody","currentRow"],"mappings":"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"}
+{"version":3,"file":"OwpTable.js","sources":["../../../src/components/OwpTable/OwpTable.tsx"],"sourcesContent":["import { Divider, styled, Typography, type SxProps, type Theme } from '@mui/material';\nimport clsx from 'clsx';\nimport GlobalStyles from '@mui/material/GlobalStyles';\nimport Paper from '@mui/material/Paper';\nimport Table, { type TableProps } from '@mui/material/Table';\nimport TableBody from '@mui/material/TableBody';\nimport TableCell from '@mui/material/TableCell';\nimport TableContainer, { type TableContainerProps } from '@mui/material/TableContainer';\nimport TableHead from '@mui/material/TableHead';\nimport TableRow from '@mui/material/TableRow';\nimport { isArray, isEmpty, isNumber } from 'es-toolkit/compat';\nimport { type ReactNode, useMemo } from 'react';\n\ntype OwpTableCellValue = string | number;\ntype OwpTableHeaderRow = Record<string, OwpTableCellValue>;\ntype OwpTableRowData = Record<string, unknown>;\n\nconst getTableColumnKeys = (row?: Record<string, unknown>) => {\n  if (!row) {\n    return [];\n  }\n\n  return Object.keys(row).filter((keyName) => !keyName.includes('Span'));\n};\n\nconst getTableCellSx = (row: Record<string, unknown>, keyName: string) => {\n  return (row[`${keyName}Sx`] as SxProps<Theme>) ?? {};\n};\n\nconst getTableCellSpan = (\n  row: Record<string, unknown>,\n  keyName: string,\n  spanType: 'ColSpan' | 'RowSpan',\n) => {\n  return (row[`${keyName}${spanType}`] as number | undefined) ?? undefined;\n};\n\nconst mergeSx = (...styles: Array<SxProps<Theme> | undefined | false>): SxProps<Theme> =>\n  styles.reduce<Array<Exclude<SxProps<Theme>, readonly unknown[]>>>((acc, style) => {\n    if (!style) {\n      return acc;\n    }\n\n    return [...acc, ...(isArray(style) ? style : [style])];\n  }, []) as SxProps<Theme>;\n\nconst treeGridContainerSx = {\n  border: 0,\n  borderRadius: 0,\n  overflow: 'visible',\n} as const;\n\nconst treeGridFontFaceStyles = {\n  '@font-face': {\n    fontFamily: 'RobotoLight',\n    fontStyle: 'normal',\n    fontWeight: 'normal',\n    src: \"url('/assets/vendors/Grid/Styles/Roboto-Light.ttf') format('truetype')\",\n  },\n} as const;\n\nconst treeGridFontSx = {\n  fontFamily: 'RobotoLight, sans-serif',\n  fontSize: '14px',\n  fontWeight: 'normal',\n  lineHeight: '16px',\n} as const;\n\ninterface StyledTableProps extends TableProps {\n  canBodyFullHeight?: boolean;\n  canUseTreeGridStyle?: boolean;\n  containerProps?: TableContainerProps;\n  footerSlot?: ReactNode;\n  tableLayout?: 'auto' | 'fixed';\n  title?: string;\n  children: ReactNode;\n}\n\ntype StyledTableInnerProps = Pick<StyledTableProps, 'canBodyFullHeight' | 'canUseTreeGridStyle'>;\n\n/**\n * 총 row 수 표시 영역\n * @param totalCount 전체 row 수\n */\nexport function OwpTableTotalCount({ totalCount }: { totalCount?: number }) {\n  return (\n    <>\n      <Divider />\n      <Typography className=\"h-[30px] w-full pr-12 my-8\" align=\"right\">\n        전체: {isNumber(totalCount) ? totalCount.toLocaleString() : 0} 건\n      </Typography>\n    </>\n  );\n}\n\n/**\n * StyledTable 스타일 컴포넌트\n * @param canBodyFullHeight body full height 사용 여부\n * @param canUseTreeGridStyle TreeGrid 스타일 사용 여부\n * @param children 하위 콘텐츠\n * @param containerProps containerProps props\n * @param footerSlot footer 영역\n * @param tableLayout tableLayout 값\n */\nexport const StyledTable = ({\n  canBodyFullHeight,\n  canUseTreeGridStyle,\n  children,\n  className,\n  containerProps,\n  footerSlot,\n  tableLayout,\n  ...tableProps\n}: StyledTableProps) => {\n  return (\n    <>\n      {canUseTreeGridStyle && <GlobalStyles styles={treeGridFontFaceStyles} />}\n      <TableContainer\n        component={Paper}\n        variant=\"outlined\"\n        {...containerProps}\n        sx={mergeSx(\n          canUseTreeGridStyle && treeGridContainerSx,\n          canBodyFullHeight && { height: '100%' },\n          containerProps?.sx,\n        )}\n      >\n        <StyledTableInner\n          {...tableProps}\n          canBodyFullHeight={canBodyFullHeight}\n          canUseTreeGridStyle={canUseTreeGridStyle}\n          className={clsx(\n            canBodyFullHeight && 'h-full',\n            tableLayout === 'fixed' ? 'table-fixed' : tableLayout === 'auto' ? 'table-auto' : '',\n            className,\n          )}\n        >\n          {children}\n        </StyledTableInner>\n        {footerSlot}\n      </TableContainer>\n    </>\n  );\n};\n\nconst StyledTableInner = styled(Table, {\n  shouldForwardProp: (prop) => prop !== 'canBodyFullHeight' && prop !== 'canUseTreeGridStyle',\n})<StyledTableInnerProps>(({ theme, canBodyFullHeight, canUseTreeGridStyle }) => ({\n  ...(canBodyFullHeight && {\n    height: '100%',\n  }),\n  ...(canBodyFullHeight && {\n    '& .MuiTableBody-root': {\n      height: '100%',\n    },\n    '& .MuiTableBody-root > .MuiTableRow-root': {\n      height: '100%',\n    },\n  }),\n  '& .MuiTableCell-root': canUseTreeGridStyle\n    ? {\n        boxSizing: 'border-box',\n        ...treeGridFontSx,\n        overflow: 'hidden',\n        textOverflow: 'ellipsis',\n        verticalAlign: 'middle',\n        whiteSpace: 'nowrap',\n      }\n    : {\n        fontSize: '1.7rem',\n        padding: '7px 10px',\n        borderLeft: `1px solid ${theme.palette.divider}`,\n        borderRight: `1px solid ${theme.palette.divider}`,\n        '&:first-child': {\n          borderLeft: 'none',\n        },\n        '&:last-child': {\n          borderRight: 'none',\n        },\n      },\n  '& th': canUseTreeGridStyle\n    ? {\n        ...treeGridFontSx,\n        backgroundColor: '#586980',\n        borderTop: '1px solid #6F7F94',\n        borderBottom: '1px solid #6F7F94',\n        borderLeft: 0,\n        borderRight: '1px solid #6F7F94',\n        color: 'white',\n        height: 33,\n        minHeight: 33,\n        padding: '7px 2px 6px 10px',\n        '&:first-of-type': {\n          borderLeft: '1px solid #6F7F94',\n        },\n      }\n    : {\n        backgroundColor: theme.palette.grey[200],\n        fontWeight: 600,\n      },\n  '& td': canUseTreeGridStyle\n    ? {\n        borderBottom: '1px solid #CDD8E4',\n        borderLeft: 0,\n        borderRight: '1px solid #CDD8E4',\n        color: '#111112',\n        padding: '7px 10px 6px',\n        '&:first-of-type': {\n          borderLeft: '1px solid #CDD8E4',\n        },\n      }\n    : {},\n  ...(canUseTreeGridStyle && {\n    '& tbody > tr:first-of-type > th:first-of-type': {\n      borderTopLeftRadius: 'inherit',\n    },\n    '& tbody > tr:first-of-type > td:last-of-type': {\n      borderTopRightRadius: 'inherit',\n    },\n  }),\n}));\n\nexport const StyledTableRow = styled(TableRow)`\n  /* &:last-child th,\n  &:last-child td {\n    border-bottom: 0;\n  } */\n`;\n\ninterface OwpTableProps<T> extends Omit<StyledTableProps, 'children'> {\n  canTotalCountRow?: boolean;\n  headers: OwpTableHeaderRow | OwpTableHeaderRow[];\n  rows: T[];\n  totalCount?: number;\n}\n\n/**\n * OwpTable 컴포넌트\n * @param canTotalCountRow 전체 row 수 표시 여부\n * @param headers headers 값\n * @param rows 행 데이터 목록\n * @param totalCount 전체 row 수\n */\nexport function OwpTable<T>({\n  canTotalCountRow = false,\n  headers,\n  rows,\n  totalCount,\n  ...restTableProps\n}: OwpTableProps<T>) {\n  const resolvedHeaderRows = useMemo(\n    () => (isArray(headers) ? headers : isEmpty(headers) ? [] : [headers]),\n    [headers],\n  );\n  const commonKeyListData = useMemo(\n    () => getTableColumnKeys(isArray(headers) ? headers[0] : headers),\n    [headers],\n  );\n\n  return (\n    <StyledTable\n      {...restTableProps}\n      footerSlot={\n        canTotalCountRow ? (\n          <OwpTableTotalCount totalCount={typeof totalCount === 'undefined' ? rows.length : totalCount} />\n        ) : undefined\n      }\n      className={clsx(restTableProps.tableLayout && 'w-full', restTableProps.className)}\n    >\n      <TableHead>\n        {resolvedHeaderRows.map((headerData, index) => (\n          <StyledTableRow key={`table-header-${index}`}>\n            {getTableColumnKeys(headerData).map((keyName) => (\n              <TableCell\n                key={`table-header-${index}-${keyName}`}\n                className=\"whitespace-pre-wrap\"\n                sx={getTableCellSx(headerData, keyName)}\n                colSpan={getTableCellSpan(headerData, keyName, 'ColSpan')}\n                rowSpan={getTableCellSpan(headerData, keyName, 'RowSpan')}\n                align=\"center\"\n              >\n                {headerData[keyName]}\n              </TableCell>\n            ))}\n          </StyledTableRow>\n        ))}\n      </TableHead>\n      <TableBody>\n        {rows.map((row, index) => {\n          const currentRow = row as OwpTableRowData;\n\n          return (\n            <StyledTableRow key={`table-row-${index}`}>\n              {commonKeyListData.map((keyName) => (\n                <TableCell\n                  key={`table-row-cell-${index}-${keyName}`}\n                  className=\"whitespace-pre-wrap h-64\"\n                  sx={getTableCellSx(currentRow, keyName)}\n                  align=\"center\"\n                >\n                  {currentRow[keyName] as ReactNode}\n                </TableCell>\n              ))}\n            </StyledTableRow>\n          );\n        })}\n      </TableBody>\n    </StyledTable>\n  );\n}\n"],"names":["getTableColumnKeys","__name","row","keyName","getTableCellSx","getTableCellSpan","spanType","mergeSx","styles","acc","style","isArray","treeGridContainerSx","treeGridFontFaceStyles","treeGridFontSx","OwpTableTotalCount","totalCount","jsxs","Fragment","jsx","Divider","Typography","isNumber","StyledTable","canBodyFullHeight","canUseTreeGridStyle","children","className","containerProps","footerSlot","tableLayout","tableProps","GlobalStyles","TableContainer","Paper","StyledTableInner","clsx","styled","Table","prop","theme","StyledTableRow","TableRow","OwpTable","canTotalCountRow","headers","rows","restTableProps","resolvedHeaderRows","useMemo","isEmpty","commonKeyListData","TableHead","headerData","index","TableCell","TableBody","currentRow"],"mappings":"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"}

package/dist/components/OwpTreeGrid/OwpTreeGrid.js

@@ -1,186 +1,243 @@
-var Y = Object.defineProperty;
-var i = (e, n) => Y(e, "name", { value: n, configurable: !0 });
-import { jsx as H } from "../../node_modules/.pnpm/@emotion_react@11.14.0_@types_react@19.2.14_react@19.2.4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
-import { useGetCurrentLanguage as Z } from "../../hooks/useCurrentLanguage.js";
-import { useRef as l, useState as ee, useEffect as K } from "react";
-import { applyTreeGridLayoutToGrid as V } from "./utils.js";
-import { isEmpty as R } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/compat/predicate/isEmpty.js";
-import { delay as te } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/compat/function/delay.js";
-import { isEqual as re } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/predicate/isEqual.js";
-import { omit as ne } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/compat/object/omit.js";
-import { debounce as L } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/compat/function/debounce.js";
-import { get as oe } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/compat/object/get.js";
-const Q = {
+var pe = Object.defineProperty;
+var o = (e, n) => pe(e, "name", { value: n, configurable: !0 });
+import { jsxs as me, jsx as W } from "../../node_modules/.pnpm/@emotion_react@11.14.0_@types_react@19.2.14_react@19.2.4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
+import { useOwpTranslation as Te } from "../../hooks/useOwpTranslation.js";
+import { useGetCurrentLanguage as ve } from "../../hooks/useCurrentLanguage.js";
+import { useRef as i, useState as ie, useEffect as X, useLayoutEffect as Ge } from "react";
+import { useOwpTreeGridOverlayFrame as ye } from "./hooks/useOwpTreeGridOverlayFrame.js";
+import { OwpTreeGridLoadingOverlay as De } from "./OwpTreeGridLoadingOverlay.js";
+import { OwpTreeGridNoDataOverlay as we } from "./OwpTreeGridNoDataOverlay.js";
+import { applyTreeGridLayoutToGrid as ue } from "./utils/index.js";
+import { isEmpty as B } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/compat/predicate/isEmpty.js";
+import { delay as Ee } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/compat/function/delay.js";
+import { isEqual as Re } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/predicate/isEqual.js";
+import { omit as Oe } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/compat/object/omit.js";
+import { debounce as $ } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/compat/function/debounce.js";
+import { get as ge } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/compat/object/get.js";
+const Be = 300, se = {
   en: "/assets/vendors/Grid/TextEN.xml",
   kr: "/assets/vendors/Grid/TextKR.xml"
-}, W = /* @__PURE__ */ i((e) => `${e}?noCache=${Date.now()}`, "appendNoCacheQuery"), se = /* @__PURE__ */ i((e) => e === "kr" ? Q.kr : Q.en, "getTreeGridTextResourceUrl"), ue = /* @__PURE__ */ i((e) => e != null && e.includes("assets") ? W(e) : (
+}, ce = /* @__PURE__ */ o((e) => `${e}?noCache=${Date.now()}`, "appendNoCacheQuery"), be = /* @__PURE__ */ o((e) => e === "kr" ? se.kr : se.en, "getTreeGridTextResourceUrl"), Se = /* @__PURE__ */ o((e) => e != null && e.includes("assets") ? ce(e) : (
   // @ts-expect-error - API base URL env is provided by host app
   `undefined/${e}?noCache=${Date.now()}`
-), "resolveTreeGridDataUrl"), ie = /* @__PURE__ */ i((e, n, o) => e ? { Url: ue(n) } : { Data: { Body: [R(o) ? [] : o] } }, "buildTreeGridDataSource"), ce = /* @__PURE__ */ i(({
+), "resolveTreeGridDataUrl"), Ie = /* @__PURE__ */ o((e, n, s) => e ? { Url: Se(n) } : { Data: { Body: [B(s) ? [] : s] } }, "buildTreeGridDataSource"), Le = /* @__PURE__ */ o(({
   id: e,
   layoutUrl: n,
-  dataUrl: o,
-  bodyData: u,
-  useDataUrl: p,
-  width: c,
-  height: y,
-  languageId: G
+  dataUrl: s,
+  bodyData: f,
+  useDataUrl: l,
+  width: p,
+  height: G,
+  languageId: y
 }) => ({
   id: e,
-  Layout: { Url: W(n ?? "") },
-  Data: ie(p, o, u),
+  Layout: { Url: ce(n ?? "") },
+  Data: Ie(l, s, f),
   Text: {
-    Url: se(G)
+    Url: be(y)
   },
-  width: c,
-  height: y,
+  width: p,
+  height: G,
   Debug: "Error"
-}), "buildTreeGridInitializationOptions"), ae = /* @__PURE__ */ i((e) => oe(e, "Data.Data.Data.Body.0"), "getTreeGridBodyData"), fe = /* @__PURE__ */ i((e, n) => {
-  var u;
-  const o = (u = e.Data) == null ? void 0 : u.Data;
+}), "buildTreeGridInitializationOptions"), xe = /* @__PURE__ */ o((e) => ge(e, "Data.Data.Data.Body.0"), "getTreeGridBodyData"), Ce = /* @__PURE__ */ o((e, n, s) => {
+  var l;
+  const f = (l = e.Data) == null ? void 0 : l.Data;
   e.Data.Data = {
-    ...o,
+    ...f,
     Data: { Body: [n || []] },
     Url: ""
-  }, e.ReloadBody();
-}, "replaceTreeGridBodyData"), de = /* @__PURE__ */ i(({
+  }, e.ReloadBody(s);
+}, "replaceTreeGridBodyData"), _e = /* @__PURE__ */ o(({
   id: e,
   onSelect: n,
-  onRowClick: o,
-  onRowAdd: u,
-  onRowDelete: p,
-  onRowUndelete: c,
-  onRowChange: y,
-  onClickButton: G,
-  onSave: m,
-  onReady: D,
-  onAfterValueChanged: g,
-  treeGridInstanceRef: x,
-  latestLayoutOverridesRef: T,
-  appliedLayoutOverridesRef: B,
-  appliedBodyDataPropRef: C,
-  hasAppliedInitialLayoutRef: E,
-  setIsTreeGridReady: h
+  onRowClick: s,
+  onRowAdd: f,
+  onRowDelete: l,
+  onRowUndelete: p,
+  onRowChange: G,
+  onClickButton: y,
+  onSave: b,
+  onReady: m,
+  onAfterValueChanged: c,
+  treeGridInstanceRef: M,
+  latestLayoutOverridesRef: k,
+  appliedLayoutOverridesRef: q,
+  appliedBodyDataPropRef: A,
+  hasAppliedInitialLayoutRef: S,
+  setIsTreeGridReady: H
 }) => {
-  const w = g ?? y;
+  const I = c ?? G;
   window.TGSetEvent("OnRowAdd", e, (t, r) => {
-    r.CanEdit = 1, r.CanDelete = 1, u == null || u(t, r);
-  }), typeof o == "function" && window.TGSetEvent(
+    r.CanEdit = 1, r.CanDelete = 1, f == null || f(t, r);
+  }), typeof s == "function" && window.TGSetEvent(
     "OnClick",
     e,
-    L((t, r, s, a, I, U) => {
-      o(t, r, s, a, I, U);
+    $((t, r, u, T, a, P) => {
+      s(t, r, u, T, a, P);
     }, 300)
-  ), typeof G == "function" && window.TGSetEvent(
+  ), typeof y == "function" && window.TGSetEvent(
     "OnClickButton",
     e,
-    L((t, r, s, a) => {
-      G(t, r, s, a);
+    $((t, r, u, T) => {
+      y(t, r, u, T);
     }, 300)
-  ), typeof p == "function" && window.TGSetEvent("OnRowDelete", e, (t, r, s) => {
-    p(t, r, s);
-  }), typeof c == "function" && window.TGSetEvent("OnRowUndelete", e, (t, r) => {
-    c(t, r);
-  }), typeof w == "function" && window.TGSetEvent("OnAfterValueChanged", e, (t, r, s, a) => {
-    w(t, r, s, a);
+  ), typeof l == "function" && window.TGSetEvent("OnRowDelete", e, (t, r, u) => {
+    l(t, r, u);
+  }), typeof p == "function" && window.TGSetEvent("OnRowUndelete", e, (t, r) => {
+    p(t, r);
+  }), typeof I == "function" && window.TGSetEvent("OnAfterValueChanged", e, (t, r, u, T) => {
+    I(t, r, u, T);
   }), typeof n == "function" && window.TGSetEvent(
     "OnSelect",
     e,
-    L((t) => {
+    $((t) => {
       const r = t.GetSelRows() ?? [];
       n(r);
     }, 100)
-  ), typeof m == "function" && window.TGSetEvent("OnSave", e, (t, r, s) => {
-    m(t, r, s);
+  ), typeof b == "function" && window.TGSetEvent("OnSave", e, (t, r, u) => {
+    b(t, r, u);
   }), window.TGSetEvent(
     "OnReady",
     e,
-    L((t) => {
-      if (!E.current) {
-        const r = T.current;
-        E.current = !0, V(t, r), x.current = t, B.current = r, C.current = ae(t), h(!0), D == null || D(t);
+    $((t) => {
+      if (!S.current) {
+        const r = k.current;
+        S.current = !0, ue(t, r), M.current = t, q.current = r, A.current = xe(t), H(!0), m == null || m(t);
       }
     }, 100)
   );
-}, "bindTreeGridEvents"), Se = /* @__PURE__ */ i(({
+}, "bindTreeGridEvents"), Qe = /* @__PURE__ */ o(({
   id: e = "treeGridWrapper",
   containerStyle: n,
-  containerClassName: o,
-  className: u,
-  style: p,
-  height: c = "100%",
-  width: y = "100%",
-  layoutUrl: G,
-  dataUrl: m,
-  layoutOverrides: D,
-  LayoutUrl: g,
-  DataUrl: x,
-  data: T,
-  layout: B,
-  useDataUrl: C,
-  onSelect: E,
-  onRowClick: h,
-  onRowAdd: w,
-  onRowDelete: t,
-  onRowUndelete: r,
-  onRowChange: s,
-  onClickButton: a,
-  onSave: I,
-  onReady: U,
-  onAfterValueChanged: X
+  containerClassName: s,
+  className: f,
+  style: l,
+  height: p = "100%",
+  width: G = "100%",
+  layoutUrl: y,
+  dataUrl: b,
+  layoutOverrides: m,
+  data: c,
+  useDataUrl: M,
+  onSelect: k,
+  onRowClick: q,
+  onRowAdd: A,
+  onRowDelete: S,
+  onRowUndelete: H,
+  onRowChange: I,
+  onClickButton: t,
+  onSave: r,
+  onReady: u,
+  onAfterValueChanged: T,
+  showLoading: a = !0
 }) => {
-  const A = G ?? g, F = m ?? x, b = D ?? B, f = l(null), $ = l(
-    b
-  ), P = l(T), O = l(void 0), _ = l(void 0), J = l(!1), [j, M] = ee(!1), S = Z(), q = l(S.id);
-  return $.current = b, P.current = T, K(() => {
-    var v;
-    if (S.id !== q.current && !R(f.current) && ((v = f.current) == null || v.Dispose(), f.current = null, q.current = S.id), !!R(f.current))
-      return window.TreeGrid(
-        ce({
+  const { t: P } = Te(), d = i(null), J = i(null), h = i(m), Y = i(c), L = i(void 0), x = i(void 0), ae = i(!1), E = i(0), D = i(null), R = i(void 0), O = i(void 0), [j, fe] = ie(!1), [le, g] = ie(!1), C = ve(), Z = i(C.id), de = a && c !== void 0 && j && x.current !== c, F = a && (le || de), U = !F && c !== void 0 && B(c);
+  h.current = m, Y.current = c;
+  const ee = ye({
+    visible: F || U,
+    containerRef: J,
+    treeGridInstanceRef: d
+  }), _ = /* @__PURE__ */ o(() => {
+    R.current !== void 0 && (window.clearTimeout(R.current), R.current = void 0);
+  }, "clearBindingLoadingHideTimeout"), z = /* @__PURE__ */ o(() => {
+    O.current !== void 0 && (window.clearTimeout(O.current), O.current = void 0);
+  }, "clearBodyReloadStartTimeout");
+  X(() => {
+    a || (z(), _(), D.current = null, g(!1));
+  }, [a]), X(() => {
+    var w;
+    if (C.id !== Z.current && !B(d.current) && ((w = d.current) == null || w.Dispose(), d.current = null, Z.current = C.id), !!B(d.current))
+      return _e({
+        id: e,
+        onSelect: k,
+        onRowClick: q,
+        onRowAdd: A,
+        onRowDelete: S,
+        onRowUndelete: H,
+        onRowChange: I,
+        onClickButton: t,
+        onSave: r,
+        onReady: u,
+        onAfterValueChanged: T,
+        treeGridInstanceRef: d,
+        latestLayoutOverridesRef: h,
+        appliedLayoutOverridesRef: L,
+        appliedBodyDataPropRef: x,
+        hasAppliedInitialLayoutRef: ae,
+        setIsTreeGridReady: fe
+      }), window.TreeGrid(
+        Le({
           id: e,
-          layoutUrl: A,
-          dataUrl: F,
-          bodyData: T,
-          useDataUrl: C,
-          width: y,
-          height: c,
-          languageId: S.id
+          layoutUrl: y,
+          dataUrl: b,
+          bodyData: c,
+          useDataUrl: M,
+          width: G,
+          height: p,
+          languageId: C.id
         }),
         e,
         e
-      ), de({
-        id: e,
-        onSelect: E,
-        onRowClick: h,
-        onRowAdd: w,
-        onRowDelete: t,
-        onRowUndelete: r,
-        onRowChange: s,
-        onClickButton: a,
-        onSave: I,
-        onReady: U,
-        onAfterValueChanged: X,
-        treeGridInstanceRef: f,
-        latestLayoutOverridesRef: $,
-        appliedLayoutOverridesRef: O,
-        appliedBodyDataPropRef: _,
-        hasAppliedInitialLayoutRef: J,
-        setIsTreeGridReady: M
-      }), () => {
-        te(() => {
-          var d;
-          (d = f.current) == null || d.Dispose();
+      ), () => {
+        Ee(() => {
+          var v;
+          (v = d.current) == null || v.Dispose();
         }, 200);
       };
-  }, []), K(() => {
-    const v = f.current, d = $.current, k = P.current;
-    if (R(v) || !j)
+  }, []), Ge(() => {
+    const w = d.current, v = h.current, N = Y.current;
+    if (B(w) || !j)
       return;
-    const z = O.current !== d && !re(O.current, d), N = _.current !== k;
-    !z && !N || (z && (V(v, d, N), O.current = d), N && (fe(v, k), _.current = k));
-  }, [j, b, T]), /* @__PURE__ */ H("div", { className: o, style: { height: c, width: y, ...n }, children: /* @__PURE__ */ H("div", { id: e, className: u, style: ne(p, ["height", "width"]) }) });
+    const te = L.current !== v && !Re(L.current, v), Q = x.current !== N;
+    if (!(!te && !Q) && (te && (ue(w, v, Q), L.current = v), Q)) {
+      const V = E.current + 1, re = /* @__PURE__ */ o(() => {
+        O.current = void 0, Ce(w, N, () => {
+          if (E.current !== V)
+            return;
+          const ne = D.current;
+          if (!a || ne === null) {
+            D.current = null, g(!1);
+            return;
+          }
+          const oe = Math.max(
+            0,
+            Be - (Date.now() - ne)
+          );
+          if (_(), oe === 0) {
+            D.current = null, g(!1);
+            return;
+          }
+          R.current = window.setTimeout(() => {
+            E.current === V && (R.current = void 0, D.current = null, g(!1));
+          }, oe);
+        });
+      }, "runBodyReload");
+      E.current = V, a && N !== void 0 ? (z(), _(), D.current = Date.now(), g(!0), O.current = window.setTimeout(() => {
+        E.current === V && re();
+      }, 0)) : re(), x.current = N;
+    }
+  }, [j, m, c, a]), X(() => () => {
+    z(), _();
+  }, []);
+  const K = {
+    height: p,
+    width: G,
+    ...n
+  };
+  return (a || U) && (K.position = n != null && n.position && n.position !== "static" ? n.position : "relative", K.isolation = "isolate"), /* @__PURE__ */ me("div", { ref: J, className: s, style: K, children: [
+    /* @__PURE__ */ W("div", { id: e, className: f, style: Oe(l, ["height", "width"]) }),
+    /* @__PURE__ */ W(
+      we,
+      {
+        visible: U,
+        message: P("Message.조회된 결과가 없습니다."),
+        overlayFrame: ee
+      }
+    ),
+    /* @__PURE__ */ W(De, { visible: F, overlayFrame: ee })
+  ] });
 }, "OwpTreeGrid");
 export {
-  Se as OwpTreeGrid
+  Qe as OwpTreeGrid
 };
 //# sourceMappingURL=OwpTreeGrid.js.map