@owp/core 2.5.2 → 2.5.3

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

@@ -1 +1 @@
-{"version":3,"file":"OwpTable.js","sources":["../../../src/components/OwpTable/OwpTable.tsx"],"sourcesContent":["import {\n  getTreeGridFontFaceStyles,\n  TREEGRID_FONT_FAMILY_STACK,\n} from '@/constants/treeGrid';\nimport { 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 treeGridFontSx = {\n  fontFamily: TREEGRID_FONT_FAMILY_STACK,\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=\"w-full py-8 pr-12\" 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={getTreeGridFontFaceStyles()} />}\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: 'none',\n        borderRight: 'none',\n      },\n  ...(!canUseTreeGridStyle && {\n    '& .MuiTableRow-root > .MuiTableCell-root + .MuiTableCell-root': {\n      borderLeft: `1px solid ${theme.palette.divider}`,\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","treeGridFontSx","TREEGRID_FONT_FAMILY_STACK","OwpTableTotalCount","totalCount","jsxs","Fragment","jsx","Divider","Typography","isNumber","StyledTable","canBodyFullHeight","canUseTreeGridStyle","children","className","containerProps","footerSlot","tableLayout","tableProps","GlobalStyles","getTreeGridFontFaceStyles","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 {\n  resolveOwpGridTheme,\n  type OwpResolvedGridThemeConfigType,\n} from '@/constants/gridTheme';\nimport {\n  getTreeGridFontFaceStyles,\n  TREEGRID_FONT_FAMILY_STACK,\n} from '@/constants/treeGrid';\nimport { useGetCurrentSettings } from '@/hooks/useOwpSettings';\nimport { 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 getTreeGridTypographySx = (\n  fontSize: number | string,\n  fontWeight: number | string = 'normal',\n) => ({\n  fontFamily: TREEGRID_FONT_FAMILY_STACK,\n  fontSize,\n  fontWeight,\n  lineHeight: '16px',\n});\n\nconst getTreeGridCellBaseSx = (treeGridTheme: OwpResolvedGridThemeConfigType) => ({\n  ...getTreeGridTypographySx(treeGridTheme.cell.fontSize),\n  boxSizing: 'border-box',\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  verticalAlign: 'middle',\n  whiteSpace: 'nowrap',\n});\n\ninterface StyledTableProps extends TableProps {\n  canBodyFullHeight?: boolean;\n  canUseTreeGridStyle?: boolean;\n  containerProps?: TableContainerProps;\n  footerSlot?: ReactNode;\n  tableLayout?: 'auto' | 'fixed';\n  treeGridTheme?: OwpResolvedGridThemeConfigType;\n  title?: string;\n  children: ReactNode;\n}\n\ntype StyledTableInnerProps = Pick<\n  StyledTableProps,\n  'canBodyFullHeight' | 'canUseTreeGridStyle' | 'treeGridTheme'\n>;\n\n/**\n * 총 row 수 표시 영역\n * @param totalCount 전체 row 수\n */\nexport function OwpTableTotalCount({ totalCount }: { totalCount?: number }) {\n  return (\n    <>\n      <Divider />\n      <Typography className=\"w-full py-8 pr-12\" 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  const currentSettings = useGetCurrentSettings();\n  const treeGridTheme = useMemo(\n    () => resolveOwpGridTheme(currentSettings?.theme?.main?.grid),\n    [currentSettings],\n  );\n\n  return (\n    <>\n      {canUseTreeGridStyle && <GlobalStyles styles={getTreeGridFontFaceStyles()} />}\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          treeGridTheme={treeGridTheme}\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) =>\n    prop !== 'canBodyFullHeight' && prop !== 'canUseTreeGridStyle' && prop !== 'treeGridTheme',\n})<StyledTableInnerProps>(({ theme, canBodyFullHeight, canUseTreeGridStyle, treeGridTheme }) => {\n  const resolvedTreeGridTheme = treeGridTheme ?? resolveOwpGridTheme();\n\n  return {\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          ...getTreeGridCellBaseSx(resolvedTreeGridTheme),\n        }\n      : {\n          fontSize: '1.7rem',\n          padding: '7px 10px',\n          borderLeft: 'none',\n          borderRight: 'none',\n        },\n    ...(!canUseTreeGridStyle && {\n      '& .MuiTableRow-root > .MuiTableCell-root + .MuiTableCell-root': {\n        borderLeft: `1px solid ${theme.palette.divider}`,\n      },\n    }),\n    '& th': canUseTreeGridStyle\n      ? {\n          ...getTreeGridTypographySx(\n            resolvedTreeGridTheme.header.fontSize,\n            resolvedTreeGridTheme.header.fontWeight,\n          ),\n          backgroundColor: resolvedTreeGridTheme.header.backgroundColor,\n          borderTop: '1px solid #6F7F94',\n          borderBottom: '1px solid #6F7F94',\n          borderLeft: 0,\n          borderRight: '1px solid #6F7F94',\n          color: resolvedTreeGridTheme.header.color,\n          height: resolvedTreeGridTheme.header.height,\n          minHeight: resolvedTreeGridTheme.header.height,\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          fontSize: resolvedTreeGridTheme.cell.fontSize,\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});\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","getTreeGridTypographySx","fontSize","fontWeight","TREEGRID_FONT_FAMILY_STACK","getTreeGridCellBaseSx","treeGridTheme","OwpTableTotalCount","totalCount","jsxs","Fragment","jsx","Divider","Typography","isNumber","StyledTable","canBodyFullHeight","canUseTreeGridStyle","children","className","containerProps","footerSlot","tableLayout","tableProps","currentSettings","useGetCurrentSettings","useMemo","resolveOwpGridTheme","_b","_a","GlobalStyles","getTreeGridFontFaceStyles","TableContainer","Paper","StyledTableInner","clsx","styled","Table","prop","theme","resolvedTreeGridTheme","StyledTableRow","TableRow","OwpTable","canTotalCountRow","headers","rows","restTableProps","resolvedHeaderRows","isEmpty","commonKeyListData","TableHead","headerData","index","TableCell","TableBody","currentRow"],"mappings":"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"}

package/dist/components/OwpTreeGrid/OwpTreeGrid.js

@@ -1,221 +1,304 @@
-var he = Object.defineProperty;
-var a = (r, u) => he(r, "name", { value: u, configurable: !0 });
-import { jsxs as qe, jsx as q } 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 je } from "../../hooks/useOwpTranslation.js";
-import { useGetCurrentLanguage as Fe } from "../../hooks/useCurrentLanguage.js";
-import { TREE_GRID_BODY_ROWS_CHANGED_EVENT as ge } from "../../utils/treeGridBodyRowsEvent.js";
-import { getTreeGridPerfTimestamp as j, countTreeGridPerf as be, logTreeGridPerf as Ee, measureTreeGridPerf as Be } from "./internal/utils/perf.js";
-import { useRef as e, useState as F, useEffect as L, useLayoutEffect as We } from "react";
-import { useOwpTreeGridOverlayFrame as ze } from "./internal/hooks/useOwpTreeGridOverlayFrame.js";
-import { bindTreeGridEvents as Ye, getTreeGridBodyDataCount as W, buildTreeGridInitializationOptions as ke, hasTreeGridDisplayDataRows as Ie, replaceTreeGridBodyData as Je, TREE_GRID_BINDING_LOADING_MIN_VISIBLE_MS as Ke } from "./internal/treeGridRuntime.js";
-import { applyTreeGridLayoutToGrid as Qe } from "./internal/treeGridLayout.js";
-import { OwpTreeGridLoadingOverlay as Xe } from "./internal/OwpTreeGridLoadingOverlay.js";
-import { OwpTreeGridNoDataOverlay as Ze } from "./internal/OwpTreeGridNoDataOverlay.js";
-import { resolveTreeGridColumnEditRuleLookup as Le, createTreeGridColumnEditRulesState as $e, syncTreeGridColumnEditRules as Ue } from "./internal/treeGridColumnEditRules.js";
-import { isEmpty as w } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/compat/predicate/isEmpty.js";
-import { delay as er } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/compat/function/delay.js";
-import { isEqual as we } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/predicate/isEqual.js";
-import { omit as rr } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/compat/object/omit.js";
-const Dr = /* @__PURE__ */ a(({
-  id: r = "treeGridWrapper",
-  containerStyle: u,
-  containerClassName: Oe,
-  className: Ce,
-  style: Ae,
-  height: z = "100%",
-  width: Y = "100%",
-  layoutUrl: _e,
-  dataUrl: He,
-  layoutOverrides: O,
-  data: n,
-  useDataUrl: k,
-  onSelect: J,
-  onRowClick: K,
-  onRowAdd: Q,
-  onRowDelete: X,
-  onRowUndelete: Z,
-  onRowChange: $,
-  onClickButton: U,
-  onSave: ee,
-  onReady: re,
-  onAfterValueChanged: te,
-  columnEditRules: f,
-  highlightEditableCells: ne = !0,
-  highlightChangedCells: oe = !0,
-  loading: xe,
-  showLoading: o = !0
+var je = Object.defineProperty;
+var d = (e, n) => je(e, "name", { value: n, configurable: !0 });
+import { jsxs as ke, jsx as L } 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 { resolveOwpGridTheme as qe } from "../../constants/gridTheme.js";
+import { useGetCurrentSettings as Ye } from "../../hooks/useOwpSettings.js";
+import { useOwpTranslation as Qe } from "../../hooks/useOwpTranslation.js";
+import { useGetCurrentLanguage as Xe } from "../../hooks/useCurrentLanguage.js";
+import { TREE_GRID_BODY_ROWS_CHANGED_EVENT as Be } from "../../utils/treeGridBodyRowsEvent.js";
+import { getTreeGridPerfTimestamp as X, countTreeGridPerf as He, logTreeGridPerf as Se, measureTreeGridPerf as xe } from "./internal/utils/perf.js";
+import { useRef as r, useState as J, useMemo as Je, useEffect as _, useLayoutEffect as Ke } from "react";
+import Ze from "@mui/material/GlobalStyles";
+import { useOwpTreeGridOverlayFrame as Ue } from "./internal/hooks/useOwpTreeGridOverlayFrame.js";
+import { bindTreeGridEvents as er, getTreeGridBodyDataCount as K, buildTreeGridInitializationOptions as rr, hasTreeGridDisplayDataRows as Le, replaceTreeGridBodyData as tr, TREE_GRID_BINDING_LOADING_MIN_VISIBLE_MS as or } from "./internal/treeGridRuntime.js";
+import { applyTreeGridLayoutToGrid as nr } from "./internal/treeGridLayout.js";
+import { OwpTreeGridLoadingOverlay as ir } from "./internal/OwpTreeGridLoadingOverlay.js";
+import { OwpTreeGridNoDataOverlay as sr } from "./internal/OwpTreeGridNoDataOverlay.js";
+import { resolveTreeGridColumnEditRuleLookup as _e, createTreeGridColumnEditRulesState as ar, syncTreeGridColumnEditRules as dr } from "./internal/treeGridColumnEditRules.js";
+import { isEmpty as O } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/compat/predicate/isEmpty.js";
+import { delay as ur } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/compat/function/delay.js";
+import { isEqual as Oe } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/predicate/isEqual.js";
+import { omit as lr } from "../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/compat/object/omit.js";
+const cr = [
+  "TS",
+  "TW",
+  "TB",
+  "TM",
+  "TT",
+  "CF",
+  "CL",
+  "CO",
+  "CG",
+  "CB",
+  "CQ",
+  "CE",
+  "CS",
+  "CR",
+  "CP",
+  "CC"
+], Ae = "owp-tree-grid-theme", Me = /* @__PURE__ */ d((e) => typeof e == "number" ? `${e}px` : e, "toTreeGridCssValue"), Z = /* @__PURE__ */ d(({
+  rowSuffix: e,
+  suffixes: n,
+  withChildren: M = !1
+}) => cr.flatMap((w) => n.flatMap((A) => {
+  const E = `.${Ae}`, h = e ? ` .${w}${e}` : "", f = `${E}${h} .${w}${A}`;
+  return M ? [f, `${f} *`] : [f];
+})).join(", "), "createTreeGridSelectors"), fr = Z({
+  suffixes: ["Main"],
+  withChildren: !0
+}), pr = Z({
+  rowSuffix: "HeaderRow",
+  suffixes: ["CellHeader", "CellIndex", "GanttHeaderBase", "LevelButton"],
+  withChildren: !0
+}), mr = Z({
+  rowSuffix: "HeaderRow",
+  suffixes: [
+    "CellHeader",
+    "CellIndex",
+    "EditHeaderInput",
+    "EditHeaderTextarea",
+    "ColorFocusedCellHeader",
+    "ColorHoveredCellHeader",
+    "ColorHoveredCellIndex",
+    "HeaderFocus",
+    "HeaderDrag"
+  ]
+}), Rr = {
+  [fr]: {
+    fontSize: "var(--owp-tree-grid-cell-font-size, 13px)",
+    fontWeight: "normal",
+    lineHeight: "16px"
+  },
+  [pr]: {
+    color: "var(--owp-tree-grid-header-color, #ffffff) !important",
+    fontSize: "var(--owp-tree-grid-header-font-size, 14px) !important",
+    fontWeight: "var(--owp-tree-grid-header-font-weight, normal) !important",
+    lineHeight: "16px"
+  },
+  [mr]: {
+    backgroundColor: "var(--owp-tree-grid-header-background-color, #586980) !important",
+    color: "var(--owp-tree-grid-header-color, #ffffff) !important"
+  }
+}, Pr = /* @__PURE__ */ d(({
+  id: e = "treeGridWrapper",
+  containerStyle: n,
+  containerClassName: M,
+  className: w,
+  style: A,
+  height: E = "100%",
+  width: h = "100%",
+  layoutUrl: f,
+  dataUrl: Pe,
+  layoutOverrides: P,
+  data: i,
+  useDataUrl: U,
+  onSelect: ee,
+  onRowClick: re,
+  onRowAdd: te,
+  onRowDelete: oe,
+  onRowUndelete: ne,
+  onRowChange: ie,
+  onClickButton: se,
+  onSave: ae,
+  onReady: de,
+  onAfterValueChanged: ue,
+  columnEditRules: p,
+  highlightEditableCells: le = !0,
+  highlightChangedCells: ce = !0,
+  loading: ze,
+  showLoading: s = !0
 }) => {
-  const { t: C } = je(), i = e(null), ie = e(null), se = e(null), A = e(null), _ = e(O), ue = e(n), H = e(
-    f
-  ), x = e(
-    Le(f, {
-      hourMinuteInvalidText: C("Message.시간은 HH:mm 형식으로 입력해주세요.")
+  const { t: z } = Qe(), D = Ye(), a = r(null), fe = r(null), pe = r(null), N = r(null), V = r(P), me = r(i), $ = r(
+    p
+  ), W = r(
+    _e(p, {
+      hourMinuteInvalidText: z("Message.시간은 HH:mm 형식으로 입력해주세요.")
     })
-  ), ae = e({
-    onSelect: J,
-    onRowClick: K,
-    onRowAdd: Q,
-    onRowDelete: X,
-    onRowUndelete: Z,
-    onRowChange: $,
-    onClickButton: U,
-    onSave: ee,
-    onReady: re,
-    onAfterValueChanged: te
-  }), p = e(void 0), N = e(!1), D = e(void 0), g = e(void 0), b = e(
+  ), Re = r({
+    onSelect: ee,
+    onRowClick: re,
+    onRowAdd: te,
+    onRowDelete: oe,
+    onRowUndelete: ne,
+    onRowChange: ie,
+    onClickButton: se,
+    onSave: ae,
+    onReady: de,
+    onAfterValueChanged: ue
+  }), m = r(void 0), F = r(!1), b = r(void 0), I = r(void 0), B = r(
     void 0
-  ), ce = e($e()), Ne = e(!1), m = e(0), c = e(null), R = e(void 0), y = e(void 0), de = e(ne), le = e(oe), [P, Pe] = F(!1), [Me, v] = F(!1), [Ve, fe] = F(!1), E = Fe(), pe = e(E.id), Se = o && n !== void 0 && P && g.current !== n, M = o && xe === !0 || o && (Me || Se), V = !M && n !== void 0 && w(n) && !Ve, me = /* @__PURE__ */ a((t) => {
-    fe(Ie(t));
+  ), Te = r(ar()), Ne = r(!1), R = r(0), u = r(null), T = r(void 0), y = r(void 0), ye = r(le), ge = r(ce), [j, Ve] = J(!1), [$e, g] = J(!1), [We, ve] = J(!1), H = Xe(), v = Je(
+    () => {
+      var t, o;
+      return qe((o = (t = D == null ? void 0 : D.theme) == null ? void 0 : t.main) == null ? void 0 : o.grid);
+    },
+    [D]
+  ), Ge = r(H.id), Fe = s && i !== void 0 && j && I.current !== i, k = s && ze === !0 || s && ($e || Fe), q = !k && i !== void 0 && O(i) && !We, Ce = /* @__PURE__ */ d((t) => {
+    ve(Le(t));
   }, "syncHasDisplayDataRows");
-  _.current = O, ue.current = n, H.current = f, x.current = Le(f, {
-    hourMinuteInvalidText: C("Message.시간은 HH:mm 형식으로 입력해주세요.")
-  }), de.current = ne, le.current = oe, ae.current = {
-    onSelect: J,
-    onRowClick: K,
-    onRowAdd: Q,
-    onRowDelete: X,
-    onRowUndelete: Z,
-    onRowChange: $,
-    onClickButton: U,
-    onSave: ee,
-    onReady: re,
-    onAfterValueChanged: te
+  V.current = P, me.current = i, $.current = p, W.current = _e(p, {
+    hourMinuteInvalidText: z("Message.시간은 HH:mm 형식으로 입력해주세요.")
+  }), ye.current = le, ge.current = ce, Re.current = {
+    onSelect: ee,
+    onRowClick: re,
+    onRowAdd: te,
+    onRowDelete: oe,
+    onRowUndelete: ne,
+    onRowChange: ie,
+    onClickButton: se,
+    onSave: ae,
+    onReady: de,
+    onAfterValueChanged: ue
   };
-  const Re = ze({
-    visible: M || V,
-    containerRef: ie,
-    treeGridInstanceRef: i,
-    debugId: r
-  }), B = /* @__PURE__ */ a(() => {
-    R.current !== void 0 && (window.clearTimeout(R.current), R.current = void 0);
-  }, "clearBindingLoadingHideTimeout"), S = /* @__PURE__ */ a(() => {
+  const we = Ue({
+    visible: k || q,
+    containerRef: fe,
+    treeGridInstanceRef: a,
+    debugId: e
+  }), S = /* @__PURE__ */ d(() => {
+    T.current !== void 0 && (window.clearTimeout(T.current), T.current = void 0);
+  }, "clearBindingLoadingHideTimeout"), Y = /* @__PURE__ */ d(() => {
     y.current !== void 0 && (window.clearTimeout(y.current), y.current = void 0);
   }, "clearBodyReloadStartTimeout");
-  L(() => {
-    const t = /* @__PURE__ */ a((s) => {
-      var d;
-      ((d = s.detail) == null ? void 0 : d.gridId) === r && fe(Ie(i.current));
+  _(() => {
+    const t = /* @__PURE__ */ d((o) => {
+      var l;
+      ((l = o.detail) == null ? void 0 : l.gridId) === e && ve(Le(a.current));
     }, "handleBodyRowsChanged");
-    return window.addEventListener(ge, t), () => {
-      window.removeEventListener(ge, t);
+    return window.addEventListener(Be, t), () => {
+      window.removeEventListener(Be, t);
     };
-  }, [r]), L(() => {
-    o || (S(), B(), c.current = null, v(!1));
-  }, [o]), L(() => {
+  }, [e]), _(() => {
+    s || (Y(), S(), u.current = null, g(!1));
+  }, [s]), _(() => {
     var t;
-    if (E.id !== pe.current && !w(i.current) && ((t = i.current) == null || t.Dispose(), i.current = null, pe.current = E.id), !!w(i.current))
-      return Ye({
-        id: r,
-        latestEventHandlersRef: ae,
-        highlightEditableCellsRef: de,
-        highlightChangedCellsRef: le,
-        treeGridInstanceRef: i,
-        treeGridInitStartedAtRef: se,
-        latestLayoutOverridesRef: _,
-        appliedLayoutOverridesRef: D,
-        appliedBodyDataPropRef: g,
-        latestColumnEditRulesRef: H,
-        latestColumnEditRuleLookupRef: x,
-        appliedColumnEditRulesRef: b,
-        columnEditRulesStateRef: ce,
+    if (H.id !== Ge.current && !O(a.current) && ((t = a.current) == null || t.Dispose(), a.current = null, Ge.current = H.id), !!O(a.current))
+      return er({
+        id: e,
+        latestEventHandlersRef: Re,
+        highlightEditableCellsRef: ye,
+        highlightChangedCellsRef: ge,
+        treeGridInstanceRef: a,
+        treeGridInitStartedAtRef: pe,
+        latestLayoutOverridesRef: V,
+        appliedLayoutOverridesRef: b,
+        appliedBodyDataPropRef: I,
+        latestColumnEditRulesRef: $,
+        latestColumnEditRuleLookupRef: W,
+        appliedColumnEditRulesRef: B,
+        columnEditRulesStateRef: Te,
         hasAppliedInitialLayoutRef: Ne,
-        syncHasDisplayDataRows: me,
-        setIsTreeGridReady: Pe
-      }), se.current = j(), be(r, "init"), Ee(r, "TreeGrid init start", {
-        useDataUrl: !!k,
-        bodyRowCount: W(n)
+        syncHasDisplayDataRows: Ce,
+        setIsTreeGridReady: Ve
+      }), pe.current = X(), He(e, "init"), Se(e, "TreeGrid init start", {
+        useDataUrl: !!U,
+        bodyRowCount: K(i)
       }), window.TreeGrid(
-        ke({
-          id: r,
-          layoutUrl: _e,
-          dataUrl: He,
-          bodyData: n,
-          useDataUrl: k,
-          width: Y,
-          height: z,
-          languageId: E.id
+        rr({
+          id: e,
+          layoutUrl: f,
+          dataUrl: Pe,
+          bodyData: i,
+          useDataUrl: U,
+          width: h,
+          height: E,
+          languageId: H.id
         }),
-        r,
-        r
+        e,
+        e
       ), () => {
-        er(() => {
-          var s;
-          (s = i.current) == null || s.Dispose();
+        ur(() => {
+          var o;
+          (o = a.current) == null || o.Dispose();
         }, 200);
       };
-  }, []), We(() => {
-    const t = i.current, s = _.current, T = ue.current, d = H.current;
-    if (w(t) || !P)
+  }, []), Ke(() => {
+    const t = a.current, o = V.current, G = me.current, l = $.current;
+    if (O(t) || !j)
       return;
-    const ye = D.current !== s && !we(D.current, s), I = g.current !== T && (!N.current || p.current !== T), ve = b.current !== d && !we(b.current, d);
-    if (!(!ye && !I && !ve)) {
-      if (ye) {
-        const l = j();
-        Qe(t, s, I), D.current = s, Be(r, "apply layout", l, {
-          disableBodyReload: !!I
+    const Ee = b.current !== o && !Oe(b.current, o), x = I.current !== G && (!F.current || m.current !== G), he = B.current !== l && !Oe(B.current, l);
+    if (!(!Ee && !x && !he)) {
+      if (Ee) {
+        const c = X();
+        nr(t, o, x), b.current = o, xe(e, "apply layout", c, {
+          disableBodyReload: !!x
         });
       }
-      if (I) {
-        const l = m.current + 1, Te = /* @__PURE__ */ a(() => {
-          const G = p.current;
-          y.current = void 0, A.current = j(), be(r, "reload"), Ee(r, "ReloadBody start", {
-            bodyRowCount: W(G)
-          }), Je(t, G, () => {
-            if (m.current !== l)
+      if (x) {
+        const c = R.current + 1, De = /* @__PURE__ */ d(() => {
+          const C = m.current;
+          y.current = void 0, N.current = X(), He(e, "reload"), Se(e, "ReloadBody start", {
+            bodyRowCount: K(C)
+          }), tr(t, C, () => {
+            if (R.current !== c)
               return;
-            g.current = G, me(t), Be(r, "ReloadBody end", A.current, {
-              bodyRowCount: W(G)
-            }), A.current = null, p.current === G && (p.current = void 0, N.current = !1);
-            const Ge = c.current;
-            if (!o || Ge === null) {
-              c.current = null, v(!1);
+            I.current = C, Ce(t), xe(e, "ReloadBody end", N.current, {
+              bodyRowCount: K(C)
+            }), N.current = null, m.current === C && (m.current = void 0, F.current = !1);
+            const be = u.current;
+            if (!s || be === null) {
+              u.current = null, g(!1);
               return;
             }
-            const De = Math.max(
+            const Ie = Math.max(
               0,
-              Ke - (Date.now() - Ge)
+              or - (Date.now() - be)
             );
-            if (B(), De === 0) {
-              c.current = null, v(!1);
+            if (S(), Ie === 0) {
+              u.current = null, g(!1);
               return;
             }
-            R.current = window.setTimeout(() => {
-              m.current === l && (R.current = void 0, c.current = null, v(!1));
-            }, De);
+            T.current = window.setTimeout(() => {
+              R.current === c && (T.current = void 0, u.current = null, g(!1));
+            }, Ie);
           });
         }, "runBodyReload");
-        m.current = l, p.current = T, N.current = !0, o && T !== void 0 ? (S(), B(), c.current = Date.now(), v(!0), y.current = window.setTimeout(() => {
-          m.current === l && Te();
-        }, 0)) : Te();
+        R.current = c, m.current = G, F.current = !0, s && G !== void 0 ? (Y(), S(), u.current = Date.now(), g(!0), y.current = window.setTimeout(() => {
+          R.current === c && De();
+        }, 0)) : De();
       }
-      ve && (Ue(
+      he && (dr(
         t,
-        x.current,
-        ce.current
-      ), b.current = d);
+        W.current,
+        Te.current
+      ), B.current = l);
     }
-  }, [P, O, n, f, o, r]), L(() => () => {
-    S(), B();
+  }, [j, P, i, p, s, e]), _(() => () => {
+    Y(), S();
   }, []);
-  const h = {
-    height: z,
-    width: Y,
-    ...u
+  const Q = {
+    height: E,
+    width: h,
+    "--owp-tree-grid-header-background-color": v.header.backgroundColor,
+    "--owp-tree-grid-header-color": v.header.color,
+    "--owp-tree-grid-header-font-size": Me(v.header.fontSize),
+    "--owp-tree-grid-header-font-weight": String(v.header.fontWeight),
+    "--owp-tree-grid-cell-font-size": Me(v.cell.fontSize),
+    ...n
   };
-  return (o || V) && (h.position = u != null && u.position && u.position !== "static" ? u.position : "relative", h.isolation = "isolate"), /* @__PURE__ */ qe("div", { ref: ie, className: Oe, style: h, children: [
-    /* @__PURE__ */ q("div", { id: r, className: Ce, style: rr(Ae, ["height", "width"]) }),
-    /* @__PURE__ */ q(
-      Ze,
-      {
-        visible: V,
-        message: C("Message.조회된 결과가 없습니다."),
-        overlayFrame: Re
-      }
-    ),
-    /* @__PURE__ */ q(Xe, { visible: M, overlayFrame: Re })
-  ] });
+  return (s || q) && (Q.position = n != null && n.position && n.position !== "static" ? n.position : "relative", Q.isolation = "isolate"), /* @__PURE__ */ ke(
+    "div",
+    {
+      ref: fe,
+      className: [Ae, M].filter(Boolean).join(" "),
+      style: Q,
+      children: [
+        /* @__PURE__ */ L(Ze, { styles: Rr }),
+        /* @__PURE__ */ L("div", { id: e, className: w, style: lr(A, ["height", "width"]) }),
+        /* @__PURE__ */ L(
+          sr,
+          {
+            visible: q,
+            message: z("Message.조회된 결과가 없습니다."),
+            overlayFrame: we
+          }
+        ),
+        /* @__PURE__ */ L(ir, { visible: k, overlayFrame: we })
+      ]
+    }
+  );
 }, "OwpTreeGrid");
 export {
-  Dr as OwpTreeGrid
+  Pr as OwpTreeGrid
 };
 //# sourceMappingURL=OwpTreeGrid.js.map