@etsoo/materialui/lib/mjs/MobileListItemRenderer.js

TypeScript Material-UI Implementation

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { MoreFab } from "./MoreFab";
import LinearProgress from "@mui/material/LinearProgress";
import Card from "@mui/material/Card";
import CardHeader from "@mui/material/CardHeader";
import CardContent from "@mui/material/CardContent";
/**
 * Default mobile list item renderer
 * @param param0 List renderer props
 * @param margin Margin
 * @param renderer Renderer for card content
 * @returns Component
 */
export function MobileListItemRenderer({ data, itemHeight, margins }, renderer) {
    // Loading
    if (data == null)
        return _jsx(LinearProgress, {});
    // Elements
    const [title, subheader, actions, children, cardActions] = renderer(data);
    return (_jsxs(Card, { sx: {
            height: itemHeight,
            ...margins
        }, children: [_jsx(CardHeader, { sx: { paddingBottom: 0.5 }, action: Array.isArray(actions) ? (_jsx(MoreFab, { iconButton: true, size: "small", anchorOrigin: {
                        vertical: "bottom",
                        horizontal: "right"
                    }, transformOrigin: {
                        vertical: "top",
                        horizontal: "right"
                    }, actions: actions })) : (actions), title: title, subheader: subheader, slotProps: {
                    title: { variant: "body2" },
                    subheader: { variant: "caption" }
                } }), _jsx(CardContent, { sx: {
                    paddingTop: 0,
                    paddingBottom: cardActions == null ? Reflect.get(margins, "marginBottom") : 0
                }, children: children }), cardActions] }));
}