Initial commit

Author: Collier Devlin

.babelrc

@@ -0,0 +1,25 @@
+{
+  "presets": [
+    [
+      "env",
+    {
+      "targets": {
+        "browsers": [
+          "last 2 versions"
+        ]
+      }
+    }
+    ]
+  ],
+  "plugins": [
+    "transform-vue-jsx",
+    "transform-object-rest-spread"
+  ],
+  "env": {
+    "test": {
+      "plugins": [
+        "istanbul"
+      ]
+    }
+  }
+}

.editorconfig

@@ -0,0 +1,9 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true

.eslintignore

@@ -0,0 +1 @@
+dist/*.js

.eslintrc.js

@@ -0,0 +1,19 @@
+module.exports = {
+  root: true,
+  parser: 'babel-eslint',
+  parserOptions: {
+    sourceType: 'module'
+  },
+  extends: 'vue',
+  // add your custom rules here
+  'rules': {
+    // allow async-await
+    'generator-star-spacing': 0,
+    // allow debugger during development
+    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0
+  },
+  globals: {
+    requestAnimationFrame: true,
+    performance: true
+  }
+}

.gitignore

@@ -0,0 +1,6 @@
+.DS_Store
+node_modules/
+npm-debug.log
+test/coverage
+yarn-error.log
+reports

.npmignore

@@ -0,0 +1,4 @@
+build
+reports
+src
+test

.stylelintrc

@@ -0,0 +1,7 @@
+{
+  "processors": ["stylelint-processor-html"],
+  "extends": "stylelint-config-standard",
+  "rules": {
+    "no-empty-source": null
+  }
+}

CONTRIBUTING.md

@@ -0,0 +1,36 @@
+# Contributing
+
+Contributions are **welcome** and will be fully **credited**.
+
+We accept contributions via Pull Requests on [Github](https://github.com//orloe-table-row-expander).
+
+
+## Pull Requests
+
+- **Keep the same style** - eslint will automatically be ran before committing
+
+- **Tip** to pass lint tests easier use the `npm run lint:fix` command
+
+- **Add tests!** - Your patch won't be accepted if it doesn't have tests.
+
+- **Document any change in behaviour** - Make sure the `README.md` and any other relevant documentation are kept up-to-date.
+
+- **Consider our release cycle** - We try to follow [SemVer v2.0.0](http://semver.org/). Randomly breaking public APIs is not an option.
+
+- **Create feature branches** - Don't ask us to pull from your master branch.
+
+- **One pull request per feature** - If you want to do more than one thing, send multiple pull requests.
+
+- **Send coherent history** - Make sure your commits message means something
+
+
+## Running Tests
+
+Launch visual tests and watch the components at the same time
+
+``` bash
+$ npm run dev
+```
+
+
+**Happy coding**!

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2017 Collier Devlin
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,2 @@
+# vue-tiles
+A vue plugin using Muuri's responsive, sortable, filterable and draggable grid layouts.

build/utils/index.js

@@ -0,0 +1,66 @@
+const ExtractTextPlugin = require('extract-text-webpack-plugin')
+const { join } = require('path')
+
+const {
+  red,
+  logError
+} = require('./log')
+
+const {
+  processStyle
+} = require('./style')
+
+const uppercamelcase = require('uppercamelcase')
+
+exports.write = require('./write')
+
+const {
+  author,
+  name,
+  version,
+  dllPlugin
+} = require('../../package.json')
+
+const authorName = author.replace(/\s+<.*/, '')
+const minExt = process.env.NODE_ENV === 'production' ? '.min' : ''
+
+exports.author = authorName
+exports.version = version
+exports.dllName = dllPlugin.name
+exports.moduleName = uppercamelcase(name)
+exports.name = name
+exports.filename = name + minExt
+exports.banner = `/*!
+ * ${name} v${version}
+ * (c) ${new Date().getFullYear()} ${authorName}
+ * Released under the MIT License.
+ */
+`
+
+// log.js
+exports.red = red
+exports.logError = logError
+
+// It'd be better to add a sass property to the vue-loader options
+// but it simply don't work
+const sassOptions = {
+  includePaths: [
+    join(__dirname, '../../node_modules')
+  ]
+}
+
+// don't extract css in test mode
+const nullLoader = process.env.NODE_ENV === 'common' ? 'null-loader!' : ''
+exports.vueLoaders =
+  process.env.BABEL_ENV === 'test' ? {
+    css: 'css-loader',
+    scss: `css-loader!sass-loader?${JSON.stringify(sassOptions)}`
+  } : {
+    css: ExtractTextPlugin.extract(`${nullLoader}css-loader`),
+    scss: ExtractTextPlugin.extract(
+      `${nullLoader}css-loader!sass-loader?${JSON.stringify(sassOptions)}`
+    )
+  }
+
+// style.js
+exports.processStyle = processStyle

build/utils/log.js

@@ -0,0 +1,27 @@
+function logError (e) {
+  console.log(e)
+}
+
+function blue (str) {
+  return `\x1b[1m\x1b[34m${str}\x1b[39m\x1b[22m`
+}
+
+function green (str) {
+  return `\x1b[1m\x1b[32m${str}\x1b[39m\x1b[22m`
+}
+
+function red (str) {
+  return `\x1b[1m\x1b[31m${str}\x1b[39m\x1b[22m`
+}
+
+function yellow (str) {
+  return `\x1b[1m\x1b[33m${str}\x1b[39m\x1b[22m`
+}
+
+module.exports = {
+  blue,
+  green,
+  red,
+  yellow,
+  logError
+}

build/utils/style.js

@@ -0,0 +1,66 @@
+const path = require('path')
+const postcss = require('postcss')
+const cssnext = require('postcss-cssnext')
+const CleanCSS = require('clean-css')
+const { logError } = require('./log.js')
+const write = require('./write.js')
+
+function processCss (style) {
+  const componentName = path.basename(style.id, '.vue')
+  return postcss([cssnext()])
+    .process(style.code, {})
+    .then(result => {
+      return {
+        name: componentName,
+        css: result.css,
+        map: result.map
+      }
+    })
+}
+
+let stylus
+function processStylus (style) {
+  try {
+    stylus = stylus || require('stylus')
+  } catch (e) {
+    logError(e)
+  }
+  const componentName = path.basename(style.id, '.vue')
+  return new Promise((resolve, reject) => {
+    stylus.render(style.code, function (err, css) {
+      if (err) return reject(err)
+      resolve({
+        original: {
+          code: style.code,
+          ext: 'styl'
+        },
+        name: componentName,
+        css
+      })
+    })
+  })
+}
+
+function processStyle (style) {
+  if (style.lang === 'css') {
+    return processCss(style)
+  } else if (style.lang === 'stylus') {
+    return processStylus(style)
+  } else {
+    throw new Error(`Unknown style language '${style.lang}'`)
+  }
+}
+
+function writeCss (style) {
+  write(`dist/${style.name}.css`, style.css)
+  if (style.original) {
+    write(`dist/${style.name}.${style.original.ext}`, style.original.code)
+  }
+  if (style.map) write(`dist/${style.name}.css.map`, style.map)
+  write(`dist/${style.name}.min.css`, new CleanCSS().minify(style.css).styles)
+}
+
+module.exports = {
+  writeCss,
+  processStyle
+}

build/utils/write.js

@@ -0,0 +1,19 @@
+const fs = require('fs')
+
+const { blue } = require('./log.js')
+
+function write (dest, code) {
+  return new Promise(function (resolve, reject) {
+    fs.writeFile(dest, code, function (err) {
+      if (err) return reject(err)
+      console.log(blue(dest) + ' ' + getSize(code))
+      resolve(code)
+    })
+  })
+}
+
+function getSize (code) {
+  return (code.length / 1024).toFixed(2) + 'kb'
+}
+
+module.exports = write

build/webpack.config.base.js

@@ -0,0 +1,75 @@
+const webpack = require('webpack')
+const ExtractTextPlugin = require('extract-text-webpack-plugin')
+const { resolve } = require('path')
+
+const {
+  banner,
+  filename,
+  version,
+  vueLoaders
+} = require('./utils')
+
+const plugins = [
+  new webpack.DefinePlugin({
+    '__VERSION__': JSON.stringify(version),
+    'process.env.NODE_ENV': '"test"'
+  }),
+  new webpack.BannerPlugin({ banner, raw: true, entryOnly: true }),
+  new ExtractTextPlugin({
+    filename: `${filename}.css`,
+    // Don't extract css in test mode
+    disable: /^(common|test)$/.test(process.env.NODE_ENV)
+  })
+]
+
+module.exports = {
+  output: {
+    path: resolve(__dirname, '../dist'),
+    filename: `${filename}.common.js`
+  },
+  entry: ['velocityjs', 'hammerjs', './src/index.js'],
+  resolve: {
+    extensions: ['.js', '.vue', '.jsx', 'css'],
+    alias: {
+      'src': resolve(__dirname, '../src')
+    }
+  },
+  plugins: [
+    new webpack.ProvidePlugin({
+      $: "jquery",
+      jQuery: "jquery"
+    })
+  ],
+  module: {
+    rules: [
+      {
+        test: /.jsx?$/,
+        use: 'babel-loader',
+        include: [
+          resolve(__dirname, '../node_modules/@material'),
+          resolve(__dirname, '../src'),
+          resolve(__dirname, '../test')
+        ]
+      },
+      {
+        test: /\.vue$/,
+        loader: 'vue-loader',
+        options: {
+          loaders: vueLoaders,
+          postcss: [require('postcss-cssnext')()],
+          optimizeSSR: false
+        }
+      },
+      {
+        test: /\.scss$/,
+        loaders: ["style", "css", "sass"],
+        include: resolve('assetsPath')
+      },
+    ]
+  },
+  node: {
+    fs: 'empty',
+    net: 'empty'
+  },
+  plugins
+}