@mui/x-data-grid-pro
Version:
The Pro plan edition of the MUI X Data Grid components.
146 lines (145 loc) • 6.36 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.GridHeaderFilterMenuContainer = GridHeaderFilterMenuContainer;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
var React = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _xDataGrid = require("@mui/x-data-grid");
var _refType = _interopRequireDefault(require("@mui/utils/refType"));
var _useId = _interopRequireDefault(require("@mui/utils/useId"));
var _internals = require("@mui/x-data-grid/internals");
var _useGridRootProps = require("../../hooks/utils/useGridRootProps");
var _jsxRuntime = require("react/jsx-runtime");
const _excluded = ["operators", "item", "field", "buttonRef", "headerFilterMenuRef", "disabled", "showClearItem", "clearFilterItem"];
function GridHeaderFilterMenuContainer(props) {
const {
operators,
item,
field,
buttonRef,
headerFilterMenuRef,
disabled = false,
showClearItem,
clearFilterItem
} = props,
others = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
const buttonId = (0, _useId.default)();
const menuId = (0, _useId.default)();
const rootProps = (0, _useGridRootProps.useGridRootProps)();
const apiRef = (0, _xDataGrid.useGridApiContext)();
const menuOpenField = (0, _xDataGrid.useGridSelector)(apiRef, _internals.gridHeaderFilteringMenuSelector);
const open = Boolean(menuOpenField === field && headerFilterMenuRef.current);
const handleClick = event => {
headerFilterMenuRef.current = event.currentTarget;
apiRef.current.showHeaderFilterMenu(field);
};
if (!rootProps.slots.headerFilterMenu) {
return null;
}
const label = apiRef.current.getLocaleText('filterPanelOperator');
const labelString = label ? String(label) : undefined;
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.baseIconButton, (0, _extends2.default)({
id: buttonId,
ref: buttonRef,
"aria-label": labelString,
title: labelString,
"aria-controls": menuId,
"aria-expanded": open ? 'true' : undefined,
"aria-haspopup": "true",
tabIndex: -1,
size: "small",
onClick: handleClick,
disabled: disabled
}, rootProps.slotProps?.baseIconButton, {
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.baseBadge, {
color: "primary",
variant: "dot",
badgeContent: showClearItem ? 1 : 0,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.openFilterButtonIcon, {
fontSize: "inherit"
})
})
})), /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.headerFilterMenu, (0, _extends2.default)({
field: field,
open: open,
item: item,
target: headerFilterMenuRef.current,
operators: operators,
labelledBy: buttonId,
id: menuId,
clearFilterItem: clearFilterItem,
showClearItem: showClearItem
}, others))]
});
}
process.env.NODE_ENV !== "production" ? GridHeaderFilterMenuContainer.propTypes = {
// ----------------------------- Warning --------------------------------
// | These PropTypes are generated from the TypeScript type definitions |
// | To update them edit the TypeScript types and run "pnpm proptypes" |
// ----------------------------------------------------------------------
applyFilterChanges: _propTypes.default.func.isRequired,
buttonRef: _refType.default,
clearFilterItem: _propTypes.default.func,
disabled: _propTypes.default.bool,
field: _propTypes.default.string.isRequired,
headerFilterMenuRef: _propTypes.default.shape({
current: _propTypes.default.object
}).isRequired,
item: _propTypes.default.shape({
field: _propTypes.default.string.isRequired,
id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
operator: _propTypes.default.string.isRequired,
value: _propTypes.default.any
}).isRequired,
operators: _propTypes.default.arrayOf(_propTypes.default.shape({
getApplyFilterFn: _propTypes.default.func.isRequired,
getValueAsString: _propTypes.default.func,
headerLabel: _propTypes.default.string,
InputComponent: _propTypes.default.elementType,
InputComponentProps: _propTypes.default.shape({
apiRef: _propTypes.default.shape({
current: _propTypes.default.object.isRequired
}),
applyValue: _propTypes.default.func,
className: _propTypes.default.string,
clearButton: _propTypes.default.node,
disabled: _propTypes.default.bool,
focusElementRef: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.shape({
current: _propTypes.default.any.isRequired
})]),
headerFilterMenu: _propTypes.default.node,
inputRef: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.shape({
current: (props, propName) => {
if (props[propName] == null) {
return null;
}
if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {
return new Error(`Expected prop '${propName}' to be of type Element`);
}
return null;
}
})]),
isFilterActive: _propTypes.default.bool,
item: _propTypes.default.shape({
field: _propTypes.default.string.isRequired,
id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
operator: _propTypes.default.string.isRequired,
value: _propTypes.default.any
}),
onBlur: _propTypes.default.func,
onFocus: _propTypes.default.func,
slotProps: _propTypes.default.object,
tabIndex: _propTypes.default.number
}),
label: _propTypes.default.string,
requiresFilterValue: _propTypes.default.bool,
value: _propTypes.default.string.isRequired
})).isRequired,
showClearItem: _propTypes.default.bool
} : void 0;