@ojiepermana/angular 0.1.1 → 21.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (92) hide show
  1. package/README.md +41 -249
  2. package/fesm2022/ojiepermana-angular-chart.mjs +3714 -0
  3. package/fesm2022/ojiepermana-angular-chart.mjs.map +1 -0
  4. package/fesm2022/ojiepermana-angular-component.mjs +3463 -0
  5. package/fesm2022/ojiepermana-angular-component.mjs.map +1 -0
  6. package/fesm2022/ojiepermana-angular-layout.mjs +276 -408
  7. package/fesm2022/ojiepermana-angular-layout.mjs.map +1 -1
  8. package/fesm2022/ojiepermana-angular-navigation.mjs +2198 -404
  9. package/fesm2022/ojiepermana-angular-navigation.mjs.map +1 -1
  10. package/fesm2022/ojiepermana-angular-theme.mjs +381 -1
  11. package/fesm2022/ojiepermana-angular-theme.mjs.map +1 -1
  12. package/fesm2022/ojiepermana-angular.mjs +15 -1
  13. package/fesm2022/ojiepermana-angular.mjs.map +1 -1
  14. package/package.json +49 -36
  15. package/theme/styles/etos.css +38 -0
  16. package/theme/styles/index.css +32 -8
  17. package/theme/styles/themes/brand/etos/color.css +21 -0
  18. package/theme/styles/themes/brand/etos/style.css +50 -0
  19. package/theme/styles/themes/library/_components.css +63 -0
  20. package/theme/styles/themes/library/_layers.css +15 -0
  21. package/theme/styles/themes/library/_material-overrides.css +254 -0
  22. package/theme/styles/themes/library/_tokens.css +54 -0
  23. package/theme/styles/themes/library/color/amber.css +18 -0
  24. package/theme/styles/themes/library/color/blue.css +23 -0
  25. package/theme/styles/themes/library/color/green.css +18 -0
  26. package/theme/styles/themes/library/color/index.css +9 -0
  27. package/theme/styles/themes/library/color/purple.css +18 -0
  28. package/theme/styles/themes/library/color/red.css +18 -0
  29. package/theme/styles/themes/library/style/brutal.css +47 -0
  30. package/theme/styles/themes/library/style/default.css +51 -0
  31. package/theme/styles/themes/library/style/index.css +8 -0
  32. package/theme/styles/themes/library/style/sharp.css +47 -0
  33. package/theme/styles/themes/library/style/soft.css +47 -0
  34. package/theme/styles/themes/mode/dark.css +20 -0
  35. package/theme/styles/themes/mode/index.css +6 -0
  36. package/theme/styles/themes/mode/light.css +24 -0
  37. package/theme/styles/themes/taildwind.css +109 -0
  38. package/types/ojiepermana-angular-chart.d.ts +1094 -0
  39. package/types/ojiepermana-angular-component.d.ts +1174 -0
  40. package/types/ojiepermana-angular-layout.d.ts +123 -76
  41. package/types/ojiepermana-angular-navigation.d.ts +256 -116
  42. package/types/ojiepermana-angular-theme.d.ts +170 -1
  43. package/types/ojiepermana-angular.d.ts +2 -1
  44. package/fesm2022/ojiepermana-angular-internal.mjs +0 -489
  45. package/fesm2022/ojiepermana-angular-internal.mjs.map +0 -1
  46. package/fesm2022/ojiepermana-angular-navigation-horizontal.mjs +0 -721
  47. package/fesm2022/ojiepermana-angular-navigation-horizontal.mjs.map +0 -1
  48. package/fesm2022/ojiepermana-angular-navigation-vertical.mjs +0 -1647
  49. package/fesm2022/ojiepermana-angular-navigation-vertical.mjs.map +0 -1
  50. package/fesm2022/ojiepermana-angular-shell.mjs +0 -19
  51. package/fesm2022/ojiepermana-angular-shell.mjs.map +0 -1
  52. package/fesm2022/ojiepermana-angular-theme-component.mjs +0 -235
  53. package/fesm2022/ojiepermana-angular-theme-component.mjs.map +0 -1
  54. package/fesm2022/ojiepermana-angular-theme-directive.mjs +0 -29
  55. package/fesm2022/ojiepermana-angular-theme-directive.mjs.map +0 -1
  56. package/fesm2022/ojiepermana-angular-theme-service.mjs +0 -241
  57. package/fesm2022/ojiepermana-angular-theme-service.mjs.map +0 -1
  58. package/layout/README.md +0 -144
  59. package/layout/src/component/horizontal/horizontal.css +0 -130
  60. package/layout/src/component/vertical/vertical.css +0 -75
  61. package/layout/src/layout.css +0 -16
  62. package/navigation/README.md +0 -301
  63. package/navigation/horizontal/README.md +0 -49
  64. package/shell/README.md +0 -41
  65. package/styles/index.css +0 -2
  66. package/styles/resets.css +0 -22
  67. package/theme/README.md +0 -379
  68. package/theme/styles/adapters/material-ui/index.css +0 -205
  69. package/theme/styles/modes/dark.css +0 -84
  70. package/theme/styles/presets/colors/blue.css +0 -45
  71. package/theme/styles/presets/colors/brand.css +0 -52
  72. package/theme/styles/presets/colors/cyan.css +0 -45
  73. package/theme/styles/presets/colors/green.css +0 -45
  74. package/theme/styles/presets/colors/index.css +0 -7
  75. package/theme/styles/presets/colors/orange.css +0 -45
  76. package/theme/styles/presets/colors/purple.css +0 -45
  77. package/theme/styles/presets/colors/red.css +0 -45
  78. package/theme/styles/presets/styles/flat.css +0 -61
  79. package/theme/styles/presets/styles/glass.css +0 -28
  80. package/theme/styles/presets/styles/index.css +0 -2
  81. package/theme/styles/roles/index.css +0 -67
  82. package/theme/styles/tokens/foundation.css +0 -136
  83. package/theme/styles/tokens/semantic.css +0 -87
  84. package/theme/styles/utilities/index.css +0 -88
  85. package/types/ojiepermana-angular-internal.d.ts +0 -90
  86. package/types/ojiepermana-angular-navigation-horizontal.d.ts +0 -81
  87. package/types/ojiepermana-angular-navigation-vertical.d.ts +0 -262
  88. package/types/ojiepermana-angular-shell.d.ts +0 -14
  89. package/types/ojiepermana-angular-theme-component.d.ts +0 -46
  90. package/types/ojiepermana-angular-theme-directive.d.ts +0 -10
  91. package/types/ojiepermana-angular-theme-service.d.ts +0 -68
  92. /package/{navigation/vertical → chart}/README.md +0 -0
@@ -1,90 +1,137 @@
1
- import * as i0 from '@angular/core';
2
- import { EnvironmentProviders, InjectionToken } from '@angular/core';
1
+ import * as _angular_core from '@angular/core';
2
+ import { InjectionToken, EnvironmentProviders } from '@angular/core';
3
+ import { SidebarAppearance, SidebarPosition, SidebarMode, TopbarAppearance } from '@ojiepermana/angular/navigation';
3
4
 
4
- declare const LAYOUT_MODES: readonly ["vertical", "horizontal", "empty"];
5
- type LayoutMode = (typeof LAYOUT_MODES)[number];
6
- declare const LAYOUT_CONTAINERS: readonly ["full", "boxed"];
7
- type LayoutContainer = (typeof LAYOUT_CONTAINERS)[number];
8
- interface NgLayoutConfig {
9
- defaultMode: LayoutMode;
10
- defaultContainer: LayoutContainer;
11
- }
12
-
13
- declare class LayoutService {
14
- private readonly config;
15
- private readonly document;
16
- private readonly isBrowser;
17
- private readonly storage;
18
- readonly mode: i0.WritableSignal<"vertical" | "horizontal" | "empty">;
19
- readonly container: i0.WritableSignal<"full" | "boxed">;
20
- constructor();
21
- /**
22
- * Updates the active shell mode and persists the value for future sessions.
23
- */
24
- setMode(value: LayoutMode): void;
25
- /**
26
- * Updates the active container width mode and persists the value for future sessions.
27
- */
28
- setContainer(value: LayoutContainer): void;
29
- /**
30
- * Clears persisted layout state and restores the configured defaults for mode and container.
31
- */
32
- reset(): void;
33
- private applyToDOM;
34
- static ɵfac: i0.ɵɵFactoryDeclaration<LayoutService, never>;
35
- static ɵprov: i0.ɵɵInjectableDeclaration<LayoutService>;
5
+ /**
6
+ * Vertical layout — sidebar + main (scrollable).
7
+ *
8
+ * Data navigasi diambil dari `NavigationService` (register via
9
+ * `NavigationService.registerItems()` di bootstrap). Main memegang
10
+ * `<router-outlet>` dan scroll jika konten panjang.
11
+ *
12
+ * Markup:
13
+ * ```html
14
+ * <vertical>
15
+ * <!-- sidebar + router-outlet dirender oleh komponen -->
16
+ * </vertical>
17
+ * ```
18
+ */
19
+ declare class VerticalLayoutComponent {
20
+ private readonly layout;
21
+ private readonly theme;
22
+ readonly sidebarAppearance: _angular_core.InputSignal<SidebarAppearance>;
23
+ readonly sidebarPosition: _angular_core.InputSignal<SidebarPosition>;
24
+ readonly sidebarMode: _angular_core.InputSignal<SidebarMode>;
25
+ readonly ariaLabel: _angular_core.InputSignal<string>;
26
+ protected readonly layoutWidth: _angular_core.Signal<"full" | "fixed">;
27
+ protected readonly themeStyle: _angular_core.Signal<"default" | "sharp" | "brutal" | "soft">;
28
+ protected readonly shellBorderWidth: _angular_core.Signal<"var(--border-width)" | null>;
29
+ protected readonly dividerBorderWidth: _angular_core.Signal<string>;
30
+ protected readonly hostClasses: _angular_core.Signal<string>;
31
+ protected readonly mainClasses: _angular_core.Signal<string>;
32
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<VerticalLayoutComponent, never>;
33
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<VerticalLayoutComponent, "vertical", never, { "sidebarAppearance": { "alias": "sidebarAppearance"; "required": false; "isSignal": true; }; "sidebarPosition": { "alias": "sidebarPosition"; "required": false; "isSignal": true; }; "sidebarMode": { "alias": "sidebarMode"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
36
34
  }
37
35
 
38
- declare class LayoutHostDirective {
39
- protected readonly layout: LayoutService;
40
- static ɵfac: i0.ɵɵFactoryDeclaration<LayoutHostDirective, never>;
41
- static ɵdir: i0.ɵɵDirectiveDeclaration<LayoutHostDirective, "[ngtLayoutHost]", never, {}, {}, never, never, true, never>;
36
+ /**
37
+ * Horizontal layout — topbar (h-12) + main (scrollable).
38
+ *
39
+ * Data navigasi diambil dari `NavigationService`.
40
+ * Consumer app dapat memproyeksikan brand kiri dan profile kanan.
41
+ *
42
+ * Markup:
43
+ * ```html
44
+ * <horizontal>
45
+ * <a ui-layout-brand>Brand</a>
46
+ * <button ui-layout-profile type="button">Profile</button>
47
+ * </horizontal>
48
+ * ```
49
+ */
50
+ declare class HorizontalLayoutComponent {
51
+ private readonly layout;
52
+ private readonly theme;
53
+ readonly topbarAppearance: _angular_core.InputSignal<TopbarAppearance>;
54
+ readonly ariaLabel: _angular_core.InputSignal<string>;
55
+ protected readonly layoutWidth: _angular_core.Signal<"full" | "fixed">;
56
+ protected readonly themeStyle: _angular_core.Signal<"default" | "sharp" | "brutal" | "soft">;
57
+ protected readonly shellBorderWidth: _angular_core.Signal<"var(--border-width)" | null>;
58
+ protected readonly dividerBorderWidth: _angular_core.Signal<string>;
59
+ protected readonly hostClasses: _angular_core.Signal<string>;
60
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<HorizontalLayoutComponent, never>;
61
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<HorizontalLayoutComponent, "horizontal", never, { "topbarAppearance": { "alias": "topbarAppearance"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, never, ["[ui-layout-brand],[ui-topbar-start]", "[ui-layout-profile],[ui-topbar-end]"], true, never>;
42
62
  }
43
63
 
44
- declare class LayoutHorizontalComponent {
45
- static ɵfac: i0.ɵɵFactoryDeclaration<LayoutHorizontalComponent, never>;
46
- static ɵcmp: i0.ɵɵComponentDeclaration<LayoutHorizontalComponent, "horizontal", never, {}, {}, never, ["[brand]", "[navigation]", "[action]"], true, never>;
64
+ /**
65
+ * Empty layout — full-viewport, flex-centered main.
66
+ *
67
+ * Cocok untuk halaman login / error / onboarding (pola shadcn `login-05`).
68
+ * Konten dirender lewat `<router-outlet>`; consumer men-style card / form
69
+ * milik halaman route sendiri.
70
+ *
71
+ * Markup:
72
+ * ```html
73
+ * <empty>
74
+ * <!-- router-outlet dirender oleh komponen -->
75
+ * </empty>
76
+ * ```
77
+ */
78
+ declare class EmptyLayoutComponent {
79
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<EmptyLayoutComponent, never>;
80
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<EmptyLayoutComponent, "empty", never, {}, {}, never, never, true, never>;
47
81
  }
48
82
 
49
- declare class LayoutVerticalComponent {
50
- static ɵfac: i0.ɵɵFactoryDeclaration<LayoutVerticalComponent, never>;
51
- static ɵcmp: i0.ɵɵComponentDeclaration<LayoutVerticalComponent, "vertical", never, {}, {}, never, ["[navigation]"], true, never>;
83
+ declare const LAYOUT_MODES: readonly ["vertical", "horizontal"];
84
+ type LayoutMode = (typeof LAYOUT_MODES)[number];
85
+ declare const LAYOUT_WIDTHS: readonly ["full", "fixed"];
86
+ type LayoutWidth = (typeof LAYOUT_WIDTHS)[number];
87
+ interface MaterialLayoutConfig {
88
+ /** Initial layout mode. */
89
+ readonly mode?: LayoutMode;
90
+ /** Initial layout width. */
91
+ readonly width?: LayoutWidth;
92
+ /** @deprecated Use `mode` instead. */
93
+ /** Initial layout mode. Defaults to `vertical`. */
94
+ readonly defaultMode?: LayoutMode;
95
+ /** localStorage key used to persist the layout mode. Set to `null` to disable persistence. */
96
+ readonly storageKey?: string | null;
97
+ /** localStorage key used to persist the layout width. Set to `null` to disable persistence. */
98
+ readonly widthStorageKey?: string | null;
52
99
  }
53
-
54
- declare class LayoutContainerSwitcherComponent {
55
- protected readonly layout: LayoutService;
56
- protected readonly label: i0.Signal<"Boxed layout container enabled" | "Boxed layout container disabled">;
57
- protected toggle(): void;
58
- static ɵfac: i0.ɵɵFactoryDeclaration<LayoutContainerSwitcherComponent, never>;
59
- static ɵcmp: i0.ɵɵComponentDeclaration<LayoutContainerSwitcherComponent, "layout-container-switcher", never, {}, {}, never, never, true, never>;
100
+ interface ResolvedMaterialLayoutConfig {
101
+ readonly defaultMode: LayoutMode;
102
+ readonly defaultWidth: LayoutWidth;
103
+ readonly storageKey: string | null;
104
+ readonly widthStorageKey: string | null;
60
105
  }
106
+ declare const MATERIAL_LAYOUT_CONFIG: InjectionToken<MaterialLayoutConfig>;
107
+ declare const DEFAULT_MATERIAL_LAYOUT_CONFIG: ResolvedMaterialLayoutConfig;
108
+ declare function isLayoutMode(value: string | null | undefined): value is LayoutMode;
109
+ declare function isLayoutWidth(value: string | null | undefined): value is LayoutWidth;
61
110
 
62
- declare class LayoutModeSwitcherComponent {
63
- protected readonly layout: LayoutService;
64
- protected readonly options: ({
65
- value: "vertical";
66
- label: string;
67
- } | {
68
- value: "horizontal";
69
- label: string;
70
- })[];
71
- protected readonly currentOption: i0.Signal<{
72
- value: "vertical";
73
- label: string;
74
- } | {
75
- value: "horizontal";
76
- label: string;
77
- } | {
78
- value: "empty";
79
- label: string;
80
- }>;
81
- static ɵfac: i0.ɵɵFactoryDeclaration<LayoutModeSwitcherComponent, never>;
82
- static ɵcmp: i0.ɵɵComponentDeclaration<LayoutModeSwitcherComponent, "layout-mode-switcher", never, {}, {}, never, never, true, never>;
111
+ declare class LayoutService {
112
+ private readonly document;
113
+ private readonly config;
114
+ private readonly _mode;
115
+ private readonly _width;
116
+ readonly mode: _angular_core.Signal<"vertical" | "horizontal">;
117
+ readonly width: _angular_core.Signal<"full" | "fixed">;
118
+ constructor();
119
+ setMode(mode: LayoutMode): void;
120
+ toggleMode(): void;
121
+ setWidth(width: LayoutWidth): void;
122
+ toggleWidth(): void;
123
+ private resolveConfig;
124
+ private readPersistedMode;
125
+ private readPersistedWidth;
126
+ private persistMode;
127
+ private persistWidth;
128
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayoutService, never>;
129
+ static ɵprov: _angular_core.ɵɵInjectableDeclaration<LayoutService>;
83
130
  }
84
131
 
85
- declare function provideNgLayout(config?: Partial<NgLayoutConfig>): EnvironmentProviders;
132
+ declare function provideMaterialLayout(config?: MaterialLayoutConfig): EnvironmentProviders;
86
133
 
87
- declare const NG_LAYOUT_CONFIG: InjectionToken<NgLayoutConfig>;
134
+ declare const LAYOUT_VERSION = "0.0.1";
88
135
 
89
- export { LayoutContainerSwitcherComponent, LayoutHorizontalComponent, LayoutHostDirective, LayoutModeSwitcherComponent, LayoutService, LayoutVerticalComponent, NG_LAYOUT_CONFIG, provideNgLayout };
90
- export type { LayoutContainer, LayoutMode, NgLayoutConfig };
136
+ export { DEFAULT_MATERIAL_LAYOUT_CONFIG, EmptyLayoutComponent, HorizontalLayoutComponent, LAYOUT_MODES, LAYOUT_VERSION, LAYOUT_WIDTHS, LayoutService, MATERIAL_LAYOUT_CONFIG, VerticalLayoutComponent, isLayoutMode, isLayoutWidth, provideMaterialLayout };
137
+ export type { LayoutMode, LayoutWidth, MaterialLayoutConfig, ResolvedMaterialLayoutConfig };
@@ -1,8 +1,8 @@
1
1
  import * as _angular_core from '@angular/core';
2
- import { EnvironmentProviders, InjectionToken } from '@angular/core';
3
2
  import { Params, QueryParamsHandling, IsActiveMatchOptions } from '@angular/router';
3
+ import { ClassValue } from 'clsx';
4
4
 
5
- type NavigationItemType = 'aside' | 'basic' | 'collapsable' | 'divider' | 'group' | 'spacer';
5
+ type NavigationItemType = 'aside' | 'basic' | 'collapsable' | 'divider' | 'group' | 'mega' | 'spacer';
6
6
  interface NavigationItemClasses {
7
7
  title?: string;
8
8
  subtitle?: string;
@@ -30,7 +30,7 @@ interface NavigationItemBase {
30
30
  tooltip?: string;
31
31
  /** Custom CSS classes */
32
32
  classes?: NavigationItemClasses;
33
- /** Material icon name */
33
+ /** Material Symbols icon name (ligature, e.g. `dashboard`, `menu_book`) */
34
34
  icon?: string;
35
35
  /** Badge configuration */
36
36
  badge?: NavigationItemBadge;
@@ -77,6 +77,16 @@ interface NavigationGroupItem extends NavigationItemBase {
77
77
  type: 'group';
78
78
  children: NavigationItem[];
79
79
  }
80
+ /**
81
+ * Mega menu branch — dirender sebagai panel full-width multi-kolom pada topbar.
82
+ * Children biasanya berupa `NavigationGroupItem` (per kolom) berisi `basic` items.
83
+ */
84
+ interface NavigationMegaItem extends NavigationItemBase {
85
+ type: 'mega';
86
+ /** Jumlah kolom saat viewport >= md (default: 4) */
87
+ columns?: number;
88
+ children: NavigationItem[];
89
+ }
80
90
  interface NavigationDividerItem extends NavigationItemBase {
81
91
  type: 'divider';
82
92
  children?: never;
@@ -85,7 +95,7 @@ interface NavigationSpacerItem extends NavigationItemBase {
85
95
  type: 'spacer';
86
96
  children?: never;
87
97
  }
88
- type NavigationBranchItem = NavigationAsideItem | NavigationCollapsableItem | NavigationGroupItem;
98
+ type NavigationBranchItem = NavigationAsideItem | NavigationCollapsableItem | NavigationGroupItem | NavigationMegaItem;
89
99
  type NavigationLeafItem = NavigationBasicItem | NavigationDividerItem | NavigationSpacerItem;
90
100
  type NavigationItem = NavigationBranchItem | NavigationLeafItem;
91
101
  /**
@@ -96,133 +106,263 @@ type NavigationItem = NavigationBranchItem | NavigationLeafItem;
96
106
  */
97
107
  type NavigationStructuredItem = NavigationItem;
98
108
  /**
99
- * Horizontal Navigation Variants
100
- * - default: standard top navigation treatment
101
- * - mega: roomier top navigation with larger dropdown treatment
102
- */
103
- type HorizontalNavigationVariant = 'default' | 'mega';
104
- /**
105
- * Vertical Navigation Appearances
106
- * - default: 280px width, full labels & icons
107
- * - collapsible: alias variant that currently reuses the default layout
109
+ * Sidebar Appearance
110
+ * - default: full width (lebar penuh) dengan label + icon
111
+ * - thin: icon-only, expand overlay saat hover
108
112
  */
109
- type VerticalNavigationAppearance = 'default' | 'collapsible';
113
+ type SidebarAppearance = 'default' | 'thin';
110
114
  /**
111
- * Vertical Navigation Modes
112
- * - over: Overlay mode (fixed position, z-index tinggi)
113
- * - side: Side mode (relative position, push content)
115
+ * Topbar Appearance
116
+ * - default: horizontal dengan dropdown untuk collapsable
117
+ * - megamenu: full-width panel multi-kolom untuk item `mega`
114
118
  */
115
- type VerticalNavigationMode = 'over' | 'side';
116
- /**
117
- * Vertical Navigation Position
118
- */
119
- type VerticalNavigationPosition = 'left' | 'right';
120
-
121
- interface NgNavigationConfig {
122
- defaultHorizontalVariant: HorizontalNavigationVariant;
123
- defaultVerticalVariant: VerticalNavigationAppearance;
124
- }
125
-
126
- declare function provideNgNavigation(config?: Partial<NgNavigationConfig>): EnvironmentProviders;
127
-
128
- declare class NavigationPreferencesService {
129
- private readonly config;
130
- private readonly document;
131
- private readonly isBrowser;
132
- private readonly storage;
133
- private readonly _horizontalVariant;
134
- private readonly _verticalAppearance;
135
- private readonly _activeItemId;
136
- private readonly _expandedItemIds;
137
- readonly horizontalVariant: _angular_core.Signal<HorizontalNavigationVariant>;
138
- readonly verticalAppearance: _angular_core.Signal<VerticalNavigationAppearance>;
139
- readonly activeItemId: _angular_core.Signal<string | null>;
140
- readonly expandedItemIds: _angular_core.Signal<string[]>;
141
- setHorizontalVariant(value: HorizontalNavigationVariant): void;
142
- setVerticalAppearance(value: VerticalNavigationAppearance): void;
143
- setActiveItem(id: string | null): void;
144
- clearActiveItem(): void;
145
- setExpandedItemIds(ids: readonly string[]): void;
146
- expandItem(id: string): void;
147
- collapseItem(id: string): void;
148
- toggleExpandedItem(id: string): void;
149
- clearExpandedItems(): void;
150
- reset(): void;
151
- syncWithNavigation(navigation: readonly NavigationItem[]): void;
152
- private readActiveItemId;
153
- private readExpandedItemIds;
154
- private readHorizontalVariant;
155
- private readVerticalAppearance;
156
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<NavigationPreferencesService, never>;
157
- static ɵprov: _angular_core.ɵɵInjectableDeclaration<NavigationPreferencesService>;
158
- }
159
-
160
- declare const DEFAULT_NG_NAVIGATION_CONFIG: NgNavigationConfig;
161
- declare const NG_NAVIGATION_CONFIG: InjectionToken<NgNavigationConfig>;
162
-
163
- declare function getNavigationItemAction(item: NavigationItem): NavigationActionHandler | undefined;
164
- declare function getNavigationItemVisibilityHandler(item: NavigationItem): NavigationVisibilityHandler | undefined;
165
- declare function isNavigationItemHidden(item: NavigationItem): boolean;
166
- declare function shouldRenderNavigationItem(item: NavigationItem): boolean;
167
- declare function hasNavigationChildren(item: NavigationItem): item is NavigationBranchItem;
168
- declare function getNavigationChildren(item: NavigationItem): NavigationItem[];
169
- declare function isNavigationRoutableItem(item: NavigationItem): item is NavigationItem & NavigationRoutableItemBase;
119
+ type TopbarAppearance = 'default' | 'megamenu';
120
+ /** Sidebar position */
121
+ type SidebarPosition = 'left' | 'right';
122
+ /** Sidebar display mode */
123
+ type SidebarMode = 'over' | 'side';
124
+ type VerticalNavigationAppearance = SidebarAppearance;
125
+ type VerticalNavigationMode = SidebarMode;
126
+ type VerticalNavigationPosition = SidebarPosition;
170
127
 
128
+ /** Default registry key used when no id is specified. */
129
+ declare const DEFAULT_NAVIGATION_ID = "main";
171
130
  /**
172
- * Navigation Service
131
+ * Signal-based global state untuk navigation (sidebar/topbar).
173
132
  *
174
- * Service ini bertanggung jawab untuk:
175
- * 1. Store dan retrieve navigation data
176
- * 2. Menyediakan state aktif dan expanded item
177
- * 3. Utility functions untuk navigation operations
133
+ * Items disimpan dalam registry ber-key. Key default adalah `'main'`.
134
+ * Komponen `ui-sidebar` / `ui-topbar` memilih registry via input `navigationId`.
178
135
  */
179
136
  declare class NavigationService {
180
- private readonly preferences;
181
- private _navigation;
182
- readonly navigationItems: _angular_core.Signal<NavigationItem[]>;
183
- readonly activeItemId: _angular_core.Signal<string | null>;
184
- readonly flatNavigation: _angular_core.Signal<NavigationItem[]>;
185
- readonly expandedItemIds: _angular_core.Signal<string[]>;
186
- /**
187
- * Store navigation data
188
- * Biasanya dipanggil saat app initialization
189
- */
190
- storeNavigation(navigation: NavigationItem[]): void;
137
+ private readonly router;
138
+ private readonly destroyRef;
139
+ /** Internal version counter — incremented on every registry mutation. */
140
+ private readonly _version;
141
+ /** Internal map of registered navigation trees. */
142
+ private readonly _registry;
191
143
  /**
192
- * Get navigation data dari storage
144
+ * Backward-compatible accessor returns items for the default (`'main'`) key.
145
+ * Prefer `getItems(id)` when working with named registries.
193
146
  */
194
- getNavigation(): NavigationItem[];
147
+ readonly items: _angular_core.Signal<readonly NavigationItem[]>;
148
+ /** Sidebar collapsed (default ↔ thin) toggle untuk desktop. */
149
+ readonly collapsed: _angular_core.WritableSignal<boolean>;
150
+ /** Sheet drawer terbuka di mobile. */
151
+ readonly mobileOpen: _angular_core.WritableSignal<boolean>;
152
+ /** Set id grup / collapsable yang sedang terbuka. */
153
+ readonly openGroups: _angular_core.WritableSignal<ReadonlySet<string>>;
154
+ /** URL aktif terakhir. Update otomatis dari Router `NavigationEnd`. */
155
+ readonly activeUrl: _angular_core.WritableSignal<string>;
156
+ /** Trail id item yang sedang match dengan URL aktif (across ALL registries). */
157
+ readonly activeTrail: _angular_core.Signal<ReadonlySet<string>>;
158
+ constructor();
195
159
  /**
196
- * Delete navigation data dari storage
160
+ * Register items di registry.
161
+ *
162
+ * Overload:
163
+ * - `registerItems(items)` → key `'main'`
164
+ * - `registerItems(id, items)` → key spesifik
197
165
  */
198
- deleteNavigation(): void;
199
- setActiveItem(id: string | null): void;
200
- clearActiveItem(): void;
201
- getActiveItem(navigation?: NavigationItem[]): NavigationItem | null;
202
- expandItem(id: string): void;
203
- collapseItem(id: string): void;
204
- toggleItemExpanded(id: string): void;
205
- isItemExpanded(id: string): boolean;
206
- clearExpandedItems(): void;
166
+ registerItems(items: NavigationItem[]): void;
167
+ registerItems(id: string, items: NavigationItem[]): void;
168
+ /** Remove a named registry entry. */
169
+ removeItems(id: string): void;
207
170
  /**
208
- * Flatten navigation array
209
- * Convert nested structure menjadi flat array (hanya basic items)
210
- * Berguna untuk search, analytics, atau operations lainnya
171
+ * Computed yang mengembalikan items untuk key tertentu.
172
+ * Reactive terhadap perubahan registry.
211
173
  */
212
- getFlatNavigation(navigation: NavigationItem[], flatNavigation?: NavigationItem[]): NavigationItem[];
213
- /**
214
- * Get item by ID dari navigation tree
215
- * Recursive search untuk find item dengan id tertentu
216
- */
217
- getItem(id: string, navigation: NavigationItem[]): NavigationItem | null;
218
- /**
219
- * Get parent dari item dengan id tertentu
220
- * Berguna untuk breadcrumb atau navigation path
221
- */
222
- getItemParent(id: string, navigation: NavigationItem[], parent: NavigationItem[] | NavigationItem): NavigationItem[] | NavigationItem | null;
174
+ getItems(id: string): () => readonly NavigationItem[];
175
+ /** Toggle sidebar collapsed (default ↔ thin). */
176
+ toggleCollapsed(): void;
177
+ setCollapsed(value: boolean): void;
178
+ openMobile(): void;
179
+ closeMobile(): void;
180
+ toggleMobile(): void;
181
+ isGroupOpen(id: string): boolean;
182
+ toggleGroup(id: string): void;
183
+ setGroupOpen(id: string, open: boolean): void;
184
+ /** Apakah id termasuk dalam active trail saat ini. */
185
+ isActive(id: string | undefined): boolean;
223
186
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<NavigationService, never>;
224
187
  static ɵprov: _angular_core.ɵɵInjectableDeclaration<NavigationService>;
225
188
  }
226
189
 
227
- export { DEFAULT_NG_NAVIGATION_CONFIG, NG_NAVIGATION_CONFIG, NavigationPreferencesService, NavigationService, getNavigationChildren, getNavigationItemAction, getNavigationItemVisibilityHandler, hasNavigationChildren, isNavigationItemHidden, isNavigationRoutableItem, provideNgNavigation, shouldRenderNavigationItem };
228
- export type { HorizontalNavigationVariant, NavigationActionHandler, NavigationAsideItem, NavigationBasicItem, NavigationBranchItem, NavigationCollapsableItem, NavigationDividerItem, NavigationGroupItem, NavigationItem, NavigationItemBadge, NavigationItemBase, NavigationItemClasses, NavigationItemType, NavigationLeafItem, NavigationRoutableItemBase, NavigationSpacerItem, NavigationStructuredItem, NavigationVisibilityHandler, NgNavigationConfig, VerticalNavigationAppearance, VerticalNavigationMode, VerticalNavigationPosition };
190
+ /**
191
+ * Material Symbols icon renderer.
192
+ * Menyuntikkan stylesheet font sekali saat dipakai agar consumer tidak perlu
193
+ * menambahkan `<link>` manual di `index.html`.
194
+ */
195
+ declare class UiNavIconComponent {
196
+ private readonly doc;
197
+ private readonly platformId;
198
+ readonly name: _angular_core.InputSignal<string>;
199
+ readonly class: _angular_core.InputSignal<string>;
200
+ readonly size: _angular_core.InputSignal<number | null>;
201
+ protected readonly fontVariationSettings = "\"FILL\" 0, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24";
202
+ constructor();
203
+ protected readonly classes: _angular_core.Signal<string>;
204
+ private ensureFontStylesheet;
205
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<UiNavIconComponent, never>;
206
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<UiNavIconComponent, "ui-nav-icon", never, { "name": { "alias": "name"; "required": false; "isSignal": true; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
207
+ }
208
+
209
+ /** Concatenate and dedupe Tailwind class names. */
210
+ declare function cn(...inputs: ClassValue[]): string;
211
+
212
+ /**
213
+ * Recursive navigation item renderer (vertical context).
214
+ *
215
+ * Menerima item polymorphic dan delegasi ke template sesuai `type`.
216
+ * Mega dirender sebagai group biasa saat muncul di konteks vertical.
217
+ */
218
+ declare class UiNavItemComponent {
219
+ private readonly nav;
220
+ protected readonly cn: typeof cn;
221
+ readonly item: _angular_core.InputSignal<NavigationItem>;
222
+ readonly level: _angular_core.InputSignal<number>;
223
+ /** Compact / icon-only rendering (sidebar `thin`). */
224
+ readonly compact: _angular_core.InputSignal<boolean>;
225
+ protected readonly exactMatch: {
226
+ readonly exact: true;
227
+ readonly paths: "exact";
228
+ readonly queryParams: "exact";
229
+ readonly fragment: "exact";
230
+ readonly matrixParams: "exact";
231
+ };
232
+ protected readonly inexactMatch: {
233
+ readonly paths: "subset";
234
+ readonly queryParams: "subset";
235
+ readonly fragment: "ignored";
236
+ readonly matrixParams: "ignored";
237
+ };
238
+ protected readonly type: _angular_core.Signal<"aside" | "basic" | "collapsable" | "divider" | "group" | "mega" | "spacer">;
239
+ protected readonly groupItem: _angular_core.Signal<NavigationGroupItem>;
240
+ protected readonly collapsableItem: _angular_core.Signal<NavigationCollapsableItem>;
241
+ protected readonly megaItem: _angular_core.Signal<NavigationMegaItem>;
242
+ protected readonly asideItem: _angular_core.Signal<NavigationAsideItem>;
243
+ protected readonly basicItem: _angular_core.Signal<NavigationBasicItem>;
244
+ protected readonly headingId: _angular_core.Signal<string>;
245
+ protected isGroupOpen(): boolean;
246
+ protected isTrailActive(): boolean;
247
+ protected toggleGroup(): void;
248
+ protected runAction(): void;
249
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<UiNavItemComponent, never>;
250
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<UiNavItemComponent, "ui-nav-item", never, { "item": { "alias": "item"; "required": true; "isSignal": true; }; "level": { "alias": "level"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
251
+ }
252
+
253
+ /**
254
+ * Vertical navigation (sidebar) — shadcn-styled.
255
+ *
256
+ * Variants:
257
+ * - `default`: 17.5rem, label + icon
258
+ * - `thin`: 4rem icon-only; hover memunculkan overlay expand (tidak push konten)
259
+ *
260
+ * Mobile (`< md`): saat `autoMobile=true` (default), host desktop disembunyikan
261
+ * dan konten dirender lewat CDK Overlay drawer dengan focus trap. State buka
262
+ * dikontrol lewat `NavigationService.mobileOpen`.
263
+ */
264
+ declare class SidebarComponent {
265
+ private readonly nav;
266
+ private readonly bp;
267
+ private readonly overlay;
268
+ private readonly vcr;
269
+ private readonly focusTrapFactory;
270
+ private readonly doc;
271
+ private readonly destroyRef;
272
+ readonly items: _angular_core.InputSignal<NavigationItem[]>;
273
+ /** Registry key di `NavigationService`. Default `'main'`. */
274
+ readonly navigationId: _angular_core.InputSignal<string>;
275
+ readonly appearance: _angular_core.InputSignal<SidebarAppearance>;
276
+ readonly position: _angular_core.InputSignal<SidebarPosition>;
277
+ readonly ariaLabel: _angular_core.InputSignal<string>;
278
+ readonly header: _angular_core.InputSignal<boolean>;
279
+ readonly class: _angular_core.InputSignal<string>;
280
+ /** Auto switch ke CDK overlay drawer saat viewport `< md`. */
281
+ readonly autoMobile: _angular_core.InputSignal<boolean>;
282
+ /** Auto-register `items` ke `NavigationService` agar `activeTrail` bekerja. */
283
+ readonly autoRegister: _angular_core.InputSignal<boolean>;
284
+ /** Resolved items: input jika disediakan, fallback ke registry NavigationService. */
285
+ protected readonly resolvedItems: _angular_core.Signal<readonly NavigationItem[]>;
286
+ private readonly hovered;
287
+ private readonly drawerTpl;
288
+ private drawerRef;
289
+ private focusTrap;
290
+ private previouslyFocused;
291
+ /** True saat viewport `< md` (767.98px). */
292
+ protected readonly isMobileMedia: _angular_core.Signal<boolean>;
293
+ protected readonly isMobile: _angular_core.Signal<boolean>;
294
+ protected readonly isExpanded: _angular_core.Signal<boolean>;
295
+ protected readonly isCompact: _angular_core.Signal<boolean>;
296
+ constructor();
297
+ protected readonly hostClasses: _angular_core.Signal<string>;
298
+ protected readonly innerClasses: _angular_core.Signal<string>;
299
+ protected onHoverEnter(): void;
300
+ protected onHoverLeave(): void;
301
+ /** Touch fallback: tap pada strip thin (ketika belum expanded) untuk expand. */
302
+ protected onHostClick(event: MouseEvent): void;
303
+ private openDrawer;
304
+ private closeDrawer;
305
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<SidebarComponent, never>;
306
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SidebarComponent, "ui-sidebar", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "navigationId": { "alias": "navigationId"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "header": { "alias": "header"; "required": false; "isSignal": true; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; "autoMobile": { "alias": "autoMobile"; "required": false; "isSignal": true; }; "autoRegister": { "alias": "autoRegister"; "required": false; "isSignal": true; }; }, {}, never, ["[ui-sidebar-header]", "[ui-sidebar-footer]"], true, never>;
307
+ }
308
+
309
+ /**
310
+ * Horizontal navigation (topbar) — shadcn-styled.
311
+ *
312
+ * Variants:
313
+ * - `default`: horizontal list; item `collapsable` buka dropdown
314
+ * - `megamenu`: item `mega` buka panel full-width multi-kolom
315
+ */
316
+ declare class TopbarComponent {
317
+ protected readonly nav: NavigationService;
318
+ private readonly overlay;
319
+ private readonly vcr;
320
+ private readonly host;
321
+ private readonly destroyRef;
322
+ readonly items: _angular_core.InputSignal<NavigationItem[]>;
323
+ /** Registry key di `NavigationService`. Default `'main'`. */
324
+ readonly navigationId: _angular_core.InputSignal<string>;
325
+ readonly appearance: _angular_core.InputSignal<TopbarAppearance>;
326
+ readonly ariaLabel: _angular_core.InputSignal<string>;
327
+ readonly class: _angular_core.InputSignal<string>;
328
+ /** Auto-register `items` ke `NavigationService` agar `activeTrail` bekerja. */
329
+ readonly autoRegister: _angular_core.InputSignal<boolean>;
330
+ /** Tampilkan hamburger di `< md` yang men-toggle mobile drawer sidebar. */
331
+ readonly showHamburger: _angular_core.InputSignal<boolean>;
332
+ readonly hamburgerLabel: _angular_core.InputSignal<string>;
333
+ /** Resolved items: input jika disediakan, fallback ke registry NavigationService. */
334
+ protected readonly resolvedItems: _angular_core.Signal<readonly NavigationItem[]>;
335
+ protected readonly openId: _angular_core.WritableSignal<string | null>;
336
+ private active;
337
+ private readonly dropdownTpl;
338
+ private readonly megaTpl;
339
+ constructor();
340
+ protected readonly hostClasses: _angular_core.Signal<string>;
341
+ protected asBasic(i: NavigationItem): NavigationBasicItem;
342
+ protected asCollapsable(i: NavigationItem): NavigationCollapsableItem;
343
+ protected asGroup(i: NavigationItem): NavigationGroupItem;
344
+ protected asMega(i: NavigationItem): NavigationMegaItem;
345
+ protected isItemActive(id: string | undefined): boolean;
346
+ protected megaColsClass(columns?: number): string;
347
+ protected toggleDropdown(trigger: HTMLElement, item: NavigationItem): void;
348
+ protected openDropdown(trigger: HTMLElement, item: NavigationItem): void;
349
+ protected toggleMega(trigger: HTMLElement, item: NavigationItem): void;
350
+ protected openMega(trigger: HTMLElement, item: NavigationItem): void;
351
+ private attach;
352
+ protected closeAll(): void;
353
+ /** Menubar keyboard navigation: ArrowLeft/Right antar trigger, Home/End, ArrowDown fokus panel. */
354
+ protected onMenubarKeydown(event: KeyboardEvent): void;
355
+ /** Arrow-key navigation dalam dropdown/mega panel. */
356
+ protected onPanelKeydown(event: KeyboardEvent): void;
357
+ private collectPanelFocusables;
358
+ private focusFirstInPanel;
359
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<TopbarComponent, never>;
360
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<TopbarComponent, "ui-topbar", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "navigationId": { "alias": "navigationId"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; "autoRegister": { "alias": "autoRegister"; "required": false; "isSignal": true; }; "showHamburger": { "alias": "showHamburger"; "required": false; "isSignal": true; }; "hamburgerLabel": { "alias": "hamburgerLabel"; "required": false; "isSignal": true; }; }, {}, never, ["[ui-topbar-start]", "[ui-topbar-end]"], true, never>;
361
+ }
362
+
363
+ declare const DemoNavigationData: NavigationItem[];
364
+
365
+ declare const NAVIGATION_VERSION = "0.0.1";
366
+
367
+ export { DEFAULT_NAVIGATION_ID, DemoNavigationData, NAVIGATION_VERSION, NavigationService, SidebarComponent, TopbarComponent, UiNavIconComponent, UiNavItemComponent };
368
+ export type { NavigationActionHandler, NavigationAsideItem, NavigationBasicItem, NavigationBranchItem, NavigationCollapsableItem, NavigationDividerItem, NavigationGroupItem, NavigationItem, NavigationItemBadge, NavigationItemBase, NavigationItemClasses, NavigationItemType, NavigationLeafItem, NavigationMegaItem, NavigationRoutableItemBase, NavigationSpacerItem, NavigationStructuredItem, NavigationVisibilityHandler, SidebarAppearance, SidebarMode, SidebarPosition, TopbarAppearance, VerticalNavigationAppearance, VerticalNavigationMode, VerticalNavigationPosition };