@vaadin/password-field
Advanced tools
@vaadin/password-field - npm Package Compare versions
Comparing version
| { | ||
| "name": "@vaadin/password-field", | ||
| "version": "23.0.0-alpha1", | ||
| "version": "23.0.0-alpha2", | ||
| "publishConfig": { | ||
@@ -35,5 +35,6 @@ "access": "public" | ||
| "@polymer/polymer": "^3.0.0", | ||
| "@vaadin/text-field": "23.0.0-alpha1", | ||
| "@vaadin/vaadin-lumo-styles": "23.0.0-alpha1", | ||
| "@vaadin/vaadin-material-styles": "23.0.0-alpha1" | ||
| "@vaadin/button": "23.0.0-alpha2", | ||
| "@vaadin/text-field": "23.0.0-alpha2", | ||
| "@vaadin/vaadin-lumo-styles": "23.0.0-alpha2", | ||
| "@vaadin/vaadin-material-styles": "23.0.0-alpha2" | ||
| }, | ||
@@ -45,3 +46,3 @@ "devDependencies": { | ||
| }, | ||
| "gitHead": "fbcb07328fdf88260e3b461088d207426b21c710" | ||
| "gitHead": "070f586dead02ca41b66717820c647f48bf1665f" | ||
| } |
@@ -6,2 +6,3 @@ /** | ||
| */ | ||
| import './vaadin-password-field-button.js'; | ||
| import { html } from '@polymer/polymer/lib/utils/html-tag.js'; | ||
@@ -129,4 +130,3 @@ import { SlotStylesMixin } from '@vaadin/field-base/src/slot-styles-mixin.js'; | ||
| reveal: () => { | ||
| const btn = document.createElement('button'); | ||
| btn.setAttribute('type', 'button'); | ||
| const btn = document.createElement('vaadin-password-field-button'); | ||
| btn.disabled = this.disabled; | ||
@@ -133,0 +133,0 @@ return btn; |
@@ -30,21 +30,4 @@ /** | ||
| } | ||
| ::slotted([slot='reveal']) { | ||
| position: absolute; | ||
| top: 0; | ||
| bottom: 0; | ||
| left: 0; | ||
| right: 0; | ||
| width: 100%; | ||
| background: transparent; | ||
| border: none; | ||
| } | ||
| ::slotted([slot='reveal']:focus) { | ||
| border-radius: var(--lumo-border-radius-s); | ||
| box-shadow: 0 0 0 2px var(--lumo-primary-color-50pct); | ||
| outline: none; | ||
| } | ||
| `; | ||
| registerStyles('vaadin-password-field', [inputFieldShared, passwordField], { moduleId: 'lumo-password-field' }); |
@@ -7,3 +7,4 @@ /** | ||
| import '@vaadin/text-field/theme/lumo/vaadin-text-field.js'; | ||
| import './vaadin-password-field-button-styles.js'; | ||
| import './vaadin-password-field-styles.js'; | ||
| import '../../src/vaadin-password-field.js'; |
@@ -38,51 +38,7 @@ /** | ||
| ::slotted([slot='reveal']) { | ||
| position: absolute; | ||
| top: 0; | ||
| bottom: 0; | ||
| left: 0; | ||
| right: 0; | ||
| width: 100%; | ||
| background: transparent; | ||
| border: none; | ||
| outline: none; | ||
| } | ||
| ::slotted([slot='reveal'])::before { | ||
| position: absolute; | ||
| content: ''; | ||
| top: 0; | ||
| left: 0; | ||
| width: 32px; | ||
| height: 32px; | ||
| border-radius: 50%; | ||
| background-color: var(--material-body-text-color); | ||
| transform: scale(0); | ||
| opacity: 0; | ||
| transition: transform 0.08s, opacity 0.01s; | ||
| will-change: transform, opacity; | ||
| } | ||
| :host([focused]) ::slotted([slot='reveal'])::before { | ||
| background-color: var(--material-primary-text-color); | ||
| } | ||
| ::slotted([slot='reveal']:hover)::before { | ||
| opacity: 0.08; | ||
| } | ||
| ::slotted([slot='reveal']:focus)::before { | ||
| opacity: 0.12; | ||
| } | ||
| ::slotted([slot='reveal']:active)::before { | ||
| opacity: 0.16; | ||
| } | ||
| ::slotted([slot='reveal']:hover)::before, | ||
| ::slotted([slot='reveal']:focus)::before { | ||
| transform: scale(1.5); | ||
| } | ||
| `; | ||
| registerStyles('vaadin-password-field', [inputFieldShared, passwordField], { moduleId: 'material-password-field' }); |
@@ -7,3 +7,4 @@ /** | ||
| import '@vaadin/text-field/theme/material/vaadin-text-field.js'; | ||
| import './vaadin-password-field-button-styles.js'; | ||
| import './vaadin-password-field-styles.js'; | ||
| import '../../src/vaadin-password-field.js'; |
Improved metrics
- Total package byte prevSize
32195
4.2%- Number of package files
14
27.27%- Lines of code
550
7.21%Worsened metrics
- Dependency count
5
25%Dependency changes
+ Added
@vaadin/button@23.0.0-alpha2+ Added
@vaadin/button@23.0.0-alpha2(transitive)+ Added
@vaadin/component-base@23.0.0-alpha2(transitive)+ Added
@vaadin/field-base@23.0.0-alpha2(transitive)+ Added
@vaadin/icon@23.0.0-alpha2(transitive)+ Added
@vaadin/input-container@23.0.0-alpha2(transitive)+ Added
@vaadin/text-field@23.0.0-alpha2(transitive)+ Added
@vaadin/vaadin-lumo-styles@23.0.0-alpha2(transitive)+ Added
@vaadin/vaadin-material-styles@23.0.0-alpha2(transitive)+ Added
@vaadin/vaadin-themable-mixin@23.0.0-alpha2(transitive)- Removed
@vaadin/component-base@23.0.0-alpha1(transitive)- Removed
@vaadin/field-base@23.0.0-alpha1(transitive)- Removed
@vaadin/icon@23.0.0-alpha1(transitive)- Removed
@vaadin/input-container@23.0.0-alpha1(transitive)- Removed
@vaadin/text-field@23.0.0-alpha1(transitive)- Removed
@vaadin/vaadin-lumo-styles@23.0.0-alpha1(transitive)- Removed
@vaadin/vaadin-material-styles@23.0.0-alpha1(transitive)- Removed
@vaadin/vaadin-themable-mixin@23.0.0-alpha1(transitive)