graphwise-styleguide 1.0.4 → 1.0.6

package/dist/variables-dark.css

@@ -1718,7 +1718,6 @@
   --gw-button-tertiary-disabled-border-color: var(--gw-neutral-transparent);
   --gw-button-tertiary-link-border-color: var(--gw-neutral-transparent);
   --gw-xxs-line-height: var(--gw-1rem-line-height);
-  --gw-topnav-border-color: var(--gw-neutral-transparent);
   --gw-inputtext-focus-ring-width: var(--gw-focus-ring-width);
   --gw-inputtext-focus-ring-offset: var(--gw-focus-ring-offset);
   --gw-inputtext-sm-padding-x: var(--gw-form-field-sm-padding-x);
@@ -2036,9 +2035,11 @@
   --gw-imagecompare-handle-focus-ring-width: var(--gw-focus-ring-width);
   --gw-imagecompare-handle-focus-ring-offset: var(--gw-focus-ring-offset);
   --gw-imagecompare-handle-transition-duration: var(--gw-transition-duration);
+  --gw-overlaybadge-outline-color: var(--gw-neutral-transparent);
   --gw-swagger-button-height: var(--gw-size-1-5);
   --gw-shortcuts-cta-padding-x: var(--gw-space-0-25);
   --gw-shortcuts-cta-padding-y: var(--gw-space-0-125);
+  --gw-topnav-border-color: var(--gw-neutral-transparent);
   --gw-focus-ring-stroke-width: var(--gw-focus-ring-offset) + var(--gw-focus-ring-width);
   --gw-sidenav-shadow-1-color: var(--gw-color-grey-900-50);
   --gw-sidenav-shadow-2-color: var(--gw-color-grey-900-50);
@@ -2223,7 +2224,7 @@
   --gw-background-page: var(--gw-neutral-50);
   --gw-background-header: var(--gw-primary-50);
   --gw-background-raised: var(--gw-primary-50);
-  --gw-background-highlighted: var(--gw-primary-100);
+  --gw-background-highlighted: var(--gw-primary-200);
   --gw-background-surface: var(--gw-neutral-0);
   --gw-background-surface-semitransparent: var(--gw-neutral-50-50);
   --gw-background-elevated: var(--gw-neutral-50);
@@ -2272,8 +2273,6 @@
   --gw-button-secondary-active-background: var(--gw-neutral-0);
   --gw-button-secondary-focus-ring-color: var(--gw-primary-200);
   --gw-button-secondary-disabled-background: var(--gw-neutral-0);
-  --gw-button-secondary-disabled-border-color: var(--gw-primary-300);
-  --gw-button-secondary-disabled-color: var(--gw-primary-300);
   --gw-button-secondary-link-disabled-background: var(--gw-neutral-0);
   --gw-button-secondary-link-disabled-border-color: var(--gw-primary-200);
   --gw-button-secondary-link-disabled-color: var(--gw-primary-200);
@@ -2317,8 +2316,7 @@
   --gw-hover-color: var(--gw-neutral-800);
   --gw-hover-background: var(--gw-neutral-200);
   --gw-hover-border-color: var(--gw-neutral-400);
-  --gw-default-border-color: var(--gw-neutral-300);
-  --gw-topnav-background: var(--gw-primary-100);
+  --gw-default-border-color: var(--gw-neutral-200);
   --gw-inputtext-border-radius: var(--gw-defaul-border-radius);
   --gw-inputtext-focus-ring-style: var(--gw-form-field-focus-ring-style);
   --gw-inputtext-padding-x: var(--gw-form-field-padding-x);
@@ -2645,9 +2643,9 @@
   --gw-tertiary-hover-color: var(--gw-tertiary-dark);
   --gw-tertiary-active-color: var(--gw-tertiary-light);
   --gw-background-brand: var(--gw-primary-base);
-  --gw-foreground-on-surface-brand: var(--gw-primary-base);
+  --gw-foreground-on-surface-brand: var(--gw-primary-light);
   --gw-foreground-on-surface-primary: var(--gw-primary-dark);
-  --gw-foreground-on-surface-strong: var(--gw-primary-dark);
+  --gw-foreground-on-surface-strong: var(--gw-primary-base);
   --gw-foreground-link-idle: var(--gw-primary-base);
   --gw-foreground-link-hover: var(--gw-primary-dark);
   --gw-foreground-link-visited: var(--gw-secondary-base);
@@ -2668,11 +2666,12 @@
   --gw-list-option-selected-background: var(--gw-highlight-background);
   --gw-sidenav-menuitem-icon-color: var(--gw-foreground-on-surface-default);
   --gw-sidenav-menuitem-icon-second-color: var(--gw-foreground-on-surface-subtile);
-  --gw-sidenav-menuitem-hover-icon-color: var(--gw-primary-base);
+  --gw-sidenav-menuitem-hover-icon-color: var(--gw-primary-dark);
+  --gw-sidenav-menuitem-hover-color: var(--gw-primary-dark);
   --gw-sidenav-menuitem-hover-background: var(--gw-background-raised);
-  --gw-sidenav-menuitem-selected-icon-color: var(--gw-primary-base);
+  --gw-sidenav-menuitem-selected-icon-color: var(--gw-primary-dark);
   --gw-sidenav-menuitem-selected-background: var(--gw-background-highlighted);
-  --gw-sidenav-menuitem-selected-color: var(--gw-primary-base);
+  --gw-sidenav-menuitem-selected-color: var(--gw-primary-dark);
   --gw-sidenav-menuitem-background: var(--gw-background-surface);
   --gw-sidenav-menuitem-color: var(--gw-foreground-on-surface-default);
   --gw-sidenav-menuitem-open-icon-color: var(--gw-foreground-on-surface-default);
@@ -2682,9 +2681,9 @@
   --gw-sidenav-submenuitem-color: var(--gw-foreground-on-surface-default);
   --gw-sidenav-submenuitem-background: var(--gw-background-surface);
   --gw-sidenav-submenuitem-hover-background: var(--gw-background-raised);
-  --gw-sidenav-submenuitem-hover-color: var(--gw-primary-base);
+  --gw-sidenav-submenuitem-hover-color: var(--gw-primary-dark);
   --gw-sidenav-submenuitem-selected-background: var(--gw-background-highlighted);
-  --gw-sidenav-submenuitem-selected-color: var(--gw-primary-base);
+  --gw-sidenav-submenuitem-selected-color: var(--gw-primary-dark);
   --gw-sidenav-submenuitem-open-background: var(--gw-background-raised);
   --gw-sidenav-submenuitem-open-color: var(--gw-foreground-on-surface-default);
   --gw-sidenav-background: var(--gw-background-surface);
@@ -2695,7 +2694,11 @@
   --gw-overlay-popover-border-color: var(--gw-default-border-color);
   --gw-overlay-modal-border-color: var(--gw-default-border-color);
   --gw-button-border-radius: var(--gw-form-field-border-radius);
+  --gw-button-primary-hover-background: var(--gw-primary-base);
+  --gw-button-primary-hover-border-color: var(--gw-primary-base);
   --gw-button-primary-hover-color: var(--gw-foreground-on-brand);
+  --gw-button-primary-active-background: var(--gw-primary-base);
+  --gw-button-primary-active-border-color: var(--gw-primary-base);
   --gw-button-primary-active-color: var(--gw-foreground-on-brand);
   --gw-button-primary-icon-color: var(--gw-foreground-on-brand);
   --gw-button-primary-icon-second-color: var(--gw-foreground-on-brand);
@@ -2703,14 +2706,8 @@
   --gw-button-primary-focus-ring-color: var(--gw-primary-base);
   --gw-button-primary-disabled-background: var(--gw-primary-lighter);
   --gw-button-primary-disabled-border-color: var(--gw-primary-lighter);
-  --gw-button-primary-link-color: var(--gw-primary-base);
-  --gw-button-primary-link-hover-color: var(--gw-primary-dark);
-  --gw-button-primary-link-active-color: var(--gw-primary-base);
+  --gw-button-primary-link-active-color: var(--gw-primary-light);
   --gw-button-secondary-hover-background: var(--gw-background-raised);
-  --gw-button-secondary-hover-border-color: var(--gw-primary-base);
-  --gw-button-secondary-hover-color: var(--gw-primary-base);
-  --gw-button-secondary-active-border-color: var(--gw-primary-dark);
-  --gw-button-secondary-active-color: var(--gw-primary-dark);
   --gw-button-secondary-link-background: var(--gw-secondary-light);
   --gw-button-secondary-link-hover-background: var(--gw-secondary-base);
   --gw-button-secondary-link-hover-border-color: var(--gw-secondary-base);
@@ -2856,6 +2853,8 @@
   --gw-checkbox-checked-background: var(--gw-primary-base);
   --gw-checkbox-checked-border-color: var(--gw-primary-base);
   --gw-checkbox-checked-focus-border-color: var(--gw-primary-base);
+  --gw-checkbox-checked-disabled-border-color: var(--gw-foreground-on-surface-secondary);
+  --gw-checkbox-checked-disabled-background: var(--gw-foreground-on-surface-secondary);
   --gw-checkbox-filled-background: var(--gw-form-field-filled-background);
   --gw-checkbox-focus-ring-color: var(--gw-focus-ring-color);
   --gw-checkbox-icon-disabled-color: var(--gw-form-field-disabled-color);
@@ -3090,6 +3089,7 @@
   --gw-tabs-tab-border-color: var(--gw-neutral-lighter);
   --gw-tabs-tab-border-bottom-color: var(--gw-default-border-color);
   --gw-tabs-tab-active-border-color: var(--gw-default-border-color);
+  --gw-tabs-tab-active-color: var(--gw-foreground-on-surface-default);
   --gw-tabs-tab-color: var(--gw-neutral-dark);
   --gw-tabs-tab-hover-border-bottom-color: var(--gw-default-border-color);
   --gw-tabs-tab-background: var(--gw-neutral-lighter);
@@ -3272,9 +3272,9 @@
   --gw-swagger-border-color: var(--gw-default-border-color);
   --gw-swagger-post-background: var(--gw-success-200);
   --gw-shortcuts-panel-key-color: var(--gw-secondary-base);
-  --gw-classhierarchy-node-label-color: var(--gw-foreground-on-surface-default);
-  --gw-classhierarchy-node-hover-border-color: var(--gw-foreground-on-surface-secondary);
-  --gw-classhierarchy-node-selected-border-color: var(--gw-border-focus);
+  --gw-cluster-node-leader-background: var(--gw-foreground-on-surface-accent);
+  --gw-cluster-node-outofsync-background: var(--gw-foreground-on-surface-disabled);
+  --gw-cluster-background: var(--gw-body-background);
   --gw-link-regular-color: var(--gw-secondary-light);
   --gw-link-regular-hover-color: var(--gw-secondary-base);
   --gw-link-regular-visited-color: var(--gw-secondary-base);
@@ -3289,8 +3289,14 @@
   --gw-loader-color: var(--gw-foreground-on-surface-accent);
   --gw-page-background: var(--gw-background-page);
   --gw-page-login-background: var(--gw-background-surface);
+  --gw-topnav-background: var(--gw-background-header);
+  --gw-classhierarchy-node-label-color: var(--gw-foreground-on-surface-default);
+  --gw-classhierarchy-node-hover-border-color: var(--gw-foreground-on-surface-secondary);
+  --gw-classhierarchy-node-selected-border-color: var(--gw-border-focus);
   --gw-border-default-color: var(--gw-default-border-color);
   --gw-focus-ring-stroke-color: var(--gw-focus-ring-color);
+  --gw-sidenav-menuitem-selected-border-color: var(--gw-primary-dark);
+  --gw-sidenav-submenuitem-selected-border-color: var(--gw-primary-dark);
   --gw-success-text: var(--gw-success-dark);
   --gw-warning-text: var(--gw-help-dark);
   --gw-border-color-success: var(--gw-success-base);
@@ -3301,22 +3307,25 @@
   --gw-list-option-selected-focus-color: var(--gw-highlight-focus-color);
   --gw-list-option-selected-color: var(--gw-text-color);
   --gw-list-option-color: var(--gw-text-color);
-  --gw-sidenav-menuitem-hover-color: var(--gw-foreground-on-surface-brand);
   --gw-sidenav-togglebutton-background: var(--gw-sidenav-background);
   --gw-overlay-select-color: var(--gw-text-color);
   --gw-overlay-popover-color: var(--gw-text-color);
   --gw-overlay-modal-color: var(--gw-text-color);
-  --gw-button-primary-background: var(--gw-foreground-on-surface-primary);
-  --gw-button-primary-hover-background: var(--gw-primary-hover-color);
-  --gw-button-primary-hover-border-color: var(--gw-primary-hover-color);
-  --gw-button-primary-active-background: var(--gw-primary-active-color);
-  --gw-button-primary-active-border-color: var(--gw-primary-active-color);
-  --gw-button-primary-border-color: var(--gw-border-color-primary);
+  --gw-button-primary-background: var(--gw-foreground-on-surface-brand);
+  --gw-button-primary-border-color: var(--gw-foreground-on-surface-brand);
   --gw-button-primary-disabled-color: var(--gw-inputtext-disabled-color);
+  --gw-button-primary-link-color: var(--gw-foreground-on-surface-primary);
+  --gw-button-primary-link-hover-color: var(--gw-foreground-on-surface-strong);
+  --gw-button-secondary-hover-border-color: var(--gw-foreground-on-surface-primary);
+  --gw-button-secondary-hover-color: var(--gw-foreground-on-surface-primary);
+  --gw-button-secondary-active-border-color: var(--gw-foreground-on-surface-primary);
+  --gw-button-secondary-active-color: var(--gw-foreground-on-surface-primary);
   --gw-button-secondary-border-color: var(--gw-foreground-on-surface-primary);
   --gw-button-secondary-color: var(--gw-foreground-on-surface-primary);
   --gw-button-secondary-icon-color: var(--gw-foreground-on-surface-primary);
   --gw-button-secondary-icon-second-color: var(--gw-foreground-on-surface-primary);
+  --gw-button-secondary-disabled-border-color: var(--gw-foreground-on-surface-primary);
+  --gw-button-secondary-disabled-color: var(--gw-foreground-on-surface-primary);
   --gw-button-secondary-link-hover-color: var(--gw-primary-contrast-color);
   --gw-button-secondary-link-active-color: var(--gw-primary-contrast-color);
   --gw-button-secondary-link-icon-color: var(--gw-primary-contrast-color);
@@ -3359,7 +3368,6 @@
   --gw-default-warning-background: var(--gw-help-base);
   --gw-default-warning-light-background: var(--gw-help-lighter);
   --gw-help-text: var(--gw-help-dark);
-  --gw-topnav-color: var(--gw-text-color);
   --gw-inputtext-read-only-background: var(--gw-form-field-read-only-background);
   --gw-inputtext-disabled-background: var(--gw-form-field-disabled-background);
   --gw-inputtext-border-color: var(--gw-form-field-border-color);
@@ -3391,7 +3399,7 @@
   --gw-checkbox-border-color: var(--gw-form-field-border-color);
   --gw-checkbox-checked-hover-background: var(--gw-primary-hover-color);
   --gw-checkbox-checked-hover-border-color: var(--gw-primary-hover-color);
-  --gw-checkbox-checked-disabled-border-color: var(--gw-form-field-border-color);
+  --gw-checkbox-checked-disabled-icon-color: var(--gw-primary-contrast-color);
   --gw-checkbox-disabled-background: var(--gw-form-field-disabled-background);
   --gw-checkbox-hover-border-color: var(--gw-form-field-hover-border-color);
   --gw-checkbox-focus-border-color: var(--gw-form-field-border-color);
@@ -3532,13 +3540,13 @@
   --gw-password-icon-color: var(--gw-form-field-icon-color);
   --gw-password-overlay-border-color: var(--gw-overlay-popover-border-color);
   --gw-password-strength-strong-background: var(--gw-success-light);
+  --gw-slider-handle-content-hover-background: var(--gw-button-primary-hover-background);
   --gw-togglebutton-disabled-background: var(--gw-form-field-disabled-background);
   --gw-togglebutton-disabled-border-color: var(--gw-form-field-disabled-background);
   --gw-togglebutton-invalid-border-color: var(--gw-form-field-invalid-border-color);
   --gw-togglebutton-icon-checked-color: var(--gw-button-primary-icon-color);
   --gw-togglebutton-checked-color: var(--gw-button-primary-color);
   --gw-togglebutton-hover-background: var(--gw-button-secondary-hover-background);
-  --gw-togglebutton-hover-color: var(--gw-button-secondary-hover-color);
   --gw-selectbutton-invalid-border-color: var(--gw-form-field-invalid-border-color);
   --gw-treeselect-disabled-background: var(--gw-form-field-disabled-background);
   --gw-treeselect-border-color: var(--gw-form-field-border-color);
@@ -3581,7 +3589,6 @@
   --gw-splitter-color: var(--gw-default-color);
   --gw-tabs-tablist-background: var(--gw-default-background);
   --gw-tabs-tab-active-border-bottom-color: var(--gw-default-background);
-  --gw-tabs-tab-active-color: var(--gw-body-color);
   --gw-tabs-tab-active-background: var(--gw-default-background);
   --gw-tabs-tab-hover-color: var(--gw-text-color);
   --gw-tabs-tabpanel-background: var(--gw-default-background);
@@ -3604,6 +3611,7 @@
   --gw-contextmenu-item-icon-focus-color: var(--gw-sidenav-menuitem-hover-icon-color);
   --gw-contextmenu-item-icon-active-color: var(--gw-sidenav-menuitem-selected-icon-color);
   --gw-contextmenu-submenu-icon-color: var(--gw-sidenav-menuitem-icon-color);
+  --gw-contextmenu-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
   --gw-contextmenu-submenu-icon-active-color: var(--gw-sidenav-menuitem-selected-background);
   --gw-statusmenu-list-border-color: var(--gw-contextmenu-border-color);
   --gw-megamenu-background: var(--gw-default-background);
@@ -3619,6 +3627,7 @@
   --gw-megamenu-submenu-label-background: var(--gw-sidenav-menuitem-background);
   --gw-megamenu-submenu-label-color: var(--gw-sidenav-menuitem-color);
   --gw-megamenu-submenu-icon-color: var(--gw-sidenav-menuitem-icon-color);
+  --gw-megamenu-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
   --gw-megamenu-submenu-icon-active-color: var(--gw-sidenav-menuitem-selected-background);
   --gw-megamenu-mobile-button-color: var(--gw-text-muted-color);
   --gw-megamenu-mobile-button-hover-color: var(--gw-default-muted-color);
@@ -3640,6 +3649,7 @@
   --gw-menubar-item-icon-color: var(--gw-sidenav-menuitem-icon-color);
   --gw-menubar-submenu-background: var(--gw-default-background);
   --gw-menubar-submenu-icon-color: var(--gw-sidenav-menuitem-icon-color);
+  --gw-menubar-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
   --gw-menubar-submenu-icon-active-color: var(--gw-sidenav-menuitem-selected-background);
   --gw-menubar-mobile-button-color: var(--gw-text-muted-color);
   --gw-menubar-mobile-button-hover-color: var(--gw-default-muted-color);
@@ -3650,6 +3660,7 @@
   --gw-panelmenu-item-color: var(--gw-sidenav-menuitem-color);
   --gw-panelmenu-item-icon-color: var(--gw-sidenav-menuitem-icon-color);
   --gw-panelmenu-submenu-icon-color: var(--gw-sidenav-menuitem-icon-color);
+  --gw-panelmenu-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
   --gw-tieredmenu-background: var(--gw-default-background);
   --gw-tieredmenu-color: var(--gw-default-color);
   --gw-tieredmenu-item-focus-background: var(--gw-sidenav-menuitem-selected-background);
@@ -3661,6 +3672,7 @@
   --gw-tieredmenu-item-icon-focus-color: var(--gw-sidenav-menuitem-hover-icon-color);
   --gw-tieredmenu-item-icon-active-color: var(--gw-sidenav-menuitem-selected-icon-color);
   --gw-tieredmenu-submenu-icon-color: var(--gw-sidenav-menuitem-icon-color);
+  --gw-tieredmenu-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
   --gw-tieredmenu-submenu-icon-active-color: var(--gw-sidenav-menuitem-selected-background);
   --gw-organizationchart-node-background: var(--gw-default-background);
   --gw-organizationchart-node-selected-color: var(--gw-highlight-color);
@@ -3751,17 +3763,16 @@
   --gw-stepper-steppanel-color: var(--gw-default-color);
   --gw-terminal-border-color: var(--gw-form-field-border-color);
   --gw-terminal-color: var(--gw-form-field-color);
-  --gw-overlaybadge-outline-color: var(--gw-default-background);
   --gw-swagger-color: var(--gw-body-color);
   --gw-swagger-help-color: var(--gw-default-muted-color);
   --gw-swagger-heading-color: var(--gw-default-muted-color);
   --gw-shortcuts-panel-color: var(--gw-default-color);
   --gw-shortcuts-panel-heading-color: var(--gw-default-muted-color);
   --gw-shortcuts-panel-close-button-color: var(--gw-default-muted-color);
+  --gw-cluster-node-follower-background: var(--gw-foreground-on-surface-primary);
   --gw-progressspinner-color-three: var(--gw-success-light);
   --gw-progressspinner-color-four: var(--gw-success-base);
-  --gw-sidenav-menuitem-selected-border-color: var(--gw-border-color-primary);
-  --gw-sidenav-submenuitem-selected-border-color: var(--gw-border-color-primary);
+  --gw-topnav-color: var(--gw-text-color);
   --gw-splitbutton-divider-color: var(--gw-button-primary-icon-second-color);
   --gw-inputtext-background: var(--gw-form-field-background);
   --gw-toggleswitch-offset-border-color: var(--gw-panel-background);
@@ -3811,13 +3822,13 @@
   --gw-multiselect-option-color: var(--gw-list-option-color);
   --gw-multiselect-option-group-color: var(--gw-list-option-group-color);
   --gw-password-overlay-color: var(--gw-overlay-popover-color);
-  --gw-slider-handle-content-hover-background: var(--gw-button-primary-hover-background);
   --gw-togglebutton-border-color: var(--gw-button-secondary-border-color);
   --gw-togglebutton-icon-color: var(--gw-button-secondary-icon-color);
   --gw-togglebutton-icon-hover-color: var(--gw-button-secondary-icon-color);
   --gw-togglebutton-content-checked-background: var(--gw-button-primary-background);
   --gw-togglebutton-checked-background: var(--gw-button-primary-background);
   --gw-togglebutton-checked-border-color: var(--gw-button-secondary-border-color);
+  --gw-togglebutton-hover-color: var(--gw-button-secondary-hover-color);
   --gw-togglebutton-color: var(--gw-button-secondary-color);
   --gw-treeselect-background: var(--gw-form-field-background);
   --gw-treeselect-overlay-color: var(--gw-overlay-select-color);
@@ -3825,12 +3836,7 @@
   --gw-confirmpopup-color: var(--gw-overlay-popover-color);
   --gw-confirmpopup-icon-color: var(--gw-overlay-popover-color);
   --gw-dialog-color: var(--gw-overlay-modal-color);
-  --gw-contextmenu-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
   --gw-statusmenu-list-background: var(--gw-contextmenu-background);
-  --gw-megamenu-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
-  --gw-menubar-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
-  --gw-panelmenu-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
-  --gw-tieredmenu-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
   --gw-datatable-filter-overlay-select-color: var(--gw-overlay-select-color);
   --gw-datatable-filter-overlay-popover-color: var(--gw-overlay-popover-color);
   --gw-datatable-filter-constraint-selected-focus-background: var(--gw-list-option-selected-focus-background);

package/dist/variables-light.css

@@ -1659,8 +1659,8 @@
   --gw-neutral-900-50: var(--gw-color-grey-900-50);
   --gw-neutral-0-0-05: var(--gw-color-grey-0-0-05);
   --gw-neutral-shadow: var(--gw-color-grey-900-0-05);
-  --gw-tertiary-100: var(--gw-color-teal-50);
-  --gw-tertiary-200: var(--gw-color-teal-100);
+  --gw-tertiary-100: var(--gw-color-teal-100);
+  --gw-tertiary-200: var(--gw-color-teal-200);
   --gw-tertiary-300: var(--gw-color-teal-300);
   --gw-tertiary-400: var(--gw-color-teal-400);
   --gw-tertiary-500: var(--gw-color-teal-500);
@@ -1718,7 +1718,6 @@
   --gw-button-tertiary-disabled-border-color: var(--gw-neutral-transparent);
   --gw-button-tertiary-link-border-color: var(--gw-neutral-transparent);
   --gw-xxs-line-height: var(--gw-1rem-line-height);
-  --gw-topnav-border-color: var(--gw-neutral-transparent);
   --gw-inputtext-focus-ring-width: var(--gw-focus-ring-width);
   --gw-inputtext-focus-ring-offset: var(--gw-focus-ring-offset);
   --gw-inputtext-sm-padding-x: var(--gw-form-field-sm-padding-x);
@@ -2036,9 +2035,11 @@
   --gw-imagecompare-handle-focus-ring-width: var(--gw-focus-ring-width);
   --gw-imagecompare-handle-focus-ring-offset: var(--gw-focus-ring-offset);
   --gw-imagecompare-handle-transition-duration: var(--gw-transition-duration);
+  --gw-overlaybadge-outline-color: var(--gw-neutral-transparent);
   --gw-swagger-button-height: var(--gw-size-1-5);
   --gw-shortcuts-cta-padding-x: var(--gw-space-0-25);
   --gw-shortcuts-cta-padding-y: var(--gw-space-0-125);
+  --gw-topnav-border-color: var(--gw-neutral-transparent);
   --gw-focus-ring-stroke-width: var(--gw-focus-ring-offset) + var(--gw-focus-ring-width);
   --gw-sidenav-shadow-1-color: var(--gw-color-grey-900-50);
   --gw-sidenav-shadow-2-color: var(--gw-color-grey-900-50);
@@ -2272,8 +2273,6 @@
   --gw-button-secondary-active-background: var(--gw-neutral-0);
   --gw-button-secondary-focus-ring-color: var(--gw-primary-200);
   --gw-button-secondary-disabled-background: var(--gw-neutral-0);
-  --gw-button-secondary-disabled-border-color: var(--gw-primary-300);
-  --gw-button-secondary-disabled-color: var(--gw-primary-300);
   --gw-button-secondary-link-disabled-background: var(--gw-neutral-0);
   --gw-button-secondary-link-disabled-border-color: var(--gw-primary-200);
   --gw-button-secondary-link-disabled-color: var(--gw-primary-200);
@@ -2317,8 +2316,7 @@
   --gw-hover-color: var(--gw-neutral-800);
   --gw-hover-background: var(--gw-neutral-200);
   --gw-hover-border-color: var(--gw-neutral-400);
-  --gw-default-border-color: var(--gw-neutral-300);
-  --gw-topnav-background: var(--gw-primary-100);
+  --gw-default-border-color: var(--gw-neutral-200);
   --gw-inputtext-border-radius: var(--gw-defaul-border-radius);
   --gw-inputtext-focus-ring-style: var(--gw-form-field-focus-ring-style);
   --gw-inputtext-padding-x: var(--gw-form-field-padding-x);
@@ -2668,11 +2666,12 @@
   --gw-list-option-selected-background: var(--gw-highlight-background);
   --gw-sidenav-menuitem-icon-color: var(--gw-foreground-on-surface-default);
   --gw-sidenav-menuitem-icon-second-color: var(--gw-foreground-on-surface-subtile);
-  --gw-sidenav-menuitem-hover-icon-color: var(--gw-primary-base);
+  --gw-sidenav-menuitem-hover-icon-color: var(--gw-primary-dark);
+  --gw-sidenav-menuitem-hover-color: var(--gw-primary-dark);
   --gw-sidenav-menuitem-hover-background: var(--gw-background-raised);
-  --gw-sidenav-menuitem-selected-icon-color: var(--gw-primary-base);
+  --gw-sidenav-menuitem-selected-icon-color: var(--gw-primary-dark);
   --gw-sidenav-menuitem-selected-background: var(--gw-background-highlighted);
-  --gw-sidenav-menuitem-selected-color: var(--gw-primary-base);
+  --gw-sidenav-menuitem-selected-color: var(--gw-primary-dark);
   --gw-sidenav-menuitem-background: var(--gw-background-surface);
   --gw-sidenav-menuitem-color: var(--gw-foreground-on-surface-default);
   --gw-sidenav-menuitem-open-icon-color: var(--gw-foreground-on-surface-default);
@@ -2682,9 +2681,9 @@
   --gw-sidenav-submenuitem-color: var(--gw-foreground-on-surface-default);
   --gw-sidenav-submenuitem-background: var(--gw-background-surface);
   --gw-sidenav-submenuitem-hover-background: var(--gw-background-raised);
-  --gw-sidenav-submenuitem-hover-color: var(--gw-primary-base);
+  --gw-sidenav-submenuitem-hover-color: var(--gw-primary-dark);
   --gw-sidenav-submenuitem-selected-background: var(--gw-background-highlighted);
-  --gw-sidenav-submenuitem-selected-color: var(--gw-primary-base);
+  --gw-sidenav-submenuitem-selected-color: var(--gw-primary-dark);
   --gw-sidenav-submenuitem-open-background: var(--gw-background-raised);
   --gw-sidenav-submenuitem-open-color: var(--gw-foreground-on-surface-default);
   --gw-sidenav-background: var(--gw-background-surface);
@@ -2695,7 +2694,11 @@
   --gw-overlay-popover-border-color: var(--gw-default-border-color);
   --gw-overlay-modal-border-color: var(--gw-default-border-color);
   --gw-button-border-radius: var(--gw-form-field-border-radius);
+  --gw-button-primary-hover-background: var(--gw-primary-base);
+  --gw-button-primary-hover-border-color: var(--gw-primary-base);
   --gw-button-primary-hover-color: var(--gw-foreground-on-brand);
+  --gw-button-primary-active-background: var(--gw-primary-base);
+  --gw-button-primary-active-border-color: var(--gw-primary-base);
   --gw-button-primary-active-color: var(--gw-foreground-on-brand);
   --gw-button-primary-icon-color: var(--gw-foreground-on-brand);
   --gw-button-primary-icon-second-color: var(--gw-foreground-on-brand);
@@ -2703,14 +2706,8 @@
   --gw-button-primary-focus-ring-color: var(--gw-primary-base);
   --gw-button-primary-disabled-background: var(--gw-primary-lighter);
   --gw-button-primary-disabled-border-color: var(--gw-primary-lighter);
-  --gw-button-primary-link-color: var(--gw-primary-base);
-  --gw-button-primary-link-hover-color: var(--gw-primary-dark);
-  --gw-button-primary-link-active-color: var(--gw-primary-base);
+  --gw-button-primary-link-active-color: var(--gw-primary-light);
   --gw-button-secondary-hover-background: var(--gw-background-raised);
-  --gw-button-secondary-hover-border-color: var(--gw-primary-base);
-  --gw-button-secondary-hover-color: var(--gw-primary-base);
-  --gw-button-secondary-active-border-color: var(--gw-primary-dark);
-  --gw-button-secondary-active-color: var(--gw-primary-dark);
   --gw-button-secondary-link-background: var(--gw-secondary-light);
   --gw-button-secondary-link-hover-background: var(--gw-secondary-base);
   --gw-button-secondary-link-hover-border-color: var(--gw-secondary-base);
@@ -2856,6 +2853,8 @@
   --gw-checkbox-checked-background: var(--gw-primary-base);
   --gw-checkbox-checked-border-color: var(--gw-primary-base);
   --gw-checkbox-checked-focus-border-color: var(--gw-primary-base);
+  --gw-checkbox-checked-disabled-border-color: var(--gw-foreground-on-surface-secondary);
+  --gw-checkbox-checked-disabled-background: var(--gw-foreground-on-surface-secondary);
   --gw-checkbox-filled-background: var(--gw-form-field-filled-background);
   --gw-checkbox-focus-ring-color: var(--gw-focus-ring-color);
   --gw-checkbox-icon-disabled-color: var(--gw-form-field-disabled-color);
@@ -3090,6 +3089,7 @@
   --gw-tabs-tab-border-color: var(--gw-neutral-lighter);
   --gw-tabs-tab-border-bottom-color: var(--gw-default-border-color);
   --gw-tabs-tab-active-border-color: var(--gw-default-border-color);
+  --gw-tabs-tab-active-color: var(--gw-foreground-on-surface-default);
   --gw-tabs-tab-color: var(--gw-neutral-dark);
   --gw-tabs-tab-hover-border-bottom-color: var(--gw-default-border-color);
   --gw-tabs-tab-background: var(--gw-neutral-lighter);
@@ -3272,9 +3272,9 @@
   --gw-swagger-border-color: var(--gw-default-border-color);
   --gw-swagger-post-background: var(--gw-success-200);
   --gw-shortcuts-panel-key-color: var(--gw-secondary-base);
-  --gw-classhierarchy-node-label-color: var(--gw-foreground-on-surface-default);
-  --gw-classhierarchy-node-hover-border-color: var(--gw-foreground-on-surface-secondary);
-  --gw-classhierarchy-node-selected-border-color: var(--gw-border-focus);
+  --gw-cluster-node-leader-background: var(--gw-foreground-on-surface-accent);
+  --gw-cluster-node-outofsync-background: var(--gw-foreground-on-surface-disabled);
+  --gw-cluster-background: var(--gw-body-background);
   --gw-link-regular-color: var(--gw-secondary-light);
   --gw-link-regular-hover-color: var(--gw-secondary-base);
   --gw-link-regular-visited-color: var(--gw-secondary-base);
@@ -3289,8 +3289,14 @@
   --gw-loader-color: var(--gw-foreground-on-surface-accent);
   --gw-page-background: var(--gw-background-page);
   --gw-page-login-background: var(--gw-background-surface);
+  --gw-topnav-background: var(--gw-background-header);
+  --gw-classhierarchy-node-label-color: var(--gw-foreground-on-surface-default);
+  --gw-classhierarchy-node-hover-border-color: var(--gw-foreground-on-surface-secondary);
+  --gw-classhierarchy-node-selected-border-color: var(--gw-border-focus);
   --gw-border-default-color: var(--gw-default-border-color);
   --gw-focus-ring-stroke-color: var(--gw-focus-ring-color);
+  --gw-sidenav-menuitem-selected-border-color: var(--gw-primary-dark);
+  --gw-sidenav-submenuitem-selected-border-color: var(--gw-primary-dark);
   --gw-success-text: var(--gw-success-dark);
   --gw-warning-text: var(--gw-help-dark);
   --gw-border-color-success: var(--gw-success-base);
@@ -3301,22 +3307,25 @@
   --gw-list-option-selected-focus-color: var(--gw-highlight-focus-color);
   --gw-list-option-selected-color: var(--gw-text-color);
   --gw-list-option-color: var(--gw-text-color);
-  --gw-sidenav-menuitem-hover-color: var(--gw-foreground-on-surface-brand);
   --gw-sidenav-togglebutton-background: var(--gw-sidenav-background);
   --gw-overlay-select-color: var(--gw-text-color);
   --gw-overlay-popover-color: var(--gw-text-color);
   --gw-overlay-modal-color: var(--gw-text-color);
-  --gw-button-primary-background: var(--gw-foreground-on-surface-primary);
-  --gw-button-primary-hover-background: var(--gw-primary-hover-color);
-  --gw-button-primary-hover-border-color: var(--gw-primary-hover-color);
-  --gw-button-primary-active-background: var(--gw-primary-active-color);
-  --gw-button-primary-active-border-color: var(--gw-primary-active-color);
-  --gw-button-primary-border-color: var(--gw-border-color-primary);
+  --gw-button-primary-background: var(--gw-foreground-on-surface-brand);
+  --gw-button-primary-border-color: var(--gw-foreground-on-surface-brand);
   --gw-button-primary-disabled-color: var(--gw-inputtext-disabled-color);
+  --gw-button-primary-link-color: var(--gw-foreground-on-surface-primary);
+  --gw-button-primary-link-hover-color: var(--gw-foreground-on-surface-strong);
+  --gw-button-secondary-hover-border-color: var(--gw-foreground-on-surface-primary);
+  --gw-button-secondary-hover-color: var(--gw-foreground-on-surface-primary);
+  --gw-button-secondary-active-border-color: var(--gw-foreground-on-surface-primary);
+  --gw-button-secondary-active-color: var(--gw-foreground-on-surface-primary);
   --gw-button-secondary-border-color: var(--gw-foreground-on-surface-primary);
   --gw-button-secondary-color: var(--gw-foreground-on-surface-primary);
   --gw-button-secondary-icon-color: var(--gw-foreground-on-surface-primary);
   --gw-button-secondary-icon-second-color: var(--gw-foreground-on-surface-primary);
+  --gw-button-secondary-disabled-border-color: var(--gw-foreground-on-surface-primary);
+  --gw-button-secondary-disabled-color: var(--gw-foreground-on-surface-primary);
   --gw-button-secondary-link-hover-color: var(--gw-primary-contrast-color);
   --gw-button-secondary-link-active-color: var(--gw-primary-contrast-color);
   --gw-button-secondary-link-icon-color: var(--gw-primary-contrast-color);
@@ -3359,7 +3368,6 @@
   --gw-default-warning-background: var(--gw-help-base);
   --gw-default-warning-light-background: var(--gw-help-lighter);
   --gw-help-text: var(--gw-help-dark);
-  --gw-topnav-color: var(--gw-text-color);
   --gw-inputtext-read-only-background: var(--gw-form-field-read-only-background);
   --gw-inputtext-disabled-background: var(--gw-form-field-disabled-background);
   --gw-inputtext-border-color: var(--gw-form-field-border-color);
@@ -3391,7 +3399,7 @@
   --gw-checkbox-border-color: var(--gw-form-field-border-color);
   --gw-checkbox-checked-hover-background: var(--gw-primary-hover-color);
   --gw-checkbox-checked-hover-border-color: var(--gw-primary-hover-color);
-  --gw-checkbox-checked-disabled-border-color: var(--gw-form-field-border-color);
+  --gw-checkbox-checked-disabled-icon-color: var(--gw-primary-contrast-color);
   --gw-checkbox-disabled-background: var(--gw-form-field-disabled-background);
   --gw-checkbox-hover-border-color: var(--gw-form-field-hover-border-color);
   --gw-checkbox-focus-border-color: var(--gw-form-field-border-color);
@@ -3532,13 +3540,13 @@
   --gw-password-icon-color: var(--gw-form-field-icon-color);
   --gw-password-overlay-border-color: var(--gw-overlay-popover-border-color);
   --gw-password-strength-strong-background: var(--gw-success-light);
+  --gw-slider-handle-content-hover-background: var(--gw-button-primary-hover-background);
   --gw-togglebutton-disabled-background: var(--gw-form-field-disabled-background);
   --gw-togglebutton-disabled-border-color: var(--gw-form-field-disabled-background);
   --gw-togglebutton-invalid-border-color: var(--gw-form-field-invalid-border-color);
   --gw-togglebutton-icon-checked-color: var(--gw-button-primary-icon-color);
   --gw-togglebutton-checked-color: var(--gw-button-primary-color);
   --gw-togglebutton-hover-background: var(--gw-button-secondary-hover-background);
-  --gw-togglebutton-hover-color: var(--gw-button-secondary-hover-color);
   --gw-selectbutton-invalid-border-color: var(--gw-form-field-invalid-border-color);
   --gw-treeselect-disabled-background: var(--gw-form-field-disabled-background);
   --gw-treeselect-border-color: var(--gw-form-field-border-color);
@@ -3581,7 +3589,6 @@
   --gw-splitter-color: var(--gw-default-color);
   --gw-tabs-tablist-background: var(--gw-default-background);
   --gw-tabs-tab-active-border-bottom-color: var(--gw-default-background);
-  --gw-tabs-tab-active-color: var(--gw-body-color);
   --gw-tabs-tab-active-background: var(--gw-default-background);
   --gw-tabs-tab-hover-color: var(--gw-text-color);
   --gw-tabs-tabpanel-background: var(--gw-default-background);
@@ -3604,6 +3611,7 @@
   --gw-contextmenu-item-icon-focus-color: var(--gw-sidenav-menuitem-hover-icon-color);
   --gw-contextmenu-item-icon-active-color: var(--gw-sidenav-menuitem-selected-icon-color);
   --gw-contextmenu-submenu-icon-color: var(--gw-sidenav-menuitem-icon-color);
+  --gw-contextmenu-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
   --gw-contextmenu-submenu-icon-active-color: var(--gw-sidenav-menuitem-selected-background);
   --gw-statusmenu-list-border-color: var(--gw-contextmenu-border-color);
   --gw-megamenu-background: var(--gw-default-background);
@@ -3619,6 +3627,7 @@
   --gw-megamenu-submenu-label-background: var(--gw-sidenav-menuitem-background);
   --gw-megamenu-submenu-label-color: var(--gw-sidenav-menuitem-color);
   --gw-megamenu-submenu-icon-color: var(--gw-sidenav-menuitem-icon-color);
+  --gw-megamenu-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
   --gw-megamenu-submenu-icon-active-color: var(--gw-sidenav-menuitem-selected-background);
   --gw-megamenu-mobile-button-color: var(--gw-text-muted-color);
   --gw-megamenu-mobile-button-hover-color: var(--gw-default-muted-color);
@@ -3640,6 +3649,7 @@
   --gw-menubar-item-icon-color: var(--gw-sidenav-menuitem-icon-color);
   --gw-menubar-submenu-background: var(--gw-default-background);
   --gw-menubar-submenu-icon-color: var(--gw-sidenav-menuitem-icon-color);
+  --gw-menubar-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
   --gw-menubar-submenu-icon-active-color: var(--gw-sidenav-menuitem-selected-background);
   --gw-menubar-mobile-button-color: var(--gw-text-muted-color);
   --gw-menubar-mobile-button-hover-color: var(--gw-default-muted-color);
@@ -3650,6 +3660,7 @@
   --gw-panelmenu-item-color: var(--gw-sidenav-menuitem-color);
   --gw-panelmenu-item-icon-color: var(--gw-sidenav-menuitem-icon-color);
   --gw-panelmenu-submenu-icon-color: var(--gw-sidenav-menuitem-icon-color);
+  --gw-panelmenu-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
   --gw-tieredmenu-background: var(--gw-default-background);
   --gw-tieredmenu-color: var(--gw-default-color);
   --gw-tieredmenu-item-focus-background: var(--gw-sidenav-menuitem-selected-background);
@@ -3661,6 +3672,7 @@
   --gw-tieredmenu-item-icon-focus-color: var(--gw-sidenav-menuitem-hover-icon-color);
   --gw-tieredmenu-item-icon-active-color: var(--gw-sidenav-menuitem-selected-icon-color);
   --gw-tieredmenu-submenu-icon-color: var(--gw-sidenav-menuitem-icon-color);
+  --gw-tieredmenu-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
   --gw-tieredmenu-submenu-icon-active-color: var(--gw-sidenav-menuitem-selected-background);
   --gw-organizationchart-node-background: var(--gw-default-background);
   --gw-organizationchart-node-selected-color: var(--gw-highlight-color);
@@ -3751,17 +3763,16 @@
   --gw-stepper-steppanel-color: var(--gw-default-color);
   --gw-terminal-border-color: var(--gw-form-field-border-color);
   --gw-terminal-color: var(--gw-form-field-color);
-  --gw-overlaybadge-outline-color: var(--gw-default-background);
   --gw-swagger-color: var(--gw-body-color);
   --gw-swagger-help-color: var(--gw-default-muted-color);
   --gw-swagger-heading-color: var(--gw-default-muted-color);
   --gw-shortcuts-panel-color: var(--gw-default-color);
   --gw-shortcuts-panel-heading-color: var(--gw-default-muted-color);
   --gw-shortcuts-panel-close-button-color: var(--gw-default-muted-color);
+  --gw-cluster-node-follower-background: var(--gw-foreground-on-surface-primary);
   --gw-progressspinner-color-three: var(--gw-success-light);
   --gw-progressspinner-color-four: var(--gw-success-base);
-  --gw-sidenav-menuitem-selected-border-color: var(--gw-border-color-primary);
-  --gw-sidenav-submenuitem-selected-border-color: var(--gw-border-color-primary);
+  --gw-topnav-color: var(--gw-text-color);
   --gw-splitbutton-divider-color: var(--gw-button-primary-icon-second-color);
   --gw-inputtext-background: var(--gw-form-field-background);
   --gw-toggleswitch-offset-border-color: var(--gw-panel-background);
@@ -3811,13 +3822,13 @@
   --gw-multiselect-option-color: var(--gw-list-option-color);
   --gw-multiselect-option-group-color: var(--gw-list-option-group-color);
   --gw-password-overlay-color: var(--gw-overlay-popover-color);
-  --gw-slider-handle-content-hover-background: var(--gw-button-primary-hover-background);
   --gw-togglebutton-border-color: var(--gw-button-secondary-border-color);
   --gw-togglebutton-icon-color: var(--gw-button-secondary-icon-color);
   --gw-togglebutton-icon-hover-color: var(--gw-button-secondary-icon-color);
   --gw-togglebutton-content-checked-background: var(--gw-button-primary-background);
   --gw-togglebutton-checked-background: var(--gw-button-primary-background);
   --gw-togglebutton-checked-border-color: var(--gw-button-secondary-border-color);
+  --gw-togglebutton-hover-color: var(--gw-button-secondary-hover-color);
   --gw-togglebutton-color: var(--gw-button-secondary-color);
   --gw-treeselect-background: var(--gw-form-field-background);
   --gw-treeselect-overlay-color: var(--gw-overlay-select-color);
@@ -3825,12 +3836,7 @@
   --gw-confirmpopup-color: var(--gw-overlay-popover-color);
   --gw-confirmpopup-icon-color: var(--gw-overlay-popover-color);
   --gw-dialog-color: var(--gw-overlay-modal-color);
-  --gw-contextmenu-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
   --gw-statusmenu-list-background: var(--gw-contextmenu-background);
-  --gw-megamenu-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
-  --gw-menubar-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
-  --gw-panelmenu-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
-  --gw-tieredmenu-submenu-icon-focus-color: var(--gw-sidenav-menuitem-hover-color);
   --gw-datatable-filter-overlay-select-color: var(--gw-overlay-select-color);
   --gw-datatable-filter-overlay-popover-color: var(--gw-overlay-popover-color);
   --gw-datatable-filter-constraint-selected-focus-background: var(--gw-list-option-selected-focus-background);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "graphwise-styleguide",
-  "version": "1.0.4",
+  "version": "1.0.6",
   "license": "Apache-2.0",
   "type": "module",
   "scripts": {