UNPKG

synapse-react-client

Version:

[![npm version](https://badge.fury.io/js/synapse-react-client.svg)](https://badge.fury.io/js/synapse-react-client) [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettie

61 lines (60 loc) 1.99 kB
import { jsx as e, jsxs as r, Fragment as m } from "react/jsx-runtime"; import { useState as f } from "react"; import { Typography as i, Collapse as y, Box as b } from "@mui/material"; import v from "../../ExpandCollapseButton.js"; import { JSONPrimitiveRenderer as p } from "./JSONPrimitiveRenderer.js"; const n = 3; function d(o) { const { keyName: a, value: l } = o; return /* @__PURE__ */ r( b, { sx: { display: "flex", mb: 1 }, children: [ /* @__PURE__ */ e(i, { variant: "smallText1", children: /* @__PURE__ */ e(p, { value: a }) }), /* @__PURE__ */ e( i, { variant: "smallText1", sx: { color: "grey.600", fontStyle: "italic", px: 0.5 }, children: /* @__PURE__ */ e(p, { value: l }) } ) ] } ); } function j(o) { const { value: a } = o, l = Object.keys(a).length, x = l > n, [s, u] = f(!1); return l === 0 ? /* @__PURE__ */ e(i, { variant: "smallText1", className: "SRC-inactive", children: "Empty object" }) : /* @__PURE__ */ r(m, { children: [ Object.entries(a).slice(0, n).map(([t, c]) => /* @__PURE__ */ e(d, { keyName: t, value: c }, t)), x && /* @__PURE__ */ r(m, { children: [ /* @__PURE__ */ e(y, { in: s, children: Object.entries(a).slice(n).map(([t, c]) => /* @__PURE__ */ e(d, { keyName: t, value: c }, t)) }), /* @__PURE__ */ r( i, { variant: "smallText1", sx: { mb: 0.5, color: "grey.600", fontStyle: "italic" }, children: [ s ? "" : `${(l - n).toLocaleString()} more`, /* @__PURE__ */ e( v, { isExpanded: s, className: "ExpandableTableData__expandButton", onClick: () => u((t) => !t) } ) ] } ) ] }) ] }); } export { j as JSONObjectRenderer }; //# sourceMappingURL=JSONObjectRenderer.js.map