@devtools-ds/object-inspector - npm Package Compare versions

Comparing version 1.0.4-canary.15.363.0 to 1.0.4-canary.18.378.0

dist/cjs/ObjectInspector.js

@@ -1,2 +0,2 @@
-"use strict";var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.ObjectInspector=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _clsx=_interopRequireDefault(require("clsx"));var _objectParser=require("@devtools-ds/object-parser");var _themes=require("@devtools-ds/themes");var _Context=require("./Context");var _ObjectInspectorItem=_interopRequireDefault(require("./ObjectInspectorItem"));var _ObjectInspector=_interopRequireDefault(require("./ObjectInspector.css"));const ObjectInspector=props=>{const{data,expandLevel,sortKeys,includePrototypes,className,theme,colorScheme,onSelect,name}=props,html=(0,_objectWithoutProperties2.default)(props,["data","expandLevel","sortKeys","includePrototypes","className","theme","colorScheme","onSelect","name"]);const[ast,setAST]=(0,_react.useState)(undefined);const{themeClass,currentTheme,currentColorScheme}=(0,_themes.useTheme)({theme,colorScheme},_ObjectInspector.default);(0,_react.useEffect)(()=>{const runParser=async()=>{setAST(await(0,_objectParser.parse)(data,sortKeys,includePrototypes))};runParser()},[data,sortKeys,includePrototypes]);return _react.default.createElement("div",(0,_extends2.default)({className:(0,_clsx.default)(_ObjectInspector.default.objectInspector,className,themeClass)},html),ast&&_react.default.createElement(_themes.ThemeProvider,{theme:currentTheme,colorScheme:currentColorScheme},_react.default.createElement(_Context.ObjectInspectorContext.Provider,{value:{name}},_react.default.createElement(_ObjectInspectorItem.default,{ast:ast,expandLevel:expandLevel,onSelect:onSelect}))))};exports.ObjectInspector=ObjectInspector;ObjectInspector.defaultProps={expandLevel:0,sortKeys:true,includePrototypes:true};var _default=ObjectInspector;exports.default=_default;
+"use strict";var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.ObjectInspector=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _clsx=_interopRequireDefault(require("clsx"));var _objectParser=require("@devtools-ds/object-parser");var _themes=require("@devtools-ds/themes");var _ObjectInspectorItem=_interopRequireDefault(require("./ObjectInspectorItem"));var _ObjectInspector=_interopRequireDefault(require("./ObjectInspector.css"));const ObjectInspector=props=>{const{data,expandLevel,sortKeys,includePrototypes,className,theme,colorScheme,onSelect}=props,html=(0,_objectWithoutProperties2.default)(props,["data","expandLevel","sortKeys","includePrototypes","className","theme","colorScheme","onSelect"]);const[ast,setAST]=(0,_react.useState)(undefined);const{themeClass,currentTheme,currentColorScheme}=(0,_themes.useTheme)({theme,colorScheme},_ObjectInspector.default);(0,_react.useEffect)(()=>{const runParser=async()=>{setAST(await(0,_objectParser.parse)(data,sortKeys,includePrototypes))};runParser()},[data,sortKeys,includePrototypes]);return _react.default.createElement("div",(0,_extends2.default)({className:(0,_clsx.default)(_ObjectInspector.default.objectInspector,className,themeClass)},html),ast&&_react.default.createElement(_themes.ThemeProvider,{theme:currentTheme,colorScheme:currentColorScheme},_react.default.createElement(_ObjectInspectorItem.default,{ast:ast,expandLevel:expandLevel,onSelect:onSelect})))};exports.ObjectInspector=ObjectInspector;ObjectInspector.defaultProps={expandLevel:0,sortKeys:true,includePrototypes:true};var _default=ObjectInspector;exports.default=_default;
 //# sourceMappingURL=ObjectInspector.js.map

dist/cjs/ObjectLabel.js

@@ -1,2 +0,2 @@
-"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.ObjectLabel=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireDefault(require("react"));var _clsx=_interopRequireDefault(require("clsx"));var _themes=require("@devtools-ds/themes");var _ObjectValue=_interopRequireDefault(require("./ObjectValue"));var _Context=require("./Context");var _ObjectInspector=_interopRequireDefault(require("./ObjectInspector.css"));const buildPreview=(children,previewMax,showKey)=>{const previews=[];for(let i=0;i<children.length;i++){const child=children[i];if(!child.isPrototype){previews.push(_react.default.createElement(_ObjectValue.default,{key:child.key,ast:child,showKey:showKey}));if(i<children.length-1){previews.push(", ")}else{previews.push(" ")}}if(child.isPrototype&&i===children.length-1){previews.pop();previews.push(" ")}if(i===previewMax-1&&children.length>previewMax){previews.push("\u2026 ");break}}return previews};const getArrayLabel=(ast,open,previewMax,theme)=>{const l=ast.value.length;if(open){return _react.default.createElement("span",null,"Array(",l,")")}return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement("span",null,`${theme==="firefox"?"Array":""}(${l}) [ `),buildPreview(ast.children,previewMax,false),_react.default.createElement("span",null,"]"))};const getObjectLabel=(ast,open,previewMax,theme)=>{if(ast.isPrototype){return _react.default.createElement("span",null,`Object ${theme==="firefox"?"{ \u2026 }":""}`)}if(open){return _react.default.createElement("span",null,"{\u2026}")}return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement("span",null,`${theme==="firefox"?"Object ":""}{ `),buildPreview(ast.children,previewMax,true),_react.default.createElement("span",null,"}"))};const getPromiseLabel=(ast,open,previewMax)=>{if(open){return _react.default.createElement("span",null,`Promise { "${String(ast.children[0].value)}" }`)}return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement("span",null,`Promise { `),buildPreview(ast.children,previewMax,true),_react.default.createElement("span",null,"}"))};const getMapLabel=(ast,open,previewMax,theme)=>{const{size}=ast.value;if(open){return _react.default.createElement("span",null,`Map(${size})`)}return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement("span",null,`Map${theme==="chrome"?`(${size})`:""} { `),buildPreview(ast.children,previewMax,true),_react.default.createElement("span",null,"}"))};const getSetLabel=(ast,open,previewMax)=>{const{size}=ast.value;if(open){return _react.default.createElement("span",null,"Set(",size,")")}return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement("span",null,`Set(${ast.value.size}) {`),buildPreview(ast.children,previewMax,true),_react.default.createElement("span",null,"}"))};const ObjectLabel=props=>{const{ast,theme,previewMax,open,colorScheme,className}=props,html=(0,_objectWithoutProperties2.default)(props,["ast","theme","previewMax","open","colorScheme","className"]);const{name}=_react.default.useContext(_Context.ObjectInspectorContext);const{themeClass,currentTheme}=(0,_themes.useTheme)({theme,colorScheme},_ObjectInspector.default);const isPrototype=ast.isPrototype||false;const classes=(0,_clsx.default)(_ObjectInspector.default.objectLabel,themeClass,className,{[_ObjectInspector.default.prototype]:isPrototype});const isRoot=ast.depth<=0;const Key=()=>{let{key}=ast;if(isRoot&&name)key=name;if(isRoot&&!name){return null}return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement("span",{className:isPrototype?_ObjectInspector.default.prototype:_ObjectInspector.default.key},key),key&&_react.default.createElement("span",{className:_ObjectInspector.default.text},":\xA0"))};if(ast.type==="array"){return _react.default.createElement("span",(0,_extends2.default)({className:classes},html),_react.default.createElement(Key,null),getArrayLabel(ast,open,previewMax,currentTheme))}if(ast.type==="function"){return _react.default.createElement("span",(0,_extends2.default)({className:classes},html),_react.default.createElement(Key,null),currentTheme==="chrome"&&_react.default.createElement("span",{className:_ObjectInspector.default.functionDecorator},"\u0192 "),_react.default.createElement("span",{className:(0,_clsx.default)({[_ObjectInspector.default.function]:!isPrototype})},`${ast.value.name}()`))}if(ast.type==="promise"){return _react.default.createElement("span",(0,_extends2.default)({className:classes},html),_react.default.createElement(Key,null),getPromiseLabel(ast,open,previewMax))}if(ast.type==="map"){return _react.default.createElement("span",(0,_extends2.default)({className:classes},html),_react.default.createElement(Key,null),getMapLabel(ast,open,previewMax,currentTheme))}if(ast.type==="set"){return _react.default.createElement("span",(0,_extends2.default)({className:classes},html),_react.default.createElement(Key,null),getSetLabel(ast,open,previewMax))}return _react.default.createElement("span",(0,_extends2.default)({className:classes},html),_react.default.createElement(Key,null),getObjectLabel(ast,open,previewMax,currentTheme))};exports.ObjectLabel=ObjectLabel;ObjectLabel.defaultProps={previewMax:8,open:false};var _default=ObjectLabel;exports.default=_default;
+"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.ObjectLabel=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireDefault(require("react"));var _clsx=_interopRequireDefault(require("clsx"));var _themes=require("@devtools-ds/themes");var _ObjectValue=_interopRequireDefault(require("./ObjectValue"));var _ObjectInspector=_interopRequireDefault(require("./ObjectInspector.css"));const buildPreview=(children,previewMax,showKey)=>{const previews=[];for(let i=0;i<children.length;i++){const child=children[i];if(!child.isPrototype){previews.push(_react.default.createElement(_ObjectValue.default,{key:child.key,ast:child,showKey:showKey}));if(i<children.length-1){previews.push(", ")}else{previews.push(" ")}}if(child.isPrototype&&i===children.length-1){previews.pop();previews.push(" ")}if(i===previewMax-1&&children.length>previewMax){previews.push("\u2026 ");break}}return previews};const getArrayLabel=(ast,open,previewMax,theme)=>{const l=ast.value.length;if(open){return _react.default.createElement("span",null,"Array(",l,")")}return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement("span",null,`${theme==="firefox"?"Array":""}(${l}) [ `),buildPreview(ast.children,previewMax,false),_react.default.createElement("span",null,"]"))};const getObjectLabel=(ast,open,previewMax,theme)=>{if(ast.isPrototype){return _react.default.createElement("span",null,`Object ${theme==="firefox"?"{ \u2026 }":""}`)}if(open){return _react.default.createElement("span",null,"{\u2026}")}return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement("span",null,`${theme==="firefox"?"Object ":""}{ `),buildPreview(ast.children,previewMax,true),_react.default.createElement("span",null,"}"))};const getPromiseLabel=(ast,open,previewMax)=>{if(open){return _react.default.createElement("span",null,`Promise { "${String(ast.children[0].value)}" }`)}return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement("span",null,`Promise { `),buildPreview(ast.children,previewMax,true),_react.default.createElement("span",null,"}"))};const getMapLabel=(ast,open,previewMax,theme)=>{const{size}=ast.value;if(open){return _react.default.createElement("span",null,`Map(${size})`)}return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement("span",null,`Map${theme==="chrome"?`(${size})`:""} { `),buildPreview(ast.children,previewMax,true),_react.default.createElement("span",null,"}"))};const getSetLabel=(ast,open,previewMax)=>{const{size}=ast.value;if(open){return _react.default.createElement("span",null,"Set(",size,")")}return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement("span",null,`Set(${ast.value.size}) {`),buildPreview(ast.children,previewMax,true),_react.default.createElement("span",null,"}"))};const ObjectLabel=props=>{const{ast,theme,previewMax,open,colorScheme,className}=props,html=(0,_objectWithoutProperties2.default)(props,["ast","theme","previewMax","open","colorScheme","className"]);const{themeClass,currentTheme}=(0,_themes.useTheme)({theme,colorScheme},_ObjectInspector.default);const isPrototype=ast.isPrototype||false;const classes=(0,_clsx.default)(_ObjectInspector.default.objectLabel,themeClass,className,{[_ObjectInspector.default.prototype]:isPrototype});const isRoot=ast.depth<=0;const Key=()=>{return _react.default.createElement("span",{className:isPrototype?_ObjectInspector.default.prototype:_ObjectInspector.default.key},isRoot?"":`${ast.key}: `)};if(ast.type==="array"){return _react.default.createElement("span",(0,_extends2.default)({className:classes},html),_react.default.createElement(Key,null),getArrayLabel(ast,open,previewMax,currentTheme))}if(ast.type==="function"){return _react.default.createElement("span",(0,_extends2.default)({className:classes},html),_react.default.createElement(Key,null),currentTheme==="chrome"&&_react.default.createElement("span",{className:_ObjectInspector.default.functionDecorator},"\u0192 "),_react.default.createElement("span",{className:(0,_clsx.default)({[_ObjectInspector.default.function]:!isPrototype})},`${ast.value.name}()`))}if(ast.type==="promise"){return _react.default.createElement("span",(0,_extends2.default)({className:classes},html),_react.default.createElement(Key,null),getPromiseLabel(ast,open,previewMax))}if(ast.type==="map"){return _react.default.createElement("span",(0,_extends2.default)({className:classes},html),_react.default.createElement(Key,null),getMapLabel(ast,open,previewMax,currentTheme))}if(ast.type==="set"){return _react.default.createElement("span",(0,_extends2.default)({className:classes},html),_react.default.createElement(Key,null),getSetLabel(ast,open,previewMax))}return _react.default.createElement("span",(0,_extends2.default)({className:classes},html),_react.default.createElement(Key,null),getObjectLabel(ast,open,previewMax,currentTheme))};exports.ObjectLabel=ObjectLabel;ObjectLabel.defaultProps={previewMax:8,open:false};var _default=ObjectLabel;exports.default=_default;
 //# sourceMappingURL=ObjectLabel.js.map

dist/cjs/ObjectValue.js

@@ -1,2 +0,2 @@
-"use strict";var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.ObjectValue=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _clsx=_interopRequireDefault(require("clsx"));var _themes=require("@devtools-ds/themes");var _objectParser=require("@devtools-ds/object-parser");var _ObjectInspector=_interopRequireDefault(require("./ObjectInspector.css"));var _Context=require("./Context");const buildValue=(key,value,valueClass,showKey,name,depth)=>{let computedKey=key.includes("-")?`"${key}"`:key;const isRoot=depth<=0;if(isRoot&&name)computedKey=name;return _react.default.createElement("span",{className:_ObjectInspector.default.text},(!isRoot||name)&&showKey&&_react.default.createElement(_react.default.Fragment,null,_react.default.createElement("span",{className:_ObjectInspector.default.key},computedKey),_react.default.createElement("span",null,":\xA0")),_react.default.createElement("span",{className:valueClass},value))};const ObjectValue=props=>{const context=_react.default.useContext(_Context.ObjectInspectorContext);const name=(context===null||context===void 0?void 0:context.name)||"";const{ast,theme,showKey,colorScheme,className}=props,html=(0,_objectWithoutProperties2.default)(props,["ast","theme","showKey","colorScheme","className"]);const{themeClass}=(0,_themes.useTheme)({theme,colorScheme},_ObjectInspector.default);const[asyncValue,setAsyncValue]=(0,_react.useState)(_react.default.createElement("span",null));let value=_react.default.createElement("span",null);(0,_react.useEffect)(()=>{if(ast.value instanceof Promise){const waitForPromiseResult=async promise=>{setAsyncValue(buildValue(ast.key,`Promise { "${await(0,_objectParser.getPromiseState)(promise)}" }`,_ObjectInspector.default.key,showKey,name,ast.depth))};waitForPromiseResult(ast.value)}},[ast,showKey]);if(typeof ast.value==="number"||typeof ast.value==="bigint"){value=buildValue(ast.key,String(ast.value),_ObjectInspector.default.number,showKey,name,ast.depth)}else if(typeof ast.value==="boolean"){value=buildValue(ast.key,String(ast.value),_ObjectInspector.default.boolean,showKey,name,ast.depth)}else if(typeof ast.value==="string"){value=buildValue(ast.key,`"${ast.value}"`,_ObjectInspector.default.string,showKey,name,ast.depth)}else if(typeof ast.value==="undefined"){value=buildValue(ast.key,"undefined",_ObjectInspector.default.undefined,showKey,name,ast.depth)}else if(typeof ast.value==="symbol"){value=buildValue(ast.key,ast.value.toString(),_ObjectInspector.default.string,showKey,name,ast.depth)}else if(typeof ast.value==="function"){value=buildValue(ast.key,`${ast.value.name}()`,_ObjectInspector.default.key,showKey,name,ast.depth)}else if(typeof ast.value==="object"){if(ast.value===null){value=buildValue(ast.key,"null",_ObjectInspector.default.null,showKey,name,ast.depth)}else if(Array.isArray(ast.value)){value=buildValue(ast.key,`Array(${ast.value.length})`,_ObjectInspector.default.key,showKey,name,ast.depth)}else if(ast.value instanceof Date){value=buildValue(ast.key,`Date ${ast.value.toString()}`,_ObjectInspector.default.value,showKey,name,ast.depth)}else if(ast.value instanceof RegExp){value=buildValue(ast.key,ast.value.toString(),_ObjectInspector.default.regex,showKey,name,ast.depth)}else if(ast.value instanceof Error){value=buildValue(ast.key,ast.value.toString(),_ObjectInspector.default.error,showKey,name,ast.depth)}else if((0,_objectParser.isObject)(ast.value)){value=buildValue(ast.key,"{\u2026}",_ObjectInspector.default.key,showKey,name,ast.depth)}else{value=buildValue(ast.key,ast.value.constructor.name,_ObjectInspector.default.key,showKey,name,ast.depth)}}return _react.default.createElement("span",(0,_extends2.default)({className:(0,_clsx.default)(themeClass,className)},html),asyncValue,value)};exports.ObjectValue=ObjectValue;ObjectValue.defaultProps={showKey:true};var _default=ObjectValue;exports.default=_default;
+"use strict";var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.ObjectValue=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _clsx=_interopRequireDefault(require("clsx"));var _themes=require("@devtools-ds/themes");var _objectParser=require("@devtools-ds/object-parser");var _ObjectInspector=_interopRequireDefault(require("./ObjectInspector.css"));const buildValue=(key,value,valueClass,showKey,depth)=>{const computedKey=key.includes("-")?`"${key}"`:key;const isRoot=depth<=0;return _react.default.createElement("span",{className:_ObjectInspector.default.text},!isRoot&&showKey&&_react.default.createElement(_react.default.Fragment,null,_react.default.createElement("span",{className:_ObjectInspector.default.key},computedKey),_react.default.createElement("span",null,":\xA0")),_react.default.createElement("span",{className:valueClass},value))};const ObjectValue=props=>{const{ast,theme,showKey,colorScheme,className}=props,html=(0,_objectWithoutProperties2.default)(props,["ast","theme","showKey","colorScheme","className"]);const{themeClass}=(0,_themes.useTheme)({theme,colorScheme},_ObjectInspector.default);const[asyncValue,setAsyncValue]=(0,_react.useState)(_react.default.createElement("span",null));let value=_react.default.createElement("span",null);(0,_react.useEffect)(()=>{if(ast.value instanceof Promise){const waitForPromiseResult=async promise=>{setAsyncValue(buildValue(ast.key,`Promise { "${await(0,_objectParser.getPromiseState)(promise)}" }`,_ObjectInspector.default.key,showKey,ast.depth))};waitForPromiseResult(ast.value)}},[ast,showKey]);if(typeof ast.value==="number"||typeof ast.value==="bigint"){value=buildValue(ast.key,String(ast.value),_ObjectInspector.default.number,showKey,ast.depth)}else if(typeof ast.value==="boolean"){value=buildValue(ast.key,String(ast.value),_ObjectInspector.default.boolean,showKey,ast.depth)}else if(typeof ast.value==="string"){value=buildValue(ast.key,`"${ast.value}"`,_ObjectInspector.default.string,showKey,ast.depth)}else if(typeof ast.value==="undefined"){value=buildValue(ast.key,"undefined",_ObjectInspector.default.undefined,showKey,ast.depth)}else if(typeof ast.value==="symbol"){value=buildValue(ast.key,ast.value.toString(),_ObjectInspector.default.string,showKey,ast.depth)}else if(typeof ast.value==="function"){value=buildValue(ast.key,`${ast.value.name}()`,_ObjectInspector.default.key,showKey,ast.depth)}else if(typeof ast.value==="object"){if(ast.value===null){value=buildValue(ast.key,"null",_ObjectInspector.default.null,showKey,ast.depth)}else if(Array.isArray(ast.value)){value=buildValue(ast.key,`Array(${ast.value.length})`,_ObjectInspector.default.key,showKey,ast.depth)}else if(ast.value instanceof Date){value=buildValue(ast.key,`Date ${ast.value.toString()}`,_ObjectInspector.default.value,showKey,ast.depth)}else if(ast.value instanceof RegExp){value=buildValue(ast.key,ast.value.toString(),_ObjectInspector.default.regex,showKey,ast.depth)}else if(ast.value instanceof Error){value=buildValue(ast.key,ast.value.toString(),_ObjectInspector.default.error,showKey,ast.depth)}else if((0,_objectParser.isObject)(ast.value)){value=buildValue(ast.key,"{\u2026}",_ObjectInspector.default.key,showKey,ast.depth)}else{value=buildValue(ast.key,ast.value.constructor.name,_ObjectInspector.default.key,showKey,ast.depth)}}return _react.default.createElement("span",(0,_extends2.default)({className:(0,_clsx.default)(themeClass,className)},html),asyncValue,value)};exports.ObjectValue=ObjectValue;ObjectValue.defaultProps={showKey:true};var _default=ObjectValue;exports.default=_default;
 //# sourceMappingURL=ObjectValue.js.map

dist/esm/ObjectInspector.js

@@ -1,2 +0,2 @@
-import _extends from"@babel/runtime/helpers/extends";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import React,{useEffect,useState}from"react";import makeClass from"clsx";import{parse}from"@devtools-ds/object-parser";import{useTheme,ThemeProvider}from"@devtools-ds/themes";import{ObjectInspectorContext}from"./Context";import ObjectInspectorItem from"./ObjectInspectorItem";import styles from"./ObjectInspector.css";export const ObjectInspector=props=>{const{data,expandLevel,sortKeys,includePrototypes,className,theme,colorScheme,onSelect,name}=props,html=_objectWithoutProperties(props,["data","expandLevel","sortKeys","includePrototypes","className","theme","colorScheme","onSelect","name"]);const[ast,setAST]=useState(undefined);const{themeClass,currentTheme,currentColorScheme}=useTheme({theme,colorScheme},styles);useEffect(()=>{const runParser=async()=>{setAST(await parse(data,sortKeys,includePrototypes))};runParser()},[data,sortKeys,includePrototypes]);return React.createElement("div",_extends({className:makeClass(styles.objectInspector,className,themeClass)},html),ast&&React.createElement(ThemeProvider,{theme:currentTheme,colorScheme:currentColorScheme},React.createElement(ObjectInspectorContext.Provider,{value:{name}},React.createElement(ObjectInspectorItem,{ast:ast,expandLevel:expandLevel,onSelect:onSelect}))))};ObjectInspector.defaultProps={expandLevel:0,sortKeys:true,includePrototypes:true};export default ObjectInspector;
+import _extends from"@babel/runtime/helpers/extends";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import React,{useEffect,useState}from"react";import makeClass from"clsx";import{parse}from"@devtools-ds/object-parser";import{useTheme,ThemeProvider}from"@devtools-ds/themes";import ObjectInspectorItem from"./ObjectInspectorItem";import styles from"./ObjectInspector.css";export const ObjectInspector=props=>{const{data,expandLevel,sortKeys,includePrototypes,className,theme,colorScheme,onSelect}=props,html=_objectWithoutProperties(props,["data","expandLevel","sortKeys","includePrototypes","className","theme","colorScheme","onSelect"]);const[ast,setAST]=useState(undefined);const{themeClass,currentTheme,currentColorScheme}=useTheme({theme,colorScheme},styles);useEffect(()=>{const runParser=async()=>{setAST(await parse(data,sortKeys,includePrototypes))};runParser()},[data,sortKeys,includePrototypes]);return React.createElement("div",_extends({className:makeClass(styles.objectInspector,className,themeClass)},html),ast&&React.createElement(ThemeProvider,{theme:currentTheme,colorScheme:currentColorScheme},React.createElement(ObjectInspectorItem,{ast:ast,expandLevel:expandLevel,onSelect:onSelect})))};ObjectInspector.defaultProps={expandLevel:0,sortKeys:true,includePrototypes:true};export default ObjectInspector;
 //# sourceMappingURL=ObjectInspector.js.map

dist/esm/ObjectLabel.js

@@ -1,2 +0,2 @@
-import _extends from"@babel/runtime/helpers/extends";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import React from"react";import makeClass from"clsx";import{useTheme}from"@devtools-ds/themes";import ObjectValue from"./ObjectValue";import{ObjectInspectorContext}from"./Context";import styles from"./ObjectInspector.css";const buildPreview=(children,previewMax,showKey)=>{const previews=[];for(let i=0;i<children.length;i++){const child=children[i];if(!child.isPrototype){previews.push(React.createElement(ObjectValue,{key:child.key,ast:child,showKey:showKey}));if(i<children.length-1){previews.push(", ")}else{previews.push(" ")}}if(child.isPrototype&&i===children.length-1){previews.pop();previews.push(" ")}if(i===previewMax-1&&children.length>previewMax){previews.push("\u2026 ");break}}return previews};const getArrayLabel=(ast,open,previewMax,theme)=>{const l=ast.value.length;if(open){return React.createElement("span",null,"Array(",l,")")}return React.createElement(React.Fragment,null,React.createElement("span",null,`${theme==="firefox"?"Array":""}(${l}) [ `),buildPreview(ast.children,previewMax,false),React.createElement("span",null,"]"))};const getObjectLabel=(ast,open,previewMax,theme)=>{if(ast.isPrototype){return React.createElement("span",null,`Object ${theme==="firefox"?"{ \u2026 }":""}`)}if(open){return React.createElement("span",null,"{\u2026}")}return React.createElement(React.Fragment,null,React.createElement("span",null,`${theme==="firefox"?"Object ":""}{ `),buildPreview(ast.children,previewMax,true),React.createElement("span",null,"}"))};const getPromiseLabel=(ast,open,previewMax)=>{if(open){return React.createElement("span",null,`Promise { "${String(ast.children[0].value)}" }`)}return React.createElement(React.Fragment,null,React.createElement("span",null,`Promise { `),buildPreview(ast.children,previewMax,true),React.createElement("span",null,"}"))};const getMapLabel=(ast,open,previewMax,theme)=>{const{size}=ast.value;if(open){return React.createElement("span",null,`Map(${size})`)}return React.createElement(React.Fragment,null,React.createElement("span",null,`Map${theme==="chrome"?`(${size})`:""} { `),buildPreview(ast.children,previewMax,true),React.createElement("span",null,"}"))};const getSetLabel=(ast,open,previewMax)=>{const{size}=ast.value;if(open){return React.createElement("span",null,"Set(",size,")")}return React.createElement(React.Fragment,null,React.createElement("span",null,`Set(${ast.value.size}) {`),buildPreview(ast.children,previewMax,true),React.createElement("span",null,"}"))};export const ObjectLabel=props=>{const{ast,theme,previewMax,open,colorScheme,className}=props,html=_objectWithoutProperties(props,["ast","theme","previewMax","open","colorScheme","className"]);const{name}=React.useContext(ObjectInspectorContext);const{themeClass,currentTheme}=useTheme({theme,colorScheme},styles);const isPrototype=ast.isPrototype||false;const classes=makeClass(styles.objectLabel,themeClass,className,{[styles.prototype]:isPrototype});const isRoot=ast.depth<=0;const Key=()=>{let{key}=ast;if(isRoot&&name)key=name;if(isRoot&&!name){return null}return React.createElement(React.Fragment,null,React.createElement("span",{className:isPrototype?styles.prototype:styles.key},key),key&&React.createElement("span",{className:styles.text},":\xA0"))};if(ast.type==="array"){return React.createElement("span",_extends({className:classes},html),React.createElement(Key,null),getArrayLabel(ast,open,previewMax,currentTheme))}if(ast.type==="function"){return React.createElement("span",_extends({className:classes},html),React.createElement(Key,null),currentTheme==="chrome"&&React.createElement("span",{className:styles.functionDecorator},"\u0192 "),React.createElement("span",{className:makeClass({[styles.function]:!isPrototype})},`${ast.value.name}()`))}if(ast.type==="promise"){return React.createElement("span",_extends({className:classes},html),React.createElement(Key,null),getPromiseLabel(ast,open,previewMax))}if(ast.type==="map"){return React.createElement("span",_extends({className:classes},html),React.createElement(Key,null),getMapLabel(ast,open,previewMax,currentTheme))}if(ast.type==="set"){return React.createElement("span",_extends({className:classes},html),React.createElement(Key,null),getSetLabel(ast,open,previewMax))}return React.createElement("span",_extends({className:classes},html),React.createElement(Key,null),getObjectLabel(ast,open,previewMax,currentTheme))};ObjectLabel.defaultProps={previewMax:8,open:false};export default ObjectLabel;
+import _extends from"@babel/runtime/helpers/extends";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import React from"react";import makeClass from"clsx";import{useTheme}from"@devtools-ds/themes";import ObjectValue from"./ObjectValue";import styles from"./ObjectInspector.css";const buildPreview=(children,previewMax,showKey)=>{const previews=[];for(let i=0;i<children.length;i++){const child=children[i];if(!child.isPrototype){previews.push(React.createElement(ObjectValue,{key:child.key,ast:child,showKey:showKey}));if(i<children.length-1){previews.push(", ")}else{previews.push(" ")}}if(child.isPrototype&&i===children.length-1){previews.pop();previews.push(" ")}if(i===previewMax-1&&children.length>previewMax){previews.push("\u2026 ");break}}return previews};const getArrayLabel=(ast,open,previewMax,theme)=>{const l=ast.value.length;if(open){return React.createElement("span",null,"Array(",l,")")}return React.createElement(React.Fragment,null,React.createElement("span",null,`${theme==="firefox"?"Array":""}(${l}) [ `),buildPreview(ast.children,previewMax,false),React.createElement("span",null,"]"))};const getObjectLabel=(ast,open,previewMax,theme)=>{if(ast.isPrototype){return React.createElement("span",null,`Object ${theme==="firefox"?"{ \u2026 }":""}`)}if(open){return React.createElement("span",null,"{\u2026}")}return React.createElement(React.Fragment,null,React.createElement("span",null,`${theme==="firefox"?"Object ":""}{ `),buildPreview(ast.children,previewMax,true),React.createElement("span",null,"}"))};const getPromiseLabel=(ast,open,previewMax)=>{if(open){return React.createElement("span",null,`Promise { "${String(ast.children[0].value)}" }`)}return React.createElement(React.Fragment,null,React.createElement("span",null,`Promise { `),buildPreview(ast.children,previewMax,true),React.createElement("span",null,"}"))};const getMapLabel=(ast,open,previewMax,theme)=>{const{size}=ast.value;if(open){return React.createElement("span",null,`Map(${size})`)}return React.createElement(React.Fragment,null,React.createElement("span",null,`Map${theme==="chrome"?`(${size})`:""} { `),buildPreview(ast.children,previewMax,true),React.createElement("span",null,"}"))};const getSetLabel=(ast,open,previewMax)=>{const{size}=ast.value;if(open){return React.createElement("span",null,"Set(",size,")")}return React.createElement(React.Fragment,null,React.createElement("span",null,`Set(${ast.value.size}) {`),buildPreview(ast.children,previewMax,true),React.createElement("span",null,"}"))};export const ObjectLabel=props=>{const{ast,theme,previewMax,open,colorScheme,className}=props,html=_objectWithoutProperties(props,["ast","theme","previewMax","open","colorScheme","className"]);const{themeClass,currentTheme}=useTheme({theme,colorScheme},styles);const isPrototype=ast.isPrototype||false;const classes=makeClass(styles.objectLabel,themeClass,className,{[styles.prototype]:isPrototype});const isRoot=ast.depth<=0;const Key=()=>{return React.createElement("span",{className:isPrototype?styles.prototype:styles.key},isRoot?"":`${ast.key}: `)};if(ast.type==="array"){return React.createElement("span",_extends({className:classes},html),React.createElement(Key,null),getArrayLabel(ast,open,previewMax,currentTheme))}if(ast.type==="function"){return React.createElement("span",_extends({className:classes},html),React.createElement(Key,null),currentTheme==="chrome"&&React.createElement("span",{className:styles.functionDecorator},"\u0192 "),React.createElement("span",{className:makeClass({[styles.function]:!isPrototype})},`${ast.value.name}()`))}if(ast.type==="promise"){return React.createElement("span",_extends({className:classes},html),React.createElement(Key,null),getPromiseLabel(ast,open,previewMax))}if(ast.type==="map"){return React.createElement("span",_extends({className:classes},html),React.createElement(Key,null),getMapLabel(ast,open,previewMax,currentTheme))}if(ast.type==="set"){return React.createElement("span",_extends({className:classes},html),React.createElement(Key,null),getSetLabel(ast,open,previewMax))}return React.createElement("span",_extends({className:classes},html),React.createElement(Key,null),getObjectLabel(ast,open,previewMax,currentTheme))};ObjectLabel.defaultProps={previewMax:8,open:false};export default ObjectLabel;
 //# sourceMappingURL=ObjectLabel.js.map

dist/esm/ObjectValue.js

@@ -1,2 +0,2 @@
-import _extends from"@babel/runtime/helpers/extends";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import React,{useState,useEffect}from"react";import makeClass from"clsx";import{useTheme}from"@devtools-ds/themes";import{isObject,getPromiseState}from"@devtools-ds/object-parser";import styles from"./ObjectInspector.css";import{ObjectInspectorContext}from"./Context";const buildValue=(key,value,valueClass,showKey,name,depth)=>{let computedKey=key.includes("-")?`"${key}"`:key;const isRoot=depth<=0;if(isRoot&&name)computedKey=name;return React.createElement("span",{className:styles.text},(!isRoot||name)&&showKey&&React.createElement(React.Fragment,null,React.createElement("span",{className:styles.key},computedKey),React.createElement("span",null,":\xA0")),React.createElement("span",{className:valueClass},value))};export const ObjectValue=props=>{const context=React.useContext(ObjectInspectorContext);const name=(context===null||context===void 0?void 0:context.name)||"";const{ast,theme,showKey,colorScheme,className}=props,html=_objectWithoutProperties(props,["ast","theme","showKey","colorScheme","className"]);const{themeClass}=useTheme({theme,colorScheme},styles);const[asyncValue,setAsyncValue]=useState(React.createElement("span",null));let value=React.createElement("span",null);useEffect(()=>{if(ast.value instanceof Promise){const waitForPromiseResult=async promise=>{setAsyncValue(buildValue(ast.key,`Promise { "${await getPromiseState(promise)}" }`,styles.key,showKey,name,ast.depth))};waitForPromiseResult(ast.value)}},[ast,showKey]);if(typeof ast.value==="number"||typeof ast.value==="bigint"){value=buildValue(ast.key,String(ast.value),styles.number,showKey,name,ast.depth)}else if(typeof ast.value==="boolean"){value=buildValue(ast.key,String(ast.value),styles.boolean,showKey,name,ast.depth)}else if(typeof ast.value==="string"){value=buildValue(ast.key,`"${ast.value}"`,styles.string,showKey,name,ast.depth)}else if(typeof ast.value==="undefined"){value=buildValue(ast.key,"undefined",styles.undefined,showKey,name,ast.depth)}else if(typeof ast.value==="symbol"){value=buildValue(ast.key,ast.value.toString(),styles.string,showKey,name,ast.depth)}else if(typeof ast.value==="function"){value=buildValue(ast.key,`${ast.value.name}()`,styles.key,showKey,name,ast.depth)}else if(typeof ast.value==="object"){if(ast.value===null){value=buildValue(ast.key,"null",styles.null,showKey,name,ast.depth)}else if(Array.isArray(ast.value)){value=buildValue(ast.key,`Array(${ast.value.length})`,styles.key,showKey,name,ast.depth)}else if(ast.value instanceof Date){value=buildValue(ast.key,`Date ${ast.value.toString()}`,styles.value,showKey,name,ast.depth)}else if(ast.value instanceof RegExp){value=buildValue(ast.key,ast.value.toString(),styles.regex,showKey,name,ast.depth)}else if(ast.value instanceof Error){value=buildValue(ast.key,ast.value.toString(),styles.error,showKey,name,ast.depth)}else if(isObject(ast.value)){value=buildValue(ast.key,"{\u2026}",styles.key,showKey,name,ast.depth)}else{value=buildValue(ast.key,ast.value.constructor.name,styles.key,showKey,name,ast.depth)}}return React.createElement("span",_extends({className:makeClass(themeClass,className)},html),asyncValue,value)};ObjectValue.defaultProps={showKey:true};export default ObjectValue;
+import _extends from"@babel/runtime/helpers/extends";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import React,{useState,useEffect}from"react";import makeClass from"clsx";import{useTheme}from"@devtools-ds/themes";import{isObject,getPromiseState}from"@devtools-ds/object-parser";import styles from"./ObjectInspector.css";const buildValue=(key,value,valueClass,showKey,depth)=>{const computedKey=key.includes("-")?`"${key}"`:key;const isRoot=depth<=0;return React.createElement("span",{className:styles.text},!isRoot&&showKey&&React.createElement(React.Fragment,null,React.createElement("span",{className:styles.key},computedKey),React.createElement("span",null,":\xA0")),React.createElement("span",{className:valueClass},value))};export const ObjectValue=props=>{const{ast,theme,showKey,colorScheme,className}=props,html=_objectWithoutProperties(props,["ast","theme","showKey","colorScheme","className"]);const{themeClass}=useTheme({theme,colorScheme},styles);const[asyncValue,setAsyncValue]=useState(React.createElement("span",null));let value=React.createElement("span",null);useEffect(()=>{if(ast.value instanceof Promise){const waitForPromiseResult=async promise=>{setAsyncValue(buildValue(ast.key,`Promise { "${await getPromiseState(promise)}" }`,styles.key,showKey,ast.depth))};waitForPromiseResult(ast.value)}},[ast,showKey]);if(typeof ast.value==="number"||typeof ast.value==="bigint"){value=buildValue(ast.key,String(ast.value),styles.number,showKey,ast.depth)}else if(typeof ast.value==="boolean"){value=buildValue(ast.key,String(ast.value),styles.boolean,showKey,ast.depth)}else if(typeof ast.value==="string"){value=buildValue(ast.key,`"${ast.value}"`,styles.string,showKey,ast.depth)}else if(typeof ast.value==="undefined"){value=buildValue(ast.key,"undefined",styles.undefined,showKey,ast.depth)}else if(typeof ast.value==="symbol"){value=buildValue(ast.key,ast.value.toString(),styles.string,showKey,ast.depth)}else if(typeof ast.value==="function"){value=buildValue(ast.key,`${ast.value.name}()`,styles.key,showKey,ast.depth)}else if(typeof ast.value==="object"){if(ast.value===null){value=buildValue(ast.key,"null",styles.null,showKey,ast.depth)}else if(Array.isArray(ast.value)){value=buildValue(ast.key,`Array(${ast.value.length})`,styles.key,showKey,ast.depth)}else if(ast.value instanceof Date){value=buildValue(ast.key,`Date ${ast.value.toString()}`,styles.value,showKey,ast.depth)}else if(ast.value instanceof RegExp){value=buildValue(ast.key,ast.value.toString(),styles.regex,showKey,ast.depth)}else if(ast.value instanceof Error){value=buildValue(ast.key,ast.value.toString(),styles.error,showKey,ast.depth)}else if(isObject(ast.value)){value=buildValue(ast.key,"{\u2026}",styles.key,showKey,ast.depth)}else{value=buildValue(ast.key,ast.value.constructor.name,styles.key,showKey,ast.depth)}}return React.createElement("span",_extends({className:makeClass(themeClass,className)},html),asyncValue,value)};ObjectValue.defaultProps={showKey:true};export default ObjectValue;
 //# sourceMappingURL=ObjectValue.js.map

dist/ObjectInspector.d.ts

@@ -7,4 +7,2 @@ /// <reference types="react" />
     data: SupportedTypes;
-    /** The key for the root object */
-    name?: string;
     /** Depth of the tree that is open at first render. */
@@ -11,0 +9,0 @@ expandLevel: number;

package.json

 {
   "name": "@devtools-ds/object-inspector",
-  "version": "1.0.4-canary.15.363.0",
+  "version": "1.0.4-canary.18.378.0",
   "main": "./dist/cjs/index.js",
@@ -33,5 +33,5 @@ "module": "./dist/esm/index.js",
     "@babel/runtime": "7.7.2",
-    "@devtools-ds/object-parser": "1.0.4-canary.15.363.0",
-    "@devtools-ds/themes": "1.0.4-canary.15.363.0",
-    "@devtools-ds/tree": "1.0.4-canary.15.363.0",
+    "@devtools-ds/object-parser": "1.0.4-canary.18.378.0",
+    "@devtools-ds/themes": "1.0.4-canary.18.378.0",
+    "@devtools-ds/tree": "1.0.4-canary.18.378.0",
     "clsx": "1.1.0"
@@ -51,3 +51,3 @@ },
   ],
-  "gitHead": "5fafeabb33d280114640ce4171971ba3829164c0"
+  "gitHead": "1669b7325150f94de6d6e3f442e3e54b45c27de2"
 }

Fixed alerts

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Improved metrics

Number of low quality alerts

6

decreased by-14.29%

Worsened metrics

Total package byte prevSize

134052

decreased by-6.62%

Number of package files

50

decreased by-12.28%

Lines of code

1112

decreased by-6.79%

Dependency changes

• + Added@devtools-ds/object-parser@1.0.4-canary.18.378.0(transitive)

• + Added@devtools-ds/themes@1.0.4-canary.18.378.0(transitive)

• + Added@devtools-ds/tree@1.0.4-canary.18.378.0(transitive)

• - Removed@devtools-ds/object-parser@1.0.4-canary.15.363.0(transitive)

• - Removed@devtools-ds/themes@1.0.4-canary.15.363.0(transitive)

• - Removed@devtools-ds/tree@1.0.4-canary.15.363.0(transitive)

• Updated@devtools-ds/object-parser@1.0.4-canary.18.378.0

• Updated@devtools-ds/themes@1.0.4-canary.18.378.0

• Updated@devtools-ds/tree@1.0.4-canary.18.378.0