Ported Thunk from an earlier JS prototype to Typescript.

Implementation by @anorth and @aschuck.

Co-authored-by: Adam Schuck <[email protected]>

.gitignore

@@ -0,0 +1,5 @@
+node_modules
+dist
+
+.idea/workspace.xml
+.idea/watcherTasks.xml

package.json

@@ -0,0 +1,58 @@
+{
+  "name": "thunk",
+  "version": "0.1.0",
+  "description": "In-browser enterprise search engine Chrome extension",
+  "author": "anorth & aschuck",
+  "license": "MIT",
+  "private": true,
+  "scripts": {
+    "dev": "webpack-dev-server --config webpack.dev.js --inline --disable-host-check --progress --colors --watch",
+    "build": "webpack --config webpack.prod.js"
+  },
+  "devDependencies": {
+    "@types/bluebird": "^3.5.25",
+    "@types/chrome": "^0.0.78",
+    "@types/htmlparser2": "^3.7.31",
+    "@types/lodash": "^4.14.120",
+    "@types/node": "^10.12.18",
+    "@types/react": "^16.7.21",
+    "@types/react-dom": "^16.0.11",
+    "@types/react-hot-loader": "^4.1.0",
+    "@types/styled-components": "^4.1.6",
+    "clean-webpack-plugin": "^1.0.1",
+    "copy-webpack-plugin": "^4.6.0",
+    "css-loader": "^2.1.1",
+    "file-loader": "^3.0.1",
+    "html-webpack-plugin": "^3.2.0",
+    "mobx": "^5.9.4",
+    "mobx-react": "^5.4.3",
+    "mobx-react-devtools": "^6.1.1",
+    "node-sass": "^4.12.0",
+    "sass-loader": "^7.1.0",
+    "style-loader": "^0.23.1",
+    "ts-loader": "^5.3.3",
+    "tslint": "^5.12.1",
+    "tslint-loader": "^3.5.4",
+    "tslint-react": "^3.6.0",
+    "typescript": "^3.2.4",
+    "webpack": "^4.29.0",
+    "webpack-cli": "^3.2.1",
+    "webpack-dev-server": "^3.1.14",
+    "webpack-merge": "^4.2.1",
+    "write-file-webpack-plugin": "^4.5.0"
+  },
+  "dependencies": {
+    "axios": "^0.18.0",
+    "bluebird": "^3.5.3",
+    "dexie": "^2.0.4",
+    "htmlparser2": "^3.10.0",
+    "lodash": "^4.17.11",
+    "minisearch": "^2.0.6",
+    "moment": "^2.24.0",
+    "react": "^16.7.0",
+    "react-dom": "^16.7.0",
+    "react-hot-loader": "^4.6.3",
+    "styled-components": "^4.1.3",
+    "urlparse": "^0.0.1"
+  }
+}

src/app/_constants.scss

@@ -0,0 +1,22 @@
+// Paths
+//$img: '../images/';
+
+// Typography
+$font-body-sans: 'Open Sans';
+$font-body-sans-normal: 400;
+$font-body-sans-semibold: 600;
+
+$font-header: 'Merriweather';
+
+// Text colors
+$body-text-dark-color: #4a4a4a;
+$body-text-mid-color: #6e6e6e;
+$hyperlink-color: #4A90E2;
+$success-color: #7ED321;
+
+$swan-gray: #f8f8f8;
+$feather-gray: #DBDBDB;
+$mouse-gray: #979797;
+
+$google-blue: #427cf0;
+$google-blue-darker: #4173c9;

src/app/_mixins.scss

@@ -0,0 +1,90 @@
+/**
+ * Generic CSS mixins
+ */
+@mixin vendor-prefix($property, $value) {
+  -webkit-#{$property}: #{$value};
+  -khtml-#{$property}: #{$value};
+  -moz-#{$property}: #{$value};
+  -ms-#{$property}: #{$value};
+  -o-#{$property}: #{$value};
+  #{$property}: #{$value};
+}
+
+/** Fits a background image to its container. */
+@mixin background-image-fit($path, $position: center center) {
+  background: url($path) no-repeat $position;
+  background-size: contain;
+}
+
+@mixin box-sizing($type) {
+  @include vendor-prefix('box-sizing', $type);
+}
+
+@mixin border-radius($radius) {
+  @include vendor-prefix('border-radius', $radius);
+}
+
+@mixin box-shadow($x: 2px, $y: 2px, $blur: 5px, $color: rgba(0,0,0,.4)) {
+  @include vendor-prefix('box-shadow', $x $y $blur $color);
+}
+
+@mixin clip-path($clip) {
+  @include vendor-prefix('clip-path', $clip);
+}
+
+@mixin column-count($count) {
+  @include vendor-prefix('column-count', $count)
+}
+
+@mixin display-flex($dir: 'row', $wrap: 'nowrap') {
+  // See https://css-tricks.com/using-flexbox/ for more
+  display: -ms-flexbox; // IE 10
+  display: -webkit-flex; // Safari
+  display: flex;
+  @include vendor-prefix('flex-flow', $dir $wrap)
+}
+
+@mixin flex-grow($grow) {
+  @include vendor-prefix('flex-grow', $grow)
+}
+
+@mixin flex-align-content($alignment) {
+  @include vendor-prefix('align-content', $alignment)
+}
+
+@mixin flex-align-items($alignment) {
+  @include vendor-prefix('align-items', $alignment)
+}
+
+@mixin flex-justify-content($alignment) {
+  @include vendor-prefix('justify-content', $alignment)
+}
+
+@mixin flex-shrink($shrink) {
+  @include vendor-prefix('flex-shrink', $shrink)
+}
+
+@mixin gradient($from, $to) {
+  background: -webkit-gradient(linear, left top, left bottom, from($from), to($to));
+  background: -moz-linear-gradient(top,  $from, $to);
+  filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$from}', endColorstr='#{$to}');
+}
+
+@mixin inset-shadow($x: 2px, $y: 2px, $blur: 5px, $color: rgba(0,0,0,.4)) {
+  @include vendor-prefix('box-shadow', inset $x $y $blur $color)
+}
+
+@mixin keyframes($name) {
+  @-webkit-keyframes #{$name} {
+    @content;
+  }
+  @-moz-keyframes #{$name} {
+    @content;
+  }
+  @-ms-keyframes #{$name} {
+    @content;
+  }
+  @keyframes #{$name} {
+    @content;
+  }
+}

src/app/_spinner.scss

@@ -0,0 +1,22 @@
+@import 'mixins';
+
+// From http://tobiasahlin.com/spinkit/
+@mixin spinner-scaleout($size, $color, $duration: 1.0s) {
+  width: $size;
+  height: $size;
+  background-color: $color;
+  border-radius: 100%;
+
+  -webkit-animation: scaleout $duration infinite ease-in-out;
+  animation: scaleout $duration infinite ease-in-out;
+}
+
+@include keyframes(scaleout) {
+  0% {
+    @include vendor-prefix(transform, scale(0.0));
+  }
+  100% {
+    @include vendor-prefix(transform, scale(1.0));
+    opacity: 0;
+  }
+}