@polymer/paper-checkbox - npm Package Compare versions

Comparing version 3.0.0-pre.12 to 3.0.0-pre.13

package.json

@@ -20,13 +20,15 @@ {
     "bower": "^1.8.0",
-    "@webcomponents/webcomponentsjs": "^1.0.0",
-    "wct-browser-legacy": "0.0.1-pre.11",
-    "@polymer/iron-component-page": "3.0.0-pre.12",
-    "@polymer/iron-demo-helpers": "3.0.0-pre.12",
-    "@polymer/iron-flex-layout": "3.0.0-pre.12",
-    "@polymer/iron-test-helpers": "3.0.0-pre.12"
+    "webmat": "^0.2.0",
+    "@webcomponents/webcomponentsjs": "^2.0.0-0",
+    "wct-browser-legacy": "^0.0.1-pre.11",
+    "@polymer/iron-component-page": "^3.0.0-pre.13",
+    "@polymer/iron-demo-helpers": "^3.0.0-pre.13",
+    "@polymer/iron-flex-layout": "^3.0.0-pre.13",
+    "@polymer/iron-test-helpers": "^3.0.0-pre.13"
   },
   "scripts": {
-    "update-types": "bower install && gen-typescript-declarations --deleteExisting --outDir ."
+    "update-types": "bower install && gen-typescript-declarations --deleteExisting --outDir .",
+    "format": "webmat && npm run update-types"
   },
-  "version": "3.0.0-pre.12",
+  "version": "3.0.0-pre.13",
   "resolutions": {
@@ -41,9 +43,9 @@ "inherits": "2.0.3",
   "dependencies": {
-    "@polymer/polymer": "3.0.0-pre.12",
-    "@polymer/iron-checked-element-behavior": "3.0.0-pre.12",
-    "@polymer/paper-behaviors": "3.0.0-pre.12",
-    "@polymer/paper-ripple": "3.0.0-pre.12",
-    "@polymer/paper-styles": "3.0.0-pre.12",
-    "@polymer/iron-a11y-keys-behavior": "3.0.0-pre.12"
+    "@polymer/polymer": "^3.0.0-pre.13",
+    "@polymer/iron-checked-element-behavior": "^3.0.0-pre.13",
+    "@polymer/paper-behaviors": "^3.0.0-pre.13",
+    "@polymer/paper-ripple": "^3.0.0-pre.13",
+    "@polymer/paper-styles": "^3.0.0-pre.13",
+    "@polymer/iron-a11y-keys-behavior": "^3.0.0-pre.13"
   }
 }

paper-checkbox.js

@@ -1,8 +0,66 @@
-import '@polymer/polymer/polymer-legacy.js';
-import '@polymer/paper-styles/default-theme.js';
-import { PaperCheckedElementBehavior } from '@polymer/paper-behaviors/paper-checked-element-behavior.js';
-import { Polymer } from '@polymer/polymer/lib/legacy/polymer-fn.js';
-import { afterNextRender } from '@polymer/polymer/lib/utils/render-status.js';
-import { PaperInkyFocusBehaviorImpl } from '@polymer/paper-behaviors/paper-inky-focus-behavior.js';
-const $_documentContainer = document.createElement('div');
+/**
+@license
+Copyright (c) 2016 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+*/
+/**
+Material design: [Checkbox](https://www.google.com/design/spec/components/selection-controls.html#selection-controls-checkbox)
+
+`paper-checkbox` is a button that can be either checked or unchecked.  User
+can tap the checkbox to check or uncheck it.  Usually you use checkboxes
+to allow user to select multiple options from a set.  If you have a single
+ON/OFF option, avoid using a single checkbox and use `paper-toggle-button`
+instead.
+
+Example:
+
+    <paper-checkbox>label</paper-checkbox>
+
+    <paper-checkbox checked> label</paper-checkbox>
+
+### Styling
+
+The following custom properties and mixins are available for styling:
+
+Custom property | Description | Default
+----------------|-------------|----------
+`--paper-checkbox-unchecked-background-color` | Checkbox background color when the input is not checked | `transparent`
+`--paper-checkbox-unchecked-color` | Checkbox border color when the input is not checked | `--primary-text-color`
+`--paper-checkbox-unchecked-ink-color` | Selected/focus ripple color when the input is not checked | `--primary-text-color`
+`--paper-checkbox-checked-color` | Checkbox color when the input is checked | `--primary-color`
+`--paper-checkbox-checked-ink-color` | Selected/focus ripple color when the input is checked | `--primary-color`
+`--paper-checkbox-checkmark-color` | Checkmark color | `white`
+`--paper-checkbox-label-color` | Label color | `--primary-text-color`
+`--paper-checkbox-label-checked-color` | Label color when the input is checked | `--paper-checkbox-label-color`
+`--paper-checkbox-label-spacing` | Spacing between the label and the checkbox | `8px`
+`--paper-checkbox-label` | Mixin applied to the label | `{}`
+`--paper-checkbox-label-checked` | Mixin applied to the label when the input is checked | `{}`
+`--paper-checkbox-error-color` | Checkbox color when invalid | `--error-color`
+`--paper-checkbox-size` | Size of the checkbox | `18px`
+`--paper-checkbox-ink-size` | Size of the ripple | `48px`
+`--paper-checkbox-margin` | Margin around the checkbox container | `initial`
+`--paper-checkbox-vertical-align` | Vertical alignment of the checkbox container | `middle`
+
+This element applies the mixin `--paper-font-common-base` but does not import `paper-styles/typography.html`.
+In order to apply the `Roboto` font to this element, make sure you've imported `paper-styles/typography.html`.
+
+@demo demo/index.html
+*/
+/*
+  FIXME(polymer-modulizer): the above comments were extracted
+  from HTML and may be out of place here. Review them and
+  then delete this comment!
+*/
+import '../polymer/polymer-legacy.js';
+
+import '../paper-styles/default-theme.js';
+import { PaperCheckedElementBehavior } from '../paper-behaviors/paper-checked-element-behavior.js';
+import { Polymer } from '../polymer/lib/legacy/polymer-fn.js';
+import { afterNextRender } from '../polymer/lib/utils/render-status.js';
+import { PaperInkyFocusBehaviorImpl } from '../paper-behaviors/paper-inky-focus-behavior.js';
+const $_documentContainer = document.createElement('template');
 $_documentContainer.setAttribute('style', 'display: none;');
@@ -192,68 +250,10 @@
 
-document.head.appendChild($_documentContainer);
-/**
-@license
-Copyright (c) 2016 The Polymer Project Authors. All rights reserved.
-This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
-The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
-The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
-Code distributed by Google as part of the polymer project is also
-subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-*/
-/**
-Material design: [Checkbox](https://www.google.com/design/spec/components/selection-controls.html#selection-controls-checkbox)
-
-`paper-checkbox` is a button that can be either checked or unchecked.  User
-can tap the checkbox to check or uncheck it.  Usually you use checkboxes
-to allow user to select multiple options from a set.  If you have a single
-ON/OFF option, avoid using a single checkbox and use `paper-toggle-button`
-instead.
-
-Example:
-
-    <paper-checkbox>label</paper-checkbox>
-
-    <paper-checkbox checked> label</paper-checkbox>
-
-### Styling
-
-The following custom properties and mixins are available for styling:
-
-Custom property | Description | Default
-----------------|-------------|----------
-`--paper-checkbox-unchecked-background-color` | Checkbox background color when the input is not checked | `transparent`
-`--paper-checkbox-unchecked-color` | Checkbox border color when the input is not checked | `--primary-text-color`
-`--paper-checkbox-unchecked-ink-color` | Selected/focus ripple color when the input is not checked | `--primary-text-color`
-`--paper-checkbox-checked-color` | Checkbox color when the input is checked | `--primary-color`
-`--paper-checkbox-checked-ink-color` | Selected/focus ripple color when the input is checked | `--primary-color`
-`--paper-checkbox-checkmark-color` | Checkmark color | `white`
-`--paper-checkbox-label-color` | Label color | `--primary-text-color`
-`--paper-checkbox-label-checked-color` | Label color when the input is checked | `--paper-checkbox-label-color`
-`--paper-checkbox-label-spacing` | Spacing between the label and the checkbox | `8px`
-`--paper-checkbox-label` | Mixin applied to the label | `{}`
-`--paper-checkbox-label-checked` | Mixin applied to the label when the input is checked | `{}`
-`--paper-checkbox-error-color` | Checkbox color when invalid | `--error-color`
-`--paper-checkbox-size` | Size of the checkbox | `18px`
-`--paper-checkbox-ink-size` | Size of the ripple | `48px`
-`--paper-checkbox-margin` | Margin around the checkbox container | `initial`
-`--paper-checkbox-vertical-align` | Vertical alignment of the checkbox container | `middle`
-
-This element applies the mixin `--paper-font-common-base` but does not import `paper-styles/typography.html`.
-In order to apply the `Roboto` font to this element, make sure you've imported `paper-styles/typography.html`.
-
-@demo demo/index.html
-*/
+document.head.appendChild($_documentContainer.content);
 Polymer({
   is: 'paper-checkbox',
 
-  behaviors: [
-    PaperCheckedElementBehavior
-  ],
+  behaviors: [PaperCheckedElementBehavior],
 
   /** @private */
-  hostAttributes: {
-    role: 'checkbox',
-    'aria-checked': false,
-    tabindex: 0
-  },
+  hostAttributes: {role: 'checkbox', 'aria-checked': false, tabindex: 0},
 
@@ -272,6 +272,3 @@ properties: {
      */
-    ariaActiveAttribute: {
-      type: String,
-      value: 'aria-checked'
-    }
+    ariaActiveAttribute: {type: String, value: 'aria-checked'}
   },
@@ -283,8 +280,17 @@
     afterNextRender(this, function() {
-      var inkSize = this.getComputedStyleValue('--calculated-paper-checkbox-ink-size').trim();
+      var inkSize =
+          this.getComputedStyleValue('--calculated-paper-checkbox-ink-size')
+              .trim();
       // If unset, compute and set the default `--paper-checkbox-ink-size`.
       if (inkSize === '-1px') {
-        var checkboxSizeText = this.getComputedStyleValue('--calculated-paper-checkbox-size').trim();
+        var checkboxSizeText =
+            this.getComputedStyleValue('--calculated-paper-checkbox-size')
+                .trim();
 
-        var units = checkboxSizeText.match(/[A-Za-z]+$/)[0] || 'px';
+        var units = 'px';
+        var unitsMatches = checkboxSizeText.match(/[A-Za-z]+$/);
+        if (unitsMatches !== null) {
+          units = unitsMatches[0];
+        }
+
         var checkboxSize = parseFloat(checkboxSizeText);
@@ -291,0 +297,0 @@ var defaultInkSize = (8 / 3) * checkboxSize;

No alert changes

Improved metrics

Total package byte prevSize

41329

increased by3.87%

Lines of code

336

increased by1.2%

Worsened metrics

Dev dependency count

9

increased by12.5%

Dependency changes

• + Added@polymer/font-roboto@3.0.2(transitive)

• + Added@polymer/iron-a11y-keys-behavior@3.0.1(transitive)

• + Added@polymer/iron-behaviors@3.0.1(transitive)

• + Added@polymer/iron-checked-element-behavior@3.0.1(transitive)

• + Added@polymer/iron-flex-layout@3.0.1(transitive)

• + Added@polymer/iron-form-element-behavior@3.0.1(transitive)

• + Added@polymer/iron-meta@3.0.1(transitive)

• + Added@polymer/iron-validatable-behavior@3.0.1(transitive)

• + Added@polymer/paper-behaviors@3.0.1(transitive)

• + Added@polymer/paper-ripple@3.0.2(transitive)

• + Added@polymer/paper-styles@3.0.1(transitive)

• + Added@polymer/polymer@3.5.2(transitive)

• - Removed@polymer/font-roboto@3.0.0-pre.12(transitive)

• - Removed@polymer/iron-a11y-keys-behavior@3.0.0-pre.12(transitive)

• - Removed@polymer/iron-behaviors@3.0.0-pre.12(transitive)

• - Removed@polymer/iron-checked-element-behavior@3.0.0-pre.12(transitive)

• - Removed@polymer/iron-flex-layout@3.0.0-pre.12(transitive)

• - Removed@polymer/iron-form-element-behavior@3.0.0-pre.12(transitive)

• - Removed@polymer/iron-meta@3.0.0-pre.12(transitive)

• - Removed@polymer/iron-validatable-behavior@3.0.0-pre.12(transitive)

• - Removed@polymer/paper-behaviors@3.0.0-pre.12(transitive)

• - Removed@polymer/paper-ripple@3.0.0-pre.12(transitive)

• - Removed@polymer/paper-styles@3.0.0-pre.12(transitive)

• - Removed@polymer/polymer@3.0.0-pre.12(transitive)

• - Removed@webcomponents/webcomponentsjs@1.3.3(transitive)

• Updated@polymer/iron-a11y-keys-behavior@^3.0.0-pre.13

• Updated@polymer/iron-checked-element-behavior@^3.0.0-pre.13

• Updated@polymer/paper-behaviors@^3.0.0-pre.13

• Updated@polymer/paper-ripple@^3.0.0-pre.13

• Updated@polymer/paper-styles@^3.0.0-pre.13

• Updated@polymer/polymer@^3.0.0-pre.13