@retalia/sidebar-navigation 21.1.4 → 21.1.6

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 (93) hide show
  1. package/README.md +42 -42
  2. package/karma.conf.js +44 -0
  3. package/ng-package.json +8 -0
  4. package/package.json +14 -26
  5. package/{lib → src}/assets/fonts/Effra_Std_It.svg +5123 -5123
  6. package/{lib → src}/assets/fonts/Effra_Std_Md.svg +4128 -4128
  7. package/{lib → src}/assets/fonts/Effra_Std_Rg.svg +4690 -4690
  8. package/{lib → src}/assets/icons/sidebar-burger.svg +3 -3
  9. package/{lib → src}/assets/icons/sidebar-cross.svg +3 -3
  10. package/{lib → src}/assets/icons/subItem-arrow.svg +3 -3
  11. package/{lib → src}/assets/icons/topbar-info.svg +3 -3
  12. package/{lib → src}/assets/icons/topbar-logout.svg +4 -4
  13. package/{lib → src}/assets/icons/topbar-menu-burger.svg +5 -5
  14. package/{lib → src}/assets/icons/topbar-menu-close.svg +3 -3
  15. package/{lib → src}/assets/icons/topbar-notification.svg +3 -3
  16. package/{lib → src}/assets/icons/topbar-profile.svg +4 -4
  17. package/{lib → src}/assets/icons/topbar-settings.svg +3 -3
  18. package/{lib → src}/assets/icons/topmenu-arrow.svg +3 -3
  19. package/{lib → src}/assets/logo/_K3_imagine_White.svg +14 -14
  20. package/src/lib/data/support-routes.ts +56 -0
  21. package/src/lib/data/test-data.ts +628 -0
  22. package/src/lib/data/test-data2.ts +1742 -0
  23. package/src/lib/models/cookie-names.ts +12 -0
  24. package/src/lib/models/environment.ts +4 -0
  25. package/src/lib/models/http-response.ts +3 -0
  26. package/src/lib/models/module.ts +39 -0
  27. package/src/lib/navigation-lib.component.html +20 -0
  28. package/src/lib/navigation-lib.component.scss +30 -0
  29. package/src/lib/navigation-lib.component.ts +26 -0
  30. package/src/lib/navigation-lib.module.ts +26 -0
  31. package/src/lib/navigation-lib.service.ts +9 -0
  32. package/src/lib/services/auth.service.ts +39 -0
  33. package/src/lib/services/cookie.service.ts +33 -0
  34. package/src/lib/services/http.service.ts +26 -0
  35. package/src/lib/services/module.service.ts +153 -0
  36. package/src/lib/services/sub-item.service.ts +56 -0
  37. package/src/lib/sidebar/shop-modal/shop-modal.component.html +17 -0
  38. package/src/lib/sidebar/shop-modal/shop-modal.component.scss +73 -0
  39. package/src/lib/sidebar/shop-modal/shop-modal.component.ts +36 -0
  40. package/src/lib/sidebar/sidebar.component.html +86 -0
  41. package/src/lib/sidebar/sidebar.component.scss +260 -0
  42. package/src/lib/sidebar/sidebar.component.ts +228 -0
  43. package/src/lib/sidebar/sub-item/sub-item.component.html +18 -0
  44. package/src/lib/sidebar/sub-item/sub-item.component.scss +153 -0
  45. package/src/lib/sidebar/sub-item/sub-item.component.ts +61 -0
  46. package/src/lib/topbar/topbar.component.html +29 -0
  47. package/src/lib/topbar/topbar.component.scss +176 -0
  48. package/src/lib/topbar/topbar.component.ts +76 -0
  49. package/src/public-api.ts +14 -0
  50. package/src/styles/app.scss +53 -0
  51. package/src/test.ts +15 -0
  52. package/tsconfig.lib.json +21 -0
  53. package/tsconfig.lib.prod.json +11 -0
  54. package/tsconfig.spec.json +17 -0
  55. package/fesm2022/retalia-sidebar-navigation.mjs +0 -1354
  56. package/fesm2022/retalia-sidebar-navigation.mjs.map +0 -1
  57. package/production-0.0.2.tgz +0 -0
  58. package/types/retalia-sidebar-navigation.d.ts +0 -226
  59. /package/{lib → src}/assets/fonts/Effra_Std_It.eot +0 -0
  60. /package/{lib → src}/assets/fonts/Effra_Std_It.ttf +0 -0
  61. /package/{lib → src}/assets/fonts/Effra_Std_It.woff +0 -0
  62. /package/{lib → src}/assets/fonts/Effra_Std_It.woff2 +0 -0
  63. /package/{lib → src}/assets/fonts/Effra_Std_Md.eot +0 -0
  64. /package/{lib → src}/assets/fonts/Effra_Std_Md.ttf +0 -0
  65. /package/{lib → src}/assets/fonts/Effra_Std_Md.woff +0 -0
  66. /package/{lib → src}/assets/fonts/Effra_Std_Md.woff2 +0 -0
  67. /package/{lib → src}/assets/fonts/Effra_Std_Rg.eot +0 -0
  68. /package/{lib → src}/assets/fonts/Effra_Std_Rg.ttf +0 -0
  69. /package/{lib → src}/assets/fonts/Effra_Std_Rg.woff +0 -0
  70. /package/{lib → src}/assets/fonts/Effra_Std_Rg.woff2 +0 -0
  71. /package/{lib → src}/assets/fonts/Poppins-Black.ttf +0 -0
  72. /package/{lib → src}/assets/fonts/Poppins-BlackItalic.ttf +0 -0
  73. /package/{lib → src}/assets/fonts/Poppins-Bold.ttf +0 -0
  74. /package/{lib → src}/assets/fonts/Poppins-BoldItalic.ttf +0 -0
  75. /package/{lib → src}/assets/fonts/Poppins-ExtraBold.ttf +0 -0
  76. /package/{lib → src}/assets/fonts/Poppins-ExtraBoldItalic.ttf +0 -0
  77. /package/{lib → src}/assets/fonts/Poppins-ExtraLight.ttf +0 -0
  78. /package/{lib → src}/assets/fonts/Poppins-ExtraLightItalic.ttf +0 -0
  79. /package/{lib → src}/assets/fonts/Poppins-Italic.ttf +0 -0
  80. /package/{lib → src}/assets/fonts/Poppins-Light.ttf +0 -0
  81. /package/{lib → src}/assets/fonts/Poppins-LightItalic.ttf +0 -0
  82. /package/{lib → src}/assets/fonts/Poppins-Medium.ttf +0 -0
  83. /package/{lib → src}/assets/fonts/Poppins-MediumItalic.ttf +0 -0
  84. /package/{lib → src}/assets/fonts/Poppins-Regular.ttf +0 -0
  85. /package/{lib → src}/assets/fonts/Poppins-SemiBold.ttf +0 -0
  86. /package/{lib → src}/assets/fonts/Poppins-SemiBoldItalic.ttf +0 -0
  87. /package/{lib → src}/assets/fonts/Poppins-Thin.ttf +0 -0
  88. /package/{lib → src}/assets/fonts/Poppins-ThinItalic.ttf +0 -0
  89. /package/{lib → src}/assets/icons/topbar-avatar.png +0 -0
  90. /package/{lib → src}/assets/logo/full-white.png +0 -0
  91. /package/{lib → src}/assets/logo/full.png +0 -0
  92. /package/{lib → src}/assets/logo/mobile-white.png +0 -0
  93. /package/{lib → src}/assets/logo/mobile.png +0 -0
package/README.md CHANGED
@@ -1,43 +1,43 @@
1
- ## Retalia Sidebar Navigation Module
2
-
3
- To implement the sidebar navigation module into an Angular project, you will need to:
4
- 1. Run `npm i @retalia/sidebar-navigation`, the package can be found here: https://www.npmjs.com/package/@retalia/sidebar-navigation
5
- 2. `import { NavigationLibModule } from '@retalia/sidebar-navigation';` in the app.module.ts and the imports of the NgModule.
6
-
7
- 3. `import 'CUSTOM_ELEMENTS_SCHEMA';` into the app.module.ts if it isn't already there.
8
- `schemas: [CUSTOM_ELEMENTS_SCHEMA]`,
9
-
10
- 4. Call the component's HTML tag in the app.component.html file, with your `<router-outlet>` in between the `<sidebar-navigation>` tags and pass in values from your UI's environment variables, this allows the navigation library to make module calls to the correct gateway. As each UI's environment variables are set-up differently, the sidebar expects the apiRequestUrl and the portalUrl from the env.
11
- For the portalUrl I'd suggest only setting it if in a production environment. This ensures that the sidebar will remain on localhost and not route you to the module via the portal.
12
-
13
- > this.sidebarEnvironment = {
14
- > portalUrl: env.portalUrl,
15
- > apiRequestUrl: `${env.apiRequestUrl}api/v${env.apiVersion}`
16
- > };
17
-
18
- > <sidebar-navigation [environment]="sidebarEnvironment" (selectedRoute)="routeToItem($event)">
19
- > <router-outlet></router-outlet>
20
- > </sidebar-navigation>
21
-
22
- You will also need to include a routing function in the consuming module UI, this enables us to use each project's internal routers and router guards by passing back the selectedItem when the current module matches the selectedItem's parent module.
23
-
24
- > public routeToItem(selectedItem) {
25
- > this.zone.run(() => this.router.navigate([selectedItem.url]));
26
- > }
27
-
28
- 5. Optionally, you can include `useCustomPage="true"` which will remove the existing page-container and page-body wrappers which set margins and padding.
29
-
30
- 6. In your angular.json, you need to configure the input of the library's assets as so:
31
-
32
- > { "glob": "**/*", "input":
33
- > "./node_modules/@retalia/sidebar-navigation/lib/assets", "output":
34
- > "/assets/" }
35
-
36
- When passing in the environment variables, you can set the apiVersion to `TEST` in order to have a sidebar populated with mock data for immediate testing purposes.
37
-
38
- ## Local Development
39
- When adding new sidebar sidebarEntries/children, you will still need to configure the module UI's internal routing and components as normal, but also be sure to add the destination into your mock node server's date - this will allow you to see it on the sidebar and navigate to/from the new route.
40
-
41
- Adding this new item to the module call will require a migration.
42
-
1
+ ## Retalia Sidebar Navigation Module
2
+
3
+ To implement the sidebar navigation module into an Angular project, you will need to:
4
+ 1. Run `npm i @retalia/sidebar-navigation`, the package can be found here: https://www.npmjs.com/package/@retalia/sidebar-navigation
5
+ 2. `import { NavigationLibModule } from '@retalia/sidebar-navigation';` in the app.module.ts and the imports of the NgModule.
6
+
7
+ 3. `import 'CUSTOM_ELEMENTS_SCHEMA';` into the app.module.ts if it isn't already there.
8
+ `schemas: [CUSTOM_ELEMENTS_SCHEMA]`,
9
+
10
+ 4. Call the component's HTML tag in the app.component.html file, with your `<router-outlet>` in between the `<sidebar-navigation>` tags and pass in values from your UI's environment variables, this allows the navigation library to make module calls to the correct gateway. As each UI's environment variables are set-up differently, the sidebar expects the apiRequestUrl and the portalUrl from the env.
11
+ For the portalUrl I'd suggest only setting it if in a production environment. This ensures that the sidebar will remain on localhost and not route you to the module via the portal.
12
+
13
+ > this.sidebarEnvironment = {
14
+ > portalUrl: env.portalUrl,
15
+ > apiRequestUrl: `${env.apiRequestUrl}api/v${env.apiVersion}`
16
+ > };
17
+
18
+ > <sidebar-navigation [environment]="sidebarEnvironment" (selectedRoute)="routeToItem($event)">
19
+ > <router-outlet></router-outlet>
20
+ > </sidebar-navigation>
21
+
22
+ You will also need to include a routing function in the consuming module UI, this enables us to use each project's internal routers and router guards by passing back the selectedItem when the current module matches the selectedItem's parent module.
23
+
24
+ > public routeToItem(selectedItem) {
25
+ > this.zone.run(() => this.router.navigate([selectedItem.url]));
26
+ > }
27
+
28
+ 5. Optionally, you can include `useCustomPage="true"` which will remove the existing page-container and page-body wrappers which set margins and padding.
29
+
30
+ 6. In your angular.json, you need to configure the input of the library's assets as so:
31
+
32
+ > { "glob": "**/*", "input":
33
+ > "./node_modules/@retalia/sidebar-navigation/lib/assets", "output":
34
+ > "/assets/" }
35
+
36
+ When passing in the environment variables, you can set the apiVersion to `TEST` in order to have a sidebar populated with mock data for immediate testing purposes.
37
+
38
+ ## Local Development
39
+ When adding new sidebar sidebarEntries/children, you will still need to configure the module UI's internal routing and components as normal, but also be sure to add the destination into your mock node server's date - this will allow you to see it on the sidebar and navigate to/from the new route.
40
+
41
+ Adding this new item to the module call will require a migration.
42
+
43
43
  This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 11.2.4.
package/karma.conf.js ADDED
@@ -0,0 +1,44 @@
1
+ // Karma configuration file, see link for more information
2
+ // https://karma-runner.github.io/1.0/config/configuration-file.html
3
+
4
+ module.exports = function (config) {
5
+ config.set({
6
+ basePath: '',
7
+ frameworks: ['jasmine', '@angular-devkit/build-angular'],
8
+ plugins: [
9
+ require('karma-jasmine'),
10
+ require('karma-chrome-launcher'),
11
+ require('karma-jasmine-html-reporter'),
12
+ require('karma-coverage'),
13
+ require('@angular-devkit/build-angular/plugins/karma')
14
+ ],
15
+ client: {
16
+ jasmine: {
17
+ // you can add configuration options for Jasmine here
18
+ // the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html
19
+ // for example, you can disable the random execution with `random: false`
20
+ // or set a specific seed with `seed: 4321`
21
+ },
22
+ clearContext: false // leave Jasmine Spec Runner output visible in browser
23
+ },
24
+ jasmineHtmlReporter: {
25
+ suppressAll: true // removes the duplicated traces
26
+ },
27
+ coverageReporter: {
28
+ dir: require('path').join(__dirname, '../../coverage/sidebar-navigation'),
29
+ subdir: '.',
30
+ reporters: [
31
+ { type: 'html' },
32
+ { type: 'text-summary' }
33
+ ]
34
+ },
35
+ reporters: ['progress', 'kjhtml'],
36
+ port: 9876,
37
+ colors: true,
38
+ logLevel: config.LOG_INFO,
39
+ autoWatch: true,
40
+ browsers: ['Chrome'],
41
+ singleRun: false,
42
+ restartOnFileChange: true
43
+ });
44
+ };
@@ -0,0 +1,8 @@
1
+ {
2
+ "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
3
+ "dest": "../../dist/sidebar-navigation",
4
+ "assets": ["assets"],
5
+ "lib": {
6
+ "entryFile": "src/public-api.ts"
7
+ }
8
+ }
package/package.json CHANGED
@@ -1,26 +1,14 @@
1
- {
2
- "name": "@retalia/sidebar-navigation",
3
- "version": "21.1.4",
4
- "peerDependencies": {
5
- "@angular/common": "^21.1.2",
6
- "@angular/core": "^21.1.2",
7
- "es-cookie": "^1.5.0",
8
- "ngx-smart-modal": "^14.1.0",
9
- "tldjs": "^2.3.2"
10
- },
11
- "dependencies": {
12
- "tslib": "^2.8.1"
13
- },
14
- "module": "fesm2022/retalia-sidebar-navigation.mjs",
15
- "typings": "types/retalia-sidebar-navigation.d.ts",
16
- "exports": {
17
- "./package.json": {
18
- "default": "./package.json"
19
- },
20
- ".": {
21
- "types": "./types/retalia-sidebar-navigation.d.ts",
22
- "default": "./fesm2022/retalia-sidebar-navigation.mjs"
23
- }
24
- },
25
- "sideEffects": false
26
- }
1
+ {
2
+ "name": "@retalia/sidebar-navigation",
3
+ "version": "21.1.6",
4
+ "peerDependencies": {
5
+ "@angular/common": "^21.1.2",
6
+ "@angular/core": "^21.1.2",
7
+ "es-cookie": "^1.5.0",
8
+ "ngx-smart-modal": "^14.1.0",
9
+ "tldjs": "^2.3.2"
10
+ },
11
+ "dependencies": {
12
+ "tslib": "^2.8.1"
13
+ }
14
+ }