@enigmatry/entry-components 1.2.81 → 1.2.83

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 (41) hide show
  1. package/README.md +1 -1
  2. package/dialog/README.md +10 -0
  3. package/dialog/styles/modules/components/dialogs/footers/_general.scss +1 -1
  4. package/dialog/styles/modules/components/dialogs/headers/_general.scss +1 -1
  5. package/dialog/styles/partials/core/components/dialogs/_general.scss +2 -2
  6. package/esm2020/public-api.mjs +2 -1
  7. package/esm2020/toolbar/enigmatry-entry-components-toolbar.mjs +5 -0
  8. package/esm2020/toolbar/entry-toolbar.component.mjs +43 -0
  9. package/esm2020/toolbar/entry-toolbar.module.mjs +24 -0
  10. package/esm2020/toolbar/public-api.mjs +3 -0
  11. package/fesm2015/enigmatry-entry-components-toolbar.mjs +71 -0
  12. package/fesm2015/enigmatry-entry-components-toolbar.mjs.map +1 -0
  13. package/fesm2015/enigmatry-entry-components.mjs +1 -0
  14. package/fesm2015/enigmatry-entry-components.mjs.map +1 -1
  15. package/fesm2020/enigmatry-entry-components-toolbar.mjs +71 -0
  16. package/fesm2020/enigmatry-entry-components-toolbar.mjs.map +1 -0
  17. package/fesm2020/enigmatry-entry-components.mjs +1 -0
  18. package/fesm2020/enigmatry-entry-components.mjs.map +1 -1
  19. package/header/README.md +10 -0
  20. package/header/styles/modules/components/buttons/_general.scss +1 -1
  21. package/package.json +9 -1
  22. package/public-api.d.ts +1 -0
  23. package/search-filter/README.md +11 -1
  24. package/styles/_generate.scss +3 -0
  25. package/{dialog/styles → styles}/modules/states/_hover.scss +10 -2
  26. package/styles/modules/theming/_default-theming.scss +3 -1
  27. package/styles/modules/typography/_fonts.scss +4 -0
  28. package/toolbar/README.md +33 -0
  29. package/toolbar/entry-toolbar.component.d.ts +28 -0
  30. package/toolbar/entry-toolbar.module.d.ts +8 -0
  31. package/toolbar/index.d.ts +5 -0
  32. package/toolbar/public-api.d.ts +2 -0
  33. package/toolbar/styles/modules/_generate.scss +10 -0
  34. package/toolbar/styles/modules/components/toolbar/_general.scss +34 -0
  35. package/toolbar/styles/modules/theming/_default-theming.scss +8 -0
  36. package/toolbar/styles/partials/core/_index.scss +1 -0
  37. package/toolbar/styles/partials/core/components/_index.scss +1 -0
  38. package/toolbar/styles/partials/core/components/toolbar/_general.scss +100 -0
  39. package/toolbar/styles/partials/core/components/toolbar/_index.scss +1 -0
  40. package/toolbar/styles/partials/main.scss +1 -0
  41. package/header/styles/modules/states/_hover.scss +0 -7
package/README.md CHANGED
@@ -4,7 +4,7 @@ Reusable entry components for Angular material.
4
4
 
5
5
  ## Installation
6
6
 
7
- ```
7
+ ```ts
8
8
  npm install @enigmatry/entry-components
9
9
  ```
10
10
 
package/dialog/README.md CHANGED
@@ -8,6 +8,16 @@ Enables working with built-in (alert and confirm) and custom dialogs. Supports d
8
8
  import { EntryDialogModule } from '@enigmatry/entry-components/dialog';
9
9
  ```
10
10
 
11
+ Styles import:
12
+
13
+ ```css
14
+ @use '@enigmatry/entry-components/styles/generate' as entry;
15
+
16
+ @include entry.generate(APP_THEME, APP_TYPOGRAPHY);
17
+ ```
18
+
19
+ Where `APP_THEME` represents application theming configuration, while `APP_TYPOGRAPHY` represents application fonts configuration.
20
+
11
21
  ## Basic usage
12
22
 
13
23
  `EntryDialogService` is used to open dialogs:
package/dialog/styles/modules/components/dialogs/footers/_general.scss CHANGED
@@ -1,5 +1,5 @@
1
1
  @use '@enigmatry/scss-foundation/src/modules/map';
2
- @use '../../../states/hover';
2
+ @use '../../../../../../styles/modules/states/hover';
3
3
 
4
4
  @mixin generate-footers-from($theme) {
5
5
  .button-confirm {
package/dialog/styles/modules/components/dialogs/headers/_general.scss CHANGED
@@ -1,5 +1,5 @@
1
1
  @use '@enigmatry/scss-foundation/src/modules/map';
2
- @use '../../../states/hover';
2
+ @use '../../../../../../styles/modules/states/hover';
3
3
 
4
4
  @mixin generate-headers-from($theme) {
5
5
  .title {
package/dialog/styles/partials/core/components/dialogs/_general.scss CHANGED
@@ -1,7 +1,7 @@
1
+ @use 'sass:color';
1
2
  @use '@enigmatry/scss-foundation/src/modules/display/items';
2
- @use '../../../../modules/states/hover';
3
3
  @use '../../../../../../styles/modules/variables' as vars;
4
- @use 'sass:color';
4
+ @use '../../../../../../styles/modules/states/hover';
5
5
  @use '../../../../../../styles/modules/typography/fonts' as fonts;
6
6
 
7
7
  $border-dark: #000;
package/esm2020/public-api.mjs CHANGED
@@ -4,4 +4,5 @@
4
4
  export * from '@enigmatry/entry-components/header';
5
5
  export * from '@enigmatry/entry-components/dialog';
6
6
  export * from '@enigmatry/entry-components/search-filter';
7
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2xpYnMvZW50cnktY29tcG9uZW50cy9wdWJsaWMtYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztHQUVHO0FBRUgsY0FBYyxvQ0FBb0MsQ0FBQztBQUNuRCxjQUFjLG9DQUFvQyxDQUFDO0FBQ25ELGNBQWMsMkNBQTJDLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogUHVibGljIEFQSSBTdXJmYWNlIG9mIGVudHJ5LWNvbXBvbmVudHNcbiAqL1xuXG5leHBvcnQgKiBmcm9tICdAZW5pZ21hdHJ5L2VudHJ5LWNvbXBvbmVudHMvaGVhZGVyJztcbmV4cG9ydCAqIGZyb20gJ0BlbmlnbWF0cnkvZW50cnktY29tcG9uZW50cy9kaWFsb2cnO1xuZXhwb3J0ICogZnJvbSAnQGVuaWdtYXRyeS9lbnRyeS1jb21wb25lbnRzL3NlYXJjaC1maWx0ZXInO1xuIl19
7
+ export * from '@enigmatry/entry-components/toolbar';
8
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2xpYnMvZW50cnktY29tcG9uZW50cy9wdWJsaWMtYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztHQUVHO0FBRUgsY0FBYyxvQ0FBb0MsQ0FBQztBQUNuRCxjQUFjLG9DQUFvQyxDQUFDO0FBQ25ELGNBQWMsMkNBQTJDLENBQUM7QUFDMUQsY0FBYyxxQ0FBcUMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBQdWJsaWMgQVBJIFN1cmZhY2Ugb2YgZW50cnktY29tcG9uZW50c1xuICovXG5cbmV4cG9ydCAqIGZyb20gJ0BlbmlnbWF0cnkvZW50cnktY29tcG9uZW50cy9oZWFkZXInO1xuZXhwb3J0ICogZnJvbSAnQGVuaWdtYXRyeS9lbnRyeS1jb21wb25lbnRzL2RpYWxvZyc7XG5leHBvcnQgKiBmcm9tICdAZW5pZ21hdHJ5L2VudHJ5LWNvbXBvbmVudHMvc2VhcmNoLWZpbHRlcic7XG5leHBvcnQgKiBmcm9tICdAZW5pZ21hdHJ5L2VudHJ5LWNvbXBvbmVudHMvdG9vbGJhcic7XG4iXX0=
package/esm2020/toolbar/enigmatry-entry-components-toolbar.mjs ADDED
@@ -0,0 +1,5 @@
1
+ /**
2
+ * Generated bundle index. Do not edit.
3
+ */
4
+ export * from './public-api';
5
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZW5pZ21hdHJ5LWVudHJ5LWNvbXBvbmVudHMtdG9vbGJhci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2xpYnMvZW50cnktY29tcG9uZW50cy90b29sYmFyL2VuaWdtYXRyeS1lbnRyeS1jb21wb25lbnRzLXRvb2xiYXIudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLGNBQWMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogR2VuZXJhdGVkIGJ1bmRsZSBpbmRleC4gRG8gbm90IGVkaXQuXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9wdWJsaWMtYXBpJztcbiJdfQ==
package/esm2020/toolbar/entry-toolbar.component.mjs ADDED
@@ -0,0 +1,43 @@
1
+ import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
2
+ import * as i0 from "@angular/core";
3
+ import * as i1 from "@angular/common";
4
+ /**
5
+ * Toolbar component (`<entry-toolbar>`) is used to render header section in the applications containing menu items as a content.
6
+ * It offers build in support for toolbar title or logo, while other elements need to be provided via content projection.
7
+ * On smaller screens (mobile/tablet) it switches to compact view containing menu icon button used to toggle content visibility.
8
+ *
9
+ * @example
10
+ * ```html
11
+ * <entry-toolbar
12
+ * titleUri="http://www.enigmatry.com"
13
+ * titleLogoSrc="assets/enigmatry-logo.png">
14
+ * <!-- SOME CUSTOM HTML CODE THAT RENDERS MENU ITEMS -->
15
+ * </entry-toolbar>
16
+ * ```
17
+ */
18
+ export class EntryToolbarComponent {
19
+ constructor() {
20
+ /** Url to be redirected to if user click on the title (default value '/') */
21
+ this.titleUri = '/';
22
+ /** If provided, it replaces string title and renders logo image instead */
23
+ this.titleLogoSrc = undefined;
24
+ /** Used to hide the title section if not required (default value false) */
25
+ this.hideTitle = false;
26
+ this.menuOpened = false;
27
+ }
28
+ }
29
+ EntryToolbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
30
+ EntryToolbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: EntryToolbarComponent, selector: "entry-toolbar", inputs: { title: "title", titleUri: "titleUri", titleLogoSrc: "titleLogoSrc", hideTitle: "hideTitle" }, ngImport: i0, template: "<header class=\"entry-toolbar\">\n <nav class=\"entry-toolbar-nav\">\n <div class=\"entry-toolbar-data\">\n <div class=\"entry-toolbar-logo\">\n <a *ngIf=\"!hideTitle\" [href]=\"titleUri\">\n <span *ngIf=\"!titleLogoSrc\">{{title}}</span>\n <img *ngIf=\"titleLogoSrc\" [src]=\"titleLogoSrc\"/>\n </a>\n </div>\n\n <div class=\"entry-toolbar-nav-toggle\"\n (click)=\"menuOpened = !menuOpened\"\n [ngClass]=\"{'show-toolbar-icon': menuOpened === true}\">\n <i class=\"nav-toggle-menu\">\n <span class=\"icon-menu\"></span>\n </i>\n <i class=\"nav-toggle-close\">\n <span class=\"icon-close\"></span>\n </i>\n </div>\n </div>\n <span class=\"entry-toolbar-content\"\n [ngClass]=\"{'show-toolbar-content': menuOpened === true}\">\n <ng-content></ng-content>\n </span>\n </nav>\n</header>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
31
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarComponent, decorators: [{
32
+ type: Component,
33
+ args: [{ selector: 'entry-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<header class=\"entry-toolbar\">\n <nav class=\"entry-toolbar-nav\">\n <div class=\"entry-toolbar-data\">\n <div class=\"entry-toolbar-logo\">\n <a *ngIf=\"!hideTitle\" [href]=\"titleUri\">\n <span *ngIf=\"!titleLogoSrc\">{{title}}</span>\n <img *ngIf=\"titleLogoSrc\" [src]=\"titleLogoSrc\"/>\n </a>\n </div>\n\n <div class=\"entry-toolbar-nav-toggle\"\n (click)=\"menuOpened = !menuOpened\"\n [ngClass]=\"{'show-toolbar-icon': menuOpened === true}\">\n <i class=\"nav-toggle-menu\">\n <span class=\"icon-menu\"></span>\n </i>\n <i class=\"nav-toggle-close\">\n <span class=\"icon-close\"></span>\n </i>\n </div>\n </div>\n <span class=\"entry-toolbar-content\"\n [ngClass]=\"{'show-toolbar-content': menuOpened === true}\">\n <ng-content></ng-content>\n </span>\n </nav>\n</header>" }]
34
+ }], propDecorators: { title: [{
35
+ type: Input
36
+ }], titleUri: [{
37
+ type: Input
38
+ }], titleLogoSrc: [{
39
+ type: Input
40
+ }], hideTitle: [{
41
+ type: Input
42
+ }] } });
43
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZW50cnktdG9vbGJhci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9saWJzL2VudHJ5LWNvbXBvbmVudHMvdG9vbGJhci9lbnRyeS10b29sYmFyLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL2xpYnMvZW50cnktY29tcG9uZW50cy90b29sYmFyL2VudHJ5LXRvb2xiYXIuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7OztBQUUxRTs7Ozs7Ozs7Ozs7OztHQWFHO0FBT0gsTUFBTSxPQUFPLHFCQUFxQjtJQU5sQztRQVNFLDZFQUE2RTtRQUNwRSxhQUFRLEdBQUcsR0FBRyxDQUFDO1FBQ3hCLDJFQUEyRTtRQUNsRSxpQkFBWSxHQUF1QixTQUFTLENBQUM7UUFDdEQsMkVBQTJFO1FBQ2xFLGNBQVMsR0FBRyxLQUFLLENBQUM7UUFFM0IsZUFBVSxHQUFHLEtBQUssQ0FBQztLQUNwQjs7a0hBWFkscUJBQXFCO3NHQUFyQixxQkFBcUIsNkpDdEJsQyx5akNBMEJTOzJGREpJLHFCQUFxQjtrQkFOakMsU0FBUzsrQkFDRSxlQUFlLG1CQUdSLHVCQUF1QixDQUFDLE1BQU07OEJBSXRDLEtBQUs7c0JBQWIsS0FBSztnQkFFRyxRQUFRO3NCQUFoQixLQUFLO2dCQUVHLFlBQVk7c0JBQXBCLEtBQUs7Z0JBRUcsU0FBUztzQkFBakIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbi8qKlxuICogVG9vbGJhciBjb21wb25lbnQgKGA8ZW50cnktdG9vbGJhcj5gKSBpcyB1c2VkIHRvIHJlbmRlciBoZWFkZXIgc2VjdGlvbiBpbiB0aGUgYXBwbGljYXRpb25zIGNvbnRhaW5pbmcgbWVudSBpdGVtcyBhcyBhIGNvbnRlbnQuXG4gKiBJdCBvZmZlcnMgYnVpbGQgaW4gc3VwcG9ydCBmb3IgdG9vbGJhciB0aXRsZSBvciBsb2dvLCB3aGlsZSBvdGhlciBlbGVtZW50cyBuZWVkIHRvIGJlIHByb3ZpZGVkIHZpYSBjb250ZW50IHByb2plY3Rpb24uXG4gKiBPbiBzbWFsbGVyIHNjcmVlbnMgKG1vYmlsZS90YWJsZXQpIGl0IHN3aXRjaGVzIHRvIGNvbXBhY3QgdmlldyBjb250YWluaW5nIG1lbnUgaWNvbiBidXR0b24gdXNlZCB0byB0b2dnbGUgY29udGVudCB2aXNpYmlsaXR5LlxuICpcbiAqIEBleGFtcGxlXG4gKiBgYGBodG1sXG4gKiA8ZW50cnktdG9vbGJhclxuICogICAgdGl0bGVVcmk9XCJodHRwOi8vd3d3LmVuaWdtYXRyeS5jb21cIlxuICogICAgdGl0bGVMb2dvU3JjPVwiYXNzZXRzL2VuaWdtYXRyeS1sb2dvLnBuZ1wiPlxuICogICAgPCEtLSBTT01FIENVU1RPTSBIVE1MIENPREUgVEhBVCBSRU5ERVJTIE1FTlUgSVRFTVMgLS0+XG4gKiA8L2VudHJ5LXRvb2xiYXI+XG4gKiBgYGBcbiAqL1xuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnZW50cnktdG9vbGJhcicsXG4gIHRlbXBsYXRlVXJsOiAnLi9lbnRyeS10b29sYmFyLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vZW50cnktdG9vbGJhci5jb21wb25lbnQuc2NzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaFxufSlcbmV4cG9ydCBjbGFzcyBFbnRyeVRvb2xiYXJDb21wb25lbnQge1xuICAvKiogVG9vbGJhciB0aXRsZSBwb3NpdGlvbmVkIGluIHRoZSBsZWZ0IHNpZGUgKi9cbiAgQElucHV0KCkgdGl0bGU6IHN0cmluZztcbiAgLyoqIFVybCB0byBiZSByZWRpcmVjdGVkIHRvIGlmIHVzZXIgY2xpY2sgb24gdGhlIHRpdGxlIChkZWZhdWx0IHZhbHVlICcvJykgKi9cbiAgQElucHV0KCkgdGl0bGVVcmkgPSAnLyc7XG4gIC8qKiBJZiBwcm92aWRlZCwgaXQgcmVwbGFjZXMgc3RyaW5nIHRpdGxlIGFuZCByZW5kZXJzIGxvZ28gaW1hZ2UgaW5zdGVhZCAqL1xuICBASW5wdXQoKSB0aXRsZUxvZ29TcmM6IHN0cmluZyB8IHVuZGVmaW5lZCA9IHVuZGVmaW5lZDtcbiAgLyoqIFVzZWQgdG8gaGlkZSB0aGUgdGl0bGUgc2VjdGlvbiBpZiBub3QgcmVxdWlyZWQgKGRlZmF1bHQgdmFsdWUgZmFsc2UpICovXG4gIEBJbnB1dCgpIGhpZGVUaXRsZSA9IGZhbHNlO1xuXG4gIG1lbnVPcGVuZWQgPSBmYWxzZTtcbn1cbiIsIjxoZWFkZXIgY2xhc3M9XCJlbnRyeS10b29sYmFyXCI+XG4gICAgPG5hdiBjbGFzcz1cImVudHJ5LXRvb2xiYXItbmF2XCI+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJlbnRyeS10b29sYmFyLWRhdGFcIj5cbiAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJlbnRyeS10b29sYmFyLWxvZ29cIj5cbiAgICAgICAgICAgICAgICA8YSAqbmdJZj1cIiFoaWRlVGl0bGVcIiBbaHJlZl09XCJ0aXRsZVVyaVwiPlxuICAgICAgICAgICAgICAgICAgICA8c3BhbiAqbmdJZj1cIiF0aXRsZUxvZ29TcmNcIj57e3RpdGxlfX08L3NwYW4+XG4gICAgICAgICAgICAgICAgICAgIDxpbWcgKm5nSWY9XCJ0aXRsZUxvZ29TcmNcIiBbc3JjXT1cInRpdGxlTG9nb1NyY1wiLz5cbiAgICAgICAgICAgICAgICA8L2E+XG4gICAgICAgICAgICA8L2Rpdj5cblxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cImVudHJ5LXRvb2xiYXItbmF2LXRvZ2dsZVwiXG4gICAgICAgICAgICAgICAgKGNsaWNrKT1cIm1lbnVPcGVuZWQgPSAhbWVudU9wZW5lZFwiXG4gICAgICAgICAgICAgICAgW25nQ2xhc3NdPVwieydzaG93LXRvb2xiYXItaWNvbic6IG1lbnVPcGVuZWQgPT09IHRydWV9XCI+XG4gICAgICAgICAgICAgICAgPGkgY2xhc3M9XCJuYXYtdG9nZ2xlLW1lbnVcIj5cbiAgICAgICAgICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJpY29uLW1lbnVcIj48L3NwYW4+XG4gICAgICAgICAgICAgICAgPC9pPlxuICAgICAgICAgICAgICAgIDxpIGNsYXNzPVwibmF2LXRvZ2dsZS1jbG9zZVwiPlxuICAgICAgICAgICAgICAgICAgICA8c3BhbiBjbGFzcz1cImljb24tY2xvc2VcIj48L3NwYW4+XG4gICAgICAgICAgICAgICAgPC9pPlxuICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8c3BhbiBjbGFzcz1cImVudHJ5LXRvb2xiYXItY29udGVudFwiXG4gICAgICAgICAgICBbbmdDbGFzc109XCJ7J3Nob3ctdG9vbGJhci1jb250ZW50JzogbWVudU9wZW5lZCA9PT0gdHJ1ZX1cIj5cbiAgICAgICAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgICAgICAgPC9zcGFuPlxuICAgIDwvbmF2PlxuPC9oZWFkZXI+Il19
package/esm2020/toolbar/entry-toolbar.module.mjs ADDED
@@ -0,0 +1,24 @@
1
+ import { NgModule } from '@angular/core';
2
+ import { CommonModule } from '@angular/common';
3
+ import { EntryToolbarComponent } from './entry-toolbar.component';
4
+ import * as i0 from "@angular/core";
5
+ export class EntryToolbarModule {
6
+ }
7
+ EntryToolbarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
8
+ EntryToolbarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarModule, declarations: [EntryToolbarComponent], imports: [CommonModule], exports: [EntryToolbarComponent] });
9
+ EntryToolbarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarModule, imports: [CommonModule] });
10
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarModule, decorators: [{
11
+ type: NgModule,
12
+ args: [{
13
+ declarations: [
14
+ EntryToolbarComponent
15
+ ],
16
+ imports: [
17
+ CommonModule
18
+ ],
19
+ exports: [
20
+ EntryToolbarComponent
21
+ ]
22
+ }]
23
+ }] });
24
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZW50cnktdG9vbGJhci5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9saWJzL2VudHJ5LWNvbXBvbmVudHMvdG9vbGJhci9lbnRyeS10b29sYmFyLm1vZHVsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3pDLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUscUJBQXFCLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQzs7QUFhbEUsTUFBTSxPQUFPLGtCQUFrQjs7K0dBQWxCLGtCQUFrQjtnSEFBbEIsa0JBQWtCLGlCQVQzQixxQkFBcUIsYUFHckIsWUFBWSxhQUdaLHFCQUFxQjtnSEFHWixrQkFBa0IsWUFOM0IsWUFBWTsyRkFNSCxrQkFBa0I7a0JBWDlCLFFBQVE7bUJBQUM7b0JBQ1IsWUFBWSxFQUFFO3dCQUNaLHFCQUFxQjtxQkFDdEI7b0JBQ0QsT0FBTyxFQUFFO3dCQUNQLFlBQVk7cUJBQ2I7b0JBQ0QsT0FBTyxFQUFFO3dCQUNQLHFCQUFxQjtxQkFDdEI7aUJBQ0YiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBOZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IEVudHJ5VG9vbGJhckNvbXBvbmVudCB9IGZyb20gJy4vZW50cnktdG9vbGJhci5jb21wb25lbnQnO1xuXG5ATmdNb2R1bGUoe1xuICBkZWNsYXJhdGlvbnM6IFtcbiAgICBFbnRyeVRvb2xiYXJDb21wb25lbnRcbiAgXSxcbiAgaW1wb3J0czogW1xuICAgIENvbW1vbk1vZHVsZVxuICBdLFxuICBleHBvcnRzOiBbXG4gICAgRW50cnlUb29sYmFyQ29tcG9uZW50XG4gIF1cbn0pXG5leHBvcnQgY2xhc3MgRW50cnlUb29sYmFyTW9kdWxlIHsgfVxuIl19
package/esm2020/toolbar/public-api.mjs ADDED
@@ -0,0 +1,3 @@
1
+ export { EntryToolbarComponent } from './entry-toolbar.component';
2
+ export { EntryToolbarModule } from './entry-toolbar.module';
3
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2xpYnMvZW50cnktY29tcG9uZW50cy90b29sYmFyL3B1YmxpYy1hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLHFCQUFxQixFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFDbEUsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sd0JBQXdCLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgeyBFbnRyeVRvb2xiYXJDb21wb25lbnQgfSBmcm9tICcuL2VudHJ5LXRvb2xiYXIuY29tcG9uZW50JztcbmV4cG9ydCB7IEVudHJ5VG9vbGJhck1vZHVsZSB9IGZyb20gJy4vZW50cnktdG9vbGJhci5tb2R1bGUnO1xuIl19
package/fesm2015/enigmatry-entry-components-toolbar.mjs ADDED
@@ -0,0 +1,71 @@
1
+ import * as i0 from '@angular/core';
2
+ import { Component, ChangeDetectionStrategy, Input, NgModule } from '@angular/core';
3
+ import * as i1 from '@angular/common';
4
+ import { CommonModule } from '@angular/common';
5
+
6
+ /**
7
+ * Toolbar component (`<entry-toolbar>`) is used to render header section in the applications containing menu items as a content.
8
+ * It offers build in support for toolbar title or logo, while other elements need to be provided via content projection.
9
+ * On smaller screens (mobile/tablet) it switches to compact view containing menu icon button used to toggle content visibility.
10
+ *
11
+ * @example
12
+ * ```html
13
+ * <entry-toolbar
14
+ * titleUri="http://www.enigmatry.com"
15
+ * titleLogoSrc="assets/enigmatry-logo.png">
16
+ * <!-- SOME CUSTOM HTML CODE THAT RENDERS MENU ITEMS -->
17
+ * </entry-toolbar>
18
+ * ```
19
+ */
20
+ class EntryToolbarComponent {
21
+ constructor() {
22
+ /** Url to be redirected to if user click on the title (default value '/') */
23
+ this.titleUri = '/';
24
+ /** If provided, it replaces string title and renders logo image instead */
25
+ this.titleLogoSrc = undefined;
26
+ /** Used to hide the title section if not required (default value false) */
27
+ this.hideTitle = false;
28
+ this.menuOpened = false;
29
+ }
30
+ }
31
+ EntryToolbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
32
+ EntryToolbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: EntryToolbarComponent, selector: "entry-toolbar", inputs: { title: "title", titleUri: "titleUri", titleLogoSrc: "titleLogoSrc", hideTitle: "hideTitle" }, ngImport: i0, template: "<header class=\"entry-toolbar\">\n <nav class=\"entry-toolbar-nav\">\n <div class=\"entry-toolbar-data\">\n <div class=\"entry-toolbar-logo\">\n <a *ngIf=\"!hideTitle\" [href]=\"titleUri\">\n <span *ngIf=\"!titleLogoSrc\">{{title}}</span>\n <img *ngIf=\"titleLogoSrc\" [src]=\"titleLogoSrc\"/>\n </a>\n </div>\n\n <div class=\"entry-toolbar-nav-toggle\"\n (click)=\"menuOpened = !menuOpened\"\n [ngClass]=\"{'show-toolbar-icon': menuOpened === true}\">\n <i class=\"nav-toggle-menu\">\n <span class=\"icon-menu\"></span>\n </i>\n <i class=\"nav-toggle-close\">\n <span class=\"icon-close\"></span>\n </i>\n </div>\n </div>\n <span class=\"entry-toolbar-content\"\n [ngClass]=\"{'show-toolbar-content': menuOpened === true}\">\n <ng-content></ng-content>\n </span>\n </nav>\n</header>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
33
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarComponent, decorators: [{
34
+ type: Component,
35
+ args: [{ selector: 'entry-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<header class=\"entry-toolbar\">\n <nav class=\"entry-toolbar-nav\">\n <div class=\"entry-toolbar-data\">\n <div class=\"entry-toolbar-logo\">\n <a *ngIf=\"!hideTitle\" [href]=\"titleUri\">\n <span *ngIf=\"!titleLogoSrc\">{{title}}</span>\n <img *ngIf=\"titleLogoSrc\" [src]=\"titleLogoSrc\"/>\n </a>\n </div>\n\n <div class=\"entry-toolbar-nav-toggle\"\n (click)=\"menuOpened = !menuOpened\"\n [ngClass]=\"{'show-toolbar-icon': menuOpened === true}\">\n <i class=\"nav-toggle-menu\">\n <span class=\"icon-menu\"></span>\n </i>\n <i class=\"nav-toggle-close\">\n <span class=\"icon-close\"></span>\n </i>\n </div>\n </div>\n <span class=\"entry-toolbar-content\"\n [ngClass]=\"{'show-toolbar-content': menuOpened === true}\">\n <ng-content></ng-content>\n </span>\n </nav>\n</header>" }]
36
+ }], propDecorators: { title: [{
37
+ type: Input
38
+ }], titleUri: [{
39
+ type: Input
40
+ }], titleLogoSrc: [{
41
+ type: Input
42
+ }], hideTitle: [{
43
+ type: Input
44
+ }] } });
45
+
46
+ class EntryToolbarModule {
47
+ }
48
+ EntryToolbarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
49
+ EntryToolbarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarModule, declarations: [EntryToolbarComponent], imports: [CommonModule], exports: [EntryToolbarComponent] });
50
+ EntryToolbarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarModule, imports: [CommonModule] });
51
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarModule, decorators: [{
52
+ type: NgModule,
53
+ args: [{
54
+ declarations: [
55
+ EntryToolbarComponent
56
+ ],
57
+ imports: [
58
+ CommonModule
59
+ ],
60
+ exports: [
61
+ EntryToolbarComponent
62
+ ]
63
+ }]
64
+ }] });
65
+
66
+ /**
67
+ * Generated bundle index. Do not edit.
68
+ */
69
+
70
+ export { EntryToolbarComponent, EntryToolbarModule };
71
+ //# sourceMappingURL=enigmatry-entry-components-toolbar.mjs.map
package/fesm2015/enigmatry-entry-components-toolbar.mjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"enigmatry-entry-components-toolbar.mjs","sources":["../../../../libs/entry-components/toolbar/entry-toolbar.component.ts","../../../../libs/entry-components/toolbar/entry-toolbar.component.html","../../../../libs/entry-components/toolbar/entry-toolbar.module.ts","../../../../libs/entry-components/toolbar/enigmatry-entry-components-toolbar.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Input } from '@angular/core';\n\n/**\n * Toolbar component (`<entry-toolbar>`) is used to render header section in the applications containing menu items as a content.\n * It offers build in support for toolbar title or logo, while other elements need to be provided via content projection.\n * On smaller screens (mobile/tablet) it switches to compact view containing menu icon button used to toggle content visibility.\n *\n * @example\n * ```html\n * <entry-toolbar\n * titleUri=\"http://www.enigmatry.com\"\n * titleLogoSrc=\"assets/enigmatry-logo.png\">\n * <!-- SOME CUSTOM HTML CODE THAT RENDERS MENU ITEMS -->\n * </entry-toolbar>\n * ```\n */\n@Component({\n selector: 'entry-toolbar',\n templateUrl: './entry-toolbar.component.html',\n styleUrls: ['./entry-toolbar.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class EntryToolbarComponent {\n /** Toolbar title positioned in the left side */\n @Input() title: string;\n /** Url to be redirected to if user click on the title (default value '/') */\n @Input() titleUri = '/';\n /** If provided, it replaces string title and renders logo image instead */\n @Input() titleLogoSrc: string | undefined = undefined;\n /** Used to hide the title section if not required (default value false) */\n @Input() hideTitle = false;\n\n menuOpened = false;\n}\n","<header class=\"entry-toolbar\">\n <nav class=\"entry-toolbar-nav\">\n <div class=\"entry-toolbar-data\">\n <div class=\"entry-toolbar-logo\">\n <a *ngIf=\"!hideTitle\" [href]=\"titleUri\">\n <span *ngIf=\"!titleLogoSrc\">{{title}}</span>\n <img *ngIf=\"titleLogoSrc\" [src]=\"titleLogoSrc\"/>\n </a>\n </div>\n\n <div class=\"entry-toolbar-nav-toggle\"\n (click)=\"menuOpened = !menuOpened\"\n [ngClass]=\"{'show-toolbar-icon': menuOpened === true}\">\n <i class=\"nav-toggle-menu\">\n <span class=\"icon-menu\"></span>\n </i>\n <i class=\"nav-toggle-close\">\n <span class=\"icon-close\"></span>\n </i>\n </div>\n </div>\n <span class=\"entry-toolbar-content\"\n [ngClass]=\"{'show-toolbar-content': menuOpened === true}\">\n <ng-content></ng-content>\n </span>\n </nav>\n</header>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { EntryToolbarComponent } from './entry-toolbar.component';\n\n@NgModule({\n declarations: [\n EntryToolbarComponent\n ],\n imports: [\n CommonModule\n ],\n exports: [\n EntryToolbarComponent\n ]\n})\nexport class EntryToolbarModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;AAEA;;;;;;;;;;;;;AAaG;MAOU,qBAAqB,CAAA;AANlC,IAAA,WAAA,GAAA;;AAUW,QAAA,IAAQ,CAAA,QAAA,GAAG,GAAG,CAAC;;AAEf,QAAA,IAAY,CAAA,YAAA,GAAuB,SAAS,CAAC;;AAE7C,QAAA,IAAS,CAAA,SAAA,GAAG,KAAK,CAAC;AAE3B,QAAA,IAAU,CAAA,UAAA,GAAG,KAAK,CAAC;KACpB;;kHAXY,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAArB,qBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,qBAAqB,6JCtBlC,yjCA0BS,EAAA,MAAA,EAAA,CAAA,EAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;2FDJI,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBANjC,SAAS;+BACE,eAAe,EAAA,eAAA,EAGR,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,yjCAAA,EAAA,CAAA;8BAItC,KAAK,EAAA,CAAA;sBAAb,KAAK;gBAEG,QAAQ,EAAA,CAAA;sBAAhB,KAAK;gBAEG,YAAY,EAAA,CAAA;sBAApB,KAAK;gBAEG,SAAS,EAAA,CAAA;sBAAjB,KAAK;;;MEfK,kBAAkB,CAAA;;+GAAlB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAlB,kBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,kBAAkB,EAT3B,YAAA,EAAA,CAAA,qBAAqB,CAGrB,EAAA,OAAA,EAAA,CAAA,YAAY,aAGZ,qBAAqB,CAAA,EAAA,CAAA,CAAA;AAGZ,kBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,kBAAkB,YAN3B,YAAY,CAAA,EAAA,CAAA,CAAA;2FAMH,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAX9B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,YAAY,EAAE;wBACZ,qBAAqB;AACtB,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,YAAY;AACb,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,qBAAqB;AACtB,qBAAA;iBACF,CAAA;;;ACdD;;AAEG;;;;"}
package/fesm2015/enigmatry-entry-components.mjs CHANGED
@@ -1,6 +1,7 @@
1
1
  export * from '@enigmatry/entry-components/header';
2
2
  export * from '@enigmatry/entry-components/dialog';
3
3
  export * from '@enigmatry/entry-components/search-filter';
4
+ export * from '@enigmatry/entry-components/toolbar';
4
5
 
5
6
  /*
6
7
  * Public API Surface of entry-components
package/fesm2015/enigmatry-entry-components.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"enigmatry-entry-components.mjs","sources":["../../../../libs/entry-components/public-api.ts","../../../../libs/entry-components/enigmatry-entry-components.ts"],"sourcesContent":["/*\n * Public API Surface of entry-components\n */\n\nexport * from '@enigmatry/entry-components/header';\nexport * from '@enigmatry/entry-components/dialog';\nexport * from '@enigmatry/entry-components/search-filter';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;AAAA;;AAEG;;ACFH;;AAEG"}
1
+ {"version":3,"file":"enigmatry-entry-components.mjs","sources":["../../../../libs/entry-components/public-api.ts","../../../../libs/entry-components/enigmatry-entry-components.ts"],"sourcesContent":["/*\n * Public API Surface of entry-components\n */\n\nexport * from '@enigmatry/entry-components/header';\nexport * from '@enigmatry/entry-components/dialog';\nexport * from '@enigmatry/entry-components/search-filter';\nexport * from '@enigmatry/entry-components/toolbar';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;AAAA;;AAEG;;ACFH;;AAEG"}
package/fesm2020/enigmatry-entry-components-toolbar.mjs ADDED
@@ -0,0 +1,71 @@
1
+ import * as i0 from '@angular/core';
2
+ import { Component, ChangeDetectionStrategy, Input, NgModule } from '@angular/core';
3
+ import * as i1 from '@angular/common';
4
+ import { CommonModule } from '@angular/common';
5
+
6
+ /**
7
+ * Toolbar component (`<entry-toolbar>`) is used to render header section in the applications containing menu items as a content.
8
+ * It offers build in support for toolbar title or logo, while other elements need to be provided via content projection.
9
+ * On smaller screens (mobile/tablet) it switches to compact view containing menu icon button used to toggle content visibility.
10
+ *
11
+ * @example
12
+ * ```html
13
+ * <entry-toolbar
14
+ * titleUri="http://www.enigmatry.com"
15
+ * titleLogoSrc="assets/enigmatry-logo.png">
16
+ * <!-- SOME CUSTOM HTML CODE THAT RENDERS MENU ITEMS -->
17
+ * </entry-toolbar>
18
+ * ```
19
+ */
20
+ class EntryToolbarComponent {
21
+ constructor() {
22
+ /** Url to be redirected to if user click on the title (default value '/') */
23
+ this.titleUri = '/';
24
+ /** If provided, it replaces string title and renders logo image instead */
25
+ this.titleLogoSrc = undefined;
26
+ /** Used to hide the title section if not required (default value false) */
27
+ this.hideTitle = false;
28
+ this.menuOpened = false;
29
+ }
30
+ }
31
+ EntryToolbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
32
+ EntryToolbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: EntryToolbarComponent, selector: "entry-toolbar", inputs: { title: "title", titleUri: "titleUri", titleLogoSrc: "titleLogoSrc", hideTitle: "hideTitle" }, ngImport: i0, template: "<header class=\"entry-toolbar\">\n <nav class=\"entry-toolbar-nav\">\n <div class=\"entry-toolbar-data\">\n <div class=\"entry-toolbar-logo\">\n <a *ngIf=\"!hideTitle\" [href]=\"titleUri\">\n <span *ngIf=\"!titleLogoSrc\">{{title}}</span>\n <img *ngIf=\"titleLogoSrc\" [src]=\"titleLogoSrc\"/>\n </a>\n </div>\n\n <div class=\"entry-toolbar-nav-toggle\"\n (click)=\"menuOpened = !menuOpened\"\n [ngClass]=\"{'show-toolbar-icon': menuOpened === true}\">\n <i class=\"nav-toggle-menu\">\n <span class=\"icon-menu\"></span>\n </i>\n <i class=\"nav-toggle-close\">\n <span class=\"icon-close\"></span>\n </i>\n </div>\n </div>\n <span class=\"entry-toolbar-content\"\n [ngClass]=\"{'show-toolbar-content': menuOpened === true}\">\n <ng-content></ng-content>\n </span>\n </nav>\n</header>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
33
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarComponent, decorators: [{
34
+ type: Component,
35
+ args: [{ selector: 'entry-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<header class=\"entry-toolbar\">\n <nav class=\"entry-toolbar-nav\">\n <div class=\"entry-toolbar-data\">\n <div class=\"entry-toolbar-logo\">\n <a *ngIf=\"!hideTitle\" [href]=\"titleUri\">\n <span *ngIf=\"!titleLogoSrc\">{{title}}</span>\n <img *ngIf=\"titleLogoSrc\" [src]=\"titleLogoSrc\"/>\n </a>\n </div>\n\n <div class=\"entry-toolbar-nav-toggle\"\n (click)=\"menuOpened = !menuOpened\"\n [ngClass]=\"{'show-toolbar-icon': menuOpened === true}\">\n <i class=\"nav-toggle-menu\">\n <span class=\"icon-menu\"></span>\n </i>\n <i class=\"nav-toggle-close\">\n <span class=\"icon-close\"></span>\n </i>\n </div>\n </div>\n <span class=\"entry-toolbar-content\"\n [ngClass]=\"{'show-toolbar-content': menuOpened === true}\">\n <ng-content></ng-content>\n </span>\n </nav>\n</header>" }]
36
+ }], propDecorators: { title: [{
37
+ type: Input
38
+ }], titleUri: [{
39
+ type: Input
40
+ }], titleLogoSrc: [{
41
+ type: Input
42
+ }], hideTitle: [{
43
+ type: Input
44
+ }] } });
45
+
46
+ class EntryToolbarModule {
47
+ }
48
+ EntryToolbarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
49
+ EntryToolbarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarModule, declarations: [EntryToolbarComponent], imports: [CommonModule], exports: [EntryToolbarComponent] });
50
+ EntryToolbarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarModule, imports: [CommonModule] });
51
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EntryToolbarModule, decorators: [{
52
+ type: NgModule,
53
+ args: [{
54
+ declarations: [
55
+ EntryToolbarComponent
56
+ ],
57
+ imports: [
58
+ CommonModule
59
+ ],
60
+ exports: [
61
+ EntryToolbarComponent
62
+ ]
63
+ }]
64
+ }] });
65
+
66
+ /**
67
+ * Generated bundle index. Do not edit.
68
+ */
69
+
70
+ export { EntryToolbarComponent, EntryToolbarModule };
71
+ //# sourceMappingURL=enigmatry-entry-components-toolbar.mjs.map
package/fesm2020/enigmatry-entry-components-toolbar.mjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"enigmatry-entry-components-toolbar.mjs","sources":["../../../../libs/entry-components/toolbar/entry-toolbar.component.ts","../../../../libs/entry-components/toolbar/entry-toolbar.component.html","../../../../libs/entry-components/toolbar/entry-toolbar.module.ts","../../../../libs/entry-components/toolbar/enigmatry-entry-components-toolbar.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Input } from '@angular/core';\n\n/**\n * Toolbar component (`<entry-toolbar>`) is used to render header section in the applications containing menu items as a content.\n * It offers build in support for toolbar title or logo, while other elements need to be provided via content projection.\n * On smaller screens (mobile/tablet) it switches to compact view containing menu icon button used to toggle content visibility.\n *\n * @example\n * ```html\n * <entry-toolbar\n * titleUri=\"http://www.enigmatry.com\"\n * titleLogoSrc=\"assets/enigmatry-logo.png\">\n * <!-- SOME CUSTOM HTML CODE THAT RENDERS MENU ITEMS -->\n * </entry-toolbar>\n * ```\n */\n@Component({\n selector: 'entry-toolbar',\n templateUrl: './entry-toolbar.component.html',\n styleUrls: ['./entry-toolbar.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class EntryToolbarComponent {\n /** Toolbar title positioned in the left side */\n @Input() title: string;\n /** Url to be redirected to if user click on the title (default value '/') */\n @Input() titleUri = '/';\n /** If provided, it replaces string title and renders logo image instead */\n @Input() titleLogoSrc: string | undefined = undefined;\n /** Used to hide the title section if not required (default value false) */\n @Input() hideTitle = false;\n\n menuOpened = false;\n}\n","<header class=\"entry-toolbar\">\n <nav class=\"entry-toolbar-nav\">\n <div class=\"entry-toolbar-data\">\n <div class=\"entry-toolbar-logo\">\n <a *ngIf=\"!hideTitle\" [href]=\"titleUri\">\n <span *ngIf=\"!titleLogoSrc\">{{title}}</span>\n <img *ngIf=\"titleLogoSrc\" [src]=\"titleLogoSrc\"/>\n </a>\n </div>\n\n <div class=\"entry-toolbar-nav-toggle\"\n (click)=\"menuOpened = !menuOpened\"\n [ngClass]=\"{'show-toolbar-icon': menuOpened === true}\">\n <i class=\"nav-toggle-menu\">\n <span class=\"icon-menu\"></span>\n </i>\n <i class=\"nav-toggle-close\">\n <span class=\"icon-close\"></span>\n </i>\n </div>\n </div>\n <span class=\"entry-toolbar-content\"\n [ngClass]=\"{'show-toolbar-content': menuOpened === true}\">\n <ng-content></ng-content>\n </span>\n </nav>\n</header>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { EntryToolbarComponent } from './entry-toolbar.component';\n\n@NgModule({\n declarations: [\n EntryToolbarComponent\n ],\n imports: [\n CommonModule\n ],\n exports: [\n EntryToolbarComponent\n ]\n})\nexport class EntryToolbarModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;AAEA;;;;;;;;;;;;;AAaG;MAOU,qBAAqB,CAAA;AANlC,IAAA,WAAA,GAAA;;QAUW,IAAQ,CAAA,QAAA,GAAG,GAAG,CAAC;;QAEf,IAAY,CAAA,YAAA,GAAuB,SAAS,CAAC;;QAE7C,IAAS,CAAA,SAAA,GAAG,KAAK,CAAC;QAE3B,IAAU,CAAA,UAAA,GAAG,KAAK,CAAC;AACpB,KAAA;;kHAXY,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAArB,qBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,qBAAqB,6JCtBlC,yjCA0BS,EAAA,MAAA,EAAA,CAAA,EAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;2FDJI,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBANjC,SAAS;+BACE,eAAe,EAAA,eAAA,EAGR,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,yjCAAA,EAAA,CAAA;8BAItC,KAAK,EAAA,CAAA;sBAAb,KAAK;gBAEG,QAAQ,EAAA,CAAA;sBAAhB,KAAK;gBAEG,YAAY,EAAA,CAAA;sBAApB,KAAK;gBAEG,SAAS,EAAA,CAAA;sBAAjB,KAAK;;;MEfK,kBAAkB,CAAA;;+GAAlB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAlB,kBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,kBAAkB,EAT3B,YAAA,EAAA,CAAA,qBAAqB,CAGrB,EAAA,OAAA,EAAA,CAAA,YAAY,aAGZ,qBAAqB,CAAA,EAAA,CAAA,CAAA;AAGZ,kBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,kBAAkB,YAN3B,YAAY,CAAA,EAAA,CAAA,CAAA;2FAMH,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAX9B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,YAAY,EAAE;wBACZ,qBAAqB;AACtB,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,YAAY;AACb,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,qBAAqB;AACtB,qBAAA;AACF,iBAAA,CAAA;;;ACdD;;AAEG;;;;"}
package/fesm2020/enigmatry-entry-components.mjs CHANGED
@@ -1,6 +1,7 @@
1
1
  export * from '@enigmatry/entry-components/header';
2
2
  export * from '@enigmatry/entry-components/dialog';
3
3
  export * from '@enigmatry/entry-components/search-filter';
4
+ export * from '@enigmatry/entry-components/toolbar';
4
5
 
5
6
  /*
6
7
  * Public API Surface of entry-components
package/fesm2020/enigmatry-entry-components.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"enigmatry-entry-components.mjs","sources":["../../../../libs/entry-components/public-api.ts","../../../../libs/entry-components/enigmatry-entry-components.ts"],"sourcesContent":["/*\n * Public API Surface of entry-components\n */\n\nexport * from '@enigmatry/entry-components/header';\nexport * from '@enigmatry/entry-components/dialog';\nexport * from '@enigmatry/entry-components/search-filter';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;AAAA;;AAEG;;ACFH;;AAEG"}
1
+ {"version":3,"file":"enigmatry-entry-components.mjs","sources":["../../../../libs/entry-components/public-api.ts","../../../../libs/entry-components/enigmatry-entry-components.ts"],"sourcesContent":["/*\n * Public API Surface of entry-components\n */\n\nexport * from '@enigmatry/entry-components/header';\nexport * from '@enigmatry/entry-components/dialog';\nexport * from '@enigmatry/entry-components/search-filter';\nexport * from '@enigmatry/entry-components/toolbar';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;AAAA;;AAEG;;ACFH;;AAEG"}
package/header/README.md CHANGED
@@ -8,6 +8,16 @@ Simple way of providing header layout and styling for the page or section header
8
8
  import { EntryHeaderModule } from '@enigmatry/entry-components/entry-header';
9
9
  ```
10
10
 
11
+ Styles import:
12
+
13
+ ```css
14
+ @use '@enigmatry/entry-components/styles/generate' as entry;
15
+
16
+ @include entry.generate(APP_THEME, APP_TYPOGRAPHY);
17
+ ```
18
+
19
+ Where `APP_THEME` represents application theming configuration, while `APP_TYPOGRAPHY` represents application fonts configuration.
20
+
11
21
  ## Basic usage
12
22
 
13
23
  `entry-header` is used to provide standard layout and styles:
package/header/styles/modules/components/buttons/_general.scss CHANGED
@@ -1,5 +1,5 @@
1
1
  @use '@enigmatry/scss-foundation/src/modules/map';
2
- @use '../../states/hover';
2
+ @use '../../../../../styles/modules/states/hover';
3
3
 
4
4
  @mixin generate-buttons-from($theme) {
5
5
  .button-primary {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@enigmatry/entry-components",
3
- "version": "1.2.81",
3
+ "version": "1.2.83",
4
4
  "author": "Enigmatry",
5
5
  "description": "Enigmatry entry angular material components",
6
6
  "homepage": "https://github.com/enigmatry/entry-angular-building-blocks/tree/master/libs/entry-components#readme",
@@ -63,6 +63,14 @@
63
63
  "es2015": "./fesm2015/enigmatry-entry-components-search-filter.mjs",
64
64
  "node": "./fesm2015/enigmatry-entry-components-search-filter.mjs",
65
65
  "default": "./fesm2020/enigmatry-entry-components-search-filter.mjs"
66
+ },
67
+ "./toolbar": {
68
+ "types": "./toolbar/index.d.ts",
69
+ "esm2020": "./esm2020/toolbar/enigmatry-entry-components-toolbar.mjs",
70
+ "es2020": "./fesm2020/enigmatry-entry-components-toolbar.mjs",
71
+ "es2015": "./fesm2015/enigmatry-entry-components-toolbar.mjs",
72
+ "node": "./fesm2015/enigmatry-entry-components-toolbar.mjs",
73
+ "default": "./fesm2020/enigmatry-entry-components-toolbar.mjs"
66
74
  }
67
75
  },
68
76
  "sideEffects": false
package/public-api.d.ts CHANGED
@@ -1,3 +1,4 @@
1
1
  export * from '@enigmatry/entry-components/header';
2
2
  export * from '@enigmatry/entry-components/dialog';
3
3
  export * from '@enigmatry/entry-components/search-filter';
4
+ export * from '@enigmatry/entry-components/toolbar';
package/search-filter/README.md CHANGED
@@ -1,6 +1,6 @@
1
1
  # Entry Search Filter
2
2
 
3
- Entry component for providing standard filtering capabilities that can be consumed by entry-table component, but also any other list data represetation component like Angular material table component.
3
+ Entry component for providing standard filtering capabilities that can be consumed by entry-table component, but also any other list data representation component like Angular material table component.
4
4
 
5
5
  ## Imports
6
6
 
@@ -8,6 +8,16 @@ Entry component for providing standard filtering capabilities that can be consum
8
8
  import { EntrySearchFilterModule } from '@enigmatry/entry-components/search-filter';
9
9
  ```
10
10
 
11
+ Styles import:
12
+
13
+ ```css
14
+ @use '@enigmatry/entry-components/styles/generate' as entry;
15
+
16
+ @include entry.generate(APP_THEME, APP_TYPOGRAPHY);
17
+ ```
18
+
19
+ Where `APP_THEME` represents application theming configuration, while `APP_TYPOGRAPHY` represents application fonts configuration.
20
+
11
21
  ## Basic usage
12
22
 
13
23
  `entry-search-filter` is used to provide simple configuration and usage of data filtering:
package/styles/_generate.scss CHANGED
@@ -2,6 +2,8 @@
2
2
  @use '../dialog/styles/partials/main.scss' as dialogPartials;
3
3
  @use '../header/styles/modules/generator' as header;
4
4
  @use '../header/styles/partials/main.scss' as headerPartials;
5
+ @use '../toolbar/styles/modules/generate' as toolbar;
6
+ @use '../toolbar/styles/partials/main.scss' as toolbarPartials;
5
7
  @use './modules/generate' as modules;
6
8
  @use 'sass:map';
7
9
 
@@ -9,4 +11,5 @@
9
11
  @include modules.generate($font-config);
10
12
  @include dialog.generate(map.get($theme, dialog));
11
13
  @include header.generate(map.get($theme, header));
14
+ @include toolbar.generate(map.get($theme, toolbar));
12
15
  }
package/{dialog/styles → styles}/modules/states/_hover.scss RENAMED
@@ -1,4 +1,4 @@
1
- @use '../../../../styles/modules/variables' as vars;
1
+ @use '../variables' as vars;
2
2
 
3
3
  // TODO: remove this once implemented https://jira.enigmatry.com/browse/ETL-484
4
4
  @mixin default($default: vars.$accent, $hover: vars.$body-font-color) {
@@ -9,11 +9,19 @@
9
9
  color: $hover;
10
10
  }
11
11
 
12
- // Had to be done this way since at least Chrome isn't triggering ontouchend on mobile so hover state remains.
12
+ // Had to be done this way since at least Chrome isn't triggering on-touch-end on mobile so hover state remains.
13
13
  /* stylelint-disable-next-line at-rule-allowed-list, media-feature-name-allowed-list */
14
14
  @media (hover: hover) {
15
15
  &:hover {
16
16
  color: $hover;
17
17
  }
18
18
  }
19
+ }
20
+
21
+ @mixin background-hover($regular-background, $hover-background) {
22
+ background-color: $regular-background;
23
+
24
+ &:hover {
25
+ background-color: $hover-background;
26
+ }
19
27
  }
package/styles/modules/theming/_default-theming.scss CHANGED
@@ -1,7 +1,9 @@
1
1
  @use '../../../dialog/styles/modules/theming/default-theming' as dialogTheme;
2
2
  @use '../../../header/styles/modules/theming/default-theming' as headerTheme;
3
+ @use '../../../toolbar/styles/modules/theming/default-theming' as toolbarTheme;
3
4
 
4
5
  $theme: (
5
6
  header: headerTheme.$theme,
6
- dialog: dialogTheme.$theme
7
+ dialog: dialogTheme.$theme,
8
+ toolbar: toolbarTheme.$theme
7
9
  );
package/styles/modules/typography/_fonts.scss CHANGED
@@ -60,6 +60,10 @@
60
60
  .icon-close::before {
61
61
  content: '\e900';
62
62
  }
63
+
64
+ .icon-menu:before {
65
+ content: "\e9bd";
66
+ }
63
67
  }
64
68
 
65
69
  // TODO: Hardcoded mixins (currently not ins use) that should be configurable!
package/toolbar/README.md ADDED
@@ -0,0 +1,33 @@
1
+ # Entry Toolbar
2
+
3
+ Toolbar component (`<entry-toolbar>`) is used as a header section in the applications. It offers built-in support for title or logo on the left side, while other elements, like menu items, must be provided via content projection. The component is responsive in a way that on smaller screens (mobile/tablet) switches to _the compact view_ containing menu icon button used to toggle content visibility.
4
+
5
+ ## Imports
6
+
7
+ ```ts
8
+ import { EntryDialogModule } from '@enigmatry/entry-components/toolbar';
9
+ ```
10
+
11
+ Styles import:
12
+
13
+ ```css
14
+ @use '@enigmatry/entry-components/styles/generate' as entry;
15
+
16
+ @include entry.generate(APP_THEME, APP_TYPOGRAPHY);
17
+ ```
18
+
19
+ Where `APP_THEME` represents application theming configuration, while `APP_TYPOGRAPHY` represents application fonts configuration.
20
+
21
+ ## Basic usage
22
+
23
+ ```html
24
+ <entry-toolbar
25
+ title="Food & Drinks"
26
+ titleUri="http://food-n-drinks.com">
27
+ <ul>
28
+ <li>Meals</li>
29
+ <li>Order</li>
30
+ <li>About</li>
31
+ </ul>
32
+ </entry-toolbar>
33
+ ```
package/toolbar/entry-toolbar.component.d.ts ADDED
@@ -0,0 +1,28 @@
1
+ import * as i0 from "@angular/core";
2
+ /**
3
+ * Toolbar component (`<entry-toolbar>`) is used to render header section in the applications containing menu items as a content.
4
+ * It offers build in support for toolbar title or logo, while other elements need to be provided via content projection.
5
+ * On smaller screens (mobile/tablet) it switches to compact view containing menu icon button used to toggle content visibility.
6
+ *
7
+ * @example
8
+ * ```html
9
+ * <entry-toolbar
10
+ * titleUri="http://www.enigmatry.com"
11
+ * titleLogoSrc="assets/enigmatry-logo.png">
12
+ * <!-- SOME CUSTOM HTML CODE THAT RENDERS MENU ITEMS -->
13
+ * </entry-toolbar>
14
+ * ```
15
+ */
16
+ export declare class EntryToolbarComponent {
17
+ /** Toolbar title positioned in the left side */
18
+ title: string;
19
+ /** Url to be redirected to if user click on the title (default value '/') */
20
+ titleUri: string;
21
+ /** If provided, it replaces string title and renders logo image instead */
22
+ titleLogoSrc: string | undefined;
23
+ /** Used to hide the title section if not required (default value false) */
24
+ hideTitle: boolean;
25
+ menuOpened: boolean;
26
+ static ɵfac: i0.ɵɵFactoryDeclaration<EntryToolbarComponent, never>;
27
+ static ɵcmp: i0.ɵɵComponentDeclaration<EntryToolbarComponent, "entry-toolbar", never, { "title": "title"; "titleUri": "titleUri"; "titleLogoSrc": "titleLogoSrc"; "hideTitle": "hideTitle"; }, {}, never, ["*"], false>;
28
+ }
package/toolbar/entry-toolbar.module.d.ts ADDED
@@ -0,0 +1,8 @@
1
+ import * as i0 from "@angular/core";
2
+ import * as i1 from "./entry-toolbar.component";
3
+ import * as i2 from "@angular/common";
4
+ export declare class EntryToolbarModule {
5
+ static ɵfac: i0.ɵɵFactoryDeclaration<EntryToolbarModule, never>;
6
+ static ɵmod: i0.ɵɵNgModuleDeclaration<EntryToolbarModule, [typeof i1.EntryToolbarComponent], [typeof i2.CommonModule], [typeof i1.EntryToolbarComponent]>;
7
+ static ɵinj: i0.ɵɵInjectorDeclaration<EntryToolbarModule>;
8
+ }
package/toolbar/index.d.ts ADDED
@@ -0,0 +1,5 @@
1
+ /**
2
+ * Generated bundle index. Do not edit.
3
+ */
4
+ /// <amd-module name="@enigmatry/entry-components/toolbar" />
5
+ export * from './public-api';
package/toolbar/public-api.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ export { EntryToolbarComponent } from './entry-toolbar.component';
2
+ export { EntryToolbarModule } from './entry-toolbar.module';
package/toolbar/styles/modules/_generate.scss ADDED
@@ -0,0 +1,10 @@
1
+ @use 'sass:map';
2
+ @use 'theming/default-theming' as default;
3
+ @use 'components/toolbar/general' as toolbar;
4
+
5
+ $default-theme: default.$theme;
6
+
7
+ @mixin generate($custom-theme: ()) {
8
+ $merged-theme: map.deep-merge($default-theme, $custom-theme);
9
+ @include toolbar.generate($merged-theme);
10
+ }
package/toolbar/styles/modules/components/toolbar/_general.scss ADDED
@@ -0,0 +1,34 @@
1
+ @use '@enigmatry/scss-foundation/src/modules/map';
2
+ @use '../../../../../styles/modules/variables' as vars;
3
+ @use '../../../../../styles/modules/states/hover' as hover;
4
+
5
+ @mixin generate($theme) {
6
+ .entry-toolbar {
7
+ background-color: map.value-from($theme, 'background');
8
+
9
+ .entry-toolbar-nav {
10
+ height: map.value-from($theme, 'height');
11
+
12
+ .entry-toolbar-logo {
13
+ a {
14
+ color: map.value-from($theme, 'title-color');
15
+ @include hover.default(
16
+ map.value-from($theme, 'title-color'),
17
+ map.value-from($theme, 'title-hover-color'));
18
+
19
+ img {
20
+ height: map.value-from($theme, 'height');
21
+ }
22
+ }
23
+ }
24
+
25
+ .entry-toolbar-nav-toggle {
26
+ .nav-toggle-menu, .nav-toggle-close {
27
+ @include hover.default(
28
+ map.value-from($theme, 'title-color'),
29
+ map.value-from($theme, 'title-hover-color'));
30
+ }
31
+ }
32
+ }
33
+ }
34
+ }
package/toolbar/styles/modules/theming/_default-theming.scss ADDED
@@ -0,0 +1,8 @@
1
+ @use '../../../../styles/modules/variables' as vars;
2
+
3
+ $theme: (
4
+ background: vars.$primary-lightest,
5
+ height: 56px,
6
+ title-color: vars.$primary,
7
+ title-hover-color: vars.$accent
8
+ );
package/toolbar/styles/partials/core/_index.scss ADDED
@@ -0,0 +1 @@
1
+ @use 'components';
package/toolbar/styles/partials/core/components/_index.scss ADDED
@@ -0,0 +1 @@
1
+ @use 'toolbar';
package/toolbar/styles/partials/core/components/toolbar/_general.scss ADDED
@@ -0,0 +1,100 @@
1
+ .entry-toolbar {
2
+ top: 0;
3
+ left: 0;
4
+ width: 100%;
5
+ box-shadow: 0 2px 8px hsla(220, 68%, 12%, 0.1);
6
+
7
+ .entry-toolbar-nav {
8
+ margin: 10px;
9
+
10
+ .entry-toolbar-data {
11
+ height: 100%;
12
+ display: flex;
13
+ justify-content: space-between;
14
+ align-items: center;
15
+
16
+ .entry-toolbar-logo {
17
+ display: inline-flex;
18
+ align-items: center;
19
+ column-gap: 0.25rem;
20
+
21
+ a {
22
+ text-decoration: none;
23
+ font-weight: 600;
24
+ transition: color 0.3s;
25
+
26
+ img {
27
+ display: block;
28
+ }
29
+ }
30
+ }
31
+
32
+ .entry-toolbar-nav-toggle {
33
+ position: relative;
34
+ width: 32px;
35
+ height: 32px;
36
+
37
+ .nav-toggle-menu,
38
+ .nav-toggle-close {
39
+ font-size: 1.25rem;
40
+ position: absolute;
41
+ display: grid;
42
+ place-items: center;
43
+ inset: 0;
44
+ cursor: pointer;
45
+ transition: opacity 0.1s, transform 0.4s;
46
+ }
47
+
48
+ .nav-toggle-close {
49
+ opacity: 0;
50
+ }
51
+ }
52
+
53
+ .show-toolbar-icon .nav-toggle-menu {
54
+ opacity: 0;
55
+ transform: rotate(90deg);
56
+ }
57
+
58
+ .show-toolbar-icon .nav-toggle-close {
59
+ opacity: 1;
60
+ transform: rotate(90deg);
61
+ }
62
+ }
63
+ }
64
+ }
65
+
66
+ .entry-toolbar-content {
67
+ &.show-toolbar-content {
68
+ opacity: 1;
69
+ top: 3.5rem;
70
+ pointer-events: initial;
71
+ }
72
+ }
73
+
74
+ // TODO: do this properly with connection to _breakpoints.scss. Move it to modules/ maybe?
75
+ // Big screen
76
+ @media screen and (min-width: 1118px) {
77
+ .entry-toolbar-nav {
78
+ height: calc(var(--header-height) + 2rem);
79
+ display: flex;
80
+ justify-content: space-between;
81
+ }
82
+
83
+ .entry-toolbar-nav-toggle {
84
+ display: none;
85
+ }
86
+
87
+ .entry-toolbar-nav li {
88
+ display: flex;
89
+ }
90
+
91
+ .entry-toolbar-content {
92
+ opacity: 1;
93
+ }
94
+ }
95
+ // Small screen
96
+ @media screen and (max-width: 1118px) {
97
+ .entry-toolbar-content {
98
+ opacity: 0;
99
+ }
100
+ }
package/toolbar/styles/partials/main.scss ADDED
@@ -0,0 +1 @@
1
+ @use 'core';
package/header/styles/modules/states/_hover.scss DELETED
@@ -1,7 +0,0 @@
1
- @mixin background-hover($regular-background, $hover-background) {
2
- background-color: $regular-background;
3
-
4
- &:hover {
5
- background-color: $hover-background;
6
- }
7
- }