UNPKG

state-management-utilities

Version:
11 lines (10 loc) 862 B
import React from "react"; import { useStyles } from "../providers/StylesProvider"; export function Collapse({ children, length, type, }) { const [isCollapsed, setIsCollapsed] = React.useState(true); const styles = useStyles(); return !length ? (React.createElement("div", null, `${type === "array" ? "[ ]" : "{ }"} ${length}`)) : isCollapsed ? (React.createElement("div", { onClick: () => setIsCollapsed(false) }, `▼ ${type === "array" ? "[ ... ]" : "{ ... }"} ${length}`)) : (React.createElement("div", { className: styles["data-visualizer-col"] }, React.createElement("div", { onClick: () => setIsCollapsed(true) }, `▲ ${type === "array" ? "[" : "{"}`), React.createElement("div", { className: styles["data-visualizer-collapse-content"] }, children), React.createElement("div", null, type === "array" ? "]" : "}"))); }