@rolatech/angular-components 17.2.14 → 17.2.16

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 (40) hide show
  1. package/esm2022/index.mjs +2 -1
  2. package/esm2022/lib/angular-components.module.mjs +4 -4
  3. package/esm2022/lib/app-container/app-container.component.mjs +3 -3
  4. package/esm2022/lib/app-container-content/app-container-content.component.mjs +3 -3
  5. package/esm2022/lib/app-drawer/app-drawer.component.mjs +9 -15
  6. package/esm2022/lib/app-footer/app-footer.component.mjs +3 -3
  7. package/esm2022/lib/app-layout/app-layout.component.mjs +18 -16
  8. package/esm2022/lib/app-page/app-page.component.mjs +3 -3
  9. package/esm2022/lib/confirmation-dialog/confirmation-dialog.component.mjs +3 -3
  10. package/esm2022/lib/console-layout/console-layout.component.mjs +3 -3
  11. package/esm2022/lib/folder/folder.component.mjs +3 -3
  12. package/esm2022/lib/icon/icon.component.mjs +3 -3
  13. package/esm2022/lib/icon-button/icon-button.component.mjs +3 -3
  14. package/esm2022/lib/loading-spinner/loading-spinner.component.mjs +3 -3
  15. package/esm2022/lib/material.module.mjs +4 -4
  16. package/esm2022/lib/media-list/media-list.component.mjs +3 -3
  17. package/esm2022/lib/media-list-item/media-list-item.component.mjs +3 -3
  18. package/esm2022/lib/media-preview-dialog/media-preview-dialog.component.mjs +3 -3
  19. package/esm2022/lib/media-upload/media-upload.component.mjs +3 -3
  20. package/esm2022/lib/media-upload-dialog/media-upload-dialog.component.mjs +3 -3
  21. package/esm2022/lib/menu-user/menu-user.component.mjs +3 -3
  22. package/esm2022/lib/not-found/not-found.component.mjs +3 -3
  23. package/esm2022/lib/spacer/spacer.component.mjs +3 -3
  24. package/esm2022/lib/storage-bucket-create/storage-bucket-create.component.mjs +3 -3
  25. package/esm2022/lib/storage-file-upload/storage-file-upload.component.mjs +3 -3
  26. package/esm2022/lib/storage-folder-create/storage-folder-create.component.mjs +3 -3
  27. package/esm2022/lib/title/title.component.mjs +3 -3
  28. package/esm2022/lib/topbar/topbar.component.mjs +11 -16
  29. package/esm2022/lib/topbar-avatar-menu/topbar-avatar-menu.component.mjs +3 -3
  30. package/esm2022/lib/wechat-connect-dialog/wechat-connect-dialog.component.mjs +3 -3
  31. package/esm2022/provider.mjs +12 -0
  32. package/fesm2022/rolatech-angular-components.mjs +122 -123
  33. package/fesm2022/rolatech-angular-components.mjs.map +1 -1
  34. package/index.d.ts +1 -0
  35. package/lib/app-drawer/app-drawer.component.d.ts +3 -4
  36. package/lib/app-layout/app-layout.component.d.ts +9 -7
  37. package/lib/topbar/topbar.component.d.ts +5 -4
  38. package/package.json +1 -1
  39. package/provider.d.ts +16 -0
  40. package/themes/_default.scss +1 -1
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Component, ViewEncapsulation, HostBinding, EventEmitter, inject, ElementRef, Renderer2, PLATFORM_ID, Input, Output, viewChild, ViewChild, ContentChild, Inject, NgModule, ChangeDetectorRef, HostListener } from '@angular/core';
2
+ import { Component, ViewEncapsulation, HostBinding, InjectionToken, makeEnvironmentProviders, EventEmitter, inject, ElementRef, Renderer2, PLATFORM_ID, Output, viewChild, ChangeDetectionStrategy, Input, contentChild, Inject, NgModule, ChangeDetectorRef, HostListener } from '@angular/core';
3
3
  import * as i1 from '@angular/common';
4
4
  import { CommonModule, isPlatformBrowser, NgClass } from '@angular/common';
5
5
  import * as i2$1 from '@angular/material/icon';
@@ -68,10 +68,10 @@ import { DomSanitizer, Title } from '@angular/platform-browser';
68
68
 
69
69
  class IconComponent {
70
70
  hasClass = true;
71
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
72
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: IconComponent, isStandalone: true, selector: "rolatech-icon", host: { properties: { "class.rolatech-icon": "this.hasClass" } }, ngImport: i0, template: "<mat-icon>\n <ng-content></ng-content>\n</mat-icon>\n", styles: [".rolatech-icon{display:inline-flex;align-items:center;justify-content:center;position:relative;vertical-align:middle;width:var(--rolatech-icon-width, 24px);height:var(--rolatech-icon-height, 24px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], encapsulation: i0.ViewEncapsulation.None });
71
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
72
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: IconComponent, isStandalone: true, selector: "rolatech-icon", host: { properties: { "class.rolatech-icon": "this.hasClass" } }, ngImport: i0, template: "<mat-icon>\n <ng-content></ng-content>\n</mat-icon>\n", styles: [".rolatech-icon{display:inline-flex;align-items:center;justify-content:center;position:relative;vertical-align:middle;width:var(--rolatech-icon-width, 24px);height:var(--rolatech-icon-height, 24px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], encapsulation: i0.ViewEncapsulation.None });
73
73
  }
74
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: IconComponent, decorators: [{
74
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: IconComponent, decorators: [{
75
75
  type: Component,
76
76
  args: [{ selector: 'rolatech-icon', standalone: true, imports: [CommonModule, MatIcon], encapsulation: ViewEncapsulation.None, template: "<mat-icon>\n <ng-content></ng-content>\n</mat-icon>\n", styles: [".rolatech-icon{display:inline-flex;align-items:center;justify-content:center;position:relative;vertical-align:middle;width:var(--rolatech-icon-width, 24px);height:var(--rolatech-icon-height, 24px)}\n"] }]
77
77
  }], propDecorators: { hasClass: [{
@@ -81,10 +81,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
81
81
 
82
82
  class IconButtonComponent {
83
83
  hasClass = true;
84
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: IconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
85
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: IconButtonComponent, isStandalone: true, selector: "rolatech-icon-button", host: { properties: { "class.rolatech-icon-button": "this.hasClass" } }, ngImport: i0, template: "<button\n id=\"button\"\n class=\"w-10 h-10 p-2 inline-block relative cursor-pointer hover:bg-gray-100 rounded-full rolatech-icon-button\"\n onclick=\"this.blur()\"\n>\n <!-- <ng-content select=\"rolatech-icon\"></ng-content> -->\n <rolatech-icon>\n <ng-content></ng-content>\n </rolatech-icon>\n</button>\n", styles: [".rolatech-icon-button{--rolatech-icon-button-icon-width: 24px;--rolatech-icon-button-icon-height: 24px;color:var(--rolatech-spec-icon-active-other);width:40px;height:40px;box-sizing:border-box}button.rolatech-icon-button{vertical-align:middle;color:inherit;outline:none;background:none;margin:0;border:none;padding:0;width:100%;height:100%;line-height:0;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: IconComponent, selector: "rolatech-icon" }], encapsulation: i0.ViewEncapsulation.None });
84
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: IconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
85
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: IconButtonComponent, isStandalone: true, selector: "rolatech-icon-button", host: { properties: { "class.rolatech-icon-button": "this.hasClass" } }, ngImport: i0, template: "<button\n id=\"button\"\n class=\"w-10 h-10 p-2 inline-block relative cursor-pointer hover:bg-gray-100 rounded-full rolatech-icon-button\"\n onclick=\"this.blur()\"\n>\n <!-- <ng-content select=\"rolatech-icon\"></ng-content> -->\n <rolatech-icon>\n <ng-content></ng-content>\n </rolatech-icon>\n</button>\n", styles: [".rolatech-icon-button{--rolatech-icon-button-icon-width: 24px;--rolatech-icon-button-icon-height: 24px;color:var(--rolatech-spec-icon-active-other);width:40px;height:40px;box-sizing:border-box}button.rolatech-icon-button{vertical-align:middle;color:inherit;outline:none;background:none;margin:0;border:none;padding:0;width:100%;height:100%;line-height:0;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: IconComponent, selector: "rolatech-icon" }], encapsulation: i0.ViewEncapsulation.None });
86
86
  }
87
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: IconButtonComponent, decorators: [{
87
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: IconButtonComponent, decorators: [{
88
88
  type: Component,
89
89
  args: [{ selector: 'rolatech-icon-button', standalone: true, imports: [CommonModule, IconComponent], encapsulation: ViewEncapsulation.None, template: "<button\n id=\"button\"\n class=\"w-10 h-10 p-2 inline-block relative cursor-pointer hover:bg-gray-100 rounded-full rolatech-icon-button\"\n onclick=\"this.blur()\"\n>\n <!-- <ng-content select=\"rolatech-icon\"></ng-content> -->\n <rolatech-icon>\n <ng-content></ng-content>\n </rolatech-icon>\n</button>\n", styles: [".rolatech-icon-button{--rolatech-icon-button-icon-width: 24px;--rolatech-icon-button-icon-height: 24px;color:var(--rolatech-spec-icon-active-other);width:40px;height:40px;box-sizing:border-box}button.rolatech-icon-button{vertical-align:middle;color:inherit;outline:none;background:none;margin:0;border:none;padding:0;width:100%;height:100%;line-height:0;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent}\n"] }]
90
90
  }], propDecorators: { hasClass: [{
@@ -93,20 +93,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
93
93
  }] } });
94
94
 
95
95
  class TitleComponent {
96
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: TitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
97
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: TitleComponent, isStandalone: true, selector: "rolatech-title", ngImport: i0, template: "<a class=\"text-xl font-medium py-3 cursor-pointer\">\n <ng-content></ng-content>\n</a>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
96
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: TitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
97
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: TitleComponent, isStandalone: true, selector: "rolatech-title", ngImport: i0, template: "<a class=\"text-xl font-medium py-3 cursor-pointer\">\n <ng-content></ng-content>\n</a>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
98
98
  }
99
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: TitleComponent, decorators: [{
99
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: TitleComponent, decorators: [{
100
100
  type: Component,
101
101
  args: [{ selector: 'rolatech-title', standalone: true, imports: [CommonModule], template: "<a class=\"text-xl font-medium py-3 cursor-pointer\">\n <ng-content></ng-content>\n</a>\n" }]
102
102
  }] });
103
103
 
104
104
  class AppContainerComponent {
105
105
  hasClass = true;
106
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
107
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: AppContainerComponent, isStandalone: true, selector: "rolatech-app-container", host: { properties: { "class.rolatech-app-container": "this.hasClass" } }, ngImport: i0, template: "<div class=\"px-4 xl:max-w-[1024px] 2xl:max-w-[1280px] m-auto\">\n <ng-content></ng-content>\n</div>\n", styles: ["@media (min-width: 1280){.rolatech-app-container{max-width:var(--rolatech-app-container-max-width, 1024px);margin:0 auto;padding:0 16px}}@media (min-width: 1536px){.rolatech-app-container{max-width:var(--rolatech-app-container-max-width, 1280px);margin:0 auto;padding:0 16px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
106
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AppContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
107
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: AppContainerComponent, isStandalone: true, selector: "rolatech-app-container", host: { properties: { "class.rolatech-app-container": "this.hasClass" } }, ngImport: i0, template: "<div class=\"px-4 xl:max-w-[1024px] 2xl:max-w-[1280px] m-auto\">\n <ng-content></ng-content>\n</div>\n", styles: ["@media (min-width: 1280){.rolatech-app-container{max-width:var(--rolatech-app-container-max-width, 1024px);margin:0 auto;padding:0 16px}}@media (min-width: 1536px){.rolatech-app-container{max-width:var(--rolatech-app-container-max-width, 1280px);margin:0 auto;padding:0 16px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
108
108
  }
109
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppContainerComponent, decorators: [{
109
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AppContainerComponent, decorators: [{
110
110
  type: Component,
111
111
  args: [{ selector: 'rolatech-app-container', standalone: true, imports: [CommonModule], template: "<div class=\"px-4 xl:max-w-[1024px] 2xl:max-w-[1280px] m-auto\">\n <ng-content></ng-content>\n</div>\n", styles: ["@media (min-width: 1280){.rolatech-app-container{max-width:var(--rolatech-app-container-max-width, 1024px);margin:0 auto;padding:0 16px}}@media (min-width: 1536px){.rolatech-app-container{max-width:var(--rolatech-app-container-max-width, 1280px);margin:0 auto;padding:0 16px}}\n"] }]
112
112
  }], propDecorators: { hasClass: [{
@@ -115,26 +115,37 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
115
115
  }] } });
116
116
 
117
117
  class AppContainerContentComponent {
118
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppContainerContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
119
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: AppContainerContentComponent, isStandalone: true, selector: "rolatech-app-container-content", ngImport: i0, template: "<div>\n <ng-content></ng-content>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatSidenavModule }] });
118
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AppContainerContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
119
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: AppContainerContentComponent, isStandalone: true, selector: "rolatech-app-container-content", ngImport: i0, template: "<div>\n <ng-content></ng-content>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatSidenavModule }] });
120
120
  }
121
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppContainerContentComponent, decorators: [{
121
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AppContainerContentComponent, decorators: [{
122
122
  type: Component,
123
123
  args: [{ selector: 'rolatech-app-container-content', standalone: true, imports: [CommonModule, MatSidenavModule], template: "<div>\n <ng-content></ng-content>\n</div>\n" }]
124
124
  }] });
125
125
 
126
+ const APP_LAYOUT = new InjectionToken('APP_LAYOUT');
127
+ function provideAngularLayout(config) {
128
+ const providers = [
129
+ {
130
+ provide: APP_LAYOUT,
131
+ useValue: config,
132
+ },
133
+ ];
134
+ return makeEnvironmentProviders(providers);
135
+ }
136
+
126
137
  class TopbarComponent {
127
138
  hostId = 'rolatech-topbar';
128
139
  hasClass = true;
129
- title = '';
130
- subtitle = '';
131
- persistent = false;
140
+ persistent;
132
141
  toggle = new EventEmitter();
133
142
  el = inject(ElementRef);
134
143
  renderer = inject(Renderer2);
135
144
  platformId = inject(PLATFORM_ID);
136
145
  breakpointObserver = inject(BreakpointObserver);
146
+ appLayout = inject(APP_LAYOUT);
137
147
  isHandset$;
148
+ appDrawer;
138
149
  constructor() {
139
150
  this.isHandset$ = this.breakpointObserver.observe([Breakpoints.Handset]).pipe(map((result) => result.matches), shareReplay());
140
151
  }
@@ -162,26 +173,20 @@ class TopbarComponent {
162
173
  }
163
174
  }
164
175
  onToggle() {
165
- this.toggle.emit();
176
+ this.appDrawer.toggle();
166
177
  }
167
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: TopbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
168
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: TopbarComponent, isStandalone: true, selector: "rolatech-topbar", inputs: { title: "title", subtitle: "subtitle", persistent: "persistent" }, outputs: { toggle: "toggle" }, host: { properties: { "id": "this.hostId", "class.rolatech-topbar": "this.hasClass" } }, ngImport: i0, template: "<div class=\"h-14 px-2 sm:px-4 flex items-center\">\n @if (persistent || (isHandset$ | async)) {\n <rolatech-icon-button id=\"topbar-menu-button\" (click)=\"onToggle()\">menu</rolatech-icon-button>\n }\n <div id=\"title\" class=\"cursor-pointer\" routerLink=\"/\">\n <div class=\"text-black text-lg sm:text-xl font-bold\">\n <span class=\"text-orange-600\">{{ title }}</span>\n <span>{{ subtitle }}</span>\n </div>\n </div>\n <ng-content></ng-content>\n</div>\n", styles: ["rolatech-topbar{position:fixed;top:0;width:100%;z-index:900;transform:translateY(0);transition:transform .3s ease;background:var(--rolatech-topbar-background-color, #fff);color:var(--rolatech-topbar-color, #000)}rolatech-topbar:not(:has(#topbar-menu-button)) #title{padding-left:16px}rolatech-app-layout rolatech-app-drawer[persistent][opened]~rolatech-topbar{margin-left:256px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: IconButtonComponent, selector: "rolatech-icon-button" }, { kind: "ngmodule", type: MatButtonModule }], encapsulation: i0.ViewEncapsulation.None });
178
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: TopbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
179
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: TopbarComponent, isStandalone: true, selector: "rolatech-topbar", outputs: { toggle: "toggle" }, host: { properties: { "id": "this.hostId", "class.rolatech-topbar": "this.hasClass" } }, ngImport: i0, template: "<div class=\"h-14 px-2 sm:px-4 flex items-center\">\n @if (persistent || (isHandset$ | async)) {\n <rolatech-icon-button id=\"topbar-menu-button\" (click)=\"onToggle()\">menu</rolatech-icon-button>\n }\n <div id=\"title\" class=\"cursor-pointer\" routerLink=\"/\">\n <div class=\"text-black text-lg sm:text-xl font-bold\">\n <span class=\"text-orange-600\">{{ appLayout.title }}</span>\n <span>{{ appLayout.subtitle }}</span>\n </div>\n </div>\n <div class=\"flex-1\"></div>\n <ng-content></ng-content>\n</div>\n", styles: ["rolatech-topbar{position:fixed;top:0;width:100%;z-index:900;transform:translateY(0);transition:transform .3s ease;background:var(--rolatech-topbar-background-color, #fff);color:var(--rolatech-topbar-color, #000)}rolatech-topbar:not(:has(#topbar-menu-button)) #title{padding-left:16px}rolatech-app-layout rolatech-app-drawer[persistent][opened]~rolatech-topbar{margin-left:256px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: IconButtonComponent, selector: "rolatech-icon-button" }, { kind: "ngmodule", type: MatButtonModule }], encapsulation: i0.ViewEncapsulation.None });
169
180
  }
170
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: TopbarComponent, decorators: [{
181
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: TopbarComponent, decorators: [{
171
182
  type: Component,
172
- args: [{ selector: 'rolatech-topbar', standalone: true, imports: [CommonModule, RouterLink, IconButtonComponent, MatButtonModule, MatIcon], encapsulation: ViewEncapsulation.None, template: "<div class=\"h-14 px-2 sm:px-4 flex items-center\">\n @if (persistent || (isHandset$ | async)) {\n <rolatech-icon-button id=\"topbar-menu-button\" (click)=\"onToggle()\">menu</rolatech-icon-button>\n }\n <div id=\"title\" class=\"cursor-pointer\" routerLink=\"/\">\n <div class=\"text-black text-lg sm:text-xl font-bold\">\n <span class=\"text-orange-600\">{{ title }}</span>\n <span>{{ subtitle }}</span>\n </div>\n </div>\n <ng-content></ng-content>\n</div>\n", styles: ["rolatech-topbar{position:fixed;top:0;width:100%;z-index:900;transform:translateY(0);transition:transform .3s ease;background:var(--rolatech-topbar-background-color, #fff);color:var(--rolatech-topbar-color, #000)}rolatech-topbar:not(:has(#topbar-menu-button)) #title{padding-left:16px}rolatech-app-layout rolatech-app-drawer[persistent][opened]~rolatech-topbar{margin-left:256px}\n"] }]
183
+ args: [{ selector: 'rolatech-topbar', standalone: true, imports: [CommonModule, RouterLink, IconButtonComponent, MatButtonModule, MatIcon], encapsulation: ViewEncapsulation.None, template: "<div class=\"h-14 px-2 sm:px-4 flex items-center\">\n @if (persistent || (isHandset$ | async)) {\n <rolatech-icon-button id=\"topbar-menu-button\" (click)=\"onToggle()\">menu</rolatech-icon-button>\n }\n <div id=\"title\" class=\"cursor-pointer\" routerLink=\"/\">\n <div class=\"text-black text-lg sm:text-xl font-bold\">\n <span class=\"text-orange-600\">{{ appLayout.title }}</span>\n <span>{{ appLayout.subtitle }}</span>\n </div>\n </div>\n <div class=\"flex-1\"></div>\n <ng-content></ng-content>\n</div>\n", styles: ["rolatech-topbar{position:fixed;top:0;width:100%;z-index:900;transform:translateY(0);transition:transform .3s ease;background:var(--rolatech-topbar-background-color, #fff);color:var(--rolatech-topbar-color, #000)}rolatech-topbar:not(:has(#topbar-menu-button)) #title{padding-left:16px}rolatech-app-layout rolatech-app-drawer[persistent][opened]~rolatech-topbar{margin-left:256px}\n"] }]
173
184
  }], ctorParameters: () => [], propDecorators: { hostId: [{
174
185
  type: HostBinding,
175
186
  args: ['id']
176
187
  }], hasClass: [{
177
188
  type: HostBinding,
178
189
  args: ['class.rolatech-topbar']
179
- }], title: [{
180
- type: Input
181
- }], subtitle: [{
182
- type: Input
183
- }], persistent: [{
184
- type: Input
185
190
  }], toggle: [{
186
191
  type: Output
187
192
  }] } });
@@ -189,16 +194,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
189
194
  class AppDrawerComponent {
190
195
  opened = false;
191
196
  links = [];
192
- title = '';
193
- subtitle = '';
194
- persistent = false;
195
197
  hostId = 'rolatech-app-drawer';
196
198
  hasClass = true;
197
199
  duration = '200ms';
200
+ persistent;
198
201
  el = inject(ElementRef);
199
202
  renderer = inject(Renderer2);
200
203
  platformId = inject(PLATFORM_ID);
201
204
  breakpointObserver = inject(BreakpointObserver);
205
+ appLayout = inject(APP_LAYOUT);
202
206
  guideEl = viewChild('guide');
203
207
  content = viewChild('content');
204
208
  scrimEl = viewChild('scrim');
@@ -256,22 +260,16 @@ class AppDrawerComponent {
256
260
  });
257
261
  }
258
262
  }
259
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
260
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: AppDrawerComponent, isStandalone: true, selector: "rolatech-app-drawer", inputs: { opened: "opened", links: "links", title: "title", subtitle: "subtitle", persistent: "persistent" }, host: { properties: { "id": "this.hostId", "class.rolatech-app-drawer": "this.hasClass", "style.transition-duration": "this.duration" } }, viewQueries: [{ propertyName: "guideEl", first: true, predicate: ["guide"], descendants: true, isSignal: true }, { propertyName: "content", first: true, predicate: ["content"], descendants: true, isSignal: true }, { propertyName: "scrimEl", first: true, predicate: ["scrim"], descendants: true, isSignal: true }, { propertyName: "headerEl", first: true, predicate: ["header"], descendants: true, isSignal: true }], ngImport: i0, template: "<div id=\"scrim\" #scrim class=\"tp-yt-app-drawer\" (click)=\"close()\" style=\"transition-duration: 200ms\"></div>\n<div id=\"contentContainer\" #content class=\"tp-yt-app-drawer\" style=\"transition-duration: 200ms\">\n <div id=\"guide-wrapper\">\n <div id=\"guide-spacer\"></div>\n <div id=\"guide-content\">\n <div id=\"header\" #header class=\"flex pl-4 h-14 items-center\">\n <rolatech-icon-button #menuButton (click)=\"this.toggle()\" onclick=\"this.blur()\">menu</rolatech-icon-button>\n <div class=\"text-black text-lg sm:text-xl font-bold\" routerLink=\"/\">\n <span class=\"text-orange-600\">{{ title }}</span>\n <span>{{ subtitle }}</span>\n </div>\n </div>\n <div id=\"guide-inner-content\" class=\"flex flex-col ytd-app\">\n @if (completed) {\n <div class=\"flex p-3 flex-col gap-2\">\n @for (item of links; track $index) {\n @if (item.openinView) {\n <a\n class=\"flex hover:bg-gray-100 min-h-11\"\n [href]=\"item.link\"\n target=\"_blank\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm opacity-75\">{{ item.subtitle }}</span>\n </div>\n </div>\n <rolatech-icon class=\"scale-90\">open_in_new</rolatech-icon>\n </div>\n </a>\n } @else {\n <a\n class=\"flex hover:bg-gray-100 min-h-11\"\n [routerLink]=\"item.link\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm\">{{ item.subtitle }}</span>\n </div>\n </div>\n </div>\n </a>\n }\n }\n </div>\n }\n </div>\n </div>\n </div>\n</div>\n", styles: ["rolatech-app-drawer{position:fixed;z-index:1;inset:-120px 0;visibility:hidden;transition-property:visibility}rolatech-app-drawer[opened]{visibility:visible}rolatech-app-drawer:not(:has(#drawer-menu-button)){padding-left:16px}[hidden]{display:none!important}#contentContainer.tp-yt-app-drawer{position:absolute;top:0;bottom:0;left:0;width:var(--app-drawer-width, 256px);padding:var(--app-drawer-content-padding, 120px 0);transition-property:-webkit-transform;transition-property:transform;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);background-color:#fff;background-color:var(--app-drawer-content-container-background-color, white)}#contentContainer.tp-yt-app-drawer[opened]{-webkit-transform:translate3d(0,0,0);transform:translateZ(0)}#guide-inner-content.ytd-app{overflow:hidden;flex:1;flex-basis:.000000001px;overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin}#scrim.tp-yt-app-drawer{position:absolute;inset:0;transition-property:opacity;-webkit-transform:translateZ(0);transform:translateZ(0);opacity:0;background:var(--app-drawer-scrim-background, rgba(0, 0, 0, .5))}#scrim.visible.tp-yt-app-drawer{opacity:1}rolatech-app-drawer[persistent]{width:var(--app-drawer-width, 256px)}#guide-spacer{margin-top:var(--ytd-masthead-height, 56px)}rolatech-app-drawer:not([persistent]) #guide-spacer{display:none}rolatech-app-drawer:not([persistent]){z-index:2030}.active{background-color:#0000000d;border-radius:8px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: IconButtonComponent, selector: "rolatech-icon-button" }, { kind: "component", type: IconComponent, selector: "rolatech-icon" }], encapsulation: i0.ViewEncapsulation.None });
263
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AppDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
264
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: AppDrawerComponent, isStandalone: true, selector: "rolatech-app-drawer", inputs: { opened: "opened", links: "links" }, host: { properties: { "id": "this.hostId", "class.rolatech-app-drawer": "this.hasClass", "style.transition-duration": "this.duration" } }, viewQueries: [{ propertyName: "guideEl", first: true, predicate: ["guide"], descendants: true, isSignal: true }, { propertyName: "content", first: true, predicate: ["content"], descendants: true, isSignal: true }, { propertyName: "scrimEl", first: true, predicate: ["scrim"], descendants: true, isSignal: true }, { propertyName: "headerEl", first: true, predicate: ["header"], descendants: true, isSignal: true }], ngImport: i0, template: "<div id=\"scrim\" #scrim class=\"tp-yt-app-drawer\" (click)=\"close()\" style=\"transition-duration: 200ms\"></div>\n<div id=\"contentContainer\" #content class=\"tp-yt-app-drawer\" style=\"transition-duration: 200ms\">\n <div id=\"guide-wrapper\">\n <div id=\"guide-spacer\"></div>\n <div id=\"guide-content\">\n <div id=\"header\" #header class=\"flex pl-4 h-14 items-center\">\n <rolatech-icon-button #menuButton (click)=\"this.toggle()\" onclick=\"this.blur()\">menu</rolatech-icon-button>\n <div class=\"text-black text-lg sm:text-xl font-bold\" routerLink=\"/\">\n <span class=\"text-orange-600\">{{ appLayout.title }}</span>\n <span>{{ appLayout.subtitle }}</span>\n </div>\n </div>\n <div id=\"guide-inner-content\" class=\"flex flex-col ytd-app\">\n @if (completed) {\n <div class=\"flex p-3 flex-col gap-2\">\n @for (item of links; track $index) {\n @if (item.openinView) {\n <a\n class=\"flex hover:bg-gray-100 min-h-11\"\n [href]=\"item.link\"\n target=\"_blank\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm opacity-75\">{{ item.subtitle }}</span>\n </div>\n </div>\n <rolatech-icon class=\"scale-90\">open_in_new</rolatech-icon>\n </div>\n </a>\n } @else {\n <a\n class=\"flex hover:bg-gray-100 min-h-11\"\n [routerLink]=\"item.link\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n routerLinkActive=\"drawer-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n #routerLink=\"routerLinkActive\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm\">{{ item.subtitle }}</span>\n </div>\n </div>\n </div>\n </a>\n }\n }\n </div>\n }\n </div>\n </div>\n </div>\n</div>\n", styles: ["rolatech-app-drawer{position:fixed;z-index:1;inset:-120px 0;visibility:hidden;transition-property:visibility}rolatech-app-drawer[opened]{visibility:visible}rolatech-app-drawer:not(:has(#drawer-menu-button)){padding-left:16px}[hidden]{display:none!important}#contentContainer.tp-yt-app-drawer{position:absolute;top:0;bottom:0;left:0;width:var(--app-drawer-width, 256px);padding:var(--app-drawer-content-padding, 120px 0);transition-property:-webkit-transform;transition-property:transform;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);background-color:#fff;background-color:var(--app-drawer-content-container-background-color, white)}#contentContainer.tp-yt-app-drawer[opened]{-webkit-transform:translate3d(0,0,0);transform:translateZ(0)}#guide-inner-content.ytd-app{overflow:hidden;flex:1;flex-basis:.000000001px;overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin}#scrim.tp-yt-app-drawer{position:absolute;inset:0;transition-property:opacity;-webkit-transform:translateZ(0);transform:translateZ(0);opacity:0;background:var(--app-drawer-scrim-background, rgba(0, 0, 0, .5))}#scrim.visible.tp-yt-app-drawer{opacity:1}rolatech-app-drawer[persistent]{width:var(--app-drawer-width, 256px)}#guide-spacer{margin-top:var(--ytd-masthead-height, 56px)}rolatech-app-drawer:not([persistent]) #guide-spacer{display:none}rolatech-app-drawer:not([persistent]){z-index:2030}.drawer-active{background-color:#0000000d;border-radius:8px;font-weight:500}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: IconButtonComponent, selector: "rolatech-icon-button" }, { kind: "component", type: IconComponent, selector: "rolatech-icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
261
265
  }
262
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppDrawerComponent, decorators: [{
266
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AppDrawerComponent, decorators: [{
263
267
  type: Component,
264
- args: [{ selector: 'rolatech-app-drawer', standalone: true, imports: [CommonModule, MatNavList, RouterLink, RouterLinkActive, IconButtonComponent, IconComponent], encapsulation: ViewEncapsulation.None, template: "<div id=\"scrim\" #scrim class=\"tp-yt-app-drawer\" (click)=\"close()\" style=\"transition-duration: 200ms\"></div>\n<div id=\"contentContainer\" #content class=\"tp-yt-app-drawer\" style=\"transition-duration: 200ms\">\n <div id=\"guide-wrapper\">\n <div id=\"guide-spacer\"></div>\n <div id=\"guide-content\">\n <div id=\"header\" #header class=\"flex pl-4 h-14 items-center\">\n <rolatech-icon-button #menuButton (click)=\"this.toggle()\" onclick=\"this.blur()\">menu</rolatech-icon-button>\n <div class=\"text-black text-lg sm:text-xl font-bold\" routerLink=\"/\">\n <span class=\"text-orange-600\">{{ title }}</span>\n <span>{{ subtitle }}</span>\n </div>\n </div>\n <div id=\"guide-inner-content\" class=\"flex flex-col ytd-app\">\n @if (completed) {\n <div class=\"flex p-3 flex-col gap-2\">\n @for (item of links; track $index) {\n @if (item.openinView) {\n <a\n class=\"flex hover:bg-gray-100 min-h-11\"\n [href]=\"item.link\"\n target=\"_blank\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm opacity-75\">{{ item.subtitle }}</span>\n </div>\n </div>\n <rolatech-icon class=\"scale-90\">open_in_new</rolatech-icon>\n </div>\n </a>\n } @else {\n <a\n class=\"flex hover:bg-gray-100 min-h-11\"\n [routerLink]=\"item.link\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm\">{{ item.subtitle }}</span>\n </div>\n </div>\n </div>\n </a>\n }\n }\n </div>\n }\n </div>\n </div>\n </div>\n</div>\n", styles: ["rolatech-app-drawer{position:fixed;z-index:1;inset:-120px 0;visibility:hidden;transition-property:visibility}rolatech-app-drawer[opened]{visibility:visible}rolatech-app-drawer:not(:has(#drawer-menu-button)){padding-left:16px}[hidden]{display:none!important}#contentContainer.tp-yt-app-drawer{position:absolute;top:0;bottom:0;left:0;width:var(--app-drawer-width, 256px);padding:var(--app-drawer-content-padding, 120px 0);transition-property:-webkit-transform;transition-property:transform;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);background-color:#fff;background-color:var(--app-drawer-content-container-background-color, white)}#contentContainer.tp-yt-app-drawer[opened]{-webkit-transform:translate3d(0,0,0);transform:translateZ(0)}#guide-inner-content.ytd-app{overflow:hidden;flex:1;flex-basis:.000000001px;overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin}#scrim.tp-yt-app-drawer{position:absolute;inset:0;transition-property:opacity;-webkit-transform:translateZ(0);transform:translateZ(0);opacity:0;background:var(--app-drawer-scrim-background, rgba(0, 0, 0, .5))}#scrim.visible.tp-yt-app-drawer{opacity:1}rolatech-app-drawer[persistent]{width:var(--app-drawer-width, 256px)}#guide-spacer{margin-top:var(--ytd-masthead-height, 56px)}rolatech-app-drawer:not([persistent]) #guide-spacer{display:none}rolatech-app-drawer:not([persistent]){z-index:2030}.active{background-color:#0000000d;border-radius:8px}\n"] }]
268
+ args: [{ selector: 'rolatech-app-drawer', standalone: true, imports: [CommonModule, MatNavList, RouterLink, RouterLinkActive, IconButtonComponent, IconComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"scrim\" #scrim class=\"tp-yt-app-drawer\" (click)=\"close()\" style=\"transition-duration: 200ms\"></div>\n<div id=\"contentContainer\" #content class=\"tp-yt-app-drawer\" style=\"transition-duration: 200ms\">\n <div id=\"guide-wrapper\">\n <div id=\"guide-spacer\"></div>\n <div id=\"guide-content\">\n <div id=\"header\" #header class=\"flex pl-4 h-14 items-center\">\n <rolatech-icon-button #menuButton (click)=\"this.toggle()\" onclick=\"this.blur()\">menu</rolatech-icon-button>\n <div class=\"text-black text-lg sm:text-xl font-bold\" routerLink=\"/\">\n <span class=\"text-orange-600\">{{ appLayout.title }}</span>\n <span>{{ appLayout.subtitle }}</span>\n </div>\n </div>\n <div id=\"guide-inner-content\" class=\"flex flex-col ytd-app\">\n @if (completed) {\n <div class=\"flex p-3 flex-col gap-2\">\n @for (item of links; track $index) {\n @if (item.openinView) {\n <a\n class=\"flex hover:bg-gray-100 min-h-11\"\n [href]=\"item.link\"\n target=\"_blank\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm opacity-75\">{{ item.subtitle }}</span>\n </div>\n </div>\n <rolatech-icon class=\"scale-90\">open_in_new</rolatech-icon>\n </div>\n </a>\n } @else {\n <a\n class=\"flex hover:bg-gray-100 min-h-11\"\n [routerLink]=\"item.link\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n routerLinkActive=\"drawer-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n #routerLink=\"routerLinkActive\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm\">{{ item.subtitle }}</span>\n </div>\n </div>\n </div>\n </a>\n }\n }\n </div>\n }\n </div>\n </div>\n </div>\n</div>\n", styles: ["rolatech-app-drawer{position:fixed;z-index:1;inset:-120px 0;visibility:hidden;transition-property:visibility}rolatech-app-drawer[opened]{visibility:visible}rolatech-app-drawer:not(:has(#drawer-menu-button)){padding-left:16px}[hidden]{display:none!important}#contentContainer.tp-yt-app-drawer{position:absolute;top:0;bottom:0;left:0;width:var(--app-drawer-width, 256px);padding:var(--app-drawer-content-padding, 120px 0);transition-property:-webkit-transform;transition-property:transform;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);background-color:#fff;background-color:var(--app-drawer-content-container-background-color, white)}#contentContainer.tp-yt-app-drawer[opened]{-webkit-transform:translate3d(0,0,0);transform:translateZ(0)}#guide-inner-content.ytd-app{overflow:hidden;flex:1;flex-basis:.000000001px;overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin}#scrim.tp-yt-app-drawer{position:absolute;inset:0;transition-property:opacity;-webkit-transform:translateZ(0);transform:translateZ(0);opacity:0;background:var(--app-drawer-scrim-background, rgba(0, 0, 0, .5))}#scrim.visible.tp-yt-app-drawer{opacity:1}rolatech-app-drawer[persistent]{width:var(--app-drawer-width, 256px)}#guide-spacer{margin-top:var(--ytd-masthead-height, 56px)}rolatech-app-drawer:not([persistent]) #guide-spacer{display:none}rolatech-app-drawer:not([persistent]){z-index:2030}.drawer-active{background-color:#0000000d;border-radius:8px;font-weight:500}\n"] }]
265
269
  }], propDecorators: { opened: [{
266
270
  type: Input
267
271
  }], links: [{
268
272
  type: Input
269
- }], title: [{
270
- type: Input
271
- }], subtitle: [{
272
- type: Input
273
- }], persistent: [{
274
- type: Input
275
273
  }], hostId: [{
276
274
  type: HostBinding,
277
275
  args: ['id']
@@ -286,15 +284,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
286
284
  class AppLayoutComponent {
287
285
  hostId = 'rolatech-app-layout';
288
286
  hasClass = true;
289
- scrimEl = viewChild('rolatech-app-drawer');
290
- appDrawer = viewChild('rolatech-app-drawer');
291
- myElement;
292
- targetElement;
287
+ appLayout = inject(APP_LAYOUT);
288
+ topbar = contentChild.required(TopbarComponent);
289
+ drawer = contentChild.required(AppDrawerComponent);
293
290
  el = inject(ElementRef);
294
291
  renderer = inject(Renderer2);
295
292
  platformId = inject(PLATFORM_ID);
296
293
  breakpointObserver = inject(BreakpointObserver);
297
294
  ngOnInit() {
295
+ if (this.topbar()) {
296
+ this.topbar().persistent = this.appLayout.persistent;
297
+ this.topbar().appDrawer = this.drawer();
298
+ }
299
+ if (this.drawer()) {
300
+ this.drawer().persistent = this.appLayout.persistent;
301
+ }
298
302
  if (isPlatformBrowser(this.platformId)) {
299
303
  this.breakpointObserver
300
304
  .observe(Breakpoints.Handset)
@@ -311,10 +315,11 @@ class AppLayoutComponent {
311
315
  });
312
316
  }
313
317
  }
314
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
315
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "17.2.4", type: AppLayoutComponent, isStandalone: true, selector: "rolatech-app-layout", host: { properties: { "id": "this.hostId", "class.rolatech-app-layout": "this.hasClass" } }, queries: [{ propertyName: "targetElement", first: true, predicate: ["rolatech-app-drawer"], descendants: true }], viewQueries: [{ propertyName: "scrimEl", first: true, predicate: ["rolatech-app-drawer"], descendants: true, isSignal: true }, { propertyName: "appDrawer", first: true, predicate: ["rolatech-app-drawer"], descendants: true, isSignal: true }, { propertyName: "myElement", first: true, predicate: ["rolatech-app-drawer"], descendants: true, static: true }], ngImport: i0, template: "<ng-content select=\"rolatech-topbar\"></ng-content>\n<ng-content select=\"rolatech-app-drawer\"></ng-content>\n<ng-content select=\"rolatech-app-page\"></ng-content>\n<div class=\"flex-1\"></div>\n<ng-content select=\"rolatech-app-footer\"></ng-content>\n", styles: ["rolatech-app-layout{display:flex;flex-direction:column;height:100%}rolatech-app-layout rolatech-app-drawer[persistent][opened]~rolatech-app-page{margin-left:256px}rolatech-app-page{display:block;padding-top:56px;transition-duration:.4s;transition-timing-function:cubic-bezier(.25,.8,.25,1);transition-property:transform,margin-left,margin-right}rolatech-app-page[mini-guide-visible] .content{margin-left:72px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatListModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatSidenavModule }], encapsulation: i0.ViewEncapsulation.None });
318
+ ngAfterContentInit() { }
319
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AppLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
320
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "17.3.0", type: AppLayoutComponent, isStandalone: true, selector: "rolatech-app-layout", host: { properties: { "id": "this.hostId", "class.rolatech-app-layout": "this.hasClass" } }, queries: [{ propertyName: "topbar", first: true, predicate: TopbarComponent, descendants: true, isSignal: true }, { propertyName: "drawer", first: true, predicate: AppDrawerComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-content select=\"rolatech-topbar\"></ng-content>\n<ng-content select=\"rolatech-app-drawer\"></ng-content>\n<ng-content select=\"rolatech-app-page\"></ng-content>\n<div class=\"flex-1\"></div>\n<ng-content select=\"rolatech-app-footer\"></ng-content>\n", styles: ["rolatech-app-layout{display:flex;flex-direction:column;height:100%}rolatech-app-layout rolatech-app-drawer[persistent][opened]~rolatech-app-page{margin-left:256px}rolatech-app-page{display:block;padding-top:56px;transition-duration:.4s;transition-timing-function:cubic-bezier(.25,.8,.25,1);transition-property:transform,margin-left,margin-right}rolatech-app-page[mini-guide-visible] .content{margin-left:72px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatListModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatSidenavModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
316
321
  }
317
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppLayoutComponent, decorators: [{
322
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AppLayoutComponent, decorators: [{
318
323
  type: Component,
319
324
  args: [{ selector: 'rolatech-app-layout', standalone: true, imports: [
320
325
  CommonModule,
@@ -330,28 +335,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
330
335
  MatSidenavModule,
331
336
  TopbarComponent,
332
337
  AppDrawerComponent,
333
- ], encapsulation: ViewEncapsulation.None, template: "<ng-content select=\"rolatech-topbar\"></ng-content>\n<ng-content select=\"rolatech-app-drawer\"></ng-content>\n<ng-content select=\"rolatech-app-page\"></ng-content>\n<div class=\"flex-1\"></div>\n<ng-content select=\"rolatech-app-footer\"></ng-content>\n", styles: ["rolatech-app-layout{display:flex;flex-direction:column;height:100%}rolatech-app-layout rolatech-app-drawer[persistent][opened]~rolatech-app-page{margin-left:256px}rolatech-app-page{display:block;padding-top:56px;transition-duration:.4s;transition-timing-function:cubic-bezier(.25,.8,.25,1);transition-property:transform,margin-left,margin-right}rolatech-app-page[mini-guide-visible] .content{margin-left:72px}\n"] }]
338
+ ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"rolatech-topbar\"></ng-content>\n<ng-content select=\"rolatech-app-drawer\"></ng-content>\n<ng-content select=\"rolatech-app-page\"></ng-content>\n<div class=\"flex-1\"></div>\n<ng-content select=\"rolatech-app-footer\"></ng-content>\n", styles: ["rolatech-app-layout{display:flex;flex-direction:column;height:100%}rolatech-app-layout rolatech-app-drawer[persistent][opened]~rolatech-app-page{margin-left:256px}rolatech-app-page{display:block;padding-top:56px;transition-duration:.4s;transition-timing-function:cubic-bezier(.25,.8,.25,1);transition-property:transform,margin-left,margin-right}rolatech-app-page[mini-guide-visible] .content{margin-left:72px}\n"] }]
334
339
  }], propDecorators: { hostId: [{
335
340
  type: HostBinding,
336
341
  args: ['id']
337
342
  }], hasClass: [{
338
343
  type: HostBinding,
339
344
  args: ['class.rolatech-app-layout']
340
- }], myElement: [{
341
- type: ViewChild,
342
- args: ['rolatech-app-drawer', { static: true }]
343
- }], targetElement: [{
344
- type: ContentChild,
345
- args: ['rolatech-app-drawer']
346
345
  }] } });
347
346
 
348
347
  class AppPageComponent {
349
348
  hostId = 'rolatech-app-page';
350
349
  hasClass = true;
351
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
352
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: AppPageComponent, isStandalone: true, selector: "rolatech-app-page", host: { properties: { "id": "this.hostId", "class.rolatech-app-page": "this.hasClass" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
350
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AppPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
351
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: AppPageComponent, isStandalone: true, selector: "rolatech-app-page", host: { properties: { "id": "this.hostId", "class.rolatech-app-page": "this.hasClass" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
353
352
  }
354
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppPageComponent, decorators: [{
353
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AppPageComponent, decorators: [{
355
354
  type: Component,
356
355
  args: [{ selector: 'rolatech-app-page', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n" }]
357
356
  }], propDecorators: { hostId: [{
@@ -368,10 +367,10 @@ class AppFooterComponent {
368
367
  config = inject(APP_CONFIG);
369
368
  title = '';
370
369
  copyright = '';
371
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
372
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: AppFooterComponent, isStandalone: true, selector: "rolatech-app-footer", inputs: { title: "title", copyright: "copyright" }, host: { properties: { "id": "this.hostId", "class.rolatech-app-footer": "this.hasClass" } }, ngImport: i0, template: "<div class=\"bg-gray-100 text-black flex flex-col justify-between px-5 sm:px-16 py-6\">\n <div class=\"flex flex-col sm:flex-row sm:gap-10 gap-3 py-3\">\n <ng-content></ng-content>\n </div>\n <div class=\"flex justify-between mt-6\">\n <div class=\"cursor-pointer\">\n <a href=\"/\" target=\"_blank\" class=\"text-lg font-bold\">{{ title }}</a>\n </div>\n <span class=\"text-sm font-thin\">\u00A9{{ copyright }}</span>\n </div>\n</div>\n", styles: [".rolatech-app-footer{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
370
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AppFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
371
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: AppFooterComponent, isStandalone: true, selector: "rolatech-app-footer", inputs: { title: "title", copyright: "copyright" }, host: { properties: { "id": "this.hostId", "class.rolatech-app-footer": "this.hasClass" } }, ngImport: i0, template: "<div class=\"bg-gray-100 text-black flex flex-col justify-between px-5 sm:px-16 py-6\">\n <div class=\"flex flex-col sm:flex-row sm:gap-10 gap-3 py-3\">\n <ng-content></ng-content>\n </div>\n <div class=\"flex justify-between mt-6\">\n <div class=\"cursor-pointer\">\n <a href=\"/\" target=\"_blank\" class=\"text-lg font-bold\">{{ title }}</a>\n </div>\n <span class=\"text-sm font-thin\">\u00A9{{ copyright }}</span>\n </div>\n</div>\n", styles: [".rolatech-app-footer{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
373
372
  }
374
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppFooterComponent, decorators: [{
373
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AppFooterComponent, decorators: [{
375
374
  type: Component,
376
375
  args: [{ selector: 'rolatech-app-footer', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"bg-gray-100 text-black flex flex-col justify-between px-5 sm:px-16 py-6\">\n <div class=\"flex flex-col sm:flex-row sm:gap-10 gap-3 py-3\">\n <ng-content></ng-content>\n </div>\n <div class=\"flex justify-between mt-6\">\n <div class=\"cursor-pointer\">\n <a href=\"/\" target=\"_blank\" class=\"text-lg font-bold\">{{ title }}</a>\n </div>\n <span class=\"text-sm font-thin\">\u00A9{{ copyright }}</span>\n </div>\n</div>\n", styles: [".rolatech-app-footer{width:100%}\n"] }]
377
376
  }], propDecorators: { hostId: [{
@@ -387,10 +386,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
387
386
  }] } });
388
387
 
389
388
  class ConsoleLayoutComponent {
390
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ConsoleLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
391
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ConsoleLayoutComponent, isStandalone: true, selector: "rolatech-console-layout", ngImport: i0, template: "<p>console-layout works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
389
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ConsoleLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
390
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ConsoleLayoutComponent, isStandalone: true, selector: "rolatech-console-layout", ngImport: i0, template: "<p>console-layout works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
392
391
  }
393
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ConsoleLayoutComponent, decorators: [{
392
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ConsoleLayoutComponent, decorators: [{
394
393
  type: Component,
395
394
  args: [{ selector: 'rolatech-console-layout', standalone: true, imports: [CommonModule], template: "<p>console-layout works!</p>\n" }]
396
395
  }] });
@@ -398,10 +397,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
398
397
  class MenuUserComponent {
399
398
  user;
400
399
  myaccountUrl = '';
401
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MenuUserComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
402
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: MenuUserComponent, isStandalone: true, selector: "rolatech-menu-user", inputs: { user: "user", myaccountUrl: "myaccountUrl" }, ngImport: i0, template: "<div class=\"min-w-[256px]\">\n <div class=\"px-6 py-3\">\n <div class=\"flex flex-row items-center\">\n <div class=\"mr-3 w-14 h-14 rounded-full bg-orange-600\">\n @if (user?.avatar) {\n <img [src]=\"user.avatar\" class=\"w-14 h-14 object-cover rounded-full\" />\n }\n </div>\n <div class=\"flex flex-col\">\n <div>\n <div class=\"text-lg font-bold\">{{ user?.name }}</div>\n <div class=\"formated-string\">\n <span>&#64;{{ user?.username }}</span>\n </div>\n </div>\n </div>\n </div>\n <!-- <div class=\"flex\">\n <a\n [href]=\"myaccountUrl\"\n target=\"_blank\"\n class=\"text-sm my-2 p-1 px-6 ml-24 rounded border border-gray-300 hover:bg-gray-200\"\n >\u7528\u6237\u4E2D\u5FC3</a\n >\n </div> -->\n </div>\n <div class=\"flex justify-between items-center\">\n <a mat-menu-item [href]=\"myaccountUrl\" target=\"_blank\" class=\"px-6\">\n <span class=\"flex justify-between items-center\">\n <span class=\"pl-2\"> \u7528\u6237\u4E2D\u5FC3 </span>\n <span class=\"flex\"> <mat-icon>open_in_new</mat-icon></span>\n </span>\n </a>\n </div>\n</div>\n", styles: [".formated-string{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}\n"], dependencies: [{ kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
400
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: MenuUserComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
401
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: MenuUserComponent, isStandalone: true, selector: "rolatech-menu-user", inputs: { user: "user", myaccountUrl: "myaccountUrl" }, ngImport: i0, template: "<div class=\"min-w-[256px]\">\n <div class=\"px-6 py-3\">\n <div class=\"flex flex-row items-center\">\n <div class=\"mr-3 w-14 h-14 rounded-full bg-orange-600\">\n @if (user?.avatar) {\n <img [src]=\"user.avatar\" class=\"w-14 h-14 object-cover rounded-full\" />\n }\n </div>\n <div class=\"flex flex-col\">\n <div>\n <div class=\"text-lg font-bold\">{{ user?.name }}</div>\n <div class=\"formated-string\">\n <span>&#64;{{ user?.username }}</span>\n </div>\n </div>\n </div>\n </div>\n <!-- <div class=\"flex\">\n <a\n [href]=\"myaccountUrl\"\n target=\"_blank\"\n class=\"text-sm my-2 p-1 px-6 ml-24 rounded border border-gray-300 hover:bg-gray-200\"\n >\u7528\u6237\u4E2D\u5FC3</a\n >\n </div> -->\n </div>\n <div class=\"flex justify-between items-center\">\n <a mat-menu-item [href]=\"myaccountUrl\" target=\"_blank\" class=\"px-6\">\n <span class=\"flex justify-between items-center\">\n <span class=\"pl-2\"> \u7528\u6237\u4E2D\u5FC3 </span>\n <span class=\"flex\"> <mat-icon>open_in_new</mat-icon></span>\n </span>\n </a>\n </div>\n</div>\n", styles: [".formated-string{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}\n"], dependencies: [{ kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
403
402
  }
404
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MenuUserComponent, decorators: [{
403
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: MenuUserComponent, decorators: [{
405
404
  type: Component,
406
405
  args: [{ standalone: true, imports: [MatMenuModule, MatIconModule], selector: 'rolatech-menu-user', template: "<div class=\"min-w-[256px]\">\n <div class=\"px-6 py-3\">\n <div class=\"flex flex-row items-center\">\n <div class=\"mr-3 w-14 h-14 rounded-full bg-orange-600\">\n @if (user?.avatar) {\n <img [src]=\"user.avatar\" class=\"w-14 h-14 object-cover rounded-full\" />\n }\n </div>\n <div class=\"flex flex-col\">\n <div>\n <div class=\"text-lg font-bold\">{{ user?.name }}</div>\n <div class=\"formated-string\">\n <span>&#64;{{ user?.username }}</span>\n </div>\n </div>\n </div>\n </div>\n <!-- <div class=\"flex\">\n <a\n [href]=\"myaccountUrl\"\n target=\"_blank\"\n class=\"text-sm my-2 p-1 px-6 ml-24 rounded border border-gray-300 hover:bg-gray-200\"\n >\u7528\u6237\u4E2D\u5FC3</a\n >\n </div> -->\n </div>\n <div class=\"flex justify-between items-center\">\n <a mat-menu-item [href]=\"myaccountUrl\" target=\"_blank\" class=\"px-6\">\n <span class=\"flex justify-between items-center\">\n <span class=\"pl-2\"> \u7528\u6237\u4E2D\u5FC3 </span>\n <span class=\"flex\"> <mat-icon>open_in_new</mat-icon></span>\n </span>\n </a>\n </div>\n</div>\n", styles: [".formated-string{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}\n"] }]
407
406
  }], propDecorators: { user: [{
@@ -415,10 +414,10 @@ class TopbarAvatarMenuComponent {
415
414
  platformId = inject(PLATFORM_ID);
416
415
  menu;
417
416
  user;
418
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: TopbarAvatarMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
419
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: TopbarAvatarMenuComponent, isStandalone: true, selector: "rolatech-topbar-avatar-menu", inputs: { menu: "menu", user: "user" }, ngImport: i0, template: "<div>\n @if (user) {\n <div class=\"flex\">\n <a\n class=\"flex justify-center items-center rounded-full overflow-hidden cursor-pointer hover:outline-gray-200 outline outline-transparent outline-4\"\n [matMenuTriggerFor]=\"menu\"\n >\n <div class=\"bg-orange-600 w-9 h-9\">\n @if (user.avatar) {\n <img class=\"w-9 h-9 object-cover\" [src]=\"user.avatar\" />\n }\n </div>\n </a>\n </div>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatSidenavModule }, { kind: "ngmodule", type: MatListModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "directive", type: i2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }] });
417
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: TopbarAvatarMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
418
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: TopbarAvatarMenuComponent, isStandalone: true, selector: "rolatech-topbar-avatar-menu", inputs: { menu: "menu", user: "user" }, ngImport: i0, template: "<div>\n @if (user) {\n <div class=\"flex\">\n <a\n class=\"flex justify-center items-center rounded-full overflow-hidden cursor-pointer hover:outline-gray-200 outline outline-transparent outline-4\"\n [matMenuTriggerFor]=\"menu\"\n >\n <div class=\"bg-orange-600 w-9 h-9\">\n @if (user.avatar) {\n <img class=\"w-9 h-9 object-cover\" [src]=\"user.avatar\" />\n }\n </div>\n </a>\n </div>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatSidenavModule }, { kind: "ngmodule", type: MatListModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "directive", type: i2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }] });
420
419
  }
421
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: TopbarAvatarMenuComponent, decorators: [{
420
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: TopbarAvatarMenuComponent, decorators: [{
422
421
  type: Component,
423
422
  args: [{ selector: 'rolatech-topbar-avatar-menu', standalone: true, imports: [
424
423
  CommonModule,
@@ -437,10 +436,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
437
436
  }] } });
438
437
 
439
438
  class FolderComponent {
440
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: FolderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
441
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: FolderComponent, isStandalone: true, selector: "rolatech-folder", ngImport: i0, template: "<div></div>\n", styles: [""] });
439
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: FolderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
440
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: FolderComponent, isStandalone: true, selector: "rolatech-folder", ngImport: i0, template: "<div></div>\n", styles: [""] });
442
441
  }
443
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: FolderComponent, decorators: [{
442
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: FolderComponent, decorators: [{
444
443
  type: Component,
445
444
  args: [{ selector: 'rolatech-folder', standalone: true, template: "<div></div>\n" }]
446
445
  }] });
@@ -475,10 +474,10 @@ class MediaPreviewDialogComponent {
475
474
  this.prevDisabled = this.selected === 0;
476
475
  this.nextDisabled = this.selected === this.data.media.length - 1;
477
476
  }
478
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaPreviewDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1$1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
479
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: MediaPreviewDialogComponent, isStandalone: true, selector: "rolatech-media-preview-dialog", ngImport: i0, template: "<div class=\"flex flex-col h-full overflow-hidden\">\n <div class=\"h-16 flex justify-between items-center px-5\">\n @if (data.title) {\n <div class=\"text-md font-medium\">{{ data.title }}</div>\n }\n <div class=\"cursor-pointer\" (click)=\"close()\">\n <mat-icon fontIcon=\"close\"></mat-icon>\n </div>\n </div>\n <mat-divider></mat-divider>\n <div class=\"flex-1 overflow-hidden overflow-y-auto\">\n <div class=\"p-3 flex justify-center items-center\">\n <img class=\"object-cover\" [src]=\"data.media[selected].url\" />\n </div>\n </div>\n <mat-divider></mat-divider>\n <div class=\"h-16 flex justify-between items-center px-5\">\n <button mat-flat-button [disabled]=\"prevDisabled\" (click)=\"prev()\">Prev</button>\n <div>{{ selected + 1 }} / {{ data.media.length }}</div>\n <button mat-flat-button [disabled]=\"nextDisabled\" (click)=\"next()\">Next</button>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }] });
477
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: MediaPreviewDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1$1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
478
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: MediaPreviewDialogComponent, isStandalone: true, selector: "rolatech-media-preview-dialog", ngImport: i0, template: "<div class=\"flex flex-col h-full overflow-hidden\">\n <div class=\"h-16 flex justify-between items-center px-5\">\n @if (data.title) {\n <div class=\"text-md font-medium\">{{ data.title }}</div>\n }\n <div class=\"cursor-pointer\" (click)=\"close()\">\n <mat-icon fontIcon=\"close\"></mat-icon>\n </div>\n </div>\n <mat-divider></mat-divider>\n <div class=\"flex-1 overflow-hidden overflow-y-auto\">\n <div class=\"p-3 flex justify-center items-center\">\n <img class=\"object-cover\" [src]=\"data.media[selected].url\" />\n </div>\n </div>\n <mat-divider></mat-divider>\n <div class=\"h-16 flex justify-between items-center px-5\">\n <button mat-flat-button [disabled]=\"prevDisabled\" (click)=\"prev()\">Prev</button>\n <div>{{ selected + 1 }} / {{ data.media.length }}</div>\n <button mat-flat-button [disabled]=\"nextDisabled\" (click)=\"next()\">Next</button>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }] });
480
479
  }
481
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaPreviewDialogComponent, decorators: [{
480
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: MediaPreviewDialogComponent, decorators: [{
482
481
  type: Component,
483
482
  args: [{ selector: 'rolatech-media-preview-dialog', standalone: true, imports: [MatIconModule, MatDividerModule, MatButtonModule], template: "<div class=\"flex flex-col h-full overflow-hidden\">\n <div class=\"h-16 flex justify-between items-center px-5\">\n @if (data.title) {\n <div class=\"text-md font-medium\">{{ data.title }}</div>\n }\n <div class=\"cursor-pointer\" (click)=\"close()\">\n <mat-icon fontIcon=\"close\"></mat-icon>\n </div>\n </div>\n <mat-divider></mat-divider>\n <div class=\"flex-1 overflow-hidden overflow-y-auto\">\n <div class=\"p-3 flex justify-center items-center\">\n <img class=\"object-cover\" [src]=\"data.media[selected].url\" />\n </div>\n </div>\n <mat-divider></mat-divider>\n <div class=\"h-16 flex justify-between items-center px-5\">\n <button mat-flat-button [disabled]=\"prevDisabled\" (click)=\"prev()\">Prev</button>\n <div>{{ selected + 1 }} / {{ data.media.length }}</div>\n <button mat-flat-button [disabled]=\"nextDisabled\" (click)=\"next()\">Next</button>\n </div>\n</div>\n" }]
484
483
  }], ctorParameters: () => [{ type: undefined, decorators: [{
@@ -534,8 +533,8 @@ const MAT_MODULE = [
534
533
  ScrollingModule,
535
534
  ];
536
535
  class MaterialModule {
537
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MaterialModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
538
- static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.2.4", ngImport: i0, type: MaterialModule, imports: [A11yModule,
536
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: MaterialModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
537
+ static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: MaterialModule, imports: [A11yModule,
539
538
  ClipboardModule,
540
539
  CdkStepperModule,
541
540
  CdkTableModule,
@@ -624,7 +623,7 @@ class MaterialModule {
624
623
  MatTreeModule,
625
624
  PortalModule,
626
625
  ScrollingModule] });
627
- static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MaterialModule, imports: [MAT_MODULE, A11yModule,
626
+ static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: MaterialModule, imports: [MAT_MODULE, A11yModule,
628
627
  ClipboardModule,
629
628
  CdkStepperModule,
630
629
  CdkTableModule,
@@ -670,7 +669,7 @@ class MaterialModule {
670
669
  PortalModule,
671
670
  ScrollingModule] });
672
671
  }
673
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MaterialModule, decorators: [{
672
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: MaterialModule, decorators: [{
674
673
  type: NgModule,
675
674
  args: [{
676
675
  imports: [...MAT_MODULE],
@@ -679,11 +678,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
679
678
  }] });
680
679
 
681
680
  class AngularComponentsModule {
682
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AngularComponentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
683
- static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.2.4", ngImport: i0, type: AngularComponentsModule, imports: [MaterialModule], exports: [MaterialModule] });
684
- static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AngularComponentsModule, imports: [MaterialModule, MaterialModule] });
681
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AngularComponentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
682
+ static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: AngularComponentsModule, imports: [MaterialModule], exports: [MaterialModule] });
683
+ static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AngularComponentsModule, imports: [MaterialModule, MaterialModule] });
685
684
  }
686
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AngularComponentsModule, decorators: [{
685
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: AngularComponentsModule, decorators: [{
687
686
  type: NgModule,
688
687
  args: [{
689
688
  imports: [MaterialModule],
@@ -711,10 +710,10 @@ class LoadingSpinnerComponent {
711
710
  if (this.loadingSubscription)
712
711
  this.loadingSubscription.unsubscribe();
713
712
  }
714
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: LoadingSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
715
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: LoadingSpinnerComponent, isStandalone: true, selector: "rolatech-loading-spinner", inputs: { title: "title" }, ngImport: i0, template: "<div class=\"spinner-container flex flex-col\">\n <div class=\"sk-fading-circle\">\n <div class=\"sk-circle1 sk-circle\"></div>\n <div class=\"sk-circle2 sk-circle\"></div>\n <div class=\"sk-circle3 sk-circle\"></div>\n <div class=\"sk-circle4 sk-circle\"></div>\n <div class=\"sk-circle5 sk-circle\"></div>\n <div class=\"sk-circle6 sk-circle\"></div>\n <div class=\"sk-circle7 sk-circle\"></div>\n <div class=\"sk-circle8 sk-circle\"></div>\n <div class=\"sk-circle9 sk-circle\"></div>\n <div class=\"sk-circle10 sk-circle\"></div>\n <div class=\"sk-circle11 sk-circle\"></div>\n <div class=\"sk-circle12 sk-circle\"></div>\n </div>\n <div class=\"text-lg font-bold text-center\">{{ title }}</div>\n</div>\n", styles: [".spinner-container{display:flex;justify-content:center}.sk-fading-circle{margin:12px auto;width:40px;height:40px;position:relative}.sk-fading-circle .sk-circle{width:100%;height:100%;position:absolute;left:0;top:0}.sk-fading-circle .sk-circle:before{content:\"\";display:block;margin:0 auto;width:12%;height:15%;background-color:#333;border-radius:100%;-webkit-animation:sk-circleFadeDelay 1.2s infinite ease-in-out both;animation:sk-circleFadeDelay 1.2s infinite ease-in-out both}.sk-fading-circle .sk-circle2{-webkit-transform:rotate(30deg);-ms-transform:rotate(30deg);transform:rotate(30deg)}.sk-fading-circle .sk-circle3{-webkit-transform:rotate(60deg);-ms-transform:rotate(60deg);transform:rotate(60deg)}.sk-fading-circle .sk-circle4{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.sk-fading-circle .sk-circle5{-webkit-transform:rotate(120deg);-ms-transform:rotate(120deg);transform:rotate(120deg)}.sk-fading-circle .sk-circle6{-webkit-transform:rotate(150deg);-ms-transform:rotate(150deg);transform:rotate(150deg)}.sk-fading-circle .sk-circle7{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.sk-fading-circle .sk-circle8{-webkit-transform:rotate(210deg);-ms-transform:rotate(210deg);transform:rotate(210deg)}.sk-fading-circle .sk-circle9{-webkit-transform:rotate(240deg);-ms-transform:rotate(240deg);transform:rotate(240deg)}.sk-fading-circle .sk-circle10{-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.sk-fading-circle .sk-circle11{-webkit-transform:rotate(300deg);-ms-transform:rotate(300deg);transform:rotate(300deg)}.sk-fading-circle .sk-circle12{-webkit-transform:rotate(330deg);-ms-transform:rotate(330deg);transform:rotate(330deg)}.sk-fading-circle .sk-circle2:before{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.sk-fading-circle .sk-circle3:before{-webkit-animation-delay:-1s;animation-delay:-1s}.sk-fading-circle .sk-circle4:before{-webkit-animation-delay:-.9s;animation-delay:-.9s}.sk-fading-circle .sk-circle5:before{-webkit-animation-delay:-.8s;animation-delay:-.8s}.sk-fading-circle .sk-circle6:before{-webkit-animation-delay:-.7s;animation-delay:-.7s}.sk-fading-circle .sk-circle7:before{-webkit-animation-delay:-.6s;animation-delay:-.6s}.sk-fading-circle .sk-circle8:before{-webkit-animation-delay:-.5s;animation-delay:-.5s}.sk-fading-circle .sk-circle9:before{-webkit-animation-delay:-.4s;animation-delay:-.4s}.sk-fading-circle .sk-circle10:before{-webkit-animation-delay:-.3s;animation-delay:-.3s}.sk-fading-circle .sk-circle11:before{-webkit-animation-delay:-.2s;animation-delay:-.2s}.sk-fading-circle .sk-circle12:before{-webkit-animation-delay:-.1s;animation-delay:-.1s}@-webkit-keyframes sk-circleFadeDelay{0%,39%,to{opacity:0}40%{opacity:1}}@keyframes sk-circleFadeDelay{0%,39%,to{opacity:0}40%{opacity:1}}\n"] });
713
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: LoadingSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
714
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: LoadingSpinnerComponent, isStandalone: true, selector: "rolatech-loading-spinner", inputs: { title: "title" }, ngImport: i0, template: "<div class=\"spinner-container flex flex-col\">\n <div class=\"sk-fading-circle\">\n <div class=\"sk-circle1 sk-circle\"></div>\n <div class=\"sk-circle2 sk-circle\"></div>\n <div class=\"sk-circle3 sk-circle\"></div>\n <div class=\"sk-circle4 sk-circle\"></div>\n <div class=\"sk-circle5 sk-circle\"></div>\n <div class=\"sk-circle6 sk-circle\"></div>\n <div class=\"sk-circle7 sk-circle\"></div>\n <div class=\"sk-circle8 sk-circle\"></div>\n <div class=\"sk-circle9 sk-circle\"></div>\n <div class=\"sk-circle10 sk-circle\"></div>\n <div class=\"sk-circle11 sk-circle\"></div>\n <div class=\"sk-circle12 sk-circle\"></div>\n </div>\n <div class=\"text-lg font-bold text-center\">{{ title }}</div>\n</div>\n", styles: [".spinner-container{display:flex;justify-content:center}.sk-fading-circle{margin:12px auto;width:40px;height:40px;position:relative}.sk-fading-circle .sk-circle{width:100%;height:100%;position:absolute;left:0;top:0}.sk-fading-circle .sk-circle:before{content:\"\";display:block;margin:0 auto;width:12%;height:15%;background-color:#333;border-radius:100%;-webkit-animation:sk-circleFadeDelay 1.2s infinite ease-in-out both;animation:sk-circleFadeDelay 1.2s infinite ease-in-out both}.sk-fading-circle .sk-circle2{-webkit-transform:rotate(30deg);-ms-transform:rotate(30deg);transform:rotate(30deg)}.sk-fading-circle .sk-circle3{-webkit-transform:rotate(60deg);-ms-transform:rotate(60deg);transform:rotate(60deg)}.sk-fading-circle .sk-circle4{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.sk-fading-circle .sk-circle5{-webkit-transform:rotate(120deg);-ms-transform:rotate(120deg);transform:rotate(120deg)}.sk-fading-circle .sk-circle6{-webkit-transform:rotate(150deg);-ms-transform:rotate(150deg);transform:rotate(150deg)}.sk-fading-circle .sk-circle7{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.sk-fading-circle .sk-circle8{-webkit-transform:rotate(210deg);-ms-transform:rotate(210deg);transform:rotate(210deg)}.sk-fading-circle .sk-circle9{-webkit-transform:rotate(240deg);-ms-transform:rotate(240deg);transform:rotate(240deg)}.sk-fading-circle .sk-circle10{-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.sk-fading-circle .sk-circle11{-webkit-transform:rotate(300deg);-ms-transform:rotate(300deg);transform:rotate(300deg)}.sk-fading-circle .sk-circle12{-webkit-transform:rotate(330deg);-ms-transform:rotate(330deg);transform:rotate(330deg)}.sk-fading-circle .sk-circle2:before{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.sk-fading-circle .sk-circle3:before{-webkit-animation-delay:-1s;animation-delay:-1s}.sk-fading-circle .sk-circle4:before{-webkit-animation-delay:-.9s;animation-delay:-.9s}.sk-fading-circle .sk-circle5:before{-webkit-animation-delay:-.8s;animation-delay:-.8s}.sk-fading-circle .sk-circle6:before{-webkit-animation-delay:-.7s;animation-delay:-.7s}.sk-fading-circle .sk-circle7:before{-webkit-animation-delay:-.6s;animation-delay:-.6s}.sk-fading-circle .sk-circle8:before{-webkit-animation-delay:-.5s;animation-delay:-.5s}.sk-fading-circle .sk-circle9:before{-webkit-animation-delay:-.4s;animation-delay:-.4s}.sk-fading-circle .sk-circle10:before{-webkit-animation-delay:-.3s;animation-delay:-.3s}.sk-fading-circle .sk-circle11:before{-webkit-animation-delay:-.2s;animation-delay:-.2s}.sk-fading-circle .sk-circle12:before{-webkit-animation-delay:-.1s;animation-delay:-.1s}@-webkit-keyframes sk-circleFadeDelay{0%,39%,to{opacity:0}40%{opacity:1}}@keyframes sk-circleFadeDelay{0%,39%,to{opacity:0}40%{opacity:1}}\n"] });
716
715
  }
717
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: LoadingSpinnerComponent, decorators: [{
716
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: LoadingSpinnerComponent, decorators: [{
718
717
  type: Component,
719
718
  args: [{ selector: 'rolatech-loading-spinner', standalone: true, template: "<div class=\"spinner-container flex flex-col\">\n <div class=\"sk-fading-circle\">\n <div class=\"sk-circle1 sk-circle\"></div>\n <div class=\"sk-circle2 sk-circle\"></div>\n <div class=\"sk-circle3 sk-circle\"></div>\n <div class=\"sk-circle4 sk-circle\"></div>\n <div class=\"sk-circle5 sk-circle\"></div>\n <div class=\"sk-circle6 sk-circle\"></div>\n <div class=\"sk-circle7 sk-circle\"></div>\n <div class=\"sk-circle8 sk-circle\"></div>\n <div class=\"sk-circle9 sk-circle\"></div>\n <div class=\"sk-circle10 sk-circle\"></div>\n <div class=\"sk-circle11 sk-circle\"></div>\n <div class=\"sk-circle12 sk-circle\"></div>\n </div>\n <div class=\"text-lg font-bold text-center\">{{ title }}</div>\n</div>\n", styles: [".spinner-container{display:flex;justify-content:center}.sk-fading-circle{margin:12px auto;width:40px;height:40px;position:relative}.sk-fading-circle .sk-circle{width:100%;height:100%;position:absolute;left:0;top:0}.sk-fading-circle .sk-circle:before{content:\"\";display:block;margin:0 auto;width:12%;height:15%;background-color:#333;border-radius:100%;-webkit-animation:sk-circleFadeDelay 1.2s infinite ease-in-out both;animation:sk-circleFadeDelay 1.2s infinite ease-in-out both}.sk-fading-circle .sk-circle2{-webkit-transform:rotate(30deg);-ms-transform:rotate(30deg);transform:rotate(30deg)}.sk-fading-circle .sk-circle3{-webkit-transform:rotate(60deg);-ms-transform:rotate(60deg);transform:rotate(60deg)}.sk-fading-circle .sk-circle4{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.sk-fading-circle .sk-circle5{-webkit-transform:rotate(120deg);-ms-transform:rotate(120deg);transform:rotate(120deg)}.sk-fading-circle .sk-circle6{-webkit-transform:rotate(150deg);-ms-transform:rotate(150deg);transform:rotate(150deg)}.sk-fading-circle .sk-circle7{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.sk-fading-circle .sk-circle8{-webkit-transform:rotate(210deg);-ms-transform:rotate(210deg);transform:rotate(210deg)}.sk-fading-circle .sk-circle9{-webkit-transform:rotate(240deg);-ms-transform:rotate(240deg);transform:rotate(240deg)}.sk-fading-circle .sk-circle10{-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.sk-fading-circle .sk-circle11{-webkit-transform:rotate(300deg);-ms-transform:rotate(300deg);transform:rotate(300deg)}.sk-fading-circle .sk-circle12{-webkit-transform:rotate(330deg);-ms-transform:rotate(330deg);transform:rotate(330deg)}.sk-fading-circle .sk-circle2:before{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.sk-fading-circle .sk-circle3:before{-webkit-animation-delay:-1s;animation-delay:-1s}.sk-fading-circle .sk-circle4:before{-webkit-animation-delay:-.9s;animation-delay:-.9s}.sk-fading-circle .sk-circle5:before{-webkit-animation-delay:-.8s;animation-delay:-.8s}.sk-fading-circle .sk-circle6:before{-webkit-animation-delay:-.7s;animation-delay:-.7s}.sk-fading-circle .sk-circle7:before{-webkit-animation-delay:-.6s;animation-delay:-.6s}.sk-fading-circle .sk-circle8:before{-webkit-animation-delay:-.5s;animation-delay:-.5s}.sk-fading-circle .sk-circle9:before{-webkit-animation-delay:-.4s;animation-delay:-.4s}.sk-fading-circle .sk-circle10:before{-webkit-animation-delay:-.3s;animation-delay:-.3s}.sk-fading-circle .sk-circle11:before{-webkit-animation-delay:-.2s;animation-delay:-.2s}.sk-fading-circle .sk-circle12:before{-webkit-animation-delay:-.1s;animation-delay:-.1s}@-webkit-keyframes sk-circleFadeDelay{0%,39%,to{opacity:0}40%{opacity:1}}@keyframes sk-circleFadeDelay{0%,39%,to{opacity:0}40%{opacity:1}}\n"] }]
720
719
  }], propDecorators: { title: [{
@@ -763,10 +762,10 @@ class MediaUploadComponent {
763
762
  };
764
763
  }
765
764
  }
766
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
767
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: MediaUploadComponent, isStandalone: true, selector: "rolatech-media-upload", inputs: { title: "title", subtitle: "subtitle", description: "description", isUploading: "isUploading" }, outputs: { mediaItemClick: "mediaItemClick", upload: "upload" }, ngImport: i0, template: "<div class=\"bg-gray-100 rounded p-6 min-h-[320px] flex items-center justify-center\">\n @if (isUploading) {\n <div class=\"flex flex-col items-center justify-center\">\n <div class=\"p-3\">\n <mat-icon>upload</mat-icon>\n </div>\n <div class=\"flex flex-col items-center justify-center\">\n <div class=\"font-lg font-bold py-3\">{{ title }}</div>\n <div class=\"font-sm text-gray-400\">{{ subtitle }}</div>\n <div class=\"font-sm text-gray-400\">{{ description }}</div>\n </div>\n <div class=\"py-2\">\n <input style=\"display: none\" type=\"file\" (change)=\"onUpload($event)\" #fileInput />\n <button mat-flat-button color=\"primary\" (click)=\"fileInput.click()\">\u4E0A\u4F20\u56FE\u7247</button>\n </div>\n </div>\n } @else {\n <rolatech-loading-spinner title=\"\u4E0A\u4F20\u4E2D\"></rolatech-loading-spinner>\n }\n</div>\n<div class=\"flex flex-row\">\n @for (media of media; track $index) {\n <div (click)=\"onMediaClick($index)\" class=\"inline-flex flex-row mt-3 mr-3 cursor-pointer rounded-md\">\n <img class=\"rounded-md aspect-video object-cover w-32\" [src]=\"media.url\" />\n </div>\n }\n</div>\n", styles: [".mat-icon{transform:scale(2)}\n"], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: LoadingSpinnerComponent, selector: "rolatech-loading-spinner", inputs: ["title"] }] });
765
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: MediaUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
766
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: MediaUploadComponent, isStandalone: true, selector: "rolatech-media-upload", inputs: { title: "title", subtitle: "subtitle", description: "description", isUploading: "isUploading" }, outputs: { mediaItemClick: "mediaItemClick", upload: "upload" }, ngImport: i0, template: "<div class=\"bg-gray-100 rounded p-6 min-h-[320px] flex items-center justify-center\">\n @if (isUploading) {\n <div class=\"flex flex-col items-center justify-center\">\n <div class=\"p-3\">\n <mat-icon>upload</mat-icon>\n </div>\n <div class=\"flex flex-col items-center justify-center\">\n <div class=\"font-lg font-bold py-3\">{{ title }}</div>\n <div class=\"font-sm text-gray-400\">{{ subtitle }}</div>\n <div class=\"font-sm text-gray-400\">{{ description }}</div>\n </div>\n <div class=\"py-2\">\n <input style=\"display: none\" type=\"file\" (change)=\"onUpload($event)\" #fileInput />\n <button mat-flat-button color=\"primary\" (click)=\"fileInput.click()\">\u4E0A\u4F20\u56FE\u7247</button>\n </div>\n </div>\n } @else {\n <rolatech-loading-spinner title=\"\u4E0A\u4F20\u4E2D\"></rolatech-loading-spinner>\n }\n</div>\n<div class=\"flex flex-row\">\n @for (media of media; track $index) {\n <div (click)=\"onMediaClick($index)\" class=\"inline-flex flex-row mt-3 mr-3 cursor-pointer rounded-md\">\n <img class=\"rounded-md aspect-video object-cover w-32\" [src]=\"media.url\" />\n </div>\n }\n</div>\n", styles: [".mat-icon{transform:scale(2)}\n"], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: LoadingSpinnerComponent, selector: "rolatech-loading-spinner", inputs: ["title"] }] });
768
767
  }
769
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaUploadComponent, decorators: [{
768
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: MediaUploadComponent, decorators: [{
770
769
  type: Component,
771
770
  args: [{ standalone: true, imports: [AngularCommonModule, AngularComponentsModule, LoadingSpinnerComponent], selector: 'rolatech-media-upload', template: "<div class=\"bg-gray-100 rounded p-6 min-h-[320px] flex items-center justify-center\">\n @if (isUploading) {\n <div class=\"flex flex-col items-center justify-center\">\n <div class=\"p-3\">\n <mat-icon>upload</mat-icon>\n </div>\n <div class=\"flex flex-col items-center justify-center\">\n <div class=\"font-lg font-bold py-3\">{{ title }}</div>\n <div class=\"font-sm text-gray-400\">{{ subtitle }}</div>\n <div class=\"font-sm text-gray-400\">{{ description }}</div>\n </div>\n <div class=\"py-2\">\n <input style=\"display: none\" type=\"file\" (change)=\"onUpload($event)\" #fileInput />\n <button mat-flat-button color=\"primary\" (click)=\"fileInput.click()\">\u4E0A\u4F20\u56FE\u7247</button>\n </div>\n </div>\n } @else {\n <rolatech-loading-spinner title=\"\u4E0A\u4F20\u4E2D\"></rolatech-loading-spinner>\n }\n</div>\n<div class=\"flex flex-row\">\n @for (media of media; track $index) {\n <div (click)=\"onMediaClick($index)\" class=\"inline-flex flex-row mt-3 mr-3 cursor-pointer rounded-md\">\n <img class=\"rounded-md aspect-video object-cover w-32\" [src]=\"media.url\" />\n </div>\n }\n</div>\n", styles: [".mat-icon{transform:scale(2)}\n"] }]
772
771
  }], propDecorators: { title: [{
@@ -790,10 +789,10 @@ class StorageBucketCreateComponent {
790
789
  ngDoCheck() {
791
790
  this.output.emit(this.name);
792
791
  }
793
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: StorageBucketCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
794
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: StorageBucketCreateComponent, isStandalone: true, selector: "rolatech-storage-bucket-create", inputs: { name: "name" }, outputs: { output: "output" }, ngImport: i0, template: "<div>\n <mat-form-field>\n <mat-label>\u540D\u79F0</mat-label>\n <input matInput placeholder=\"\u8F93\u5165\u540D\u79F0\" [(ngModel)]=\"name\" />\n </mat-form-field>\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
792
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: StorageBucketCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
793
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: StorageBucketCreateComponent, isStandalone: true, selector: "rolatech-storage-bucket-create", inputs: { name: "name" }, outputs: { output: "output" }, ngImport: i0, template: "<div>\n <mat-form-field>\n <mat-label>\u540D\u79F0</mat-label>\n <input matInput placeholder=\"\u8F93\u5165\u540D\u79F0\" [(ngModel)]=\"name\" />\n </mat-form-field>\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
795
794
  }
796
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: StorageBucketCreateComponent, decorators: [{
795
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: StorageBucketCreateComponent, decorators: [{
797
796
  type: Component,
798
797
  args: [{ selector: 'rolatech-storage-bucket-create', standalone: true, imports: [MatFormFieldModule, MatInputModule, FormsModule], template: "<div>\n <mat-form-field>\n <mat-label>\u540D\u79F0</mat-label>\n <input matInput placeholder=\"\u8F93\u5165\u540D\u79F0\" [(ngModel)]=\"name\" />\n </mat-form-field>\n</div>\n", styles: ["mat-form-field{width:100%}\n"] }]
799
798
  }], propDecorators: { name: [{
@@ -825,10 +824,10 @@ class StorageFileUploadComponent {
825
824
  removeFile() {
826
825
  this.file = null;
827
826
  }
828
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: StorageFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
829
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: StorageFileUploadComponent, isStandalone: true, selector: "rolatech-storage-file-upload", inputs: { title: "title" }, outputs: { output: "output" }, ngImport: i0, template: "<div>\n <mat-form-field>\n <mat-label>\u6807\u9898</mat-label>\n <input matInput placeholder=\"\u8F93\u5165\u6807\u9898\" [(ngModel)]=\"title\" />\n </mat-form-field>\n\n <div class=\"mt-2\">\n <input #fileInput class=\"hidden\" type=\"file\" (change)=\"selectFiles($event)\" />\n <button mat-raised-button (click)=\"fileInput.click()\">\u9009\u62E9\u6587\u4EF6</button>\n </div>\n @if (file) {\n <div class=\"p-2 flex justify-between items-center\">\n <div>{{ file.name }}</div>\n <button matSuffix mat-icon-button (click)=\"removeFile()\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n }\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
827
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: StorageFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
828
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: StorageFileUploadComponent, isStandalone: true, selector: "rolatech-storage-file-upload", inputs: { title: "title" }, outputs: { output: "output" }, ngImport: i0, template: "<div>\n <mat-form-field>\n <mat-label>\u6807\u9898</mat-label>\n <input matInput placeholder=\"\u8F93\u5165\u6807\u9898\" [(ngModel)]=\"title\" />\n </mat-form-field>\n\n <div class=\"mt-2\">\n <input #fileInput class=\"hidden\" type=\"file\" (change)=\"selectFiles($event)\" />\n <button mat-raised-button (click)=\"fileInput.click()\">\u9009\u62E9\u6587\u4EF6</button>\n </div>\n @if (file) {\n <div class=\"p-2 flex justify-between items-center\">\n <div>{{ file.name }}</div>\n <button matSuffix mat-icon-button (click)=\"removeFile()\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n }\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
830
829
  }
831
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: StorageFileUploadComponent, decorators: [{
830
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: StorageFileUploadComponent, decorators: [{
832
831
  type: Component,
833
832
  args: [{ selector: 'rolatech-storage-file-upload', standalone: true, imports: [MatFormFieldModule, MatInputModule, FormsModule, MatButtonModule, MatIconModule], template: "<div>\n <mat-form-field>\n <mat-label>\u6807\u9898</mat-label>\n <input matInput placeholder=\"\u8F93\u5165\u6807\u9898\" [(ngModel)]=\"title\" />\n </mat-form-field>\n\n <div class=\"mt-2\">\n <input #fileInput class=\"hidden\" type=\"file\" (change)=\"selectFiles($event)\" />\n <button mat-raised-button (click)=\"fileInput.click()\">\u9009\u62E9\u6587\u4EF6</button>\n </div>\n @if (file) {\n <div class=\"p-2 flex justify-between items-center\">\n <div>{{ file.name }}</div>\n <button matSuffix mat-icon-button (click)=\"removeFile()\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n }\n</div>\n", styles: ["mat-form-field{width:100%}\n"] }]
834
833
  }], propDecorators: { title: [{
@@ -845,10 +844,10 @@ class StorageFolderCreateComponent {
845
844
  ngDoCheck() {
846
845
  this.output.emit({ name: this.name, isPublic: this.isPublic });
847
846
  }
848
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: StorageFolderCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
849
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: StorageFolderCreateComponent, isStandalone: true, selector: "rolatech-storage-folder-create", inputs: { name: "name", isPublic: "isPublic" }, outputs: { output: "output" }, ngImport: i0, template: "<div>\n <mat-form-field>\n <mat-label>\u540D\u79F0</mat-label>\n <input matInput placeholder=\"\u8F93\u5165\u540D\u79F0\" [(ngModel)]=\"name\" />\n </mat-form-field>\n <div class=\"flex flex-col\">\n <mat-checkbox class=\"example-margin\" [(ngModel)]=\"isPublic\">\u516C\u5F00\u8D44\u6E90</mat-checkbox>\n <span class=\"text-sm text-gray-500 ml-2 mt-1\">\u6587\u4EF6\u5939\u4E3A\u56FE\u7247\u5185\u5BB9\u65F6, \u8BF7\u53D6\u6D88\u52FE\u9009\u6B64\u9879</span>\n </div>\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i4$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }] });
847
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: StorageFolderCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
848
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: StorageFolderCreateComponent, isStandalone: true, selector: "rolatech-storage-folder-create", inputs: { name: "name", isPublic: "isPublic" }, outputs: { output: "output" }, ngImport: i0, template: "<div>\n <mat-form-field>\n <mat-label>\u540D\u79F0</mat-label>\n <input matInput placeholder=\"\u8F93\u5165\u540D\u79F0\" [(ngModel)]=\"name\" />\n </mat-form-field>\n <div class=\"flex flex-col\">\n <mat-checkbox class=\"example-margin\" [(ngModel)]=\"isPublic\">\u516C\u5F00\u8D44\u6E90</mat-checkbox>\n <span class=\"text-sm text-gray-500 ml-2 mt-1\">\u6587\u4EF6\u5939\u4E3A\u56FE\u7247\u5185\u5BB9\u65F6, \u8BF7\u53D6\u6D88\u52FE\u9009\u6B64\u9879</span>\n </div>\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i4$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }] });
850
849
  }
851
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: StorageFolderCreateComponent, decorators: [{
850
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: StorageFolderCreateComponent, decorators: [{
852
851
  type: Component,
853
852
  args: [{ selector: 'rolatech-storage-folder-create', standalone: true, imports: [MatFormFieldModule, MatInputModule, FormsModule, MatCheckboxModule], template: "<div>\n <mat-form-field>\n <mat-label>\u540D\u79F0</mat-label>\n <input matInput placeholder=\"\u8F93\u5165\u540D\u79F0\" [(ngModel)]=\"name\" />\n </mat-form-field>\n <div class=\"flex flex-col\">\n <mat-checkbox class=\"example-margin\" [(ngModel)]=\"isPublic\">\u516C\u5F00\u8D44\u6E90</mat-checkbox>\n <span class=\"text-sm text-gray-500 ml-2 mt-1\">\u6587\u4EF6\u5939\u4E3A\u56FE\u7247\u5185\u5BB9\u65F6, \u8BF7\u53D6\u6D88\u52FE\u9009\u6B64\u9879</span>\n </div>\n</div>\n", styles: ["mat-form-field{width:100%}\n"] }]
854
853
  }], propDecorators: { name: [{
@@ -880,10 +879,10 @@ class WechatConnectDialogComponent {
880
879
  this.dialogRef.close();
881
880
  }
882
881
  }
883
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: WechatConnectDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
884
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: WechatConnectDialogComponent, isStandalone: true, selector: "rolatech-wechat-connect-dialog", host: { listeners: { "window:message": "onLogin($event)" } }, ngImport: i0, template: "<div class=\"flex flex-col p-3\">\n <div class=\"text-xl font-bold\">\u626B\u7801\u7ED1\u5B9A\u5FAE\u4FE1\uFF0C\u63D0\u5347\u8D26\u53F7\u5B89\u5168\u548C\u4F7F\u7528\u4FBF\u5229\u6027</div>\n <div class=\"w-[190px] h-[190px]\">\n <iframe [src]=\"urlSafe\" class=\"w-full h-full inline\" scrolling=\"no\" frameBorder=\"no\"></iframe>\n <div></div>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0}.normalPanel .panelContent{width:188px;height:188px}.normalPanel .wrp_code{position:relative;width:188px;height:188px;margin:0}.impowerBox .title,.normalPanel .info{display:none}.impowerBox .qrcode{margin-top:0;border:0;width:188px;height:188px}#MAXIM{content:\"veg20170418191511\"}mat-mdc-dialog-content mdc-dialog__content{padding:0}\n"] });
882
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: WechatConnectDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
883
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: WechatConnectDialogComponent, isStandalone: true, selector: "rolatech-wechat-connect-dialog", host: { listeners: { "window:message": "onLogin($event)" } }, ngImport: i0, template: "<div class=\"flex flex-col p-3\">\n <div class=\"text-xl font-bold\">\u626B\u7801\u7ED1\u5B9A\u5FAE\u4FE1\uFF0C\u63D0\u5347\u8D26\u53F7\u5B89\u5168\u548C\u4F7F\u7528\u4FBF\u5229\u6027</div>\n <div class=\"w-[190px] h-[190px]\">\n <iframe [src]=\"urlSafe\" class=\"w-full h-full inline\" scrolling=\"no\" frameBorder=\"no\"></iframe>\n <div></div>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0}.normalPanel .panelContent{width:188px;height:188px}.normalPanel .wrp_code{position:relative;width:188px;height:188px;margin:0}.impowerBox .title,.normalPanel .info{display:none}.impowerBox .qrcode{margin-top:0;border:0;width:188px;height:188px}#MAXIM{content:\"veg20170418191511\"}mat-mdc-dialog-content mdc-dialog__content{padding:0}\n"] });
885
884
  }
886
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: WechatConnectDialogComponent, decorators: [{
885
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: WechatConnectDialogComponent, decorators: [{
887
886
  type: Component,
888
887
  args: [{ selector: 'rolatech-wechat-connect-dialog', standalone: true, template: "<div class=\"flex flex-col p-3\">\n <div class=\"text-xl font-bold\">\u626B\u7801\u7ED1\u5B9A\u5FAE\u4FE1\uFF0C\u63D0\u5347\u8D26\u53F7\u5B89\u5168\u548C\u4F7F\u7528\u4FBF\u5229\u6027</div>\n <div class=\"w-[190px] h-[190px]\">\n <iframe [src]=\"urlSafe\" class=\"w-full h-full inline\" scrolling=\"no\" frameBorder=\"no\"></iframe>\n <div></div>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0}.normalPanel .panelContent{width:188px;height:188px}.normalPanel .wrp_code{position:relative;width:188px;height:188px;margin:0}.impowerBox .title,.normalPanel .info{display:none}.impowerBox .qrcode{margin-top:0;border:0;width:188px;height:188px}#MAXIM{content:\"veg20170418191511\"}mat-mdc-dialog-content mdc-dialog__content{padding:0}\n"] }]
889
888
  }], ctorParameters: () => [], propDecorators: { onLogin: [{
@@ -960,10 +959,10 @@ class MediaUploadDialogComponent {
960
959
  },
961
960
  });
962
961
  }
963
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaUploadDialogComponent, deps: [{ token: i1$1.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: i2$3.MediaService }], target: i0.ɵɵFactoryTarget.Component });
964
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: MediaUploadDialogComponent, isStandalone: true, selector: "rolatech-media-upload-dialog", ngImport: i0, template: "<mat-dialog-content>\n <div class=\"border-dashed border-2 border-gray-400 py-12 flex flex-col justify-center items-center\">\n <input #fileInput multiple class=\"hidden\" type=\"file\" (change)=\"selectFiles($event)\" />\n <button mat-button (click)=\"fileInput.click()\">\u4E0A\u4F20\u56FE\u7247</button>\n </div>\n <div class=\"mt-4\">\n <h2 class=\"\">\u9884\u89C8</h2>\n <div>\n <ul id=\"gallery\" class=\"flex flex-1 flex-wrap -m-1\">\n @for (item of preMedia; track item.url; let i = $index) {\n <li class=\"block p-1 w-1/2 sm:w-1/3 md:w-1/4 lg:w-1/6 xl:w-1/8 h-24\">\n <article\n tabindex=\"0\"\n [ngClass]=\"item.isUploading ? 'isUploading' : ''\"\n class=\"group hasImage w-full h-full rounded-md focus:outline-none focus:shadow-outline bg-gray-100 cursor-pointer relative text-transparent hover:text-white shadow-sm\"\n >\n <img [src]=\"item.url\" class=\"img-preview w-full h-full sticky object-cover rounded-md bg-fixed\" />\n <section class=\"flex flex-col rounded-md text-xs break-words w-full h-full z-20 absolute top-0 py-2 px-3\">\n @if (item.isUploading) {\n <div class=\"flex justify-center items-center w-full h-full\">\n <mat-spinner color=\"white\" diameter=\"28\"></mat-spinner>\n </div>\n } @else {\n <div class=\"flex\">\n <button (click)=\"removeImage(i)\" class=\"delete ml-auto focus:outline-none hover:bg-gray-300 p-1 rounded-md\">\n <svg\n class=\"pointer-events-none fill-current w-4 h-4 ml-auto\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n >\n <path\n class=\"pointer-events-none\"\n d=\"M3 6l3 18h12l3-18h-18zm19-4v2h-20v-2h5.711c.9 0 1.631-1.099 1.631-2h5.316c0 .901.73 2 1.631 2h5.711z\"\n />\n </svg>\n </button>\n </div>\n }\n </section>\n </article>\n </li>\n }\n </ul>\n </div>\n @if (preMedia.length <= 0) {\n <div class=\"flex flex-1 flex-wrap\">\n <div class=\"h-full w-full text-center flex flex-col justify-center items-center py-6\">\n <span class=\"text-small text-gray-500\">No files selected</span>\n </div>\n </div>\n }\n </div>\n</mat-dialog-content>\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close>\u53D6\u6D88</button>\n @if (preMedia.length <= 0) {\n <button mat-button>\u7B49\u5F85\u9009\u62E9</button>\n }\n @if (!isFinished && preMedia.length > 0) {\n <button mat-button (click)=\"uploadFiles()\">\u7ACB\u523B\u4E0A\u4F20</button>\n }\n @if (isFinished) {\n <button mat-button [mat-dialog-close]=\"media\">\u5B8C\u6210</button>\n }\n</mat-dialog-actions>\n", styles: [".hasImage:hover section{background-color:#05050566}.hasImage:hover button:hover{background:#05050573}.isUploading section{background-color:#05050566}\n"], dependencies: [{ kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i4$2.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
962
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: MediaUploadDialogComponent, deps: [{ token: i1$1.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: i2$3.MediaService }], target: i0.ɵɵFactoryTarget.Component });
963
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: MediaUploadDialogComponent, isStandalone: true, selector: "rolatech-media-upload-dialog", ngImport: i0, template: "<mat-dialog-content>\n <div class=\"border-dashed border-2 border-gray-400 py-12 flex flex-col justify-center items-center\">\n <input #fileInput multiple class=\"hidden\" type=\"file\" (change)=\"selectFiles($event)\" />\n <button mat-button (click)=\"fileInput.click()\">\u4E0A\u4F20\u56FE\u7247</button>\n </div>\n <div class=\"mt-4\">\n <h2 class=\"\">\u9884\u89C8</h2>\n <div>\n <ul id=\"gallery\" class=\"flex flex-1 flex-wrap -m-1\">\n @for (item of preMedia; track item.url; let i = $index) {\n <li class=\"block p-1 w-1/2 sm:w-1/3 md:w-1/4 lg:w-1/6 xl:w-1/8 h-24\">\n <article\n tabindex=\"0\"\n [ngClass]=\"item.isUploading ? 'isUploading' : ''\"\n class=\"group hasImage w-full h-full rounded-md focus:outline-none focus:shadow-outline bg-gray-100 cursor-pointer relative text-transparent hover:text-white shadow-sm\"\n >\n <img [src]=\"item.url\" class=\"img-preview w-full h-full sticky object-cover rounded-md bg-fixed\" />\n <section class=\"flex flex-col rounded-md text-xs break-words w-full h-full z-20 absolute top-0 py-2 px-3\">\n @if (item.isUploading) {\n <div class=\"flex justify-center items-center w-full h-full\">\n <mat-spinner color=\"white\" diameter=\"28\"></mat-spinner>\n </div>\n } @else {\n <div class=\"flex\">\n <button (click)=\"removeImage(i)\" class=\"delete ml-auto focus:outline-none hover:bg-gray-300 p-1 rounded-md\">\n <svg\n class=\"pointer-events-none fill-current w-4 h-4 ml-auto\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n >\n <path\n class=\"pointer-events-none\"\n d=\"M3 6l3 18h12l3-18h-18zm19-4v2h-20v-2h5.711c.9 0 1.631-1.099 1.631-2h5.316c0 .901.73 2 1.631 2h5.711z\"\n />\n </svg>\n </button>\n </div>\n }\n </section>\n </article>\n </li>\n }\n </ul>\n </div>\n @if (preMedia.length <= 0) {\n <div class=\"flex flex-1 flex-wrap\">\n <div class=\"h-full w-full text-center flex flex-col justify-center items-center py-6\">\n <span class=\"text-small text-gray-500\">No files selected</span>\n </div>\n </div>\n }\n </div>\n</mat-dialog-content>\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close>\u53D6\u6D88</button>\n @if (preMedia.length <= 0) {\n <button mat-button>\u7B49\u5F85\u9009\u62E9</button>\n }\n @if (!isFinished && preMedia.length > 0) {\n <button mat-button (click)=\"uploadFiles()\">\u7ACB\u523B\u4E0A\u4F20</button>\n }\n @if (isFinished) {\n <button mat-button [mat-dialog-close]=\"media\">\u5B8C\u6210</button>\n }\n</mat-dialog-actions>\n", styles: [".hasImage:hover section{background-color:#05050566}.hasImage:hover button:hover{background:#05050573}.isUploading section{background-color:#05050566}\n"], dependencies: [{ kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i4$2.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
965
964
  }
966
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaUploadDialogComponent, decorators: [{
965
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: MediaUploadDialogComponent, decorators: [{
967
966
  type: Component,
968
967
  args: [{ selector: 'rolatech-media-upload-dialog', standalone: true, imports: [MatDialogContent, MatButtonModule, NgClass, MatProgressSpinnerModule, MatDialogActions, MatDialogClose], template: "<mat-dialog-content>\n <div class=\"border-dashed border-2 border-gray-400 py-12 flex flex-col justify-center items-center\">\n <input #fileInput multiple class=\"hidden\" type=\"file\" (change)=\"selectFiles($event)\" />\n <button mat-button (click)=\"fileInput.click()\">\u4E0A\u4F20\u56FE\u7247</button>\n </div>\n <div class=\"mt-4\">\n <h2 class=\"\">\u9884\u89C8</h2>\n <div>\n <ul id=\"gallery\" class=\"flex flex-1 flex-wrap -m-1\">\n @for (item of preMedia; track item.url; let i = $index) {\n <li class=\"block p-1 w-1/2 sm:w-1/3 md:w-1/4 lg:w-1/6 xl:w-1/8 h-24\">\n <article\n tabindex=\"0\"\n [ngClass]=\"item.isUploading ? 'isUploading' : ''\"\n class=\"group hasImage w-full h-full rounded-md focus:outline-none focus:shadow-outline bg-gray-100 cursor-pointer relative text-transparent hover:text-white shadow-sm\"\n >\n <img [src]=\"item.url\" class=\"img-preview w-full h-full sticky object-cover rounded-md bg-fixed\" />\n <section class=\"flex flex-col rounded-md text-xs break-words w-full h-full z-20 absolute top-0 py-2 px-3\">\n @if (item.isUploading) {\n <div class=\"flex justify-center items-center w-full h-full\">\n <mat-spinner color=\"white\" diameter=\"28\"></mat-spinner>\n </div>\n } @else {\n <div class=\"flex\">\n <button (click)=\"removeImage(i)\" class=\"delete ml-auto focus:outline-none hover:bg-gray-300 p-1 rounded-md\">\n <svg\n class=\"pointer-events-none fill-current w-4 h-4 ml-auto\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n >\n <path\n class=\"pointer-events-none\"\n d=\"M3 6l3 18h12l3-18h-18zm19-4v2h-20v-2h5.711c.9 0 1.631-1.099 1.631-2h5.316c0 .901.73 2 1.631 2h5.711z\"\n />\n </svg>\n </button>\n </div>\n }\n </section>\n </article>\n </li>\n }\n </ul>\n </div>\n @if (preMedia.length <= 0) {\n <div class=\"flex flex-1 flex-wrap\">\n <div class=\"h-full w-full text-center flex flex-col justify-center items-center py-6\">\n <span class=\"text-small text-gray-500\">No files selected</span>\n </div>\n </div>\n }\n </div>\n</mat-dialog-content>\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close>\u53D6\u6D88</button>\n @if (preMedia.length <= 0) {\n <button mat-button>\u7B49\u5F85\u9009\u62E9</button>\n }\n @if (!isFinished && preMedia.length > 0) {\n <button mat-button (click)=\"uploadFiles()\">\u7ACB\u523B\u4E0A\u4F20</button>\n }\n @if (isFinished) {\n <button mat-button [mat-dialog-close]=\"media\">\u5B8C\u6210</button>\n }\n</mat-dialog-actions>\n", styles: [".hasImage:hover section{background-color:#05050566}.hasImage:hover button:hover{background:#05050573}.isUploading section{background-color:#05050566}\n"] }]
969
968
  }], ctorParameters: () => [{ type: i1$1.MatDialogRef }, { type: undefined, decorators: [{
@@ -974,10 +973,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
974
973
  class SpacerComponent {
975
974
  constructor() { }
976
975
  ngOnInit() { }
977
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: SpacerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
978
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: SpacerComponent, isStandalone: true, selector: "rolatech-spacer", ngImport: i0, template: "<span class=\"app-spacer\"></span>\n", styles: [":host{flex:1 1 auto}.app-spacer{flex:1 1 auto}\n"] });
976
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: SpacerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
977
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: SpacerComponent, isStandalone: true, selector: "rolatech-spacer", ngImport: i0, template: "<span class=\"app-spacer\"></span>\n", styles: [":host{flex:1 1 auto}.app-spacer{flex:1 1 auto}\n"] });
979
978
  }
980
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: SpacerComponent, decorators: [{
979
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: SpacerComponent, decorators: [{
981
980
  type: Component,
982
981
  args: [{ selector: 'rolatech-spacer', standalone: true, template: "<span class=\"app-spacer\"></span>\n", styles: [":host{flex:1 1 auto}.app-spacer{flex:1 1 auto}\n"] }]
983
982
  }], ctorParameters: () => [] });
@@ -994,10 +993,10 @@ class MediaListComponent {
994
993
  onUpload(event) {
995
994
  this.upload.emit(event);
996
995
  }
997
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
998
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: MediaListComponent, isStandalone: true, selector: "rolatech-media-list", inputs: { isUploading: "isUploading", media: "media", showAdd: "showAdd" }, outputs: { mediaItemClick: "mediaItemClick", upload: "upload" }, ngImport: i0, template: "<div class=\"flex flex-row flex-wrap box-border items-center\">\n <div class=\"progress-bar\">\n @if (isUploading) {\n <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n }\n </div>\n <div class=\"flex flex-row flex-wrap box-border items-center gap-2\">\n <ng-content></ng-content>\n <div>\n <input style=\"display: none\" type=\"file\" accept=\"image/*, video/*\" (change)=\"onUpload($event)\" #fileInput />\n @if (showAdd) {\n <div class=\"add-button\">\n <img (click)=\"fileInput.click()\" class=\"tile-media\" src=\"assets/images/baseline_add_black_48dp.png\" alt=\"add image\" />\n </div>\n }\n </div>\n </div>\n</div>\n", styles: [".progress-bar{display:block;min-height:6px;width:100%;padding:4px 0}.add-button{cursor:pointer;position:relative;box-sizing:border-box;padding:2px}.tile-media{height:80px;width:80px;object-fit:contain;cursor:pointer;padding:6px;position:relative;box-sizing:border-box}app-media-list-item:before{border-radius:12px}\n"], dependencies: [{ kind: "ngmodule", type: MatProgressBarModule }, { kind: "component", type: i1$3.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }] });
996
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: MediaListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
997
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: MediaListComponent, isStandalone: true, selector: "rolatech-media-list", inputs: { isUploading: "isUploading", media: "media", showAdd: "showAdd" }, outputs: { mediaItemClick: "mediaItemClick", upload: "upload" }, ngImport: i0, template: "<div class=\"flex flex-row flex-wrap box-border items-center\">\n <div class=\"progress-bar\">\n @if (isUploading) {\n <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n }\n </div>\n <div class=\"flex flex-row flex-wrap box-border items-center gap-2\">\n <ng-content></ng-content>\n <div>\n <input style=\"display: none\" type=\"file\" accept=\"image/*, video/*\" (change)=\"onUpload($event)\" #fileInput />\n @if (showAdd) {\n <div class=\"add-button\">\n <img (click)=\"fileInput.click()\" class=\"tile-media\" src=\"assets/images/baseline_add_black_48dp.png\" alt=\"add image\" />\n </div>\n }\n </div>\n </div>\n</div>\n", styles: [".progress-bar{display:block;min-height:6px;width:100%;padding:4px 0}.add-button{cursor:pointer;position:relative;box-sizing:border-box;padding:2px}.tile-media{height:80px;width:80px;object-fit:contain;cursor:pointer;padding:6px;position:relative;box-sizing:border-box}app-media-list-item:before{border-radius:12px}\n"], dependencies: [{ kind: "ngmodule", type: MatProgressBarModule }, { kind: "component", type: i1$3.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }] });
999
998
  }
1000
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaListComponent, decorators: [{
999
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: MediaListComponent, decorators: [{
1001
1000
  type: Component,
1002
1001
  args: [{ selector: 'rolatech-media-list', standalone: true, imports: [MatProgressBarModule], template: "<div class=\"flex flex-row flex-wrap box-border items-center\">\n <div class=\"progress-bar\">\n @if (isUploading) {\n <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n }\n </div>\n <div class=\"flex flex-row flex-wrap box-border items-center gap-2\">\n <ng-content></ng-content>\n <div>\n <input style=\"display: none\" type=\"file\" accept=\"image/*, video/*\" (change)=\"onUpload($event)\" #fileInput />\n @if (showAdd) {\n <div class=\"add-button\">\n <img (click)=\"fileInput.click()\" class=\"tile-media\" src=\"assets/images/baseline_add_black_48dp.png\" alt=\"add image\" />\n </div>\n }\n </div>\n </div>\n</div>\n", styles: [".progress-bar{display:block;min-height:6px;width:100%;padding:4px 0}.add-button{cursor:pointer;position:relative;box-sizing:border-box;padding:2px}.tile-media{height:80px;width:80px;object-fit:contain;cursor:pointer;padding:6px;position:relative;box-sizing:border-box}app-media-list-item:before{border-radius:12px}\n"] }]
1003
1002
  }], propDecorators: { isUploading: [{
@@ -1024,10 +1023,10 @@ class MediaListItemComponent {
1024
1023
  onDeleteMedia(media) {
1025
1024
  this.deleteMedia.emit(media);
1026
1025
  }
1027
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaListItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1028
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: MediaListItemComponent, isStandalone: true, selector: "rolatech-media-list-item", inputs: { media: "media", uploadProgress: "uploadProgress" }, outputs: { mediaItemClick: "mediaItemClick", deleteMedia: "deleteMedia" }, ngImport: i0, template: "<div\n class=\"media-list-item relative hasImage focus:outline-none focus:shadow-outline bg-gray-100 cursor-pointer text-transparent hover:text-white shadow-sm\"\n>\n <div class=\"absolute z-30 right-0\">\n <div class=\"flex-1\"></div>\n <div>\n <button mat-icon-button [matMenuTriggerFor]=\"beforeMenu\" class=\"ml-auto focus:outline-none hover:bg-gray-300 p-1\">\n <mat-icon>more_vert</mat-icon>\n </button>\n <mat-menu #beforeMenu=\"matMenu\" xPosition=\"before\">\n <button mat-menu-item (click)=\"onDeleteMedia(media)\">\n <span>\u5220\u9664</span>\n </button>\n </mat-menu>\n </div>\n </div>\n <div id=\"thumbnail\" class=\"thumbnail\">\n <img class=\"tile-media\" (click)=\"onMediaItemClick(media)\" [src]=\"media.url\" [alt]=\"media.alt\" />\n </div>\n <section\n (click)=\"onMediaItemClick(media)\"\n class=\"flex flex-col text-xs break-words w-full h-full z-20 absolute top-0\"\n ></section>\n</div>\n", styles: [".media-list-item{cursor:pointer;box-sizing:border-box;height:128px;width:228px;display:inline-block;display:block;position:relative;flex:none}.tile-media{height:100%;width:100%;object-fit:cover;display:inline-block;background-color:transparent}#thumbnail.thumbnail{height:100%;position:relative;margin-left:auto;margin-right:auto;overflow:hidden;display:block;position:absolute;border-radius:8px;inset:0}.hasImage:hover section{background-color:#05050566}.hasImage:hover button:hover{background:#05050573}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
1026
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: MediaListItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1027
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: MediaListItemComponent, isStandalone: true, selector: "rolatech-media-list-item", inputs: { media: "media", uploadProgress: "uploadProgress" }, outputs: { mediaItemClick: "mediaItemClick", deleteMedia: "deleteMedia" }, ngImport: i0, template: "<div\n class=\"media-list-item relative hasImage focus:outline-none focus:shadow-outline bg-gray-100 cursor-pointer text-transparent hover:text-white shadow-sm\"\n>\n <div class=\"absolute z-30 right-0\">\n <div class=\"flex-1\"></div>\n <div>\n <button mat-icon-button [matMenuTriggerFor]=\"beforeMenu\" class=\"ml-auto focus:outline-none hover:bg-gray-300 p-1\">\n <mat-icon>more_vert</mat-icon>\n </button>\n <mat-menu #beforeMenu=\"matMenu\" xPosition=\"before\">\n <button mat-menu-item (click)=\"onDeleteMedia(media)\">\n <span>\u5220\u9664</span>\n </button>\n </mat-menu>\n </div>\n </div>\n <div id=\"thumbnail\" class=\"thumbnail\">\n <img class=\"tile-media\" (click)=\"onMediaItemClick(media)\" [src]=\"media.url\" [alt]=\"media.alt\" />\n </div>\n <section\n (click)=\"onMediaItemClick(media)\"\n class=\"flex flex-col text-xs break-words w-full h-full z-20 absolute top-0\"\n ></section>\n</div>\n", styles: [".media-list-item{cursor:pointer;box-sizing:border-box;height:128px;width:228px;display:inline-block;display:block;position:relative;flex:none}.tile-media{height:100%;width:100%;object-fit:cover;display:inline-block;background-color:transparent}#thumbnail.thumbnail{height:100%;position:relative;margin-left:auto;margin-right:auto;overflow:hidden;display:block;position:absolute;border-radius:8px;inset:0}.hasImage:hover section{background-color:#05050566}.hasImage:hover button:hover{background:#05050573}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
1029
1028
  }
1030
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaListItemComponent, decorators: [{
1029
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: MediaListItemComponent, decorators: [{
1031
1030
  type: Component,
1032
1031
  args: [{ selector: 'rolatech-media-list-item', standalone: true, imports: [MatButtonModule, MatMenuModule, MatIconModule], template: "<div\n class=\"media-list-item relative hasImage focus:outline-none focus:shadow-outline bg-gray-100 cursor-pointer text-transparent hover:text-white shadow-sm\"\n>\n <div class=\"absolute z-30 right-0\">\n <div class=\"flex-1\"></div>\n <div>\n <button mat-icon-button [matMenuTriggerFor]=\"beforeMenu\" class=\"ml-auto focus:outline-none hover:bg-gray-300 p-1\">\n <mat-icon>more_vert</mat-icon>\n </button>\n <mat-menu #beforeMenu=\"matMenu\" xPosition=\"before\">\n <button mat-menu-item (click)=\"onDeleteMedia(media)\">\n <span>\u5220\u9664</span>\n </button>\n </mat-menu>\n </div>\n </div>\n <div id=\"thumbnail\" class=\"thumbnail\">\n <img class=\"tile-media\" (click)=\"onMediaItemClick(media)\" [src]=\"media.url\" [alt]=\"media.alt\" />\n </div>\n <section\n (click)=\"onMediaItemClick(media)\"\n class=\"flex flex-col text-xs break-words w-full h-full z-20 absolute top-0\"\n ></section>\n</div>\n", styles: [".media-list-item{cursor:pointer;box-sizing:border-box;height:128px;width:228px;display:inline-block;display:block;position:relative;flex:none}.tile-media{height:100%;width:100%;object-fit:cover;display:inline-block;background-color:transparent}#thumbnail.thumbnail{height:100%;position:relative;margin-left:auto;margin-right:auto;overflow:hidden;display:block;position:absolute;border-radius:8px;inset:0}.hasImage:hover section{background-color:#05050566}.hasImage:hover button:hover{background:#05050573}\n"] }]
1033
1032
  }], propDecorators: { media: [{
@@ -1058,10 +1057,10 @@ class NotFoundComponent {
1058
1057
  }
1059
1058
  });
1060
1059
  }
1061
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: NotFoundComponent, deps: [{ token: i1$4.Router }], target: i0.ɵɵFactoryTarget.Component });
1062
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: NotFoundComponent, isStandalone: true, selector: "rolatech-not-found", ngImport: i0, template: "<div class=\"not-found-content\">\n <p>\n <b>404.</b>\n <ins>That\u2019s an error.</ins>\n </p>\n <p>\n The requested URL <code>{{ url }}</code> not found on this server.\n </p>\n <a href=\"/\">return home</a>\n</div>\n", styles: [":host{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}p{margin:11px 0 22px;overflow:hidden}ins{color:#777;text-decoration:none}.not-found-content{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}\n"] });
1060
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: NotFoundComponent, deps: [{ token: i1$4.Router }], target: i0.ɵɵFactoryTarget.Component });
1061
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: NotFoundComponent, isStandalone: true, selector: "rolatech-not-found", ngImport: i0, template: "<div class=\"not-found-content\">\n <p>\n <b>404.</b>\n <ins>That\u2019s an error.</ins>\n </p>\n <p>\n The requested URL <code>{{ url }}</code> not found on this server.\n </p>\n <a href=\"/\">return home</a>\n</div>\n", styles: [":host{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}p{margin:11px 0 22px;overflow:hidden}ins{color:#777;text-decoration:none}.not-found-content{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}\n"] });
1063
1062
  }
1064
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: NotFoundComponent, decorators: [{
1063
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: NotFoundComponent, decorators: [{
1065
1064
  type: Component,
1066
1065
  args: [{ selector: 'rolatech-not-found', standalone: true, template: "<div class=\"not-found-content\">\n <p>\n <b>404.</b>\n <ins>That\u2019s an error.</ins>\n </p>\n <p>\n The requested URL <code>{{ url }}</code> not found on this server.\n </p>\n <a href=\"/\">return home</a>\n</div>\n", styles: [":host{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}p{margin:11px 0 22px;overflow:hidden}ins{color:#777;text-decoration:none}.not-found-content{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}\n"] }]
1067
1066
  }], ctorParameters: () => [{ type: i1$4.Router }] });
@@ -1072,10 +1071,10 @@ class ConfirmationDialogComponent {
1072
1071
  onNoClick() {
1073
1072
  this.dialogRef.close();
1074
1073
  }
1075
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ConfirmationDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1076
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: ConfirmationDialogComponent, isStandalone: true, selector: "rolatech-confirmation-dialog", ngImport: i0, template: "@if (data.title) {\n <h2 mat-dialog-title>{{ data.title }}</h2>\n}\n<div mat-dialog-content>\n {{ data.message }}\n</div>\n<div mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close>\u53D6\u6D88</button>\n <button mat-button [mat-dialog-close]=\"true\" cdkFocusInitial>\u786E\u5B9A</button>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
1074
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ConfirmationDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1075
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: ConfirmationDialogComponent, isStandalone: true, selector: "rolatech-confirmation-dialog", ngImport: i0, template: "@if (data.title) {\n <h2 mat-dialog-title>{{ data.title }}</h2>\n}\n<div mat-dialog-content>\n {{ data.message }}\n</div>\n<div mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close>\u53D6\u6D88</button>\n <button mat-button [mat-dialog-close]=\"true\" cdkFocusInitial>\u786E\u5B9A</button>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
1077
1076
  }
1078
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ConfirmationDialogComponent, decorators: [{
1077
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ConfirmationDialogComponent, decorators: [{
1079
1078
  type: Component,
1080
1079
  args: [{ selector: 'rolatech-confirmation-dialog', standalone: true, imports: [MatDialogTitle, MatDialogContent, MatDialogActions, MatButtonModule, MatDialogClose], template: "@if (data.title) {\n <h2 mat-dialog-title>{{ data.title }}</h2>\n}\n<div mat-dialog-content>\n {{ data.message }}\n</div>\n<div mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close>\u53D6\u6D88</button>\n <button mat-button [mat-dialog-close]=\"true\" cdkFocusInitial>\u786E\u5B9A</button>\n</div>\n" }]
1081
1080
  }] });
@@ -1094,5 +1093,5 @@ class BaseComponent {
1094
1093
  * Generated bundle index. Do not edit.
1095
1094
  */
1096
1095
 
1097
- export { AngularComponentsModule, AppContainerComponent, AppDrawerComponent, AppFooterComponent, AppLayoutComponent, AppPageComponent, BaseComponent, ConfirmationDialogComponent, ConsoleLayoutComponent, FolderComponent, IconButtonComponent, IconComponent, LoadingSpinnerComponent, MaterialModule, MediaListComponent, MediaListItemComponent, MediaPreviewDialogComponent, MediaUploadComponent, MediaUploadDialogComponent, MenuUserComponent, NotFoundComponent, SpacerComponent, StorageBucketCreateComponent, StorageFileUploadComponent, StorageFolderCreateComponent, TitleComponent, TopbarAvatarMenuComponent, TopbarComponent, WechatConnectDialogComponent };
1096
+ export { APP_LAYOUT, AngularComponentsModule, AppContainerComponent, AppDrawerComponent, AppFooterComponent, AppLayoutComponent, AppPageComponent, BaseComponent, ConfirmationDialogComponent, ConsoleLayoutComponent, FolderComponent, IconButtonComponent, IconComponent, LoadingSpinnerComponent, MaterialModule, MediaListComponent, MediaListItemComponent, MediaPreviewDialogComponent, MediaUploadComponent, MediaUploadDialogComponent, MenuUserComponent, NotFoundComponent, SpacerComponent, StorageBucketCreateComponent, StorageFileUploadComponent, StorageFolderCreateComponent, TitleComponent, TopbarAvatarMenuComponent, TopbarComponent, WechatConnectDialogComponent, provideAngularLayout };
1098
1097
  //# sourceMappingURL=rolatech-angular-components.mjs.map