@uiw/react-json-view/esm/comps/NestedOpen.js

JSON viewer for react.

import _extends from "@babel/runtime/helpers/extends";
import { KayName } from './KeyValues';
import { useExpandsStore, useExpandsDispatch } from '../store/Expands';
import { useStore } from '../store';
import { Copied } from './Copied';
import { CountInfoExtraComps } from '../section/CountInfoExtra';
import { CountInfoComp } from '../section/CountInfo';
import { Arrow, BracketsOpen, BracketsClose } from '../symbol';
import { EllipsisComp } from '../section/Ellipsis';
import { SetComp, MapComp } from '../types';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export var NestedOpen = props => {
  var _expands$expandKey;
  var {
    keyName,
    expandKey,
    keys,
    initialValue,
    value,
    parentValue,
    level
  } = props;
  var expands = useExpandsStore();
  var dispatchExpands = useExpandsDispatch();
  var {
    onExpand,
    collapsed
  } = useStore();
  var isArray = Array.isArray(value);
  var isMySet = value instanceof Set;
  var isExpanded = (_expands$expandKey = expands[expandKey]) != null ? _expands$expandKey : typeof collapsed === 'boolean' ? collapsed : typeof collapsed === 'number' ? level > collapsed : false;
  var isObject = typeof value === 'object';
  var click = () => {
    var opt = {
      expand: !isExpanded,
      value,
      keyid: expandKey,
      keyName
    };
    onExpand && onExpand(opt);
    dispatchExpands({
      [expandKey]: opt.expand
    });
  };
  var style = {
    display: 'inline-flex',
    alignItems: 'center'
  };
  var arrowStyle = {
    transform: "rotate(" + (!isExpanded ? '0' : '-90') + "deg)",
    transition: 'all 0.3s'
  };
  var len = Object.keys(value).length;
  var showArrow = len !== 0 && (isArray || isMySet || isObject);
  var reset = {
    style
  };
  if (showArrow) {
    reset.onClick = click;
  }
  return /*#__PURE__*/_jsxs("span", _extends({}, reset, {
    children: [showArrow && /*#__PURE__*/_jsx(Arrow, {
      style: arrowStyle,
      expandKey: expandKey
    }), (keyName || typeof keyName === 'number') && /*#__PURE__*/_jsx(KayName, {
      keyName: keyName
    }), /*#__PURE__*/_jsx(SetComp, {
      value: initialValue,
      keyName: keyName
    }), /*#__PURE__*/_jsx(MapComp, {
      value: initialValue,
      keyName: keyName
    }), /*#__PURE__*/_jsx(BracketsOpen, {
      isBrackets: isArray || isMySet
    }), /*#__PURE__*/_jsx(EllipsisComp, {
      keyName: keyName,
      value: value,
      isExpanded: isExpanded
    }), /*#__PURE__*/_jsx(BracketsClose, {
      isVisiable: isExpanded || !showArrow,
      isBrackets: isArray || isMySet
    }), /*#__PURE__*/_jsx(CountInfoComp, {
      value: value,
      keyName: keyName
    }), /*#__PURE__*/_jsx(CountInfoExtraComps, {
      value: value,
      keyName: keyName
    }), /*#__PURE__*/_jsx(Copied, {
      keyName: keyName,
      value: value,
      expandKey: expandKey,
      parentValue: parentValue,
      keys: keys
    })]
  }));
};
NestedOpen.displayName = 'JVR.NestedOpen';