@getflip/swirl-components 0.8.2 → 0.8.3

package/dist/collection/components/flip-console-layout/flip-console-layout.css

@@ -91,13 +91,6 @@
   grid-area: navigation;
 }
 
-@media (min-width: 768px) {
-
-.console-layout__hide-navigation-button {
-    display: none
-}
-  }
-
 .console-layout__user {
   overflow: hidden;
   margin-top: var(--s-border-width-default);

package/dist/collection/components/flip-console-layout/flip-console-layout.js

@@ -18,9 +18,6 @@ export class FlipConsoleLayout {
     this.onMobileNavigationToggleClick = () => {
       this.toggleSidebar();
     };
-    this.onHideNavigationButtonClick = () => {
-      this.hideSidebar();
-    };
     this.onClick = (event) => {
       var _a;
       const target = event.target;
@@ -116,9 +113,7 @@ export class FlipConsoleLayout {
                 h("path", { d: "M12.2072 10.9785L7.32419 10.1459L0.625 14.0709L5.38887 14.9629L12.2072 10.9785Z", fill: "#80A8F4" })),
               h("flip-text", { class: "console-layout__logo-text", weight: "medium" }, this.logoText))),
           h("nav", { "aria-label": this.navigationLabel, class: "console-layout__navigation" },
-            h("slot", { name: "navigation" }),
-            this.sidebarActive && (h("flip-visually-hidden", null,
-              h("button", { class: "console-layout__hide-navigation-button", onClick: this.onHideNavigationButtonClick, type: "button" }, this.hideNavigationButtonLabel)))),
+            h("slot", { name: "navigation" })),
           h("div", { class: "console-layout__user" },
             h("slot", { name: "user" }))),
         h("main", { "aria-labelledby": "app-name", class: "console-layout__main" },

package/dist/collection/components/flip-tree-navigation-item/flip-tree-navigation-item.css

@@ -24,7 +24,8 @@
   }
 
   :host(:focus) {
-    outline-color: var(--s-focus-default);
+    background-color: var(--s-surface-hovered);
+    outline: none;
   }
 
   :host(.tree-navigation-item--active) {

package/dist/collection/components/flip-tree-navigation-item/flip-tree-navigation-item.js

@@ -3,16 +3,7 @@ import classnames from "classnames";
 export class FlipTreeNavigationItem {
   constructor() {
     this.onKeyDown = (event) => {
-      if (event.code === "Space") {
-        event.preventDefault();
-      }
-      else if (event.code === "Enter") {
-        event.preventDefault();
-        this.el.click();
-      }
-    };
-    this.onKeyUp = (event) => {
-      if (event.code === "Space") {
+      if (event.code === "Enter") {
         event.preventDefault();
         this.el.click();
       }
@@ -23,7 +14,7 @@ export class FlipTreeNavigationItem {
       "tree-navigation-item--active": this.active,
       "tree-navigation-item--has-icon": Boolean(this.icon),
     });
-    return (h(Host, { class: className, onKeyDown: this.onKeyDown, onKeyUp: this.onKeyUp, role: "button", tabIndex: 0 },
+    return (h(Host, { class: className, onKeyDown: this.onKeyDown, role: "link", tabIndex: 0 },
       this.icon && (h("span", { class: "tree-navigation-item__icon", innerHTML: this.icon })),
       h("span", { class: "tree-navigation-item__label" }, this.label)));
   }