@owp/core 2.4.0 → 2.5.0

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=\"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={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: '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","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 {\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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"}

package/dist/components/OwpTextField/OwpTextMaskField.js

@@ -1,106 +1,157 @@
-var j = Object.defineProperty;
-var r = (o, t) => j(o, "name", { value: t, configurable: !0 });
-import { jsxs as v, jsx as n } 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 { FormHelperText as O } from "@mui/material";
-import P from "@mui/material/FormControl";
-import R from "@mui/material/Input";
-import V from "@mui/material/InputLabel";
-import { useId as b, forwardRef as A } from "react";
-import "../../node_modules/.pnpm/imask@7.6.1/node_modules/imask/esm/index.js";
-import "../../node_modules/.pnpm/imask@7.6.1/node_modules/imask/esm/controls/input.js";
-import "../../node_modules/.pnpm/imask@7.6.1/node_modules/imask/esm/masked/factory.js";
-import "../../node_modules/.pnpm/imask@7.6.1/node_modules/imask/esm/controls/mask-element.js";
-import "../../node_modules/.pnpm/imask@7.6.1/node_modules/imask/esm/controls/html-input-mask-element.js";
-import "../../node_modules/.pnpm/imask@7.6.1/node_modules/imask/esm/controls/html-mask-element.js";
-import "../../node_modules/.pnpm/imask@7.6.1/node_modules/imask/esm/controls/html-contenteditable-mask-element.js";
-import "../../node_modules/.pnpm/imask@7.6.1/node_modules/imask/esm/controls/input-history.js";
-import H from "../../node_modules/.pnpm/react-imask@7.6.1_react@19.2.4/node_modules/react-imask/esm/input.js";
-import "../../node_modules/.pnpm/react-imask@7.6.1_react@19.2.4/node_modules/react-imask/esm/mixin.js";
-const L = A(/* @__PURE__ */ r(function(t, e) {
-  const { onMaskChange: m, mask: i, definitions: p, name: s, ...a } = t, { onChange: c, ...u } = a;
-  return /* @__PURE__ */ n(
-    H,
+var z = Object.defineProperty;
+var i = (e, r) => z(e, "name", { value: r, configurable: !0 });
+import { jsxs as E, jsx as M } 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 { FormHelperText as j } from "@mui/material";
+import y from "@mui/material/FormControl";
+import b from "@mui/material/Input";
+import A from "@mui/material/InputLabel";
+import { useId as H, forwardRef as L, useRef as s, useEffect as p } from "react";
+import { InputMask as P } from "imask";
+function $(e, r) {
+  if (typeof e == "function") {
+    e(r);
+    return;
+  }
+  e && (e.current = r);
+}
+i($, "assignInputRef");
+function T({
+  mask: e,
+  definitions: r
+}) {
+  return {
+    mask: e,
+    definitions: r,
+    overwrite: !0
+  };
+}
+i(T, "buildTextMaskOptions");
+const q = L(/* @__PURE__ */ i(function(r, h) {
+  const {
+    onMaskChange: c,
+    mask: a,
+    definitions: l,
+    name: f,
+    value: o,
+    defaultValue: d,
+    ownerState: O,
+    as: C,
+    onChange: R,
+    ...V
+  } = r, k = s(null), u = s(null), g = s(c), v = s(f), x = s(T({ mask: a, definitions: l })), m = s(o !== void 0 ? o : d);
+  p(() => {
+    g.current = c;
+  }, [c]), p(() => {
+    v.current = f;
+  }, [f]), p(() => {
+    const n = k.current;
+    if (!n)
+      return;
+    const t = new P(
+      n,
+      x.current
+    ), S = /* @__PURE__ */ i(() => {
+      g.current({
+        target: {
+          name: v.current ?? n.name ?? "",
+          value: t.value
+        },
+        unmaskedValue: t.unmaskedValue
+      });
+    }, "emitMaskChange");
+    if (t.on("accept", S), u.current = t, m.current !== void 0) {
+      const F = m.current == null ? "" : String(m.current);
+      t.value !== F && (t.value = F);
+    }
+    return () => {
+      t.off("accept", S), t.destroy(), u.current === t && (u.current = null);
+    };
+  }, []), p(() => {
+    const n = u.current;
+    n && n.updateOptions(T({ mask: a, definitions: l }));
+  }, [a, l]), p(() => {
+    const n = u.current;
+    if (!n || o === void 0)
+      return;
+    const t = o == null ? "" : String(o);
+    n.value !== t && (n.value = t);
+  }, [o]);
+  const I = o !== void 0 ? o : d, w = I == null ? "" : String(I);
+  return /* @__PURE__ */ M(
+    "input",
     {
-      ...u,
-      mask: i,
-      definitions: p,
-      inputRef: e,
-      onAccept: /* @__PURE__ */ r((d, f) => {
-        m({
-          target: {
-            name: s ?? "",
-            value: String(d ?? "")
-          },
-          unmaskedValue: f.unmaskedValue
-        });
-      }, "onAccept"),
-      overwrite: !0
+      ...V,
+      defaultValue: w,
+      onChange: R,
+      ref: /* @__PURE__ */ i((n) => {
+        k.current = n, $(h, n);
+      }, "ref")
     }
   );
 }, "TextMaskCustom2"));
-function Z({
-  className: o,
-  sx: t,
-  id: e,
-  name: m,
-  label: i,
-  value: p,
-  defaultValue: s,
-  color: a,
-  onChange: c,
-  error: u,
-  helperText: d,
-  mask: f,
-  definitions: l,
-  variant: h,
-  fullWidth: g,
-  disabled: x,
-  required: C,
-  placeholder: I,
-  autoFocus: M,
-  inputProps: F,
-  inputRef: T
+function W({
+  className: e,
+  sx: r,
+  id: h,
+  name: c,
+  label: a,
+  value: l,
+  defaultValue: f,
+  color: o,
+  onChange: d,
+  error: O,
+  helperText: C,
+  mask: R,
+  definitions: V,
+  variant: k,
+  fullWidth: u,
+  disabled: g,
+  required: v,
+  placeholder: x,
+  autoFocus: m,
+  inputProps: I,
+  inputRef: w
 }) {
-  const w = b(), k = e ?? `text-mask-input-${w}`;
-  return /* @__PURE__ */ v(
-    P,
+  const n = H(), t = h ?? `text-mask-input-${n}`;
+  return /* @__PURE__ */ E(
+    y,
     {
-      color: a,
-      variant: h,
-      fullWidth: g,
-      error: u,
-      disabled: x,
-      required: C,
+      color: o,
+      variant: k,
+      fullWidth: u,
+      error: O,
+      disabled: g,
+      required: v,
       children: [
-        /* @__PURE__ */ n(V, { htmlFor: k, children: i }),
-        /* @__PURE__ */ n(
-          R,
+        a ? /* @__PURE__ */ M(A, { htmlFor: t, children: a }) : null,
+        /* @__PURE__ */ M(
+          b,
           {
-            className: o,
-            sx: t,
-            value: p,
-            defaultValue: s,
-            name: m,
-            id: k,
-            placeholder: I,
-            autoFocus: M,
-            inputRef: T,
-            inputComponent: L,
+            className: e,
+            sx: r,
+            value: l,
+            defaultValue: f,
+            name: c,
+            id: t,
+            placeholder: x,
+            autoFocus: m,
+            inputRef: w,
+            inputComponent: q,
             inputProps: {
-              ...F,
-              onMaskChange: c,
-              mask: f,
-              definitions: l
+              ...I,
+              onMaskChange: d,
+              mask: R,
+              definitions: V
             }
           }
         ),
-        /* @__PURE__ */ n(O, { children: d })
+        C ? /* @__PURE__ */ M(j, { children: C }) : null
       ]
     }
   );
 }
-r(Z, "OwpTextMaskField");
+i(W, "OwpTextMaskField");
 export {
-  Z as OwpTextMaskField
+  W as OwpTextMaskField
 };
 //# sourceMappingURL=OwpTextMaskField.js.map

package/dist/components/OwpTextField/OwpTextMaskField.js.map

@@ -1 +1 @@
-{"version":3,"file":"OwpTextMaskField.js","sources":["../../../src/components/OwpTextField/OwpTextMaskField.tsx"],"sourcesContent":["import { FormHelperText } from '@mui/material';\nimport FormControl from '@mui/material/FormControl';\nimport type { FormControlProps } from '@mui/material/FormControl';\nimport Input from '@mui/material/Input';\nimport type { InputProps as MuiInputProps } from '@mui/material/Input';\nimport type { InputBaseComponentProps } from '@mui/material/InputBase';\nimport InputLabel from '@mui/material/InputLabel';\nimport { forwardRef, type ReactNode, useId } from 'react';\nimport { IMaskInput } from 'react-imask';\n\ntype TextMaskFieldChangeEvent = {\n  target: { name: string; value: string };\n  unmaskedValue: string;\n};\n\ninterface CustomProps {\n  onMaskChange: (event: TextMaskFieldChangeEvent) => void;\n  name?: string;\n  mask: string;\n  definitions?: Record<string, unknown>;\n}\n\ntype OwpTextMaskFieldProps = Omit<MuiInputProps, 'onChange' | 'inputComponent'> &\n  Omit<CustomProps, 'onMaskChange'> & {\n    label?: ReactNode;\n    helperText?: ReactNode;\n    variant?: FormControlProps['variant'];\n    onChange: CustomProps['onMaskChange'];\n  };\n\n/** 마스크 입력 어댑터 */\ntype TextMaskCustomProps = InputBaseComponentProps & CustomProps;\n\nconst TextMaskCustom = forwardRef<HTMLInputElement, TextMaskCustomProps>(function TextMaskCustom(\n  props,\n  ref,\n) {\n  const { onMaskChange, mask, definitions, name, ...other } = props;\n  const { onChange: ignoredOnChange, ...imaskInputProps } = other;\n\n  void ignoredOnChange;\n\n  return (\n    <IMaskInput\n      {...imaskInputProps}\n      mask={mask}\n      definitions={definitions}\n      inputRef={ref}\n      onAccept={(value, maskRef) => {\n        onMaskChange({\n          target: {\n            name: name ?? '',\n            value: String(value ?? ''),\n          },\n          unmaskedValue: maskRef.unmaskedValue,\n        });\n      }}\n      overwrite\n    />\n  );\n});\n\n/**\n * 마스크 텍스트 입력 필드\n * @param mask 입력 마스크 문자열\n * @param definitions 사용자 정의 마스크 정의\n * @param onChange 마스크 변경 이벤트 핸들러\n */\nexport function OwpTextMaskField({\n  className,\n  sx,\n  id: idProp,\n  name,\n  label,\n  value,\n  defaultValue,\n  color,\n  onChange,\n  error,\n  helperText,\n  mask,\n  definitions,\n  variant,\n  fullWidth,\n  disabled,\n  required,\n  placeholder,\n  autoFocus,\n  inputProps,\n  inputRef,\n}: OwpTextMaskFieldProps) {\n  const generatedId = useId();\n  const id = idProp ?? `text-mask-input-${generatedId}`;\n\n  return (\n    <FormControl\n      color={color}\n      variant={variant}\n      fullWidth={fullWidth}\n      error={error}\n      disabled={disabled}\n      required={required}\n    >\n      <InputLabel htmlFor={id}>{label}</InputLabel>\n      <Input\n        className={className}\n        sx={sx}\n        value={value}\n        defaultValue={defaultValue}\n        name={name}\n        id={id}\n        placeholder={placeholder}\n        autoFocus={autoFocus}\n        inputRef={inputRef}\n        inputComponent={TextMaskCustom}\n        inputProps={{\n          ...inputProps,\n          onMaskChange: onChange,\n          mask,\n          definitions,\n        }}\n      />\n      <FormHelperText>{helperText}</FormHelperText>\n    </FormControl>\n  );\n}\n"],"names":["TextMaskCustom","forwardRef","__name","props","ref","onMaskChange","mask","definitions","name","other","ignoredOnChange","imaskInputProps","jsx","IMaskInput","value","maskRef","OwpTextMaskField","className","sx","idProp","label","defaultValue","color","onChange","error","helperText","variant","fullWidth","disabled","required","placeholder","autoFocus","inputProps","inputRef","generatedId","useId","id","jsxs","FormControl","InputLabel","Input","FormHelperText"],"mappings":";;;;;;;;;;;;;;;;;;AAiCA,MAAMA,IAAiBC,EAAkD,gBAAAC,EAAA,SACvEC,GACAC,GACA;AACA,QAAM,EAAE,cAAAC,GAAc,MAAAC,GAAM,aAAAC,GAAa,MAAAC,GAAM,GAAGC,MAAUN,GACtD,EAAE,UAAUO,GAAiB,GAAGC,MAAoBF;AAI1D,SACE,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACE,GAAGF;AAAA,MACJ,MAAAL;AAAA,MACA,aAAAC;AAAA,MACA,UAAUH;AAAA,MACV,UAAU,gBAAAF,EAAA,CAACY,GAAOC,MAAY;AAC5B,QAAAV,EAAa;AAAA,UACX,QAAQ;AAAA,YACN,MAAMG,KAAQ;AAAA,YACd,OAAO,OAAOM,KAAS,EAAE;AAAA,UAAA;AAAA,UAE3B,eAAeC,EAAQ;AAAA,QAAA,CACxB;AAAA,MACH,GARU;AAAA,MASV,WAAS;AAAA,IAAA;AAAA,EAAA;AAGf,GA3ByE,kBA2BxE;AAQM,SAASC,EAAiB;AAAA,EAC/B,WAAAC;AAAA,EACA,IAAAC;AAAA,EACA,IAAIC;AAAA,EACJ,MAAAX;AAAA,EACA,OAAAY;AAAA,EACA,OAAAN;AAAA,EACA,cAAAO;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,YAAAC;AAAA,EACA,MAAAnB;AAAA,EACA,aAAAC;AAAA,EACA,SAAAmB;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAAC;AACF,GAA0B;AACxB,QAAMC,IAAcC,EAAA,GACdC,IAAKjB,KAAU,mBAAmBe,CAAW;AAEnD,SACE,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAAhB;AAAA,MACA,SAAAI;AAAA,MACA,WAAAC;AAAA,MACA,OAAAH;AAAA,MACA,UAAAI;AAAA,MACA,UAAAC;AAAA,MAEA,UAAA;AAAA,QAAA,gBAAAjB,EAAC2B,GAAA,EAAW,SAASH,GAAK,UAAAhB,GAAM;AAAA,QAChC,gBAAAR;AAAA,UAAC4B;AAAA,UAAA;AAAA,YACC,WAAAvB;AAAA,YACA,IAAAC;AAAA,YACA,OAAAJ;AAAA,YACA,cAAAO;AAAA,YACA,MAAAb;AAAA,YACA,IAAA4B;AAAA,YACA,aAAAN;AAAA,YACA,WAAAC;AAAA,YACA,UAAAE;AAAA,YACA,gBAAgBjC;AAAA,YAChB,YAAY;AAAA,cACV,GAAGgC;AAAA,cACH,cAAcT;AAAA,cACd,MAAAjB;AAAA,cACA,aAAAC;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,QAEF,gBAAAK,EAAC6B,KAAgB,UAAAhB,EAAA,CAAW;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGlC;AAzDgBvB,EAAAc,GAAA;"}
+{"version":3,"file":"OwpTextMaskField.js","sources":["../../../src/components/OwpTextField/OwpTextMaskField.tsx"],"sourcesContent":["import { FormHelperText } from '@mui/material';\nimport FormControl from '@mui/material/FormControl';\nimport type { FormControlProps } from '@mui/material/FormControl';\nimport Input from '@mui/material/Input';\nimport type { InputProps as MuiInputProps } from '@mui/material/Input';\nimport type { InputBaseComponentProps } from '@mui/material/InputBase';\nimport InputLabel from '@mui/material/InputLabel';\nimport {\n  forwardRef,\n  type ForwardedRef,\n  type ReactNode,\n  useEffect,\n  useId,\n  useRef,\n} from 'react';\nimport { InputMask as IMaskInput, type Definitions, type FactoryOpts } from 'imask';\n\ntype TextMaskFieldChangeEvent = {\n  target: { name: string; value: string };\n  unmaskedValue: string;\n};\n\ntype TextMaskValue = FactoryOpts['mask'];\n\ninterface CustomProps {\n  onMaskChange: (event: TextMaskFieldChangeEvent) => void;\n  name?: string;\n  mask: TextMaskValue;\n  definitions?: Definitions;\n}\n\ntype OwpTextMaskFieldProps = Omit<MuiInputProps, 'onChange' | 'inputComponent'> &\n  Omit<CustomProps, 'onMaskChange'> & {\n    label?: ReactNode;\n    helperText?: ReactNode;\n    variant?: FormControlProps['variant'];\n    onChange: CustomProps['onMaskChange'];\n  };\n\n/** 마스크 입력 어댑터 */\ntype TextMaskCustomProps = InputBaseComponentProps & CustomProps;\n\ntype TextMaskOptions = FactoryOpts & {\n  definitions?: Definitions;\n  overwrite: true;\n};\n\n/** ref 전달 정규화 */\nfunction assignInputRef<T>(ref: ForwardedRef<T>, value: T | null) {\n  if (typeof ref === 'function') {\n    ref(value);\n    return;\n  }\n\n  if (ref) {\n    ref.current = value;\n  }\n}\n\n/** 마스크 옵션 생성 */\nfunction buildTextMaskOptions({\n  mask,\n  definitions,\n}: Pick<CustomProps, 'mask' | 'definitions'>): TextMaskOptions {\n  return {\n    mask,\n    definitions,\n    overwrite: true,\n  } as TextMaskOptions;\n}\n\nconst TextMaskCustom = forwardRef<HTMLInputElement, TextMaskCustomProps>(function TextMaskCustom(\n  props,\n  ref,\n) {\n  const {\n    onMaskChange,\n    mask,\n    definitions,\n    name,\n    value,\n    defaultValue,\n    ownerState: ignoredOwnerState,\n    as: ignoredAs,\n    onChange,\n    ...other\n  } = props;\n  const inputElementRef = useRef<HTMLInputElement | null>(null);\n  const maskRef = useRef<IMaskInput<FactoryOpts> | null>(null);\n  const onMaskChangeRef = useRef(onMaskChange);\n  const nameRef = useRef(name);\n  const initialMaskOptionsRef = useRef(buildTextMaskOptions({ mask, definitions }));\n  const initialValueRef = useRef(value !== undefined ? value : defaultValue);\n\n  void ignoredOwnerState;\n  void ignoredAs;\n\n  useEffect(() => {\n    onMaskChangeRef.current = onMaskChange;\n  }, [onMaskChange]);\n\n  useEffect(() => {\n    nameRef.current = name;\n  }, [name]);\n\n  useEffect(() => {\n    const inputElement = inputElementRef.current;\n\n    if (!inputElement) {\n      return;\n    }\n\n    const maskInstance = new IMaskInput(\n      inputElement,\n      initialMaskOptionsRef.current as FactoryOpts,\n    );\n    const emitMaskChange = () => {\n      onMaskChangeRef.current({\n        target: {\n          name: nameRef.current ?? inputElement.name ?? '',\n          value: maskInstance.value,\n        },\n        unmaskedValue: maskInstance.unmaskedValue,\n      });\n    };\n\n    maskInstance.on('accept', emitMaskChange);\n    maskRef.current = maskInstance;\n\n    if (initialValueRef.current !== undefined) {\n      const normalizedInitialValue =\n        initialValueRef.current == null ? '' : String(initialValueRef.current);\n\n      if (maskInstance.value !== normalizedInitialValue) {\n        maskInstance.value = normalizedInitialValue;\n      }\n    }\n\n    return () => {\n      maskInstance.off('accept', emitMaskChange);\n      maskInstance.destroy();\n\n      if (maskRef.current === maskInstance) {\n        maskRef.current = null;\n      }\n    };\n  }, []);\n\n  useEffect(() => {\n    const maskInstance = maskRef.current;\n\n    if (!maskInstance) {\n      return;\n    }\n\n    maskInstance.updateOptions(buildTextMaskOptions({ mask, definitions }) as FactoryOpts);\n  }, [mask, definitions]);\n\n  useEffect(() => {\n    const maskInstance = maskRef.current;\n\n    if (!maskInstance || value === undefined) {\n      return;\n    }\n\n    const normalizedValue = value == null ? '' : String(value);\n\n    if (maskInstance.value !== normalizedValue) {\n      maskInstance.value = normalizedValue;\n    }\n  }, [value]);\n\n  const initialValue = value !== undefined ? value : defaultValue;\n  const normalizedInitialValue = initialValue == null ? '' : String(initialValue);\n\n  return (\n    <input\n      {...other}\n      defaultValue={normalizedInitialValue}\n      onChange={onChange}\n      ref={(element) => {\n        inputElementRef.current = element;\n        assignInputRef(ref, element);\n      }}\n    />\n  );\n});\n\n/**\n * 마스크 텍스트 입력 필드\n * @param mask 입력 마스크 정의\n * @param definitions 사용자 정의 마스크 정의\n * @param onChange 마스크 변경 이벤트 핸들러\n */\nexport function OwpTextMaskField({\n  className,\n  sx,\n  id: idProp,\n  name,\n  label,\n  value,\n  defaultValue,\n  color,\n  onChange,\n  error,\n  helperText,\n  mask,\n  definitions,\n  variant,\n  fullWidth,\n  disabled,\n  required,\n  placeholder,\n  autoFocus,\n  inputProps,\n  inputRef,\n}: OwpTextMaskFieldProps) {\n  const generatedId = useId();\n  const id = idProp ?? `text-mask-input-${generatedId}`;\n\n  return (\n    <FormControl\n      color={color}\n      variant={variant}\n      fullWidth={fullWidth}\n      error={error}\n      disabled={disabled}\n      required={required}\n    >\n      {label ? <InputLabel htmlFor={id}>{label}</InputLabel> : null}\n      <Input\n        className={className}\n        sx={sx}\n        value={value}\n        defaultValue={defaultValue}\n        name={name}\n        id={id}\n        placeholder={placeholder}\n        autoFocus={autoFocus}\n        inputRef={inputRef}\n        inputComponent={TextMaskCustom}\n        inputProps={{\n          ...inputProps,\n          onMaskChange: onChange,\n          mask,\n          definitions,\n        }}\n      />\n      {helperText ? <FormHelperText>{helperText}</FormHelperText> : null}\n    </FormControl>\n  );\n}\n"],"names":["assignInputRef","ref","value","__name","buildTextMaskOptions","mask","definitions","TextMaskCustom","forwardRef","props","onMaskChange","name","defaultValue","ignoredOwnerState","ignoredAs","onChange","other","inputElementRef","useRef","maskRef","onMaskChangeRef","nameRef","initialMaskOptionsRef","initialValueRef","useEffect","inputElement","maskInstance","IMaskInput","emitMaskChange","normalizedInitialValue","normalizedValue","initialValue","jsx","element","OwpTextMaskField","className","sx","idProp","label","color","error","helperText","variant","fullWidth","disabled","required","placeholder","autoFocus","inputProps","inputRef","generatedId","useId","id","jsxs","FormControl","InputLabel","Input","FormHelperText"],"mappings":"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"}

package/dist/components/OwpTreeGrid/internal/OwpTreeGridNoDataOverlay.js

@@ -1,8 +1,9 @@
 var r = Object.defineProperty;
 var n = (e, i) => r(e, "name", { value: i, configurable: !0 });
 import { jsx as o } 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 p from "@mui/material/Typography";
-import { TREE_GRID_NO_DATA_OVERLAY_Z_INDEX as l } from "./hooks/useOwpTreeGridOverlayFrame.js";
+import { TREEGRID_FONT_FAMILY_STACK as p } from "../../../constants/treeGrid.js";
+import l from "@mui/material/Typography";
+import { TREE_GRID_NO_DATA_OVERLAY_Z_INDEX as f } from "./hooks/useOwpTreeGridOverlayFrame.js";
 const c = /* @__PURE__ */ n(({
   visible: e,
   message: i,
@@ -17,18 +18,18 @@ const c = /* @__PURE__ */ n(({
       top: t.top,
       width: t.width,
       height: t.height,
-      zIndex: l,
+      zIndex: f,
       display: "flex",
       alignItems: "center",
       justifyContent: "center",
       pointerEvents: "none"
     },
     children: /* @__PURE__ */ o(
-      p,
+      l,
       {
         sx: {
           color: "#111112",
-          fontFamily: "RobotoLight, sans-serif",
+          fontFamily: p,
           fontSize: "14px",
           lineHeight: "16px",
           letterSpacing: "0.04em"

package/dist/components/OwpTreeGrid/internal/OwpTreeGridNoDataOverlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"OwpTreeGridNoDataOverlay.js","sources":["../../../../src/components/OwpTreeGrid/internal/OwpTreeGridNoDataOverlay.tsx"],"sourcesContent":["import Typography from '@mui/material/Typography';\nimport {\n  type OwpTreeGridOverlayFrame,\n  TREE_GRID_NO_DATA_OVERLAY_Z_INDEX,\n} from './hooks/useOwpTreeGridOverlayFrame';\n\ntype OwpTreeGridNoDataOverlayProps = {\n  visible: boolean;\n  message: string;\n  overlayFrame: OwpTreeGridOverlayFrame;\n};\n\n/**\n * TreeGrid no-data overlay\n * @param visible overlay visibility\n * @param message no-data message\n * @param overlayFrame overlay frame\n */\nconst OwpTreeGridNoDataOverlay = ({\n  visible,\n  message,\n  overlayFrame,\n}: OwpTreeGridNoDataOverlayProps) => {\n  if (!visible) {\n    return null;\n  }\n\n  return (\n    <div\n      aria-hidden=\"true\"\n      style={{\n        position: 'absolute',\n        left: overlayFrame.left,\n        top: overlayFrame.top,\n        width: overlayFrame.width,\n        height: overlayFrame.height,\n        zIndex: TREE_GRID_NO_DATA_OVERLAY_Z_INDEX,\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        pointerEvents: 'none',\n      }}\n    >\n      <Typography\n        sx={{\n          color: '#111112',\n          fontFamily: 'RobotoLight, sans-serif',\n          fontSize: '14px',\n          lineHeight: '16px',\n          letterSpacing: '0.04em',\n        }}\n      >\n        {message}\n      </Typography>\n    </div>\n  );\n};\n\nexport { OwpTreeGridNoDataOverlay };\n"],"names":["OwpTreeGridNoDataOverlay","__name","visible","message","overlayFrame","jsx","TREE_GRID_NO_DATA_OVERLAY_Z_INDEX","Typography"],"mappings":";;;;;AAkBA,MAAMA,IAA2B,gBAAAC,EAAA,CAAC;AAAA,EAChC,SAAAC;AAAA,EACA,SAAAC;AAAA,EACA,cAAAC;AACF,MACOF,IAKH,gBAAAG;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,eAAY;AAAA,IACZ,OAAO;AAAA,MACL,UAAU;AAAA,MACV,MAAMD,EAAa;AAAA,MACnB,KAAKA,EAAa;AAAA,MAClB,OAAOA,EAAa;AAAA,MACpB,QAAQA,EAAa;AAAA,MACrB,QAAQE;AAAA,MACR,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,eAAe;AAAA,IAAA;AAAA,IAGjB,UAAA,gBAAAD;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,IAAI;AAAA,UACF,OAAO;AAAA,UACP,YAAY;AAAA,UACZ,UAAU;AAAA,UACV,YAAY;AAAA,UACZ,eAAe;AAAA,QAAA;AAAA,QAGhB,UAAAJ;AAAA,MAAA;AAAA,IAAA;AAAA,EACH;AAAA,IA7BK,MANsB;"}
+{"version":3,"file":"OwpTreeGridNoDataOverlay.js","sources":["../../../../src/components/OwpTreeGrid/internal/OwpTreeGridNoDataOverlay.tsx"],"sourcesContent":["import { TREEGRID_FONT_FAMILY_STACK } from '@/constants/treeGrid';\nimport Typography from '@mui/material/Typography';\nimport {\n  type OwpTreeGridOverlayFrame,\n  TREE_GRID_NO_DATA_OVERLAY_Z_INDEX,\n} from './hooks/useOwpTreeGridOverlayFrame';\n\ntype OwpTreeGridNoDataOverlayProps = {\n  visible: boolean;\n  message: string;\n  overlayFrame: OwpTreeGridOverlayFrame;\n};\n\n/**\n * TreeGrid no-data overlay\n * @param visible overlay visibility\n * @param message no-data message\n * @param overlayFrame overlay frame\n */\nconst OwpTreeGridNoDataOverlay = ({\n  visible,\n  message,\n  overlayFrame,\n}: OwpTreeGridNoDataOverlayProps) => {\n  if (!visible) {\n    return null;\n  }\n\n  return (\n    <div\n      aria-hidden=\"true\"\n      style={{\n        position: 'absolute',\n        left: overlayFrame.left,\n        top: overlayFrame.top,\n        width: overlayFrame.width,\n        height: overlayFrame.height,\n        zIndex: TREE_GRID_NO_DATA_OVERLAY_Z_INDEX,\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        pointerEvents: 'none',\n      }}\n    >\n      <Typography\n        sx={{\n          color: '#111112',\n          fontFamily: TREEGRID_FONT_FAMILY_STACK,\n          fontSize: '14px',\n          lineHeight: '16px',\n          letterSpacing: '0.04em',\n        }}\n      >\n        {message}\n      </Typography>\n    </div>\n  );\n};\n\nexport { OwpTreeGridNoDataOverlay };\n"],"names":["OwpTreeGridNoDataOverlay","__name","visible","message","overlayFrame","jsx","TREE_GRID_NO_DATA_OVERLAY_Z_INDEX","Typography","TREEGRID_FONT_FAMILY_STACK"],"mappings":";;;;;;AAmBA,MAAMA,IAA2B,gBAAAC,EAAA,CAAC;AAAA,EAChC,SAAAC;AAAA,EACA,SAAAC;AAAA,EACA,cAAAC;AACF,MACOF,IAKH,gBAAAG;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,eAAY;AAAA,IACZ,OAAO;AAAA,MACL,UAAU;AAAA,MACV,MAAMD,EAAa;AAAA,MACnB,KAAKA,EAAa;AAAA,MAClB,OAAOA,EAAa;AAAA,MACpB,QAAQA,EAAa;AAAA,MACrB,QAAQE;AAAA,MACR,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,eAAe;AAAA,IAAA;AAAA,IAGjB,UAAA,gBAAAD;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,IAAI;AAAA,UACF,OAAO;AAAA,UACP,YAAYC;AAAA,UACZ,UAAU;AAAA,UACV,YAAY;AAAA,UACZ,eAAe;AAAA,QAAA;AAAA,QAGhB,UAAAL;AAAA,MAAA;AAAA,IAAA;AAAA,EACH;AAAA,IA7BK,MANsB;"}