} event The event source of the callback.
* You can pull out the new value by accessing `event.target.value` (string).
* You can pull out the new checked state by accessing `event.target.checked` (boolean).
*/
onChange: PropTypes.func,
/**
* If `true`, the `input` element is required.
* @default false
*/
required: PropTypes.bool,
/**
* The size of the component.
* `small` is equivalent to the dense switch styling.
* @default 'medium'
*/
size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['medium', 'small']), PropTypes.string]),
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
/**
* The value of the component. The DOM API casts this to a string.
* The browser uses "on" as the default value.
*/
value: PropTypes.any
} ;
var Switch$1 = Switch;
function getTabUtilityClass(slot) {
return generateUtilityClass('MuiTab', slot);
}
var tabClasses = generateUtilityClasses('MuiTab', ['root', 'labelIcon', 'textColorInherit', 'textColorPrimary', 'textColorSecondary', 'selected', 'disabled', 'fullWidth', 'wrapped', 'iconWrapper']);
var tabClasses$1 = tabClasses;
var useUtilityClasses$f = function useUtilityClasses(ownerState) {
var classes = ownerState.classes,
textColor = ownerState.textColor,
fullWidth = ownerState.fullWidth,
wrapped = ownerState.wrapped,
icon = ownerState.icon,
label = ownerState.label,
selected = ownerState.selected,
disabled = ownerState.disabled;
var slots = {
root: ['root', icon && label && 'labelIcon', "textColor".concat(capitalize(textColor)), fullWidth && 'fullWidth', wrapped && 'wrapped', selected && 'selected', disabled && 'disabled'],
iconWrapper: ['iconWrapper']
};
return composeClasses(slots, getTabUtilityClass, classes);
};
var TabRoot = styled$1(ButtonBase$1, {
name: 'MuiTab',
slot: 'Root',
overridesResolver: function overridesResolver(props, styles) {
var ownerState = props.ownerState;
return [styles.root, ownerState.label && ownerState.icon && styles.labelIcon, styles["textColor".concat(capitalize(ownerState.textColor))], ownerState.fullWidth && styles.fullWidth, ownerState.wrapped && styles.wrapped, _defineProperty({}, "& .".concat(tabClasses$1.iconWrapper), styles.iconWrapper)];
}
})(function (_ref2) {
var theme = _ref2.theme,
ownerState = _ref2.ownerState;
return _extends({}, theme.typography.button, {
maxWidth: 360,
minWidth: 90,
position: 'relative',
minHeight: 48,
flexShrink: 0,
padding: '12px 16px',
overflow: 'hidden',
whiteSpace: 'normal',
textAlign: 'center'
}, ownerState.label && {
flexDirection: ownerState.iconPosition === 'top' || ownerState.iconPosition === 'bottom' ? 'column' : 'row'
}, {
lineHeight: 1.25
}, ownerState.icon && ownerState.label && _defineProperty({
minHeight: 72,
paddingTop: 9,
paddingBottom: 9
}, "& > .".concat(tabClasses$1.iconWrapper), _extends({}, ownerState.iconPosition === 'top' && {
marginBottom: 6
}, ownerState.iconPosition === 'bottom' && {
marginTop: 6
}, ownerState.iconPosition === 'start' && {
marginRight: theme.spacing(1)
}, ownerState.iconPosition === 'end' && {
marginLeft: theme.spacing(1)
})), ownerState.textColor === 'inherit' && _defineProperty(_defineProperty({
color: 'inherit',
opacity: 0.6
}, "&.".concat(tabClasses$1.selected), {
opacity: 1
}), "&.".concat(tabClasses$1.disabled), {
opacity: (theme.vars || theme).palette.action.disabledOpacity
}), ownerState.textColor === 'primary' && _defineProperty(_defineProperty({
color: (theme.vars || theme).palette.text.secondary
}, "&.".concat(tabClasses$1.selected), {
color: (theme.vars || theme).palette.primary.main
}), "&.".concat(tabClasses$1.disabled), {
color: (theme.vars || theme).palette.text.disabled
}), ownerState.textColor === 'secondary' && _defineProperty(_defineProperty({
color: (theme.vars || theme).palette.text.secondary
}, "&.".concat(tabClasses$1.selected), {
color: (theme.vars || theme).palette.secondary.main
}), "&.".concat(tabClasses$1.disabled), {
color: (theme.vars || theme).palette.text.disabled
}), ownerState.fullWidth && {
flexShrink: 1,
flexGrow: 1,
flexBasis: 0,
maxWidth: 'none'
}, ownerState.wrapped && {
fontSize: theme.typography.pxToRem(12)
});
});
var Tab = /*#__PURE__*/React__namespace.forwardRef(function Tab(inProps, ref) {
var props = useDefaultProps({
props: inProps,
name: 'MuiTab'
});
var className = props.className,
_props$disabled = props.disabled,
disabled = _props$disabled === void 0 ? false : _props$disabled,
_props$disableFocusRi = props.disableFocusRipple,
disableFocusRipple = _props$disableFocusRi === void 0 ? false : _props$disableFocusRi,
fullWidth = props.fullWidth,
iconProp = props.icon,
_props$iconPosition = props.iconPosition,
iconPosition = _props$iconPosition === void 0 ? 'top' : _props$iconPosition,
indicator = props.indicator,
label = props.label,
onChange = props.onChange,
onClick = props.onClick,
onFocus = props.onFocus,
selected = props.selected,
selectionFollowsFocus = props.selectionFollowsFocus,
_props$textColor = props.textColor,
textColor = _props$textColor === void 0 ? 'inherit' : _props$textColor,
value = props.value,
_props$wrapped = props.wrapped,
wrapped = _props$wrapped === void 0 ? false : _props$wrapped,
other = _objectWithoutProperties(props, ["className", "disabled", "disableFocusRipple", "fullWidth", "icon", "iconPosition", "indicator", "label", "onChange", "onClick", "onFocus", "selected", "selectionFollowsFocus", "textColor", "value", "wrapped"]);
var ownerState = _extends({}, props, {
disabled: disabled,
disableFocusRipple: disableFocusRipple,
selected: selected,
icon: !!iconProp,
iconPosition: iconPosition,
label: !!label,
fullWidth: fullWidth,
textColor: textColor,
wrapped: wrapped
});
var classes = useUtilityClasses$f(ownerState);
var icon = iconProp && label && /*#__PURE__*/React__namespace.isValidElement(iconProp) ? /*#__PURE__*/React__namespace.cloneElement(iconProp, {
className: clsx(classes.iconWrapper, iconProp.props.className)
}) : iconProp;
var handleClick = function handleClick(event) {
if (!selected && onChange) {
onChange(event, value);
}
if (onClick) {
onClick(event);
}
};
var handleFocus = function handleFocus(event) {
if (selectionFollowsFocus && !selected && onChange) {
onChange(event, value);
}
if (onFocus) {
onFocus(event);
}
};
return /*#__PURE__*/jsxRuntimeExports.jsxs(TabRoot, _extends({
focusRipple: !disableFocusRipple,
className: clsx(classes.root, className),
ref: ref,
role: "tab",
"aria-selected": selected,
disabled: disabled,
onClick: handleClick,
onFocus: handleFocus,
ownerState: ownerState,
tabIndex: selected ? 0 : -1
}, other, {
children: [iconPosition === 'top' || iconPosition === 'start' ? /*#__PURE__*/jsxRuntimeExports.jsxs(React__namespace.Fragment, {
children: [icon, label]
}) : /*#__PURE__*/jsxRuntimeExports.jsxs(React__namespace.Fragment, {
children: [label, icon]
}), indicator]
}));
});
Tab.propTypes /* remove-proptypes */ = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* This prop isn't supported.
* Use the `component` prop if you need to change the children structure.
*/
children: unsupportedProp,
/**
* Override or extend the styles applied to the component.
*/
classes: PropTypes.object,
/**
* @ignore
*/
className: PropTypes.string,
/**
* If `true`, the component is disabled.
* @default false
*/
disabled: PropTypes.bool,
/**
* If `true`, the keyboard focus ripple is disabled.
* @default false
*/
disableFocusRipple: PropTypes.bool,
/**
* If `true`, the ripple effect is disabled.
*
* ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure
* to highlight the element by applying separate styles with the `.Mui-focusVisible` class.
* @default false
*/
disableRipple: PropTypes.bool,
/**
* The icon to display.
*/
icon: PropTypes.oneOfType([PropTypes.element, PropTypes.string]),
/**
* The position of the icon relative to the label.
* @default 'top'
*/
iconPosition: PropTypes.oneOf(['bottom', 'end', 'start', 'top']),
/**
* The label element.
*/
label: PropTypes.node,
/**
* @ignore
*/
onChange: PropTypes.func,
/**
* @ignore
*/
onClick: PropTypes.func,
/**
* @ignore
*/
onFocus: PropTypes.func,
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
/**
* You can provide your own value. Otherwise, we fallback to the child position index.
*/
value: PropTypes.any,
/**
* Tab labels appear in a single row.
* They can use a second line if needed.
* @default false
*/
wrapped: PropTypes.bool
} ;
var Tab$1 = Tab;
/**
* @ignore - internal component.
*/
var TableContext = /*#__PURE__*/React__namespace.createContext();
{
TableContext.displayName = 'TableContext';
}
var TableContext$1 = TableContext;
function getTableUtilityClass(slot) {
return generateUtilityClass('MuiTable', slot);
}
var tableClasses = generateUtilityClasses('MuiTable', ['root', 'stickyHeader']);
var tableClasses$1 = tableClasses;
var useUtilityClasses$e = function useUtilityClasses(ownerState) {
var classes = ownerState.classes,
stickyHeader = ownerState.stickyHeader;
var slots = {
root: ['root', stickyHeader && 'stickyHeader']
};
return composeClasses(slots, getTableUtilityClass, classes);
};
var TableRoot = styled$1('table', {
name: 'MuiTable',
slot: 'Root',
overridesResolver: function overridesResolver(props, styles) {
var ownerState = props.ownerState;
return [styles.root, ownerState.stickyHeader && styles.stickyHeader];
}
})(function (_ref) {
var theme = _ref.theme,
ownerState = _ref.ownerState;
return _extends({
display: 'table',
width: '100%',
borderCollapse: 'collapse',
borderSpacing: 0,
'& caption': _extends({}, theme.typography.body2, {
padding: theme.spacing(2),
color: (theme.vars || theme).palette.text.secondary,
textAlign: 'left',
captionSide: 'bottom'
})
}, ownerState.stickyHeader && {
borderCollapse: 'separate'
});
});
var defaultComponent$4 = 'table';
var Table = /*#__PURE__*/React__namespace.forwardRef(function Table(inProps, ref) {
var props = useDefaultProps({
props: inProps,
name: 'MuiTable'
});
var className = props.className,
_props$component = props.component,
component = _props$component === void 0 ? defaultComponent$4 : _props$component,
_props$padding = props.padding,
padding = _props$padding === void 0 ? 'normal' : _props$padding,
_props$size = props.size,
size = _props$size === void 0 ? 'medium' : _props$size,
_props$stickyHeader = props.stickyHeader,
stickyHeader = _props$stickyHeader === void 0 ? false : _props$stickyHeader,
other = _objectWithoutProperties(props, ["className", "component", "padding", "size", "stickyHeader"]);
var ownerState = _extends({}, props, {
component: component,
padding: padding,
size: size,
stickyHeader: stickyHeader
});
var classes = useUtilityClasses$e(ownerState);
var table = React__namespace.useMemo(function () {
return {
padding: padding,
size: size,
stickyHeader: stickyHeader
};
}, [padding, size, stickyHeader]);
return /*#__PURE__*/jsxRuntimeExports.jsx(TableContext$1.Provider, {
value: table,
children: /*#__PURE__*/jsxRuntimeExports.jsx(TableRoot, _extends({
as: component,
role: component === defaultComponent$4 ? null : 'table',
ref: ref,
className: clsx(classes.root, className),
ownerState: ownerState
}, other))
});
});
Table.propTypes /* remove-proptypes */ = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* The content of the table, normally `TableHead` and `TableBody`.
*/
children: PropTypes.node,
/**
* Override or extend the styles applied to the component.
*/
classes: PropTypes.object,
/**
* @ignore
*/
className: PropTypes.string,
/**
* The component used for the root node.
* Either a string to use a HTML element or a component.
*/
component: PropTypes.elementType,
/**
* Allows TableCells to inherit padding of the Table.
* @default 'normal'
*/
padding: PropTypes.oneOf(['checkbox', 'none', 'normal']),
/**
* Allows TableCells to inherit size of the Table.
* @default 'medium'
*/
size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['medium', 'small']), PropTypes.string]),
/**
* Set the header sticky.
*
* ⚠️ It doesn't work with IE11.
* @default false
*/
stickyHeader: PropTypes.bool,
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
} ;
var Table$1 = Table;
/**
* @ignore - internal component.
*/
var Tablelvl2Context = /*#__PURE__*/React__namespace.createContext();
{
Tablelvl2Context.displayName = 'Tablelvl2Context';
}
var Tablelvl2Context$1 = Tablelvl2Context;
function getTableBodyUtilityClass(slot) {
return generateUtilityClass('MuiTableBody', slot);
}
var tableBodyClasses = generateUtilityClasses('MuiTableBody', ['root']);
var tableBodyClasses$1 = tableBodyClasses;
var useUtilityClasses$d = function useUtilityClasses(ownerState) {
var classes = ownerState.classes;
var slots = {
root: ['root']
};
return composeClasses(slots, getTableBodyUtilityClass, classes);
};
var TableBodyRoot = styled$1('tbody', {
name: 'MuiTableBody',
slot: 'Root',
overridesResolver: function overridesResolver(props, styles) {
return styles.root;
}
})({
display: 'table-row-group'
});
var tablelvl2$2 = {
variant: 'body'
};
var defaultComponent$3 = 'tbody';
var TableBody = /*#__PURE__*/React__namespace.forwardRef(function TableBody(inProps, ref) {
var props = useDefaultProps({
props: inProps,
name: 'MuiTableBody'
});
var className = props.className,
_props$component = props.component,
component = _props$component === void 0 ? defaultComponent$3 : _props$component,
other = _objectWithoutProperties(props, ["className", "component"]);
var ownerState = _extends({}, props, {
component: component
});
var classes = useUtilityClasses$d(ownerState);
return /*#__PURE__*/jsxRuntimeExports.jsx(Tablelvl2Context$1.Provider, {
value: tablelvl2$2,
children: /*#__PURE__*/jsxRuntimeExports.jsx(TableBodyRoot, _extends({
className: clsx(classes.root, className),
as: component,
ref: ref,
role: component === defaultComponent$3 ? null : 'rowgroup',
ownerState: ownerState
}, other))
});
});
TableBody.propTypes /* remove-proptypes */ = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* The content of the component, normally `TableRow`.
*/
children: PropTypes.node,
/**
* Override or extend the styles applied to the component.
*/
classes: PropTypes.object,
/**
* @ignore
*/
className: PropTypes.string,
/**
* The component used for the root node.
* Either a string to use a HTML element or a component.
*/
component: PropTypes.elementType,
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
} ;
var TableBody$1 = TableBody;
function getTableCellUtilityClass(slot) {
return generateUtilityClass('MuiTableCell', slot);
}
var tableCellClasses = generateUtilityClasses('MuiTableCell', ['root', 'head', 'body', 'footer', 'sizeSmall', 'sizeMedium', 'paddingCheckbox', 'paddingNone', 'alignLeft', 'alignCenter', 'alignRight', 'alignJustify', 'stickyHeader']);
var tableCellClasses$1 = tableCellClasses;
var useUtilityClasses$c = function useUtilityClasses(ownerState) {
var classes = ownerState.classes,
variant = ownerState.variant,
align = ownerState.align,
padding = ownerState.padding,
size = ownerState.size,
stickyHeader = ownerState.stickyHeader;
var slots = {
root: ['root', variant, stickyHeader && 'stickyHeader', align !== 'inherit' && "align".concat(capitalize(align)), padding !== 'normal' && "padding".concat(capitalize(padding)), "size".concat(capitalize(size))]
};
return composeClasses(slots, getTableCellUtilityClass, classes);
};
var TableCellRoot = styled$1('td', {
name: 'MuiTableCell',
slot: 'Root',
overridesResolver: function overridesResolver(props, styles) {
var ownerState = props.ownerState;
return [styles.root, styles[ownerState.variant], styles["size".concat(capitalize(ownerState.size))], ownerState.padding !== 'normal' && styles["padding".concat(capitalize(ownerState.padding))], ownerState.align !== 'inherit' && styles["align".concat(capitalize(ownerState.align))], ownerState.stickyHeader && styles.stickyHeader];
}
})(function (_ref) {
var theme = _ref.theme,
ownerState = _ref.ownerState;
return _extends({}, theme.typography.body2, {
display: 'table-cell',
verticalAlign: 'inherit',
// Workaround for a rendering bug with spanned columns in Chrome 62.0.
// Removes the alpha (sets it to 1), and lightens or darkens the theme color.
borderBottom: theme.vars ? "1px solid ".concat(theme.vars.palette.TableCell.border) : "1px solid\n ".concat(theme.palette.mode === 'light' ? lighten(alpha(theme.palette.divider, 1), 0.88) : darken(alpha(theme.palette.divider, 1), 0.68)),
textAlign: 'left',
padding: 16
}, ownerState.variant === 'head' && {
color: (theme.vars || theme).palette.text.primary,
lineHeight: theme.typography.pxToRem(24),
fontWeight: theme.typography.fontWeightMedium
}, ownerState.variant === 'body' && {
color: (theme.vars || theme).palette.text.primary
}, ownerState.variant === 'footer' && {
color: (theme.vars || theme).palette.text.secondary,
lineHeight: theme.typography.pxToRem(21),
fontSize: theme.typography.pxToRem(12)
}, ownerState.size === 'small' && _defineProperty({
padding: '6px 16px'
}, "&.".concat(tableCellClasses$1.paddingCheckbox), {
width: 24,
// prevent the checkbox column from growing
padding: '0 12px 0 16px',
'& > *': {
padding: 0
}
}), ownerState.padding === 'checkbox' && {
width: 48,
// prevent the checkbox column from growing
padding: '0 0 0 4px'
}, ownerState.padding === 'none' && {
padding: 0
}, ownerState.align === 'left' && {
textAlign: 'left'
}, ownerState.align === 'center' && {
textAlign: 'center'
}, ownerState.align === 'right' && {
textAlign: 'right',
flexDirection: 'row-reverse'
}, ownerState.align === 'justify' && {
textAlign: 'justify'
}, ownerState.stickyHeader && {
position: 'sticky',
top: 0,
zIndex: 2,
backgroundColor: (theme.vars || theme).palette.background["default"]
});
});
/**
* The component renders a `| ` element when the parent context is a header
* or otherwise a ` | ` element.
*/
var TableCell = /*#__PURE__*/React__namespace.forwardRef(function TableCell(inProps, ref) {
var props = useDefaultProps({
props: inProps,
name: 'MuiTableCell'
});
var _props$align = props.align,
align = _props$align === void 0 ? 'inherit' : _props$align,
className = props.className,
componentProp = props.component,
paddingProp = props.padding,
scopeProp = props.scope,
sizeProp = props.size,
sortDirection = props.sortDirection,
variantProp = props.variant,
other = _objectWithoutProperties(props, ["align", "className", "component", "padding", "scope", "size", "sortDirection", "variant"]);
var table = React__namespace.useContext(TableContext$1);
var tablelvl2 = React__namespace.useContext(Tablelvl2Context$1);
var isHeadCell = tablelvl2 && tablelvl2.variant === 'head';
var component;
if (componentProp) {
component = componentProp;
} else {
component = isHeadCell ? 'th' : 'td';
}
var scope = scopeProp;
// scope is not a valid attribute for | | elements.
// source: https://html.spec.whatwg.org/multipage/tables.html#the-td-element
if (component === 'td') {
scope = undefined;
} else if (!scope && isHeadCell) {
scope = 'col';
}
var variant = variantProp || tablelvl2 && tablelvl2.variant;
var ownerState = _extends({}, props, {
align: align,
component: component,
padding: paddingProp || (table && table.padding ? table.padding : 'normal'),
size: sizeProp || (table && table.size ? table.size : 'medium'),
sortDirection: sortDirection,
stickyHeader: variant === 'head' && table && table.stickyHeader,
variant: variant
});
var classes = useUtilityClasses$c(ownerState);
var ariaSort = null;
if (sortDirection) {
ariaSort = sortDirection === 'asc' ? 'ascending' : 'descending';
}
return /*#__PURE__*/jsxRuntimeExports.jsx(TableCellRoot, _extends({
as: component,
ref: ref,
className: clsx(classes.root, className),
"aria-sort": ariaSort,
scope: scope,
ownerState: ownerState
}, other));
});
TableCell.propTypes /* remove-proptypes */ = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* Set the text-align on the table cell content.
*
* Monetary or generally number fields **should be right aligned** as that allows
* you to add them up quickly in your head without having to worry about decimals.
* @default 'inherit'
*/
align: PropTypes.oneOf(['center', 'inherit', 'justify', 'left', 'right']),
/**
* The content of the component.
*/
children: PropTypes.node,
/**
* Override or extend the styles applied to the component.
*/
classes: PropTypes.object,
/**
* @ignore
*/
className: PropTypes.string,
/**
* The component used for the root node.
* Either a string to use a HTML element or a component.
*/
component: PropTypes.elementType,
/**
* Sets the padding applied to the cell.
* The prop defaults to the value (`'default'`) inherited from the parent Table component.
*/
padding: PropTypes.oneOf(['checkbox', 'none', 'normal']),
/**
* Set scope attribute.
*/
scope: PropTypes.string,
/**
* Specify the size of the cell.
* The prop defaults to the value (`'medium'`) inherited from the parent Table component.
*/
size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['medium', 'small']), PropTypes.string]),
/**
* Set aria-sort direction.
*/
sortDirection: PropTypes.oneOf(['asc', 'desc', false]),
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
/**
* Specify the cell type.
* The prop defaults to the value inherited from the parent TableHead, TableBody, or TableFooter components.
*/
variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['body', 'footer', 'head']), PropTypes.string])
} ;
var TableCell$1 = TableCell;
function getTableContainerUtilityClass(slot) {
return generateUtilityClass('MuiTableContainer', slot);
}
var tableContainerClasses = generateUtilityClasses('MuiTableContainer', ['root']);
var tableContainerClasses$1 = tableContainerClasses;
var useUtilityClasses$b = function useUtilityClasses(ownerState) {
var classes = ownerState.classes;
var slots = {
root: ['root']
};
return composeClasses(slots, getTableContainerUtilityClass, classes);
};
var TableContainerRoot = styled$1('div', {
name: 'MuiTableContainer',
slot: 'Root',
overridesResolver: function overridesResolver(props, styles) {
return styles.root;
}
})({
width: '100%',
overflowX: 'auto'
});
var TableContainer = /*#__PURE__*/React__namespace.forwardRef(function TableContainer(inProps, ref) {
var props = useDefaultProps({
props: inProps,
name: 'MuiTableContainer'
});
var className = props.className,
_props$component = props.component,
component = _props$component === void 0 ? 'div' : _props$component,
other = _objectWithoutProperties(props, ["className", "component"]);
var ownerState = _extends({}, props, {
component: component
});
var classes = useUtilityClasses$b(ownerState);
return /*#__PURE__*/jsxRuntimeExports.jsx(TableContainerRoot, _extends({
ref: ref,
as: component,
className: clsx(classes.root, className),
ownerState: ownerState
}, other));
});
TableContainer.propTypes /* remove-proptypes */ = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* The content of the component, normally `Table`.
*/
children: PropTypes.node,
/**
* Override or extend the styles applied to the component.
*/
classes: PropTypes.object,
/**
* @ignore
*/
className: PropTypes.string,
/**
* The component used for the root node.
* Either a string to use a HTML element or a component.
*/
component: PropTypes.elementType,
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
} ;
var TableContainer$1 = TableContainer;
function getTableFooterUtilityClass(slot) {
return generateUtilityClass('MuiTableFooter', slot);
}
var tableFooterClasses = generateUtilityClasses('MuiTableFooter', ['root']);
var tableFooterClasses$1 = tableFooterClasses;
var useUtilityClasses$a = function useUtilityClasses(ownerState) {
var classes = ownerState.classes;
var slots = {
root: ['root']
};
return composeClasses(slots, getTableFooterUtilityClass, classes);
};
var TableFooterRoot = styled$1('tfoot', {
name: 'MuiTableFooter',
slot: 'Root',
overridesResolver: function overridesResolver(props, styles) {
return styles.root;
}
})({
display: 'table-footer-group'
});
var tablelvl2$1 = {
variant: 'footer'
};
var defaultComponent$2 = 'tfoot';
var TableFooter = /*#__PURE__*/React__namespace.forwardRef(function TableFooter(inProps, ref) {
var props = useDefaultProps({
props: inProps,
name: 'MuiTableFooter'
});
var className = props.className,
_props$component = props.component,
component = _props$component === void 0 ? defaultComponent$2 : _props$component,
other = _objectWithoutProperties(props, ["className", "component"]);
var ownerState = _extends({}, props, {
component: component
});
var classes = useUtilityClasses$a(ownerState);
return /*#__PURE__*/jsxRuntimeExports.jsx(Tablelvl2Context$1.Provider, {
value: tablelvl2$1,
children: /*#__PURE__*/jsxRuntimeExports.jsx(TableFooterRoot, _extends({
as: component,
className: clsx(classes.root, className),
ref: ref,
role: component === defaultComponent$2 ? null : 'rowgroup',
ownerState: ownerState
}, other))
});
});
TableFooter.propTypes /* remove-proptypes */ = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* The content of the component, normally `TableRow`.
*/
children: PropTypes.node,
/**
* Override or extend the styles applied to the component.
*/
classes: PropTypes.object,
/**
* @ignore
*/
className: PropTypes.string,
/**
* The component used for the root node.
* Either a string to use a HTML element or a component.
*/
component: PropTypes.elementType,
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
} ;
var TableFooter$1 = TableFooter;
function getTableHeadUtilityClass(slot) {
return generateUtilityClass('MuiTableHead', slot);
}
var tableHeadClasses = generateUtilityClasses('MuiTableHead', ['root']);
var tableHeadClasses$1 = tableHeadClasses;
var useUtilityClasses$9 = function useUtilityClasses(ownerState) {
var classes = ownerState.classes;
var slots = {
root: ['root']
};
return composeClasses(slots, getTableHeadUtilityClass, classes);
};
var TableHeadRoot = styled$1('thead', {
name: 'MuiTableHead',
slot: 'Root',
overridesResolver: function overridesResolver(props, styles) {
return styles.root;
}
})({
display: 'table-header-group'
});
var tablelvl2 = {
variant: 'head'
};
var defaultComponent$1 = 'thead';
var TableHead = /*#__PURE__*/React__namespace.forwardRef(function TableHead(inProps, ref) {
var props = useDefaultProps({
props: inProps,
name: 'MuiTableHead'
});
var className = props.className,
_props$component = props.component,
component = _props$component === void 0 ? defaultComponent$1 : _props$component,
other = _objectWithoutProperties(props, ["className", "component"]);
var ownerState = _extends({}, props, {
component: component
});
var classes = useUtilityClasses$9(ownerState);
return /*#__PURE__*/jsxRuntimeExports.jsx(Tablelvl2Context$1.Provider, {
value: tablelvl2,
children: /*#__PURE__*/jsxRuntimeExports.jsx(TableHeadRoot, _extends({
as: component,
className: clsx(classes.root, className),
ref: ref,
role: component === defaultComponent$1 ? null : 'rowgroup',
ownerState: ownerState
}, other))
});
});
TableHead.propTypes /* remove-proptypes */ = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* The content of the component, normally `TableRow`.
*/
children: PropTypes.node,
/**
* Override or extend the styles applied to the component.
*/
classes: PropTypes.object,
/**
* @ignore
*/
className: PropTypes.string,
/**
* The component used for the root node.
* Either a string to use a HTML element or a component.
*/
component: PropTypes.elementType,
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
} ;
var TableHead$1 = TableHead;
function getToolbarUtilityClass(slot) {
return generateUtilityClass('MuiToolbar', slot);
}
var toolbarClasses = generateUtilityClasses('MuiToolbar', ['root', 'gutters', 'regular', 'dense']);
var toolbarClasses$1 = toolbarClasses;
var useUtilityClasses$8 = function useUtilityClasses(ownerState) {
var classes = ownerState.classes,
disableGutters = ownerState.disableGutters,
variant = ownerState.variant;
var slots = {
root: ['root', !disableGutters && 'gutters', variant]
};
return composeClasses(slots, getToolbarUtilityClass, classes);
};
var ToolbarRoot = styled$1('div', {
name: 'MuiToolbar',
slot: 'Root',
overridesResolver: function overridesResolver(props, styles) {
var ownerState = props.ownerState;
return [styles.root, !ownerState.disableGutters && styles.gutters, styles[ownerState.variant]];
}
})(function (_ref) {
var theme = _ref.theme,
ownerState = _ref.ownerState;
return _extends({
position: 'relative',
display: 'flex',
alignItems: 'center'
}, !ownerState.disableGutters && _defineProperty({
paddingLeft: theme.spacing(2),
paddingRight: theme.spacing(2)
}, theme.breakpoints.up('sm'), {
paddingLeft: theme.spacing(3),
paddingRight: theme.spacing(3)
}), ownerState.variant === 'dense' && {
minHeight: 48
});
}, function (_ref3) {
var theme = _ref3.theme,
ownerState = _ref3.ownerState;
return ownerState.variant === 'regular' && theme.mixins.toolbar;
});
var Toolbar = /*#__PURE__*/React__namespace.forwardRef(function Toolbar(inProps, ref) {
var props = useDefaultProps({
props: inProps,
name: 'MuiToolbar'
});
var className = props.className,
_props$component = props.component,
component = _props$component === void 0 ? 'div' : _props$component,
_props$disableGutters = props.disableGutters,
disableGutters = _props$disableGutters === void 0 ? false : _props$disableGutters,
_props$variant = props.variant,
variant = _props$variant === void 0 ? 'regular' : _props$variant,
other = _objectWithoutProperties(props, ["className", "component", "disableGutters", "variant"]);
var ownerState = _extends({}, props, {
component: component,
disableGutters: disableGutters,
variant: variant
});
var classes = useUtilityClasses$8(ownerState);
return /*#__PURE__*/jsxRuntimeExports.jsx(ToolbarRoot, _extends({
as: component,
className: clsx(classes.root, className),
ref: ref,
ownerState: ownerState
}, other));
});
Toolbar.propTypes /* remove-proptypes */ = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* The Toolbar children, usually a mixture of `IconButton`, `Button` and `Typography`.
* The Toolbar is a flex container, allowing flex item properties to be used to lay out the children.
*/
children: PropTypes.node,
/**
* Override or extend the styles applied to the component.
*/
classes: PropTypes.object,
/**
* @ignore
*/
className: PropTypes.string,
/**
* The component used for the root node.
* Either a string to use a HTML element or a component.
*/
component: PropTypes.elementType,
/**
* If `true`, disables gutter padding.
* @default false
*/
disableGutters: PropTypes.bool,
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
/**
* The variant to use.
* @default 'regular'
*/
variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['dense', 'regular']), PropTypes.string])
} ;
var Toolbar$1 = Toolbar;
var KeyboardArrowLeft = createSvgIcon( /*#__PURE__*/jsxRuntimeExports.jsx("path", {
d: "M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z"
}), 'KeyboardArrowLeft');
var KeyboardArrowRight = createSvgIcon( /*#__PURE__*/jsxRuntimeExports.jsx("path", {
d: "M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z"
}), 'KeyboardArrowRight');
var TablePaginationActions = /*#__PURE__*/React__namespace.forwardRef(function TablePaginationActions(props, ref) {
var _slots$firstButton, _slots$lastButton, _slots$nextButton, _slots$previousButton, _slots$firstButtonIco, _slots$lastButtonIcon, _slots$nextButtonIcon, _slots$previousButton2;
var backIconButtonProps = props.backIconButtonProps,
count = props.count,
_props$disabled = props.disabled,
disabled = _props$disabled === void 0 ? false : _props$disabled,
getItemAriaLabel = props.getItemAriaLabel,
nextIconButtonProps = props.nextIconButtonProps,
onPageChange = props.onPageChange,
page = props.page,
rowsPerPage = props.rowsPerPage,
showFirstButton = props.showFirstButton,
showLastButton = props.showLastButton,
_props$slots = props.slots,
slots = _props$slots === void 0 ? {} : _props$slots,
_props$slotProps = props.slotProps,
slotProps = _props$slotProps === void 0 ? {} : _props$slotProps,
other = _objectWithoutProperties(props, ["backIconButtonProps", "count", "disabled", "getItemAriaLabel", "nextIconButtonProps", "onPageChange", "page", "rowsPerPage", "showFirstButton", "showLastButton", "slots", "slotProps"]);
var isRtl = useRtl();
var handleFirstPageButtonClick = function handleFirstPageButtonClick(event) {
onPageChange(event, 0);
};
var handleBackButtonClick = function handleBackButtonClick(event) {
onPageChange(event, page - 1);
};
var handleNextButtonClick = function handleNextButtonClick(event) {
onPageChange(event, page + 1);
};
var handleLastPageButtonClick = function handleLastPageButtonClick(event) {
onPageChange(event, Math.max(0, Math.ceil(count / rowsPerPage) - 1));
};
var FirstButton = (_slots$firstButton = slots.firstButton) != null ? _slots$firstButton : IconButton$1;
var LastButton = (_slots$lastButton = slots.lastButton) != null ? _slots$lastButton : IconButton$1;
var NextButton = (_slots$nextButton = slots.nextButton) != null ? _slots$nextButton : IconButton$1;
var PreviousButton = (_slots$previousButton = slots.previousButton) != null ? _slots$previousButton : IconButton$1;
var FirstButtonIcon = (_slots$firstButtonIco = slots.firstButtonIcon) != null ? _slots$firstButtonIco : FirstPageIconDefault;
var LastButtonIcon = (_slots$lastButtonIcon = slots.lastButtonIcon) != null ? _slots$lastButtonIcon : LastPageIconDefault;
var NextButtonIcon = (_slots$nextButtonIcon = slots.nextButtonIcon) != null ? _slots$nextButtonIcon : KeyboardArrowRight;
var PreviousButtonIcon = (_slots$previousButton2 = slots.previousButtonIcon) != null ? _slots$previousButton2 : KeyboardArrowLeft;
var FirstButtonSlot = isRtl ? LastButton : FirstButton;
var PreviousButtonSlot = isRtl ? NextButton : PreviousButton;
var NextButtonSlot = isRtl ? PreviousButton : NextButton;
var LastButtonSlot = isRtl ? FirstButton : LastButton;
var firstButtonSlotProps = isRtl ? slotProps.lastButton : slotProps.firstButton;
var previousButtonSlotProps = isRtl ? slotProps.nextButton : slotProps.previousButton;
var nextButtonSlotProps = isRtl ? slotProps.previousButton : slotProps.nextButton;
var lastButtonSlotProps = isRtl ? slotProps.firstButton : slotProps.lastButton;
return /*#__PURE__*/jsxRuntimeExports.jsxs("div", _extends({
ref: ref
}, other, {
children: [showFirstButton && /*#__PURE__*/jsxRuntimeExports.jsx(FirstButtonSlot, _extends({
onClick: handleFirstPageButtonClick,
disabled: disabled || page === 0,
"aria-label": getItemAriaLabel('first', page),
title: getItemAriaLabel('first', page)
}, firstButtonSlotProps, {
children: isRtl ? /*#__PURE__*/jsxRuntimeExports.jsx(LastButtonIcon, _extends({}, slotProps.lastButtonIcon)) : /*#__PURE__*/jsxRuntimeExports.jsx(FirstButtonIcon, _extends({}, slotProps.firstButtonIcon))
})), /*#__PURE__*/jsxRuntimeExports.jsx(PreviousButtonSlot, _extends({
onClick: handleBackButtonClick,
disabled: disabled || page === 0,
color: "inherit",
"aria-label": getItemAriaLabel('previous', page),
title: getItemAriaLabel('previous', page)
}, previousButtonSlotProps != null ? previousButtonSlotProps : backIconButtonProps, {
children: isRtl ? /*#__PURE__*/jsxRuntimeExports.jsx(NextButtonIcon, _extends({}, slotProps.nextButtonIcon)) : /*#__PURE__*/jsxRuntimeExports.jsx(PreviousButtonIcon, _extends({}, slotProps.previousButtonIcon))
})), /*#__PURE__*/jsxRuntimeExports.jsx(NextButtonSlot, _extends({
onClick: handleNextButtonClick,
disabled: disabled || (count !== -1 ? page >= Math.ceil(count / rowsPerPage) - 1 : false),
color: "inherit",
"aria-label": getItemAriaLabel('next', page),
title: getItemAriaLabel('next', page)
}, nextButtonSlotProps != null ? nextButtonSlotProps : nextIconButtonProps, {
children: isRtl ? /*#__PURE__*/jsxRuntimeExports.jsx(PreviousButtonIcon, _extends({}, slotProps.previousButtonIcon)) : /*#__PURE__*/jsxRuntimeExports.jsx(NextButtonIcon, _extends({}, slotProps.nextButtonIcon))
})), showLastButton && /*#__PURE__*/jsxRuntimeExports.jsx(LastButtonSlot, _extends({
onClick: handleLastPageButtonClick,
disabled: disabled || page >= Math.ceil(count / rowsPerPage) - 1,
"aria-label": getItemAriaLabel('last', page),
title: getItemAriaLabel('last', page)
}, lastButtonSlotProps, {
children: isRtl ? /*#__PURE__*/jsxRuntimeExports.jsx(FirstButtonIcon, _extends({}, slotProps.firstButtonIcon)) : /*#__PURE__*/jsxRuntimeExports.jsx(LastButtonIcon, _extends({}, slotProps.lastButtonIcon))
}))]
}));
});
TablePaginationActions.propTypes = {
/**
* Props applied to the back arrow [`IconButton`](/material-ui/api/icon-button/) element.
*/
backIconButtonProps: PropTypes.object,
/**
* The total number of rows.
*/
count: PropTypes.number.isRequired,
/**
* If `true`, the component is disabled.
* @default false
*/
disabled: PropTypes.bool,
/**
* Accepts a function which returns a string value that provides a user-friendly name for the current page.
*
* For localization purposes, you can use the provided [translations](/material-ui/guides/localization/).
*
* @param {string} type The link or button type to format ('page' | 'first' | 'last' | 'next' | 'previous'). Defaults to 'page'.
* @param {number} page The page number to format.
* @returns {string}
*/
getItemAriaLabel: PropTypes.func.isRequired,
/**
* Props applied to the next arrow [`IconButton`](/material-ui/api/icon-button/) element.
*/
nextIconButtonProps: PropTypes.object,
/**
* Callback fired when the page is changed.
*
* @param {object} event The event source of the callback.
* @param {number} page The page selected.
*/
onPageChange: PropTypes.func.isRequired,
/**
* The zero-based index of the current page.
*/
page: PropTypes.number.isRequired,
/**
* The number of rows per page.
*/
rowsPerPage: PropTypes.number.isRequired,
/**
* If `true`, show the first-page button.
*/
showFirstButton: PropTypes.bool.isRequired,
/**
* If `true`, show the last-page button.
*/
showLastButton: PropTypes.bool.isRequired,
/**
* The props used for each slot inside the TablePaginationActions.
* @default {}
*/
slotProps: PropTypes.shape({
firstButton: PropTypes.object,
firstButtonIcon: PropTypes.object,
lastButton: PropTypes.object,
lastButtonIcon: PropTypes.object,
nextButton: PropTypes.object,
nextButtonIcon: PropTypes.object,
previousButton: PropTypes.object,
previousButtonIcon: PropTypes.object
}),
/**
* The components used for each slot inside the TablePaginationActions.
* Either a string to use a HTML element or a component.
* @default {}
*/
slots: PropTypes.shape({
firstButton: PropTypes.elementType,
firstButtonIcon: PropTypes.elementType,
lastButton: PropTypes.elementType,
lastButtonIcon: PropTypes.elementType,
nextButton: PropTypes.elementType,
nextButtonIcon: PropTypes.elementType,
previousButton: PropTypes.elementType,
previousButtonIcon: PropTypes.elementType
})
} ;
var TablePaginationActions$1 = TablePaginationActions;
function getTablePaginationUtilityClass(slot) {
return generateUtilityClass('MuiTablePagination', slot);
}
var tablePaginationClasses = generateUtilityClasses('MuiTablePagination', ['root', 'toolbar', 'spacer', 'selectLabel', 'selectRoot', 'select', 'selectIcon', 'input', 'menuItem', 'displayedRows', 'actions']);
var tablePaginationClasses$1 = tablePaginationClasses;
var _InputBase;
var TablePaginationRoot = styled$1(TableCell$1, {
name: 'MuiTablePagination',
slot: 'Root',
overridesResolver: function overridesResolver(props, styles) {
return styles.root;
}
})(function (_ref) {
var theme = _ref.theme;
return {
overflow: 'auto',
color: (theme.vars || theme).palette.text.primary,
fontSize: theme.typography.pxToRem(14),
// Increase the specificity to override TableCell.
'&:last-child': {
padding: 0
}
};
});
var TablePaginationToolbar = styled$1(Toolbar$1, {
name: 'MuiTablePagination',
slot: 'Toolbar',
overridesResolver: function overridesResolver(props, styles) {
return _extends(_defineProperty({}, "& .".concat(tablePaginationClasses$1.actions), styles.actions), styles.toolbar);
}
})(function (_ref2) {
var theme = _ref2.theme;
return _defineProperty(_defineProperty(_defineProperty({
minHeight: 52,
paddingRight: 2
}, "".concat(theme.breakpoints.up('xs'), " and (orientation: landscape)"), {
minHeight: 52
}), theme.breakpoints.up('sm'), {
minHeight: 52,
paddingRight: 2
}), "& .".concat(tablePaginationClasses$1.actions), {
flexShrink: 0,
marginLeft: 20
});
});
var TablePaginationSpacer = styled$1('div', {
name: 'MuiTablePagination',
slot: 'Spacer',
overridesResolver: function overridesResolver(props, styles) {
return styles.spacer;
}
})({
flex: '1 1 100%'
});
var TablePaginationSelectLabel = styled$1('p', {
name: 'MuiTablePagination',
slot: 'SelectLabel',
overridesResolver: function overridesResolver(props, styles) {
return styles.selectLabel;
}
})(function (_ref4) {
var theme = _ref4.theme;
return _extends({}, theme.typography.body2, {
flexShrink: 0
});
});
var TablePaginationSelect = styled$1(Select$1, {
name: 'MuiTablePagination',
slot: 'Select',
overridesResolver: function overridesResolver(props, styles) {
return _extends(_defineProperty(_defineProperty({}, "& .".concat(tablePaginationClasses$1.selectIcon), styles.selectIcon), "& .".concat(tablePaginationClasses$1.select), styles.select), styles.input, styles.selectRoot);
}
})(_defineProperty({
color: 'inherit',
fontSize: 'inherit',
flexShrink: 0,
marginRight: 32,
marginLeft: 8
}, "& .".concat(tablePaginationClasses$1.select), {
paddingLeft: 8,
paddingRight: 24,
textAlign: 'right',
textAlignLast: 'right' // Align