@vaadin/vaadin-lumo-styles - npm Package Compare versions

Comparing version 23.2.16 to 23.2.17

all-imports.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

badge.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -28,3 +28,2 @@ */
     min-width: calc(var(--lumo-line-height-xs) * 1em + 0.45em);
-    flex-shrink: 0;
   }
@@ -91,14 +90,20 @@
 
-  [theme~='badge'] vaadin-icon {
+  [theme~='badge'] vaadin-icon,
+  [theme~='badge'] iron-icon {
     margin: -0.25em 0;
+    --iron-icon-width: 1.5em;
+    --iron-icon-height: 1.5em;
   }
 
-  [theme~='badge'] vaadin-icon:first-child {
+  [theme~='badge'] vaadin-icon:first-child,
+  [theme~='badge'] iron-icon:first-child {
     margin-left: -0.375em;
   }
 
-  [theme~='badge'] vaadin-icon:last-child {
+  [theme~='badge'] vaadin-icon:last-child,
+  [theme~='badge'] iron-icon:last-child {
     margin-right: -0.375em;
   }
 
+  iron-icon[theme~='badge'][icon],
   vaadin-icon[theme~='badge'][icon] {
@@ -112,2 +117,3 @@ min-width: 0;
 
+  iron-icon[theme~='badge'][icon][theme~='small'],
   vaadin-icon[theme~='badge'][icon][theme~='small'] {
@@ -154,3 +160,4 @@ width: var(--lumo-icon-size-s);
 
-  [dir='rtl'][theme~='badge'] vaadin-icon:first-child {
+  [dir='rtl'][theme~='badge'] vaadin-icon:first-child,
+  [dir='rtl'][theme~='badge'] iron-icon:first-child {
     margin-right: -0.375em;
@@ -160,3 +167,4 @@ margin-left: 0;
 
-  [dir='rtl'][theme~='badge'] vaadin-icon:last-child {
+  [dir='rtl'][theme~='badge'] vaadin-icon:last-child,
+  [dir='rtl'][theme~='badge'] iron-icon:last-child {
     margin-left: -0.375em;
@@ -163,0 +171,0 @@ margin-right: 0;

color.d.ts

@@ -6,1 +6,3 @@ import type { CSSResult } from 'lit';
 export const color: CSSResult;
+
+export const colorLegacy: CSSResult;

color.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -200,2 +200,11 @@ */
 
-export { colorBase, color };
+const colorLegacy = css`
+  :host {
+    color: var(--lumo-body-text-color) !important;
+    background-color: var(--lumo-base-color) !important;
+  }
+`;
+
+registerStyles('', [color, colorLegacy], { moduleId: 'lumo-color-legacy' });
+
+export { colorBase, color, colorLegacy };

font-icons.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

icons.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
  */
-import '@vaadin/icon/vaadin-icon.js';
+import '@polymer/iron-icon/iron-icon.js';
 import './version.js';
+import './iconset.js';
 import './vaadin-iconset.js';

mixins/field-button.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

mixins/helper.d.ts

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

mixins/helper.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

mixins/input-field-shared.d.ts

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

mixins/input-field-shared.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -133,3 +133,3 @@ */
   /* Slotted content */
-  [part='input-field'] ::slotted(:not(vaadin-icon):not(input):not(textarea)) {
+  [part='input-field'] ::slotted(:not(iron-icon):not(vaadin-icon):not(input):not(textarea)) {
     color: var(--lumo-secondary-text-color);
@@ -136,0 +136,0 @@ font-weight: 400;

mixins/loader.js

 /**
  * @license
- * Copyright (c) 2022 - 2023 Vaadin Ltd.
+ * Copyright (c) 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

mixins/menu-overlay.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

mixins/overlay.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

mixins/required-field.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -43,8 +43,4 @@ */
 
-  :host([has-label]) ::slotted([slot='tooltip']) {
-    --vaadin-tooltip-offset-bottom: calc((var(--lumo-space-m) - var(--lumo-space-xs)) * -1);
-  }
-
   :host([required]) [part='required-indicator']::after {
-    content: var(--lumo-required-field-indicator, '\\2022');
+    content: var(--lumo-required-field-indicator, '•');
     transition: opacity 0.2s;
@@ -51,0 +47,0 @@ color: var(--lumo-required-field-indicator-color, var(--lumo-primary-text-color));

package.json

 {
   "name": "@vaadin/vaadin-lumo-styles",
-  "version": "23.2.16",
+  "version": "23.2.17",
   "publishConfig": {
@@ -28,3 +28,2 @@ "access": "public"
     "*.js",
-    "auto-complete.css",
     "mixins/*.d.ts",
@@ -44,5 +43,7 @@ "mixins/*.js",
   "dependencies": {
+    "@polymer/iron-icon": "^3.0.0",
+    "@polymer/iron-iconset-svg": "^3.0.0",
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/icon": "~23.2.16",
-    "@vaadin/vaadin-themable-mixin": "~23.2.16"
+    "@vaadin/icon": "~23.2.17",
+    "@vaadin/vaadin-themable-mixin": "~23.2.17"
   },
@@ -56,3 +57,3 @@ "devDependencies": {
   },
-  "gitHead": "57010013e59a3ecdc70ceef4377dbc3b1ac03fb3"
+  "gitHead": "60bf51d55e8b93a30536ebb4966248ba256c9b5d"
 }

presets/compact.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

sizing.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

spacing.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

style.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -15,2 +15,3 @@ */
     --lumo-border-radius-l: 0.5em; /* Dialog, notification, etc */
+    --lumo-border-radius: 0.25em; /* Deprecated */
 
@@ -36,3 +37,2 @@ /* Shadow */
     --vaadin-radio-button-size: calc(var(--lumo-size-m) / 2);
-    --vaadin-input-container-border-radius: var(--lumo-border-radius-m);
   }
@@ -39,0 +39,0 @@ `;

typography.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -32,6 +32,6 @@ */
 const typography = css`
-  body,
+  html,
   :host {
     font-family: var(--lumo-font-family);
-    font-size: var(--lumo-font-size-m);
+    font-size: var(--lumo-font-size, var(--lumo-font-size-m));
     line-height: var(--lumo-line-height-m);
@@ -54,30 +54,41 @@ -webkit-text-size-adjust: 100%;
 
-  :where(h1, h2, h3, h4, h5, h6) {
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
     font-weight: 600;
     line-height: var(--lumo-line-height-xs);
-    margin: 0;
+    margin-top: 1.25em;
   }
 
-  :where(h1) {
+  h1 {
     font-size: var(--lumo-font-size-xxxl);
+    margin-bottom: 0.75em;
   }
 
-  :where(h2) {
+  h2 {
     font-size: var(--lumo-font-size-xxl);
+    margin-bottom: 0.5em;
   }
 
-  :where(h3) {
+  h3 {
     font-size: var(--lumo-font-size-xl);
+    margin-bottom: 0.5em;
   }
 
-  :where(h4) {
+  h4 {
     font-size: var(--lumo-font-size-l);
+    margin-bottom: 0.5em;
   }
 
-  :where(h5) {
+  h5 {
     font-size: var(--lumo-font-size-m);
+    margin-bottom: 0.25em;
   }
 
-  :where(h6) {
+  h6 {
     font-size: var(--lumo-font-size-xs);
+    margin-bottom: 0;
     text-transform: uppercase;
@@ -84,0 +95,0 @@ letter-spacing: 0.03em;

user-colors.d.ts

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

user-colors.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

utilities/accessibility.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

utilities/background.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

utilities/border.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

utilities/flexbox-grid.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

utilities/layout.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

utilities/shadows.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

utilities/sizing.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

utilities/spacing.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

utilities/typography.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

utility.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -5,0 +5,0 @@ */

vaadin-iconset.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
  */
+import '@vaadin/icon/vaadin-iconset.js';
 import './version.js';
-import { Iconset } from '@vaadin/icon/vaadin-iconset.js';
 
 const template = document.createElement('template');
 
-template.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg"><defs>
+template.innerHTML = `<vaadin-iconset name="lumo" size="1000">
+<svg xmlns="http://www.w3.org/2000/svg">
+<defs>
 <g id="lumo:align-center"><path d="M167 217c0-18 17-33 38-34H795c21 0 38 15 38 34 0 18-17 33-38 33H205C184 250 167 235 167 217z m83 191c0-18 13-33 29-33H721c16 0 29 15 29 33 0 18-13 33-29 34H279C263 442 250 427 250 408zM250 792c0-18 13-33 29-34H721c16 0 29 15 29 34s-13 33-29 33H279C263 825 250 810 250 792z m-83-192c0-18 17-33 38-33H795c21 0 38 15 38 33s-17 33-38 33H205C184 633 167 618 167 600z" fill-rule="evenodd" clip-rule="evenodd"></path></g>
@@ -54,4 +56,6 @@ <g id="lumo:align-left"><path d="M167 217c0-18 17-33 38-34H795c21 0 38 15 38 34 0 18-17 33-38 33H205C184 250 167 235 167 217z m0 191c0-18 13-33 28-33H638c16 0 29 15 29 33 0 18-13 33-29 34H195C179 442 167 427 167 408zM167 792c0-18 13-33 28-34H638c16 0 29 15 29 34s-13 33-29 33H195C179 825 167 810 167 792z m0-192c0-18 17-33 38-33H795c21 0 38 15 38 33s-17 33-38 33H205C184 633 167 618 167 600z" fill-rule="evenodd" clip-rule="evenodd"></path></g>
 <g id="lumo:user"><path d="M500 500c-69 0-125-56-125-125s56-125 125-125 125 56 125 125-56 125-125 125z m-292 292c0-115 131-208 292-209s292 93 292 209H208z"></path></g>
-</defs></svg>`;
+</defs>
+</svg>
+</vaadin-iconset>`;
 
-Iconset.register('lumo', 1000, template);
+document.head.appendChild(template.content);

version.js

 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
@@ -15,3 +15,3 @@ */
   static get version() {
-    return '23.2.16';
+    return '23.2.17';
   }
@@ -18,0 +18,0 @@ }

No alert changes

Worsened metrics

Total package byte prevSize

128588

decreased by-12.15%

Dependency count

5

increased by66.67%

Lines of code

3170

decreased by-33.25%

Dependency changes

• + Added@polymer/iron-icon@^3.0.0

• + Added@polymer/iron-iconset-svg@^3.0.0

• Updated@vaadin/icon@~23.2.17

• Updated@vaadin/vaadin-themable-mixin@~23.2.17