@asphalt-react/appbar - npm Package Compare versions

Comparing version 2.0.0-alpha.26 to 2.0.0-alpha.28

dist/index.js

@@ -128,5 +128,5 @@ import React, { useState, forwardRef, useRef } from 'react';
 
-var css_248z = ".NavLink__AztJU {\n  --surface: transparent;\n  --font: var(\n    --label-S,\n    600 0.875rem/1.5 Maison Neue,\n    Helvetica,\n    Open Sans,\n    sans-serif\n  );\n  --font-color: var(--content-muted, #8e919b);\n  --indicator-thickness: var(--indicator, 0.25rem);\n  --border-radius: var(--roundness-dynamic-type-1, 0.375rem);\n  --outline: 2px solid var(--interactive-focus, #86afff);\n\n  background: var(--surface);\n  color: var(--font-color);\n  font: var(--font);\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  outline-offset: 0;\n  cursor: pointer;\n  text-decoration: none;\n  border-radius: var(--border-radius);\n}\n\n.NavLink__AztJU:hover {\n  --font-color: var(--content-primary, #2d2e34);\n  --surface: var(--interactive-surface-primary-hover, #f5f7fa);\n  text-decoration: none;\n}\n\n.NavLink__AztJU:active {\n  text-decoration: none;\n  /* To add border styles for active state without taking space for border in box model */\n  box-shadow: inset 0px 0px 0px 1px var(--interactive-active, #1c3abb);\n}\n\n@supports not selector(:focus-visible) {\n  .NavLink__AztJU:focus {\n    outline: var(--outline);\n  }\n}\n\n.NavLink__AztJU:focus-visible {\n  outline: var(--outline);\n}\n\n.indicatorWrap__kdNqF {\n  width: 100%;\n  padding-inline: 0.5rem;\n  display: none;\n}\n\n.indicator__-zWqN {\n  display: block;\n  width: 100%;\n  border-radius: 2px;\n  height: var(--indicator-thickness);\n  background: transparent;\n}\n\n.NavItemContent__JVCbs {\n  display: flex;\n  gap: 0.5rem;\n  align-items: center;\n  box-sizing: border-box;\n  padding: 1.125rem 1.5rem;\n}\n\n.prominentContent__4-Hlf {\n  padding: 1.125rem 1.5rem calc(1.125rem - var(--indicator-thickness)) 1.5rem;\n}\n\n.prominent__uo64x,\n.highlight__F8mqc {\n  --font-color: var(--content-primary, #2d2e34);\n  --surface: var(--interactive-highlighted-secondary, #f0f2f4);\n}\n\n.showIndicator__lcY-8 {\n  display: flex;\n}\n\n.visible__OKX7Z {\n  background: var(--interactive-accent, #5070fd);\n}\n\n.prominentContent__4-Hlf.icon__YsBio {\n  padding: 1.25rem 1.5rem calc(1.25rem - var(--indicator-thickness)) 1.5rem;\n}\n\n.icon__YsBio {\n  padding: 1.25rem 1.5rem;\n}\n\n.bezelless__ICNkD {\n  padding: 0;\n}\n\n@media screen and (max-width: 600px) {\n  .NavLink__AztJU {\n    --font: var(\n      --label-S,\n      600 0.875rem/1.5 Maison Neue,\n      Helvetica,\n      Open Sans,\n      sans-serif\n    );\n    flex-direction: row;\n    outline-offset: -2px;\n    padding: 1.125rem 1.5rem;\n    gap: 0.625rem;\n  }\n\n  .NavItemContent__JVCbs {\n    flex: 1;\n    padding: 0;\n  }\n\n  .indicatorWrap__kdNqF {\n    width: var(--indicator-thickness);\n    align-self: stretch;\n    padding-inline: 0;\n  }\n\n  .indicator__-zWqN {\n    height: 100%;\n  }\n\n  .prominentContent__4-Hlf.icon__YsBio {\n    padding: 0;\n  }\n\n  .bezelless__ICNkD {\n    padding: 0;\n  }\n}\n";
+var css_248z = ".NavLink__AztJU {\n  --surface: transparent;\n  --font: var(\n    --text-bold-S,\n    600 0.875rem/1.5 Maison Neue,\n    Helvetica,\n    Open Sans,\n    sans-serif\n  );\n  --font-color: var(--content-muted, #8e919b);\n  --indicator-thickness: var(--indicator, 0.25rem);\n  --border-radius: var(--roundness-dynamic-type-1, 0.375rem);\n  --focus-appearance: var(--focus-outline, 2px solid);\n  --focus-color: var(--interactive-focus, #86afff);\n  --focus: var(--focus-appearance) var(--focus-color);\n\n  background: var(--surface);\n  color: var(--font-color);\n  font: var(--font);\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  outline-offset: 0;\n  cursor: pointer;\n  text-decoration: none;\n  border-radius: var(--border-radius);\n}\n\n.NavLink__AztJU:hover {\n  --font-color: var(--content-primary, #2d2e34);\n  --surface: var(--interactive-surface-primary-hover, #f5f7fa);\n  text-decoration: none;\n}\n\n.NavLink__AztJU:active {\n  text-decoration: none;\n  /* To add border styles for active state without taking space for border in box model */\n  box-shadow: inset 0px 0px 0px 1px var(--interactive-active, #1c3abb);\n}\n\n@supports not selector(:focus-visible) {\n  .NavLink__AztJU:focus {\n    outline: var(--focus);\n  }\n}\n\n.NavLink__AztJU:focus-visible {\n  outline: var(--focus);\n}\n\n.indicatorWrap__kdNqF {\n  width: 100%;\n  padding-inline: 0.5rem;\n  display: none;\n}\n\n.indicator__-zWqN {\n  display: block;\n  width: 100%;\n  border-radius: 2px;\n  height: var(--indicator-thickness);\n  background: transparent;\n}\n\n.NavItemContent__JVCbs {\n  display: flex;\n  gap: 0.5rem;\n  align-items: center;\n  box-sizing: border-box;\n  padding: 1.125rem 1.5rem;\n}\n\n.prominentContent__4-Hlf {\n  padding: 1.125rem 1.5rem calc(1.125rem - var(--indicator-thickness)) 1.5rem;\n}\n\n.prominent__uo64x,\n.highlight__F8mqc {\n  --font-color: var(--content-primary, #2d2e34);\n  --surface: var(--interactive-highlighted-secondary, #f0f2f4);\n}\n\n.showIndicator__lcY-8 {\n  display: flex;\n}\n\n.visible__OKX7Z {\n  background: var(--interactive-accent, #5070fd);\n}\n\n.prominentContent__4-Hlf.icon__YsBio {\n  padding: 1.25rem 1.5rem calc(1.25rem - var(--indicator-thickness)) 1.5rem;\n}\n\n.icon__YsBio {\n  padding: 1.25rem 1.5rem;\n}\n\n.bezelless__ICNkD {\n  padding: 0;\n}\n\n@media screen and (max-width: 600px) {\n  .NavLink__AztJU {\n    --font: var(\n      --text-bold-S,\n      600 0.875rem/1.5 Maison Neue,\n      Helvetica,\n      Open Sans,\n      sans-serif\n    );\n    flex-direction: row;\n    outline-offset: -2px;\n    padding: 1.125rem 1.5rem;\n    gap: 0.625rem;\n  }\n\n  .NavItemContent__JVCbs {\n    flex: 1;\n    padding: 0;\n  }\n\n  .indicatorWrap__kdNqF {\n    width: var(--indicator-thickness);\n    align-self: stretch;\n    padding-inline: 0;\n  }\n\n  .indicator__-zWqN {\n    height: 100%;\n  }\n\n  .prominentContent__4-Hlf.icon__YsBio {\n    padding: 0;\n  }\n\n  .bezelless__ICNkD {\n    padding: 0;\n  }\n}\n";
 var styles = {"NavLink":"NavLink__AztJU","indicatorWrap":"indicatorWrap__kdNqF","indicator":"indicator__-zWqN","NavItemContent":"NavItemContent__JVCbs","prominentContent":"prominentContent__4-Hlf","prominent":"prominent__uo64x","highlight":"highlight__F8mqc","showIndicator":"showIndicator__lcY-8","visible":"visible__OKX7Z","icon":"icon__YsBio","bezelless":"bezelless__ICNkD"};
-var stylesheet=".NavLink__AztJU {\n  --surface: transparent;\n  --font: var(\n    --label-S,\n    600 0.875rem/1.5 Maison Neue,\n    Helvetica,\n    Open Sans,\n    sans-serif\n  );\n  --font-color: var(--content-muted, #8e919b);\n  --indicator-thickness: var(--indicator, 0.25rem);\n  --border-radius: var(--roundness-dynamic-type-1, 0.375rem);\n  --outline: 2px solid var(--interactive-focus, #86afff);\n\n  background: var(--surface);\n  color: var(--font-color);\n  font: var(--font);\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  outline-offset: 0;\n  cursor: pointer;\n  text-decoration: none;\n  border-radius: var(--border-radius);\n}\n\n.NavLink__AztJU:hover {\n  --font-color: var(--content-primary, #2d2e34);\n  --surface: var(--interactive-surface-primary-hover, #f5f7fa);\n  text-decoration: none;\n}\n\n.NavLink__AztJU:active {\n  text-decoration: none;\n  /* To add border styles for active state without taking space for border in box model */\n  box-shadow: inset 0px 0px 0px 1px var(--interactive-active, #1c3abb);\n}\n\n@supports not selector(:focus-visible) {\n  .NavLink__AztJU:focus {\n    outline: var(--outline);\n  }\n}\n\n.NavLink__AztJU:focus-visible {\n  outline: var(--outline);\n}\n\n.indicatorWrap__kdNqF {\n  width: 100%;\n  padding-inline: 0.5rem;\n  display: none;\n}\n\n.indicator__-zWqN {\n  display: block;\n  width: 100%;\n  border-radius: 2px;\n  height: var(--indicator-thickness);\n  background: transparent;\n}\n\n.NavItemContent__JVCbs {\n  display: flex;\n  gap: 0.5rem;\n  align-items: center;\n  box-sizing: border-box;\n  padding: 1.125rem 1.5rem;\n}\n\n.prominentContent__4-Hlf {\n  padding: 1.125rem 1.5rem calc(1.125rem - var(--indicator-thickness)) 1.5rem;\n}\n\n.prominent__uo64x,\n.highlight__F8mqc {\n  --font-color: var(--content-primary, #2d2e34);\n  --surface: var(--interactive-highlighted-secondary, #f0f2f4);\n}\n\n.showIndicator__lcY-8 {\n  display: flex;\n}\n\n.visible__OKX7Z {\n  background: var(--interactive-accent, #5070fd);\n}\n\n.prominentContent__4-Hlf.icon__YsBio {\n  padding: 1.25rem 1.5rem calc(1.25rem - var(--indicator-thickness)) 1.5rem;\n}\n\n.icon__YsBio {\n  padding: 1.25rem 1.5rem;\n}\n\n.bezelless__ICNkD {\n  padding: 0;\n}\n\n@media screen and (max-width: 600px) {\n  .NavLink__AztJU {\n    --font: var(\n      --label-S,\n      600 0.875rem/1.5 Maison Neue,\n      Helvetica,\n      Open Sans,\n      sans-serif\n    );\n    flex-direction: row;\n    outline-offset: -2px;\n    padding: 1.125rem 1.5rem;\n    gap: 0.625rem;\n  }\n\n  .NavItemContent__JVCbs {\n    flex: 1;\n    padding: 0;\n  }\n\n  .indicatorWrap__kdNqF {\n    width: var(--indicator-thickness);\n    align-self: stretch;\n    padding-inline: 0;\n  }\n\n  .indicator__-zWqN {\n    height: 100%;\n  }\n\n  .prominentContent__4-Hlf.icon__YsBio {\n    padding: 0;\n  }\n\n  .bezelless__ICNkD {\n    padding: 0;\n  }\n}\n";
+var stylesheet=".NavLink__AztJU {\n  --surface: transparent;\n  --font: var(\n    --text-bold-S,\n    600 0.875rem/1.5 Maison Neue,\n    Helvetica,\n    Open Sans,\n    sans-serif\n  );\n  --font-color: var(--content-muted, #8e919b);\n  --indicator-thickness: var(--indicator, 0.25rem);\n  --border-radius: var(--roundness-dynamic-type-1, 0.375rem);\n  --focus-appearance: var(--focus-outline, 2px solid);\n  --focus-color: var(--interactive-focus, #86afff);\n  --focus: var(--focus-appearance) var(--focus-color);\n\n  background: var(--surface);\n  color: var(--font-color);\n  font: var(--font);\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  outline-offset: 0;\n  cursor: pointer;\n  text-decoration: none;\n  border-radius: var(--border-radius);\n}\n\n.NavLink__AztJU:hover {\n  --font-color: var(--content-primary, #2d2e34);\n  --surface: var(--interactive-surface-primary-hover, #f5f7fa);\n  text-decoration: none;\n}\n\n.NavLink__AztJU:active {\n  text-decoration: none;\n  /* To add border styles for active state without taking space for border in box model */\n  box-shadow: inset 0px 0px 0px 1px var(--interactive-active, #1c3abb);\n}\n\n@supports not selector(:focus-visible) {\n  .NavLink__AztJU:focus {\n    outline: var(--focus);\n  }\n}\n\n.NavLink__AztJU:focus-visible {\n  outline: var(--focus);\n}\n\n.indicatorWrap__kdNqF {\n  width: 100%;\n  padding-inline: 0.5rem;\n  display: none;\n}\n\n.indicator__-zWqN {\n  display: block;\n  width: 100%;\n  border-radius: 2px;\n  height: var(--indicator-thickness);\n  background: transparent;\n}\n\n.NavItemContent__JVCbs {\n  display: flex;\n  gap: 0.5rem;\n  align-items: center;\n  box-sizing: border-box;\n  padding: 1.125rem 1.5rem;\n}\n\n.prominentContent__4-Hlf {\n  padding: 1.125rem 1.5rem calc(1.125rem - var(--indicator-thickness)) 1.5rem;\n}\n\n.prominent__uo64x,\n.highlight__F8mqc {\n  --font-color: var(--content-primary, #2d2e34);\n  --surface: var(--interactive-highlighted-secondary, #f0f2f4);\n}\n\n.showIndicator__lcY-8 {\n  display: flex;\n}\n\n.visible__OKX7Z {\n  background: var(--interactive-accent, #5070fd);\n}\n\n.prominentContent__4-Hlf.icon__YsBio {\n  padding: 1.25rem 1.5rem calc(1.25rem - var(--indicator-thickness)) 1.5rem;\n}\n\n.icon__YsBio {\n  padding: 1.25rem 1.5rem;\n}\n\n.bezelless__ICNkD {\n  padding: 0;\n}\n\n@media screen and (max-width: 600px) {\n  .NavLink__AztJU {\n    --font: var(\n      --text-bold-S,\n      600 0.875rem/1.5 Maison Neue,\n      Helvetica,\n      Open Sans,\n      sans-serif\n    );\n    flex-direction: row;\n    outline-offset: -2px;\n    padding: 1.125rem 1.5rem;\n    gap: 0.625rem;\n  }\n\n  .NavItemContent__JVCbs {\n    flex: 1;\n    padding: 0;\n  }\n\n  .indicatorWrap__kdNqF {\n    width: var(--indicator-thickness);\n    align-self: stretch;\n    padding-inline: 0;\n  }\n\n  .indicator__-zWqN {\n    height: 100%;\n  }\n\n  .prominentContent__4-Hlf.icon__YsBio {\n    padding: 0;\n  }\n\n  .bezelless__ICNkD {\n    padding: 0;\n  }\n}\n";
 styleInject(css_248z);
@@ -133,0 +133,0 @@

package.json

 {
   "name": "@asphalt-react/appbar",
-  "version": "2.0.0-alpha.26",
+  "version": "2.0.0-alpha.28",
   "description": "Appbar",
@@ -40,4 +40,4 @@ "keywords": [
   "dependencies": {
-    "@asphalt-react/button": "^2.0.0-alpha.26",
-    "@asphalt-react/context": "^2.0.0-alpha.16",
+    "@asphalt-react/button": "^2.0.0-alpha.28",
+    "@asphalt-react/context": "^2.0.0-alpha.28",
     "@asphalt-react/helper": "^2.0.0-alpha.19",
@@ -50,3 +50,3 @@ "@asphalt-react/iconpack": "^2.0.0-alpha.13",
   "license": "UNLICENSED",
-  "gitHead": "1676216e9df47ae0179c447f7225e4c2e96af4c7"
+  "gitHead": "8182ccd435d7586c15535446b2b4cc624b2b90fe"
 }

New alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

56833

increased by0.78%

Lines of code

325

increased by1.25%

Dependency changes

• Updated@asphalt-react/button@^2.0.0-alpha.28

• Updated@asphalt-react/context@^2.0.0-alpha.28