Init with skeleton

.eslintrc.json

@@ -0,0 +1,14 @@
+{
+  "extends": "vaadin",
+  "env": {
+    "browser": true,
+    "node": true,
+    "es6": true
+  },
+  "plugins": [
+    "html"
+  ],
+  "globals": {
+    "Polymer": false
+  }
+}

.gemini.yml

@@ -0,0 +1,49 @@
+rootUrl: http://127.0.0.1:3000/test/visual
+gridUrl: http://127.0.0.1:4444/wd/hub
+screenshotsDir: ./test/visual/screens
+
+system:
+  plugins:
+    express:
+      port: 3000
+    sauce: true
+
+browsers:
+  chrome:
+    desiredCapabilities:
+      browserName: "chrome"
+      version: "55.0"
+      platform: "Windows 10"
+
+  firefox:
+    desiredCapabilities:
+      browserName: "firefox"
+      version: "47.0"
+      platform: "Windows 10"
+
+  edge:
+    desiredCapabilities:
+      browserName: "microsoftedge"
+      version: "14"
+      platform: "Windows 10"
+
+  # The following setups don't currently work due to Selenium SafariDriver issue
+  # https://github.com/vaadin/vaadin-element-skeleton/issues/19
+  #
+  # safari:
+  #   desiredCapabilities:
+  #     browserName: "safari"
+  #     version: "10.0"
+  #     platform: "OS X 10.11"
+  #
+  # iphone:
+  #   desiredCapabilities:
+  #     browserName: "iphone"
+  #     version: "9.2"
+  #     platform: "OS X 10.11"
+  #
+  # ipad:
+  #   desiredCapabilities:
+  #     browserName: "ipad"
+  #     version: "9.2"
+  #     platform: "OS X 10.11"

.gitignore

@@ -0,0 +1,2 @@
+bower_components
+node_modules

.stylelintrc

@@ -0,0 +1,3 @@
+{
+  "extends": "stylelint-config-vaadin"
+}

.travis.yml

@@ -0,0 +1,25 @@
+sudo: false
+dist: trusty
+language: node_js
+node_js: stable
+
+cache:
+  directories:
+    - node_modules
+
+addons:
+  firefox: latest
+  google-chrome: latest
+
+install:
+  - npm install
+  - npm install -g bower
+  - bower install
+
+before_script:
+  - gulp lint
+  - ([ "$TRAVIS_EVENT_TYPE" = "pull_request" ] || TRAVIS_BRANCH=quick/${TRAVIS_BUILD_ID} xvfb-run -s '-screen 0 1024x768x24' wct)
+
+script:
+  - ([ "$TRAVIS_EVENT_TYPE" = "pull_request" ] || gemini test test/visual)
+  - xvfb-run -s '-screen 0 1024x768x24' wct

LICENSE

@@ -175,18 +175,7 @@
 
    END OF TERMS AND CONDITIONS
 
-   APPENDIX: How to apply the Apache License to your work.
-
-      To apply the Apache License to your work, attach the following
-      boilerplate notice, with the fields enclosed by brackets "{}"
-      replaced with your own identifying information. (Don't include
-      the brackets!)  The text should be enclosed in the appropriate
-      comment syntax for the file format. We also recommend that a
-      file or class name and description of purpose be included on the
-      same "printed page" as the copyright notice for easier
-      identification within third-party archives.
-
-   Copyright {yyyy} {name of copyright owner}
+   Copyright 2017 Vaadin Ltd.
 
    Licensed under the Apache License, Version 2.0 (the "License");
    you may not use this file except in compliance with the License.

README.md

@@ -0,0 +1,74 @@
+![Bower version](https://img.shields.io/bower/v/vaadin-button.svg)
+[![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://beta.webcomponents.org/element/vaadin/vaadin-button)
+[![Build Status](https://travis-ci.org/vaadin/vaadin-button.svg?branch=master)](https://travis-ci.org/vaadin/vaadin-button)
+[![Gitter](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/vaadin/vaadin-core-elements?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge)
+
+# <vaadin-button>
+
+[Live Demo ↗](https://cdn.vaadin.com/vaadin-core-elements/master/vaadin-button/demo/)
+
+[<vaadin-button>](https://vaadin.com/elements/-/element/vaadin-button) is a [Polymer](http://polymer-project.org) element providing <element-functionality>, part of the [Vaadin Core Elements](https://vaadin.com/elements).
+
+<!--
+```
+<custom-element-demo>
+  <template>
+    <link rel="import" href="vaadin-button.html">
+    <next-code-block></next-code-block>
+  </template>
+</custom-element-demo>
+```
+-->
+```html
+<vaadin-button>
+  ...
+</vaadin-button>
+```
+
+[<img src="https://raw.githubusercontent.com/vaadin/vaadin-button/master/screenshot.png" width="200" alt="Screenshot of vaadin-button">](https://vaadin.com/elements/-/element/vaadin-button)
+
+
+## Contributing
+
+1. Fork the `vaadin-button` repository and clone it locally.
+
+1. Make sure you have [npm](https://www.npmjs.com/) installed.
+
+1. When in the `vaadin-button` directory, run `npm install` to install dependencies.
+
+
+## Running demos and tests in browser
+
+1. Install [polyserve](https://www.npmjs.com/package/polyserve): `npm install -g polyserve`
+
+1. When in the `vaadin-button` directory, run `polyserve --open`, browser will automatically open the component API documentation.
+
+1. You can also open demo or in-browser tests by adding **demo** or **test** to the URL, for example:
+
+  - http://127.0.0.1:8080/components/vaadin-date-picker/demo
+  - http://127.0.0.1:8080/components/vaadin-date-picker/test
+
+
+## Running tests from the command line
+
+1. Install [web-component-tester](https://www.npmjs.com/package/web-component-tester): `npm install -g web-component-tester`
+
+1. When in the `vaadin-button` directory, run `wct` or `npm test`
+
+
+## Following the coding style
+
+We are using [ESLint](http://eslint.org/) for linting JavaScript code. You can check if your code is following our standards by running `gulp lint`, which will automatically lint all `.js` files as well as JavaScript snippets inside `.html` files.
+
+
+## Creating a pull request
+
+  - Make sure your code is compliant with our code linters: `gulp lint`
+  - Check that tests are passing: `npm test`
+  - [Submit a pull request](https://www.digitalocean.com/community/tutorials/how-to-create-a-pull-request-on-github) with detailed title and description
+  - Wait for response from one of Vaadin Elements team members
+
+
+## License
+
+Apache License 2.0

bower.json

@@ -0,0 +1,39 @@
+{
+  "name": "vaadin-button",
+  "homepage": "https://vaadin.com/elements",
+  "authors": [
+    "Vaadin Ltd"
+  ],
+  "description": "vaadin-button",
+  "main": "vaadin-button.html",
+  "keywords": [
+    "Vaadin",
+    "button",
+    "web-components",
+    "web-component",
+    "polymer"
+  ],
+  "license": "Apache-2.0",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "test",
+    "gulpfile.js",
+    "package.json",
+    "wct.conf.js"
+  ],
+  "devDependencies": {
+    "web-component-tester": "^5.0.0",
+    "test-fixture": "2.0.0",
+    "elements-demo-resources": "vaadin/elements-demo-resources#2.0-preview",
+    "iron-component-page": "polymerelements/iron-component-page#2.0-preview",
+    "iron-demo-helpers": "polymerelements/iron-demo-helpers#2.0-preview"
+  },
+  "resolutions": {
+    "test-fixture": "^2.0.0"
+  },
+  "dependencies": {
+    "polymer": "Polymer/polymer#2.0-preview"
+  }
+}

demo/advanced.html

@@ -0,0 +1,21 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1" />
+  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+
+  <title>vaadin-button Advanced Examples</title>
+
+  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
+  <link rel="import" href="common.html">
+</head>
+
+<body>
+  <div class="vertical-section-container centered">
+
+    <demo-navigation></demo-navigation>
+
+  </div>
+</body>
+</html>

demo/common.html

@@ -0,0 +1,20 @@
+<!-- Common imports for all examples -->
+<link rel="import" href="../../iron-demo-helpers/demo-snippet.html">
+<link rel="import" href="../../iron-flex-layout/iron-flex-layout-classes.html">
+<style is="custom-style" include="iron-flex iron-flex-alignment"></style>
+<link rel="import" href="../../paper-styles/default-theme.html">
+
+<link rel="import" href="../../elements-demo-resources/common.html">
+<link rel="import" href="../../elements-demo-resources/demo-navigation.html">
+
+<!-- The component to demo -->
+<link rel="import" href="../vaadin-button.html">
+
+<!-- Common JS code for all examples -->
+<script>
+  // Menu configuration
+  window.demos = [
+     {name: 'index', title: 'Basic Examples'},
+     {name: 'advanced', title: 'Advanced Usage'}
+  ];
+</script>

demo/index.html

@@ -0,0 +1,27 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1" />
+  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+
+  <title>vaadin-button Basic Examples</title>
+
+  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
+  <link rel="import" href="common.html">
+</head>
+
+<body>
+  <div class="vertical-section-container centered">
+
+    <demo-navigation></demo-navigation>
+
+    <h3>Sample example</h3>
+    <demo-snippet>
+      <template>
+        <vaadin-button></vaadin-button>
+      </template>
+    </demo-snippet>
+  </div>
+</body>
+</html>

gulpfile.js

@@ -0,0 +1,48 @@
+'use strict';
+
+var gulp = require('gulp');
+var eslint = require('gulp-eslint');
+var htmlExtract = require('gulp-html-extract');
+var stylelint = require('gulp-stylelint');
+
+gulp.task('lint', ['lint:js', 'lint:html', 'lint:css']);
+
+gulp.task('lint:js', function() {
+  return gulp.src([
+    '*.js',
+    'test/*.js'
+  ])
+  .pipe(eslint())
+  .pipe(eslint.format())
+  .pipe(eslint.failAfterError('fail'));
+});
+
+gulp.task('lint:html', function() {
+  return gulp.src([
+    '*.html',
+    'demo/*.html',
+    'test/*.html'
+  ])
+  .pipe(htmlExtract({
+    sel: 'script, code-example code'
+  }))
+  .pipe(eslint())
+  .pipe(eslint.format())
+  .pipe(eslint.failAfterError('fail'));
+});
+
+gulp.task('lint:css', function() {
+  return gulp.src([
+    '*.html',
+    'demo/*.html',
+    'test/*.html'
+  ])
+  .pipe(htmlExtract({
+    sel: 'style'
+  }))
+  .pipe(stylelint({
+    reporters: [
+      {formatter: 'string', console: true}
+    ]
+  }));
+});

index.html

@@ -0,0 +1,14 @@
+<!doctype html>
+
+<html>
+  <head>
+    <title>vaadin-button</title>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <script src="../webcomponentsjs/webcomponents-lite.js"></script>
+    <link rel="import" href="../iron-component-page/iron-component-page.html">
+  </head>
+  <body>
+    <iron-component-page src="vaadin-button.html"></iron-component-page>
+  </body>
+</html>