@fluentui/react-northstar
Version:
A themable React component library.
52 lines (51 loc) • 2.16 kB
JavaScript
import * as React from 'react';
import { find, isOverridden } from './utils';
export var DebugPanelData = function DebugPanelData(props) {
var data = props.data,
_props$indent = props.indent,
indent = _props$indent === void 0 ? 2 : _props$indent,
highlightKey = props.highlightKey,
overrides = props.overrides,
comments = props.comments,
commentKeyPredicate = props.commentKeyPredicate;
var isValidComment = typeof comments === 'string' && commentKeyPredicate && commentKeyPredicate(comments);
if (typeof data === 'undefined') {
return isValidComment ? /*#__PURE__*/React.createElement("abbr", {
title: comments
}, "undefined") : /*#__PURE__*/React.createElement("span", null, "undefined");
}
if (data === null || typeof data !== 'object') {
return isValidComment ? /*#__PURE__*/React.createElement("abbr", {
title: comments
}, JSON.stringify(data)) : /*#__PURE__*/React.createElement("span", null, JSON.stringify(data));
}
return /*#__PURE__*/React.createElement(React.Fragment, null, '{', Object.keys(data).map(function (key, idx) {
var value = data[key];
var comment = comments && comments[key];
var highlight = find(data, key, highlightKey);
var overridden = isOverridden(data, key, overrides);
return /*#__PURE__*/React.createElement("div", {
key: key
}, /*#__PURE__*/React.createElement("span", {
style: {
background: highlight ? 'rgb(255,255,224)' : ''
}
}, ' '.repeat(indent), /*#__PURE__*/React.createElement("span", {
style: {
textDecoration: overridden ? 'line-through' : 'none'
}
}, /*#__PURE__*/React.createElement("span", {
style: {
color: typeof value === 'object' ? 'grey' : '#b82519'
}
}, key), ': ', /*#__PURE__*/React.createElement(DebugPanelData, {
data: value,
comments: comment,
commentKeyPredicate: commentKeyPredicate,
indent: indent + 2,
overrides: overrides ? overrides[key] : null,
highlightKey: highlightKey
})), ','));
}), (indent > 2 ? ' '.repeat(indent - 2) : '') + "}");
};
//# sourceMappingURL=DebugPanelData.js.map