ra-core
Version:
Core components of react-admin, a frontend Framework for building admin applications on top of REST services, using ES6, React
140 lines • 6.93 kB
JavaScript
;
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
var desc = Object.getOwnPropertyDescriptor(m, k);
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
desc = { enumerable: true, get: function() { return m[k]; } };
}
Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || (function () {
var ownKeys = function(o) {
ownKeys = Object.getOwnPropertyNames || function (o) {
var ar = [];
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
return ar;
};
return ownKeys(o);
};
return function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
__setModuleDefault(result, mod);
return result;
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
exports.DataTable = void 0;
const React = __importStar(require("react"));
const routing_1 = require("../routing/index.cjs");
const useResourceContext_1 = require("../core/useResourceContext.cjs");
const useRecordContext_1 = require("../controller/record/useRecordContext.cjs");
const RecordContext_1 = require("../controller/record/RecordContext.cjs");
const useListContext_1 = require("../controller/list/useListContext.cjs");
const useFieldValue_1 = require("../util/useFieldValue.cjs");
const useEvent_1 = require("../util/useEvent.cjs");
const useGetPathForRecordCallback_1 = require("../routing/useGetPathForRecordCallback.cjs");
const DataTableSelectedIdsContext_1 = require("../dataTable/DataTableSelectedIdsContext.cjs");
const DataTableRenderContext_1 = require("../dataTable/DataTableRenderContext.cjs");
const DataTableConfigContext_1 = require("../dataTable/DataTableConfigContext.cjs");
const DataTableCallbacksContext_1 = require("../dataTable/DataTableCallbacksContext.cjs");
const DataTableBase_1 = require("../dataTable/DataTableBase.cjs");
const DataTableCol = (props) => {
const renderContext = (0, DataTableRenderContext_1.useDataTableRenderContext)();
switch (renderContext) {
case 'header':
return React.createElement(DataTableHeadCell, { ...props });
case 'data':
return React.createElement(DataTableCell, { ...props });
}
};
const DataTableHeadCell = (props) => {
return (React.createElement("th", null, props.label ?? (React.createElement(React.Fragment, null,
props.source?.substring(0, 1).toUpperCase(),
props.source?.substring(1)))));
};
const DataTableCell = (props) => {
const record = (0, useRecordContext_1.useRecordContext)();
if (props.render) {
return React.createElement("td", null, props.render(record));
}
if (props.children) {
return React.createElement("td", null, props.children);
}
if (props.field) {
return (React.createElement("td", null, React.createElement(props.field, { source: props.source })));
}
if (props.source) {
return (React.createElement("td", null,
React.createElement(DataTableCellValue, { source: props.source })));
}
};
const DataTableCellValue = (props) => {
const value = (0, useFieldValue_1.useFieldValue)(props);
return React.createElement(React.Fragment, null, value?.toString());
};
const DataTableRow = (props) => {
const getPathForRecord = (0, useGetPathForRecordCallback_1.useGetPathForRecordCallback)();
const navigate = (0, routing_1.useNavigate)();
const record = (0, useRecordContext_1.useRecordContext)(props);
if (!record) {
throw new Error('DataTableRow can only be used within a RecordContext or be passed a record prop');
}
const resource = (0, useResourceContext_1.useResourceContext)(props);
if (!resource) {
throw new Error('DataTableRow can only be used within a ResourceContext or be passed a resource prop');
}
const { hasBulkActions = false } = (0, DataTableConfigContext_1.useDataTableConfigContext)();
const { handleToggleItem, rowClick } = (0, DataTableCallbacksContext_1.useDataTableCallbacksContext)();
const selectedIds = (0, DataTableSelectedIdsContext_1.useDataTableSelectedIdsContext)();
const handleClick = (0, useEvent_1.useEvent)(async (event) => {
event.persist();
const temporaryLink = typeof rowClick === 'function'
? rowClick(record.id, resource, record)
: rowClick;
const link = isPromise(temporaryLink)
? await temporaryLink
: temporaryLink;
const path = await getPathForRecord({
record,
resource,
link,
});
if (path === false || path == null) {
return;
}
navigate(path, {
state: { _scrollToTop: true },
});
});
return (React.createElement("tr", { onClick: handleClick },
hasBulkActions && (React.createElement(DataTableCol, null,
React.createElement("input", { "aria-label": "Select this row", type: "checkbox", checked: selectedIds?.includes(record.id), onChange: event => handleToggleItem(record.id, event) }))),
props.children));
};
const isPromise = (value) => value && typeof value.then === 'function';
const DataTable = (props) => {
const { data } = (0, useListContext_1.useListContext)();
return (React.createElement(DataTableBase_1.DataTableBase, { hasBulkActions: false, ...props, empty: null, loading: null },
React.createElement("table", { border: 1, style: { width: '100%', borderCollapse: 'collapse' } },
React.createElement(DataTableRenderContext_1.DataTableRenderContext.Provider, { value: "header" },
React.createElement("thead", null,
React.createElement("tr", null,
props.hasBulkActions ? React.createElement("td", null) : null,
props.children))),
React.createElement(DataTableRenderContext_1.DataTableRenderContext.Provider, { value: "data" },
React.createElement("tbody", null, data?.map(record => (React.createElement(RecordContext_1.RecordContextProvider, { key: record.id, value: record },
React.createElement(DataTableRow, null, props.children)))))))));
};
exports.DataTable = DataTable;
exports.DataTable.Col = DataTableCol;
//# sourceMappingURL=DataTable.js.map