@gravionlabs/helix-shell 22.1.6 → 22.1.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravionlabs/helix-shell",
-  "version": "22.1.6",
+  "version": "22.1.8",
   "description": "Helix application shell for Angular — layout (topbar, nav rail, footer), auth pages, landing widgets, and a signal-store-backed layout state.",
   "license": "MIT",
   "keywords": [

package/styles.css

@@ -84,6 +84,7 @@
     --font-weight-bold: 700;
     --leading-tight: 1.25;
     --leading-normal: 1.5;
+    --radius-md: 0.375rem;
     --radius-lg: 0.5rem;
     --ease-in: cubic-bezier(0.4, 0, 1, 1);
     --ease-out: cubic-bezier(0, 0, 0.2, 1);
@@ -1780,14 +1781,16 @@
   --helix-nav-width: 17rem;
   --helix-nav-width-collapsed: 4.75rem;
   --helix-layout-gap: 1.5rem;
-  --helix-surface-ground: var(--h-surface-100);
+  --helix-surface-ground: var(--h-surface-0);
   --helix-surface-chrome: var(
-    --h-surface-200
+    --h-surface-50
   );
   --helix-surface-card: var(--h-surface-0);
   --helix-surface-overlay: var(--h-surface-0);
-  --helix-surface-hover: var(--h-surface-100);
-  --helix-border: var(--h-surface-300);
+  --helix-surface-hover: var(
+    --h-surface-100
+  );
+  --helix-border: var(--h-surface-200);
   --code-background: var(--h-surface-900);
   --code-color: var(--h-surface-200);
   --surface-ground: var(--helix-surface-ground);
@@ -1797,13 +1800,13 @@
   --surface-border: var(--helix-border);
 }
 :root[class*="app-dark"] {
-  --helix-surface-ground: var(--h-surface-950);
-  --helix-surface-chrome: var(--h-surface-900);
+  --helix-surface-ground: var(--h-surface-900);
+  --helix-surface-chrome: var(--h-surface-950);
   --helix-surface-card: var(--h-surface-800);
   --helix-surface-overlay: var(--h-surface-800);
   --helix-surface-hover: var(--h-surface-700);
   --helix-border: var(--h-surface-700);
-  --code-background: var(--h-surface-800);
+  --code-background: var(--h-surface-950);
   --code-color: var(--h-surface-100);
 }
 html {
@@ -1811,8 +1814,13 @@ html {
   font-size: 14px;
   line-height: 1.2;
 }
+:root {
+  --helix-font-sans: "Inter Variable", "Inter", ui-sans-serif, system-ui, sans-serif;
+  --helix-font-display: var(--helix-font-sans);
+  --helix-font-mono: ui-monospace, "SF Mono", Menlo, Monaco, Consolas, monospace;
+}
 body {
-  font-family: "Lato", sans-serif;
+  font-family: var(--helix-font-sans);
   color: var(--text-color);
   background-color: var(--helix-surface-ground);
   margin: 0;
@@ -1833,6 +1841,7 @@ a {
   background: var(--helix-surface-card);
   padding: 1rem;
   margin-bottom: var(--helix-layout-gap);
+  border: 1px solid var(--helix-border);
   border-radius: var(--content-border-radius);
 }
 .card:last-child {
@@ -1843,9 +1852,10 @@ a {
 }
 h1, h2, h3, h4, h5, h6 {
   margin: 1.5rem 0 1rem 0;
-  font-family: inherit;
+  font-family: var(--helix-font-display);
   font-weight: 700;
-  line-height: 1.5;
+  line-height: 1.3;
+  letter-spacing: -0.02em;
   color: var(--text-color);
 }
 h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child {
@@ -1873,7 +1883,7 @@ mark {
   background: #fff8e1;
   padding: 0.25rem 0.4rem;
   border-radius: var(--content-border-radius);
-  font-family: monospace;
+  font-family: var(--helix-font-mono);
 }
 blockquote {
   margin: 1rem 0;

package/types/gravionlabs-helix-shell.d.ts

@@ -292,7 +292,7 @@ export declare class HelixAppLayout {
   private static readonly DEFAULT_TOP_ACTIONS;
   store: {
     preset: import("@angular/core").Signal<string>;
-    primary: import("@angular/core").Signal<string>;
+    primary: import("@angular/core").Signal<string | null>;
     surface: import("@angular/core").Signal<string | null | undefined>;
     darkTheme: import("@angular/core").Signal<boolean>;
     menuMode: import("@angular/core").Signal<import("@gravionlabs/helix-shell").MenuMode>;
@@ -322,14 +322,14 @@ export declare class HelixAppLayout {
     setMenuHoverActive: (menuHoverActive: boolean) => void;
     updateConfig: (config: Partial<import("@gravionlabs/helix-shell").LayoutConfig>) => void;
     setPreset: (preset: string) => void;
-    setPrimary: (primary: string) => void;
+    setPrimary: (primary: string | null) => void;
     setSurface: (surface: string | null) => void;
     isDesktop: () => boolean;
     setDesktop: (desktop: boolean) => void;
     reset: () => void;
   } & import("@ngrx/signals").StateSource<{
     preset: string;
-    primary: string;
+    primary: string | null;
     surface: string | undefined | null;
     darkTheme: boolean;
     menuMode: import("@gravionlabs/helix-shell").MenuMode;
@@ -450,7 +450,7 @@ export declare class HelixConfigurator implements OnInit {
   primeng: HelixConfig;
   store: {
     preset: import("@angular/core").Signal<string>;
-    primary: import("@angular/core").Signal<string>;
+    primary: import("@angular/core").Signal<string | null>;
     surface: import("@angular/core").Signal<string | null | undefined>;
     darkTheme: import("@angular/core").Signal<boolean>;
     menuMode: import("@angular/core").Signal<import("@gravionlabs/helix-shell").MenuMode>;
@@ -480,14 +480,14 @@ export declare class HelixConfigurator implements OnInit {
     setMenuHoverActive: (menuHoverActive: boolean) => void;
     updateConfig: (config: Partial<import("@gravionlabs/helix-shell").LayoutConfig>) => void;
     setPreset: (preset: string) => void;
-    setPrimary: (primary: string) => void;
+    setPrimary: (primary: string | null) => void;
     setSurface: (surface: string | null) => void;
     isDesktop: () => boolean;
     setDesktop: (desktop: boolean) => void;
     reset: () => void;
   } & import("@ngrx/signals").StateSource<{
     preset: string;
-    primary: string;
+    primary: string | null;
     surface: string | undefined | null;
     darkTheme: boolean;
     menuMode: import("@gravionlabs/helix-shell").MenuMode;
@@ -509,13 +509,15 @@ export declare class HelixConfigurator implements OnInit {
     value: string;
   }[];
   surfaces: SurfacesType[];
-  selectedPrimaryColor: import("@angular/core").Signal<string>;
+  selectedPrimaryColor: import("@angular/core").Signal<string | null>;
   selectedSurfaceColor: import("@angular/core").Signal<string | null | undefined>;
   selectedPreset: import("@angular/core").Signal<string>;
   menuMode: import("@angular/core").Signal<import("@gravionlabs/helix-shell").MenuMode>;
   primaryColors: import("@angular/core").Signal<SurfacesType[]>;
   ngOnInit(): void;
   getPresetExt(): {
+    semantic?: undefined;
+  } | {
     semantic: {
       primary: {
         0?: string;
@@ -573,7 +575,7 @@ export declare class HelixConfigurator implements OnInit {
 export declare class HelixFloatingConfigurator {
   store: {
     preset: import("@angular/core").Signal<string>;
-    primary: import("@angular/core").Signal<string>;
+    primary: import("@angular/core").Signal<string | null>;
     surface: import("@angular/core").Signal<string | null | undefined>;
     darkTheme: import("@angular/core").Signal<boolean>;
     menuMode: import("@angular/core").Signal<import("@gravionlabs/helix-shell").MenuMode>;
@@ -603,14 +605,14 @@ export declare class HelixFloatingConfigurator {
     setMenuHoverActive: (menuHoverActive: boolean) => void;
     updateConfig: (config: Partial<import("@gravionlabs/helix-shell").LayoutConfig>) => void;
     setPreset: (preset: string) => void;
-    setPrimary: (primary: string) => void;
+    setPrimary: (primary: string | null) => void;
     setSurface: (surface: string | null) => void;
     isDesktop: () => boolean;
     setDesktop: (desktop: boolean) => void;
     reset: () => void;
   } & import("@ngrx/signals").StateSource<{
     preset: string;
-    primary: string;
+    primary: string | null;
     surface: string | undefined | null;
     darkTheme: boolean;
     menuMode: import("@gravionlabs/helix-shell").MenuMode;
@@ -671,7 +673,7 @@ export declare class HelixFooter {
 export declare class HelixNavRail implements OnInit, OnDestroy {
   store: {
     preset: import("@angular/core").Signal<string>;
-    primary: import("@angular/core").Signal<string>;
+    primary: import("@angular/core").Signal<string | null>;
     surface: import("@angular/core").Signal<string | null | undefined>;
     darkTheme: import("@angular/core").Signal<boolean>;
     menuMode: import("@angular/core").Signal<import("@gravionlabs/helix-shell").MenuMode>;
@@ -701,14 +703,14 @@ export declare class HelixNavRail implements OnInit, OnDestroy {
     setMenuHoverActive: (menuHoverActive: boolean) => void;
     updateConfig: (config: Partial<import("@gravionlabs/helix-shell").LayoutConfig>) => void;
     setPreset: (preset: string) => void;
-    setPrimary: (primary: string) => void;
+    setPrimary: (primary: string | null) => void;
     setSurface: (surface: string | null) => void;
     isDesktop: () => boolean;
     setDesktop: (desktop: boolean) => void;
     reset: () => void;
   } & import("@ngrx/signals").StateSource<{
     preset: string;
-    primary: string;
+    primary: string | null;
     surface: string | undefined | null;
     darkTheme: boolean;
     menuMode: import("@gravionlabs/helix-shell").MenuMode;
@@ -768,7 +770,7 @@ export declare class HelixNavRailItem implements AfterViewInit {
   #private;
   store: {
     preset: import("@angular/core").Signal<string>;
-    primary: import("@angular/core").Signal<string>;
+    primary: import("@angular/core").Signal<string | null>;
     surface: import("@angular/core").Signal<string | null | undefined>;
     darkTheme: import("@angular/core").Signal<boolean>;
     menuMode: import("@angular/core").Signal<import("@gravionlabs/helix-shell").MenuMode>;
@@ -798,14 +800,14 @@ export declare class HelixNavRailItem implements AfterViewInit {
     setMenuHoverActive: (menuHoverActive: boolean) => void;
     updateConfig: (config: Partial<import("@gravionlabs/helix-shell").LayoutConfig>) => void;
     setPreset: (preset: string) => void;
-    setPrimary: (primary: string) => void;
+    setPrimary: (primary: string | null) => void;
     setSurface: (surface: string | null) => void;
     isDesktop: () => boolean;
     setDesktop: (desktop: boolean) => void;
     reset: () => void;
   } & import("@ngrx/signals").StateSource<{
     preset: string;
-    primary: string;
+    primary: string | null;
     surface: string | undefined | null;
     darkTheme: boolean;
     menuMode: import("@gravionlabs/helix-shell").MenuMode;
@@ -922,7 +924,7 @@ export declare class HelixConfiguratorAction {
 export declare class HelixDarkModeAction {
   protected store: {
     preset: import("@angular/core").Signal<string>;
-    primary: import("@angular/core").Signal<string>;
+    primary: import("@angular/core").Signal<string | null>;
     surface: import("@angular/core").Signal<string | null | undefined>;
     darkTheme: import("@angular/core").Signal<boolean>;
     menuMode: import("@angular/core").Signal<import("@gravionlabs/helix-shell").MenuMode>;
@@ -952,14 +954,14 @@ export declare class HelixDarkModeAction {
     setMenuHoverActive: (menuHoverActive: boolean) => void;
     updateConfig: (config: Partial<import("@gravionlabs/helix-shell").LayoutConfig>) => void;
     setPreset: (preset: string) => void;
-    setPrimary: (primary: string) => void;
+    setPrimary: (primary: string | null) => void;
     setSurface: (surface: string | null) => void;
     isDesktop: () => boolean;
     setDesktop: (desktop: boolean) => void;
     reset: () => void;
   } & import("@ngrx/signals").StateSource<{
     preset: string;
-    primary: string;
+    primary: string | null;
     surface: string | undefined | null;
     darkTheme: boolean;
     menuMode: import("@gravionlabs/helix-shell").MenuMode;
@@ -987,7 +989,7 @@ export declare class HelixTopbar implements OnInit, OnDestroy {
   items: import("@angular/core").InputSignal<HelixTopbarItem[]>;
   store: {
     preset: import("@angular/core").Signal<string>;
-    primary: import("@angular/core").Signal<string>;
+    primary: import("@angular/core").Signal<string | null>;
     surface: import("@angular/core").Signal<string | null | undefined>;
     darkTheme: import("@angular/core").Signal<boolean>;
     menuMode: import("@angular/core").Signal<import("@gravionlabs/helix-shell").MenuMode>;
@@ -1017,14 +1019,14 @@ export declare class HelixTopbar implements OnInit, OnDestroy {
     setMenuHoverActive: (menuHoverActive: boolean) => void;
     updateConfig: (config: Partial<import("@gravionlabs/helix-shell").LayoutConfig>) => void;
     setPreset: (preset: string) => void;
-    setPrimary: (primary: string) => void;
+    setPrimary: (primary: string | null) => void;
     setSurface: (surface: string | null) => void;
     isDesktop: () => boolean;
     setDesktop: (desktop: boolean) => void;
     reset: () => void;
   } & import("@ngrx/signals").StateSource<{
     preset: string;
-    primary: string;
+    primary: string | null;
     surface: string | undefined | null;
     darkTheme: boolean;
     menuMode: import("@gravionlabs/helix-shell").MenuMode;
@@ -1073,7 +1075,7 @@ export declare class HelixTopbar implements OnInit, OnDestroy {
 export type MenuMode = 'static' | 'overlay';
 export interface LayoutConfig {
   preset: string;
-  primary: string;
+  primary: string | null;
   surface: string | undefined | null;
   darkTheme: boolean;
   menuMode: MenuMode;
@@ -1093,7 +1095,7 @@ export interface LayoutState {
 }
 export declare const LayoutStore: import("@angular/core").Type<{
   preset: import("@angular/core").Signal<string>;
-  primary: import("@angular/core").Signal<string>;
+  primary: import("@angular/core").Signal<string | null>;
   surface: import("@angular/core").Signal<string | null | undefined>;
   darkTheme: import("@angular/core").Signal<boolean>;
   menuMode: import("@angular/core").Signal<MenuMode>;
@@ -1123,14 +1125,14 @@ export declare const LayoutStore: import("@angular/core").Type<{
   setMenuHoverActive: (menuHoverActive: boolean) => void;
   updateConfig: (config: Partial<LayoutConfig>) => void;
   setPreset: (preset: string) => void;
-  setPrimary: (primary: string) => void;
+  setPrimary: (primary: string | null) => void;
   setSurface: (surface: string | null) => void;
   isDesktop: () => boolean;
   setDesktop: (desktop: boolean) => void;
   reset: () => void;
 } & import("@ngrx/signals").StateSource<{
   preset: string;
-  primary: string;
+  primary: string | null;
   surface: string | undefined | null;
   darkTheme: boolean;
   menuMode: MenuMode;