@rolatech/angular-components 17.2.10 → 17.2.11
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.
- package/esm2022/index.mjs +5 -1
- package/esm2022/lib/app-container/app-container.component.mjs +3 -3
- package/esm2022/lib/app-drawer/app-drawer.component.mjs +5 -6
- package/esm2022/lib/app-layout/app-layout.component.mjs +2 -2
- package/esm2022/lib/icon/icon.component.mjs +17 -0
- package/esm2022/lib/icon-button/icon-button.component.mjs +13 -0
- package/esm2022/lib/title/title.component.mjs +12 -0
- package/esm2022/lib/topbar/topbar.component.mjs +4 -4
- package/fesm2022/rolatech-angular-components.mjs +66 -35
- package/fesm2022/rolatech-angular-components.mjs.map +1 -1
- package/index.d.ts +4 -0
- package/lib/icon/icon.component.d.ts +6 -0
- package/lib/icon-button/icon-button.component.d.ts +5 -0
- package/lib/title/title.component.d.ts +5 -0
- package/package.json +1 -1
- package/themes/_default.scss +1 -1
|
@@ -1,21 +1,21 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Component, EventEmitter, inject, ElementRef, Renderer2, PLATFORM_ID,
|
|
2
|
+
import { Component, ViewEncapsulation, HostBinding, EventEmitter, inject, ElementRef, Renderer2, PLATFORM_ID, Input, Output, viewChild, ViewChild, 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
|
-
import { MatSidenavModule, MatSidenav } from '@angular/material/sidenav';
|
|
6
|
-
import { MatNavList, MatListModule } from '@angular/material/list';
|
|
7
5
|
import * as i2$1 from '@angular/material/icon';
|
|
8
6
|
import { MatIcon, MatIconModule } from '@angular/material/icon';
|
|
9
|
-
import
|
|
7
|
+
import { MatSidenavModule, MatSidenav } from '@angular/material/sidenav';
|
|
8
|
+
import { MatNavList, MatListModule } from '@angular/material/list';
|
|
9
|
+
import * as i1$4 from '@angular/router';
|
|
10
10
|
import { RouterLink, RouterLinkActive, RouterOutlet, RouterEvent, NavigationEnd, ActivatedRoute, Router } from '@angular/router';
|
|
11
|
-
import * as
|
|
12
|
-
import { MatButtonModule
|
|
11
|
+
import * as i4 from '@angular/material/button';
|
|
12
|
+
import { MatButtonModule } from '@angular/material/button';
|
|
13
13
|
import { BreakpointObserver, Breakpoints, LayoutModule } from '@angular/cdk/layout';
|
|
14
14
|
import { map, shareReplay, filter } from 'rxjs';
|
|
15
15
|
import { APP_CONFIG, AngularCommonModule } from '@rolatech/angular-common';
|
|
16
16
|
import * as i2 from '@angular/material/menu';
|
|
17
17
|
import { MatMenuModule } from '@angular/material/menu';
|
|
18
|
-
import * as i1$
|
|
18
|
+
import * as i1$1 from '@angular/material/dialog';
|
|
19
19
|
import { MAT_DIALOG_DATA, MatDialogModule, MatDialog, MatDialogRef, MatDialogContent, MatDialogActions, MatDialogClose, MatDialogTitle } from '@angular/material/dialog';
|
|
20
20
|
import * as i3 from '@angular/material/divider';
|
|
21
21
|
import { MatDividerModule } from '@angular/material/divider';
|
|
@@ -32,21 +32,21 @@ import { MatBadgeModule } from '@angular/material/badge';
|
|
|
32
32
|
import { MatBottomSheetModule } from '@angular/material/bottom-sheet';
|
|
33
33
|
import { MatButtonToggleModule } from '@angular/material/button-toggle';
|
|
34
34
|
import { MatCardModule } from '@angular/material/card';
|
|
35
|
-
import * as i4 from '@angular/material/checkbox';
|
|
35
|
+
import * as i4$1 from '@angular/material/checkbox';
|
|
36
36
|
import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
37
37
|
import { MatChipsModule } from '@angular/material/chips';
|
|
38
38
|
import { MatNativeDateModule, MatRippleModule } from '@angular/material/core';
|
|
39
39
|
import { MatDatepickerModule } from '@angular/material/datepicker';
|
|
40
40
|
import { MatExpansionModule } from '@angular/material/expansion';
|
|
41
|
-
import * as i1$
|
|
41
|
+
import * as i1$2 from '@angular/material/form-field';
|
|
42
42
|
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
43
43
|
import { MatGridListModule } from '@angular/material/grid-list';
|
|
44
44
|
import * as i2$2 from '@angular/material/input';
|
|
45
45
|
import { MatInputModule } from '@angular/material/input';
|
|
46
46
|
import { MatPaginatorModule } from '@angular/material/paginator';
|
|
47
|
-
import * as i1$
|
|
47
|
+
import * as i1$3 from '@angular/material/progress-bar';
|
|
48
48
|
import { MatProgressBarModule } from '@angular/material/progress-bar';
|
|
49
|
-
import * as i4$
|
|
49
|
+
import * as i4$2 from '@angular/material/progress-spinner';
|
|
50
50
|
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
|
|
51
51
|
import { MatRadioModule } from '@angular/material/radio';
|
|
52
52
|
import { MatSelectModule } from '@angular/material/select';
|
|
@@ -66,13 +66,44 @@ import * as i3$1 from '@angular/forms';
|
|
|
66
66
|
import { FormsModule } from '@angular/forms';
|
|
67
67
|
import { DomSanitizer, Title } from '@angular/platform-browser';
|
|
68
68
|
|
|
69
|
+
class IconComponent {
|
|
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 });
|
|
73
|
+
}
|
|
74
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: IconComponent, decorators: [{
|
|
75
|
+
type: Component,
|
|
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
|
+
}], propDecorators: { hasClass: [{
|
|
78
|
+
type: HostBinding,
|
|
79
|
+
args: ['class.rolatech-icon']
|
|
80
|
+
}] } });
|
|
81
|
+
|
|
82
|
+
class IconButtonComponent {
|
|
83
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: IconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
84
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: IconButtonComponent, isStandalone: true, selector: "rolatech-icon-button", 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: ["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" }] });
|
|
85
|
+
}
|
|
86
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: IconButtonComponent, decorators: [{
|
|
87
|
+
type: Component,
|
|
88
|
+
args: [{ selector: 'rolatech-icon-button', standalone: true, imports: [CommonModule, IconComponent], 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: ["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"] }]
|
|
89
|
+
}] });
|
|
90
|
+
|
|
91
|
+
class TitleComponent {
|
|
92
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: TitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
93
|
+
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 }] });
|
|
94
|
+
}
|
|
95
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: TitleComponent, decorators: [{
|
|
96
|
+
type: Component,
|
|
97
|
+
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" }]
|
|
98
|
+
}] });
|
|
99
|
+
|
|
69
100
|
class AppContainerComponent {
|
|
70
101
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
71
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: AppContainerComponent, isStandalone: true, selector: "rolatech-app-container", ngImport: i0, template: "<div>\n <ng-content></ng-content>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
102
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: AppContainerComponent, isStandalone: true, selector: "rolatech-app-container", ngImport: i0, template: "<div class=\"px-4 xl:max-w-[1100px] 2xl:max-w-[1400px] m-auto\">\n <ng-content></ng-content>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
72
103
|
}
|
|
73
104
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppContainerComponent, decorators: [{
|
|
74
105
|
type: Component,
|
|
75
|
-
args: [{ selector: 'rolatech-app-container', standalone: true, imports: [CommonModule], template: "<div>\n <ng-content></ng-content>\n</div>\n" }]
|
|
106
|
+
args: [{ selector: 'rolatech-app-container', standalone: true, imports: [CommonModule], template: "<div class=\"px-4 xl:max-w-[1100px] 2xl:max-w-[1400px] m-auto\">\n <ng-content></ng-content>\n</div>\n" }]
|
|
76
107
|
}] });
|
|
77
108
|
|
|
78
109
|
class AppContainerContentComponent {
|
|
@@ -126,11 +157,11 @@ class TopbarComponent {
|
|
|
126
157
|
this.toggle.emit();
|
|
127
158
|
}
|
|
128
159
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: TopbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
129
|
-
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 sm:
|
|
160
|
+
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 });
|
|
130
161
|
}
|
|
131
162
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: TopbarComponent, decorators: [{
|
|
132
163
|
type: Component,
|
|
133
|
-
args: [{ selector: 'rolatech-topbar', standalone: true, imports: [CommonModule, RouterLink, MatButtonModule, MatIcon], encapsulation: ViewEncapsulation.None, template: "<div class=\"h-14 sm:
|
|
164
|
+
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"] }]
|
|
134
165
|
}], ctorParameters: () => [], propDecorators: { hostId: [{
|
|
135
166
|
type: HostBinding,
|
|
136
167
|
args: ['id']
|
|
@@ -218,11 +249,11 @@ class AppDrawerComponent {
|
|
|
218
249
|
}
|
|
219
250
|
}
|
|
220
251
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
221
|
-
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 <
|
|
252
|
+
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\">{{ 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 });
|
|
222
253
|
}
|
|
223
254
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppDrawerComponent, decorators: [{
|
|
224
255
|
type: Component,
|
|
225
|
-
args: [{ selector: 'rolatech-app-drawer', standalone: true, imports: [CommonModule, MatNavList,
|
|
256
|
+
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\">{{ 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"] }]
|
|
226
257
|
}], propDecorators: { opened: [{
|
|
227
258
|
type: Input
|
|
228
259
|
}], links: [{
|
|
@@ -273,7 +304,7 @@ class AppLayoutComponent {
|
|
|
273
304
|
}
|
|
274
305
|
}
|
|
275
306
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
276
|
-
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:
|
|
307
|
+
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 });
|
|
277
308
|
}
|
|
278
309
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppLayoutComponent, decorators: [{
|
|
279
310
|
type: Component,
|
|
@@ -291,7 +322,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
|
|
|
291
322
|
MatSidenavModule,
|
|
292
323
|
TopbarComponent,
|
|
293
324
|
AppDrawerComponent,
|
|
294
|
-
], 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:
|
|
325
|
+
], 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"] }]
|
|
295
326
|
}], propDecorators: { hostId: [{
|
|
296
327
|
type: HostBinding,
|
|
297
328
|
args: ['id']
|
|
@@ -436,8 +467,8 @@ class MediaPreviewDialogComponent {
|
|
|
436
467
|
this.prevDisabled = this.selected === 0;
|
|
437
468
|
this.nextDisabled = this.selected === this.data.media.length - 1;
|
|
438
469
|
}
|
|
439
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaPreviewDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1$
|
|
440
|
-
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:
|
|
470
|
+
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 });
|
|
471
|
+
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"] }] });
|
|
441
472
|
}
|
|
442
473
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaPreviewDialogComponent, decorators: [{
|
|
443
474
|
type: Component,
|
|
@@ -445,7 +476,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
|
|
|
445
476
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
446
477
|
type: Inject,
|
|
447
478
|
args: [MAT_DIALOG_DATA]
|
|
448
|
-
}] }, { type: i1$
|
|
479
|
+
}] }, { type: i1$1.MatDialogRef }] });
|
|
449
480
|
|
|
450
481
|
const MAT_MODULE = [
|
|
451
482
|
A11yModule,
|
|
@@ -725,7 +756,7 @@ class MediaUploadComponent {
|
|
|
725
756
|
}
|
|
726
757
|
}
|
|
727
758
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
728
|
-
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:
|
|
759
|
+
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"] }] });
|
|
729
760
|
}
|
|
730
761
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaUploadComponent, decorators: [{
|
|
731
762
|
type: Component,
|
|
@@ -752,7 +783,7 @@ class StorageBucketCreateComponent {
|
|
|
752
783
|
this.output.emit(this.name);
|
|
753
784
|
}
|
|
754
785
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: StorageBucketCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
755
|
-
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$
|
|
786
|
+
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"] }] });
|
|
756
787
|
}
|
|
757
788
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: StorageBucketCreateComponent, decorators: [{
|
|
758
789
|
type: Component,
|
|
@@ -787,7 +818,7 @@ class StorageFileUploadComponent {
|
|
|
787
818
|
this.file = null;
|
|
788
819
|
}
|
|
789
820
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: StorageFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
790
|
-
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$
|
|
821
|
+
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"] }] });
|
|
791
822
|
}
|
|
792
823
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: StorageFileUploadComponent, decorators: [{
|
|
793
824
|
type: Component,
|
|
@@ -807,7 +838,7 @@ class StorageFolderCreateComponent {
|
|
|
807
838
|
this.output.emit({ name: this.name, isPublic: this.isPublic });
|
|
808
839
|
}
|
|
809
840
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: StorageFolderCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
810
|
-
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$
|
|
841
|
+
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"] }] });
|
|
811
842
|
}
|
|
812
843
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: StorageFolderCreateComponent, decorators: [{
|
|
813
844
|
type: Component,
|
|
@@ -921,13 +952,13 @@ class MediaUploadDialogComponent {
|
|
|
921
952
|
},
|
|
922
953
|
});
|
|
923
954
|
}
|
|
924
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaUploadDialogComponent, deps: [{ token: i1$
|
|
925
|
-
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:
|
|
955
|
+
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 });
|
|
956
|
+
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"] }] });
|
|
926
957
|
}
|
|
927
958
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaUploadDialogComponent, decorators: [{
|
|
928
959
|
type: Component,
|
|
929
960
|
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"] }]
|
|
930
|
-
}], ctorParameters: () => [{ type: i1$
|
|
961
|
+
}], ctorParameters: () => [{ type: i1$1.MatDialogRef }, { type: undefined, decorators: [{
|
|
931
962
|
type: Inject,
|
|
932
963
|
args: [MAT_DIALOG_DATA]
|
|
933
964
|
}] }, { type: i2$3.MediaService }] });
|
|
@@ -956,7 +987,7 @@ class MediaListComponent {
|
|
|
956
987
|
this.upload.emit(event);
|
|
957
988
|
}
|
|
958
989
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
959
|
-
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$
|
|
990
|
+
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"] }] });
|
|
960
991
|
}
|
|
961
992
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaListComponent, decorators: [{
|
|
962
993
|
type: Component,
|
|
@@ -986,7 +1017,7 @@ class MediaListItemComponent {
|
|
|
986
1017
|
this.deleteMedia.emit(media);
|
|
987
1018
|
}
|
|
988
1019
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaListItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
989
|
-
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:
|
|
1020
|
+
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"] }] });
|
|
990
1021
|
}
|
|
991
1022
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MediaListItemComponent, decorators: [{
|
|
992
1023
|
type: Component,
|
|
@@ -1019,13 +1050,13 @@ class NotFoundComponent {
|
|
|
1019
1050
|
}
|
|
1020
1051
|
});
|
|
1021
1052
|
}
|
|
1022
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: NotFoundComponent, deps: [{ token: i1$
|
|
1053
|
+
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 });
|
|
1023
1054
|
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"] });
|
|
1024
1055
|
}
|
|
1025
1056
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: NotFoundComponent, decorators: [{
|
|
1026
1057
|
type: Component,
|
|
1027
1058
|
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"] }]
|
|
1028
|
-
}], ctorParameters: () => [{ type: i1$
|
|
1059
|
+
}], ctorParameters: () => [{ type: i1$4.Router }] });
|
|
1029
1060
|
|
|
1030
1061
|
class ConfirmationDialogComponent {
|
|
1031
1062
|
data = inject(MAT_DIALOG_DATA);
|
|
@@ -1034,7 +1065,7 @@ class ConfirmationDialogComponent {
|
|
|
1034
1065
|
this.dialogRef.close();
|
|
1035
1066
|
}
|
|
1036
1067
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ConfirmationDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1037
|
-
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:
|
|
1068
|
+
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"] }] });
|
|
1038
1069
|
}
|
|
1039
1070
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ConfirmationDialogComponent, decorators: [{
|
|
1040
1071
|
type: Component,
|
|
@@ -1055,5 +1086,5 @@ class BaseComponent {
|
|
|
1055
1086
|
* Generated bundle index. Do not edit.
|
|
1056
1087
|
*/
|
|
1057
1088
|
|
|
1058
|
-
export { AngularComponentsModule, AppDrawerComponent, AppFooterComponent, AppLayoutComponent, AppPageComponent, BaseComponent, ConfirmationDialogComponent, ConsoleLayoutComponent, FolderComponent, LoadingSpinnerComponent, MaterialModule, MediaListComponent, MediaListItemComponent, MediaPreviewDialogComponent, MediaUploadComponent, MediaUploadDialogComponent, MenuUserComponent, NotFoundComponent, SpacerComponent, StorageBucketCreateComponent, StorageFileUploadComponent, StorageFolderCreateComponent, TopbarAvatarMenuComponent, TopbarComponent, WechatConnectDialogComponent };
|
|
1089
|
+
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 };
|
|
1059
1090
|
//# sourceMappingURL=rolatech-angular-components.mjs.map
|