Merge pull request #10 from FabricElements/feature/update

Migrate to Polymer 3
FabricElements · Sep 13, 2018 · 3bc5486 · 3bc5486
2 parents 1f5f588 + b8b1230
commit 3bc5486
Show file tree

Hide file tree

Showing 6 changed files with 38 additions and 62 deletions.
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -4,7 +4,8 @@
     "google"
   ],
   "parserOptions": {
-    "ecmaVersion": 6
+    "ecmaVersion": 6,
+    "sourceType": "module"
   },
   "env": {
     "browser": true,

diff --git a/bower.json b/bower.json
diff --git a/demo/index.html b/demo/index.html
@@ -7,13 +7,16 @@
   <title>skeleton-smart-invite demo</title>
 
   <script src="../node_modules/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script>
+  <script src="../node_modules/@webcomponents/webcomponentsjs/webcomponents-bundle.js"></script>
+  <script src="../node_modules/firebase/firebase.js"></script>
+  <script src="../node_modules/@fabricelements/firebase-config/index.js"></script>
   <script type="module">
-    import '@polymer/iron-demo-helpers/demo-pages-shared-styles';
-    import '@polymer/iron-demo-helpers/demo-snippet';
-    import '@polymer/polymer/lib/elements/dom-if.js';
+    import '@polymer/iron-demo-helpers/demo-pages-shared-styles.js';
+    import '@polymer/iron-demo-helpers/demo-snippet.js';
     import '@polymer/polymer/lib/elements/dom-bind.js';
-    import '/polymerfire/polymerfire.js';
-    import '/skeleton-auth/skeleton-auth.js';</script>
+    import '@polymer/polymer/lib/elements/dom-if.js';
+    import '@fabricelements/skeleton-auth/skeleton-auth.js';
+  </script>
   <script type="module" src="../skeleton-smart-invite.js"></script>
 
   <custom-style>
@@ -24,32 +27,21 @@
 <body>
 <div class="vertical-section-container centered">
   <h3>Basic skeleton-smart-invite demo</h3>
-  <dom-bind>
+  <demo-snippet>
     <template>
-      <firebase-app project-id="fabricelements" auth-domain="fabricelements.firebaseapp.com"
-                    database-url="https://fabricelements.firebaseio.com"
-                    api-key="AIzaSyCJRNdR0eodnswyi8MHCtF1YOjY235mhM8" storage-bucket="fabricelements.appspot.com"
-                    messagingsenderid="908593247251"></firebase-app>
-
-      <firebase-auth signed-in="{{signedIn}}" user="{{user}}" on-error="handleError">
-      </firebase-auth>
-
-      <dom-if if="[[!signedIn]]">
+      <dom-bind>
         <template>
-          <skeleton-auth google="">
-          </skeleton-auth>
+          <div hidden="[[signedIn]]">
+            <skeleton-auth google
+                           signed-in="{{signedIn}}"
+                           user="{{user}}"></skeleton-auth>
+          </div>
+          <skeleton-smart-invite
+            info="{&quot;organization&quot;:&quot;FabricElements&quot;,&quot;rol&quot;:&quot;admin&quot;}"></skeleton-smart-invite>
         </template>
-      </dom-if>
-      <dom-if if="[[signedIn]]">
-        <demo-snippet>
-          <template>
-            <skeleton-smart-invite
-              info="{&quot;organization&quot;:&quot;FabricElements&quot;,&quot;rol&quot;:&quot;admin&quot;}"></skeleton-smart-invite>
-          </template>
-        </demo-snippet>
-      </dom-if>
+      </dom-bind>
     </template>
-  </dom-bind>
+  </demo-snippet>
 </div>
 </body>
 </html>
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@fabricelements/skeleton-smart-invite",
   "main": "skeleton-smart-invite.js",
-  "version": "0.0.1",
+  "version": "3.0.0",
   "license": "BSD-3-Clause",
   "repository": {
     "type": "git",
@@ -23,10 +23,13 @@
     "serve": "polymer serve -H 0.0.0.0"
   },
   "dependencies": {
-    "@polymer/polymer": "^3.0.0",
-    "@polymer/paper-input": "^3.0.0-pre.18",
+    "@fabricelements/firebase-config": "0.0.1",
+    "@fabricelements/skeleton-auth": "0.0.1",
     "@polymer/iron-icons": "^3.0.0-pre.18",
-    "@polymer/paper-button": "^3.0.0-pre.18"
+    "@polymer/paper-button": "^3.0.0-pre.18",
+    "@polymer/paper-input": "^3.0.0-pre.18",
+    "@polymer/polymer": "^3.0.0",
+    "firebase": "^5.4.2"
   },
   "resolutions": {
     "inherits": "2.0.3",

diff --git a/polymer.json b/polymer.json
@@ -2,7 +2,7 @@
   "npm": true,
   "lint": {
     "rules": [
-      "polymer-2"
+      "polymer-3"
     ]
   }
 }
diff --git a/skeleton-smart-invite.js b/skeleton-smart-invite.js
@@ -1,10 +1,9 @@
-import { PolymerElement } from '@polymer/polymer/polymer-element.js';
-import 'polymerfire/firebase-firestore-script.js';
-import 'polymerfire/firebase-auth.js';
+/* eslint-disable max-len */
+import {html, PolymerElement} from '@polymer/polymer/polymer-element.js';
 import '@polymer/paper-input/paper-input.js';
 import '@polymer/paper-button/paper-button.js';
 import './icons.js';
-import { html } from '@polymer/polymer/lib/utils/html-tag.js';
+
 /**
  * `skeleton-smart-invite`
  *
@@ -14,6 +13,9 @@ import { html } from '@polymer/polymer/lib/utils/html-tag.js';
  * @demo demo/index.html
  */
 class SkeletonSmartInvite extends PolymerElement {
+  /**
+   * @return {!HTMLTemplateElement}
+   */
   static get template() {
     return html`
     <!--suppress CssInvalidPseudoSelector -->
@@ -90,10 +92,10 @@ class SkeletonSmartInvite extends PolymerElement {
 
     <firebase-auth user="{{user}}"></firebase-auth>
 
-    <paper-input value="{{value}}" label="[[label]]" type="text" prevent-invalid-input="" minlength="4" error-message="[[errorMessage]]" invalid="{{invalid}}" autocomplete="on">
+    <paper-input value="{{value}}" label="[[label]]" type="text" prevent-invalid-input minlength="4" error-message="[[errorMessage]]" invalid="{{invalid}}" autocomplete="on">
       <iron-icon icon="[[iconType]]" slot="prefix" id="value-icon"></iron-icon>
-      <iron-icon class\$="[[iconValidationClass]]" icon="[[iconValidation]]" slot="suffix" hidden\$="[[iconHidden]]" invalid\$="[[invalid]]" id="status-icon"></iron-icon>
-      <paper-button slot="suffix" hidden\$="[[buttonHidden]]" disabled\$="[[buttonHidden]]" on-tap="_invite">
+      <iron-icon class$="[[iconValidationClass]]" icon="[[iconValidation]]" slot="suffix" hidden$="[[iconHidden]]" invalid$="[[invalid]]" id="status-icon"></iron-icon>
+      <paper-button slot="suffix" hidden$="[[buttonHidden]]" disabled$="[[buttonHidden]]" on-tap="_invite">
         INVITE
         <iron-icon icon="smart-invite:send"></iron-icon>
       </paper-button>