diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md new file mode 100644 index 0000000..e2e9b6b --- /dev/null +++ b/CONTRIBUTING.md @@ -0,0 +1,27 @@ +## Run the Dev Server + +```bash +# clone this repository +git clone git@github.com:microlinkhq/react-json-view.git && cd react-json-view +# install dependencies +npm install --save-dev +# run the dev server with hot reloading +npm run dev +``` +Webpack Dev Server should automatically open up http://localhost:2000 in your web browser. If it does not, open a browser and navigate to port 2000. The hot reloader will automatically reload when files are modified in the `/src/` directory. + +## Run the Production Build + +```bash +# run the build (note: you may need to use `sudo` priveledges to run the build successfully) +npm run build +``` +Please add tests for your code before posting a pull request. + +You can run the test suite with `npm run test` or `npm run test:watch` to automatically reload when files are modified. + +## Docker Tools + +I recommend using docker for development because it enforces environmental consistency. + +For information about contributing with Docker, see the [README in ./docker](https://github.com/microlinkhq/react-json-view/blob/master/docker/README.md#contributing-to-this-project-using-docker). \ No newline at end of file diff --git a/README.md b/README.md index 131ffc0..f65eca8 100644 --- a/README.md +++ b/README.md @@ -1,13 +1,14 @@ -![alt text](https://github.com/mac-s-g/react-json-view/blob/master/doc/rjv-icon-alt.png?raw=true) +![alt text](https://raw.githubusercontent.com/microlinkhq/react-json-view/master/doc/rjv-icon-alt.png) -[![npm](https://img.shields.io/npm/v/react-json-view.svg)](https://www.npmjs.com/package/react-json-view) [![npm](https://img.shields.io/npm/l/react-json-view.svg)](https://github.com/mac-s-g/react-json-view/blob/master/LISCENSE) [![Build Status](https://travis-ci.org/mac-s-g/react-json-view.svg)](https://travis-ci.org/mac-s-g/react-json-view) [![Coverage Status](https://coveralls.io/repos/github/mac-s-g/react-json-view/badge.svg?branch=master)](https://coveralls.io/github/mac-s-g/react-json-view?branch=master) +[![npm](https://img.shields.io/npm/v/%40microlink%2Freact-json-view.svg)](https://www.npmjs.com/package/@microlink/react-json-view) [![npm](https://img.shields.io/npm/l/%40microlink%2Freact-json-view.svg +)](https://github.com/microlinkhq/react-json-view/blob/master/LICENSE) [![Build Status](https://github.com/microlinkhq/react-json-view/workflows/test/badge.svg)](https://github.com/microlinkhq/react-json-view/actions/workflows/main.yml?query=branch%3Amaster) # react-json-view RJV is a React component for displaying and editing javascript **arrays** and **JSON objects**. This component provides a responsive interface for displaying arrays or JSON in a web browser. NPM offers a distribution of the source that's transpiled to ES5; so you can include this component with *any web-based javascript application*. -[Check out the Interactive Demo](https://mac-s-g.github.io/react-json-view/demo/dist/) +[Check out the Interactive Demo](https://react-json-view.microlink.io/) ### Implementation Example @@ -21,9 +22,9 @@ import ReactJson from '@microlink/react-json-view' ### Output Examples #### Default Theme -![alt text](https://github.com/mac-s-g/react-json-view/blob/master/doc/output-example-15.png?raw=true "Output Example 1") +![alt text](https://raw.githubusercontent.com/microlinkhq/react-json-view/master/doc/output-example-15.png "Output Example 1") #### Hopscotch Theme, with Triangle Icons: -![alt text](https://github.com/mac-s-g/react-json-view/blob/master/doc/output-example-14.png?raw=true "Output Example 2") +![alt text](https://raw.githubusercontent.com/microlinkhq/react-json-view/master/doc/output-example-14.png "Output Example 2") ### Installation Instructions Install this component with [NPM](https://www.npmjs.com/package/@microlink/react-json-view). @@ -42,7 +43,7 @@ Name|Type|Default|Description |:---|:---|:---|:--- `src`|`JSON Object`|None|This property contains your input JSON `name`|`string`|`JSX.Element` or `false`|"root"|Contains the name of your root node. Use `null` or `false` for no name. -`theme`|`string`|"rjv-default"|RJV supports base-16 themes. Check out the list of supported themes [in the demo](https://mac-s-g.github.io/react-json-view/demo/dist/). A custom "rjv-default" theme applies by default. +`theme`|`string`|"rjv-default"|RJV supports base-16 themes. Check out the list of supported themes [in the demo](https://react-json-view.microlink.io/). A custom "rjv-default" theme applies by default. `style`|`object`|`{}`|Style attributes for react-json-view container. Explicit style attributes will override attributes provided by a theme. `iconStyle`|`string`|"circle"| Style of expand/collapse icons. Accepted values are "circle", triangle" or "square". `indentWidth`|`integer`|4|Set the indent-width for nested objects @@ -83,18 +84,18 @@ You can specify a `theme` name or object when you instantiate your rjv component ```jsx ``` -Check out the list of supported themes [in the component demo](https://mac-s-g.github.io/react-json-view/demo/dist/). +Check out the list of supported themes [in the component demo](https://react-json-view.microlink.io/). #### Monokai theme example -![alt text](https://github.com/mac-s-g/react-json-view/blob/master/doc/output-example-monokai-2.png?raw=true "Base-16 Theme Example") +![alt text](https://raw.githubusercontent.com/microlinkhq/react-json-view/master/doc/output-example-monokai-2.png "Base-16 Theme Example") #### Solarized theme example -![alt text](https://github.com/mac-s-g/react-json-view/blob/master/doc/output-example-solarized-2.png?raw=true "Base-16 Theme Example") +![alt text](https://raw.githubusercontent.com/microlinkhq/react-json-view/master/doc/output-example-solarized-2.png "Base-16 Theme Example") #### Use Your Own Theme You can supply your own base-16 theme object. -To better understand custom themes, take a look at [my example implementation](https://github.com/mac-s-g/react-json-view/blob/7c154b9a7d83ea89dce2c171ebdf4d163ff49233/dev-server/src/index.js#L135) and the [base-16 theme styling guidelines](https://github.com/chriskempson/base16/blob/master/styling.md). +To better understand custom themes, take a look at [my example implementation](https://github.com/microlinkhq/react-json-view/blob/7c154b9a7d83ea89dce2c171ebdf4d163ff49233/dev-server/src/index.js#L135) and the [base-16 theme styling guidelines](https://github.com/chriskempson/base16/blob/master/styling.md). ### onEdit, onAdd and onDelete Interaction Pass callback methods to `onEdit`, `onAdd` and `onDelete` props. Your method will be invoked when a user attempts to update your `src` object. @@ -110,39 +111,4 @@ The following object will be passed to your method: } ``` -Returning `false` from a callback method will prevent the src from being affected. - -### Contributing to the source code -#### Run the Dev Server - -```bash -# clone this repository -git clone git@github.com:mac-s-g/react-json-view.git && cd react-json-view -# install dependencies -npm install --save-dev -# run the dev server with hot reloading -npm run dev -``` -Webpack Dev Server should automatically open up http://localhost:2000 in your web browser. If it does not, open a browser and navigate to port 2000. The hot reloader will automatically reload when files are modified in the `/src/` directory. - -#### Run the Production Build - -```bash -# run the build (note: you may need to use `sudo` priveledges to run the build successfully) -npm run build -``` -Please add tests for your code before posting a pull request. - -You can run the test suite with `npm run test` or `npm run test:watch` to automatically reload when files are modified. - -#### Docker Tools - -I recommend using docker for development because it enforces environmental consistency. - -For information about contributing with Docker, see the [README in ./docker](https://github.com/mac-s-g/react-json-view/blob/master/docker/README.md#contributing-to-this-project-using-docker). - - -### Inspiration -I drew a ton of design ideas from [react-json-tree](https://github.com/alexkuz/react-json-tree). Thanks to the RJT contributors for putting together an awesome component! - -I'm also inspired by users who come up with interesting feature requests. Reach out to me with ideas for this project or other projects you want to collaborate on. My email address is listed on my [github user page](https://github.com/mac-s-g). +Returning `false` from a callback method will prevent the src from being affected. \ No newline at end of file diff --git a/demo/dist/index.html b/demo/dist/index.html index 10c7633..c075a27 100644 --- a/demo/dist/index.html +++ b/demo/dist/index.html @@ -55,13 +55,13 @@
diff --git a/demo/dist/main.js b/demo/dist/main.js index ad1c876..d012aa0 100644 --- a/demo/dist/main.js +++ b/demo/dist/main.js @@ -9,4 +9,4 @@ Licensed under the MIT License (MIT), see http://jedwatson.github.io/react-select */ -var K=function(e){return"string"==typeof e?e:null!==e&&JSON.stringify(e)||""},W=k.a.oneOfType([k.a.string,k.a.node]),H=k.a.oneOfType([k.a.string,k.a.number]),U=1,Y=function(e,t){var n=void 0===e?"undefined":I(e);if("string"!==n&&"number"!==n&&"boolean"!==n)return e;var a=t.options,r=t.valueKey;if(a)for(var o=0;os||id.bottom?c.scrollTop=l.offsetTop+l.clientHeight-c.offsetHeight:p.topt.offsetHeight&&t.scrollHeight-t.offsetHeight-t.scrollTop<=0&&this.props.onMenuScrollToBottom()}}},{key:"getOptionLabel",value:function(e){return e[this.props.labelKey]}},{key:"getValueArray",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:void 0,n="object"===(void 0===t?"undefined":I(t))?t:this.props;if(n.multi){if("string"==typeof e&&(e=e.split(n.delimiter)),!Array.isArray(e)){if(null==e)return[];e=[e]}return e.map((function(e){return Y(e,n)})).filter((function(e){return e}))}var a=Y(e,n);return a?[a]:[]}},{key:"setValue",value:function(e){var t=this;if(this.props.autoBlur&&this.blurInput(),this.props.required){var n=J(e,this.props.multi);this.setState({required:n})}this.props.simpleValue&&e&&(e=this.props.multi?e.map((function(e){return e[t.props.valueKey]})).join(this.props.delimiter):e[this.props.valueKey]),this.props.onChange&&this.props.onChange(e)}},{key:"selectValue",value:function(e){var t=this;this.props.closeOnSelect&&(this.hasScrolledToOption=!1);var n=this.props.onSelectResetsInput?"":this.state.inputValue;this.props.multi?this.setState({focusedIndex:null,inputValue:this.handleInputValueChange(n),isOpen:!this.props.closeOnSelect},(function(){t.getValueArray(t.props.value).some((function(n){return n[t.props.valueKey]===e[t.props.valueKey]}))?t.removeValue(e):t.addValue(e)})):this.setState({inputValue:this.handleInputValueChange(n),isOpen:!this.props.closeOnSelect,isPseudoFocused:this.state.isFocused},(function(){t.setValue(e)}))}},{key:"addValue",value:function(e){var t=this.getValueArray(this.props.value),n=this._visibleOptions.filter((function(e){return!e.disabled})),a=n.indexOf(e);this.setValue(t.concat(e)),this.props.closeOnSelect&&(n.length-1===a?this.focusOption(n[a-1]):n.length>a&&this.focusOption(n[a+1]))}},{key:"popValue",value:function(){var e=this.getValueArray(this.props.value);e.length&&!1!==e[e.length-1].clearableValue&&this.setValue(this.props.multi?e.slice(0,e.length-1):null)}},{key:"removeValue",value:function(e){var t=this,n=this.getValueArray(this.props.value);this.setValue(n.filter((function(n){return n[t.props.valueKey]!==e[t.props.valueKey]}))),this.focus()}},{key:"clearValue",value:function(e){e&&"mousedown"===e.type&&0!==e.button||(e.preventDefault(),this.setValue(this.getResetValue()),this.setState({inputValue:this.handleInputValueChange(""),isOpen:!1},this.focus),this._focusAfterClear=!0)}},{key:"getResetValue",value:function(){return void 0!==this.props.resetValue?this.props.resetValue:this.props.multi?[]:null}},{key:"focusOption",value:function(e){this.setState({focusedOption:e})}},{key:"focusNextOption",value:function(){this.focusAdjacentOption("next")}},{key:"focusPreviousOption",value:function(){this.focusAdjacentOption("previous")}},{key:"focusPageUpOption",value:function(){this.focusAdjacentOption("page_up")}},{key:"focusPageDownOption",value:function(){this.focusAdjacentOption("page_down")}},{key:"focusStartOption",value:function(){this.focusAdjacentOption("start")}},{key:"focusEndOption",value:function(){this.focusAdjacentOption("end")}},{key:"focusAdjacentOption",value:function(e){var t=this._visibleOptions.map((function(e,t){return{option:e,index:t}})).filter((function(e){return!e.option.disabled}));if(this._scrollToFocusedOptionOnUpdate=!0,!this.state.isOpen){var n={focusedOption:this._focusedOption||(t.length?t["next"===e?0:t.length-1].option:null),isOpen:!0};return this.props.onSelectResetsInput&&(n.inputValue=""),void this.setState(n)}if(t.length){for(var a=-1,r=0;r0?a-=1:a=t.length-1;else if("start"===e)a=0;else if("end"===e)a=t.length-1;else if("page_up"===e){var o=a-this.props.pageSize;a=o<0?0:o}else if("page_down"===e){var i=a+this.props.pageSize;a=i>t.length-1?t.length-1:i}-1===a&&(a=0),this.setState({focusedIndex:t[a].index,focusedOption:t[a].option})}}},{key:"getFocusedOption",value:function(){return this._focusedOption}},{key:"selectFocusedOption",value:function(){if(this._focusedOption)return this.selectValue(this._focusedOption)}},{key:"renderLoading",value:function(){if(this.props.isLoading)return v.a.createElement("span",{className:"Select-loading-zone","aria-hidden":"true"},v.a.createElement("span",{className:"Select-loading"}))}},{key:"renderValue",value:function(e,t){var n=this,a=this.props.valueRenderer||this.getOptionLabel,r=this.props.valueComponent;if(!e.length)return function(e,t,n){var a=e.inputValue,r=e.isPseudoFocused,o=e.isFocused,i=t.onSelectResetsInput;return!a||!i&&!n&&!r&&!o}(this.state,this.props,t)?v.a.createElement("div",{className:"Select-placeholder"},this.props.placeholder):null;var o,i,s,u,l,c,p=this.props.onValueClick?this.handleValueClick:null;return this.props.multi?e.map((function(t,o){return v.a.createElement(r,{disabled:n.props.disabled||!1===t.clearableValue,id:n._instancePrefix+"-value-"+o,instancePrefix:n._instancePrefix,key:"value-"+o+"-"+t[n.props.valueKey],onClick:p,onRemove:n.removeValue,placeholder:n.props.placeholder,value:t,values:e},a(t,o),v.a.createElement("span",{className:"Select-aria-only"}," "))})):(o=this.state,i=this.props,s=o.inputValue,u=o.isPseudoFocused,l=o.isFocused,c=i.onSelectResetsInput,s&&(c||!l&&u||l&&!u)?void 0:(t&&(p=null),v.a.createElement(r,{disabled:this.props.disabled,id:this._instancePrefix+"-value-item",instancePrefix:this._instancePrefix,onClick:p,placeholder:this.props.placeholder,value:e[0]},a(e[0]))))}},{key:"renderInput",value:function(e,t){var n,a=this,r=C()("Select-input",this.props.inputProps.className),o=this.state.isOpen,i=C()((T(n={},this._instancePrefix+"-list",o),T(n,this._instancePrefix+"-backspace-remove-message",this.props.multi&&!this.props.disabled&&this.state.isFocused&&!this.state.inputValue),n)),s=this.state.inputValue;!s||this.props.onSelectResetsInput||this.state.isFocused||(s="");var u=R({},this.props.inputProps,{"aria-activedescendant":o?this._instancePrefix+"-option-"+t:this._instancePrefix+"-value","aria-describedby":this.props["aria-describedby"],"aria-expanded":""+o,"aria-haspopup":""+o,"aria-label":this.props["aria-label"],"aria-labelledby":this.props["aria-labelledby"],"aria-owns":i,onBlur:this.handleInputBlur,onChange:this.handleInputChange,onFocus:this.handleInputFocus,ref:function(e){return a.input=e},role:"combobox",required:this.state.required,tabIndex:this.props.tabIndex,value:s});if(this.props.inputRenderer)return this.props.inputRenderer(u);if(this.props.disabled||!this.props.searchable){var l=L(this.props.inputProps,[]),c=C()(T({},this._instancePrefix+"-list",o));return v.a.createElement("div",R({},l,{"aria-expanded":o,"aria-owns":c,"aria-activedescendant":o?this._instancePrefix+"-option-"+t:this._instancePrefix+"-value","aria-disabled":""+this.props.disabled,"aria-label":this.props["aria-label"],"aria-labelledby":this.props["aria-labelledby"],className:r,onBlur:this.handleInputBlur,onFocus:this.handleInputFocus,ref:function(e){return a.input=e},role:"combobox",style:{border:0,width:1,display:"inline-block"},tabIndex:this.props.tabIndex||0}))}return this.props.autosize?v.a.createElement(x.a,R({id:this.props.id},u,{className:r,minWidth:"5"})):v.a.createElement("div",{className:r,key:"input-wrap",style:{display:"inline-block"}},v.a.createElement("input",R({id:this.props.id},u)))}},{key:"renderClear",value:function(){var e=this.getValueArray(this.props.value);if(this.props.clearable&&e.length&&!this.props.disabled&&!this.props.isLoading){var t=this.props.multi?this.props.clearAllText:this.props.clearValueText,n=this.props.clearRenderer();return v.a.createElement("span",{"aria-label":t,className:"Select-clear-zone",onMouseDown:this.clearValue,onTouchEnd:this.handleTouchEndClearValue,onTouchMove:this.handleTouchMove,onTouchStart:this.handleTouchStart,title:t},n)}}},{key:"renderArrow",value:function(){if(this.props.arrowRenderer){var e=this.handleMouseDownOnArrow,t=this.state.isOpen,n=this.props.arrowRenderer({onMouseDown:e,isOpen:t});return n?v.a.createElement("span",{className:"Select-arrow-zone",onMouseDown:e},n):null}}},{key:"filterOptions",value:function(e){var t=this.state.inputValue,n=this.props.options||[];if(this.props.filterOptions){var a="function"==typeof this.props.filterOptions?this.props.filterOptions:F;return a(n,t,e,{filterOption:this.props.filterOption,ignoreAccents:this.props.ignoreAccents,ignoreCase:this.props.ignoreCase,labelKey:this.props.labelKey,matchPos:this.props.matchPos,matchProp:this.props.matchProp,trimFilter:this.props.trimFilter,valueKey:this.props.valueKey})}return n}},{key:"onOptionRef",value:function(e,t){t&&(this.focused=e)}},{key:"renderMenu",value:function(e,t,n){return e&&e.length?this.props.menuRenderer({focusedOption:n,focusOption:this.focusOption,inputValue:this.state.inputValue,instancePrefix:this._instancePrefix,labelKey:this.props.labelKey,onFocus:this.focusOption,onOptionRef:this.onOptionRef,onSelect:this.selectValue,optionClassName:this.props.optionClassName,optionComponent:this.props.optionComponent,optionRenderer:this.props.optionRenderer||this.getOptionLabel,options:e,removeValue:this.removeValue,selectValue:this.selectValue,valueArray:t,valueKey:this.props.valueKey}):this.props.noResultsText?v.a.createElement("div",{className:"Select-noresults"},this.props.noResultsText):null}},{key:"renderHiddenField",value:function(e){var t=this;if(this.props.name){if(this.props.joinValues){var n=e.map((function(e){return K(e[t.props.valueKey])})).join(this.props.delimiter);return v.a.createElement("input",{disabled:this.props.disabled,name:this.props.name,ref:function(e){return t.value=e},type:"hidden",value:n})}return e.map((function(e,n){return v.a.createElement("input",{disabled:t.props.disabled,key:"hidden."+n,name:t.props.name,ref:"value"+n,type:"hidden",value:K(e[t.props.valueKey])})}))}}},{key:"getFocusableOptionIndex",value:function(e){var t=this._visibleOptions;if(!t.length)return null;var n=this.props.valueKey,a=this.state.focusedOption||e;if(a&&!a.disabled){var r=-1;if(t.some((function(e,t){var o=e[n]===a[n];return o&&(r=t),o})),-1!==r)return r}for(var o=0;o=0||(r[n]=e[n]);return r}(e,t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(a=0;a=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(r[n]=e[n])}return r}function he(e){var t=function(e){return{}.toString.call(e).match(/\s([a-zA-Z]+)/)[1].toLowerCase()}(e);return"number"===t&&(t=isNaN(e)?"nan":(0|e)!=e?"float":"integer"),t}le.__suppressDeprecationWarning=!0,ce.__suppressDeprecationWarning=!0,pe.__suppressDeprecationWarning=!0;var be={scheme:"rjv-default",author:"mac gainor",base00:"rgba(0, 0, 0, 0)",base01:"rgb(245, 245, 245)",base02:"rgb(235, 235, 235)",base03:"#93a1a1",base04:"rgba(0, 0, 0, 0.3)",base05:"#586e75",base06:"#073642",base07:"#002b36",base08:"#d33682",base09:"#cb4b16",base0A:"#dc322f",base0B:"#859900",base0C:"#6c71c4",base0D:"#586e75",base0E:"#2aa198",base0F:"#268bd2"},ve={scheme:"rjv-grey",author:"mac gainor",base00:"rgba(1, 1, 1, 0)",base01:"rgba(1, 1, 1, 0.1)",base02:"rgba(0, 0, 0, 0.2)",base03:"rgba(1, 1, 1, 0.3)",base04:"rgba(0, 0, 0, 0.4)",base05:"rgba(1, 1, 1, 0.5)",base06:"rgba(1, 1, 1, 0.6)",base07:"rgba(1, 1, 1, 0.7)",base08:"rgba(1, 1, 1, 0.8)",base09:"rgba(1, 1, 1, 0.8)",base0A:"rgba(1, 1, 1, 0.8)",base0B:"rgba(1, 1, 1, 0.8)",base0C:"rgba(1, 1, 1, 0.8)",base0D:"rgba(1, 1, 1, 0.8)",base0E:"rgba(1, 1, 1, 0.8)",base0F:"rgba(1, 1, 1, 0.8)"},me={white:"#fff",black:"#000",transparent:"rgba(1, 1, 1, 0)",globalFontFamily:"monospace",globalCursor:"default",indentBlockWidth:"5px",braceFontWeight:"bold",braceCursor:"pointer",ellipsisFontSize:"18px",ellipsisLineHeight:"10px",ellipsisCursor:"pointer",keyMargin:"0px 5px",keyLetterSpacing:"0.5px",keyFontStyle:"none",keyBorderRadius:"3px",keyColonWeight:"bold",keyVerticalAlign:"top",keyOpacity:"0.85",keyOpacityHover:"1",keyValPaddingTop:"3px",keyValPaddingBottom:"3px",keyValPaddingRight:"5px",keyValBorderLeft:"1px solid",keyValBorderHover:"2px solid",keyValPaddingHover:"3px 5px 3px 4px",pushedContentMarginLeft:"6px",variableValuePaddingRight:"6px",nullFontSize:"11px",nullFontWeight:"bold",nullPadding:"1px 2px",nullBorderRadius:"3px",nanFontSize:"11px",nanFontWeight:"bold",nanPadding:"1px 2px",nanBorderRadius:"3px",undefinedFontSize:"11px",undefinedFontWeight:"bold",undefinedPadding:"1px 2px",undefinedBorderRadius:"3px",dataTypeFontSize:"11px",dataTypeMarginRight:"4px",datatypeOpacity:"0.8",objectSizeBorderRadius:"3px",objectSizeFontStyle:"italic",objectSizeMargin:"0px 6px 0px 0px",clipboardCursor:"pointer",clipboardCheckMarginLeft:"-12px",metaDataPadding:"0px 0px 0px 10px",arrayGroupMetaPadding:"0px 0px 0px 4px",iconContainerWidth:"17px",tooltipPadding:"4px",editInputHeight:"25px",editInputMinWidth:"130px",editInputBorderRadius:"2px",editInputPadding:"5px",editInputMarginRight:"4px",editInputFontFamily:"monospace",iconCursor:"pointer",iconFontSize:"15px",iconPaddingRight:"1px",dateValueMarginLeft:"2px",iconMarginRight:"3px",detectedRowPaddingTop:"3px",addKeyCoverBackground:"rgba(255, 255, 255, 0.3)",addKeyCoverPosition:"absolute",addKeyCoverPositionPx:"0px",addKeyModalWidth:"200px",addKeyModalMargin:"auto",addKeyModalPadding:"10px",addKeyModalRadius:"3px"},ge=n(51),ye=function(e){var t=function(e){return{backgroundColor:e.base00,ellipsisColor:e.base09,braceColor:e.base07,expandedIcon:e.base0D,collapsedIcon:e.base0E,keyColor:e.base07,arrayKeyColor:e.base0C,objectSize:e.base04,copyToClipboard:e.base0F,copyToClipboardCheck:e.base0D,objectBorder:e.base02,dataTypes:{boolean:e.base0E,date:e.base0D,float:e.base0B,function:e.base0D,integer:e.base0F,string:e.base09,nan:e.base08,null:e.base0A,undefined:e.base05,regexp:e.base0A,background:e.base02},editVariable:{editIcon:e.base0E,cancelIcon:e.base09,removeIcon:e.base09,addIcon:e.base0E,checkIcon:e.base0E,background:e.base01,color:e.base0A,border:e.base07},addKeyModal:{background:e.base05,border:e.base04,color:e.base0A,labelColor:e.base01},validationFailure:{background:e.base09,iconColor:e.base01,fontColor:e.base01}}}(e);return{"app-container":{fontFamily:me.globalFontFamily,cursor:me.globalCursor,backgroundColor:t.backgroundColor,position:"relative"},ellipsis:{display:"inline-block",color:t.ellipsisColor,fontSize:me.ellipsisFontSize,lineHeight:me.ellipsisLineHeight,cursor:me.ellipsisCursor},"brace-row":{display:"inline-block",cursor:"pointer"},brace:{display:"inline-block",cursor:me.braceCursor,fontWeight:me.braceFontWeight,color:t.braceColor},"expanded-icon":{color:t.expandedIcon},"collapsed-icon":{color:t.collapsedIcon},colon:{display:"inline-block",margin:me.keyMargin,color:t.keyColor,verticalAlign:"top"},objectKeyVal:function(e,n){return{style:y({paddingTop:me.keyValPaddingTop,paddingRight:me.keyValPaddingRight,paddingBottom:me.keyValPaddingBottom,borderLeft:me.keyValBorderLeft+" "+t.objectBorder,":hover":{paddingLeft:n.paddingLeft-1+"px",borderLeft:me.keyValBorderHover+" "+t.objectBorder}},n)}},"object-key-val-no-border":{padding:me.keyValPadding},"pushed-content":{marginLeft:me.pushedContentMarginLeft},variableValue:function(e,t){return{style:y({display:"inline-block",paddingRight:me.variableValuePaddingRight,position:"relative"},t)}},"object-name":{display:"inline-block",color:t.keyColor,letterSpacing:me.keyLetterSpacing,fontStyle:me.keyFontStyle,verticalAlign:me.keyVerticalAlign,opacity:me.keyOpacity,":hover":{opacity:me.keyOpacityHover}},"array-key":{display:"inline-block",color:t.arrayKeyColor,letterSpacing:me.keyLetterSpacing,fontStyle:me.keyFontStyle,verticalAlign:me.keyVerticalAlign,opacity:me.keyOpacity,":hover":{opacity:me.keyOpacityHover}},"object-size":{color:t.objectSize,borderRadius:me.objectSizeBorderRadius,fontStyle:me.objectSizeFontStyle,margin:me.objectSizeMargin,cursor:"default"},"data-type-label":{fontSize:me.dataTypeFontSize,marginRight:me.dataTypeMarginRight,opacity:me.datatypeOpacity},boolean:{display:"inline-block",color:t.dataTypes.boolean},date:{display:"inline-block",color:t.dataTypes.date},"date-value":{marginLeft:me.dateValueMarginLeft},float:{display:"inline-block",color:t.dataTypes.float},function:{display:"inline-block",color:t.dataTypes.function,cursor:"pointer",whiteSpace:"pre-line"},"function-value":{fontStyle:"italic"},integer:{display:"inline-block",color:t.dataTypes.integer},string:{display:"inline-block",color:t.dataTypes.string},nan:{display:"inline-block",color:t.dataTypes.nan,fontSize:me.nanFontSize,fontWeight:me.nanFontWeight,backgroundColor:t.dataTypes.background,padding:me.nanPadding,borderRadius:me.nanBorderRadius},null:{display:"inline-block",color:t.dataTypes.null,fontSize:me.nullFontSize,fontWeight:me.nullFontWeight,backgroundColor:t.dataTypes.background,padding:me.nullPadding,borderRadius:me.nullBorderRadius},undefined:{display:"inline-block",color:t.dataTypes.undefined,fontSize:me.undefinedFontSize,padding:me.undefinedPadding,borderRadius:me.undefinedBorderRadius,backgroundColor:t.dataTypes.background},regexp:{display:"inline-block",color:t.dataTypes.regexp},"copy-to-clipboard":{cursor:me.clipboardCursor},"copy-icon":{color:t.copyToClipboard,fontSize:me.iconFontSize,marginRight:me.iconMarginRight,verticalAlign:"top"},"copy-icon-copied":{color:t.copyToClipboardCheck,marginLeft:me.clipboardCheckMarginLeft},"array-group-meta-data":{display:"inline-block",padding:me.arrayGroupMetaPadding},"object-meta-data":{display:"inline-block",padding:me.metaDataPadding},"icon-container":{display:"inline-block",width:me.iconContainerWidth},tooltip:{padding:me.tooltipPadding},removeVarIcon:{verticalAlign:"top",display:"inline-block",color:t.editVariable.removeIcon,cursor:me.iconCursor,fontSize:me.iconFontSize,marginRight:me.iconMarginRight},addVarIcon:{verticalAlign:"top",display:"inline-block",color:t.editVariable.addIcon,cursor:me.iconCursor,fontSize:me.iconFontSize,marginRight:me.iconMarginRight},editVarIcon:{verticalAlign:"top",display:"inline-block",color:t.editVariable.editIcon,cursor:me.iconCursor,fontSize:me.iconFontSize,marginRight:me.iconMarginRight},"edit-icon-container":{display:"inline-block",verticalAlign:"top"},"check-icon":{display:"inline-block",cursor:me.iconCursor,color:t.editVariable.checkIcon,fontSize:me.iconFontSize,paddingRight:me.iconPaddingRight},"cancel-icon":{display:"inline-block",cursor:me.iconCursor,color:t.editVariable.cancelIcon,fontSize:me.iconFontSize,paddingRight:me.iconPaddingRight},"edit-input":{display:"inline-block",minHeight:me.editInputHeight,minWidth:me.editInputMinWidth,borderRadius:me.editInputBorderRadius,backgroundColor:t.editVariable.background,color:t.editVariable.color,padding:me.editInputPadding,marginRight:me.editInputMarginRight,fontFamily:me.editInputFontFamily},"detected-row":{paddingTop:me.detectedRowPaddingTop},"key-modal-request":{position:me.addKeyCoverPosition,top:me.addKeyCoverPositionPx,left:me.addKeyCoverPositionPx,right:me.addKeyCoverPositionPx,bottom:me.addKeyCoverPositionPx,backgroundColor:me.addKeyCoverBackground},"key-modal":{width:me.addKeyModalWidth,backgroundColor:t.addKeyModal.background,marginLeft:me.addKeyModalMargin,marginRight:me.addKeyModalMargin,padding:me.addKeyModalPadding,borderRadius:me.addKeyModalRadius,marginTop:"15px",position:"relative"},"key-modal-label":{color:t.addKeyModal.labelColor,marginLeft:"2px",marginBottom:"5px",fontSize:"11px"},"key-modal-input-container":{overflow:"hidden"},"key-modal-input":{width:"100%",padding:"3px 6px",fontFamily:"monospace",color:t.addKeyModal.color,border:"none",boxSizing:"border-box",borderRadius:"2px"},"key-modal-cancel":{backgroundColor:t.editVariable.removeIcon,position:"absolute",top:"0px",right:"0px",borderRadius:"0px 3px 0px 3px",cursor:"pointer"},"key-modal-cancel-icon":{color:t.addKeyModal.labelColor,fontSize:me.iconFontSize,transform:"rotate(45deg)"},"key-modal-submit":{color:t.editVariable.addIcon,fontSize:me.iconFontSize,position:"absolute",right:"2px",top:"3px",cursor:"pointer"},"function-ellipsis":{display:"inline-block",color:t.ellipsisColor,fontSize:me.ellipsisFontSize,lineHeight:me.ellipsisLineHeight,cursor:me.ellipsisCursor},"validation-failure":{float:"right",padding:"3px 6px",borderRadius:"2px",cursor:"pointer",color:t.validationFailure.fontColor,backgroundColor:t.validationFailure.background},"validation-failure-label":{marginRight:"6px"},"validation-failure-clear":{position:"relative",verticalAlign:"top",cursor:"pointer",color:t.validationFailure.iconColor,fontSize:me.iconFontSize,transform:"rotate(45deg)"}}};function Ee(e,t,n){return e||console.error("theme has not been set"),function(e){var t=be;return!1!==e&&"none"!==e||(t=ve),Object(ge.createStyling)(ye,{defaultBase16:t})(e)}(e)(t,n)}var xe=function(e){l(n,e);var t=h(n);function n(){return o(this,n),t.apply(this,arguments)}return s(n,[{key:"render",value:function(){var e=this.props,t=(e.rjvId,e.type_name),n=e.displayDataTypes,a=e.theme;return n?v.a.createElement("span",Object.assign({className:"data-type-label"},Ee(a,"data-type-label")),t):null}}]),n}(v.a.PureComponent),Se=function(e){l(n,e);var t=h(n);function n(){return o(this,n),t.apply(this,arguments)}return s(n,[{key:"render",value:function(){var e=this.props;return v.a.createElement("div",Ee(e.theme,"boolean"),v.a.createElement(xe,Object.assign({type_name:"bool"},e)),e.value?"true":"false")}}]),n}(v.a.PureComponent),Ce=function(e){l(n,e);var t=h(n);function n(){return o(this,n),t.apply(this,arguments)}return s(n,[{key:"render",value:function(){var e=this.props;return v.a.createElement("div",Ee(e.theme,"date"),v.a.createElement(xe,Object.assign({type_name:"date"},e)),v.a.createElement("span",Object.assign({className:"date-value"},Ee(e.theme,"date-value")),e.value.toLocaleTimeString("en-us",{weekday:"short",year:"numeric",month:"short",day:"numeric",hour:"2-digit",minute:"2-digit"})))}}]),n}(v.a.PureComponent),Oe=function(e){l(n,e);var t=h(n);function n(){return o(this,n),t.apply(this,arguments)}return s(n,[{key:"render",value:function(){var e=this.props;return v.a.createElement("div",Ee(e.theme,"float"),v.a.createElement(xe,Object.assign({type_name:"float"},e)),this.props.value)}}]),n}(v.a.PureComponent);function ke(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,a=new Array(t);n=e.length?{done:!0}:{done:!1,value:e[a++]}},e:function(e){throw e},f:r}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var o,i=!0,s=!1;return{s:function(){n=e[Symbol.iterator]()},n:function(){var e=n.next();return i=e.done,e},e:function(e){s=!0,o=e},f:function(){try{i||null==n.return||n.return()}finally{if(s)throw o}}}}function Ae(e){return function(e){if(Array.isArray(e))return ke(e)}(e)||function(e){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(e))return Array.from(e)}(e)||je(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}var _e=n(52),Fe=new(n(53).Dispatcher),De=new(function(e){l(n,e);var t=h(n);function n(){var e;o(this,n);for(var a=arguments.length,r=new Array(a),i=0;it&&(r.style.cursor="pointer",this.state.collapsed&&(a=v.a.createElement("span",null,a.substring(0,t),v.a.createElement("span",Ee(n,"ellipsis")," ...")))),v.a.createElement("div",Ee(n,"string"),v.a.createElement(xe,Object.assign({type_name:"string"},e)),v.a.createElement("span",Object.assign({className:"string-value"},r,{onClick:this.toggleCollapsed}),'"',a,'"'))}}]),n}(v.a.PureComponent),Le=function(e){l(n,e);var t=h(n);function n(){return o(this,n),t.apply(this,arguments)}return s(n,[{key:"render",value:function(){return v.a.createElement("div",Ee(this.props.theme,"undefined"),"undefined")}}]),n}(v.a.PureComponent);function Ve(){return(Ve=Object.assign||function(e){for(var t=1;t=0||(r[n]=e[n]);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(a=0;a=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(r[n]=e[n])}return r}(e,["inputRef","maxRows","minRows","onHeightChange","useCacheForDOMMeasurements"]));return t.style=Ve({},t.style,{height:this.state.height}),Math.max(t.style.maxHeight||1/0,this.state.maxHeight)0?o:null,namespace:r.splice(0,r.length-1),existing_value:i,variable_removed:!1,key_name:null};"object"===he(i)?Fe.dispatch({name:"ADD_VARIABLE_KEY_REQUEST",rjvId:s,data:e}):Fe.dispatch({name:"VARIABLE_ADDED",rjvId:s,data:y(y({},e),{},{new_value:[].concat(Ae(i),[null])})})}})))},e.getRemoveObject=function(t){var n=e.props,a=n.theme,r=(n.hover,n.namespace),o=n.name,i=n.src,s=n.rjvId;if(1!==r.length)return v.a.createElement("span",{className:"click-to-remove",style:{display:t?"inline-block":"none"}},v.a.createElement(ft,Object.assign({className:"click-to-remove-icon"},Ee(a,"removeVarIcon"),{onClick:function(){Fe.dispatch({name:"VARIABLE_REMOVED",rjvId:s,data:{name:o,namespace:r.splice(0,r.length-1),existing_value:i,variable_removed:!0}})}})))},e.render=function(){var t=e.props,n=t.theme,a=t.onDelete,r=t.onAdd,o=t.enableClipboard,i=t.src,s=t.namespace,u=t.rowHovered;return v.a.createElement("div",Object.assign({},Ee(n,"object-meta-data"),{className:"object-meta-data",onClick:function(e){e.stopPropagation()}}),e.getObjectSize(),o?v.a.createElement(yt,Object.assign({rowHovered:u,clickCallback:o},{src:i,theme:n,namespace:s})):null,!1!==r?e.getAddAttribute(u):null,!1!==a?e.getRemoveObject(u):null)},e}return n}(v.a.PureComponent);function St(e){var t=e.parent_type,n=e.namespace,a=e.quotesOnKeys,r=e.theme,o=e.jsvRoot,i=e.name,s=e.name?e.name:"";return!o||!1!==i&&null!==i?"array"==t?v.a.createElement("span",Object.assign({},Ee(r,"array-key"),{key:n}),v.a.createElement("span",{className:"array-key"},s),v.a.createElement("span",Ee(r,"colon"),":")):v.a.createElement("span",Object.assign({},Ee(r,"object-name"),{key:n}),v.a.createElement("span",{className:"object-key"},a&&v.a.createElement("span",{style:{verticalAlign:"top"}},'"'),v.a.createElement("span",null,s),a&&v.a.createElement("span",{style:{verticalAlign:"top"}},'"')),v.a.createElement("span",Ee(r,"colon"),":")):v.a.createElement("span",null)}function Ct(e){var t=e.theme;switch(e.iconStyle){case"triangle":return v.a.createElement(pt,Object.assign({},Ee(t,"expanded-icon"),{className:"expanded-icon"}));case"square":return v.a.createElement(ut,Object.assign({},Ee(t,"expanded-icon"),{className:"expanded-icon"}));default:return v.a.createElement(it,Object.assign({},Ee(t,"expanded-icon"),{className:"expanded-icon"}))}}function Ot(e){var t=e.theme;switch(e.iconStyle){case"triangle":return v.a.createElement(ct,Object.assign({},Ee(t,"collapsed-icon"),{className:"collapsed-icon"}));case"square":return v.a.createElement(lt,Object.assign({},Ee(t,"collapsed-icon"),{className:"collapsed-icon"}));default:return v.a.createElement(st,Object.assign({},Ee(t,"collapsed-icon"),{className:"collapsed-icon"}))}}var kt=function(e){l(n,e);var t=h(n);function n(e){var a;return o(this,n),(a=t.call(this,e)).toggleCollapsed=function(e){var t=[];for(var n in a.state.expanded)t.push(a.state.expanded[n]);t[e]=!t[e],a.setState({expanded:t})},a.state={expanded:[]},a}return s(n,[{key:"getExpandedIcon",value:function(e){var t=this.props,n=t.theme,a=t.iconStyle;return this.state.expanded[e]?v.a.createElement(Ct,{theme:n,iconStyle:a}):v.a.createElement(Ot,{theme:n,iconStyle:a})}},{key:"render",value:function(){var e=this,t=this.props,n=t.src,a=t.groupArraysAfterLength,r=(t.depth,t.name),o=t.theme,i=t.jsvRoot,s=t.namespace,u=(t.parent_type,fe(t,["src","groupArraysAfterLength","depth","name","theme","jsvRoot","namespace","parent_type"])),l=0,c=5*this.props.indentWidth;i||(l=5*this.props.indentWidth);var p=a,d=Math.ceil(n.length/p);return v.a.createElement("div",Object.assign({className:"object-key-val"},Ee(o,i?"jsv-root":"objectKeyVal",{paddingLeft:l})),v.a.createElement(St,this.props),v.a.createElement("span",null,v.a.createElement(xt,Object.assign({size:n.length},this.props))),Ae(Array(d)).map((function(t,a){return v.a.createElement("div",Object.assign({key:a,className:"object-key-val array-group"},Ee(o,"objectKeyVal",{marginLeft:6,paddingLeft:c})),v.a.createElement("span",Ee(o,"brace-row"),v.a.createElement("div",Object.assign({className:"icon-container"},Ee(o,"icon-container"),{onClick:function(t){e.toggleCollapsed(a)}}),e.getExpandedIcon(a)),e.state.expanded[a]?v.a.createElement(At,Object.assign({key:r+a,depth:0,name:!1,collapsed:!1,groupArraysAfterLength:p,index_offset:a*p,src:n.slice(a*p,a*p+p),namespace:s,type:"array",parent_type:"array_group",theme:o},u)):v.a.createElement("span",Object.assign({},Ee(o,"brace"),{onClick:function(t){e.toggleCollapsed(a)},className:"array-group-brace"}),"[",v.a.createElement("div",Object.assign({},Ee(o,"array-group-meta-data"),{className:"array-group-meta-data"}),v.a.createElement("span",Object.assign({className:"object-size"},Ee(o,"object-size")),a*p," - ",a*p+p>n.length?n.length:a*p+p)),"]")))})))}}]),n}(v.a.PureComponent),jt=function(e){l(n,e);var t=h(n);function n(e){var a;o(this,n),(a=t.call(this,e)).toggleCollapsed=function(){a.setState({expanded:!a.state.expanded},(function(){Me.set(a.props.rjvId,a.props.namespace,"expanded",a.state.expanded)}))},a.getObjectContent=function(e,t,n){return v.a.createElement("div",{className:"pushed-content object-container"},v.a.createElement("div",Object.assign({className:"object-content"},Ee(a.props.theme,"pushed-content")),a.renderObjectContents(t,n)))},a.getEllipsis=function(){return 0===a.state.size?null:v.a.createElement("div",Object.assign({},Ee(a.props.theme,"ellipsis"),{className:"node-ellipsis",onClick:a.toggleCollapsed}),"...")},a.getObjectMetaData=function(e){var t=a.props,n=(t.rjvId,t.theme,a.state),r=n.size,o=n.hovered;return v.a.createElement(xt,Object.assign({rowHovered:o,size:r},a.props))},a.renderObjectContents=function(e,t){var n,r=a.props,o=r.depth,i=r.parent_type,s=r.index_offset,u=r.groupArraysAfterLength,l=r.namespace,c=a.state.object_type,p=[],d=Object.keys(e||{});return a.props.sortKeys&&(d=d.sort()),d.forEach((function(r){if(n=new wt(r,e[r]),"array_group"===i&&s&&(n.name=parseInt(n.name)+s),e.hasOwnProperty(r))if("object"===n.type)p.push(v.a.createElement(At,Object.assign({key:n.name,depth:o+1,name:n.name,src:n.value,namespace:l.concat(n.name),parent_type:c},t)));else if("array"===n.type){var d=At;u&&n.value.length>u&&(d=kt),p.push(v.a.createElement(d,Object.assign({key:n.name,depth:o+1,name:n.name,src:n.value,namespace:l.concat(n.name),type:"array",parent_type:c},t)))}else p.push(v.a.createElement(Et,Object.assign({key:n.name+"_"+l,variable:n,singleIndent:5,namespace:l,type:a.props.type},t)))})),p};var r=n.getState(e);return a.state=y(y({},r),{},{prevProps:{}}),a}return s(n,[{key:"getBraceStart",value:function(e,t){var n=this,a=this.props,r=a.src,o=a.theme,i=a.iconStyle;if("array_group"===a.parent_type)return v.a.createElement("span",null,v.a.createElement("span",Ee(o,"brace"),"array"===e?"[":"{"),t?this.getObjectMetaData(r):null);var s=t?Ct:Ot;return v.a.createElement("span",null,v.a.createElement("span",Object.assign({onClick:function(e){n.toggleCollapsed()}},Ee(o,"brace-row")),v.a.createElement("div",Object.assign({className:"icon-container"},Ee(o,"icon-container")),v.a.createElement(s,{theme:o,iconStyle:i})),v.a.createElement(St,this.props),v.a.createElement("span",Ee(o,"brace"),"array"===e?"[":"{")),t?this.getObjectMetaData(r):null)}},{key:"render",value:function(){var e=this,t=this.props,n=t.depth,a=t.src,r=(t.namespace,t.name,t.type,t.parent_type),o=t.theme,i=t.jsvRoot,s=t.iconStyle,u=fe(t,["depth","src","namespace","name","type","parent_type","theme","jsvRoot","iconStyle"]),l=this.state,c=l.object_type,p=l.expanded,d={};return i||"array_group"===r?"array_group"===r&&(d.borderLeft=0,d.display="inline"):d.paddingLeft=5*this.props.indentWidth,v.a.createElement("div",Object.assign({className:"object-key-val",onMouseEnter:function(){return e.setState(y(y({},e.state),{},{hovered:!0}))},onMouseLeave:function(){return e.setState(y(y({},e.state),{},{hovered:!1}))}},Ee(o,i?"jsv-root":"objectKeyVal",d)),this.getBraceStart(c,p),p?this.getObjectContent(n,a,y({theme:o,iconStyle:s},u)):this.getEllipsis(),v.a.createElement("span",{className:"brace-row"},v.a.createElement("span",{style:y(y({},Ee(o,"brace").style),{},{paddingLeft:p?"3px":"0px"})},"array"===c?"]":"}"),p?null:this.getObjectMetaData(a)))}}],[{key:"getDerivedStateFromProps",value:function(e,t){var a=t.prevProps;return e.src!==a.src||e.collapsed!==a.collapsed||e.name!==a.name||e.namespace!==a.namespace||e.rjvId!==a.rjvId?y(y({},n.getState(e)),{},{prevProps:e}):null}}]),n}(v.a.PureComponent);jt.getState=function(e){var t=Object.keys(e.src).length,n=(!1===e.collapsed||!0!==e.collapsed&&e.collapsed>e.depth)&&(!e.shouldCollapse||!1===e.shouldCollapse({name:e.name,src:e.src,type:he(e.src),namespace:e.namespace}))&&0!==t;return{expanded:Me.get(e.rjvId,e.namespace,"expanded",n),object_type:"array"===e.type?"array":"object",parent_type:"array"===e.type?"array":"object",size:t,hovered:!1}};var wt=function e(t,n){o(this,e),this.name=t,this.value=n,this.type=he(n)};de(jt);var At=jt,_t=function(e){l(n,e);var t=h(n);function n(){var e;o(this,n);for(var a=arguments.length,r=new Array(a),i=0;it.groupArraysAfterLength&&(a=kt),v.a.createElement("div",{className:"pretty-json-container object-container"},v.a.createElement("div",{className:"object-content"},v.a.createElement(a,Object.assign({namespace:n,depth:0,jsvRoot:!0},t))))},e}return n}(v.a.PureComponent),Ft=function(e){l(n,e);var t=h(n);function n(e){var a;return o(this,n),(a=t.call(this,e)).closeModal=function(){Fe.dispatch({rjvId:a.props.rjvId,name:"RESET"})},a.submit=function(){a.props.submit(a.state.input)},a.state={input:e.input?e.input:""},a}return s(n,[{key:"render",value:function(){var e=this,t=this.props,n=t.theme,a=t.rjvId,r=t.isValid,o=this.state.input,i=r(o);return v.a.createElement("div",Object.assign({className:"key-modal-request"},Ee(n,"key-modal-request"),{onClick:this.closeModal}),v.a.createElement("div",Object.assign({},Ee(n,"key-modal"),{onClick:function(e){e.stopPropagation()}}),v.a.createElement("div",Ee(n,"key-modal-label"),"Key Name:"),v.a.createElement("div",{style:{position:"relative"}},v.a.createElement("input",Object.assign({},Ee(n,"key-modal-input"),{className:"key-modal-input",ref:function(e){return e&&e.focus()},spellCheck:!1,value:o,placeholder:"...",onChange:function(t){e.setState({input:t.target.value})},onKeyPress:function(t){i&&"Enter"===t.key?e.submit():"Escape"===t.key&&e.closeModal()}})),i?v.a.createElement(mt,Object.assign({},Ee(n,"key-modal-submit"),{className:"key-modal-submit",onClick:function(t){return e.submit()}})):null),v.a.createElement("span",Ee(n,"key-modal-cancel"),v.a.createElement(bt,Object.assign({},Ee(n,"key-modal-cancel-icon"),{className:"key-modal-cancel",onClick:function(){Fe.dispatch({rjvId:a,name:"RESET"})}})))))}}]),n}(v.a.PureComponent),Dt=function(e){l(n,e);var t=h(n);function n(){var e;o(this,n);for(var a=arguments.length,r=new Array(a),i=0;is||id.bottom?c.scrollTop=l.offsetTop+l.clientHeight-c.offsetHeight:p.topt.offsetHeight&&t.scrollHeight-t.offsetHeight-t.scrollTop<=0&&this.props.onMenuScrollToBottom()}}},{key:"getOptionLabel",value:function(e){return e[this.props.labelKey]}},{key:"getValueArray",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:void 0,n="object"===(void 0===t?"undefined":I(t))?t:this.props;if(n.multi){if("string"==typeof e&&(e=e.split(n.delimiter)),!Array.isArray(e)){if(null==e)return[];e=[e]}return e.map((function(e){return Y(e,n)})).filter((function(e){return e}))}var a=Y(e,n);return a?[a]:[]}},{key:"setValue",value:function(e){var t=this;if(this.props.autoBlur&&this.blurInput(),this.props.required){var n=J(e,this.props.multi);this.setState({required:n})}this.props.simpleValue&&e&&(e=this.props.multi?e.map((function(e){return e[t.props.valueKey]})).join(this.props.delimiter):e[this.props.valueKey]),this.props.onChange&&this.props.onChange(e)}},{key:"selectValue",value:function(e){var t=this;this.props.closeOnSelect&&(this.hasScrolledToOption=!1);var n=this.props.onSelectResetsInput?"":this.state.inputValue;this.props.multi?this.setState({focusedIndex:null,inputValue:this.handleInputValueChange(n),isOpen:!this.props.closeOnSelect},(function(){t.getValueArray(t.props.value).some((function(n){return n[t.props.valueKey]===e[t.props.valueKey]}))?t.removeValue(e):t.addValue(e)})):this.setState({inputValue:this.handleInputValueChange(n),isOpen:!this.props.closeOnSelect,isPseudoFocused:this.state.isFocused},(function(){t.setValue(e)}))}},{key:"addValue",value:function(e){var t=this.getValueArray(this.props.value),n=this._visibleOptions.filter((function(e){return!e.disabled})),a=n.indexOf(e);this.setValue(t.concat(e)),this.props.closeOnSelect&&(n.length-1===a?this.focusOption(n[a-1]):n.length>a&&this.focusOption(n[a+1]))}},{key:"popValue",value:function(){var e=this.getValueArray(this.props.value);e.length&&!1!==e[e.length-1].clearableValue&&this.setValue(this.props.multi?e.slice(0,e.length-1):null)}},{key:"removeValue",value:function(e){var t=this,n=this.getValueArray(this.props.value);this.setValue(n.filter((function(n){return n[t.props.valueKey]!==e[t.props.valueKey]}))),this.focus()}},{key:"clearValue",value:function(e){e&&"mousedown"===e.type&&0!==e.button||(e.preventDefault(),this.setValue(this.getResetValue()),this.setState({inputValue:this.handleInputValueChange(""),isOpen:!1},this.focus),this._focusAfterClear=!0)}},{key:"getResetValue",value:function(){return void 0!==this.props.resetValue?this.props.resetValue:this.props.multi?[]:null}},{key:"focusOption",value:function(e){this.setState({focusedOption:e})}},{key:"focusNextOption",value:function(){this.focusAdjacentOption("next")}},{key:"focusPreviousOption",value:function(){this.focusAdjacentOption("previous")}},{key:"focusPageUpOption",value:function(){this.focusAdjacentOption("page_up")}},{key:"focusPageDownOption",value:function(){this.focusAdjacentOption("page_down")}},{key:"focusStartOption",value:function(){this.focusAdjacentOption("start")}},{key:"focusEndOption",value:function(){this.focusAdjacentOption("end")}},{key:"focusAdjacentOption",value:function(e){var t=this._visibleOptions.map((function(e,t){return{option:e,index:t}})).filter((function(e){return!e.option.disabled}));if(this._scrollToFocusedOptionOnUpdate=!0,!this.state.isOpen){var n={focusedOption:this._focusedOption||(t.length?t["next"===e?0:t.length-1].option:null),isOpen:!0};return this.props.onSelectResetsInput&&(n.inputValue=""),void this.setState(n)}if(t.length){for(var a=-1,r=0;r0?a-=1:a=t.length-1;else if("start"===e)a=0;else if("end"===e)a=t.length-1;else if("page_up"===e){var o=a-this.props.pageSize;a=o<0?0:o}else if("page_down"===e){var i=a+this.props.pageSize;a=i>t.length-1?t.length-1:i}-1===a&&(a=0),this.setState({focusedIndex:t[a].index,focusedOption:t[a].option})}}},{key:"getFocusedOption",value:function(){return this._focusedOption}},{key:"selectFocusedOption",value:function(){if(this._focusedOption)return this.selectValue(this._focusedOption)}},{key:"renderLoading",value:function(){if(this.props.isLoading)return v.a.createElement("span",{className:"Select-loading-zone","aria-hidden":"true"},v.a.createElement("span",{className:"Select-loading"}))}},{key:"renderValue",value:function(e,t){var n=this,a=this.props.valueRenderer||this.getOptionLabel,r=this.props.valueComponent;if(!e.length)return function(e,t,n){var a=e.inputValue,r=e.isPseudoFocused,o=e.isFocused,i=t.onSelectResetsInput;return!a||!i&&!n&&!r&&!o}(this.state,this.props,t)?v.a.createElement("div",{className:"Select-placeholder"},this.props.placeholder):null;var o,i,s,u,l,c,p=this.props.onValueClick?this.handleValueClick:null;return this.props.multi?e.map((function(t,o){return v.a.createElement(r,{disabled:n.props.disabled||!1===t.clearableValue,id:n._instancePrefix+"-value-"+o,instancePrefix:n._instancePrefix,key:"value-"+o+"-"+t[n.props.valueKey],onClick:p,onRemove:n.removeValue,placeholder:n.props.placeholder,value:t,values:e},a(t,o),v.a.createElement("span",{className:"Select-aria-only"}," "))})):(o=this.state,i=this.props,s=o.inputValue,u=o.isPseudoFocused,l=o.isFocused,c=i.onSelectResetsInput,s&&(c||!l&&u||l&&!u)?void 0:(t&&(p=null),v.a.createElement(r,{disabled:this.props.disabled,id:this._instancePrefix+"-value-item",instancePrefix:this._instancePrefix,onClick:p,placeholder:this.props.placeholder,value:e[0]},a(e[0]))))}},{key:"renderInput",value:function(e,t){var n,a=this,r=C()("Select-input",this.props.inputProps.className),o=this.state.isOpen,i=C()((T(n={},this._instancePrefix+"-list",o),T(n,this._instancePrefix+"-backspace-remove-message",this.props.multi&&!this.props.disabled&&this.state.isFocused&&!this.state.inputValue),n)),s=this.state.inputValue;!s||this.props.onSelectResetsInput||this.state.isFocused||(s="");var u=R({},this.props.inputProps,{"aria-activedescendant":o?this._instancePrefix+"-option-"+t:this._instancePrefix+"-value","aria-describedby":this.props["aria-describedby"],"aria-expanded":""+o,"aria-haspopup":""+o,"aria-label":this.props["aria-label"],"aria-labelledby":this.props["aria-labelledby"],"aria-owns":i,onBlur:this.handleInputBlur,onChange:this.handleInputChange,onFocus:this.handleInputFocus,ref:function(e){return a.input=e},role:"combobox",required:this.state.required,tabIndex:this.props.tabIndex,value:s});if(this.props.inputRenderer)return this.props.inputRenderer(u);if(this.props.disabled||!this.props.searchable){var l=L(this.props.inputProps,[]),c=C()(T({},this._instancePrefix+"-list",o));return v.a.createElement("div",R({},l,{"aria-expanded":o,"aria-owns":c,"aria-activedescendant":o?this._instancePrefix+"-option-"+t:this._instancePrefix+"-value","aria-disabled":""+this.props.disabled,"aria-label":this.props["aria-label"],"aria-labelledby":this.props["aria-labelledby"],className:r,onBlur:this.handleInputBlur,onFocus:this.handleInputFocus,ref:function(e){return a.input=e},role:"combobox",style:{border:0,width:1,display:"inline-block"},tabIndex:this.props.tabIndex||0}))}return this.props.autosize?v.a.createElement(x.a,R({id:this.props.id},u,{className:r,minWidth:"5"})):v.a.createElement("div",{className:r,key:"input-wrap",style:{display:"inline-block"}},v.a.createElement("input",R({id:this.props.id},u)))}},{key:"renderClear",value:function(){var e=this.getValueArray(this.props.value);if(this.props.clearable&&e.length&&!this.props.disabled&&!this.props.isLoading){var t=this.props.multi?this.props.clearAllText:this.props.clearValueText,n=this.props.clearRenderer();return v.a.createElement("span",{"aria-label":t,className:"Select-clear-zone",onMouseDown:this.clearValue,onTouchEnd:this.handleTouchEndClearValue,onTouchMove:this.handleTouchMove,onTouchStart:this.handleTouchStart,title:t},n)}}},{key:"renderArrow",value:function(){if(this.props.arrowRenderer){var e=this.handleMouseDownOnArrow,t=this.state.isOpen,n=this.props.arrowRenderer({onMouseDown:e,isOpen:t});return n?v.a.createElement("span",{className:"Select-arrow-zone",onMouseDown:e},n):null}}},{key:"filterOptions",value:function(e){var t=this.state.inputValue,n=this.props.options||[];if(this.props.filterOptions){var a="function"==typeof this.props.filterOptions?this.props.filterOptions:F;return a(n,t,e,{filterOption:this.props.filterOption,ignoreAccents:this.props.ignoreAccents,ignoreCase:this.props.ignoreCase,labelKey:this.props.labelKey,matchPos:this.props.matchPos,matchProp:this.props.matchProp,trimFilter:this.props.trimFilter,valueKey:this.props.valueKey})}return n}},{key:"onOptionRef",value:function(e,t){t&&(this.focused=e)}},{key:"renderMenu",value:function(e,t,n){return e&&e.length?this.props.menuRenderer({focusedOption:n,focusOption:this.focusOption,inputValue:this.state.inputValue,instancePrefix:this._instancePrefix,labelKey:this.props.labelKey,onFocus:this.focusOption,onOptionRef:this.onOptionRef,onSelect:this.selectValue,optionClassName:this.props.optionClassName,optionComponent:this.props.optionComponent,optionRenderer:this.props.optionRenderer||this.getOptionLabel,options:e,removeValue:this.removeValue,selectValue:this.selectValue,valueArray:t,valueKey:this.props.valueKey}):this.props.noResultsText?v.a.createElement("div",{className:"Select-noresults"},this.props.noResultsText):null}},{key:"renderHiddenField",value:function(e){var t=this;if(this.props.name){if(this.props.joinValues){var n=e.map((function(e){return K(e[t.props.valueKey])})).join(this.props.delimiter);return v.a.createElement("input",{disabled:this.props.disabled,name:this.props.name,ref:function(e){return t.value=e},type:"hidden",value:n})}return e.map((function(e,n){return v.a.createElement("input",{disabled:t.props.disabled,key:"hidden."+n,name:t.props.name,ref:"value"+n,type:"hidden",value:K(e[t.props.valueKey])})}))}}},{key:"getFocusableOptionIndex",value:function(e){var t=this._visibleOptions;if(!t.length)return null;var n=this.props.valueKey,a=this.state.focusedOption||e;if(a&&!a.disabled){var r=-1;if(t.some((function(e,t){var o=e[n]===a[n];return o&&(r=t),o})),-1!==r)return r}for(var o=0;o=0||(r[n]=e[n]);return r}(e,t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(a=0;a=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(r[n]=e[n])}return r}function he(e){var t=function(e){return{}.toString.call(e).match(/\s([a-zA-Z]+)/)[1].toLowerCase()}(e);return"number"===t&&(t=isNaN(e)?"nan":(0|e)!=e?"float":"integer"),t}le.__suppressDeprecationWarning=!0,ce.__suppressDeprecationWarning=!0,pe.__suppressDeprecationWarning=!0;var be={scheme:"rjv-default",author:"mac gainor",base00:"rgba(0, 0, 0, 0)",base01:"rgb(245, 245, 245)",base02:"rgb(235, 235, 235)",base03:"#93a1a1",base04:"rgba(0, 0, 0, 0.3)",base05:"#586e75",base06:"#073642",base07:"#002b36",base08:"#d33682",base09:"#cb4b16",base0A:"#dc322f",base0B:"#859900",base0C:"#6c71c4",base0D:"#586e75",base0E:"#2aa198",base0F:"#268bd2"},ve={scheme:"rjv-grey",author:"mac gainor",base00:"rgba(1, 1, 1, 0)",base01:"rgba(1, 1, 1, 0.1)",base02:"rgba(0, 0, 0, 0.2)",base03:"rgba(1, 1, 1, 0.3)",base04:"rgba(0, 0, 0, 0.4)",base05:"rgba(1, 1, 1, 0.5)",base06:"rgba(1, 1, 1, 0.6)",base07:"rgba(1, 1, 1, 0.7)",base08:"rgba(1, 1, 1, 0.8)",base09:"rgba(1, 1, 1, 0.8)",base0A:"rgba(1, 1, 1, 0.8)",base0B:"rgba(1, 1, 1, 0.8)",base0C:"rgba(1, 1, 1, 0.8)",base0D:"rgba(1, 1, 1, 0.8)",base0E:"rgba(1, 1, 1, 0.8)",base0F:"rgba(1, 1, 1, 0.8)"},me={white:"#fff",black:"#000",transparent:"rgba(1, 1, 1, 0)",globalFontFamily:"monospace",globalCursor:"default",indentBlockWidth:"5px",braceFontWeight:"bold",braceCursor:"pointer",ellipsisFontSize:"18px",ellipsisLineHeight:"10px",ellipsisCursor:"pointer",keyMargin:"0px 5px",keyLetterSpacing:"0.5px",keyFontStyle:"none",keyBorderRadius:"3px",keyColonWeight:"bold",keyVerticalAlign:"top",keyOpacity:"0.85",keyOpacityHover:"1",keyValPaddingTop:"3px",keyValPaddingBottom:"3px",keyValPaddingRight:"5px",keyValBorderLeft:"1px solid",keyValBorderHover:"2px solid",keyValPaddingHover:"3px 5px 3px 4px",pushedContentMarginLeft:"6px",variableValuePaddingRight:"6px",nullFontSize:"11px",nullFontWeight:"bold",nullPadding:"1px 2px",nullBorderRadius:"3px",nanFontSize:"11px",nanFontWeight:"bold",nanPadding:"1px 2px",nanBorderRadius:"3px",undefinedFontSize:"11px",undefinedFontWeight:"bold",undefinedPadding:"1px 2px",undefinedBorderRadius:"3px",dataTypeFontSize:"11px",dataTypeMarginRight:"4px",datatypeOpacity:"0.8",objectSizeBorderRadius:"3px",objectSizeFontStyle:"italic",objectSizeMargin:"0px 6px 0px 0px",clipboardCursor:"pointer",clipboardCheckMarginLeft:"-12px",metaDataPadding:"0px 0px 0px 10px",arrayGroupMetaPadding:"0px 0px 0px 4px",iconContainerWidth:"17px",tooltipPadding:"4px",editInputHeight:"25px",editInputMinWidth:"130px",editInputBorderRadius:"2px",editInputPadding:"5px",editInputMarginRight:"4px",editInputFontFamily:"monospace",iconCursor:"pointer",iconFontSize:"15px",iconPaddingRight:"1px",dateValueMarginLeft:"2px",iconMarginRight:"3px",detectedRowPaddingTop:"3px",addKeyCoverBackground:"rgba(255, 255, 255, 0.3)",addKeyCoverPosition:"absolute",addKeyCoverPositionPx:"0px",addKeyModalWidth:"200px",addKeyModalMargin:"auto",addKeyModalPadding:"10px",addKeyModalRadius:"3px"},ge=n(51),ye=function(e){var t=function(e){return{backgroundColor:e.base00,ellipsisColor:e.base09,braceColor:e.base07,expandedIcon:e.base0D,collapsedIcon:e.base0E,keyColor:e.base07,arrayKeyColor:e.base0C,objectSize:e.base04,copyToClipboard:e.base0F,copyToClipboardCheck:e.base0D,objectBorder:e.base02,dataTypes:{boolean:e.base0E,date:e.base0D,float:e.base0B,function:e.base0D,integer:e.base0F,string:e.base09,nan:e.base08,null:e.base0A,undefined:e.base05,regexp:e.base0A,background:e.base02},editVariable:{editIcon:e.base0E,cancelIcon:e.base09,removeIcon:e.base09,addIcon:e.base0E,checkIcon:e.base0E,background:e.base01,color:e.base0A,border:e.base07},addKeyModal:{background:e.base05,border:e.base04,color:e.base0A,labelColor:e.base01},validationFailure:{background:e.base09,iconColor:e.base01,fontColor:e.base01}}}(e);return{"app-container":{fontFamily:me.globalFontFamily,cursor:me.globalCursor,backgroundColor:t.backgroundColor,position:"relative"},ellipsis:{display:"inline-block",color:t.ellipsisColor,fontSize:me.ellipsisFontSize,lineHeight:me.ellipsisLineHeight,cursor:me.ellipsisCursor},"brace-row":{display:"inline-block",cursor:"pointer"},brace:{display:"inline-block",cursor:me.braceCursor,fontWeight:me.braceFontWeight,color:t.braceColor},"expanded-icon":{color:t.expandedIcon},"collapsed-icon":{color:t.collapsedIcon},colon:{display:"inline-block",margin:me.keyMargin,color:t.keyColor,verticalAlign:"top"},objectKeyVal:function(e,n){return{style:y({paddingTop:me.keyValPaddingTop,paddingRight:me.keyValPaddingRight,paddingBottom:me.keyValPaddingBottom,borderLeft:me.keyValBorderLeft+" "+t.objectBorder,":hover":{paddingLeft:n.paddingLeft-1+"px",borderLeft:me.keyValBorderHover+" "+t.objectBorder}},n)}},"object-key-val-no-border":{padding:me.keyValPadding},"pushed-content":{marginLeft:me.pushedContentMarginLeft},variableValue:function(e,t){return{style:y({display:"inline-block",paddingRight:me.variableValuePaddingRight,position:"relative"},t)}},"object-name":{display:"inline-block",color:t.keyColor,letterSpacing:me.keyLetterSpacing,fontStyle:me.keyFontStyle,verticalAlign:me.keyVerticalAlign,opacity:me.keyOpacity,":hover":{opacity:me.keyOpacityHover}},"array-key":{display:"inline-block",color:t.arrayKeyColor,letterSpacing:me.keyLetterSpacing,fontStyle:me.keyFontStyle,verticalAlign:me.keyVerticalAlign,opacity:me.keyOpacity,":hover":{opacity:me.keyOpacityHover}},"object-size":{color:t.objectSize,borderRadius:me.objectSizeBorderRadius,fontStyle:me.objectSizeFontStyle,margin:me.objectSizeMargin,cursor:"default"},"data-type-label":{fontSize:me.dataTypeFontSize,marginRight:me.dataTypeMarginRight,opacity:me.datatypeOpacity},boolean:{display:"inline-block",color:t.dataTypes.boolean},date:{display:"inline-block",color:t.dataTypes.date},"date-value":{marginLeft:me.dateValueMarginLeft},float:{display:"inline-block",color:t.dataTypes.float},function:{display:"inline-block",color:t.dataTypes.function,cursor:"pointer",whiteSpace:"pre-line"},"function-value":{fontStyle:"italic"},integer:{display:"inline-block",color:t.dataTypes.integer},string:{display:"inline-block",color:t.dataTypes.string},nan:{display:"inline-block",color:t.dataTypes.nan,fontSize:me.nanFontSize,fontWeight:me.nanFontWeight,backgroundColor:t.dataTypes.background,padding:me.nanPadding,borderRadius:me.nanBorderRadius},null:{display:"inline-block",color:t.dataTypes.null,fontSize:me.nullFontSize,fontWeight:me.nullFontWeight,backgroundColor:t.dataTypes.background,padding:me.nullPadding,borderRadius:me.nullBorderRadius},undefined:{display:"inline-block",color:t.dataTypes.undefined,fontSize:me.undefinedFontSize,padding:me.undefinedPadding,borderRadius:me.undefinedBorderRadius,backgroundColor:t.dataTypes.background},regexp:{display:"inline-block",color:t.dataTypes.regexp},"copy-to-clipboard":{cursor:me.clipboardCursor},"copy-icon":{color:t.copyToClipboard,fontSize:me.iconFontSize,marginRight:me.iconMarginRight,verticalAlign:"top"},"copy-icon-copied":{color:t.copyToClipboardCheck,marginLeft:me.clipboardCheckMarginLeft},"array-group-meta-data":{display:"inline-block",padding:me.arrayGroupMetaPadding},"object-meta-data":{display:"inline-block",padding:me.metaDataPadding},"icon-container":{display:"inline-block",width:me.iconContainerWidth},tooltip:{padding:me.tooltipPadding},removeVarIcon:{verticalAlign:"top",display:"inline-block",color:t.editVariable.removeIcon,cursor:me.iconCursor,fontSize:me.iconFontSize,marginRight:me.iconMarginRight},addVarIcon:{verticalAlign:"top",display:"inline-block",color:t.editVariable.addIcon,cursor:me.iconCursor,fontSize:me.iconFontSize,marginRight:me.iconMarginRight},editVarIcon:{verticalAlign:"top",display:"inline-block",color:t.editVariable.editIcon,cursor:me.iconCursor,fontSize:me.iconFontSize,marginRight:me.iconMarginRight},"edit-icon-container":{display:"inline-block",verticalAlign:"top"},"check-icon":{display:"inline-block",cursor:me.iconCursor,color:t.editVariable.checkIcon,fontSize:me.iconFontSize,paddingRight:me.iconPaddingRight},"cancel-icon":{display:"inline-block",cursor:me.iconCursor,color:t.editVariable.cancelIcon,fontSize:me.iconFontSize,paddingRight:me.iconPaddingRight},"edit-input":{display:"inline-block",minHeight:me.editInputHeight,minWidth:me.editInputMinWidth,borderRadius:me.editInputBorderRadius,backgroundColor:t.editVariable.background,color:t.editVariable.color,padding:me.editInputPadding,marginRight:me.editInputMarginRight,fontFamily:me.editInputFontFamily},"detected-row":{paddingTop:me.detectedRowPaddingTop},"key-modal-request":{position:me.addKeyCoverPosition,top:me.addKeyCoverPositionPx,left:me.addKeyCoverPositionPx,right:me.addKeyCoverPositionPx,bottom:me.addKeyCoverPositionPx,backgroundColor:me.addKeyCoverBackground},"key-modal":{width:me.addKeyModalWidth,backgroundColor:t.addKeyModal.background,marginLeft:me.addKeyModalMargin,marginRight:me.addKeyModalMargin,padding:me.addKeyModalPadding,borderRadius:me.addKeyModalRadius,marginTop:"15px",position:"relative"},"key-modal-label":{color:t.addKeyModal.labelColor,marginLeft:"2px",marginBottom:"5px",fontSize:"11px"},"key-modal-input-container":{overflow:"hidden"},"key-modal-input":{width:"100%",padding:"3px 6px",fontFamily:"monospace",color:t.addKeyModal.color,border:"none",boxSizing:"border-box",borderRadius:"2px"},"key-modal-cancel":{backgroundColor:t.editVariable.removeIcon,position:"absolute",top:"0px",right:"0px",borderRadius:"0px 3px 0px 3px",cursor:"pointer"},"key-modal-cancel-icon":{color:t.addKeyModal.labelColor,fontSize:me.iconFontSize,transform:"rotate(45deg)"},"key-modal-submit":{color:t.editVariable.addIcon,fontSize:me.iconFontSize,position:"absolute",right:"2px",top:"3px",cursor:"pointer"},"function-ellipsis":{display:"inline-block",color:t.ellipsisColor,fontSize:me.ellipsisFontSize,lineHeight:me.ellipsisLineHeight,cursor:me.ellipsisCursor},"validation-failure":{float:"right",padding:"3px 6px",borderRadius:"2px",cursor:"pointer",color:t.validationFailure.fontColor,backgroundColor:t.validationFailure.background},"validation-failure-label":{marginRight:"6px"},"validation-failure-clear":{position:"relative",verticalAlign:"top",cursor:"pointer",color:t.validationFailure.iconColor,fontSize:me.iconFontSize,transform:"rotate(45deg)"}}};function Ee(e,t,n){return e||console.error("theme has not been set"),function(e){var t=be;return!1!==e&&"none"!==e||(t=ve),Object(ge.createStyling)(ye,{defaultBase16:t})(e)}(e)(t,n)}var xe=function(e){l(n,e);var t=h(n);function n(){return o(this,n),t.apply(this,arguments)}return s(n,[{key:"render",value:function(){var e=this.props,t=(e.rjvId,e.type_name),n=e.displayDataTypes,a=e.theme;return n?v.a.createElement("span",Object.assign({className:"data-type-label"},Ee(a,"data-type-label")),t):null}}]),n}(v.a.PureComponent),Se=function(e){l(n,e);var t=h(n);function n(){return o(this,n),t.apply(this,arguments)}return s(n,[{key:"render",value:function(){var e=this.props;return v.a.createElement("div",Ee(e.theme,"boolean"),v.a.createElement(xe,Object.assign({type_name:"bool"},e)),e.value?"true":"false")}}]),n}(v.a.PureComponent),Ce=function(e){l(n,e);var t=h(n);function n(){return o(this,n),t.apply(this,arguments)}return s(n,[{key:"render",value:function(){var e=this.props;return v.a.createElement("div",Ee(e.theme,"date"),v.a.createElement(xe,Object.assign({type_name:"date"},e)),v.a.createElement("span",Object.assign({className:"date-value"},Ee(e.theme,"date-value")),e.value.toLocaleTimeString("en-us",{weekday:"short",year:"numeric",month:"short",day:"numeric",hour:"2-digit",minute:"2-digit"})))}}]),n}(v.a.PureComponent),Oe=function(e){l(n,e);var t=h(n);function n(){return o(this,n),t.apply(this,arguments)}return s(n,[{key:"render",value:function(){var e=this.props;return v.a.createElement("div",Ee(e.theme,"float"),v.a.createElement(xe,Object.assign({type_name:"float"},e)),this.props.value)}}]),n}(v.a.PureComponent);function ke(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,a=new Array(t);n=e.length?{done:!0}:{done:!1,value:e[a++]}},e:function(e){throw e},f:r}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var o,i=!0,s=!1;return{s:function(){n=e[Symbol.iterator]()},n:function(){var e=n.next();return i=e.done,e},e:function(e){s=!0,o=e},f:function(){try{i||null==n.return||n.return()}finally{if(s)throw o}}}}function Ae(e){return function(e){if(Array.isArray(e))return ke(e)}(e)||function(e){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(e))return Array.from(e)}(e)||je(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}var _e=n(52),Fe=new(n(53).Dispatcher),De=new(function(e){l(n,e);var t=h(n);function n(){var e;o(this,n);for(var a=arguments.length,r=new Array(a),i=0;it&&(r.style.cursor="pointer",this.state.collapsed&&(a=v.a.createElement("span",null,a.substring(0,t),v.a.createElement("span",Ee(n,"ellipsis")," ...")))),v.a.createElement("div",Ee(n,"string"),v.a.createElement(xe,Object.assign({type_name:"string"},e)),v.a.createElement("span",Object.assign({className:"string-value"},r,{onClick:this.toggleCollapsed}),'"',a,'"'))}}]),n}(v.a.PureComponent),Le=function(e){l(n,e);var t=h(n);function n(){return o(this,n),t.apply(this,arguments)}return s(n,[{key:"render",value:function(){return v.a.createElement("div",Ee(this.props.theme,"undefined"),"undefined")}}]),n}(v.a.PureComponent);function Ve(){return(Ve=Object.assign||function(e){for(var t=1;t=0||(r[n]=e[n]);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(a=0;a=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(r[n]=e[n])}return r}(e,["inputRef","maxRows","minRows","onHeightChange","useCacheForDOMMeasurements"]));return t.style=Ve({},t.style,{height:this.state.height}),Math.max(t.style.maxHeight||1/0,this.state.maxHeight)0?o:null,namespace:r.splice(0,r.length-1),existing_value:i,variable_removed:!1,key_name:null};"object"===he(i)?Fe.dispatch({name:"ADD_VARIABLE_KEY_REQUEST",rjvId:s,data:e}):Fe.dispatch({name:"VARIABLE_ADDED",rjvId:s,data:y(y({},e),{},{new_value:[].concat(Ae(i),[null])})})}})))},e.getRemoveObject=function(t){var n=e.props,a=n.theme,r=(n.hover,n.namespace),o=n.name,i=n.src,s=n.rjvId;if(1!==r.length)return v.a.createElement("span",{className:"click-to-remove",style:{display:t?"inline-block":"none"}},v.a.createElement(ft,Object.assign({className:"click-to-remove-icon"},Ee(a,"removeVarIcon"),{onClick:function(){Fe.dispatch({name:"VARIABLE_REMOVED",rjvId:s,data:{name:o,namespace:r.splice(0,r.length-1),existing_value:i,variable_removed:!0}})}})))},e.render=function(){var t=e.props,n=t.theme,a=t.onDelete,r=t.onAdd,o=t.enableClipboard,i=t.src,s=t.namespace,u=t.rowHovered;return v.a.createElement("div",Object.assign({},Ee(n,"object-meta-data"),{className:"object-meta-data",onClick:function(e){e.stopPropagation()}}),e.getObjectSize(),o?v.a.createElement(yt,Object.assign({rowHovered:u,clickCallback:o},{src:i,theme:n,namespace:s})):null,!1!==r?e.getAddAttribute(u):null,!1!==a?e.getRemoveObject(u):null)},e}return n}(v.a.PureComponent);function St(e){var t=e.parent_type,n=e.namespace,a=e.quotesOnKeys,r=e.theme,o=e.jsvRoot,i=e.name,s=e.name?e.name:"";return!o||!1!==i&&null!==i?"array"==t?v.a.createElement("span",Object.assign({},Ee(r,"array-key"),{key:n}),v.a.createElement("span",{className:"array-key"},s),v.a.createElement("span",Ee(r,"colon"),":")):v.a.createElement("span",Object.assign({},Ee(r,"object-name"),{key:n}),v.a.createElement("span",{className:"object-key"},a&&v.a.createElement("span",{style:{verticalAlign:"top"}},'"'),v.a.createElement("span",null,s),a&&v.a.createElement("span",{style:{verticalAlign:"top"}},'"')),v.a.createElement("span",Ee(r,"colon"),":")):v.a.createElement("span",null)}function Ct(e){var t=e.theme;switch(e.iconStyle){case"triangle":return v.a.createElement(pt,Object.assign({},Ee(t,"expanded-icon"),{className:"expanded-icon"}));case"square":return v.a.createElement(ut,Object.assign({},Ee(t,"expanded-icon"),{className:"expanded-icon"}));default:return v.a.createElement(it,Object.assign({},Ee(t,"expanded-icon"),{className:"expanded-icon"}))}}function Ot(e){var t=e.theme;switch(e.iconStyle){case"triangle":return v.a.createElement(ct,Object.assign({},Ee(t,"collapsed-icon"),{className:"collapsed-icon"}));case"square":return v.a.createElement(lt,Object.assign({},Ee(t,"collapsed-icon"),{className:"collapsed-icon"}));default:return v.a.createElement(st,Object.assign({},Ee(t,"collapsed-icon"),{className:"collapsed-icon"}))}}var kt=function(e){l(n,e);var t=h(n);function n(e){var a;return o(this,n),(a=t.call(this,e)).toggleCollapsed=function(e){var t=[];for(var n in a.state.expanded)t.push(a.state.expanded[n]);t[e]=!t[e],a.setState({expanded:t})},a.state={expanded:[]},a}return s(n,[{key:"getExpandedIcon",value:function(e){var t=this.props,n=t.theme,a=t.iconStyle;return this.state.expanded[e]?v.a.createElement(Ct,{theme:n,iconStyle:a}):v.a.createElement(Ot,{theme:n,iconStyle:a})}},{key:"render",value:function(){var e=this,t=this.props,n=t.src,a=t.groupArraysAfterLength,r=(t.depth,t.name),o=t.theme,i=t.jsvRoot,s=t.namespace,u=(t.parent_type,fe(t,["src","groupArraysAfterLength","depth","name","theme","jsvRoot","namespace","parent_type"])),l=0,c=5*this.props.indentWidth;i||(l=5*this.props.indentWidth);var p=a,d=Math.ceil(n.length/p);return v.a.createElement("div",Object.assign({className:"object-key-val"},Ee(o,i?"jsv-root":"objectKeyVal",{paddingLeft:l})),v.a.createElement(St,this.props),v.a.createElement("span",null,v.a.createElement(xt,Object.assign({size:n.length},this.props))),Ae(Array(d)).map((function(t,a){return v.a.createElement("div",Object.assign({key:a,className:"object-key-val array-group"},Ee(o,"objectKeyVal",{marginLeft:6,paddingLeft:c})),v.a.createElement("span",Ee(o,"brace-row"),v.a.createElement("div",Object.assign({className:"icon-container"},Ee(o,"icon-container"),{onClick:function(t){e.toggleCollapsed(a)}}),e.getExpandedIcon(a)),e.state.expanded[a]?v.a.createElement(At,Object.assign({key:r+a,depth:0,name:!1,collapsed:!1,groupArraysAfterLength:p,index_offset:a*p,src:n.slice(a*p,a*p+p),namespace:s,type:"array",parent_type:"array_group",theme:o},u)):v.a.createElement("span",Object.assign({},Ee(o,"brace"),{onClick:function(t){e.toggleCollapsed(a)},className:"array-group-brace"}),"[",v.a.createElement("div",Object.assign({},Ee(o,"array-group-meta-data"),{className:"array-group-meta-data"}),v.a.createElement("span",Object.assign({className:"object-size"},Ee(o,"object-size")),a*p," - ",a*p+p>n.length?n.length:a*p+p)),"]")))})))}}]),n}(v.a.PureComponent),jt=function(e){l(n,e);var t=h(n);function n(e){var a;o(this,n),(a=t.call(this,e)).toggleCollapsed=function(){a.setState({expanded:!a.state.expanded},(function(){Me.set(a.props.rjvId,a.props.namespace,"expanded",a.state.expanded)}))},a.getObjectContent=function(e,t,n){return v.a.createElement("div",{className:"pushed-content object-container"},v.a.createElement("div",Object.assign({className:"object-content"},Ee(a.props.theme,"pushed-content")),a.renderObjectContents(t,n)))},a.getEllipsis=function(){return 0===a.state.size?null:v.a.createElement("div",Object.assign({},Ee(a.props.theme,"ellipsis"),{className:"node-ellipsis",onClick:a.toggleCollapsed}),"...")},a.getObjectMetaData=function(e){var t=a.props,n=(t.rjvId,t.theme,a.state),r=n.size,o=n.hovered;return v.a.createElement(xt,Object.assign({rowHovered:o,size:r},a.props))},a.renderObjectContents=function(e,t){var n,r=a.props,o=r.depth,i=r.parent_type,s=r.index_offset,u=r.groupArraysAfterLength,l=r.namespace,c=a.state.object_type,p=[],d=Object.keys(e||{});return a.props.sortKeys&&(d=d.sort()),d.forEach((function(r){if(n=new wt(r,e[r]),"array_group"===i&&s&&(n.name=parseInt(n.name)+s),e.hasOwnProperty(r))if("object"===n.type)p.push(v.a.createElement(At,Object.assign({key:n.name,depth:o+1,name:n.name,src:n.value,namespace:l.concat(n.name),parent_type:c},t)));else if("array"===n.type){var d=At;u&&n.value.length>u&&(d=kt),p.push(v.a.createElement(d,Object.assign({key:n.name,depth:o+1,name:n.name,src:n.value,namespace:l.concat(n.name),type:"array",parent_type:c},t)))}else p.push(v.a.createElement(Et,Object.assign({key:n.name+"_"+l,variable:n,singleIndent:5,namespace:l,type:a.props.type},t)))})),p};var r=n.getState(e);return a.state=y(y({},r),{},{prevProps:{}}),a}return s(n,[{key:"getBraceStart",value:function(e,t){var n=this,a=this.props,r=a.src,o=a.theme,i=a.iconStyle;if("array_group"===a.parent_type)return v.a.createElement("span",null,v.a.createElement("span",Ee(o,"brace"),"array"===e?"[":"{"),t?this.getObjectMetaData(r):null);var s=t?Ct:Ot;return v.a.createElement("span",null,v.a.createElement("span",Object.assign({onClick:function(e){n.toggleCollapsed()}},Ee(o,"brace-row")),v.a.createElement("div",Object.assign({className:"icon-container"},Ee(o,"icon-container")),v.a.createElement(s,{theme:o,iconStyle:i})),v.a.createElement(St,this.props),v.a.createElement("span",Ee(o,"brace"),"array"===e?"[":"{")),t?this.getObjectMetaData(r):null)}},{key:"render",value:function(){var e=this,t=this.props,n=t.depth,a=t.src,r=(t.namespace,t.name,t.type,t.parent_type),o=t.theme,i=t.jsvRoot,s=t.iconStyle,u=fe(t,["depth","src","namespace","name","type","parent_type","theme","jsvRoot","iconStyle"]),l=this.state,c=l.object_type,p=l.expanded,d={};return i||"array_group"===r?"array_group"===r&&(d.borderLeft=0,d.display="inline"):d.paddingLeft=5*this.props.indentWidth,v.a.createElement("div",Object.assign({className:"object-key-val",onMouseEnter:function(){return e.setState(y(y({},e.state),{},{hovered:!0}))},onMouseLeave:function(){return e.setState(y(y({},e.state),{},{hovered:!1}))}},Ee(o,i?"jsv-root":"objectKeyVal",d)),this.getBraceStart(c,p),p?this.getObjectContent(n,a,y({theme:o,iconStyle:s},u)):this.getEllipsis(),v.a.createElement("span",{className:"brace-row"},v.a.createElement("span",{style:y(y({},Ee(o,"brace").style),{},{paddingLeft:p?"3px":"0px"})},"array"===c?"]":"}"),p?null:this.getObjectMetaData(a)))}}],[{key:"getDerivedStateFromProps",value:function(e,t){var a=t.prevProps;return e.src!==a.src||e.collapsed!==a.collapsed||e.name!==a.name||e.namespace!==a.namespace||e.rjvId!==a.rjvId?y(y({},n.getState(e)),{},{prevProps:e}):null}}]),n}(v.a.PureComponent);jt.getState=function(e){var t=Object.keys(e.src).length,n=(!1===e.collapsed||!0!==e.collapsed&&e.collapsed>e.depth)&&(!e.shouldCollapse||!1===e.shouldCollapse({name:e.name,src:e.src,type:he(e.src),namespace:e.namespace}))&&0!==t;return{expanded:Me.get(e.rjvId,e.namespace,"expanded",n),object_type:"array"===e.type?"array":"object",parent_type:"array"===e.type?"array":"object",size:t,hovered:!1}};var wt=function e(t,n){o(this,e),this.name=t,this.value=n,this.type=he(n)};de(jt);var At=jt,_t=function(e){l(n,e);var t=h(n);function n(){var e;o(this,n);for(var a=arguments.length,r=new Array(a),i=0;it.groupArraysAfterLength&&(a=kt),v.a.createElement("div",{className:"pretty-json-container object-container"},v.a.createElement("div",{className:"object-content"},v.a.createElement(a,Object.assign({namespace:n,depth:0,jsvRoot:!0},t))))},e}return n}(v.a.PureComponent),Ft=function(e){l(n,e);var t=h(n);function n(e){var a;return o(this,n),(a=t.call(this,e)).closeModal=function(){Fe.dispatch({rjvId:a.props.rjvId,name:"RESET"})},a.submit=function(){a.props.submit(a.state.input)},a.state={input:e.input?e.input:""},a}return s(n,[{key:"render",value:function(){var e=this,t=this.props,n=t.theme,a=t.rjvId,r=t.isValid,o=this.state.input,i=r(o);return v.a.createElement("div",Object.assign({className:"key-modal-request"},Ee(n,"key-modal-request"),{onClick:this.closeModal}),v.a.createElement("div",Object.assign({},Ee(n,"key-modal"),{onClick:function(e){e.stopPropagation()}}),v.a.createElement("div",Ee(n,"key-modal-label"),"Key Name:"),v.a.createElement("div",{style:{position:"relative"}},v.a.createElement("input",Object.assign({},Ee(n,"key-modal-input"),{className:"key-modal-input",ref:function(e){return e&&e.focus()},spellCheck:!1,value:o,placeholder:"...",onChange:function(t){e.setState({input:t.target.value})},onKeyPress:function(t){i&&"Enter"===t.key?e.submit():"Escape"===t.key&&e.closeModal()}})),i?v.a.createElement(mt,Object.assign({},Ee(n,"key-modal-submit"),{className:"key-modal-submit",onClick:function(t){return e.submit()}})):null),v.a.createElement("span",Ee(n,"key-modal-cancel"),v.a.createElement(bt,Object.assign({},Ee(n,"key-modal-cancel-icon"),{className:"key-modal-cancel",onClick:function(){Fe.dispatch({rjvId:a,name:"RESET"})}})))))}}]),n}(v.a.PureComponent),Dt=function(e){l(n,e);var t=h(n);function n(){var e;o(this,n);for(var a=arguments.length,r=new Array(a),i=0;icomponent demo
{ window.open( - 'https://github.com/mac-s-g/react-json-view', + 'https://github.com/microlinkhq/react-json-view', '_blank' ); }} /> diff --git a/docker/README.md b/docker/README.md index 28c09de..e1bdc2e 100644 --- a/docker/README.md +++ b/docker/README.md @@ -59,20 +59,20 @@ for example, the container used with this project has the following composition: the `Dockerfile` defines exactly how a container should be composed for an application. Any docker-integrated workflow starts here. -Here is the [RJV Dockerfile](https://github.com/mac-s-g/react-json-view/blob/master/Dockerfile) +Here is the [RJV Dockerfile](https://github.com/microlinkhq/react-json-view/blob/master/Dockerfile) -Notice [here](https://github.com/mac-s-g/react-json-view/blob/master/Dockerfile#L1) that my container is built on top of a node container. If you track down that node container on docker-hub, you'll see that it's built on top of a debian container. Also notice that `node_modules` are installed directly into my container [here](https://github.com/mac-s-g/react-json-view/blob/master/Dockerfile#L6-L7). +Notice [here](https://github.com/microlinkhq/react-json-view/blob/master/Dockerfile#L1) that my container is built on top of a node container. If you track down that node container on docker-hub, you'll see that it's built on top of a debian container. Also notice that `node_modules` are installed directly into my container [here](https://github.com/microlinkhq/react-json-view/blob/master/Dockerfile#L6-L7). When I run `./docker/build-container.sh`, docker produces a container including all the `node_modules` listed in my `package.json` file. When I run `./docker/dev-server.sh`, a few things happen: - 1. docker [runs my container and mounts some source files](https://github.com/mac-s-g/react-json-view/blob/master/docker/dev-server.sh#L16-L20) into the container + 1. docker [runs my container and mounts some source files](https://github.com/microlinkhq/react-json-view/blob/master/docker/dev-server.sh#L16-L20) into the container * "mounting" is like a soft copy. my files are linked inside the container's file system so local edits propagate to the container. - 2. docker [exposes a port](https://github.com/mac-s-g/react-json-view/blob/master/docker/dev-server.sh#L23) on the container + 2. docker [exposes a port](https://github.com/microlinkhq/react-json-view/blob/master/docker/dev-server.sh#L23) on the container * this allows me to configure my app to listen and respond to to traffic at http://localhost:2000 * the port is arbitrary - 3. An [entrypoint will be invoked](https://github.com/mac-s-g/react-json-view/blob/master/docker/dev-server.sh#L24) once the container is running - * With my container up and running, the [entrypoint simply runs webpack dev server](https://github.com/mac-s-g/react-json-view/blob/master/entrypoints/dev-server.sh#L6). + 3. An [entrypoint will be invoked](https://github.com/microlinkhq/react-json-view/blob/master/docker/dev-server.sh#L24) once the container is running + * With my container up and running, the [entrypoint simply runs webpack dev server](https://github.com/microlinkhq/react-json-view/blob/master/entrypoints/dev-server.sh#L6). If you understand those steps, then you'll understand any of the docker scripts in `/docker/`. They do the same thing as the dev-server script but call different entrypoints.