@vaadin/side-nav - npm Package Compare versions

Comparing version 24.3.0-alpha1 to 24.3.0-alpha10

package.json

 {
   "name": "@vaadin/side-nav",
-  "version": "24.3.0-alpha1",
+  "version": "24.3.0-alpha10",
   "publishConfig": {
@@ -37,12 +37,12 @@ "access": "public"
   "dependencies": {
-    "@vaadin/component-base": "24.3.0-alpha1",
-    "@vaadin/vaadin-lumo-styles": "24.3.0-alpha1",
-    "@vaadin/vaadin-material-styles": "24.3.0-alpha1",
-    "@vaadin/vaadin-themable-mixin": "24.3.0-alpha1",
-    "lit": "^2.0.0"
+    "@vaadin/component-base": "24.3.0-alpha10",
+    "@vaadin/vaadin-lumo-styles": "24.3.0-alpha10",
+    "@vaadin/vaadin-material-styles": "24.3.0-alpha10",
+    "@vaadin/vaadin-themable-mixin": "24.3.0-alpha10",
+    "lit": "^3.0.0"
   },
   "devDependencies": {
     "@esm-bundle/chai": "^4.3.4",
-    "@vaadin/testing-helpers": "^0.5.0",
-    "lit": "^2.0.0",
+    "@vaadin/testing-helpers": "^0.6.0",
+    "lit": "^3.0.0",
     "sinon": "^13.0.2"
@@ -54,3 +54,3 @@ },
   ],
-  "gitHead": "9ca6f3ca220a777e8eea181a1f5717e39a732240"
+  "gitHead": "0271523d93fe5df0425ff64206886614f3c6f401"
 }

src/vaadin-side-nav-item.js

@@ -202,3 +202,3 @@ /**
           ?disabled="${this.disabled}"
-          tabindex="${this.disabled || !this.path ? '-1' : '0'}"
+          tabindex="${this.disabled || this.path == null ? '-1' : '0'}"
           href="${ifDefined(this.disabled ? null : this.path)}"
@@ -205,0 +205,0 @@ part="link"

src/vaadin-side-nav.js

@@ -148,12 +148,19 @@ /**
     return html`
-      <button
-        part="label"
-        @click="${this._onLabelClick}"
-        aria-expanded="${ifDefined(this.collapsible ? !this.collapsed : null)}"
-        aria-hidden="${ifDefined(this.collapsible === false ? true : null)}"
-        aria-controls="children"
-      >
-        <slot name="label" @slotchange="${this._onLabelSlotChange}"></slot>
-        <span part="toggle-button" aria-hidden="true"></span>
-      </button>
+      ${this.collapsible
+        ? html`
+            <button
+              part="label"
+              @click="${this._onLabelClick}"
+              aria-expanded="${!this.collapsed}"
+              aria-controls="children"
+            >
+              <slot name="label" @slotchange="${this._onLabelSlotChange}"></slot>
+              <span part="toggle-button" aria-hidden="true"></span>
+            </button>
+          `
+        : html`
+            <div part="label">
+              <slot name="label" @slotchange="${this._onLabelSlotChange}"></slot>
+            </div>
+          `}
       <ul
@@ -160,0 +167,0 @@ id="children"

theme/lumo/vaadin-side-nav-item-styles.js

@@ -11,2 +11,7 @@ import '@vaadin/vaadin-lumo-styles/color.js';
 export const sideNavItemStyles = css`
+  :host {
+    --_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-primary-color-50pct));
+    --_focus-ring-width: var(--vaadin-focus-ring-width, 2px);
+  }
+
   [part='link'] {
@@ -78,3 +83,3 @@ width: 100%;
       border-radius: var(--lumo-border-radius-m);
-      box-shadow: 0 0 0 2px var(--lumo-primary-color-50pct);
+      box-shadow: 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);
     }
@@ -115,3 +120,3 @@ }
     background-color: var(--lumo-primary-color-10pct);
-    color: var(--lumo-primary-text-color);
+    color: var(--vaadin-selection-color-text, var(--lumo-primary-text-color));
     border-radius: var(--lumo-border-radius-m);
@@ -118,0 +123,0 @@ }

theme/lumo/vaadin-side-nav-styles.js

@@ -17,2 +17,4 @@ import '@vaadin/vaadin-lumo-styles/color.js';
     -webkit-tap-highlight-color: transparent;
+    --_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-primary-color-50pct));
+    --_focus-ring-width: var(--vaadin-focus-ring-width, 2px);
   }
@@ -39,3 +41,3 @@
   :host([focus-ring]) [part='label'] {
-    box-shadow: 0 0 0 2px var(--lumo-primary-color-50pct);
+    box-shadow: 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);
   }
@@ -42,0 +44,0 @@

web-types.json

 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/side-nav",
-  "version": "24.3.0-alpha1",
+  "version": "24.3.0-alpha10",
   "description-markup": "markdown",
@@ -6,0 +6,0 @@ "contributions": {

web-types.lit.json

 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/side-nav",
-  "version": "24.3.0-alpha1",
+  "version": "24.3.0-alpha10",
   "description-markup": "markdown",
@@ -6,0 +6,0 @@ "framework": "lit",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

67576

increased by0.82%

Lines of code

1594

increased by0.82%

Dependency changes

• + Added@lit/reactive-element@2.0.4(transitive)

• + Added@vaadin/component-base@24.3.0-alpha10(transitive)

• + Added@vaadin/icon@24.3.0-alpha10(transitive)

• + Added@vaadin/vaadin-lumo-styles@24.3.0-alpha10(transitive)

• + Added@vaadin/vaadin-material-styles@24.3.0-alpha10(transitive)

• + Added@vaadin/vaadin-themable-mixin@24.3.0-alpha10(transitive)

• + Addedlit@3.2.1(transitive)

• + Addedlit-element@4.1.1(transitive)

• + Addedlit-html@3.2.1(transitive)

• - Removed@lit/reactive-element@1.6.3(transitive)

• - Removed@vaadin/component-base@24.3.0-alpha1(transitive)

• - Removed@vaadin/icon@24.3.0-alpha1(transitive)

• - Removed@vaadin/vaadin-lumo-styles@24.3.0-alpha1(transitive)

• - Removed@vaadin/vaadin-material-styles@24.3.0-alpha1(transitive)

• - Removed@vaadin/vaadin-themable-mixin@24.3.0-alpha1(transitive)

• - Removedlit@2.8.0(transitive)

• - Removedlit-element@3.3.3(transitive)

• - Removedlit-html@2.8.0(transitive)

• Updated@vaadin/component-base@24.3.0-alpha10

• Updated@vaadin/vaadin-lumo-styles@24.3.0-alpha10

• Updated@vaadin/vaadin-material-styles@24.3.0-alpha10

• Updated@vaadin/vaadin-themable-mixin@24.3.0-alpha10

• Updatedlit@^3.0.0