[Base][m]: Set up component library base and build scripts

packages/portal/.babelrc

@@ -0,0 +1,3 @@
+{
+  "presets": ["@babel/env", "@babel/preset-react"]
+}

packages/portal/.gitignore

@@ -0,0 +1,33 @@
+# dependencies
+node_modules/
+.pnp
+.pnp.js
+
+# testing
+coverage
+cypress/videos
+
+# next.js
+.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# output
+dist/

packages/portal/README.md

@@ -0,0 +1 @@
+Portaljs component library

packages/portal/dist/index.cjs.js

@@ -0,0 +1,46 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var dataGrid = require('@material-ui/data-grid');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+/* eslint-disable max-len */
+/*
+ * @param schema: Frictionless Table Schmea
+ * @param data: an array of data objects e.g. [ {a: 1, b: 2}, {a: 5, b: 7} ]
+ */
+
+var Table = function Table(_ref) {
+  var schema = _ref.schema,
+      data = _ref.data;
+  var columns = schema.fields.map(function (field) {
+    return {
+      field: field.title || field.name,
+      headerName: field.name,
+      width: 300
+    };
+  });
+  data = data.map(function (item, index) {
+    item.id = index; //Datagrid requires every row to have an ID
+
+    return item;
+  });
+  return /*#__PURE__*/React__default['default'].createElement("div", {
+    "data-testid": "tableGrid",
+    style: {
+      height: 400,
+      width: '100%'
+    }
+  }, /*#__PURE__*/React__default['default'].createElement(dataGrid.DataGrid, {
+    rows: data,
+    columns: columns,
+    pageSize: 5
+  }));
+};
+
+exports.Table = Table;

packages/portal/dist/index.esm.js

@@ -0,0 +1,38 @@
+import React from 'react';
+import { DataGrid } from '@material-ui/data-grid';
+
+/* eslint-disable max-len */
+/*
+ * @param schema: Frictionless Table Schmea
+ * @param data: an array of data objects e.g. [ {a: 1, b: 2}, {a: 5, b: 7} ]
+ */
+
+var Table = function Table(_ref) {
+  var schema = _ref.schema,
+      data = _ref.data;
+  var columns = schema.fields.map(function (field) {
+    return {
+      field: field.title || field.name,
+      headerName: field.name,
+      width: 300
+    };
+  });
+  data = data.map(function (item, index) {
+    item.id = index; //Datagrid requires every row to have an ID
+
+    return item;
+  });
+  return /*#__PURE__*/React.createElement("div", {
+    "data-testid": "tableGrid",
+    style: {
+      height: 400,
+      width: '100%'
+    }
+  }, /*#__PURE__*/React.createElement(DataGrid, {
+    rows: data,
+    columns: columns,
+    pageSize: 5
+  }));
+};
+
+export { Table };

packages/portal/jest.config.js

@@ -0,0 +1,8 @@
+module.exports = {
+    testPathIgnorePatterns: ["<rootDir>/.next/", "<rootDir>/node_modules/", "<rootDir>/examples/catalog/*"],
+    setupFilesAfterEnv: ["<rootDir>/tests/setupTests.js"],
+    transform: {
+      "^.+\\.(js|jsx|ts|tsx)$": "<rootDir>/node_modules/babel-jest",
+      "\\.(css|less|scss|sass)$": "identity-obj-proxy"
+    }
+  };

packages/portal/package.json

@@ -0,0 +1,74 @@
+{
+  "name": "portal",
+  "description": "The data presentation framework",
+  "author": "Datopian",
+  "license": "MIT",
+  "version": "0.1.0",
+  "main": "dist/index.cjs.js",
+  "module": "dist/index.esm.js",
+  "source": "src/index.js",
+  "scripts": {
+    "build": "rollup -c",
+    "build-watch": "rollup -c -w",
+    "test": "jest --coverage"
+  },
+  "eslintConfig": {
+    "extends": "react-app"
+  },
+  "peerDependencies": {
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1"
+  },
+  "dependencies": {
+    "@testing-library/jest-dom": "^4.2.4",
+    "@testing-library/react": "^9.5.0",
+    "@testing-library/user-event": "^7.2.1",
+    "react-scripts": "3.4.3",
+    "@material-ui/core": "^4.11.3",
+    "@material-ui/data-grid": "^4.0.0-alpha.20",
+    "@tailwindcss/typography": "^0.4.0",
+    "autoprefixer": "^10.0.4",
+    "chalk": "^4.1.0",
+    "commander": "^6.2.0",
+    "cpy": "^8.1.1",
+    "cross-spawn": "^7.0.3",
+    "datapackage-render": "git+https://github.com/frictionlessdata/datapackage-render-js.git",
+    "figlet": "^1.5.0",
+    "filesize": "^6.1.0",
+    "frictionless.js": "^0.13.4",
+    "listr": "^0.14.3",
+    "next": "latest",
+    "open": "^8.0.2",
+    "ora": "^5.1.0",
+    "plotly.js-basic-dist": "^1.58.4",
+    "postcss": "^8.1.10",
+    "prompts": "^2.4.0",
+    "react-plotly.js": "^2.5.1",
+    "react-table": "^7.6.3",
+    "react-vega": "^7.4.2",
+    "remark": "^13.0.0",
+    "remark-html": "^13.0.1",
+    "tailwindcss": "^2.0.2",
+    "vega": "^5.19.1",
+    "vega-lite": "^5.0.0"
+  },
+  "devDependencies": {
+    "@babel/cli": "^7.13.16",
+    "@babel/core": "^7.13.16",
+    "@babel/preset-env": "^7.13.15",
+    "@babel/preset-react": "^7.13.13",
+    "@rollup/plugin-babel": "^5.3.0",
+    "@testing-library/dom": "^7.29.6",
+    "@testing-library/jest-dom": "^5.11.9",
+    "@testing-library/react": "^11.2.5",
+    "babel-jest": "^26.6.3",
+    "identity-obj-proxy": "^3.0.0",
+    "jest": "^26.6.3",
+    "jest-canvas-mock": "^2.3.1",
+    "jest-dom": "^4.0.0",
+    "npm-run-all": "^4.1.5",
+    "rollup": "^2.45.2",
+    "rollup-plugin-delete": "^2.0.0",
+    "rollup-plugin-peer-deps-external": "^2.2.4"
+  }
+}

packages/portal/postcss.config.js

@@ -0,0 +1,8 @@
+// If you want to use other PostCSS plugins, see the following:
+// https://tailwindcss.com/docs/using-with-preprocessors
+module.exports = {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}

packages/portal/rollup.config.js

@@ -0,0 +1,20 @@
+import babel from '@rollup/plugin-babel';
+import external from 'rollup-plugin-peer-deps-external';
+import del from 'rollup-plugin-delete';
+import pkg from './package.json';
+
+export default {
+    input: pkg.source,
+    output: [
+        { file: pkg.main, format: 'cjs' },
+        { file: pkg.module, format: 'esm' }
+    ],
+    plugins: [
+        external(),
+        babel({
+            exclude: 'node_modules/**'
+        }),
+        del({ targets: ['dist/*'] }),
+    ],
+    external: Object.keys(pkg.peerDependencies || {}),
+};

packages/portal/tailwind.config.js

@@ -0,0 +1,22 @@
+const defaultTheme = require("tailwindcss/defaultTheme");
+
+module.exports = {
+  purge: ['./pages/**/*.{js,ts,jsx,tsx}', './components/**/*.{js,ts,jsx,tsx}'],
+  darkMode: false, // or 'media' or 'class'
+  theme: {
+    container: {
+      center: true,
+    },
+    extend: {
+      fontFamily: {
+        mono: ["Inconsolata", ...defaultTheme.fontFamily.mono]
+      }
+    },
+  },
+  variants: {
+    extend: {},
+  },
+  plugins: [
+    require('@tailwindcss/typography'),
+  ],
+}