Merge pull request #643 from datopian/fix/css-build

Fix/css build

dist/index.cjs.js

@@ -151,11 +151,7 @@ var Table = function Table(_ref) {
     return row;
   });
   return /*#__PURE__*/React__default['default'].createElement("div", {
-    "data-testid": "tableGrid",
+    "data-testid": "tableGrid"
-    style: {
-      height: 400,
-      width: '100%'
-    }
   }, /*#__PURE__*/React__default['default'].createElement(dataGrid.DataGrid, {
     rows: rows,
     columns: columns,
@@ -225,7 +221,7 @@ var KeyInfo = function KeyInfo(_ref) {
     return item.format;
   }).join(', ');
   return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement("section", {
-    className: "mt-8 mb-8",
+    className: "m-8",
     name: "key-info",
     id: "key-info"
   }, /*#__PURE__*/React__default['default'].createElement("h2", {
@@ -358,7 +354,7 @@ var ReadMe = function ReadMe(_ref) {
 };
 
 ReadMe.propTypes = {
-  readmeHtml: PropTypes__default['default'].string.isRequired
+  readme: PropTypes__default['default'].string.isRequired
 };
 
 /**

dist/index.esm.js

@@ -117,11 +117,7 @@ var Table = function Table(_ref) {
     return row;
   });
   return /*#__PURE__*/React.createElement("div", {
-    "data-testid": "tableGrid",
+    "data-testid": "tableGrid"
-    style: {
-      height: 400,
-      width: '100%'
-    }
   }, /*#__PURE__*/React.createElement(DataGrid, {
     rows: rows,
     columns: columns,
@@ -191,7 +187,7 @@ var KeyInfo = function KeyInfo(_ref) {
     return item.format;
   }).join(', ');
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("section", {
-    className: "mt-8 mb-8",
+    className: "m-8",
     name: "key-info",
     id: "key-info"
   }, /*#__PURE__*/React.createElement("h2", {
@@ -324,7 +320,7 @@ var ReadMe = function ReadMe(_ref) {
 };
 
 ReadMe.propTypes = {
-  readmeHtml: PropTypes.string.isRequired
+  readme: PropTypes.string.isRequired
 };
 
 /**

examples/dataset-frictionless/.babelrc

@@ -1,3 +1,5 @@
+
+   
 {
-    "presets": ["next/babel"]
+  "presets": ["next/babel"]
-  }
+}

examples/dataset-frictionless/package.json

@@ -4,9 +4,6 @@
   "author": "Datopian",
   "license": "MIT",
   "version": "0.1.0",
-  "bin": {
-    "portal": "./bin/portal.js"
-  },
   "scripts": {
     "dev": "next dev",
     "build": "next build",
@@ -15,36 +12,18 @@
     "test": "jest --coverage"
   },
   "dependencies": {
-    "@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",
     "portal": "https://github.com/datopian/portal.js",
     "postcss": "^8.2.10",
-    "prompts": "^2.4.0",
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
-    "react-plotly.js": "^2.5.1",
-    "react-table": "^7.6.3",
-    "react-vega": "^7.4.2",
     "remark": "^13.0.0",
     "remark-html": "^13.0.2",
-    "tailwindcss": "^2.0.2",
+    "tailwindcss": "^2.0.2"
-    "vega": "^5.19.1",
-    "vega-lite": "^5.0.0"
   },
   "devDependencies": {
     "@testing-library/dom": "^7.29.6",
@@ -56,4 +35,4 @@
     "jest-canvas-mock": "^2.3.1",
     "jest-dom": "^4.0.0"
   }
-}
+}

examples/dataset-frictionless/pages/index.js

@@ -81,7 +81,9 @@ export default function Home({ dataset, specs }) {
         <h1 className="text-2xl font-bold mb-4">Data Preview</h1>
         <h2 className="text-1xl">{descriptor.title}</h2>
         {resources[0].sample ? (
-          <Table columns={columns} data={tableSample} />
+          <div >
+            <Table columns={columns} data={tableSample} />
+          </div>
         ) : (
           'No preview is available for this dataset'
         )}

examples/dataset-frictionless/tailwind.config.js

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

src/components/dataset/KeyInfo.js

@@ -14,7 +14,7 @@ const KeyInfo = ({ descriptor, resources }) => {
 
     return (
         <>
-            <section className="mt-8 mb-8" name="key-info" id="key-info">
+            <section className="m-8" name="key-info" id="key-info">
                 <h2 className="text-xl font-bold mb-4">Key info</h2>
                 <div className="grid grid-cols-7 gap-4">
                     <div>

src/components/dataset/Readme.js

@@ -19,7 +19,7 @@ const ReadMe = ({ readme }) => {
 }
 
 ReadMe.propTypes = {
-    readmeHtml: PropTypes.string.isRequired
+    readme: PropTypes.string.isRequired
 }
 
 export default ReadMe

src/components/views/Table.js

@@ -14,7 +14,7 @@ const Table = ({ columns, data }) => {
     return row
   })
   return (
-    <div data-testid="tableGrid" style={{ height: 400, width: '100%' }}>
+    <div data-testid="tableGrid">
       <DataGrid rows={rows} columns={columns} pageSize={5} />
     </div>
   );

tailwind.config.js

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