diff --git a/.gitignore b/.gitignore index 0d373cb..f3a4805 100755 --- a/.gitignore +++ b/.gitignore @@ -1,5 +1,6 @@ labextension/lib/ nbextension/lib/ +component/lib/ nbextension/embed/ node_modules/ npm-debug.log diff --git a/README.md b/README.md index 308d915..22ef3b0 100755 --- a/README.md +++ b/README.md @@ -6,7 +6,7 @@ A JupyterLab and Jupyter Notebook extension for rendering [JSON Table Schema](ht ## Prerequisites -* JupyterLab ^0.18.0 and/or Notebook >=4.3.0 +* JupyterLab ^0.20.0 and/or Notebook >=4.3.0 ## Usage @@ -86,12 +86,11 @@ To render a .table.json file as a tree, simply open it: ## Install ```bash -pip install jupyterlab_table # For JupyterLab -jupyter labextension install --symlink --py --sys-prefix jupyterlab_table -jupyter labextension enable --py --sys-prefix jupyterlab_table +jupyter labextension install jupyterlab_table # For Notebook -jupyter nbextension install --symlink --py --sys-prefix jupyterlab_table +pip install jupyterlab_table +jupyter nbextension install --py --sys-prefix jupyterlab_table jupyter nbextension enable --py --sys-prefix jupyterlab_table ``` @@ -100,8 +99,8 @@ jupyter nbextension enable --py --sys-prefix jupyterlab_table ```bash pip install -e . # For JupyterLab -jupyter labextension install --symlink --py --sys-prefix jupyterlab_table -jupyter labextension enable --py --sys-prefix jupyterlab_table +cd labextension +jupyter labextension link . # For Notebook jupyter nbextension install --symlink --py --sys-prefix jupyterlab_table jupyter nbextension enable --py --sys-prefix jupyterlab_table diff --git a/build.sh b/build.sh deleted file mode 100644 index 17c92e2..0000000 --- a/build.sh +++ /dev/null @@ -1,20 +0,0 @@ -#!/usr/bin/env bash - -npm -v -if [ $? -eq 0 ]; then - echo npm is installed -else - echo "'npm -v' failed, therefore npm is not installed. In order to perform a - developer install of jupyterlab_table you must have npm installed - on your machine! See http://blog.npmjs.org/post/85484771375/how-to-install-npm - for installation instructions." - exit 1 -fi - -cd labextension -npm install -cd .. - -cd nbextension -npm install -cd .. diff --git a/component/.babelrc b/component/.babelrc new file mode 100644 index 0000000..d4d2df4 --- /dev/null +++ b/component/.babelrc @@ -0,0 +1,3 @@ +{ + "presets": ["latest", "stage-0", "react"] +} diff --git a/component/fixed-data-table.js b/component/fixed-data-table.js deleted file mode 100644 index f419f83..0000000 --- a/component/fixed-data-table.js +++ /dev/null @@ -1,68 +0,0 @@ -import React from 'react'; -import { - Table, - Column, - Cell -} from 'fixed-data-table'; -import 'fixed-data-table/dist/fixed-data-table.min.css'; -// hack: `stream.Transform` (stream-browserify) is undefined in `csv-parse` when -// built with @jupyterlabextension-builder -import infer from 'jsontableschema/lib/infer'; -// import { infer } from 'jsontableschema'; -import './index.css'; - -const ROW_HEIGHT = 34; - -function inferSchema(data) { - const headers = data.reduce((result, row) => [...new Set([...result, ...Object.keys(row)])], []); - const values = data.map(row => Object.values(row)); - return infer(headers, values); -} - -export default class FixedDataTable extends React.Component { - - state = { - columnWidths: {} - } - - render() { - let { schema, data } = this.props; - if (!schema) schema = inferSchema(data); - return ( - { - this.setState(({columnWidths}) => ({ - columnWidths: { - ...columnWidths, - [columnKey]: columnWidth, - } - })); - }} - > - { - schema.fields.map((field, fieldIndex) => - - {field.name} - } - cell={props => - {data[props.rowIndex][field.name]} - } - fixed={false} - isResizable={true} - /> - ) - } -
- ); - } - -} diff --git a/component/package.json b/component/package.json index 73a50b4..f49bfbc 100644 --- a/component/package.json +++ b/component/package.json @@ -1,10 +1,15 @@ { "name": "jupyterlab_table_react", "version": "1.0.0", - "description": "A React component for rendering JSON schema table", - "main": "index.js", + "description": "A React component for rendering JSONTable", + "main": "lib/index.js", + "files": [ + "lib/*.js", + "*.css" + ], "scripts": { - "test": "echo \"Error: no test specified\" && exit 1" + "build": "babel src --out-dir lib", + "prepublishOnly": "npm run build" }, "keywords": [ "jupyter", @@ -13,10 +18,17 @@ "author": "Grant Nestor", "license": "ISC", "dependencies": { - "fixed-data-table": "^0.6.3", "jsontableschema": "^0.2.2", - "react": "^15.3.2", - "react-addons-shallow-compare": "^15.4.2", - "react-virtualized": "^8.11.4" + "react-virtualized": "^9.7.3" + }, + "peerDependencies": { + "react": "^15.3.2" + }, + "devDependencies": { + "babel-cli": "^6.24.0", + "babel-core": "^6.18.2", + "babel-preset-latest": "^6.16.0", + "babel-preset-react": "^6.16.0", + "babel-preset-stage-0": "^6.16.0" } } diff --git a/component/index.js b/component/src/index.js similarity index 52% rename from component/index.js rename to component/src/index.js index e8dab11..94ab5c1 100644 --- a/component/index.js +++ b/component/src/index.js @@ -1,4 +1,2 @@ export VirtualizedTable from './virtualized-table'; export VirtualizedGrid from './virtualized-grid'; -export FixedDataTable from './fixed-data-table'; -export VanillaTable from './vanilla-table'; diff --git a/component/virtualized-grid.js b/component/src/virtualized-grid.js similarity index 54% rename from component/virtualized-grid.js rename to component/src/virtualized-grid.js index cbe3344..1d41e28 100644 --- a/component/virtualized-grid.js +++ b/component/src/virtualized-grid.js @@ -1,31 +1,29 @@ /* @flow */ import React from 'react'; -import { MultiGrid, AutoSizer } from 'react-virtualized'; +import { MultiGrid, AutoSizer, ColumnSizer } from 'react-virtualized'; // hack: `stream.Transform` (stream-browserify) is undefined in `csv-parse` when // built with @jupyterlabextension-builder import infer from 'jsontableschema/lib/infer'; // import { infer } from 'jsontableschema'; -import './index.css'; - -const ROW_HEIGHT = 36; -const COLUMN_WIDTH = 72; -const GRID_MAX_HEIGHT = ROW_HEIGHT * 10; -// The width per text character for calculating widths for columns -const COLUMN_CHARACTER_WIDTH = 14; -// The number of sample rows that should be used to infer types for columns -// and widths for columns -const SAMPLE_SIZE = 10; type Props = { data: Array, schema: { fields: Array }, - theme: string + theme?: string, + width?: number, + height?: number, + rowHeight: number, + maxRows: number, + columnMinWidth: number, + columnMaxWidth: number, + sampleSize: number, + overscanColumnCount: number, + overscanRowCount: number }; type State = { data: Array, - schema: { fields: Array }, - columnWidths: Array + schema: { fields: Array } }; function getSampleRows(data: Array, sampleSize: number): Array { @@ -35,11 +33,14 @@ function getSampleRows(data: Array, sampleSize: number): Array { }); } -function inferSchema(data: Array): { fields: Array } { - const sampleRows = getSampleRows(data, SAMPLE_SIZE); +function inferSchema( + data: Array, + sampleSize: number +): { fields: Array } { + const sampleRows = getSampleRows(data, sampleSize); const headers = Array.from( sampleRows.reduce( - (result, row) => new Set([...result, ...Object.keys(row)]), + (result, row) => new Set([...Array.from(result), ...Object.keys(row)]), new Set() ) ); @@ -49,37 +50,34 @@ function inferSchema(data: Array): { fields: Array } { function getState(props: Props) { const data = props.data; - const schema = props.schema || inferSchema(data); + const schema = props.schema || inferSchema(data, props.sampleSize); const columns = schema.fields.map(field => field.name); const headers = columns.reduce( (result, column) => ({ ...result, [column]: column }), {} ); - const columnWidths = columns.map(column => { - const sampleRows = getSampleRows(data, SAMPLE_SIZE); - return [headers, ...sampleRows].reduce( - (result, row) => - `${row[column]}`.length > result ? `${row[column]}`.length : result, - Math.ceil(COLUMN_WIDTH / getCharacterWidth(COLUMN_CHARACTER_WIDTH)) - ); - }); return { data: [headers, ...data], - schema, - columnWidths + schema }; } -function getCharacterWidth(fontSize) { - return fontSize * 0.86; -} - export default class VirtualizedGrid extends React.Component { props: Props; state: State = { data: [], - schema: { fields: [] }, - columnWidths: [] + schema: { fields: [] } + }; + + static defaultProps = { + theme: 'light', + rowHeight: 36, + maxRows: 10, + columnMinWidth: 100, + columnMaxWidth: 300, + sampleSize: 10, + overscanColumnCount: 15, + overscanRowCount: 150 }; componentWillMount() { @@ -92,28 +90,31 @@ export default class VirtualizedGrid extends React.Component { this.setState(state); } - cellRenderer = ( - { - columnIndex, - key, - parent, - rowIndex, - style - }: { - columnIndex: number, - key: string, - parent: mixed, - rowIndex: number, - style: Object - } - ) => { + cellRenderer = ({ + columnIndex, + key, + parent, + rowIndex, + style + }: { + columnIndex: number, + key: string, + parent: mixed, + rowIndex: number, + style: Object + }) => { const { name: column, type } = this.state.schema.fields[columnIndex]; const value = this.state.data[rowIndex][column]; return (
{value}
@@ -122,27 +123,36 @@ export default class VirtualizedGrid extends React.Component { render() { const rowCount = this.state.data.length; - const height = rowCount * ROW_HEIGHT; + const { rowHeight, maxRows } = this.props; + const maxHeight = rowCount > maxRows + ? maxRows * rowHeight + : rowCount * rowHeight; return ( {({ width }) => ( - - this.state.columnWidths[index] * - getCharacterWidth( - this.props.fontSize || COLUMN_CHARACTER_WIDTH - ) || COLUMN_WIDTH} - fixedColumnCount={1} - fixedRowCount={1} - height={this.props.height > height ? height : this.props.height} - overscanColumnCount={15} - overscanRowCount={150} - rowCount={rowCount} - rowHeight={ROW_HEIGHT} - width={this.props.width || width} - /> + width={width} + > + {({ adjustedWidth, getColumnWidth, registerChild }) => ( + + )} + )} ); @@ -150,7 +160,7 @@ export default class VirtualizedGrid extends React.Component { } const styles = { - cell: ({ columnIndex, rowIndex, style, type }) => ({ + cell: ({ columnIndex, rowIndex, style, type, theme }) => ({ ...style, boxSizing: 'border-box', padding: '0.5em 1em', diff --git a/component/virtualized-table.js b/component/src/virtualized-table.js similarity index 99% rename from component/virtualized-table.js rename to component/src/virtualized-table.js index 341cdb0..75ee64e 100644 --- a/component/virtualized-table.js +++ b/component/src/virtualized-table.js @@ -5,7 +5,6 @@ import { Table, Column, SortDirection, AutoSizer } from 'react-virtualized'; // built with @jupyterlabextension-builder import infer from 'jsontableschema/lib/infer'; // import { infer } from 'jsontableschema'; -import "./index.css"; const ROW_HEIGHT = 36; const TABLE_MAX_HEIGHT = ROW_HEIGHT * 10; diff --git a/component/vanilla-table.js b/component/vanilla-table.js deleted file mode 100644 index 68c0c20..0000000 --- a/component/vanilla-table.js +++ /dev/null @@ -1,48 +0,0 @@ -import React from 'react'; -import ReactDOM from 'react-dom'; -// hack: `stream.Transform` (stream-browserify) is undefined in `csv-parse` when -// built with @jupyterlabextension-builder -import infer from 'jsontableschema/lib/infer'; -// import { infer } from 'jsontableschema'; -import './index.css'; - -function inferSchema(data) { - const headers = data.reduce((result, row) => [...new Set([...result, ...Object.keys(row)])], []); - const values = data.map(row => Object.values(row)); - return infer(headers, values); -} - -export default class VanillaTable extends React.Component { - - render() { - let { schema, data } = this.props; - if (!schema) schema = inferSchema(data); - return ( - - - - { - schema.fields.map((field, index) => ( - - )) - } - - - - { - props.data.map((row, rowIndex) => - - { - schema.fields.map((field, index) => ( - - )) - } - - ) - } - -
{field.name}
{row[field.name]}
- ); - } - -} diff --git a/install.sh b/install.sh deleted file mode 100644 index 248793f..0000000 --- a/install.sh +++ /dev/null @@ -1,51 +0,0 @@ -#!/usr/bin/env bash -set -e -nbExtFlags=$1 - -bash build.sh - -pip --version -if [ $? -eq 0 ]; then - echo pip is installed -else - echo "'pip --version' failed, therefore pip is not installed. In order to perform - a developer install of jupyterlab_table you must have pip installed on - your machine! See https://packaging.python.org/installing/ for installation instructions." - exit 1 -fi - -pip install -v -e . - -jupyter lab --version -if [ $? -eq 0 ]; then - echo jupyter lab is installed - if [[ "$OSTYPE" == "msys" ]]; then - jupyter labextension install --py $nbExtFlags jupyterlab_table - else - jupyter labextension install --py --symlink $nbExtFlags jupyterlab_table - fi - jupyter labextension enable --py $nbExtFlags jupyterlab_table -else - echo "'jupyter lab --version' failed, therefore jupyter lab is not installed. In - order to perform a developer install of jupyterlab_table you must - have jupyter lab on your machine! Install using 'pip install jupyterlab' or - follow instructions at https://github.com/jupyterlab/jupyterlab/blob/master/CONTRIBUTING.md#installing-jupyterlab for developer install." -fi - -jupyter notebook --version -if [ $? -eq 0 ]; then - echo jupyter notebook is installed - if [[ "$OSTYPE" == "msys" ]]; then - jupyter nbextension install --py $nbExtFlags jupyterlab_table - else - jupyter nbextension install --py --symlink $nbExtFlags jupyterlab_table - fi - jupyter nbextension enable --py $nbExtFlags jupyterlab_table -else - echo "'jupyter notebook --version' failed, therefore jupyter notebook is not - installed. In order to perform a developer install of - jupyterlab_table you must have jupyter notebook on your machine! - Install using 'pip install notebook' or follow instructions at - https://github.com/jupyter/notebook/blob/master/CONTRIBUTING.rst#installing-the-jupyter-notebook - for developer install." -fi diff --git a/labextension/.babelrc b/labextension/.babelrc new file mode 100644 index 0000000..d4d2df4 --- /dev/null +++ b/labextension/.babelrc @@ -0,0 +1,3 @@ +{ + "presets": ["latest", "stage-0", "react"] +} diff --git a/labextension/README.md b/labextension/README.md index 6709ded..ec22b6b 100644 --- a/labextension/README.md +++ b/labextension/README.md @@ -4,7 +4,7 @@ A JupyterLab extension for rendering JSON Table Schema ## Prerequisites -* `jupyterlab@^0.18.0` +* `jupyterlab@^0.20.0` ## Development @@ -12,6 +12,25 @@ Install dependencies and build Javascript: ```bash npm install +npm run build +``` + +Install extension: + +```bash +jupyter labextension link . +``` + +Uninstall extension: + +```bash +jupyter labextension unlink . +``` + +Install extension: + +```bash +jupyter labextension link . ``` Re-build Javascript: diff --git a/labextension/build_extension.js b/labextension/build_extension.js deleted file mode 100644 index 0466e1e..0000000 --- a/labextension/build_extension.js +++ /dev/null @@ -1,53 +0,0 @@ -var buildExtension = require('@jupyterlab/extension-builder').buildExtension; -var path = require('path'); - -buildExtension({ - name: 'jupyterlab_table', - entry: path.join(__dirname, 'src', 'plugin.js'), - outputDir: path.join( - __dirname, - '..', - 'jupyterlab_table', - 'static' - ), - useDefaultLoaders: false, - config: { - module: { - loaders: [ - { test: /\.html$/, loader: 'file-loader' }, - { test: /\.(jpg|png|gif)$/, loader: 'file-loader' }, - { - test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, - loader: 'url-loader?limit=10000&mimetype=application/font-woff' - }, - { - test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, - loader: 'url-loader?limit=10000&mimetype=application/font-woff' - }, - { - test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, - loader: 'url-loader?limit=10000&mimetype=application/octet-stream' - }, - { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: 'file-loader' }, - { - test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, - loader: 'url-loader?limit=10000&mimetype=image/svg+xml' - }, - { test: /\.json$/, loader: 'json-loader' }, - { - test: /\.js$/, - include: [ - path.join(__dirname, 'src'), - path.join( - __dirname, - 'node_modules', - 'jupyterlab_table_react' - ) - ], - loader: 'babel-loader', - query: { presets: ['latest', 'stage-0', 'react'] } - } - ] - } - } -}); diff --git a/labextension/src/index.css b/labextension/index.css similarity index 78% rename from labextension/src/index.css rename to labextension/index.css index 6b62ecd..cff039f 100755 --- a/labextension/src/index.css +++ b/labextension/index.css @@ -1,8 +1,3 @@ -/* - Copyright (c) Jupyter Development Team. - Distributed under the terms of the Modified BSD License. -*/ - .jp-OutputWidgetJSONTable, .jp-DocWidgetJSONTable { width: 100%; padding: 0; @@ -10,8 +5,8 @@ } .jp-OutputWidgetJSONTable { - padding-top: 5px; - height: 360px; + margin-top: 5px; + max-height: 360px; } .jp-DocWidgetJSONTable { diff --git a/labextension/package.json b/labextension/package.json index 276d84e..d1fabfc 100644 --- a/labextension/package.json +++ b/labextension/package.json @@ -1,40 +1,43 @@ { "private": true, "name": "jupyterlab_table_labextension", - "version": "0.18.0", + "version": "0.20.2", "description": "A JupyterLab extension for rendering JSON Table Schema", "author": "Grant Nestor ", - "main": "src/plugin.js", + "main": "lib/plugin.js", + "files": [ + "lib/*.js", + "*.css" + ], "keywords": [ "jupyter", "jupyterlab", "jupyterlab extension" ], + "jupyterlab": { + "extension": true + }, "scripts": { - "build": "node build_extension.js", - "watch": "watch \"npm install\" src ../component --wait 10 --ignoreDotFiles", - "preinstall": "npm install ../component", - "prepublish": "npm run build", - "extension:install": "jupyter labextension install --symlink --py --sys-prefix jupyterlab_table", - "extension:uninstall": "jupyter labextension uninstall --py --sys-prefix jupyterlab_table", - "extension:enable": "jupyter labextension enable --py --sys-prefix jupyterlab_table", - "extension:disable": "jupyter labextension disable --py --sys-prefix jupyterlab_table" + "build": "babel src --out-dir lib", + "prepublishOnly": "npm run build", + "watch": "watch \"npm run build\" src --wait 10 --ignoreDotFiles", + "extension:install": "jupyter labextension link .", + "extension:uninstall": "jupyter labextension unlink ." }, "dependencies": { - "@jupyterlab/apputils": "^0.1.3", - "@jupyterlab/codemirror": "^0.1.3", - "@jupyterlab/docregistry": "^0.1.3", - "@jupyterlab/rendermime": "^0.1.3", - "@phosphor/algorithm": "^0.1.1", - "@phosphor/virtualdom": "^0.1.1", - "@phosphor/widgets": "^0.3.0", + "@jupyterlab/apputils": "^0.3.1", + "@jupyterlab/codemirror": "^0.3.1", + "@jupyterlab/docregistry": "^0.3.1", + "@jupyterlab/rendermime": "^0.3.1", + "@phosphor/algorithm": "^1.0.0", + "@phosphor/widgets": "^1.0.0", + "jupyterlab_table_react": "file:../component", "react": "^15.3.2", "react-dom": "^15.3.2" }, "devDependencies": { - "@jupyterlab/extension-builder": "^0.10.0", + "babel-cli": "^6.24.0", "babel-core": "^6.18.2", - "babel-loader": "^6.2.7", "babel-preset-latest": "^6.16.0", "babel-preset-react": "^6.16.0", "babel-preset-stage-0": "^6.16.0", diff --git a/labextension/src/doc.js b/labextension/src/doc.js index 6efd051..f3f3bd3 100755 --- a/labextension/src/doc.js +++ b/labextension/src/doc.js @@ -32,7 +32,7 @@ class ErrorDisplay extends React.Component { } /** - * A widget for rendering jupyterlab_table files + * A widget for rendering JSONTable files */ export class DocWidget extends Widget { constructor(context) { @@ -106,6 +106,9 @@ export class DocWidget extends Widget { if (this.isAttached && this._context.isReady) this._render(); } + /** + * Render data to DOM node + */ _render() { const content = this._context.model.toString(); try { @@ -126,6 +129,9 @@ export class DocWidget extends Widget { } } + /** + * A message handler invoked on a `'path-changed'` message + */ _onPathChanged() { this.title.label = this._context.path.split('/').pop(); } diff --git a/labextension/src/output.js b/labextension/src/output.js index 990a50b..6e269d0 100755 --- a/labextension/src/output.js +++ b/labextension/src/output.js @@ -28,7 +28,7 @@ export class OutputWidget extends Widget { } /** - * A message handler invoked on an `'before-detach'` message + * A message handler invoked on a `'before-detach'` message */ onBeforeDetach(msg) { /* Dispose of resources used by this widget */ @@ -70,7 +70,6 @@ export class OutputWidget extends Widget { schema, metadata, width: this.node.offsetWidth, - height: 360, fontSize: 13 }; ReactDOM.render(React.createElement(type, props), this.node); diff --git a/labextension/src/plugin.js b/labextension/src/plugin.js index b17f9af..1ecde0a 100644 --- a/labextension/src/plugin.js +++ b/labextension/src/plugin.js @@ -4,7 +4,7 @@ import { ILayoutRestorer, InstanceTracker } from '@jupyterlab/apputils'; import { toArray, ArrayExt } from '@phosphor/algorithm'; import { OutputRenderer } from './output'; import { DocWidgetFactory } from './doc'; -import './index.css'; +import '../index.css'; /** * The name of the factory @@ -33,17 +33,6 @@ function activatePlugin(app, rendermime, registry, restorer) { /* ...or just insert it at the top */ const index = 0; - /** - * Add output renderer for application/vnd.tableschema+json data - */ - rendermime.addRenderer( - { - mimeType: 'application/vnd.tableschema+json', - renderer: new OutputRenderer() - }, - index - ); - /** * Add output renderer for application/vnd.dataresource+json data */ diff --git a/nbextension/src/index.css b/nbextension/index.css similarity index 66% rename from nbextension/src/index.css rename to nbextension/index.css index eded97e..71242ba 100644 --- a/nbextension/src/index.css +++ b/nbextension/index.css @@ -1,7 +1,9 @@ div.output_subarea.output_JSONTable { + width: 100%; max-width: 100%; + max-height: 360px; padding: 0; - padding-top: 0.4em; - font-size: 14px; + margin-top: 0.4em; overflow: hidden; + font-size: 14px; } diff --git a/nbextension/package.json b/nbextension/package.json index 0722ec1..47342ea 100644 --- a/nbextension/package.json +++ b/nbextension/package.json @@ -1,7 +1,7 @@ { "private": true, "name": "jupyterlab_table_nbextension", - "version": "0.18.0", + "version": "0.20.2", "description": "A Jupyter Notebook extension for rendering JSON Table Schema", "author": "Grant Nestor ", "main": "src/index.js", @@ -12,15 +12,15 @@ ], "scripts": { "build": "webpack", - "watch": "watch \"npm install\" src ../component --wait 10 --ignoreDotFiles", - "preinstall": "npm install ../component", - "prepublish": "npm run build", + "prepublishOnly": "npm run build", + "watch": "watch \"npm run build\" src --wait 10 --ignoreDotFiles", "extension:install": "jupyter nbextension install --symlink --py --sys-prefix jupyterlab_table", "extension:uninstall": "jupyter nbextension uninstall --py --sys-prefix jupyterlab_table", "extension:enable": "jupyter nbextension enable --py --sys-prefix jupyterlab_table", "extension:disable": "jupyter nbextension disable --py --sys-prefix jupyterlab_table" }, "dependencies": { + "jupyterlab_table_react": "file:../component", "react": "^15.3.2", "react-dom": "^15.3.2" }, diff --git a/nbextension/src/index.js b/nbextension/src/index.js index b1bdd55..b9f3d78 100644 --- a/nbextension/src/index.js +++ b/nbextension/src/index.js @@ -6,9 +6,8 @@ * dynamically. */ -__webpack_public_path__ = document - .querySelector('body') - .getAttribute('data-base-url') + +__webpack_public_path__ = + document.querySelector('body').getAttribute('data-base-url') + 'nbextensions/jupyterlab_table/'; /** diff --git a/nbextension/src/renderer.js b/nbextension/src/renderer.js index 5db5961..546ace4 100644 --- a/nbextension/src/renderer.js +++ b/nbextension/src/renderer.js @@ -2,20 +2,13 @@ import React from 'react'; import ReactDOM from 'react-dom'; import ReactDOMServer from 'react-dom/server'; import { VirtualizedGrid, VirtualizedTable } from 'jupyterlab_table_react'; -import './index.css'; +import '../index.css'; const MIME_TYPE = 'application/vnd.dataresource+json'; const CLASS_NAME = 'output_JSONTable rendered_html'; const DEFAULT_WIDTH = 840; const DEFAULT_HEIGHT = 360; -/** - * Render data to the DOM node - */ -function render(props, node) { - ReactDOM.render(, node); -} - /** * Handle when an output is cleared or removed */ @@ -33,7 +26,7 @@ function handleAddOutput(event, { output, output_area }) { /* Get rendered DOM node */ const toinsert = output_area.element.find(`.${CLASS_NAME.split(' ')[0]}`); /** e.g. Inject a static image representation into the mime bundle for - * endering on Github, etc. + * rendering on Github, etc. */ // if (toinsert[0]) { // renderLibrary.toPng(toinsert[0]).then(url => { @@ -69,8 +62,7 @@ export function register_renderer(notebook, events, OutputArea) { const props = { ...data, metadata: metadata[MIME_TYPE], - width: element.width(), - height: DEFAULT_HEIGHT, + width: this.element.width(), fontSize: 14 }; ReactDOM.render(React.createElement(type, props), toinsert[0]); diff --git a/nbextension/webpack.config.js b/nbextension/webpack.config.js index e129b34..bd0427d 100644 --- a/nbextension/webpack.config.js +++ b/nbextension/webpack.config.js @@ -10,7 +10,7 @@ var loaders = [ test: /\.js$/, include: [ path.join(__dirname, 'src'), - path.join(__dirname, 'node_modules', 'jupyterlab_table_react') + path.join(__dirname, '..', 'component') ], loader: 'babel-loader', query: { presets: [ 'latest', 'stage-0', 'react' ] } diff --git a/setup.py b/setup.py index 0ad7056..4fbf2f6 100755 --- a/setup.py +++ b/setup.py @@ -1,13 +1,14 @@ from setuptools import setup from setupbase import create_cmdclass, install_npm -cmdclass = create_cmdclass(['labextension', 'nbextension']) +cmdclass = create_cmdclass(['component', 'labextension', 'nbextension']) +cmdclass['component'] = install_npm('component') cmdclass['labextension'] = install_npm('labextension') cmdclass['nbextension'] = install_npm('nbextension') setup_args = dict( name = 'jupyterlab_table', - version = '0.18.0', + version = '0.20.2', packages = ['jupyterlab_table'], author = 'Grant Nestor', author_email = 'grantnestor@gmail.com', @@ -39,7 +40,7 @@ ], cmdclass = cmdclass, install_requires = [ - 'jupyterlab>=0.18.0', + 'jupyterlab>=0.20.2', 'notebook>=4.3.0', 'ipython>=1.0.0' ] diff --git a/uninstall.sh b/uninstall.sh deleted file mode 100644 index d695049..0000000 --- a/uninstall.sh +++ /dev/null @@ -1,21 +0,0 @@ -#!/usr/bin/env bash -nbExtFlags=$1 - -jupyter lab --version -if [ $? -eq 0 ]; then - jupyter labextension uninstall --py $nbExtFlags jupyterlab_test -fi - -jupyter notebook --version -if [ $? -eq 0 ]; then - jupyter nbextension uninstall --py $nbExtFlags jupyterlab_test -fi - -pip --version -if [ $? -eq 0 ]; then - pip uninstall -v . -else - echo "'pip --version' failed, therefore pip is not installed. In order to perform - an install of jupyterlab_table you must have both pip and npm installed on - your machine! See https://packaging.python.org/installing/ for installation instructions." -fi