@lukfel/ng-scaffold 22.1.13 → 22.1.14

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 (5) hide show
  1. package/fesm2022/lukfel-ng-scaffold.mjs +30 -8
  2. package/fesm2022/lukfel-ng-scaffold.mjs.map +1 -1
  3. package/package.json +1 -1
  4. package/styles/_variables.scss +76 -75
  5. package/types/lukfel-ng-scaffold.d.ts +21 -16
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lukfel/ng-scaffold",
3
- "version": "22.1.13",
3
+ "version": "22.1.14",
4
4
  "description": "This Angular library provides a basic UI scaffold and services for modern web and mobile apps",
5
5
  "license": "MIT",
6
6
  "author": {
package/styles/_variables.scss CHANGED
@@ -1,75 +1,76 @@
1
- :root {
2
- --transition: 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
3
- --border-radius: var(--mat-sys-corner-medium, 4px);
4
-
5
- --loading-overlay-z-index: 1001;
6
-
7
- --header-z-index: 100;
8
- --header-height: 64px;
9
- --header-logo-title-wrapper-max-width: 480px;
10
- --header-logo-size: 40px;
11
- --header-title-font-size: 20px;
12
- --header-subtitle-font-size: 12px;
13
- --header-input-max-width: 480px;
14
- --header-input-border-radius: 28px;
15
- --header-menu-button-max-width: 144px;
16
- --header-menu-img-size: 48px;
17
-
18
- --navbar-z-index: 99;
19
- --navbar-height: 72px;
20
- --navbar-height-mobile: 56px;
21
- --navbar-width: 72px;
22
- --navbar-padding: 4px;
23
- --navbar-item-border-radius: 16px;
24
- --navbar-item-label-font-size: 12px;
25
-
26
- --content-padding: 24px;
27
- --content-padding-mobile: 16px;
28
-
29
- --drawer-width: 208px;
30
- --drawer-z-index: 97;
31
- --drawer-z-index-mobile: 100;
32
-
33
- --footer-height: 100px;
34
- --footer-logo-size: 96px;
35
- --footer-font-size: 12px;
36
-
37
- --content-title-card-z-index: 98;
38
- --content-title-card-height: 80px;
39
- --content-title-card-label-font-size: 24px;
40
- --content-title-card-label-font-size-mobile: 18px;
41
-
42
- --floating-button-z-index: 100;
43
- --floating-button-right: 24px;
44
- --floating-button-bottom: 24px;
45
- --floating-button-min-width: 56px;
46
- --floating-button-label-max-width: 256px;
47
- --floating-button-label-font-size: 16px;
48
-
49
- --bottom-bar-z-index: 98;
50
- --bottom-bar-height: 56px;
51
- --bottom-bar-font-size: 16px;
52
-
53
- --placeholder-icon-size: 96px;
54
- --placeholder-title-font-size: 20px;
55
- --placeholder-message-font-size: 16px;
56
-
57
- --list-item-height: 72px;
58
- --list-item-border-radius: var(--border-radius);
59
- --list-item-sort-icon-size: 16px;
60
- --list-item-avatar-size: 48px;
61
- --list-item-title-width: 200px;
62
- --list-item-title-wrapper-width: 80px;
63
- --list-item-checkbox-width: 40px;
64
-
65
- --notification-max-width: 50vw;
66
- --notification-min-width: 384px;
67
- --notification-min-height: 48px;
68
- --notification-fixed-margin: 24px;
69
- --notification-static-margin: 0 0 16px 0;
70
- --notification-padding: 16px 16px;
71
- --notification-padding-minimal: 8px 16px;
72
- --notification-font-size: 14px;
73
-
74
- --color-gray: rgba(128, 128, 128, 0.8);
75
- }
1
+ :root {
2
+ --transition: 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
3
+ --border-radius: var(--mat-sys-corner-medium, 4px);
4
+
5
+ --loading-overlay-z-index: 1001;
6
+
7
+ --header-z-index: 100;
8
+ --header-height: 64px;
9
+ --header-logo-title-wrapper-max-width: 480px;
10
+ --header-logo-size: 40px;
11
+ --header-title-font-size: 20px;
12
+ --header-subtitle-font-size: 12px;
13
+ --header-input-max-width: 480px;
14
+ --header-input-border-radius: 28px;
15
+ --header-menu-button-max-width: 144px;
16
+ --header-menu-img-size: 48px;
17
+
18
+ --navbar-z-index: 99;
19
+ --navbar-height: 72px;
20
+ --navbar-height-mobile: 56px;
21
+ --navbar-width: 72px;
22
+ --navbar-padding: 4px;
23
+ --navbar-item-border-radius: 16px;
24
+ --navbar-item-label-font-size: 12px;
25
+
26
+ --content-padding: 24px;
27
+ --content-padding-mobile: 16px;
28
+
29
+ --drawer-width: 208px;
30
+ --drawer-z-index: 97;
31
+ --drawer-z-index-mobile: 100;
32
+
33
+ --footer-height: 100px;
34
+ --footer-logo-size: 96px;
35
+ --footer-font-size: 12px;
36
+
37
+ --content-title-card-z-index: 98;
38
+ --content-title-card-height: 80px;
39
+ --content-title-card-label-font-size: 24px;
40
+ --content-title-card-label-font-size-mobile: 18px;
41
+
42
+ --floating-button-z-index: 100;
43
+ --floating-button-right: 24px;
44
+ --floating-button-bottom: 24px;
45
+ --floating-button-snackbar-offset: 56px; // Snackbar surface plus its container margin
46
+ --floating-button-min-width: 56px;
47
+ --floating-button-label-max-width: 256px;
48
+ --floating-button-label-font-size: 16px;
49
+
50
+ --bottom-bar-z-index: 98;
51
+ --bottom-bar-height: 56px;
52
+ --bottom-bar-font-size: 16px;
53
+
54
+ --placeholder-icon-size: 96px;
55
+ --placeholder-title-font-size: 20px;
56
+ --placeholder-message-font-size: 16px;
57
+
58
+ --list-item-height: 72px;
59
+ --list-item-border-radius: var(--border-radius);
60
+ --list-item-sort-icon-size: 16px;
61
+ --list-item-avatar-size: 48px;
62
+ --list-item-title-width: 200px;
63
+ --list-item-title-wrapper-width: 80px;
64
+ --list-item-checkbox-width: 40px;
65
+
66
+ --notification-max-width: 50vw;
67
+ --notification-min-width: 384px;
68
+ --notification-min-height: 48px;
69
+ --notification-fixed-margin: 24px;
70
+ --notification-static-margin: 0 0 16px 0;
71
+ --notification-padding: 16px 16px;
72
+ --notification-padding-minimal: 8px 16px;
73
+ --notification-font-size: 14px;
74
+
75
+ --color-gray: rgba(128, 128, 128, 0.8);
76
+ }
package/types/lukfel-ng-scaffold.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as _angular_core from '@angular/core';
2
- import { InjectionToken, EnvironmentProviders, ElementRef, TemplateRef, Type, Signal } from '@angular/core';
2
+ import { InjectionToken, EnvironmentProviders, Signal, ElementRef, TemplateRef, Type } from '@angular/core';
3
3
  import { ComponentType, ComponentPortal, TemplatePortal } from '@angular/cdk/portal';
4
4
  import { CdkDragDrop } from '@angular/cdk/drag-drop';
5
5
  import { MatCheckboxChange } from '@angular/material/checkbox';
@@ -251,33 +251,35 @@ declare class ScaffoldComponent {
251
251
  libraryConfig: ScaffoldLibraryConfig | null;
252
252
  private scaffoldService;
253
253
  private breakpointService;
254
+ private snackbarService;
254
255
  private routerService;
255
256
  private overlayService;
256
257
  private route;
257
258
  private document;
258
259
  private logger;
259
260
  private destroyRef;
260
- readonly scrollContainer: _angular_core.Signal<ElementRef<any> | undefined>;
261
- readonly content: _angular_core.Signal<ElementRef<any> | undefined>;
261
+ readonly scrollContainer: Signal<ElementRef<any> | undefined>;
262
+ readonly content: Signal<ElementRef<any> | undefined>;
262
263
  readonly headerButtonClickEvent: _angular_core.OutputEmitterRef<string>;
263
264
  readonly headerInputSubmitEvent: _angular_core.OutputEmitterRef<string>;
264
265
  readonly headerInputChangeEvent: _angular_core.OutputEmitterRef<string>;
265
266
  readonly navbarButtonClickEvent: _angular_core.OutputEmitterRef<string>;
266
267
  readonly floatingButtonClickEvent: _angular_core.OutputEmitterRef<string>;
267
268
  readonly bottomBarButtonClickEvent: _angular_core.OutputEmitterRef<string>;
268
- scaffoldConfig: _angular_core.Signal<ScaffoldConfig | null>;
269
- headerConfig: _angular_core.Signal<HeaderConfig | null>;
270
- navbarConfig: _angular_core.Signal<NavbarConfig | null>;
271
- drawerConfig: _angular_core.Signal<DrawerConfig | null>;
272
- drawerPortal: _angular_core.Signal<ComponentPortal<unknown> | TemplatePortal<unknown> | null | undefined>;
273
- footerConfig: _angular_core.Signal<FooterConfig | null>;
274
- contentTitleCardConfig: _angular_core.Signal<ContentTitleCardConfig | null>;
275
- floatingButtonConfig: _angular_core.Signal<FloatingButtonConfig | null>;
276
- bottomBarConfig: _angular_core.Signal<BottomBarConfig | null>;
277
- routeHistory: _angular_core.Signal<string[] | undefined>;
278
- currentRoute: _angular_core.Signal<string | undefined>;
279
- routeLoading: _angular_core.Signal<boolean | undefined>;
280
- isMobile: _angular_core.Signal<boolean | undefined>;
269
+ scaffoldConfig: Signal<ScaffoldConfig | null>;
270
+ headerConfig: Signal<HeaderConfig | null>;
271
+ navbarConfig: Signal<NavbarConfig | null>;
272
+ drawerConfig: Signal<DrawerConfig | null>;
273
+ drawerPortal: Signal<ComponentPortal<unknown> | TemplatePortal<unknown> | null | undefined>;
274
+ footerConfig: Signal<FooterConfig | null>;
275
+ contentTitleCardConfig: Signal<ContentTitleCardConfig | null>;
276
+ floatingButtonConfig: Signal<FloatingButtonConfig | null>;
277
+ bottomBarConfig: Signal<BottomBarConfig | null>;
278
+ bottomSnackbarOpen: Signal<boolean>;
279
+ routeHistory: Signal<string[] | undefined>;
280
+ currentRoute: Signal<string | undefined>;
281
+ routeLoading: Signal<boolean | undefined>;
282
+ isMobile: Signal<boolean | undefined>;
281
283
  scrollTopPosition: _angular_core.WritableSignal<number>;
282
284
  initialized: _angular_core.WritableSignal<boolean>;
283
285
  private fragmentAnimationFrameId;
@@ -668,8 +670,11 @@ declare class SnackbarService {
668
670
  private readonly SNACKBAR_POSITION_VERTICAL;
669
671
  private readonly actionConfig;
670
672
  private readonly defaultConfig;
673
+ private readonly bottomOpenCount;
674
+ readonly bottomSnackbarOpen: Signal<boolean>;
671
675
  openSnackbar(message: string, closeLabel?: string, config?: MatSnackBarConfig): void;
672
676
  openSnackbarWithAction(message: string, action: string, config?: MatSnackBarConfig): Promise<void>;
677
+ private track;
673
678
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SnackbarService, never>;
674
679
  static ɵprov: _angular_core.ɵɵInjectableDeclaration<SnackbarService>;
675
680
  }