@neo4j-ndl/base 1.8.3 → 1.8.5

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # Change Log
 
+## 1.8.5
+
+### Patch Changes
+
+- cff6177: add keyboard navigation example, focusable cells prop for styling and minor table fixes
+
+## 1.8.4
+
+### Patch Changes
+
+- 13df2f7: drawer improvements
+
 ## 1.8.3
 
 ### Patch Changes

package/lib/NOTICE.txt

@@ -85,6 +85,8 @@ Third-party licenses
 │  │  ├─ URL: https://github.com/gregberge/svgr/tree/main/packages/cli
 │  │  ├─ VendorName: Greg Bergé
 │  │  └─ VendorUrl: https://react-svgr.com
+│  ├─ @table-nav/core@npm:0.0.5 (via npm:^0.0.5)
+│  ├─ @table-nav/react@npm:0.0.5 [d75d7] (via npm:^0.0.5 [d75d7])
 │  ├─ @tanstack/react-table@npm:8.9.3 [a2e03] (via npm:^8.9.3 [a2e03])
 │  │  ├─ URL: git+https://github.com/tanstack/table.git
 │  │  ├─ VendorName: Tanner Linsley

package/lib/cjs/tokens/js/storybook-design-token.js

@@ -1,7 +1,7 @@
 "use strict";
 /**
 * Do not edit directly
-* Generated on Mon, 10 Jul 2023 14:22:19 GMT
+* Generated on Tue, 11 Jul 2023 10:57:03 GMT
 */
 exports.__esModule = true;
 exports.tokens = void 0;

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

@@ -1,7 +1,7 @@
 "use strict";
 /**
 * Do not edit directly
-* Generated on Mon, 10 Jul 2023 14:22:19 GMT
+* Generated on Tue, 11 Jul 2023 10:57:03 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 Mon, 10 Jul 2023 14:22:19 GMT
+* Generated on Tue, 11 Jul 2023 10:57:03 GMT
 */
 module.exports = {
     "transitions": {

package/lib/esm/tokens/js/storybook-design-token.js

@@ -1,6 +1,6 @@
 /**
 * Do not edit directly
-* Generated on Mon, 10 Jul 2023 14:22:19 GMT
+* Generated on Tue, 11 Jul 2023 10:57:03 GMT
 */
 export const tokens = {
     "transitions": [

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

@@ -1,6 +1,6 @@
 /**
 * Do not edit directly
-* Generated on Mon, 10 Jul 2023 14:22:19 GMT
+* Generated on Tue, 11 Jul 2023 10:57:03 GMT
 */
 export const tokens = {
     "transitions": {

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

@@ -1,7 +1,7 @@
 "use strict";
 /**
 * Do not edit directly
-* Generated on Mon, 10 Jul 2023 14:22:19 GMT
+* Generated on Tue, 11 Jul 2023 10:57:03 GMT
 */
 module.exports = {
     "transitions": {

package/lib/neo4j-ds-styles.css

@@ -459,7 +459,7 @@ video {
  */
 /**
  * Do not edit directly
- * Generated on Mon, 10 Jul 2023 14:22:19 GMT
+ * Generated on Tue, 11 Jul 2023 10:57:03 GMT
  */
 :root {
   --transitions-values-properties-default: all;
@@ -2852,15 +2852,33 @@ a.ndl-btn{
  */
 .ndl-drawer{
   position: relative;
-  box-sizing: content-box;
   display: none;
   flex-direction: column;
   background-color: rgb(var(--palette-neutral-bg-weak));
-  padding: 1.5rem;
+  padding-top: 1.5rem;
+  padding-bottom: 1.5rem;
 }
 .ndl-drawer.ndl-drawer-expanded{
   display: flex;
 }
+.ndl-drawer .ndl-drawer-body-wrapper{
+  position: relative;
+  display: flex;
+  width: 100%;
+  flex-grow: 1;
+  flex-direction: column;
+  align-items: center;
+}
+.ndl-drawer .ndl-drawer-body{
+  box-sizing: border-box;
+  height: 1.5rem;
+  width: 100%;
+  flex-grow: 1;
+  overflow-x: hidden;
+  overflow-y: scroll;
+  padding-left: 1.5rem;
+  padding-right: 1.5rem;
+}
 .ndl-drawer .ndl-drawer-close-button{
   position: absolute;
   top: 1rem;
@@ -2870,42 +2888,31 @@ a.ndl-btn{
   border-style: solid;
   border-color: rgb(var(--palette-neutral-border-weak));
 }
-.ndl-drawer.ndl-drawer-left .ndl-drawer-header{
-  margin-right: 3rem;
-  padding-bottom: 1rem;
-  text-align: left;
-}
-.ndl-drawer.ndl-drawer-left .ndl-drawer-actions{
-  margin-top: auto;
-  display: flex;
-  justify-content: flex-end;
-  gap: 1rem;
-  padding-top: 1rem;
-}
-.ndl-drawer.ndl-drawer-left .ndl-drawer-close-button{
-  left: unset;
-  right: 1rem;
-}
 .ndl-drawer.ndl-drawer-right{
   border-left-width: 1px;
   border-style: solid;
   border-color: rgb(var(--palette-neutral-border-weak));
 }
-.ndl-drawer.ndl-drawer-right .ndl-drawer-header{
+.ndl-drawer .ndl-drawer-close-button{
+  position: absolute;
+  left: unset;
+  right: 1rem;
+}
+.ndl-drawer .ndl-drawer-header{
   margin-right: 3rem;
-  padding-bottom: 1rem;
+  padding-left: 1.5rem;
+  padding-right: 1.5rem;
+  padding-bottom: 1.5rem;
   text-align: left;
 }
-.ndl-drawer.ndl-drawer-right .ndl-drawer-actions{
+.ndl-drawer .ndl-drawer-actions{
   margin-top: auto;
   display: flex;
   justify-content: flex-end;
   gap: 1rem;
-  padding-top: 1rem;
-}
-.ndl-drawer.ndl-drawer-right .ndl-drawer-close-button{
-  left: unset;
-  right: 1rem;
+  padding-left: 1.5rem;
+  padding-right: 1.5rem;
+  padding-top: 1.5rem;
 }
 .ndl-drawer.ndl-drawer-overlay{
   position: absolute;
@@ -2917,18 +2924,15 @@ a.ndl-btn{
 }
 .ndl-drawer.ndl-drawer-overlay.ndl-drawer-left{
   left: 0px;
+  border-width: 0px;
 }
 .ndl-drawer.ndl-drawer-overlay.ndl-drawer-right{
   right: 0px;
+  border-width: 0px;
 }
 .ndl-drawer.ndl-drawer-push{
   position: relative;
 }
-.ndl-drawer .ndl-drawer-content{
-  display: flex;
-  height: 100%;
-  flex-direction: column;
-}
 /**
  *
  *  Copyright (c) "Neo4j"
@@ -3250,8 +3254,19 @@ a.ndl-btn{
  *  You should have received a copy of the GNU General Public License
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
+.ndl-table-focusable-cells .ndl-focusable-cell {
+    outline: none;
+    border: 1px solid transparent;
+  }
+.ndl-table-focusable-cells .ndl-focusable-cell:focus,
+    .ndl-table-focusable-cells .ndl-focusable-cell:focus-visible {
+      z-index: 2;
+      border-radius: 2px;
+      border: 1px solid rgb(var(--palette-primary-focus));
+    }
 .ndl-table-root {
   /* Root wrapper div styles */
+  isolation: isolate;
   display: flex;
   width: 100%;
   max-width: 100%;
@@ -3298,6 +3313,7 @@ a.ndl-btn{
       position: relative;
       background-color: rgb(var(--palette-neutral-bg-weak));
       overflow-y: auto;
+      border-top-width: 0px;
     }
 /* Table body - Single row, multiple columns */
 .ndl-table-root .ndl-div-table .ndl-table-tbody .ndl-table-tr:not(:last-child):after {
@@ -3341,6 +3357,7 @@ a.ndl-btn{
         height: 48px;
         /* Fixed box shadow that does not match 1:1 the Figma - Agreed with the design team */
         box-shadow: 0 2px 8px rgb(var(--palette-neutral-bg-strongest), 10%);
+        z-index: var(--z-index-alias-overlay);
       }
 /* Table head - Cell - Avoid hover effects on sibling cells when resizing */
 .ndl-table-root .ndl-div-table .ndl-table-thead.ndl-table-is-resizing .ndl-table-th {
@@ -3548,7 +3565,6 @@ a.ndl-btn{
 .ndl-table-root .ndl-table-navigation .ndl-table-pagination-icon{
   height: 1.25rem;
   width: 1.25rem;
-  color: rgb(var(--palette-neutral-text-weak));
 }
 .ndl-table-root .ndl-table-navigation .ndl-table-pagination-icon-button{
   position: relative;
@@ -3568,6 +3584,7 @@ a.ndl-btn{
 .ndl-table-root .ndl-table-navigation .ndl-table-pagination-icon-button:hover{
   background-color: rgb(var(--palette-primary-bg-strong));
   --tw-bg-opacity: 0.1;
+  color: rgb(var(--palette-neutral-text-inverse));
 }
 .ndl-table-root .ndl-table-navigation .ndl-table-pagination-numeric-button {
       min-width: 36px;

package/lib/tokens/css/tokens.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Mon, 10 Jul 2023 14:22:19 GMT
+ * Generated on Tue, 11 Jul 2023 10:57:03 GMT
  */
 
 :root {

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

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Mon, 10 Jul 2023 14:22:19 GMT
+ * Generated on Tue, 11 Jul 2023 10:57:03 GMT
  */
 
 module.exports = {

package/lib/tokens/js/tokens.js

@@ -1,6 +1,6 @@
 /**
 * Do not edit directly
-* Generated on Mon, 10 Jul 2023 14:22:19 GMT
+* Generated on Tue, 11 Jul 2023 10:57:03 GMT
 */
 
 export const tokens = {

package/lib/tokens/scss/tokens.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 10 Jul 2023 14:22:19 GMT
+// Generated on Tue, 11 Jul 2023 10:57:03 GMT
 
 $transitions-values-properties-default: all;
 $transitions-values-duration-default: 100ms;

package/lib/types/tokens/js/storybook-design-token.d.ts

@@ -1,6 +1,6 @@
 /**
 * Do not edit directly
-* Generated on Mon, 10 Jul 2023 14:22:19 GMT
+* Generated on Tue, 11 Jul 2023 10:57:03 GMT
 */
 export const tokens: {
     transitions: {

package/package.json

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