@up-group-ui/react-controls
Version:
Up shared react controls
67 lines • 4.23 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var jsx_runtime_1 = require("react/jsx-runtime");
var React = (0, tslib_1.__importStar)(require("react"));
var typestyle_1 = require("typestyle");
var classnames_1 = (0, tslib_1.__importDefault)(require("classnames"));
var ButtonGroup_1 = (0, tslib_1.__importDefault)(require("../ButtonGroup"));
var UpButton_1 = (0, tslib_1.__importDefault)(require("../../Inputs/Button/UpButton"));
var utils_1 = require("../../../Common/utils");
var LoadingIndicator_1 = (0, tslib_1.__importDefault)(require("../../Display/LoadingIndicator"));
var device_1 = require("../../../Common/utils/device");
var getStyle = function (props) {
var position = props.actionsDataGrid ? {} : { position: 'absolute', right: 0 };
return (0, typestyle_1.style)({
display: 'flex',
marginTop: '5px',
width: '100%',
minHeight: '40px',
flexDirection: 'row',
$nest: {
'&.up-data-grid-footer .up-buttons-wrapper': {
alignItems: 'normal',
flexGrow: 1,
},
'&.up-data-grid-footer .up-btn-wrapper': {
marginRight: '6px',
},
'&.up-data-grid-footer .pagination-container': (0, tslib_1.__assign)({}, position),
'&.up-data-grid-footer .up-icon-wrapper svg path': {
fill: props.actionsDataGrid && props.theme.colorMap.disabledFg,
},
},
}, (0, typestyle_1.media)(device_1.DeviceSmartphones, {
flexDirection: 'column',
}));
};
var UpDataGridFooter = function (props) {
var pagination = props.pagination, actionsDataGrid = props.actionsDataGrid, isPaginationEnabled = props.isPaginationEnabled, data = props.data, isDataFetching = props.isDataFetching;
var _a = actionsDataGrid || {}, actions = _a.actions, validationLabel = _a.validationLabel, groupLabel = _a.groupLabel, intent = _a.intent;
var _b = React.useState(null), selectedAction = _b[0], selectAction = _b[1];
var selectedData = data.filter(function (element) { return element.isSelected; });
React.useEffect(function () {
if (actions && actions.length === 1) {
selectAction(actions[0]);
}
else if (selectedData.length < 1) {
selectAction(null);
}
}, [selectedData]);
var buttonAction = !(0, utils_1.isEmpty)(actions) &&
actions.map(function (_a) {
var label = _a.label, rest = (0, tslib_1.__rest)(_a, ["label"]);
return ({
libelle: label,
onClick: function () {
selectAction((0, tslib_1.__assign)({ label: label }, rest));
},
});
});
var handleValidation = function () {
selectedAction.onClick(selectedData);
};
return ((0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: (0, classnames_1.default)('up-data-grid-footer', getStyle(props)) }, { children: [actions && ((0, jsx_runtime_1.jsx)(ButtonGroup_1.default, (0, tslib_1.__assign)({ isAddOn: "right", gutter: 1, align: 'h' }, { children: actions.length === 1 ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(UpButton_1.default, (0, tslib_1.__assign)({ intent: "primary", disabled: !(selectedData.length >= 1), onClick: handleValidation }, { children: actions[0].label }), void 0) }, void 0)) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(UpButton_1.default, (0, tslib_1.__assign)({ dropDown: "down", intent: "primary", extraActions: buttonAction || [], disabled: !(selectedData.length >= 1) }, { children: (selectedAction && selectedAction.label) || groupLabel }), void 0), (0, jsx_runtime_1.jsx)(UpButton_1.default, (0, tslib_1.__assign)({ onClick: handleValidation, intent: intent, disabled: !selectedAction }, { children: validationLabel }), void 0)] }, void 0)) }), void 0)), isDataFetching && (0, jsx_runtime_1.jsx)(LoadingIndicator_1.default, {}, void 0), isPaginationEnabled && !isDataFetching && pagination] }), void 0));
};
exports.default = UpDataGridFooter;
//# sourceMappingURL=UpDataGridFooter.js.map