You're Invited:Meet the Socket Team at BlackHat and DEF CON in Las Vegas, Aug 4-6.RSVP
Socket
Book a DemoInstallSign in
Socket

angular-router-menus

Package Overview
Dependencies
Maintainers
1
Versions
10
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

angular-router-menus - npm Package Compare versions

Comparing version

to
2.0.0

lib/service.d.ts

3

lib/builder.d.ts
import { type Routes } from "@angular/router";
import type { MenuStacks } from "./menu";
import type { RouterMenusOptions } from "./options";
export declare function buildRouterMenus(routes: Routes, menuStacks: MenuStacks, options: RouterMenusOptions): Promise<void>;
export declare function buildRouterMenus(routes: Routes, menus: Menus[], options: RouterMenusOptions): Promise<void>;

@@ -1,2 +0,1 @@

import type { Entries } from "type-fest";
/**

@@ -15,5 +14,1 @@ * normalize-path

export declare function sleep(milliseconds: number): Promise<unknown>;
/**
* To object entries properly typed.
*/
export declare function toEntries<T extends object>(obj: T): Entries<T>;

@@ -1,3 +0,13 @@

import type { InjectionToken, WritableSignal } from "@angular/core";
/**
* Add the `menu` property to `Route`.
*/
declare module "@angular/router" {
interface Route {
/**
* Define if route should appear in a menu.
*/
menu?: RouteMenuItem;
}
}
/**
* A menu item in a navigation context.

@@ -34,19 +44,1 @@ */

export type MenuItems = MenuItem[];
/**
* Define your menu stacks.
*
* @see {@link MenuItems}
* @see {@link Menus}
*
* @example
* ```ts
* const MENU_STACK = new InjectionToken<WritableSignal<MenuItems>>("MENU_STACK", {
* providedIn: "root",
* factory: () => signal([]),
* })
* const menuStacks: MenuStacks = {
* main: MENU_STACK,
* }
* ```
*/
export type MenuStacks = Record<Menus, InjectionToken<WritableSignal<MenuItems>>>;
import { type EnvironmentProviders } from "@angular/core";
import type { Routes } from "@angular/router";
import type { MenuStacks } from "./menu";
import type { RouterMenusOptions } from "./options";
export declare const provideRouterMenus: (routes: Routes, menuStacks: MenuStacks, options: RouterMenusOptions) => EnvironmentProviders;
export declare function provideRouterMenus(routes: Routes, menus: Menus[], options: RouterMenusOptions): EnvironmentProviders;
{
"name": "angular-router-menus",
"version": "1.1.1",
"version": "2.0.0",
"description": "Angular Router menus that build itself on-the-fly with options",

@@ -12,14 +12,2 @@ "license": "MIT",

],
"exports": {
"./angular": {
"types": "./angular.d.ts"
},
"./package.json": {
"default": "./package.json"
},
".": {
"types": "./index.d.ts",
"default": "./fesm2022/angular-router-menus.mjs"
}
},
"dependencies": {

@@ -51,3 +39,12 @@ "tslib": "^2.8.1"

"module": "fesm2022/angular-router-menus.mjs",
"typings": "index.d.ts"
"typings": "index.d.ts",
"exports": {
"./package.json": {
"default": "./package.json"
},
".": {
"types": "./index.d.ts",
"default": "./fesm2022/angular-router-menus.mjs"
}
}
}
export * from "./lib/menu";
export * from "./lib/options";
export * from "./lib/provider";
export * from "./lib/service";

@@ -13,4 +13,2 @@ # Angular Router Menus

- [Installation](#installation)
- [`menus.ts`](#menusts)
- [`main.ts`](#maints)
- [Usage](#usage)

@@ -23,45 +21,17 @@ - [Configuration](#configuration)

1. Install the package
2. Add these entries to your tsconfig.json of your application
- `angular-router-menus`: This ensures you have all required types globally
- `angular-router-menus/angular`: This patches Angular's Route(r) type with a new entry
3. Create a type definition file and add this line
1. `declare type Menus = "main"`
2. Create a type definition file or add to yours
1. `declare type Menus = "main" | "aside"`
2. Adjust menus by your needs, you will configure them later
4. Create a [`menus.ts`](#menusts) file, this will hold your `Menus` stack injection tokens
5. In your [`main.ts`](#maints) file import and configure the library [as described](#maints) below
3. In your [`main.ts`](#maints) file import and configure the library
4. Make sure you have all your declared menus in the menus array
5. You must need a preloading strategy because I use internal api's
- `NoPreloading` is the default in Angular
### `menus.ts`
```typescript
import { InjectionToken, type WritableSignal, signal } from "@angular/core";
import type { MenuItems, MenuStacks } from "angular-router-menus";
export const MENU_STACK = new InjectionToken<WritableSignal<MenuItems>>("MENU_STACK", {
providedIn: "root",
factory: () => signal([]),
});
export const menus: MenuStacks = {
main: MENU_STACK,
};
```
### `main.ts`
```typescript
import { bootstrapApplication } from "@angular/platform-browser";
import { provideRouter, withComponentInputBinding } from "@angular/router";
import { provideRouterMenus } from "angular-router-menus";
import { AppComponent } from "./app/app.component";
import { menus } from "./menus";
import { routes } from "./routes";
void bootstrapApplication(AppComponent, {
providers: [
provideRouter(routes, withComponentInputBinding()),
provideRouterMenus(routes, menus, {
provideRouter(routes, withPreloading(NoPreloading)),
provideRouterMenus(routes, ["main"], {
defaultMenu: "main", // 👋🏻
debug: !environment.production,
}),

@@ -77,7 +47,2 @@ ],

```typescript
import { ChangeDetectionStrategy, Component, inject } from "@angular/core";
import { RouterLink, RouterLinkActive, RouterOutlet } from "@angular/router";
import { MENU_STACK } from "../menus";
@Component({

@@ -91,3 +56,3 @@ selector: "app-root",

export class AppComponent {
readonly menu = inject(MENU_STACK); // 👋🏻
readonly menu = inject(RouterMenusService).use("main"); // 👋🏻
}

@@ -110,5 +75,6 @@ ```

| Property | Description |
| ------------- | ------------------------------------------------- |
| `defaultMenu` | If not defined via `in` this is the default menu. |
| Property | Description |
| ------------- | ----------------------------------------------------------------- |
| `defaultMenu` | If not defined via `in` this is the default menu. |
| `debug` | Enables debugging, because of internal API use I omit all errors. |

@@ -115,0 +81,0 @@ ## Examples

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet