almost finish

Author: flyingpath

README.md

@@ -0,0 +1,136 @@
+react-virtualize-search-table
+===
+
+Table powered by react-virtualized table with search and sort.
+
+demo: https://flyingpath.github.io/react-virtualize-search-table
+
+### Prop Types
+| Property | Type   | Required? | Description|
+| :------- | :----- | :-------: | :--------- |
+| title | element or string  |    | table title  |
+| columns | array  |  Y  | Array of data object with dataKey and label [Example](#Columns)  |
+| data | array  |  Y  | Array of data object with element, searchKey and orderKey. [Example](#dataExample) 
+
+### <a name="Columns"></a>columns
+
+```
+[
+    { 
+        dataKey: 'name',        
+        label: 'name' 
+    },
+    { 
+        dataKey: 'description', 
+        label: 'description' 
+    },
+    { 
+        dataKey: 'danger',      
+        label: '危機值危機值危機值危' 
+    }
+]
+```
+
+
+### <a name="dataExample"></a>data
+
+
+The keys in the object is linked to the dataKeys in columns.
+
+SearchKey is used for search.
+OrderKey  is used for sort.
+
+```
+[
+    { 
+        name  : {
+            element     : ( <div>Brian Vaughn</div> ),
+            searchKey   : 'Brian Vaughn',
+            orderKey    : 'Brian Vaughn'
+        }, 
+        description: {
+            element     : ( <div>xxxxx</div> ),
+            searchKey   : 'Software engineer',
+            orderKey    : 'Software engineer'
+        },
+        danger: {
+            element     : ( <div>0</div> ),
+            searchKey   : false,
+            orderKey    : 0
+        }
+    },
+    { 
+        name  : {
+            element     : ( <div></div> ),
+            searchKey   : 'Brian Vaughn2',
+            orderKey    : 'Brian Vaughn2'
+        }, 
+        description: {
+            element     : ( <div>xxxxx</div> ),
+            searchKey   : 'Software engineer3',
+            orderKey    : 'Software engineer3'
+        },
+        danger: {
+            element     : ( <div></div> ),
+            searchKey   : false,
+            orderKey    : 0
+        }
+    }, ...
+]
+```
+
+### Example
+
+```
+import React from 'react'
+import ReactVirtulizeSearchTable from './components/index'
+
+class App extends React.Component {
+    constructor(props) {
+        super(props)
+        this.state = {
+            columns: [],
+            data: []
+        }
+    }
+
+    render() {
+        const demo =     {
+            title: '門診紀錄列表',
+            columns:  [
+                { dataKey: 'name',        label: 'name' },
+                { dataKey: 'description', label: 'description' },
+                { dataKey: 'danger',      label: '危機值危機值危機值危' },
+            ],
+            data: [
+                { 
+                    name  : {
+                        element     : ( <div>1234</div> ),
+                        searchKey   : '12343',
+                        orderKey    : 'Brian Vaughn1'
+                    }, 
+                    description: {
+                        element     : ( <div>1234</div> ),
+                        searchKey   : '12343',
+                        orderKey    : 'Software engineer'
+                    },
+                    danger: {
+                        element     : ( <div>o</div> ),
+                        searchKey   : true,
+                        orderKey    : 1
+                    }
+                }
+            ]
+        }
+
+        return (
+            <div style={{ height: '100%' }}>
+                <ReactVirtulizeSearchTable {...demo} />
+            </div>
+        )
+    }
+
+}
+
+export default App
+```

build/asset-manifest.json

@@ -0,0 +1,24 @@
+{
+  "files": {
+    "main.css": "/static/css/main.22dbb9b8.chunk.css",
+    "main.js": "/static/js/main.c536bcc0.chunk.js",
+    "main.js.map": "/static/js/main.c536bcc0.chunk.js.map",
+    "runtime-main.js": "/static/js/runtime-main.43fcef8b.js",
+    "runtime-main.js.map": "/static/js/runtime-main.43fcef8b.js.map",
+    "static/css/2.71916e70.chunk.css": "/static/css/2.71916e70.chunk.css",
+    "static/js/2.c7602393.chunk.js": "/static/js/2.c7602393.chunk.js",
+    "static/js/2.c7602393.chunk.js.map": "/static/js/2.c7602393.chunk.js.map",
+    "index.html": "/index.html",
+    "precache-manifest.79447699682972c07e34efaba6423d93.js": "/precache-manifest.79447699682972c07e34efaba6423d93.js",
+    "service-worker.js": "/service-worker.js",
+    "static/css/2.71916e70.chunk.css.map": "/static/css/2.71916e70.chunk.css.map",
+    "static/css/main.22dbb9b8.chunk.css.map": "/static/css/main.22dbb9b8.chunk.css.map"
+  },
+  "entrypoints": [
+    "static/js/runtime-main.43fcef8b.js",
+    "static/css/2.71916e70.chunk.css",
+    "static/js/2.c7602393.chunk.js",
+    "static/css/main.22dbb9b8.chunk.css",
+    "static/js/main.c536bcc0.chunk.js"
+  ]
+}

build/favicon.ico

@@ -0,0 +1 @@
+<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="shortcut icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site created using create-react-app"/><link rel="apple-touch-icon" href="logo192.png"/><link rel="manifest" href="/manifest.json"/><title>React App</title><link href="/static/css/2.71916e70.chunk.css" rel="stylesheet"><link href="/static/css/main.22dbb9b8.chunk.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script>!function(i){function e(e){for(var r,t,n=e[0],o=e[1],u=e[2],a=0,l=[];a<n.length;a++)t=n[a],Object.prototype.hasOwnProperty.call(f,t)&&f[t]&&l.push(f[t][0]),f[t]=0;for(r in o)Object.prototype.hasOwnProperty.call(o,r)&&(i[r]=o[r]);for(s&&s(e);l.length;)l.shift()();return p.push.apply(p,u||[]),c()}function c(){for(var e,r=0;r<p.length;r++){for(var t=p[r],n=!0,o=1;o<t.length;o++){var u=t[o];0!==f[u]&&(n=!1)}n&&(p.splice(r--,1),e=a(a.s=t[0]))}return e}var t={},f={1:0},p=[];function a(e){if(t[e])return t[e].exports;var r=t[e]={i:e,l:!1,exports:{}};return i[e].call(r.exports,r,r.exports,a),r.l=!0,r.exports}a.m=i,a.c=t,a.d=function(e,r,t){a.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},a.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},a.t=function(r,e){if(1&e&&(r=a(r)),8&e)return r;if(4&e&&"object"==typeof r&&r&&r.__esModule)return r;var t=Object.create(null);if(a.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:r}),2&e&&"string"!=typeof r)for(var n in r)a.d(t,n,function(e){return r[e]}.bind(null,n));return t},a.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return a.d(r,"a",r),r},a.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},a.p="/";var r=this["webpackJsonpreact-virtualize-search-table"]=this["webpackJsonpreact-virtualize-search-table"]||[],n=r.push.bind(r);r.push=e,r=r.slice();for(var o=0;o<r.length;o++)e(r[o]);var s=n;c()}([])</script><script src="/static/js/2.c7602393.chunk.js"></script><script src="/static/js/main.c536bcc0.chunk.js"></script></body></html>

build/index.html

@@ -0,0 +1,25 @@
+{
+  "short_name": "React App",
+  "name": "Create React App Sample",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    },
+    {
+      "src": "logo192.png",
+      "type": "image/png",
+      "sizes": "192x192"
+    },
+    {
+      "src": "logo512.png",
+      "type": "image/png",
+      "sizes": "512x512"
+    }	    
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

build/logo192.png

@@ -0,0 +1,26 @@
+self.__precacheManifest = (self.__precacheManifest || []).concat([
+  {
+    "revision": "1c93883e7983967d9cf7037e2181dfdd",
+    "url": "/index.html"
+  },
+  {
+    "revision": "9ab853f67a1b072d4f73",
+    "url": "/static/css/2.71916e70.chunk.css"
+  },
+  {
+    "revision": "64d632d0aeb8f97f78fe",
+    "url": "/static/css/main.22dbb9b8.chunk.css"
+  },
+  {
+    "revision": "9ab853f67a1b072d4f73",
+    "url": "/static/js/2.c7602393.chunk.js"
+  },
+  {
+    "revision": "64d632d0aeb8f97f78fe",
+    "url": "/static/js/main.c536bcc0.chunk.js"
+  },
+  {
+    "revision": "8a189f75ad33b7735ca9",
+    "url": "/static/js/runtime-main.43fcef8b.js"
+  }
+]);

build/logo512.png

@@ -0,0 +1,2 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *

build/manifest.json

@@ -0,0 +1,39 @@
+/**
+ * Welcome to your Workbox-powered service worker!
+ *
+ * You'll need to register this file in your web app and you should
+ * disable HTTP caching for this file too.
+ * See https://goo.gl/nhQhGp
+ *
+ * The rest of the code is auto-generated. Please don't update this file
+ * directly; instead, make changes to your Workbox build configuration
+ * and re-run your build process.
+ * See https://goo.gl/2aRDsh
+ */
+
+importScripts("https://storage.googleapis.com/workbox-cdn/releases/4.3.1/workbox-sw.js");
+
+importScripts(
+  "/precache-manifest.79447699682972c07e34efaba6423d93.js"
+);
+
+self.addEventListener('message', (event) => {
+  if (event.data && event.data.type === 'SKIP_WAITING') {
+    self.skipWaiting();
+  }
+});
+
+workbox.core.clientsClaim();
+
+/**
+ * The workboxSW.precacheAndRoute() method efficiently caches and responds to
+ * requests for URLs in the manifest.
+ * See https://goo.gl/S9QRab
+ */
+self.__precacheManifest = [].concat(self.__precacheManifest || []);
+workbox.precaching.precacheAndRoute(self.__precacheManifest, {});
+
+workbox.routing.registerNavigationRoute(workbox.precaching.getCacheKeyForURL("/index.html"), {
+  
+  blacklist: [/^\/_/,/\/[^\/?]+\.[^\/]+$/],
+});