react-json-table-v2
Advanced tools
Comparing version 0.1.8 to 0.1.9
| /* | ||
| react-json-table-v2 v0.1.7 | ||
| react-json-table-v2 v0.1.8 | ||
| https://github.com/Amedeo91/react-json-table | ||
@@ -4,0 +4,0 @@ MIT: https://github.com/Amedeo91/react-json-table/raw/master/LICENSE |
| /* | ||
| react-json-table-v2 v0.1.7 | ||
| react-json-table-v2 v0.1.8 | ||
| https://github.com/Amedeo91/react-json-table | ||
| MIT: https://github.com/Amedeo91/react-json-table/raw/master/LICENSE | ||
| */ | ||
| (function webpackUniversalModuleDefinition(root, factory) { | ||
| if(typeof exports === 'object' && typeof module === 'object') | ||
| module.exports = factory(require(undefined)); | ||
| else if(typeof define === 'function' && define.amd) | ||
| define([], factory); | ||
| else if(typeof exports === 'object') | ||
| exports["JsonTable"] = factory(require(undefined)); | ||
| else | ||
| root["JsonTable"] = factory(root["React"]); | ||
| })(this, function(__WEBPACK_EXTERNAL_MODULE_1__) { | ||
| return /******/ (function(modules) { // webpackBootstrap | ||
| /******/ // The module cache | ||
| /******/ var installedModules = {}; | ||
| /******/ // The require function | ||
| /******/ function __webpack_require__(moduleId) { | ||
| /******/ // Check if module is in cache | ||
| /******/ if(installedModules[moduleId]) | ||
| /******/ return installedModules[moduleId].exports; | ||
| /******/ // Create a new module (and put it into the cache) | ||
| /******/ var module = installedModules[moduleId] = { | ||
| /******/ exports: {}, | ||
| /******/ id: moduleId, | ||
| /******/ loaded: false | ||
| /******/ }; | ||
| /******/ // Execute the module function | ||
| /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); | ||
| /******/ // Flag the module as loaded | ||
| /******/ module.loaded = true; | ||
| /******/ // Return the exports of the module | ||
| /******/ return module.exports; | ||
| /******/ } | ||
| /******/ // expose the modules object (__webpack_modules__) | ||
| /******/ __webpack_require__.m = modules; | ||
| /******/ // expose the module cache | ||
| /******/ __webpack_require__.c = installedModules; | ||
| /******/ // __webpack_public_path__ | ||
| /******/ __webpack_require__.p = ""; | ||
| /******/ // Load entry module and return exports | ||
| /******/ return __webpack_require__(0); | ||
| /******/ }) | ||
| /************************************************************************/ | ||
| /******/ ([ | ||
| /* 0 */ | ||
| /***/ (function(module, exports, __webpack_require__) { | ||
| var React = __webpack_require__(1); | ||
| React.DOM = __webpack_require__(2); | ||
| // Some shared attrs for JsonTable and JsonRow | ||
| let defaultSettings = { | ||
| header: true, | ||
| noRowsMessage: 'No items', | ||
| classPrefix: 'json' | ||
| }, | ||
| getSetting = function( name, $this ){ | ||
| const settings = $this.props.settings; | ||
| if( !settings || typeof settings[ name ] === 'undefined' ) | ||
| return defaultSettings[ name ]; | ||
| return settings[ name ]; | ||
| } | ||
| ; | ||
| class JsonTable extends React.Component{ | ||
| constructor (props){ | ||
| super(props); | ||
| this.onClickRow = this.onClickRow.bind(this); | ||
| this.onClickCell = this.onClickCell.bind(this); | ||
| this.onClickHeader = this.onClickHeader.bind(this); | ||
| } | ||
| getSetting(name){ | ||
| return getSetting(name, this) | ||
| }; | ||
| render() { | ||
| const cols = this.normalizeColumns(), | ||
| contents = [this.renderRows( cols )] | ||
| ; | ||
| if( this.getSetting('header') ) | ||
| contents.unshift( this.renderHeader( cols ) ); | ||
| const tableClass = this.props.className || this.getSetting( 'classPrefix' ) + 'Table'; | ||
| return React.DOM.table({ className: tableClass }, contents ); | ||
| } | ||
| renderHeader( cols ) { | ||
| const me = this, | ||
| prefix = this.getSetting( 'classPrefix' ), | ||
| headerClass = this.getSetting( 'headerClass' ), | ||
| cells = cols.map( function(col){ | ||
| let className = prefix + 'Column'; | ||
| if( headerClass ) | ||
| className = headerClass( className, col.key ); | ||
| return React.DOM.th( | ||
| { className: className, key: col.key, onClick: me.onClickHeader, "data-key": col.key }, | ||
| col.label | ||
| ); | ||
| }) | ||
| ; | ||
| return React.DOM.thead({ key: 'th' }, | ||
| React.DOM.tr({ className: prefix + 'Header' }, cells ) | ||
| ); | ||
| } | ||
| renderRows( cols ) { | ||
| let me = this, | ||
| items = this.props.rows, | ||
| settings = this.props.settings || {}, | ||
| i = 1 | ||
| ; | ||
| if( !items || !items.length ) | ||
| return React.DOM.tbody({key:'body'}, [React.DOM.tr({key:'row'}, React.DOM.td({key:'column'}, this.getSetting('noRowsMessage') ))]); | ||
| const rows = items.map( function( item ){ | ||
| const key = me.getKey( item, i ); | ||
| return React.createElement(Row, { | ||
| key: key, | ||
| reactKey: key, | ||
| item: item, | ||
| settings: settings, | ||
| columns: cols, | ||
| i: i++, | ||
| onClickRow: me.onClickRow, | ||
| onClickCell: me.onClickCell | ||
| }); | ||
| }); | ||
| return React.DOM.tbody({key:'body'}, rows); | ||
| } | ||
| getItemField( item, field ){ | ||
| return item[ field ]; | ||
| } | ||
| normalizeColumns() { | ||
| const getItemField = this.props.cellRenderer || this.getItemField, | ||
| cols = this.props.columns, | ||
| items = this.props.rows | ||
| ; | ||
| if( !cols ){ | ||
| if( !items || !items.length ) | ||
| return []; | ||
| return Object.keys( items[0] ).map( function( key ){ | ||
| return { key: key, label: key, cell: getItemField }; | ||
| }); | ||
| } | ||
| return cols.map( function( col ){ | ||
| let key; | ||
| if( typeof col == 'string' ){ | ||
| return { | ||
| key: col, | ||
| label: col, | ||
| cell: getItemField | ||
| }; | ||
| } | ||
| if( typeof col == 'object' ){ | ||
| key = col.key || col.label; | ||
| // This is about get default column definition | ||
| // we use label as key if not defined | ||
| // we use key as label if not defined | ||
| // we use getItemField as cell function if not defined | ||
| return { | ||
| key: key, | ||
| label: col.label || key, | ||
| cell: col.cell || getItemField | ||
| }; | ||
| } | ||
| return { | ||
| key: 'unknown', | ||
| name:'unknown', | ||
| cell: 'Unknown' | ||
| }; | ||
| }); | ||
| } | ||
| getKey( item, i ) { | ||
| const field = this.props.settings && this.props.settings.keyField; | ||
| if( field && item[ field ] ) | ||
| return item[ field ]; | ||
| if( item.id ) | ||
| return item.id; | ||
| if( item._id ) | ||
| return item._id; | ||
| return i; | ||
| } | ||
| shouldComponentUpdate(){ | ||
| return true; | ||
| } | ||
| onClickRow( e, item ){ | ||
| if( this.props.onClickRow ){ | ||
| this.props.onClickRow( e, item ); | ||
| } | ||
| } | ||
| onClickHeader( e ){ | ||
| if( this.props.onClickHeader ){ | ||
| this.props.onClickHeader( e, e.target.dataset.key ); | ||
| } | ||
| } | ||
| onClickCell( e, key, item ){ | ||
| if( this.props.onClickCell ){ | ||
| this.props.onClickCell( e, key, item ); | ||
| } | ||
| } | ||
| } | ||
| class Row extends React.Component{ | ||
| constructor (props){ | ||
| super(props); | ||
| this.onClickRow = this.onClickRow.bind(this); | ||
| this.onClickCell = this.onClickCell.bind(this); | ||
| } | ||
| getSetting(name){ | ||
| return getSetting(name, this) | ||
| }; | ||
| render() { | ||
| const me = this, | ||
| props = this.props, | ||
| cellClass = this.getSetting('cellClass'), | ||
| rowClass = this.getSetting('rowClass'), | ||
| prefix = this.getSetting('classPrefix'), | ||
| cells = props.columns.map( function( col ){ | ||
| let content = col.cell, | ||
| key = col.key, | ||
| className = prefix + 'Cell ' + prefix + 'Cell_' + key | ||
| ; | ||
| if( cellClass ) | ||
| className = cellClass( className, key, props.item ); | ||
| if( typeof content === 'function' ) | ||
| content = content( props.item, key ); | ||
| return React.DOM.td( { | ||
| className: className, | ||
| key: key, | ||
| "data-key": key, | ||
| onClick: me.onClickCell | ||
| }, content ); | ||
| }) | ||
| ; | ||
| let className = prefix + 'Row ' + prefix + | ||
| (props.i % 2 ? 'Odd' : 'Even') | ||
| ; | ||
| if( props.reactKey ) | ||
| className += ' ' + prefix + 'Row_' + props.reactKey; | ||
| if( rowClass ) | ||
| className = rowClass( className, props.item ); | ||
| return React.DOM.tr({ | ||
| className: className, | ||
| onClick: me.onClickRow, | ||
| key: this.props.reactKey | ||
| }, cells ); | ||
| }; | ||
| onClickCell(e) { | ||
| this.props.onClickCell( e, e.target.dataset.key, this.props.item ); | ||
| }; | ||
| onClickRow(e) { | ||
| this.props.onClickRow( e, this.props.item ); | ||
| }; | ||
| } | ||
| module.exports = JsonTable; | ||
| /***/ }), | ||
| /* 1 */ | ||
| /***/ (function(module, exports) { | ||
| module.exports = __WEBPACK_EXTERNAL_MODULE_1__; | ||
| /***/ }), | ||
| /* 2 */ | ||
| /***/ (function(module, exports, __webpack_require__) { | ||
| 'use strict'; | ||
| /** | ||
| * Copyright (c) 2015-present, Facebook, Inc. | ||
| * | ||
| * This source code is licensed under the MIT license found in the | ||
| * LICENSE file in the root directory of this source tree. | ||
| */ | ||
| (function(f) { | ||
| if (true) { | ||
| module.exports = f(__webpack_require__(1)); | ||
| /* global define */ | ||
| } else if (typeof define === 'function' && define.amd) { | ||
| define(['react'], f); | ||
| } else { | ||
| var g; | ||
| if (typeof window !== 'undefined') { | ||
| g = window; | ||
| } else if (typeof global !== 'undefined') { | ||
| g = global; | ||
| } else if (typeof self !== 'undefined') { | ||
| g = self; | ||
| } else { | ||
| g = this; | ||
| } | ||
| if (typeof g.React === 'undefined') { | ||
| throw Error('React module should be required before ReactDOMFactories'); | ||
| } | ||
| g.ReactDOMFactories = f(g.React); | ||
| } | ||
| })(function(React) { | ||
| /** | ||
| * Create a factory that creates HTML tag elements. | ||
| */ | ||
| function createDOMFactory(type) { | ||
| var factory = React.createElement.bind(null, type); | ||
| // Expose the type on the factory and the prototype so that it can be | ||
| // easily accessed on elements. E.g. `<Foo />.type === Foo`. | ||
| // This should not be named `constructor` since this may not be the function | ||
| // that created the element, and it may not even be a constructor. | ||
| factory.type = type; | ||
| return factory; | ||
| }; | ||
| /** | ||
| * Creates a mapping from supported HTML tags to `ReactDOMComponent` classes. | ||
| */ | ||
| var ReactDOMFactories = { | ||
| a: createDOMFactory('a'), | ||
| abbr: createDOMFactory('abbr'), | ||
| address: createDOMFactory('address'), | ||
| area: createDOMFactory('area'), | ||
| article: createDOMFactory('article'), | ||
| aside: createDOMFactory('aside'), | ||
| audio: createDOMFactory('audio'), | ||
| b: createDOMFactory('b'), | ||
| base: createDOMFactory('base'), | ||
| bdi: createDOMFactory('bdi'), | ||
| bdo: createDOMFactory('bdo'), | ||
| big: createDOMFactory('big'), | ||
| blockquote: createDOMFactory('blockquote'), | ||
| body: createDOMFactory('body'), | ||
| br: createDOMFactory('br'), | ||
| button: createDOMFactory('button'), | ||
| canvas: createDOMFactory('canvas'), | ||
| caption: createDOMFactory('caption'), | ||
| cite: createDOMFactory('cite'), | ||
| code: createDOMFactory('code'), | ||
| col: createDOMFactory('col'), | ||
| colgroup: createDOMFactory('colgroup'), | ||
| data: createDOMFactory('data'), | ||
| datalist: createDOMFactory('datalist'), | ||
| dd: createDOMFactory('dd'), | ||
| del: createDOMFactory('del'), | ||
| details: createDOMFactory('details'), | ||
| dfn: createDOMFactory('dfn'), | ||
| dialog: createDOMFactory('dialog'), | ||
| div: createDOMFactory('div'), | ||
| dl: createDOMFactory('dl'), | ||
| dt: createDOMFactory('dt'), | ||
| em: createDOMFactory('em'), | ||
| embed: createDOMFactory('embed'), | ||
| fieldset: createDOMFactory('fieldset'), | ||
| figcaption: createDOMFactory('figcaption'), | ||
| figure: createDOMFactory('figure'), | ||
| footer: createDOMFactory('footer'), | ||
| form: createDOMFactory('form'), | ||
| h1: createDOMFactory('h1'), | ||
| h2: createDOMFactory('h2'), | ||
| h3: createDOMFactory('h3'), | ||
| h4: createDOMFactory('h4'), | ||
| h5: createDOMFactory('h5'), | ||
| h6: createDOMFactory('h6'), | ||
| head: createDOMFactory('head'), | ||
| header: createDOMFactory('header'), | ||
| hgroup: createDOMFactory('hgroup'), | ||
| hr: createDOMFactory('hr'), | ||
| html: createDOMFactory('html'), | ||
| i: createDOMFactory('i'), | ||
| iframe: createDOMFactory('iframe'), | ||
| img: createDOMFactory('img'), | ||
| input: createDOMFactory('input'), | ||
| ins: createDOMFactory('ins'), | ||
| kbd: createDOMFactory('kbd'), | ||
| keygen: createDOMFactory('keygen'), | ||
| label: createDOMFactory('label'), | ||
| legend: createDOMFactory('legend'), | ||
| li: createDOMFactory('li'), | ||
| link: createDOMFactory('link'), | ||
| main: createDOMFactory('main'), | ||
| map: createDOMFactory('map'), | ||
| mark: createDOMFactory('mark'), | ||
| menu: createDOMFactory('menu'), | ||
| menuitem: createDOMFactory('menuitem'), | ||
| meta: createDOMFactory('meta'), | ||
| meter: createDOMFactory('meter'), | ||
| nav: createDOMFactory('nav'), | ||
| noscript: createDOMFactory('noscript'), | ||
| object: createDOMFactory('object'), | ||
| ol: createDOMFactory('ol'), | ||
| optgroup: createDOMFactory('optgroup'), | ||
| option: createDOMFactory('option'), | ||
| output: createDOMFactory('output'), | ||
| p: createDOMFactory('p'), | ||
| param: createDOMFactory('param'), | ||
| picture: createDOMFactory('picture'), | ||
| pre: createDOMFactory('pre'), | ||
| progress: createDOMFactory('progress'), | ||
| q: createDOMFactory('q'), | ||
| rp: createDOMFactory('rp'), | ||
| rt: createDOMFactory('rt'), | ||
| ruby: createDOMFactory('ruby'), | ||
| s: createDOMFactory('s'), | ||
| samp: createDOMFactory('samp'), | ||
| script: createDOMFactory('script'), | ||
| section: createDOMFactory('section'), | ||
| select: createDOMFactory('select'), | ||
| small: createDOMFactory('small'), | ||
| source: createDOMFactory('source'), | ||
| span: createDOMFactory('span'), | ||
| strong: createDOMFactory('strong'), | ||
| style: createDOMFactory('style'), | ||
| sub: createDOMFactory('sub'), | ||
| summary: createDOMFactory('summary'), | ||
| sup: createDOMFactory('sup'), | ||
| table: createDOMFactory('table'), | ||
| tbody: createDOMFactory('tbody'), | ||
| td: createDOMFactory('td'), | ||
| textarea: createDOMFactory('textarea'), | ||
| tfoot: createDOMFactory('tfoot'), | ||
| th: createDOMFactory('th'), | ||
| thead: createDOMFactory('thead'), | ||
| time: createDOMFactory('time'), | ||
| title: createDOMFactory('title'), | ||
| tr: createDOMFactory('tr'), | ||
| track: createDOMFactory('track'), | ||
| u: createDOMFactory('u'), | ||
| ul: createDOMFactory('ul'), | ||
| var: createDOMFactory('var'), | ||
| video: createDOMFactory('video'), | ||
| wbr: createDOMFactory('wbr'), | ||
| // SVG | ||
| circle: createDOMFactory('circle'), | ||
| clipPath: createDOMFactory('clipPath'), | ||
| defs: createDOMFactory('defs'), | ||
| ellipse: createDOMFactory('ellipse'), | ||
| g: createDOMFactory('g'), | ||
| image: createDOMFactory('image'), | ||
| line: createDOMFactory('line'), | ||
| linearGradient: createDOMFactory('linearGradient'), | ||
| mask: createDOMFactory('mask'), | ||
| path: createDOMFactory('path'), | ||
| pattern: createDOMFactory('pattern'), | ||
| polygon: createDOMFactory('polygon'), | ||
| polyline: createDOMFactory('polyline'), | ||
| radialGradient: createDOMFactory('radialGradient'), | ||
| rect: createDOMFactory('rect'), | ||
| stop: createDOMFactory('stop'), | ||
| svg: createDOMFactory('svg'), | ||
| text: createDOMFactory('text'), | ||
| tspan: createDOMFactory('tspan'), | ||
| }; | ||
| // due to wrapper and conditionals at the top, this will either become | ||
| // `module.exports ReactDOMFactories` if that is available, | ||
| // otherwise it will be defined via `define(['react'], ReactDOMFactories)` | ||
| // if that is available, | ||
| // otherwise it will be defined as global variable. | ||
| return ReactDOMFactories; | ||
| }); | ||
| /***/ }) | ||
| /******/ ]) | ||
| }); | ||
| ; | ||
| !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require(void 0)):"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.JsonTable=t(require(void 0)):e.JsonTable=t(e.React)}(this,(function(e){return function(e){var t={};function i(o){if(t[o])return t[o].exports;var s=t[o]={exports:{},id:o,loaded:!1};return e[o].call(s.exports,s,s.exports,i),s.loaded=!0,s.exports}return i.m=e,i.c=t,i.p="",i(0)}([function(e,t,i){var o=i(1);o.DOM=i(2);let s={header:!0,noRowsMessage:"No items",classPrefix:"json"},n=function(e,t){const i=t.props.settings;return i&&void 0!==i[e]?i[e]:s[e]};class r extends o.Component{constructor(e){super(e),this.onClickRow=this.onClickRow.bind(this),this.onClickCell=this.onClickCell.bind(this),this.onClickHeader=this.onClickHeader.bind(this)}getSetting(e){return n(e,this)}render(){const e=this.normalizeColumns(),t=[this.renderRows(e)];this.getSetting("header")&&t.unshift(this.renderHeader(e));const i=this.props.className||this.getSetting("classPrefix")+"Table";return o.DOM.table({className:i},t)}renderHeader(e){const t=this,i=this.getSetting("classPrefix"),s=this.getSetting("headerClass"),n=e.map((function(e){let n=i+"Column";return s&&(n=s(n,e.key)),o.DOM.th({className:n,key:e.key,onClick:t.onClickHeader,"data-key":e.key},e.label)}));return o.DOM.thead({key:"th"},o.DOM.tr({className:i+"Header"},n))}renderRows(e){let t=this,i=this.props.rows,s=this.props.settings||{},n=1;if(!i||!i.length)return o.DOM.tbody({key:"body"},[o.DOM.tr({key:"row"},o.DOM.td({key:"column"},this.getSetting("noRowsMessage")))]);const r=i.map((function(i){const r=t.getKey(i,n);return o.createElement(l,{key:r,reactKey:r,item:i,settings:s,columns:e,i:n++,onClickRow:t.onClickRow,onClickCell:t.onClickCell})}));return o.DOM.tbody({key:"body"},r)}getItemField(e,t){return e[t]}normalizeColumns(){const e=this.props.cellRenderer||this.getItemField,t=this.props.columns,i=this.props.rows;return t?t.map((function(t){let i;return"string"==typeof t?{key:t,label:t,cell:e}:"object"==typeof t?(i=t.key||t.label,{key:i,label:t.label||i,cell:t.cell||e}):{key:"unknown",name:"unknown",cell:"Unknown"}})):i&&i.length?Object.keys(i[0]).map((function(t){return{key:t,label:t,cell:e}})):[]}getKey(e,t){const i=this.props.settings&&this.props.settings.keyField;return i&&e[i]?e[i]:e.id?e.id:e._id?e._id:t}shouldComponentUpdate(){return!0}onClickRow(e,t){this.props.onClickRow&&this.props.onClickRow(e,t)}onClickHeader(e){this.props.onClickHeader&&this.props.onClickHeader(e,e.target.dataset.key)}onClickCell(e,t,i){this.props.onClickCell&&this.props.onClickCell(e,t,i)}}class l extends o.Component{constructor(e){super(e),this.onClickRow=this.onClickRow.bind(this),this.onClickCell=this.onClickCell.bind(this)}getSetting(e){return n(e,this)}render(){const e=this,t=this.props,i=this.getSetting("cellClass"),s=this.getSetting("rowClass"),n=this.getSetting("classPrefix"),r=t.columns.map((function(s){let r=s.cell,l=s.key,a=n+"Cell "+n+"Cell_"+l;return i&&(a=i(a,l,t.item)),"function"==typeof r&&(r=r(t.item,l)),o.DOM.td({className:a,key:l,"data-key":l,onClick:e.onClickCell},r)}));let l=n+"Row "+n+(t.i%2?"Odd":"Even");return t.reactKey&&(l+=" "+n+"Row_"+t.reactKey),s&&(l=s(l,t.item)),o.DOM.tr({className:l,onClick:e.onClickRow,key:this.props.reactKey},r)}onClickCell(e){this.props.onClickCell(e,e.target.dataset.key,this.props.item)}onClickRow(e){this.props.onClickRow(e,this.props.item)}}e.exports=r},function(t,i){t.exports=e},function(e,t,i){"use strict";var o;o=function(e){function t(t){var i=e.createElement.bind(null,t);return i.type=t,i}return{a:t("a"),abbr:t("abbr"),address:t("address"),area:t("area"),article:t("article"),aside:t("aside"),audio:t("audio"),b:t("b"),base:t("base"),bdi:t("bdi"),bdo:t("bdo"),big:t("big"),blockquote:t("blockquote"),body:t("body"),br:t("br"),button:t("button"),canvas:t("canvas"),caption:t("caption"),cite:t("cite"),code:t("code"),col:t("col"),colgroup:t("colgroup"),data:t("data"),datalist:t("datalist"),dd:t("dd"),del:t("del"),details:t("details"),dfn:t("dfn"),dialog:t("dialog"),div:t("div"),dl:t("dl"),dt:t("dt"),em:t("em"),embed:t("embed"),fieldset:t("fieldset"),figcaption:t("figcaption"),figure:t("figure"),footer:t("footer"),form:t("form"),h1:t("h1"),h2:t("h2"),h3:t("h3"),h4:t("h4"),h5:t("h5"),h6:t("h6"),head:t("head"),header:t("header"),hgroup:t("hgroup"),hr:t("hr"),html:t("html"),i:t("i"),iframe:t("iframe"),img:t("img"),input:t("input"),ins:t("ins"),kbd:t("kbd"),keygen:t("keygen"),label:t("label"),legend:t("legend"),li:t("li"),link:t("link"),main:t("main"),map:t("map"),mark:t("mark"),menu:t("menu"),menuitem:t("menuitem"),meta:t("meta"),meter:t("meter"),nav:t("nav"),noscript:t("noscript"),object:t("object"),ol:t("ol"),optgroup:t("optgroup"),option:t("option"),output:t("output"),p:t("p"),param:t("param"),picture:t("picture"),pre:t("pre"),progress:t("progress"),q:t("q"),rp:t("rp"),rt:t("rt"),ruby:t("ruby"),s:t("s"),samp:t("samp"),script:t("script"),section:t("section"),select:t("select"),small:t("small"),source:t("source"),span:t("span"),strong:t("strong"),style:t("style"),sub:t("sub"),summary:t("summary"),sup:t("sup"),table:t("table"),tbody:t("tbody"),td:t("td"),textarea:t("textarea"),tfoot:t("tfoot"),th:t("th"),thead:t("thead"),time:t("time"),title:t("title"),tr:t("tr"),track:t("track"),u:t("u"),ul:t("ul"),var:t("var"),video:t("video"),wbr:t("wbr"),circle:t("circle"),clipPath:t("clipPath"),defs:t("defs"),ellipse:t("ellipse"),g:t("g"),image:t("image"),line:t("line"),linearGradient:t("linearGradient"),mask:t("mask"),path:t("path"),pattern:t("pattern"),polygon:t("polygon"),polyline:t("polyline"),radialGradient:t("radialGradient"),rect:t("rect"),stop:t("stop"),svg:t("svg"),text:t("text"),tspan:t("tspan")}},e.exports=o(i(1))}])})); |
@@ -38,3 +38,3 @@ var gulp = require('gulp'), | ||
| if( minify ){ | ||
| //stream.pipe( uglify() ); | ||
| stream.pipe( uglify() ); | ||
| } | ||
@@ -41,0 +41,0 @@ |
| { | ||
| "name": "react-json-table-v2", | ||
| "version": "0.1.8", | ||
| "version": "0.1.9", | ||
| "description": "A simple but reactive table react component to display JSON data, based on https://github.com/arqex/react-json-table", | ||
@@ -5,0 +5,0 @@ "main": "rjt.js", |
@@ -1,2 +0,2 @@ | ||
| # react-json-table | ||
| # react-json-table-v2 | ||
| A simple but flexible table react component to display JSON data. | ||
@@ -6,2 +6,5 @@ | ||
| ```js | ||
| import JsonTable from "react-json-table-v2"; | ||
| var items = [ | ||
@@ -13,2 +16,3 @@ { name: 'Louise', age: 27, color: 'red' }, | ||
| React.render(<JsonTable rows={ items } />, document.body); | ||
@@ -41,5 +45,5 @@ ``` | ||
| ``` | ||
| npm install react-json-table --save | ||
| npm install react-json-table-v2 --save | ||
| ``` | ||
| You can also use the built UMD files [react-json-table.js](https://github.com/arqex/react-json-table/blob/master/build/react-json-table.js)(6KB) and [react-json-table.min.js](https://github.com/arqex/react-json-table/blob/master/build/react-json-table.min.js)(3KB) if you want `JsonTable` globally or as an AMD package. | ||
| You can also use the built UMD files [react-json-table.js](https://github.com/Amedeo91/react-json-table/blob/master/build/react-json-table.js)(6KB) and [react-json-table.min.js](https://github.com/Amedeo91/react-json-table/blob/master/build/react-json-table.min.js)(3KB) if you want `JsonTable` globally or as an AMD package. | ||
@@ -46,0 +50,0 @@ Half of the built version size is the code to create the UMD module. NPM version is really lightweight. |
New alerts
Dynamic require
Supply chain riskDynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.
Found 1 instance in 1 package
Minified code
QualityThis 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 lines in readme file
- increased by2.29%
179
Worsened metrics
- Total package byte prevSize
- decreased by-18.67%
40793
- Lines of code
- decreased by-38.85%
694
- Number of low quality alerts
- increased by50%
3
No dependency changes