@nethru/ui 1.0.82 → 2.0.0

package/dist/AppendableFormList.js

@@ -1,56 +0,0 @@
-import React from "react";
-import { Button, IconButton, Stack, Tooltip, Typography } from "@mui/material";
-import AddIcon from "@mui/icons-material/Add";
-import DeleteIcon from "@mui/icons-material/Delete";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-export default function AppendableFormList({
-  gap = 1,
-  forms,
-  renderForm,
-  addOns,
-  onAppend,
-  onRemove,
-  readOnly
-}) {
-  return /*#__PURE__*/_jsxs(Stack, {
-    gap: gap,
-    children: [/*#__PURE__*/_jsxs(_Fragment, {
-      children: [forms.map((form, index) => /*#__PURE__*/_jsxs(Stack, {
-        direction: "row",
-        alignItems: "end",
-        gap: 2,
-        children: [renderForm(form, index), !readOnly && /*#__PURE__*/_jsx(Tooltip, {
-          title: "\uC0AD\uC81C",
-          children: /*#__PURE__*/_jsx(IconButton, {
-            onClick: _ => onRemove(index),
-            size: "small",
-            sx: {
-              ml: '-10px',
-              mb: '-5px'
-            },
-            children: /*#__PURE__*/_jsx(DeleteIcon, {
-              fontSize: "small"
-            })
-          })
-        })]
-      }, index)), forms.length === 0 && /*#__PURE__*/_jsx(Typography, {
-        variant: "body2",
-        sx: {
-          color: '#999'
-        },
-        children: "\uD56D\uBAA9\uC774 \uC5C6\uC2B5\uB2C8\uB2E4"
-      })]
-    }), !readOnly && /*#__PURE__*/_jsxs(Stack, {
-      direction: "row",
-      gap: 1,
-      children: [/*#__PURE__*/_jsx(Button, {
-        variant: "text",
-        startIcon: /*#__PURE__*/_jsx(AddIcon, {}),
-        onClick: onAppend,
-        children: "\uCD94\uAC00"
-      }), addOns]
-    })]
-  });
-}

package/dist/AvatarDropdown.js

@@ -1,80 +0,0 @@
-import { useMemo, useState } from 'react';
-import { Avatar, Box, IconButton } from '@mui/material';
-import Menu from '@mui/material/Menu';
-import MenuItem from '@mui/material/MenuItem';
-import ListItemIcon from '@mui/material/ListItemIcon';
-import Divider from '@mui/material/Divider';
-import LogoutRoundedIcon from '@mui/icons-material/LogoutRounded';
-import { red } from '@mui/material/colors';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export default function AvatarDropdown({
-  name,
-  color,
-  bgcolor,
-  children,
-  onProfileClick,
-  onLogoutClick,
-  ...props
-}) {
-  const [anchorEl, setAnchorEl] = useState(null);
-  const open = Boolean(anchorEl);
-  const firstLetter = useMemo(() => {
-    return name && name.length > 0 ? name[0].toUpperCase() : "?";
-  }, [name]);
-  const handleClick = event => setAnchorEl(event.currentTarget);
-  const handleClose = () => setAnchorEl(null);
-  const styles = {
-    color: color ? color : '#fff',
-    bgcolor: bgcolor ? bgcolor : red[900],
-    width: 32,
-    height: 32,
-    fontSize: 16
-  };
-  return /*#__PURE__*/_jsxs(Box, {
-    ...props,
-    children: [/*#__PURE__*/_jsx(IconButton, {
-      onClick: handleClick,
-      size: "small",
-      sx: {
-        ml: 2
-      },
-      children: /*#__PURE__*/_jsx(Avatar, {
-        sx: styles,
-        children: firstLetter
-      })
-    }), /*#__PURE__*/_jsxs(Menu, {
-      anchorEl: anchorEl,
-      open: open,
-      onClose: handleClose,
-      onClick: handleClose,
-      sx: {
-        '.MuiButtonBase-root.MuiMenuItem-root': {
-          fontSize: 14
-        }
-      },
-      children: [/*#__PURE__*/_jsxs(MenuItem, {
-        onClick: onProfileClick,
-        children: [/*#__PURE__*/_jsx(ListItemIcon, {
-          children: /*#__PURE__*/_jsx(Avatar, {
-            sx: {
-              ...styles,
-              mr: 1,
-              fontSize: 13,
-              width: 22,
-              height: 22
-            },
-            children: firstLetter
-          })
-        }), name]
-      }), /*#__PURE__*/_jsx(Divider, {}), children, children && /*#__PURE__*/_jsx(Divider, {}), /*#__PURE__*/_jsxs(MenuItem, {
-        onClick: onLogoutClick,
-        children: [/*#__PURE__*/_jsx(ListItemIcon, {
-          children: /*#__PURE__*/_jsx(LogoutRoundedIcon, {
-            fontSize: "small"
-          })
-        }), "\uB85C\uADF8\uC544\uC6C3"]
-      })]
-    })]
-  });
-}

package/dist/Button.js

@@ -1,61 +0,0 @@
-import { useMemo } from "react";
-import MuiButton from "@mui/material/Button";
-import { Box, CircularProgress, IconButton } from "@mui/material";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export default function Button({
-  label,
-  icon,
-  iconPlacement = 'start',
-  iconSize = '20px',
-  iconProps = {},
-  progressProps = {},
-  loading = false,
-  ...props
-}) {
-  const iconComponent = useMemo(() => {
-    return icon ? /*#__PURE__*/_jsx(Box, {
-      component: icon,
-      sx: {
-        '&.MuiSvgIcon-root': {
-          fontSize: `${iconSize}!important`
-        }
-      },
-      ...iconProps
-    }) : null;
-  }, [icon, iconSize, iconProps]);
-  const startIcon = useMemo(() => {
-    return iconPlacement === 'start' ? iconComponent : null;
-  }, [iconComponent, iconPlacement]);
-  const endIcon = useMemo(() => {
-    return iconPlacement === 'end' ? iconComponent : null;
-  }, [iconComponent, iconPlacement]);
-  return /*#__PURE__*/_jsxs(Box, {
-    sx: {
-      position: 'relative',
-      width: 'fit-content'
-    },
-    children: [label ? /*#__PURE__*/_jsx(MuiButton, {
-      startIcon: startIcon,
-      endIcon: endIcon,
-      disabled: loading,
-      ...props,
-      children: label
-    }) : /*#__PURE__*/_jsx(IconButton, {
-      disabled: loading,
-      ...props,
-      children: iconComponent
-    }), loading && /*#__PURE__*/_jsx(CircularProgress, {
-      size: 24,
-      thickness: 6,
-      sx: {
-        position: 'absolute',
-        top: '50%',
-        left: '50%',
-        marginTop: '-12px',
-        marginLeft: '-12px'
-      },
-      ...progressProps
-    })]
-  });
-}

package/dist/Checkbox.js

@@ -1,27 +0,0 @@
-import { useMemo } from "react";
-import MuiCheckbox from "@mui/material/Checkbox";
-import { FormControlLabel } from "@mui/material";
-import { jsx as _jsx } from "react/jsx-runtime";
-export default function Checkbox({
-  label,
-  size = 'medium',
-  sx,
-  ...props
-}) {
-  const styles = useMemo(() => ({
-    '& .MuiFormControlLabel-label': {
-      fontSize: size === 'small' ? '14px' : '16px'
-    }
-  }), [size]);
-  return /*#__PURE__*/_jsx(FormControlLabel, {
-    label: label,
-    control: /*#__PURE__*/_jsx(MuiCheckbox, {
-      size: size,
-      ...props
-    }),
-    sx: {
-      ...styles,
-      ...sx
-    }
-  });
-}

package/dist/CircularProgress.js

@@ -1,33 +0,0 @@
-import { Box, Typography } from "@mui/material";
-import MuiCircularProgress from "@mui/material/CircularProgress";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export default function CircularProgress(props) {
-  return /*#__PURE__*/_jsxs(Box, {
-    sx: {
-      position: 'relative',
-      display: 'inline-flex'
-    },
-    children: [/*#__PURE__*/_jsx(MuiCircularProgress, {
-      variant: "determinate",
-      ...props
-    }), /*#__PURE__*/_jsx(Box, {
-      sx: {
-        top: 0,
-        left: 0,
-        bottom: 0,
-        right: 0,
-        position: 'absolute',
-        display: 'flex',
-        alignItems: 'center',
-        justifyContent: 'center'
-      },
-      children: /*#__PURE__*/_jsx(Typography, {
-        variant: "caption",
-        component: "div",
-        color: "text.secondary",
-        children: `${Math.round(props.value)}%`
-      })
-    })]
-  });
-}

package/dist/ColumnedSection.js

@@ -1,64 +0,0 @@
-import { List, Stack } from "@mui/material";
-import ListItem from "./ListItem";
-import ListItemGrid from "./ListItemGrid";
-import { useMemo } from "react";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export default function ColumnedSection({
-  columns,
-  labels = [],
-  contents = [],
-  horizontalGap = 1,
-  verticalGap = 0.5,
-  sx
-}) {
-  const width = useMemo(() => {
-    return `${100 / columns}%`;
-  }, [columns]);
-  const styles = useMemo(() => {
-    return {
-      width: width,
-      bgcolor: '#f8f9fa',
-      p: '10px 20px',
-      borderRadius: '7px'
-    };
-  }, [width]);
-  return /*#__PURE__*/_jsx(List, {
-    children: /*#__PURE__*/_jsxs(ListItem, {
-      grid: true,
-      children: [labels.length > 0 && /*#__PURE__*/_jsx(ListItemGrid, {
-        xs: 12,
-        children: /*#__PURE__*/_jsx(Stack, {
-          direction: "row",
-          gap: horizontalGap,
-          children: labels.map((label, index) => /*#__PURE__*/_jsx(Stack, {
-            gap: verticalGap,
-            sx: {
-              width: width
-            },
-            children: /*#__PURE__*/_jsx(Stack, {
-              direction: "row",
-              alignItems: "baseline",
-              spacing: 1,
-              children: label
-            })
-          }, index))
-        })
-      }), /*#__PURE__*/_jsx(ListItemGrid, {
-        xs: 12,
-        children: /*#__PURE__*/_jsx(Stack, {
-          direction: "row",
-          gap: horizontalGap,
-          children: contents.map((content, index) => /*#__PURE__*/_jsx(Stack, {
-            gap: verticalGap,
-            sx: {
-              ...styles,
-              ...sx
-            },
-            children: content
-          }, index))
-        })
-      })]
-    })
-  });
-}

package/dist/ConfirmDialog.js

@@ -1,65 +0,0 @@
-import { Box, Button, Stack } from "@mui/material";
-import DialogContent from "@mui/material/DialogContent";
-import DialogContentText from "@mui/material/DialogContentText";
-import DialogActions from "@mui/material/DialogActions";
-import Dialog from "./Dialog";
-import CampaignIcon from "@mui/icons-material/Campaign";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export default function ConfirmDialog({
-  open,
-  onConfirm,
-  onCancel,
-  content,
-  confirmText = '예',
-  cancelText = '아니오'
-}) {
-  return /*#__PURE__*/_jsxs(Dialog, {
-    fullWidth: true,
-    contentFontSize: 15,
-    open: open,
-    onClose: onCancel,
-    children: [/*#__PURE__*/_jsx(DialogContent, {
-      sx: {
-        pt: 4
-      },
-      children: /*#__PURE__*/_jsxs(Stack, {
-        direction: "row",
-        alignItems: "center",
-        gap: 2,
-        children: [/*#__PURE__*/_jsx(CampaignIcon, {
-          sx: {
-            color: '#777',
-            '&': {
-              fontSize: 50
-            }
-          }
-        }), /*#__PURE__*/_jsx(DialogContentText, {
-          component: "div",
-          children: /*#__PURE__*/_jsx(Box, {
-            component: "div",
-            sx: {
-              whiteSpace: 'pre-wrap'
-            },
-            children: content.replace(/(\\n)/g, '\n')
-          })
-        })]
-      })
-    }), /*#__PURE__*/_jsxs(DialogActions, {
-      sx: {
-        mr: 1.5,
-        mb: 1
-      },
-      children: [/*#__PURE__*/_jsx(Button, {
-        variant: "contained",
-        onClick: onConfirm,
-        autoFocus: true,
-        children: confirmText
-      }), /*#__PURE__*/_jsx(Button, {
-        variant: "outlined",
-        onClick: onCancel,
-        children: cancelText
-      })]
-    })]
-  });
-}

package/dist/DataGrid.js

@@ -1,150 +0,0 @@
-import { useState } from "react";
-import { DataGridPro as MuiDataGridPro, GRID_CHECKBOX_SELECTION_COL_DEF, GridCell, GridToolbarQuickFilter, koKR } from "@mui/x-data-grid-pro";
-import { Box, Stack } from "@mui/material";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const styles = {
-  borderLeft: '0px',
-  borderRight: '0px',
-  '&.MuiDataGrid-root': {
-    borderTop: 'none',
-    borderBottom: 'none'
-  },
-  '.MuiDataGrid-columnSeparator': {
-    // visibility: 'hidden !important'
-  },
-  '.MuiDataGrid-columnHeaders': {
-    //borderBottom: 'none !important'
-  },
-  '.MuiDataGrid-columnHeader.borderTop': {
-    borderTop: '1px solid rgba(224, 224, 224, 1)'
-  },
-  '&.MuiDataGrid-root .MuiDataGrid-columnHeader:focus, &.MuiDataGrid-root .MuiDataGrid-cell:focus': {
-    outline: 'none !important'
-  },
-  '&.MuiDataGrid-root .MuiDataGrid-columnHeader:focus-within, &.MuiDataGrid-root .MuiDataGrid-cell:focus-within': {
-    outline: 'none !important'
-  },
-  '.MuiDataGrid-row.odd': {
-    backgroundColor: 'rgba(0, 0, 0, 0.01)'
-  },
-  '.MuiDataGrid-row.odd:hover': {
-    backgroundColor: 'rgba(0, 0, 0, 0.04)'
-  },
-  '.MuiDataGrid-cell:hover': {
-    backgroundColor: 'rgba(0, 0, 0, 0.01)'
-  },
-  '.MuiDataGrid-row .MuiDataGrid-cell.actions > *, .MuiDataGrid-row .MuiDataGrid-cell .actions > *': {
-    visibility: 'hidden'
-  },
-  '.MuiDataGrid-row:hover .MuiDataGrid-cell.actions > *, .MuiDataGrid-row:hover .MuiDataGrid-cell .actions > *': {
-    visibility: 'visible'
-  },
-  '.MuiDataGrid-cell .aggr strong': {
-    fontSize: '15px'
-  },
-  '.MuiDataGrid-cell .aggr small': {
-    fontSize: '12px'
-  }
-};
-export default function DataGrid({
-  columns,
-  rows,
-  customToolbar = /*#__PURE__*/_jsx(_Fragment, {}),
-  customGridCellMap,
-  slots = {},
-  slotProps,
-  initialState,
-  hideToolbar = false,
-  localText,
-  sx,
-  ...props
-}) {
-  const getTogglableColumns = columns => columns.filter(column => column.field !== 'id').map(column => column.field);
-  const [columnVisibilityModel, setColumnVisibilityModel] = useState({
-    id: false
-  });
-  const CustomToolbar = function () {
-    return /*#__PURE__*/_jsxs(Stack, {
-      direction: "row",
-      justifyContent: "space-between",
-      children: [/*#__PURE__*/_jsx(Box, {
-        children: customToolbar
-      }), /*#__PURE__*/_jsx(Box, {
-        children: /*#__PURE__*/_jsx(GridToolbarQuickFilter, {})
-      })]
-    });
-  };
-  const CustomGridCell = function (params) {
-    if (props && props.checkboxSelection && params.column.field === GRID_CHECKBOX_SELECTION_COL_DEF.field) return /*#__PURE__*/_jsx(GridCell, {
-      ...params
-    });
-    let children;
-    const func = customGridCellMap[params.column.field];
-    if (func) children = func(params);
-    if (!children) children = /*#__PURE__*/_jsx(Box, {
-      sx: {
-        mt: 2,
-        mb: 2
-      },
-      children: params.formattedValue
-    });
-    return /*#__PURE__*/_jsx(GridCell, {
-      ...params,
-      children: children
-    });
-  };
-  return /*#__PURE__*/_jsx(MuiDataGridPro, {
-    columns: columns,
-    rows: rows,
-    autoHeight: true,
-    pagination: true,
-    disableColumnMenu: true,
-    disableColumnReorder: true,
-    disableRowSelectionOnClick: true,
-    getRowClassName: params => params.indexRelativeToCurrentPage % 2 === 0 ? '' : 'odd',
-    columnVisibilityModel: columnVisibilityModel,
-    onColumnVisibilityModelChange: model => setColumnVisibilityModel(model),
-    getRowHeight: () => 'auto',
-    localeText: {
-      ...koKR.components.MuiDataGrid.defaultProps.localeText,
-      noRowsLabel: '항목이 없습니다.',
-      ...localText
-    },
-    slots: {
-      toolbar: hideToolbar ? null : CustomToolbar,
-      cell: customGridCellMap ? CustomGridCell : undefined,
-      ...slots
-    },
-    slotProps: {
-      columnsPanel: {
-        getTogglableColumns
-      },
-      toolbar: {
-        showQuickFilter: true
-      },
-      ...slotProps
-    },
-    initialState: {
-      filter: {
-        filterModel: {
-          items: [],
-          quickFilterExcludeHiddenColumns: true
-        }
-      },
-      pagination: {
-        paginationModel: {
-          pageSize: 25,
-          page: 0
-        }
-      },
-      ...initialState
-    },
-    sx: {
-      ...sx,
-      ...styles
-    },
-    ...props
-  });
-}

package/dist/Dialog.js

@@ -1,42 +0,0 @@
-import { Slide, Zoom } from "@mui/material";
-import MuiDialog from "@mui/material/Dialog";
-import { forwardRef } from "react";
-import { jsx as _jsx } from "react/jsx-runtime";
-const ZoomTransition = /*#__PURE__*/forwardRef(function (props, ref) {
-  return /*#__PURE__*/_jsx(Zoom, {
-    ref: ref,
-    ...props
-  });
-});
-const SlideTransition = /*#__PURE__*/forwardRef(function (props, ref) {
-  return /*#__PURE__*/_jsx(Slide, {
-    direction: "down",
-    ref: ref,
-    ...props
-  });
-});
-export default function Dialog({
-  center = true,
-  contentFontSize = 16,
-  children,
-  sx,
-  ...props
-}) {
-  const styles = {
-    '& .MuiDialog-container': {
-      alignItems: center ? 'center' : 'flex-start'
-    },
-    '.MuiTypography-root.MuiDialogContentText-root': {
-      fontSize: contentFontSize
-    }
-  };
-  return /*#__PURE__*/_jsx(MuiDialog, {
-    TransitionComponent: center ? ZoomTransition : SlideTransition,
-    sx: {
-      ...styles,
-      ...sx
-    },
-    ...props,
-    children: children
-  });
-}

package/dist/DropdownButton.js

@@ -1,59 +0,0 @@
-import * as React from "react";
-import { Divider, Menu, MenuItem } from "@mui/material";
-import Button from "./Button";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export default function DropdownButton({
-  label,
-  icon,
-  iconPlacement = 'start',
-  iconSize = '20px',
-  iconProps = {},
-  options = [],
-  onClick,
-  onSelect,
-  menuProps = {},
-  ...props
-}) {
-  const [anchor, setAnchor] = React.useState(null);
-  const handleClick = event => {
-    setAnchor(event.currentTarget);
-    if (onClick) onClick(event);
-  };
-  const handleSelect = id => {
-    setAnchor(null);
-    if (onSelect) onSelect(id);
-  };
-  return /*#__PURE__*/_jsxs(_Fragment, {
-    children: [/*#__PURE__*/_jsx(Button, {
-      label: label,
-      icon: icon,
-      iconPlacement: iconPlacement,
-      iconSize: iconSize,
-      iconProps: iconProps,
-      onClick: handleClick,
-      ...props
-    }), options.length > 0 && /*#__PURE__*/_jsx(Menu, {
-      anchorEl: anchor,
-      open: Boolean(anchor),
-      onClose: _ => setAnchor(null),
-      sx: {
-        ...styles,
-        ...menuProps.sx
-      },
-      ...menuProps,
-      children: options.map(option => {
-        return option.type === 'divider' ? /*#__PURE__*/_jsx(Divider, {}) : /*#__PURE__*/_jsx(MenuItem, {
-          onClick: _ => handleSelect(option.id),
-          children: option.label
-        }, option.id);
-      })
-    })]
-  });
-}
-const styles = {
-  '.MuiButtonBase-root.MuiMenuItem-root': {
-    fontSize: 14
-  }
-};

package/dist/FormLabel.js

@@ -1,23 +0,0 @@
-import React from "react";
-import MuiFormLabel from "@mui/material/FormLabel";
-import { jsx as _jsx } from "react/jsx-runtime";
-export default function FormLabel({
-  value = false,
-  children,
-  sx,
-  ...props
-}) {
-  const styles = {
-    color: value ? 'rgba(0, 0, 0, 0.87)' : 'rgba(0, 0, 0, 0.6)',
-    fontSize: value ? 16 : 14,
-    fontWeight: value ? 600 : 400
-  };
-  return /*#__PURE__*/_jsx(MuiFormLabel, {
-    sx: {
-      ...sx,
-      ...styles
-    },
-    ...props,
-    children: children
-  });
-}