@neo4j-ndl/base 1.0.0 → 1.0.1

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Change Log
 
+## 1.0.1
+
+### Patch Changes
+
+- 6812332: accessibility indicators, better match with figma ui kit, and context menu sibling nested menu issue
+
 ## 1.0.0
 
 ### Major Changes

package/lib/NOTICE.txt

@@ -57,28 +57,28 @@ Third-party licenses
 │  ├─ @heroicons/react@npm:2.0.13 [a2e03] (via npm:2.0.13 [a2e03])
 │  │  ├─ URL: https://github.com/tailwindlabs/heroicons.git
 │  │  └─ VendorUrl: https://github.com/tailwindlabs/heroicons#readme
-│  ├─ @storybook/addon-a11y@npm:7.0.0-beta.40 [d75d7] (via npm:7.0.0-beta.40 [d75d7])
+│  ├─ @storybook/addon-a11y@npm:7.0.0-beta.54 [d75d7] (via npm:7.0.0-beta.54 [d75d7])
 │  │  ├─ URL: https://github.com/storybookjs/storybook.git
 │  │  └─ VendorUrl: https://github.com/storybookjs/storybook/tree/next/code/addons/a11y
-│  ├─ @storybook/addon-actions@npm:7.0.0-beta.40 [d75d7] (via npm:7.0.0-beta.40 [d75d7])
+│  ├─ @storybook/addon-actions@npm:7.0.0-beta.54 [d75d7] (via npm:7.0.0-beta.54 [d75d7])
 │  │  ├─ URL: https://github.com/storybookjs/storybook.git
 │  │  └─ VendorUrl: https://github.com/storybookjs/storybook/tree/next/code/addons/actions
-│  ├─ @storybook/addon-essentials@npm:7.0.0-beta.40 [d75d7] (via npm:7.0.0-beta.40 [d75d7])
+│  ├─ @storybook/addon-essentials@npm:7.0.0-beta.54 [d75d7] (via npm:7.0.0-beta.54 [d75d7])
 │  │  ├─ URL: https://github.com/storybookjs/storybook.git
 │  │  └─ VendorUrl: https://github.com/storybookjs/storybook/tree/next/code/addons/essentials
-│  ├─ @storybook/addon-links@npm:7.0.0-beta.40 [d75d7] (via npm:7.0.0-beta.40 [d75d7])
+│  ├─ @storybook/addon-links@npm:7.0.0-beta.54 [d75d7] (via npm:7.0.0-beta.54 [d75d7])
 │  │  ├─ URL: https://github.com/storybookjs/storybook.git
 │  │  └─ VendorUrl: https://github.com/storybookjs/storybook/tree/next/code/addons/links
-│  ├─ @storybook/addon-storysource@npm:7.0.0-beta.40 [d75d7] (via npm:7.0.0-beta.40 [d75d7])
+│  ├─ @storybook/addon-storysource@npm:7.0.0-beta.54 [d75d7] (via npm:7.0.0-beta.54 [d75d7])
 │  │  ├─ URL: https://github.com/storybookjs/storybook.git
 │  │  └─ VendorUrl: https://github.com/storybookjs/storybook/tree/next/code/addons/storysource
-│  ├─ @storybook/react@npm:7.0.0-beta.40 [d75d7] (via npm:7.0.0-beta.40 [d75d7])
+│  ├─ @storybook/react@npm:7.0.0-beta.54 [d75d7] (via npm:7.0.0-beta.54 [d75d7])
 │  │  ├─ URL: https://github.com/storybookjs/storybook.git
 │  │  └─ VendorUrl: https://github.com/storybookjs/storybook/tree/main/renderers/react
-│  ├─ @storybook/react-vite@npm:7.0.0-beta.40 [d75d7] (via npm:7.0.0-beta.40 [d75d7])
+│  ├─ @storybook/react-vite@npm:7.0.0-beta.54 [d75d7] (via npm:7.0.0-beta.54 [d75d7])
 │  │  ├─ URL: https://github.com/storybookjs/storybook.git
 │  │  └─ VendorUrl: https://github.com/storybookjs/storybook/tree/main/frameworks/react-vite
-│  ├─ @storybook/react-webpack5@npm:7.0.0-beta.40 [d75d7] (via npm:7.0.0-beta.40 [d75d7])
+│  ├─ @storybook/react-webpack5@npm:7.0.0-beta.54 [d75d7] (via npm:7.0.0-beta.54 [d75d7])
 │  │  ├─ URL: https://github.com/storybookjs/storybook.git
 │  │  └─ VendorUrl: https://github.com/storybookjs/storybook/tree/main/frameworks/react-webpack5
 │  ├─ @svgr/cli@npm:6.5.1 (via npm:6.5.1)
@@ -236,7 +236,7 @@ Third-party licenses
 │  │  ├─ URL: https://github.com/que-etc/resize-observer-polyfill.git
 │  │  ├─ VendorName: Denis Rul
 │  │  └─ VendorUrl: https://github.com/que-etc/resize-observer-polyfill
-│  ├─ storybook@npm:7.0.0-beta.40 (via npm:7.0.0-beta.40)
+│  ├─ storybook@npm:7.0.0-beta.54 (via npm:7.0.0-beta.54)
 │  │  ├─ URL: https://github.com/storybookjs/storybook.git
 │  │  └─ VendorUrl: https://github.com/storybookjs/storybook/tree/main/lib/cli
 │  ├─ storybook-addon-pseudo-states@npm:1.15.1 [d75d7] (via npm:^1.15.1 [d75d7])

package/lib/cjs/tokens/js/tokens-esm.js

@@ -1,7 +1,7 @@
 "use strict";
 /**
 * Do not edit directly
-* Generated on Wed, 22 Feb 2023 14:44:28 GMT
+* Generated on Fri, 03 Mar 2023 14:32:24 GMT
 */
 exports.__esModule = true;
 exports.tokens = void 0;

package/lib/cjs/tokens/js/tokens.js

@@ -1,7 +1,7 @@
 "use strict";
 /**
 * Do not edit directly
-* Generated on Wed, 22 Feb 2023 14:44:28 GMT
+* Generated on Fri, 03 Mar 2023 14:32:24 GMT
 */
 module.exports = {
     "transitions": {

package/lib/esm/tokens/js/tokens-esm.js

@@ -1,6 +1,6 @@
 /**
 * Do not edit directly
-* Generated on Wed, 22 Feb 2023 14:44:28 GMT
+* Generated on Fri, 03 Mar 2023 14:32:24 GMT
 */
 export const tokens = {
     "transitions": {

package/lib/esm/tokens/js/tokens.js

@@ -1,7 +1,7 @@
 "use strict";
 /**
 * Do not edit directly
-* Generated on Wed, 22 Feb 2023 14:44:28 GMT
+* Generated on Fri, 03 Mar 2023 14:32:24 GMT
 */
 module.exports = {
     "transitions": {

package/lib/neo4j-ds-styles.css

@@ -459,7 +459,7 @@ video {
  */
 /**
  * Do not edit directly
- * Generated on Wed, 22 Feb 2023 14:44:28 GMT
+ * Generated on Fri, 03 Mar 2023 14:32:24 GMT
  */
 :root {
   --transitions-values-properties-default: all;
@@ -2250,7 +2250,7 @@ a.ndl-btn{
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 .ndl-menu{
-  padding: 1rem;
+  padding: 8px;
 }
 .ndl-menu.ndl-large .ndl-menu-item{
   padding-top: 0.75rem;
@@ -2260,11 +2260,8 @@ a.ndl-btn{
 }
 .ndl-menu.ndl-large .ndl-menu-item-title{
   width: 100%;
-}
-
-.ndl-menu.ndl-large .ndl-menu-item-title {
-  font-size: var(--font-size-h6);
-  font-weight: var(--font-weight-bold);
+  font-size: var(--font-size-body-large);
+  font-weight: var(--font-weight-normal);
   letter-spacing: 0.016rem;
   line-height: 1.5rem;
 }
@@ -2326,13 +2323,13 @@ a.ndl-btn{
   letter-spacing: 0.016rem;
   line-height: 1.25rem;
 }
-.ndl-menu .ndl-menu-item:hover:not(.ndl-disabled), 
-    
-    .ndl-menu .ndl-menu-item:focus{
-  border-radius: 8px;
-  --tw-bg-opacity: 1;
-  background-color: rgb(245 247 250 / var(--tw-bg-opacity));
-}
+.ndl-menu .ndl-menu-item:hover:not(.ndl-disabled),
+    .ndl-menu .ndl-menu-item:focus {
+      /* Was :focus-visible, changed to support Safari */
+      border-radius: 8px;
+      --tw-bg-opacity: 1;
+      background-color: rgb(245 247 250 / var(--tw-bg-opacity));
+    }
 .ndl-menu .ndl-menu-item.ndl-disabled{
   pointer-events: none;
   cursor: default;
@@ -2360,11 +2357,14 @@ a.ndl-btn{
   letter-spacing: 0.016rem;
   line-height: 1.25rem;
 }
-.ndl-menu .ndl-menu-item-icon{
-  margin-right: 0.5rem;
-  height: 0.75rem;
-  width: 0.75rem;
-}
+.ndl-menu .ndl-menu-item-icon {
+    margin-top: 2px;
+    width: 16px;
+    height: 16px;
+    flex-shrink: 0;
+    --tw-text-opacity: 1;
+    color: rgb(83 91 102 / var(--tw-text-opacity));
+  }
 .ndl-menu .ndl-menu-header{
   margin-bottom: 1rem;
   padding-left: 0.5rem;
@@ -4090,12 +4090,7 @@ a.ndl-btn{
 }
 /* Icon Left Collapsed Styles */
 .ndl-side-navigation:not(.ndl-expanded) .ndl-side-navigation-drawer-button {
-      /* This is important because we can't rely on
-            `right` to be accurate due to the scrollbar
-            on the child <nav /> element. So we switch
-            to offset from the left when collapsed to
-            make the collapse icon and the nav icons
-            align */
+      /* This is important because we can't rely on `right` to be accurate due to the scrollbar on the child <nav /> element. So we switch to offset from the left when collapsed to make the collapse icon and the nav icons align  */
       left: 0.5rem;
       right: unset;
     }
@@ -4151,14 +4146,41 @@ a.ndl-btn{
   margin-bottom: 0.125rem;
   margin-left: 1rem;
   margin-right: 1rem;
-    /* 2px */ /* for focus-visible */
+    /* 2px */
 }
 /* space between scroll bar */
 .ndl-side-navigation .ndl-side-navigation-nav-item:not(.ndl-expanded){
   margin-left: 0.5rem;
   margin-right: 0.5rem;
 }
+.ndl-side-navigation .ndl-side-navigation-nav-item:not(.ndl-expanded) .ndl-selected::before {
+          /* Side indication for a11y */
+          content: '';
+          width: 4px;
+          height: 100%;
+          border-radius: 0 100px 100px 0;
+          position: absolute;
+          left: -8px;
+          top: 0px;
+          box-shadow: none;
+          --tw-bg-opacity: 1;
+          background-color: rgb(0 111 214 / var(--tw-bg-opacity));
+        }
 /* 6px */
+.ndl-side-navigation .ndl-side-navigation-nav-item.ndl-expanded .ndl-selected::before {
+          /* Side indication for a11y */
+          content: '';
+          width: 4px;
+          height: 100%;
+          border-radius: 0 100px 100px 0;
+          position: absolute;
+          left: -16px;
+          top: 0px;
+          box-shadow: none;
+          --tw-bg-opacity: 1;
+          background-color: rgb(0 111 214 / var(--tw-bg-opacity));
+        }
+/* for focus-visible */
 .ndl-side-navigation .ndl-side-navigation-nav-item > .ndl-side-navigation-inner-item{
   display: flex;
   height: 3rem;
@@ -4181,6 +4203,7 @@ a.ndl-btn{
   color: rgb(113 119 128 / var(--tw-text-opacity));
 }
 .ndl-side-navigation .ndl-side-navigation-nav-item > .ndl-side-navigation-inner-item.ndl-selected{
+  position: relative;
   --tw-bg-opacity: 1;
   background-color: rgb(230 248 255 / var(--tw-bg-opacity));
   --tw-text-opacity: 1;
@@ -4377,12 +4400,12 @@ a.ndl-btn{
 .n-w-5{
   width: 1.25rem;
 }
-.n-w-4{
-  width: 1rem;
-}
 .n-w-full{
   width: 100%;
 }
+.n-w-4{
+  width: 1rem;
+}
 .n-w-10{
   width: 2.5rem;
 }
@@ -4463,6 +4486,12 @@ a.ndl-btn{
 .n-justify-between{
   justify-content: space-between;
 }
+.n-gap-token-4{
+  gap: 8px;
+}
+.n-gap-token-2{
+  gap: 2px;
+}
 .n-gap-3{
   gap: 0.75rem;
 }
@@ -4484,9 +4513,6 @@ a.ndl-btn{
 .n-gap-12{
   gap: 3rem;
 }
-.n-gap-token-2{
-  gap: 2px;
-}
 .n-gap-x-10{
   -moz-column-gap: 2.5rem;
        column-gap: 2.5rem;

package/lib/tokens/css/tokens.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Wed, 22 Feb 2023 14:44:28 GMT
+ * Generated on Fri, 03 Mar 2023 14:32:24 GMT
  */
 
 :root {

package/lib/tokens/js/tokens-raw.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Wed, 22 Feb 2023 14:44:28 GMT
+ * Generated on Fri, 03 Mar 2023 14:32:24 GMT
  */
 
 module.exports = {

package/lib/tokens/js/tokens.js

@@ -1,6 +1,6 @@
 /**
 * Do not edit directly
-* Generated on Wed, 22 Feb 2023 14:44:28 GMT
+* Generated on Fri, 03 Mar 2023 14:32:24 GMT
 */
 
 export const tokens = {

package/lib/tokens/scss/tokens.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Wed, 22 Feb 2023 14:44:28 GMT
+// Generated on Fri, 03 Mar 2023 14:32:24 GMT
 
 $transitions-values-properties-default: all;
 $transitions-values-duration-default: 100ms;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neo4j-ndl/base",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "Neo4j base package for the design system",
   "author": "Neo4j Inc.",
   "homepage": "",