@uiw/react-json-view/esm/editor/KeyName.js

JSON viewer for react.

import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
var _excluded = ["children"],
  _excluded2 = ["value", "parentValue", "keyName"];
import { useRef, useState } from 'react';
import { useStore } from "./store.js";
import { jsx as _jsx } from "react/jsx-runtime";
export var KeyNameRender = (_ref, _ref2) => {
  var {
      children
    } = _ref,
    reset = _objectWithoutPropertiesLoose(_ref, _excluded);
  var {
    value,
    parentValue,
    keyName
  } = _ref2;
  if (typeof children === 'number') {
    return /*#__PURE__*/_jsx("span", _extends({}, reset, {
      children: children
    }));
  }
  return /*#__PURE__*/_jsx(Child, _extends({}, reset, {
    value: value,
    parentValue: parentValue,
    keyName: keyName,
    children: children
  }));
};
var Child = props => {
  var {
      value,
      keyName
    } = props,
    reset = _objectWithoutPropertiesLoose(props, _excluded2);
  var $dom = useRef(null);
  var [currentValue, setCurrentValue] = useState(props.children);
  var {
    onEdit
  } = useStore();
  var onKeyDown = evn => {
    if (evn.key === 'Enter') {
      var _$dom$current;
      (_$dom$current = $dom.current) == null || _$dom$current.setAttribute('contentEditable', 'false');
    }
  };
  var onClick = evn => {
    var _$dom$current2, _$dom$current3;
    evn.stopPropagation();
    (_$dom$current2 = $dom.current) == null || _$dom$current2.setAttribute('contentEditable', 'true');
    (_$dom$current3 = $dom.current) == null || _$dom$current3.focus();
  };
  var onBlur = evn => {
    var _$dom$current4;
    (_$dom$current4 = $dom.current) == null || _$dom$current4.setAttribute('contentEditable', 'false');
    var callback = onEdit && onEdit({
      value: evn.target.textContent,
      oldValue: value,
      keyName
    });
    if (callback) {
      setCurrentValue(evn.target.textContent);
    }
  };
  var spanProps = _extends({}, reset, {
    onKeyDown,
    onClick,
    onBlur,
    spellCheck: false,
    contentEditable: 'false',
    suppressContentEditableWarning: true,
    children: currentValue
  });
  return /*#__PURE__*/_jsx("span", _extends({}, spanProps, {
    ref: $dom
  }));
};