@rolatech/angular-components 20.0.0-beta.9 → 20.0.1
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.
|
@@ -1,32 +1,33 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import {
|
|
3
|
-
import * as i1
|
|
2
|
+
import { model, output, ViewEncapsulation, Component, viewChild, input, inject, Renderer2, ViewChild, Inject, booleanAttribute, ElementRef, effect, HostBinding, InjectionToken, makeEnvironmentProviders, PLATFORM_ID, ChangeDetectionStrategy, contentChild, computed, NgModule, ChangeDetectorRef, HostListener, contentChildren, signal } from '@angular/core';
|
|
3
|
+
import * as i1 from '@angular/common';
|
|
4
4
|
import { CommonModule, isPlatformBrowser, NgClass } from '@angular/common';
|
|
5
|
+
import * as i2 from '@angular/forms';
|
|
6
|
+
import { FormsModule, Validators, ReactiveFormsModule } from '@angular/forms';
|
|
7
|
+
import * as i1$3 from '@angular/material/input';
|
|
8
|
+
import { MatInputModule } from '@angular/material/input';
|
|
9
|
+
import * as i3 from '@angular/material/button';
|
|
10
|
+
import { MatButtonModule } from '@angular/material/button';
|
|
11
|
+
import * as i2$2 from '@angular/material/icon';
|
|
12
|
+
import { MatIcon, MatIconModule } from '@angular/material/icon';
|
|
13
|
+
import * as i1$1 from '@angular/material/progress-bar';
|
|
14
|
+
import { MatProgressBarModule, MatProgressBar } from '@angular/material/progress-bar';
|
|
15
|
+
import { DurationPipe, APP_CONFIG, AngularCommonModule } from '@rolatech/angular-common';
|
|
5
16
|
import * as i2$5 from '@angular/platform-browser';
|
|
6
17
|
import { DomSanitizer } from '@angular/platform-browser';
|
|
7
|
-
import * as i1 from '@angular/
|
|
8
|
-
import { Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
9
|
-
import * as i4 from '@angular/material/button';
|
|
10
|
-
import { MatButtonModule } from '@angular/material/button';
|
|
11
|
-
import * as i1$1 from '@angular/material/dialog';
|
|
18
|
+
import * as i1$2 from '@angular/material/dialog';
|
|
12
19
|
import { MAT_DIALOG_DATA, MatDialogContent, MatDialogActions, MatDialogClose, MatDialogTitle, MatDialogModule, MatDialog, MatDialogRef } from '@angular/material/dialog';
|
|
13
|
-
import * as i1$2 from '@angular/material/form-field';
|
|
14
20
|
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
15
|
-
import * as i2 from '@angular/material/input';
|
|
16
|
-
import { MatInputModule } from '@angular/material/input';
|
|
17
|
-
import * as i2$2 from '@angular/material/icon';
|
|
18
|
-
import { MatIcon, MatIconModule } from '@angular/material/icon';
|
|
19
21
|
import { MatSidenavModule } from '@angular/material/sidenav';
|
|
20
|
-
import * as i3 from '@angular/material/list';
|
|
22
|
+
import * as i3$1 from '@angular/material/list';
|
|
21
23
|
import { MatListModule } from '@angular/material/list';
|
|
22
|
-
import * as i3$
|
|
24
|
+
import * as i3$4 from '@angular/router';
|
|
23
25
|
import { RouterLink, RouterLinkActive, Router, RouterEvent, NavigationEnd, ActivatedRoute, RouterModule } from '@angular/router';
|
|
24
26
|
import { BreakpointObserver, Breakpoints, LayoutModule } from '@angular/cdk/layout';
|
|
25
27
|
import { map, distinctUntilChanged, filter } from 'rxjs';
|
|
26
28
|
import { trigger, state, transition, style, animate } from '@angular/animations';
|
|
27
29
|
import { Platform } from '@angular/cdk/platform';
|
|
28
30
|
import { ViewportRuler, ScrollingModule } from '@angular/cdk/scrolling';
|
|
29
|
-
import { APP_CONFIG, AngularCommonModule } from '@rolatech/angular-common';
|
|
30
31
|
import * as i2$1 from '@angular/material/menu';
|
|
31
32
|
import { MatMenuModule } from '@angular/material/menu';
|
|
32
33
|
import { MatDividerModule, MatDivider } from '@angular/material/divider';
|
|
@@ -37,13 +38,13 @@ import { PortalModule } from '@angular/cdk/portal';
|
|
|
37
38
|
import { CdkStepperModule } from '@angular/cdk/stepper';
|
|
38
39
|
import { CdkTableModule } from '@angular/cdk/table';
|
|
39
40
|
import { CdkTreeModule } from '@angular/cdk/tree';
|
|
40
|
-
import * as i3$
|
|
41
|
+
import * as i3$3 from '@angular/material/autocomplete';
|
|
41
42
|
import { MatAutocompleteModule } from '@angular/material/autocomplete';
|
|
42
43
|
import { MatBadgeModule } from '@angular/material/badge';
|
|
43
44
|
import { MatBottomSheetModule } from '@angular/material/bottom-sheet';
|
|
44
45
|
import { MatButtonToggleModule } from '@angular/material/button-toggle';
|
|
45
46
|
import { MatCardModule } from '@angular/material/card';
|
|
46
|
-
import * as
|
|
47
|
+
import * as i3$2 from '@angular/material/checkbox';
|
|
47
48
|
import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
48
49
|
import { MatChipsModule } from '@angular/material/chips';
|
|
49
50
|
import { MatNativeDateModule, MatRippleModule, MatOptionModule } from '@angular/material/core';
|
|
@@ -51,9 +52,7 @@ import { MatDatepickerModule } from '@angular/material/datepicker';
|
|
|
51
52
|
import { MatExpansionModule } from '@angular/material/expansion';
|
|
52
53
|
import { MatGridListModule } from '@angular/material/grid-list';
|
|
53
54
|
import { MatPaginatorModule } from '@angular/material/paginator';
|
|
54
|
-
import * as
|
|
55
|
-
import { MatProgressBarModule, MatProgressBar } from '@angular/material/progress-bar';
|
|
56
|
-
import * as i4$2 from '@angular/material/progress-spinner';
|
|
55
|
+
import * as i4 from '@angular/material/progress-spinner';
|
|
57
56
|
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
|
|
58
57
|
import { MatRadioModule } from '@angular/material/radio';
|
|
59
58
|
import * as i2$4 from '@angular/material/select';
|
|
@@ -73,6 +72,67 @@ import * as i2$3 from '@rolatech/angular-services';
|
|
|
73
72
|
import { LoadingService, DialogService, SnackBarService, TitleService, NavigationService, BackButtonDirective } from '@rolatech/angular-services';
|
|
74
73
|
import { map as map$1 } from 'lodash';
|
|
75
74
|
|
|
75
|
+
class ChatBox {
|
|
76
|
+
isStreaming = false;
|
|
77
|
+
userInput = model(...(ngDevMode ? [undefined, { debugName: "userInput" }] : []));
|
|
78
|
+
send = output();
|
|
79
|
+
onEnter(event) {
|
|
80
|
+
if (event.key === 'Enter' && !event.shiftKey) {
|
|
81
|
+
event.preventDefault();
|
|
82
|
+
this.sendMessage();
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
sendMessage() {
|
|
86
|
+
this.send.emit();
|
|
87
|
+
}
|
|
88
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ChatBox, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
89
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.0", type: ChatBox, isStandalone: true, selector: "rolatech-chat-box", inputs: { userInput: { classPropertyName: "userInput", publicName: "userInput", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { userInput: "userInputChange", send: "send" }, ngImport: i0, template: "<div\n class=\"h-auto dark:bg-[--rt-raised-background] rounded-2xl w-full my-3 mx-auto border border-black border-opacity-20 overflow-hidden flex items-end p-1\"\n>\n <div\n class=\"w-full grid text-sm border-black after:px-3.5 after:py-2.5 [&>textarea]:text-inherit after:text-inherit [&>textarea]:resize-none [&>textarea]:overflow-hidden [&>textarea]:[grid-area:1/1/2/2] after:[grid-area:1/1/2/2] after:whitespace-pre-wrap after:invisible after:content-[attr(data-cloned-val)_'_'] after:border\"\n >\n <textarea\n class=\"w-full border border-transparent appearance-none rounded px-3.5 py-2.5 outline-none dark:bg-[--rt-raised-background]\"\n name=\"message\"\n id=\"message\"\n rows=\"1\"\n [(ngModel)]=\"userInput\"\n onInput=\"this.parentNode.dataset.clonedVal = this.value\"\n placeholder=\"Ask anything\"\n (keydown.enter)=\"onEnter($event)\"\n [disabled]=\"isStreaming\"\n required\n ></textarea>\n </div>\n <button\n matIconButton\n (click)=\"sendMessage()\"\n [disabled]=\"!userInput()?.trim()\"\n [ngClass]=\"!userInput()?.trim() ? '' : '!bg-[--rt-brand-color] !text-[--rt-text-primary-inverse]'\"\n >\n <mat-icon>arrow_upward</mat-icon>\n </button>\n</div>\n", styles: ["rolatech-chat-box{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
90
|
+
}
|
|
91
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ChatBox, decorators: [{
|
|
92
|
+
type: Component,
|
|
93
|
+
args: [{ selector: 'rolatech-chat-box', imports: [CommonModule, MatInputModule, FormsModule, MatButtonModule, MatIcon], encapsulation: ViewEncapsulation.None, template: "<div\n class=\"h-auto dark:bg-[--rt-raised-background] rounded-2xl w-full my-3 mx-auto border border-black border-opacity-20 overflow-hidden flex items-end p-1\"\n>\n <div\n class=\"w-full grid text-sm border-black after:px-3.5 after:py-2.5 [&>textarea]:text-inherit after:text-inherit [&>textarea]:resize-none [&>textarea]:overflow-hidden [&>textarea]:[grid-area:1/1/2/2] after:[grid-area:1/1/2/2] after:whitespace-pre-wrap after:invisible after:content-[attr(data-cloned-val)_'_'] after:border\"\n >\n <textarea\n class=\"w-full border border-transparent appearance-none rounded px-3.5 py-2.5 outline-none dark:bg-[--rt-raised-background]\"\n name=\"message\"\n id=\"message\"\n rows=\"1\"\n [(ngModel)]=\"userInput\"\n onInput=\"this.parentNode.dataset.clonedVal = this.value\"\n placeholder=\"Ask anything\"\n (keydown.enter)=\"onEnter($event)\"\n [disabled]=\"isStreaming\"\n required\n ></textarea>\n </div>\n <button\n matIconButton\n (click)=\"sendMessage()\"\n [disabled]=\"!userInput()?.trim()\"\n [ngClass]=\"!userInput()?.trim() ? '' : '!bg-[--rt-brand-color] !text-[--rt-text-primary-inverse]'\"\n >\n <mat-icon>arrow_upward</mat-icon>\n </button>\n</div>\n", styles: ["rolatech-chat-box{width:100%}\n"] }]
|
|
94
|
+
}] });
|
|
95
|
+
|
|
96
|
+
class VideoUpload {
|
|
97
|
+
myVideo = viewChild('video', ...(ngDevMode ? [{ debugName: "myVideo" }] : []));
|
|
98
|
+
item = input(...(ngDevMode ? [undefined, { debugName: "item" }] : []));
|
|
99
|
+
uploading = model(false, ...(ngDevMode ? [{ debugName: "uploading" }] : []));
|
|
100
|
+
editing = model(false, ...(ngDevMode ? [{ debugName: "editing" }] : []));
|
|
101
|
+
progress = input(0, ...(ngDevMode ? [{ debugName: "progress" }] : []));
|
|
102
|
+
mediaEdit = output();
|
|
103
|
+
thumbnailUpload = output();
|
|
104
|
+
upload = output();
|
|
105
|
+
deleteMedia = output();
|
|
106
|
+
editId = model(...(ngDevMode ? [undefined, { debugName: "editId" }] : []));
|
|
107
|
+
hasUnsaved = input(false, ...(ngDevMode ? [{ debugName: "hasUnsaved" }] : []));
|
|
108
|
+
onLoadedMetadata(event) {
|
|
109
|
+
if (this.item()?.duration) {
|
|
110
|
+
return;
|
|
111
|
+
}
|
|
112
|
+
const videoElement = event.target;
|
|
113
|
+
const item = this.item();
|
|
114
|
+
if (item) {
|
|
115
|
+
item.duration = videoElement.duration;
|
|
116
|
+
}
|
|
117
|
+
}
|
|
118
|
+
onUpload(data) {
|
|
119
|
+
this.uploading.update(() => true);
|
|
120
|
+
this.upload.emit({ data });
|
|
121
|
+
}
|
|
122
|
+
onMediaEdit() {
|
|
123
|
+
this.mediaEdit.emit(this.item());
|
|
124
|
+
}
|
|
125
|
+
onDeleteMedia() {
|
|
126
|
+
this.deleteMedia.emit(this.item());
|
|
127
|
+
}
|
|
128
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: VideoUpload, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
129
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: VideoUpload, isStandalone: true, selector: "rolatech-video-upload", inputs: { item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: false, transformFunction: null }, uploading: { classPropertyName: "uploading", publicName: "uploading", isSignal: true, isRequired: false, transformFunction: null }, editing: { classPropertyName: "editing", publicName: "editing", isSignal: true, isRequired: false, transformFunction: null }, progress: { classPropertyName: "progress", publicName: "progress", isSignal: true, isRequired: false, transformFunction: null }, editId: { classPropertyName: "editId", publicName: "editId", isSignal: true, isRequired: false, transformFunction: null }, hasUnsaved: { classPropertyName: "hasUnsaved", publicName: "hasUnsaved", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { uploading: "uploadingChange", editing: "editingChange", mediaEdit: "mediaEdit", thumbnailUpload: "thumbnailUpload", upload: "upload", deleteMedia: "deleteMedia", editId: "editIdChange" }, viewQueries: [{ propertyName: "myVideo", first: true, predicate: ["video"], descendants: true, isSignal: true }], ngImport: i0, template: "<div>\n @if (item()) {\n <div class=\"flex flex-row p-2 gap-3\">\n <div class=\"bg-black h-fit\">\n <video\n id=\"video\"\n #video\n [src]=\"item()?.url\"\n class=\"w-32 aspect-video\"\n (loadedmetadata)=\"onLoadedMetadata($event)\"\n [poster]=\"item()?.thumbnail\"\n ></video>\n </div>\n <div class=\"flex flex-col justify-between w-full\">\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-between items-center w-full px-2\">\n <span i18n>Video</span>\n </div>\n @if (item()?.isUploading) {\n <div>\n <span> {{ item()?.progress }}%</span>\n </div>\n }\n </div>\n <div class=\"flex justify-between items-center\">\n <div>\n <button mat-button class=\"max-h-8\" (click)=\"onMediaEdit(); $event.stopPropagation()\">\n <mat-icon>edit</mat-icon>\n <span i18n>Edit</span>\n </button>\n <button mat-button class=\"max-h-8\" (click)=\"onDeleteMedia(); $event.stopPropagation()\">\n <mat-icon>delete</mat-icon>\n <span i18n>Delete</span>\n </button>\n </div>\n <div>\n <span>{{ item()!.duration | duration }}</span>\n </div>\n </div>\n </div>\n </div>\n @if (uploading()) {\n <div class=\"p-2\">\n <mat-progress-bar mode=\"determinate\" [value]=\"progress\"> </mat-progress-bar>\n </div>\n } }@else {\n <div class=\"px-3\">\n <input\n class=\"ud-sr-only\"\n type=\"file\"\n accept=\".avi,.mpg,.mpeg,.flv,.mov,.m2v,.m4v,.mp4,.rm,.ram,.vob,.ogv,.webm,.wmv\"\n (change)=\"onUpload($event)\"\n #fileInput\n />\n <div class=\"flex justify-between items-center\">\n <div i18n>No videos</div>\n <button mat-flat-button class=\"max-h-8\" (click)=\"fileInput.click()\" i18n>Upload</button>\n </div>\n </div>\n }\n</div>\n", styles: [".ud-sr-only{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatProgressBarModule }, { kind: "component", type: i1$1.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: DurationPipe, name: "duration" }] });
|
|
130
|
+
}
|
|
131
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: VideoUpload, decorators: [{
|
|
132
|
+
type: Component,
|
|
133
|
+
args: [{ selector: 'rolatech-video-upload', imports: [CommonModule, MatProgressBarModule, MatButtonModule, MatIcon, DurationPipe], template: "<div>\n @if (item()) {\n <div class=\"flex flex-row p-2 gap-3\">\n <div class=\"bg-black h-fit\">\n <video\n id=\"video\"\n #video\n [src]=\"item()?.url\"\n class=\"w-32 aspect-video\"\n (loadedmetadata)=\"onLoadedMetadata($event)\"\n [poster]=\"item()?.thumbnail\"\n ></video>\n </div>\n <div class=\"flex flex-col justify-between w-full\">\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-between items-center w-full px-2\">\n <span i18n>Video</span>\n </div>\n @if (item()?.isUploading) {\n <div>\n <span> {{ item()?.progress }}%</span>\n </div>\n }\n </div>\n <div class=\"flex justify-between items-center\">\n <div>\n <button mat-button class=\"max-h-8\" (click)=\"onMediaEdit(); $event.stopPropagation()\">\n <mat-icon>edit</mat-icon>\n <span i18n>Edit</span>\n </button>\n <button mat-button class=\"max-h-8\" (click)=\"onDeleteMedia(); $event.stopPropagation()\">\n <mat-icon>delete</mat-icon>\n <span i18n>Delete</span>\n </button>\n </div>\n <div>\n <span>{{ item()!.duration | duration }}</span>\n </div>\n </div>\n </div>\n </div>\n @if (uploading()) {\n <div class=\"p-2\">\n <mat-progress-bar mode=\"determinate\" [value]=\"progress\"> </mat-progress-bar>\n </div>\n } }@else {\n <div class=\"px-3\">\n <input\n class=\"ud-sr-only\"\n type=\"file\"\n accept=\".avi,.mpg,.mpeg,.flv,.mov,.m2v,.m4v,.mp4,.rm,.ram,.vob,.ogv,.webm,.wmv\"\n (change)=\"onUpload($event)\"\n #fileInput\n />\n <div class=\"flex justify-between items-center\">\n <div i18n>No videos</div>\n <button mat-flat-button class=\"max-h-8\" (click)=\"fileInput.click()\" i18n>Upload</button>\n </div>\n </div>\n }\n</div>\n", styles: [".ud-sr-only{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}\n"] }]
|
|
134
|
+
}] });
|
|
135
|
+
|
|
76
136
|
class PdfViewerComponent {
|
|
77
137
|
sanitizer = inject(DomSanitizer);
|
|
78
138
|
safeUrl;
|
|
@@ -81,21 +141,21 @@ class PdfViewerComponent {
|
|
|
81
141
|
constructor() {
|
|
82
142
|
this.safeUrl = this.sanitizer.bypassSecurityTrustResourceUrl(this.url);
|
|
83
143
|
}
|
|
84
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
85
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
144
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PdfViewerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
145
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: PdfViewerComponent, isStandalone: true, selector: "rolatech-pdf-viewer", ngImport: i0, template: "<iframe [src]=\"safeUrl\" width=\"100%\" height=\"100%\" frameborder=\"0\"></iframe>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
86
146
|
}
|
|
87
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
147
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PdfViewerComponent, decorators: [{
|
|
88
148
|
type: Component,
|
|
89
149
|
args: [{ selector: 'rolatech-pdf-viewer', imports: [CommonModule], template: "<iframe [src]=\"safeUrl\" width=\"100%\" height=\"100%\" frameborder=\"0\"></iframe>\n" }]
|
|
90
150
|
}], ctorParameters: () => [] });
|
|
91
151
|
|
|
92
152
|
class RichLabelComponent {
|
|
93
|
-
label = input.required();
|
|
94
|
-
title = input.required();
|
|
95
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
96
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0
|
|
153
|
+
label = input.required(...(ngDevMode ? [{ debugName: "label" }] : []));
|
|
154
|
+
title = input.required(...(ngDevMode ? [{ debugName: "title" }] : []));
|
|
155
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: RichLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
156
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.0", type: RichLabelComponent, isStandalone: true, selector: "rolatech-rich-label", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-col justify-center h-11\">\n <div class=\"text-sm opacity-80\" i18n>{{ label() }}</div>\n <div>{{ title() }}</div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
97
157
|
}
|
|
98
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
158
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: RichLabelComponent, decorators: [{
|
|
99
159
|
type: Component,
|
|
100
160
|
args: [{ selector: 'rolatech-rich-label', imports: [CommonModule], template: "<div class=\"flex flex-col justify-center h-11\">\n <div class=\"text-sm opacity-80\" i18n>{{ label() }}</div>\n <div>{{ title() }}</div>\n</div>\n" }]
|
|
101
161
|
}] });
|
|
@@ -126,10 +186,10 @@ class ResizableContainerComponent {
|
|
|
126
186
|
stopResizing() {
|
|
127
187
|
this.isResizing = false;
|
|
128
188
|
}
|
|
129
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
130
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
189
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ResizableContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
190
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: ResizableContainerComponent, isStandalone: true, selector: "rolatech-resizable-container", viewQueries: [{ propertyName: "leftDiv", first: true, predicate: ["leftDiv"], descendants: true }, { propertyName: "rightDiv", first: true, predicate: ["rightDiv"], descendants: true }, { propertyName: "divider", first: true, predicate: ["divider"], descendants: true }], ngImport: i0, template: "<div class=\"flex w-full p-3\">\n <div class=\"w-2/6 px-1\" #leftDiv>\n <ng-content select=\"[position='left']\"></ng-content>\n </div>\n <div class=\"divider\" #divider (mousedown)=\"startResizing($event)\"></div>\n <div class=\"w-4/6 px-1\" #rightDiv>\n <ng-content select=\"[position='right']\"></ng-content>\n </div>\n</div>\n", styles: [".resizable-container{display:flex;width:100%;height:100vh}.left,.right{flex-grow:1;padding:20px;overflow:auto}.left{background:#f4f4f4;width:50%}.right{background:#e0e0e0;width:50%}.divider{width:5px;cursor:ew-resize;background:#666}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
131
191
|
}
|
|
132
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
192
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ResizableContainerComponent, decorators: [{
|
|
133
193
|
type: Component,
|
|
134
194
|
args: [{ selector: 'rolatech-resizable-container', imports: [CommonModule], template: "<div class=\"flex w-full p-3\">\n <div class=\"w-2/6 px-1\" #leftDiv>\n <ng-content select=\"[position='left']\"></ng-content>\n </div>\n <div class=\"divider\" #divider (mousedown)=\"startResizing($event)\"></div>\n <div class=\"w-4/6 px-1\" #rightDiv>\n <ng-content select=\"[position='right']\"></ng-content>\n </div>\n</div>\n", styles: [".resizable-container{display:flex;width:100%;height:100vh}.left,.right{flex-grow:1;padding:20px;overflow:auto}.left{background:#f4f4f4;width:50%}.right{background:#e0e0e0;width:50%}.divider{width:5px;cursor:ew-resize;background:#666}\n"] }]
|
|
135
195
|
}], propDecorators: { leftDiv: [{
|
|
@@ -144,10 +204,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
144
204
|
}] } });
|
|
145
205
|
|
|
146
206
|
class RichGridMediaComponent {
|
|
147
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
148
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
207
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: RichGridMediaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
208
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: RichGridMediaComponent, isStandalone: true, selector: "rolatech-rich-grid-media", ngImport: i0, template: "<p>rich-grid-media works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
149
209
|
}
|
|
150
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
210
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: RichGridMediaComponent, decorators: [{
|
|
151
211
|
type: Component,
|
|
152
212
|
args: [{ selector: 'rolatech-rich-grid-media', imports: [CommonModule], template: "<p>rich-grid-media works!</p>\n" }]
|
|
153
213
|
}] });
|
|
@@ -171,10 +231,10 @@ class RejectDialogComponent {
|
|
|
171
231
|
});
|
|
172
232
|
this.rejectForm.setValue(this.data);
|
|
173
233
|
}
|
|
174
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
175
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
234
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: RejectDialogComponent, deps: [{ token: i2.FormBuilder }, { token: i1$2.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
|
|
235
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: RejectDialogComponent, isStandalone: true, selector: "rolatech-reject-dialog", ngImport: i0, template: "<mat-dialog-content>\n <form [formGroup]=\"rejectForm\">\n <div class=\"py-2\">\n <h2 class=\"mb-2\" i18n>Reject reason</h2>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Reason </mat-label>\n <textarea matInput formControlName=\"content\" required></textarea>\n </mat-form-field>\n </div>\n </form>\n</mat-dialog-content>\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Cancel</button>\n <button mat-flat-button [mat-dialog-close]=\"rejectForm.value\" cdkFocusInitial i18n>Confirm</button>\n</mat-dialog-actions>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$3.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
|
|
176
236
|
}
|
|
177
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
237
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: RejectDialogComponent, decorators: [{
|
|
178
238
|
type: Component,
|
|
179
239
|
args: [{ selector: 'rolatech-reject-dialog', imports: [
|
|
180
240
|
MatDialogContent,
|
|
@@ -186,7 +246,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
186
246
|
MatButtonModule,
|
|
187
247
|
MatDialogClose,
|
|
188
248
|
], template: "<mat-dialog-content>\n <form [formGroup]=\"rejectForm\">\n <div class=\"py-2\">\n <h2 class=\"mb-2\" i18n>Reject reason</h2>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Reason </mat-label>\n <textarea matInput formControlName=\"content\" required></textarea>\n </mat-form-field>\n </div>\n </form>\n</mat-dialog-content>\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Cancel</button>\n <button mat-flat-button [mat-dialog-close]=\"rejectForm.value\" cdkFocusInitial i18n>Confirm</button>\n</mat-dialog-actions>\n", styles: ["mat-form-field{width:100%}\n"] }]
|
|
189
|
-
}], ctorParameters: () => [{ type:
|
|
249
|
+
}], ctorParameters: () => [{ type: i2.FormBuilder }, { type: i1$2.MatDialogRef }, { type: undefined, decorators: [{
|
|
190
250
|
type: Inject,
|
|
191
251
|
args: [MAT_DIALOG_DATA]
|
|
192
252
|
}] }] });
|
|
@@ -201,20 +261,20 @@ class AcceptDialogComponent {
|
|
|
201
261
|
onNoClick() {
|
|
202
262
|
this.dialogRef.close();
|
|
203
263
|
}
|
|
204
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
205
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
264
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: AcceptDialogComponent, deps: [{ token: i1$2.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
|
|
265
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: AcceptDialogComponent, isStandalone: true, selector: "rolatech-accept-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 i18n>Cancel</button>\n <button mat-flat-button [mat-dialog-close]=\"true\" cdkFocusInitial i18n>Confirm</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: i3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
|
|
206
266
|
}
|
|
207
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
267
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: AcceptDialogComponent, decorators: [{
|
|
208
268
|
type: Component,
|
|
209
269
|
args: [{ selector: 'rolatech-accept-dialog', 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 i18n>Cancel</button>\n <button mat-flat-button [mat-dialog-close]=\"true\" cdkFocusInitial i18n>Confirm</button>\n</div>\n" }]
|
|
210
|
-
}], ctorParameters: () => [{ type: i1$
|
|
270
|
+
}], ctorParameters: () => [{ type: i1$2.MatDialogRef }, { type: undefined, decorators: [{
|
|
211
271
|
type: Inject,
|
|
212
272
|
args: [MAT_DIALOG_DATA]
|
|
213
273
|
}] }] });
|
|
214
274
|
|
|
215
275
|
class IconComponent {
|
|
216
276
|
hasClass = true;
|
|
217
|
-
filled = input(false, { transform: booleanAttribute });
|
|
277
|
+
filled = input(false, ...(ngDevMode ? [{ debugName: "filled", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
218
278
|
el = inject(ElementRef);
|
|
219
279
|
constructor() {
|
|
220
280
|
effect(() => {
|
|
@@ -226,10 +286,10 @@ class IconComponent {
|
|
|
226
286
|
}
|
|
227
287
|
});
|
|
228
288
|
}
|
|
229
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
230
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0
|
|
289
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
290
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.0", type: IconComponent, isStandalone: true, selector: "rolatech-icon", inputs: { filled: { classPropertyName: "filled", publicName: "filled", isSignal: true, isRequired: false, transformFunction: null } }, 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(--rt-icon-width, 24px);height:var(--rt-icon-height, 24px)}.rolatech-icon mat-icon{font-family:Material Symbols Rounded}.rolatech-icon[filled] mat-icon{font-family:Material Symbols Rounded Filled}\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 });
|
|
231
291
|
}
|
|
232
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
292
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: IconComponent, decorators: [{
|
|
233
293
|
type: Component,
|
|
234
294
|
args: [{ selector: 'rolatech-icon', 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(--rt-icon-width, 24px);height:var(--rt-icon-height, 24px)}.rolatech-icon mat-icon{font-family:Material Symbols Rounded}.rolatech-icon[filled] mat-icon{font-family:Material Symbols Rounded Filled}\n"] }]
|
|
235
295
|
}], ctorParameters: () => [], propDecorators: { hasClass: [{
|
|
@@ -239,10 +299,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
239
299
|
|
|
240
300
|
class IconButtonComponent {
|
|
241
301
|
hasClass = true;
|
|
242
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
243
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
302
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: IconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
303
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.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-[--rt-10-percent-layer] 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{--rt-icon-button-icon-width: 24px;--rt-icon-button-icon-height: 24px;color:var(--rt-spec-icon-active-other);width:40px;height:40px;box-sizing:border-box;display:block}button.rolatech-icon-button{vertical-align:middle;color:inherit;outline:none;background:none;margin:0;border:none;width:100%;height:100%;line-height:0;-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", inputs: ["filled"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
244
304
|
}
|
|
245
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
305
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: IconButtonComponent, decorators: [{
|
|
246
306
|
type: Component,
|
|
247
307
|
args: [{ selector: 'rolatech-icon-button', 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-[--rt-10-percent-layer] 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{--rt-icon-button-icon-width: 24px;--rt-icon-button-icon-height: 24px;color:var(--rt-spec-icon-active-other);width:40px;height:40px;box-sizing:border-box;display:block}button.rolatech-icon-button{vertical-align:middle;color:inherit;outline:none;background:none;margin:0;border:none;width:100%;height:100%;line-height:0;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent}\n"] }]
|
|
248
308
|
}], propDecorators: { hasClass: [{
|
|
@@ -252,13 +312,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
252
312
|
|
|
253
313
|
class TitleComponent {
|
|
254
314
|
hasClass = true;
|
|
255
|
-
title = input();
|
|
256
|
-
subtitle = input();
|
|
257
|
-
large = input(false, { transform: booleanAttribute });
|
|
258
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
259
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
315
|
+
title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : []));
|
|
316
|
+
subtitle = input(...(ngDevMode ? [undefined, { debugName: "subtitle" }] : []));
|
|
317
|
+
large = input(false, ...(ngDevMode ? [{ debugName: "large", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
318
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
319
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: TitleComponent, isStandalone: true, selector: "rolatech-title", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, large: { classPropertyName: "large", publicName: "large", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-title": "this.hasClass" } }, ngImport: i0, template: "<div class=\"flex flex-row items-center\">\n @if (large()) {\n <a class=\"block text-3xl font-bold py-3\"\n ><span>{{ title() }}</span></a\n >\n } @else {\n <a class=\"block text-xl font-bold py-3\"\n ><span>{{ title() }}</span></a\n >\n }\n\n <a class=\"text-sm leading-3 text-[--rt-text-secondary]\"\n ><span>{{ subtitle() }}</span></a\n >\n</div>\n", styles: ["rolatech-title{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
260
320
|
}
|
|
261
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
321
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TitleComponent, decorators: [{
|
|
262
322
|
type: Component,
|
|
263
323
|
args: [{ selector: 'rolatech-title', imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"flex flex-row items-center\">\n @if (large()) {\n <a class=\"block text-3xl font-bold py-3\"\n ><span>{{ title() }}</span></a\n >\n } @else {\n <a class=\"block text-xl font-bold py-3\"\n ><span>{{ title() }}</span></a\n >\n }\n\n <a class=\"text-sm leading-3 text-[--rt-text-secondary]\"\n ><span>{{ subtitle() }}</span></a\n >\n</div>\n", styles: ["rolatech-title{display:block}\n"] }]
|
|
264
324
|
}], propDecorators: { hasClass: [{
|
|
@@ -269,12 +329,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
269
329
|
class ContainerComponent {
|
|
270
330
|
hasId = 'rolatech-container';
|
|
271
331
|
hasClass = true;
|
|
272
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
273
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
332
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
333
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: ContainerComponent, isStandalone: true, selector: "rolatech-container", host: { properties: { "id": "this.hasId", "class.rolatech-container": "this.hasClass" } }, ngImport: i0, template: "<div class=\"xl:max-w-[1024px] 2xl:max-w-[1280px] m-auto text-[--rt-text-primary] h-full\">\n <ng-content select=\"rolatech-toolbar\"></ng-content>\n <ng-content select=\"rolatech-filter\"></ng-content>\n <ng-content select=\"rolatech-tabs\"></ng-content>\n <ng-content select=\"rolatech-chip-bar\"></ng-content>\n <ng-content select=\"rolatech-list\"></ng-content>\n <ng-content select=\"rolatech-content\"></ng-content>\n <div class=\"container-content h-full\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: ["@media (min-width: 1280){.rolatech-container{max-width:var(--rt-container-max-width, 1024px)}}@media (min-width: 1536px){.rolatech-container{max-width:var(--rt-container-max-width, 1280px)}}rolatech-container .container-content{margin:0 auto;display:block;padding-left:var(--rt-container-content-padding-left, 16px);padding-right:var(--rt-container-content-padding-right, 16px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
274
334
|
}
|
|
275
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
335
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ContainerComponent, decorators: [{
|
|
276
336
|
type: Component,
|
|
277
|
-
args: [{ selector: 'rolatech-container', imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"xl:max-w-[1024px] 2xl:max-w-[1280px] m-auto text-[--rt-text-primary]\">\n <ng-content select=\"rolatech-toolbar\"></ng-content>\n <ng-content select=\"rolatech-filter\"></ng-content>\n <ng-content select=\"rolatech-tabs\"></ng-content>\n <ng-content select=\"rolatech-chip-bar\"></ng-content>\n <ng-content select=\"rolatech-list\"></ng-content>\n <ng-content select=\"rolatech-content\"></ng-content>\n <div class=\"container-content\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: ["@media (min-width: 1280){.rolatech-container{max-width:var(--rt-container-max-width, 1024px)}}@media (min-width: 1536px){.rolatech-container{max-width:var(--rt-container-max-width, 1280px)}}rolatech-container .container-content{margin:0 auto;display:block;padding-left:var(--rt-container-content-padding-left, 16px);padding-right:var(--rt-container-content-padding-right, 16px)}\n"] }]
|
|
337
|
+
args: [{ selector: 'rolatech-container', imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"xl:max-w-[1024px] 2xl:max-w-[1280px] m-auto text-[--rt-text-primary] h-full\">\n <ng-content select=\"rolatech-toolbar\"></ng-content>\n <ng-content select=\"rolatech-filter\"></ng-content>\n <ng-content select=\"rolatech-tabs\"></ng-content>\n <ng-content select=\"rolatech-chip-bar\"></ng-content>\n <ng-content select=\"rolatech-list\"></ng-content>\n <ng-content select=\"rolatech-content\"></ng-content>\n <div class=\"container-content h-full\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: ["@media (min-width: 1280){.rolatech-container{max-width:var(--rt-container-max-width, 1024px)}}@media (min-width: 1536px){.rolatech-container{max-width:var(--rt-container-max-width, 1280px)}}rolatech-container .container-content{margin:0 auto;display:block;padding-left:var(--rt-container-content-padding-left, 16px);padding-right:var(--rt-container-content-padding-right, 16px)}\n"] }]
|
|
278
338
|
}], propDecorators: { hasId: [{
|
|
279
339
|
type: HostBinding,
|
|
280
340
|
args: ['id']
|
|
@@ -296,10 +356,10 @@ function provideAngularLayout(config) {
|
|
|
296
356
|
|
|
297
357
|
class MenuIconComponent {
|
|
298
358
|
hasClass = true;
|
|
299
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
300
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
359
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MenuIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
360
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: MenuIconComponent, isStandalone: true, selector: "rolatech-menu-icon", 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-[--rt-10-percent-layer] rounded-full rolatech-icon-button\"\n onclick=\"this.blur()\"\n>\n <div style=\"width: 100%; height: 100%; display: block; fill: currentcolor\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n width=\"24\"\n focusable=\"false\"\n style=\"pointer-events: none; display: inherit; width: 100%; height: 100%\"\n >\n <path d=\"M21 6H3V5h18v1zm0 5H3v1h18v-1zm0 6H3v1h18v-1z\"></path>\n </svg>\n </div>\n</button>\n", styles: ["rolatech-menu-icon{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
301
361
|
}
|
|
302
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
362
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MenuIconComponent, decorators: [{
|
|
303
363
|
type: Component,
|
|
304
364
|
args: [{ selector: 'rolatech-menu-icon', imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<button\n id=\"button\"\n class=\"w-10 h-10 p-2 inline-block relative cursor-pointer hover:bg-[--rt-10-percent-layer] rounded-full rolatech-icon-button\"\n onclick=\"this.blur()\"\n>\n <div style=\"width: 100%; height: 100%; display: block; fill: currentcolor\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n width=\"24\"\n focusable=\"false\"\n style=\"pointer-events: none; display: inherit; width: 100%; height: 100%\"\n >\n <path d=\"M21 6H3V5h18v1zm0 5H3v1h18v-1zm0 6H3v1h18v-1z\"></path>\n </svg>\n </div>\n</button>\n", styles: ["rolatech-menu-icon{display:block}\n"] }]
|
|
305
365
|
}], propDecorators: { hasClass: [{
|
|
@@ -316,7 +376,7 @@ class TopbarComponent {
|
|
|
316
376
|
platformId = inject(PLATFORM_ID);
|
|
317
377
|
breakpointObserver = inject(BreakpointObserver);
|
|
318
378
|
appLayout = inject(APP_LAYOUT);
|
|
319
|
-
link = input('/');
|
|
379
|
+
link = input('/', ...(ngDevMode ? [{ debugName: "link" }] : []));
|
|
320
380
|
appDrawer;
|
|
321
381
|
miniGuide;
|
|
322
382
|
ngOnInit() {
|
|
@@ -333,10 +393,10 @@ class TopbarComponent {
|
|
|
333
393
|
}
|
|
334
394
|
this.appDrawer.toggle();
|
|
335
395
|
}
|
|
336
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
337
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0
|
|
396
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TopbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
397
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.0", type: TopbarComponent, isStandalone: true, selector: "rolatech-topbar", inputs: { link: { classPropertyName: "link", publicName: "link", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "id": "this.hostId", "class.rolatech-topbar": "this.hasClass" } }, ngImport: i0, template: "<div class=\"h-14 flex items-center\">\n <rolatech-menu-icon id=\"topbar-menu-button\" (click)=\"onToggle()\"></rolatech-menu-icon>\n <div class=\"cursor-pointer ml-1\" [routerLink]=\"link()\">\n <div class=\"text-[--rt-text-primary] text-lg md:text-xl font-bold\">\n <span class=\"text-[--rt-brand-color]\">{{ 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(--rt-base-background, #fff);color:var(--rt-text-primary, #030303);padding-left:var(--rt-topbar-padding-left, 16px);padding-right:var(--rt-topbar-padding-right, 16px)}rolatech-topbar:not([persistent]) #topbar-menu-button{display:none}rolatech-topbar:not(:has(#topbar-menu-button)){--rt-topbar-padding-left: 16px}rolatech-layout rolatech-drawer[persistent][opened]~rolatech-topbar{margin-left:256px}@media (max-width: 768px){:root{--rt-topbar-padding-left: 8px}rolatech-topbar #topbar-menu-button{display:block!important}}\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: "ngmodule", type: MatButtonModule }, { kind: "component", type: MenuIconComponent, selector: "rolatech-menu-icon" }], encapsulation: i0.ViewEncapsulation.None });
|
|
338
398
|
}
|
|
339
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
399
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TopbarComponent, decorators: [{
|
|
340
400
|
type: Component,
|
|
341
401
|
args: [{ selector: 'rolatech-topbar', imports: [CommonModule, RouterLink, MatButtonModule, MenuIconComponent], encapsulation: ViewEncapsulation.None, template: "<div class=\"h-14 flex items-center\">\n <rolatech-menu-icon id=\"topbar-menu-button\" (click)=\"onToggle()\"></rolatech-menu-icon>\n <div class=\"cursor-pointer ml-1\" [routerLink]=\"link()\">\n <div class=\"text-[--rt-text-primary] text-lg md:text-xl font-bold\">\n <span class=\"text-[--rt-brand-color]\">{{ 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(--rt-base-background, #fff);color:var(--rt-text-primary, #030303);padding-left:var(--rt-topbar-padding-left, 16px);padding-right:var(--rt-topbar-padding-right, 16px)}rolatech-topbar:not([persistent]) #topbar-menu-button{display:none}rolatech-topbar:not(:has(#topbar-menu-button)){--rt-topbar-padding-left: 16px}rolatech-layout rolatech-drawer[persistent][opened]~rolatech-topbar{margin-left:256px}@media (max-width: 768px){:root{--rt-topbar-padding-left: 8px}rolatech-topbar #topbar-menu-button{display:block!important}}\n"] }]
|
|
342
402
|
}], propDecorators: { hostId: [{
|
|
@@ -384,18 +444,18 @@ const panelAnimations$1 = {
|
|
|
384
444
|
class DrawerComponent {
|
|
385
445
|
_enableAnimations = false;
|
|
386
446
|
persistent = inject(APP_LAYOUT).persistent;
|
|
387
|
-
links = input();
|
|
388
|
-
position = input('left');
|
|
389
|
-
opened = input(true);
|
|
447
|
+
links = input(...(ngDevMode ? [undefined, { debugName: "links" }] : []));
|
|
448
|
+
position = input('left', ...(ngDevMode ? [{ debugName: "position" }] : []));
|
|
449
|
+
opened = input(true, ...(ngDevMode ? [{ debugName: "opened" }] : []));
|
|
390
450
|
el = inject(ElementRef);
|
|
391
451
|
renderer = inject(Renderer2);
|
|
392
452
|
platformId = inject(PLATFORM_ID);
|
|
393
453
|
breakpointObserver = inject(BreakpointObserver);
|
|
394
454
|
appLayout = inject(APP_LAYOUT);
|
|
395
|
-
guideEl = viewChild('guide');
|
|
396
|
-
content = viewChild('content');
|
|
397
|
-
scrimEl = viewChild('scrim');
|
|
398
|
-
headerEl = viewChild('header');
|
|
455
|
+
guideEl = viewChild('guide', ...(ngDevMode ? [{ debugName: "guideEl" }] : []));
|
|
456
|
+
content = viewChild('content', ...(ngDevMode ? [{ debugName: "content" }] : []));
|
|
457
|
+
scrimEl = viewChild('scrim', ...(ngDevMode ? [{ debugName: "scrimEl" }] : []));
|
|
458
|
+
headerEl = viewChild('header', ...(ngDevMode ? [{ debugName: "headerEl" }] : []));
|
|
399
459
|
isMobile = false;
|
|
400
460
|
isPersistent = true;
|
|
401
461
|
panelOpenState = false;
|
|
@@ -462,10 +522,10 @@ class DrawerComponent {
|
|
|
462
522
|
this._enableAnimations = true;
|
|
463
523
|
}
|
|
464
524
|
}
|
|
465
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
466
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", type: DrawerComponent, isStandalone: true, selector: "rolatech-drawer", inputs: { links: { classPropertyName: "links", publicName: "links", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, opened: { classPropertyName: "opened", publicName: "opened", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "id": "rolatech-drawer", "style.transition-duration": "200ms", "ngSkipHydration": "" }, classAttribute: "rolatech-drawer" }, 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=\"rolatech-drawer\" (click)=\"close()\"></div>\n<div id=\"contentContainer\" #content class=\"rolatech-drawer\">\n <div id=\"guide-wrapper\" class=\"rolatech-drawer\">\n <div id=\"guide-spacer\"></div>\n <div id=\"guide-content\" class=\"rolatech-drawer\">\n <div id=\"header\" #header class=\"flex pl-4 h-14 items-center\">\n <rolatech-menu-icon #menuButton (click)=\"this.toggle()\" onclick=\"this.blur()\"></rolatech-menu-icon>\n <div class=\"text-[--rt-text-primary] text-lg md:text-xl font-bold\" routerLink=\"/\">\n <span class=\"text-[--rt-brand-color]\" i18n>{{ appLayout.title }}</span>\n <span i18n>{{ appLayout.subtitle }}</span>\n </div>\n </div>\n <div id=\"guide-inner-content\" class=\"rolatech-drawer\">\n <div class=\"block p-3\">\n @for (item of links(); track $index) {\n @if (item.children) {\n <div class=\"flex cursor-pointer overflow-hidden\">\n @if (item.icon) {\n <div class=\"h-11 flex items-center\">\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n </div>\n }\n <div class=\"w-full\">\n <div class=\"flex items-center h-11 mr-2\" (click)=\"panelOpenState = !panelOpenState\">\n <span class=\"ml-3\" i18n>{{ item.title }}</span>\n <div class=\"flex-1\"></div>\n <rolatech-icon [@indicator]=\"panelOpenState === true ? 'expanded' : 'collapsed'\">expand_more</rolatech-icon>\n </div>\n <div\n class=\"flex flex-col ml-4 overflow-visible\"\n [@content]=\"panelOpenState === true ? 'expanded' : 'collapsed'\"\n >\n @for (child of item.children; track child) {\n {{ child.exact }}\n <a\n id=\"endpoint\"\n [routerLink]=\"child.link\"\n routerLinkActive=\"drawer-active\"\n [routerLinkActiveOptions]=\"{ exact: item.exact === false ? false : true }\"\n class=\"p-2 rt-guide-entry\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <span class=\"text-sm\" i18n>{{ child.title }}</span>\n </a>\n }\n </div>\n </div>\n </div>\n } @else {\n @if (item.openinView) {\n <a\n class=\"flex hover:bg-[--rt-10-percent-layer] 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 items-center\">\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 text-[--rt-text-secondary]\" i18n>{{ item.subtitle }}</span>\n </div>\n </div>\n <rolatech-icon class=\"scale-90 mr-3\">open_in_new</rolatech-icon>\n </div>\n </a>\n } @else {\n @if (item.button) {\n <a\n class=\"flex rolatech-drawer-button min-h-11 rounded-xl mb-2\"\n [routerLink]=\"item.link\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start items-center\">\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 i18n>{{ item.title }}</span>\n <span class=\"text-sm\" i18n>{{ item.subtitle }}</span>\n </div>\n </div>\n </div>\n </a>\n } @else {\n <a\n id=\"endpoint\"\n class=\"flex hover:bg-[--rt-10-percent-layer] min-h-11 rt-guide-entry\"\n [routerLink]=\"item.link\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n routerLinkActive=\"drawer-active\"\n [routerLinkActiveOptions]=\"{ exact: item.exact === false ? false : true }\"\n #routerLink=\"routerLinkActive\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start items-center\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\" [filled]=\"routerLink.isActive\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span i18n>{{ item.title }}</span>\n <span class=\"text-sm text-[--rt-text-secondary]\" i18n>{{ item.subtitle }}</span>\n </div>\n </div>\n </div>\n </a>\n }\n }\n }\n }\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: ["rolatech-drawer{position:fixed;z-index:1;inset:-120px 0;visibility:hidden;transition-property:visibility;transition-duration:.2s;touch-action:pan-y}rolatech-drawer[persistent]{width:var(--rt-drawer-width, 256px)}rolatech-drawer[persistent][position=top]{width:100%}rolatech-drawer[opened]{visibility:visible}rolatech-drawer[position=top] #contentContainer{left:0;right:0;width:100%;height:var(--rt-topbar-height, 56px);transform:translate3d(0,-100%,0)}rolatech-drawer[position=top] #contentContainer #guide-inner-content{height:56px}rolatech-drawer[position=top] #contentContainer #guide-inner-content div{display:flex!important;flex-direction:row!important;overflow:hidden;flex:1;flex-basis:.000000001px;overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin;height:56px;align-items:center}rolatech-drawer[position=bottom] #contentContainer{left:0;right:0;transform:translate3d(0,100%,0)}rolatech-drawer[position=left] #contentContainer{left:0;transform:translate3d(-100%,0,0)}rolatech-drawer[position=right] #contentContainer{right:0;transform:translate3d(100%,0,0)}rolatech-drawer[persistent][position=left]{right:auto}rolatech-drawer[persistent][position=right]{left:auto}rolatech-drawer[persistent][position=top] #contentContainer{transform:translate3d(0,-100%,0)}rolatech-drawer[persistent][position=left] #contentContainer{transform:translate3d(-100%,0,0)}rolatech-drawer[persistent][position=right] #contentContainer{transform:translate3d(100%,0,0)}rolatech-drawer[persistent][position=top] #contentContainer[opened]{transform:translateZ(0)}rolatech-drawer[persistent][position=left] #contentContainer[opened]{transform:translateZ(0)}rolatech-drawer[persistent][position=right] #contentContainer[opened]{transform:translateZ(0)}[hidden]{display:none!important}#guide-wrapper.rolatech-drawer{height:100%;display:flex;flex-direction:column}#contentContainer.rolatech-drawer{position:absolute;top:0;bottom:0;width:var(--rt-drawer-width, 256px);padding:var(--rt-drawer-content-padding, 120px 0);transition-property:transform;color:var(--rt-drawer-content-container-color, #000);background-color:var(--rt-drawer-content-container-background-color, #fff);transition-duration:.2s}#contentContainer.rolatech-drawer[opened]{transform:translateZ(0)}#guide-content.rolatech-drawer{background:var(--rt-base-background);flex:1;flex-basis:.000000001px;display:flex;flex-direction:column}#guide-inner-content.rolatech-drawer{overflow:hidden;flex:1;flex-basis:.000000001px;overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin}#scrim.rolatech-drawer{position:absolute;inset:0;transition-property:opacity;transform:translateZ(0);transition-duration:.2s;opacity:0;background:var(--rt-drawer-scrim-background, rgba(0, 0, 0, .5))}#scrim.visible.rolatech-drawer{opacity:1}#guide-spacer{margin-top:var(--ytd-masthead-height, 56px)}rolatech-drawer:not([persistent]) #guide-spacer{display:none}rolatech-drawer:not([persistent]){z-index:2030}.drawer-active{background-color:var(--rt-drawer-active-background-color, rgba(0, 0, 0, .05));font-weight:500;border-radius:10px}.content{display:flex;flex-direction:column;overflow:visible}.rolatech-drawer-button{background-color:var(--rt-brand-color, #000);color:var(--rt-brand-color-inverse, #fff)}.rolatech-drawer-button:hover{box-shadow:0 1px 3px #3c40434d,0 4px 8px 3px #3c404326;background-color:var(--rt-brand-color, #c2e7ff)}#endpoint.rt-guide-entry:hover{background-color:var(--rt-drawer-active-background-color);border-radius:10px}\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: IconComponent, selector: "rolatech-icon", inputs: ["filled"] }, { kind: "component", type: MenuIconComponent, selector: "rolatech-menu-icon" }, { kind: "ngmodule", type: MatButtonModule }], animations: [panelAnimations$1.indicator, panelAnimations$1.content], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
525
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: DrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
526
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: DrawerComponent, isStandalone: true, selector: "rolatech-drawer", inputs: { links: { classPropertyName: "links", publicName: "links", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, opened: { classPropertyName: "opened", publicName: "opened", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "id": "rolatech-drawer", "style.transition-duration": "200ms", "ngSkipHydration": "" }, classAttribute: "rolatech-drawer" }, 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=\"rolatech-drawer\" (click)=\"close()\"></div>\n<div id=\"contentContainer\" #content class=\"rolatech-drawer\">\n <div id=\"guide-wrapper\" class=\"rolatech-drawer\">\n <div id=\"guide-spacer\"></div>\n <div id=\"guide-content\" class=\"rolatech-drawer\">\n <div id=\"header\" #header class=\"flex pl-4 h-14 items-center\">\n <rolatech-menu-icon #menuButton (click)=\"this.toggle()\" onclick=\"this.blur()\"></rolatech-menu-icon>\n <div class=\"text-[--rt-text-primary] text-lg md:text-xl font-bold\" routerLink=\"/\">\n <span class=\"text-[--rt-brand-color]\" i18n>{{ appLayout.title }}</span>\n <span i18n>{{ appLayout.subtitle }}</span>\n </div>\n </div>\n <div id=\"guide-inner-content\" class=\"rolatech-drawer\">\n <div class=\"block p-3\">\n @for (item of links(); track $index) {\n @if (item.children) {\n <div class=\"flex cursor-pointer overflow-hidden\">\n @if (item.icon) {\n <div class=\"h-11 flex items-center\">\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n </div>\n }\n <div class=\"w-full\">\n <div class=\"flex items-center h-11 mr-2\" (click)=\"panelOpenState = !panelOpenState\">\n <span class=\"ml-3\" i18n>{{ item.title }}</span>\n <div class=\"flex-1\"></div>\n <rolatech-icon [@indicator]=\"panelOpenState === true ? 'expanded' : 'collapsed'\">expand_more</rolatech-icon>\n </div>\n <div\n class=\"flex flex-col ml-4 overflow-visible\"\n [@content]=\"panelOpenState === true ? 'expanded' : 'collapsed'\"\n >\n @for (child of item.children; track child) {\n {{ child.exact }}\n <a\n id=\"endpoint\"\n [routerLink]=\"child.link\"\n routerLinkActive=\"drawer-active\"\n [routerLinkActiveOptions]=\"{ exact: item.exact === false ? false : true }\"\n class=\"p-2 rt-guide-entry\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <span class=\"text-sm\" i18n>{{ child.title }}</span>\n </a>\n }\n </div>\n </div>\n </div>\n } @else {\n @if (item.openinView) {\n <a\n class=\"flex hover:bg-[--rt-10-percent-layer] 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 items-center\">\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 text-[--rt-text-secondary]\" i18n>{{ item.subtitle }}</span>\n </div>\n </div>\n <rolatech-icon class=\"scale-90 mr-3\">open_in_new</rolatech-icon>\n </div>\n </a>\n } @else {\n @if (item.button) {\n <a\n class=\"flex rolatech-drawer-button min-h-11 rounded-xl mb-2\"\n [routerLink]=\"item.link\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start items-center\">\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 i18n>{{ item.title }}</span>\n <span class=\"text-sm\" i18n>{{ item.subtitle }}</span>\n </div>\n </div>\n </div>\n </a>\n } @else {\n <a\n id=\"endpoint\"\n class=\"flex hover:bg-[--rt-10-percent-layer] min-h-11 rt-guide-entry\"\n [routerLink]=\"item.link\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n routerLinkActive=\"drawer-active\"\n [routerLinkActiveOptions]=\"{ exact: item.exact === false ? false : true }\"\n #routerLink=\"routerLinkActive\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start items-center\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\" [filled]=\"routerLink.isActive\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span i18n>{{ item.title }}</span>\n <span class=\"text-sm text-[--rt-text-secondary]\" i18n>{{ item.subtitle }}</span>\n </div>\n </div>\n </div>\n </a>\n }\n }\n }\n }\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: ["rolatech-drawer{position:fixed;z-index:1;inset:-120px 0;visibility:hidden;transition-property:visibility;transition-duration:.2s;touch-action:pan-y}rolatech-drawer[persistent]{width:var(--rt-drawer-width, 256px)}rolatech-drawer[persistent][position=top]{width:100%}rolatech-drawer[opened]{visibility:visible}rolatech-drawer[position=top] #contentContainer{left:0;right:0;width:100%;height:var(--rt-topbar-height, 56px);transform:translate3d(0,-100%,0)}rolatech-drawer[position=top] #contentContainer #guide-inner-content{height:56px}rolatech-drawer[position=top] #contentContainer #guide-inner-content div{display:flex!important;flex-direction:row!important;overflow:hidden;flex:1;flex-basis:.000000001px;overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin;height:56px;align-items:center}rolatech-drawer[position=bottom] #contentContainer{left:0;right:0;transform:translate3d(0,100%,0)}rolatech-drawer[position=left] #contentContainer{left:0;transform:translate3d(-100%,0,0)}rolatech-drawer[position=right] #contentContainer{right:0;transform:translate3d(100%,0,0)}rolatech-drawer[persistent][position=left]{right:auto}rolatech-drawer[persistent][position=right]{left:auto}rolatech-drawer[persistent][position=top] #contentContainer{transform:translate3d(0,-100%,0)}rolatech-drawer[persistent][position=left] #contentContainer{transform:translate3d(-100%,0,0)}rolatech-drawer[persistent][position=right] #contentContainer{transform:translate3d(100%,0,0)}rolatech-drawer[persistent][position=top] #contentContainer[opened]{transform:translateZ(0)}rolatech-drawer[persistent][position=left] #contentContainer[opened]{transform:translateZ(0)}rolatech-drawer[persistent][position=right] #contentContainer[opened]{transform:translateZ(0)}[hidden]{display:none!important}#guide-wrapper.rolatech-drawer{height:100%;display:flex;flex-direction:column}#contentContainer.rolatech-drawer{position:absolute;top:0;bottom:0;width:var(--rt-drawer-width, 256px);padding:var(--rt-drawer-content-padding, 120px 0);transition-property:transform;color:var(--rt-drawer-content-container-color, #000);background-color:var(--rt-drawer-content-container-background-color, #fff);transition-duration:.2s}#contentContainer.rolatech-drawer[opened]{transform:translateZ(0)}#guide-content.rolatech-drawer{background:var(--rt-base-background);flex:1;flex-basis:.000000001px;display:flex;flex-direction:column}#guide-inner-content.rolatech-drawer{overflow:hidden;flex:1;flex-basis:.000000001px;overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin}#scrim.rolatech-drawer{position:absolute;inset:0;transition-property:opacity;transform:translateZ(0);transition-duration:.2s;opacity:0;background:var(--rt-drawer-scrim-background, rgba(0, 0, 0, .5))}#scrim.visible.rolatech-drawer{opacity:1}#guide-spacer{margin-top:var(--ytd-masthead-height, 56px)}rolatech-drawer:not([persistent]) #guide-spacer{display:none}rolatech-drawer:not([persistent]){z-index:2030}.drawer-active{background-color:var(--rt-drawer-active-background-color, rgba(0, 0, 0, .05));font-weight:500;border-radius:10px}.content{display:flex;flex-direction:column;overflow:visible}.rolatech-drawer-button{background-color:var(--rt-brand-color, #000);color:var(--rt-brand-color-inverse, #fff)}.rolatech-drawer-button:hover{box-shadow:0 1px 3px #3c40434d,0 4px 8px 3px #3c404326;background-color:var(--rt-brand-color, #c2e7ff)}#endpoint.rt-guide-entry:hover{background-color:var(--rt-drawer-active-background-color);border-radius:10px}\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: IconComponent, selector: "rolatech-icon", inputs: ["filled"] }, { kind: "component", type: MenuIconComponent, selector: "rolatech-menu-icon" }, { kind: "ngmodule", type: MatButtonModule }], animations: [panelAnimations$1.indicator, panelAnimations$1.content], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
467
527
|
}
|
|
468
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
528
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: DrawerComponent, decorators: [{
|
|
469
529
|
type: Component,
|
|
470
530
|
args: [{ selector: 'rolatech-drawer', imports: [CommonModule, RouterLink, RouterLinkActive, IconComponent, MenuIconComponent, MatButtonModule], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: [panelAnimations$1.indicator, panelAnimations$1.content], host: {
|
|
471
531
|
id: 'rolatech-drawer',
|
|
@@ -480,8 +540,8 @@ class MiniGuideComponent {
|
|
|
480
540
|
renderer = inject(Renderer2);
|
|
481
541
|
platformId = inject(PLATFORM_ID);
|
|
482
542
|
breakpointObserver = inject(BreakpointObserver);
|
|
483
|
-
items = input();
|
|
484
|
-
title = input(true);
|
|
543
|
+
items = input(...(ngDevMode ? [undefined, { debugName: "items" }] : []));
|
|
544
|
+
title = input(true, ...(ngDevMode ? [{ debugName: "title" }] : []));
|
|
485
545
|
opened = false;
|
|
486
546
|
disableToggle = false;
|
|
487
547
|
breakpoint$ = this.breakpointObserver.observe([Breakpoints.Large, Breakpoints.Medium, '(max-width: 768px)']);
|
|
@@ -534,10 +594,10 @@ class MiniGuideComponent {
|
|
|
534
594
|
this.open();
|
|
535
595
|
}
|
|
536
596
|
}
|
|
537
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
538
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
597
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MiniGuideComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
598
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: MiniGuideComponent, isStandalone: true, selector: "rolatech-mini-guide", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "id": "rolatech-mini-guide" }, classAttribute: "rolatech-mini-guide" }, ngImport: i0, template: "<div id=\"items\" class=\"w-16 mt-[6px]\" style=\"transition-duration: 200ms\">\n @for (item of items(); track $index) {\n <div>\n <a\n id=\"min-guide-endpoint\"\n [routerLink]=\"item.link\"\n routerLinkActive=\"min-guide-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n #routerLink=\"routerLinkActive\"\n class=\"flex flex-col justify-center items-center py-3 rt-guide-entry\"\n >\n <rolatech-icon [filled]=\"routerLink.isActive\">{{ item.icon }}</rolatech-icon>\n @if (title()) {\n <span class=\"text-xs mt-1 max-w-full truncate\">{{ item.title }}</span>\n }\n </a>\n </div>\n }\n</div>\n", styles: ["rolatech-mini-guide{position:fixed;left:0;top:var(--rt-toolbar-height, 56px);bottom:0;width:var(--rt-mini-guide-width, 72px);box-sizing:border-box;display:inline-block;background-color:var(--rt-base-background, #fff);color:var(--rt-text-primary, #000);z-index:2028;padding:0 4px;scrollbar-width:none;overflow:scroll}.min-guide-active{background-color:#0000000d;border-radius:8px;font-weight:500}#min-guide-endpoint.rt-guide-entry:hover{background-color:var(--rt-drawer-active-background-color);border-radius:10px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: IconComponent, selector: "rolatech-icon", inputs: ["filled"] }, { 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"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
539
599
|
}
|
|
540
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
600
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MiniGuideComponent, decorators: [{
|
|
541
601
|
type: Component,
|
|
542
602
|
args: [{ selector: 'rolatech-mini-guide', imports: [CommonModule, IconComponent, RouterLink, RouterLinkActive], encapsulation: ViewEncapsulation.None, host: {
|
|
543
603
|
id: 'rolatech-mini-guide',
|
|
@@ -550,10 +610,10 @@ class AppPageComponent {
|
|
|
550
610
|
constructor() { }
|
|
551
611
|
ngOnInit() { }
|
|
552
612
|
ngAfterContentInit() { }
|
|
553
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
554
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
613
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: AppPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
614
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: AppPageComponent, isStandalone: true, selector: "rolatech-page", host: { attributes: { "id": "rolatech-page", "ngSkipHydration": "" }, classAttribute: "rolatech-page rt-page" }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: ["rolatech-page[transparent]{opacity:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
555
615
|
}
|
|
556
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
616
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: AppPageComponent, decorators: [{
|
|
557
617
|
type: Component,
|
|
558
618
|
args: [{ selector: 'rolatech-page', imports: [CommonModule], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
559
619
|
id: 'rolatech-page',
|
|
@@ -624,32 +684,32 @@ class LayoutComponent {
|
|
|
624
684
|
this.renderer.removeAttribute(this.el.nativeElement, 'mini-guide-visible');
|
|
625
685
|
}
|
|
626
686
|
}
|
|
627
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
628
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.0
|
|
687
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
688
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.2.0", type: LayoutComponent, isStandalone: true, selector: "rolatech-layout", host: { attributes: { "id": "rolatech-layout", "ngSkipHydration": "" }, classAttribute: "rolatech-layout" }, queries: [{ propertyName: "topbar", first: true, predicate: TopbarComponent, descendants: true, isSignal: true }, { propertyName: "drawer", first: true, predicate: DrawerComponent, descendants: true, isSignal: true }, { propertyName: "page", first: true, predicate: AppPageComponent, descendants: true, isSignal: true }, { propertyName: "guide", first: true, predicate: MiniGuideComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-content select=\"rolatech-topbar\"></ng-content>\n<ng-content select=\"rolatech-drawer\"></ng-content>\n<ng-content select=\"rolatech-mini-guide\"></ng-content>\n<ng-content select=\"rolatech-page\"></ng-content>\n<div class=\"flex-1\"></div>\n<ng-content select=\"rolatech-footer\"></ng-content>\n", styles: ["rolatech-layout{--rt-persistent-guide-width: 256px;--rt-mini-guide-width: 72px;display:flex;flex-direction:column;width:100%;height:100dvh;position:relative;background-color:var(--rt-layout-background-color, #fff);color:var(--rt-layout-color, #000)}rolatech-layout rolatech-drawer[persistent][opened][position=top]~rolatech-page{margin-top:56px}rolatech-layout rolatech-drawer[persistent][opened][position=left]~rolatech-page{margin-left:var(--rt-persistent-guide-width)}rolatech-layout rolatech-drawer[persistent][opened][position=right]~rolatech-page{margin-right:var(--rt-persistent-guide-width)}rolatech-layout rolatech-mini-guide[mini-guide-visible]~rolatech-page{margin-left:var(--rt-mini-guide-width)}rolatech-page{display:block;margin-top:56px;min-height:0;height:calc(100dvh - 56px)}rolatech-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 });
|
|
629
689
|
}
|
|
630
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
690
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LayoutComponent, decorators: [{
|
|
631
691
|
type: Component,
|
|
632
692
|
args: [{ selector: 'rolatech-layout', imports: [CommonModule, MatListModule, MatButtonModule, MatIconModule, MatSidenavModule], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
633
693
|
id: 'rolatech-layout',
|
|
634
694
|
class: 'rolatech-layout',
|
|
635
695
|
ngSkipHydration: '',
|
|
636
|
-
}, template: "<ng-content select=\"rolatech-topbar\"></ng-content>\n<ng-content select=\"rolatech-drawer\"></ng-content>\n<ng-content select=\"rolatech-mini-guide\"></ng-content>\n<ng-content select=\"rolatech-page\"></ng-content>\n<div class=\"flex-1\"></div>\n<ng-content select=\"rolatech-footer\"></ng-content>\n", styles: ["rolatech-layout{--rt-persistent-guide-width: 256px;--rt-mini-guide-width: 72px;display:flex;flex-direction:column;width:100%;height:
|
|
696
|
+
}, template: "<ng-content select=\"rolatech-topbar\"></ng-content>\n<ng-content select=\"rolatech-drawer\"></ng-content>\n<ng-content select=\"rolatech-mini-guide\"></ng-content>\n<ng-content select=\"rolatech-page\"></ng-content>\n<div class=\"flex-1\"></div>\n<ng-content select=\"rolatech-footer\"></ng-content>\n", styles: ["rolatech-layout{--rt-persistent-guide-width: 256px;--rt-mini-guide-width: 72px;display:flex;flex-direction:column;width:100%;height:100dvh;position:relative;background-color:var(--rt-layout-background-color, #fff);color:var(--rt-layout-color, #000)}rolatech-layout rolatech-drawer[persistent][opened][position=top]~rolatech-page{margin-top:56px}rolatech-layout rolatech-drawer[persistent][opened][position=left]~rolatech-page{margin-left:var(--rt-persistent-guide-width)}rolatech-layout rolatech-drawer[persistent][opened][position=right]~rolatech-page{margin-right:var(--rt-persistent-guide-width)}rolatech-layout rolatech-mini-guide[mini-guide-visible]~rolatech-page{margin-left:var(--rt-mini-guide-width)}rolatech-page{display:block;margin-top:56px;min-height:0;height:calc(100dvh - 56px)}rolatech-page[mini-guide-visible] .content{margin-left:72px}\n"] }]
|
|
637
697
|
}], ctorParameters: () => [] });
|
|
638
698
|
|
|
639
699
|
class FooterComponent {
|
|
640
700
|
hostId = 'rolatech-footer';
|
|
641
701
|
hasClass = true;
|
|
642
702
|
config = inject(APP_CONFIG);
|
|
643
|
-
title = input();
|
|
644
|
-
copyright = input('');
|
|
645
|
-
fTitle = computed(() => this.title() || this.config.name);
|
|
646
|
-
fCopyright = computed(() => this.copyright() || this.config.name);
|
|
647
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
648
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0
|
|
649
|
-
}
|
|
650
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
703
|
+
title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : []));
|
|
704
|
+
copyright = input('', ...(ngDevMode ? [{ debugName: "copyright" }] : []));
|
|
705
|
+
fTitle = computed(() => this.title() || this.config.name, ...(ngDevMode ? [{ debugName: "fTitle" }] : []));
|
|
706
|
+
fCopyright = computed(() => this.copyright() || this.config.name, ...(ngDevMode ? [{ debugName: "fCopyright" }] : []));
|
|
707
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: FooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
708
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.0", type: FooterComponent, isStandalone: true, selector: "rolatech-footer", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, copyright: { classPropertyName: "copyright", publicName: "copyright", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "id": "this.hostId", "class.rolatech-footer": "this.hasClass" } }, ngImport: i0, template: "<div class=\"bg-[--rt-base-background] flex flex-col justify-between px-5 md:px-16 py-6\">\n <div class=\"flex flex-col md:flex-row md:gap-10 gap-3 py-3\">\n <ng-content></ng-content>\n </div>\n <div class=\"flex justify-between items-end\">\n <div class=\"cursor-pointer\">\n <a href=\"/\" target=\"_blank\" class=\"text-lg font-bold\">{{ fTitle() }}</a>\n </div>\n <span class=\"text-sm\">\u00A9{{ fCopyright() }}</span>\n </div>\n</div>\n", styles: ["rolatech-footer{width:100%;display:var(--rt-footer-display, block)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
709
|
+
}
|
|
710
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: FooterComponent, decorators: [{
|
|
651
711
|
type: Component,
|
|
652
|
-
args: [{ selector: 'rolatech-footer', imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"bg-[--rt-base-background] flex flex-col justify-between px-5 md:px-16 py-6\">\n <div class=\"flex flex-col md:flex-row md:gap-10 gap-3 py-3\">\n <ng-content></ng-content>\n </div>\n <div class=\"flex justify-between items-end\">\n <div class=\"cursor-pointer\">\n <a href=\"/\" target=\"_blank\" class=\"text-lg font-bold\">{{ fTitle() }}</a>\n </div>\n <span class=\"text-sm\">\u00A9{{ fCopyright() }}</span>\n </div>\n</div>\n", styles: ["
|
|
712
|
+
args: [{ selector: 'rolatech-footer', imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"bg-[--rt-base-background] flex flex-col justify-between px-5 md:px-16 py-6\">\n <div class=\"flex flex-col md:flex-row md:gap-10 gap-3 py-3\">\n <ng-content></ng-content>\n </div>\n <div class=\"flex justify-between items-end\">\n <div class=\"cursor-pointer\">\n <a href=\"/\" target=\"_blank\" class=\"text-lg font-bold\">{{ fTitle() }}</a>\n </div>\n <span class=\"text-sm\">\u00A9{{ fCopyright() }}</span>\n </div>\n</div>\n", styles: ["rolatech-footer{width:100%;display:var(--rt-footer-display, block)}\n"] }]
|
|
653
713
|
}], propDecorators: { hostId: [{
|
|
654
714
|
type: HostBinding,
|
|
655
715
|
args: ['id']
|
|
@@ -659,10 +719,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
659
719
|
}] } });
|
|
660
720
|
|
|
661
721
|
class ConsoleLayoutComponent {
|
|
662
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
663
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
722
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ConsoleLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
723
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: ConsoleLayoutComponent, isStandalone: true, selector: "rolatech-console-layout", ngImport: i0, template: "<p>console-layout works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
664
724
|
}
|
|
665
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
725
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ConsoleLayoutComponent, decorators: [{
|
|
666
726
|
type: Component,
|
|
667
727
|
args: [{ selector: 'rolatech-console-layout', imports: [CommonModule], template: "<p>console-layout works!</p>\n" }]
|
|
668
728
|
}] });
|
|
@@ -670,24 +730,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
670
730
|
class TopbarAvatarMenuComponent {
|
|
671
731
|
environment = inject(APP_CONFIG);
|
|
672
732
|
platformId = inject(PLATFORM_ID);
|
|
673
|
-
menu = input.required();
|
|
674
|
-
avatar = input();
|
|
733
|
+
menu = input.required(...(ngDevMode ? [{ debugName: "menu" }] : []));
|
|
734
|
+
avatar = input(...(ngDevMode ? [undefined, { debugName: "avatar" }] : []));
|
|
675
735
|
openMenu() {
|
|
676
736
|
this.menu().focusFirstItem('mouse');
|
|
677
737
|
}
|
|
678
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
679
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
738
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TopbarAvatarMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
739
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: TopbarAvatarMenuComponent, isStandalone: true, selector: "rolatech-topbar-avatar-menu", inputs: { menu: { classPropertyName: "menu", publicName: "menu", isSignal: true, isRequired: true, transformFunction: null }, avatar: { classPropertyName: "avatar", publicName: "avatar", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex\">\n <a\n class=\"flex justify-center items-center rounded-full overflow-hidden cursor-pointer hover:outline-[--rt-raised-background] outline outline-transparent outline-4\"\n [matMenuTriggerFor]=\"menu()\"\n (click)=\"openMenu()\"\n >\n <div class=\"bg-[--rt-brand-color] w-9 h-9\">\n @if (avatar()) {\n <img class=\"w-9 h-9 object-cover\" [src]=\"avatar()\" alt />\n }\n </div>\n </a>\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$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }] });
|
|
680
740
|
}
|
|
681
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
741
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TopbarAvatarMenuComponent, decorators: [{
|
|
682
742
|
type: Component,
|
|
683
743
|
args: [{ selector: 'rolatech-topbar-avatar-menu', imports: [CommonModule, MatSidenavModule, MatListModule, MatIconModule, MatMenuModule], template: "<div class=\"flex\">\n <a\n class=\"flex justify-center items-center rounded-full overflow-hidden cursor-pointer hover:outline-[--rt-raised-background] outline outline-transparent outline-4\"\n [matMenuTriggerFor]=\"menu()\"\n (click)=\"openMenu()\"\n >\n <div class=\"bg-[--rt-brand-color] w-9 h-9\">\n @if (avatar()) {\n <img class=\"w-9 h-9 object-cover\" [src]=\"avatar()\" alt />\n }\n </div>\n </a>\n</div>\n" }]
|
|
684
744
|
}] });
|
|
685
745
|
|
|
686
746
|
class FolderComponent {
|
|
687
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
688
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
747
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: FolderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
748
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: FolderComponent, isStandalone: true, selector: "rolatech-folder", ngImport: i0, template: "<div></div>\n", styles: [""] });
|
|
689
749
|
}
|
|
690
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
750
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: FolderComponent, decorators: [{
|
|
691
751
|
type: Component,
|
|
692
752
|
args: [{ selector: 'rolatech-folder', template: "<div></div>\n" }]
|
|
693
753
|
}] });
|
|
@@ -722,16 +782,16 @@ class MediaPreviewDialogComponent {
|
|
|
722
782
|
this.prevDisabled = this.selected === 0;
|
|
723
783
|
this.nextDisabled = this.selected === this.data.media.length - 1;
|
|
724
784
|
}
|
|
725
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
726
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
785
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MediaPreviewDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1$2.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
786
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.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\" alt />\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$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }] });
|
|
727
787
|
}
|
|
728
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
788
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MediaPreviewDialogComponent, decorators: [{
|
|
729
789
|
type: Component,
|
|
730
790
|
args: [{ selector: 'rolatech-media-preview-dialog', 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\" alt />\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" }]
|
|
731
791
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
732
792
|
type: Inject,
|
|
733
793
|
args: [MAT_DIALOG_DATA]
|
|
734
|
-
}] }, { type: i1$
|
|
794
|
+
}] }, { type: i1$2.MatDialogRef }] });
|
|
735
795
|
|
|
736
796
|
const MAT_MODULE = [
|
|
737
797
|
A11yModule,
|
|
@@ -781,8 +841,8 @@ const MAT_MODULE = [
|
|
|
781
841
|
ScrollingModule,
|
|
782
842
|
];
|
|
783
843
|
class MaterialModule {
|
|
784
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
785
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0
|
|
844
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MaterialModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
845
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.2.0", ngImport: i0, type: MaterialModule, imports: [A11yModule,
|
|
786
846
|
ClipboardModule,
|
|
787
847
|
CdkStepperModule,
|
|
788
848
|
CdkTableModule,
|
|
@@ -871,7 +931,7 @@ class MaterialModule {
|
|
|
871
931
|
MatTreeModule,
|
|
872
932
|
PortalModule,
|
|
873
933
|
ScrollingModule] });
|
|
874
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0
|
|
934
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MaterialModule, imports: [MAT_MODULE, A11yModule,
|
|
875
935
|
ClipboardModule,
|
|
876
936
|
CdkStepperModule,
|
|
877
937
|
CdkTableModule,
|
|
@@ -917,7 +977,7 @@ class MaterialModule {
|
|
|
917
977
|
PortalModule,
|
|
918
978
|
ScrollingModule] });
|
|
919
979
|
}
|
|
920
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
980
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MaterialModule, decorators: [{
|
|
921
981
|
type: NgModule,
|
|
922
982
|
args: [{
|
|
923
983
|
imports: [...MAT_MODULE],
|
|
@@ -926,11 +986,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
926
986
|
}] });
|
|
927
987
|
|
|
928
988
|
class AngularComponentsModule {
|
|
929
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
930
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0
|
|
931
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0
|
|
989
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: AngularComponentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
990
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.2.0", ngImport: i0, type: AngularComponentsModule, imports: [MaterialModule], exports: [MaterialModule] });
|
|
991
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: AngularComponentsModule, imports: [MaterialModule, MaterialModule] });
|
|
932
992
|
}
|
|
933
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
993
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: AngularComponentsModule, decorators: [{
|
|
934
994
|
type: NgModule,
|
|
935
995
|
args: [{
|
|
936
996
|
imports: [MaterialModule],
|
|
@@ -939,7 +999,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
939
999
|
}] });
|
|
940
1000
|
|
|
941
1001
|
class SpinnerComponent {
|
|
942
|
-
title = input();
|
|
1002
|
+
title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : []));
|
|
943
1003
|
isLoading;
|
|
944
1004
|
loadingSubscription;
|
|
945
1005
|
loadingService = inject(LoadingService);
|
|
@@ -957,19 +1017,19 @@ class SpinnerComponent {
|
|
|
957
1017
|
if (this.loadingSubscription)
|
|
958
1018
|
this.loadingSubscription.unsubscribe();
|
|
959
1019
|
}
|
|
960
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
961
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0
|
|
1020
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: SpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1021
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.0", type: SpinnerComponent, isStandalone: true, selector: "rolatech-spinner", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex justify-center\">\n <div class=\"lds-spinner\">\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n </div>\n</div>\n", styles: [".lds-spinner{color:official;display:inline-block;position:relative;width:40px;height:40px}.lds-spinner div{transform-origin:20px 20px;animation:lds-spinner 1.2s linear infinite}.lds-spinner div:after{content:\" \";display:block;position:absolute;top:4px;left:18px;width:4px;height:8px;border-radius:20%;background:#333}.lds-spinner div:nth-child(1){transform:rotate(0);animation-delay:-1.1s}.lds-spinner div:nth-child(2){transform:rotate(30deg);animation-delay:-1s}.lds-spinner div:nth-child(3){transform:rotate(60deg);animation-delay:-.9s}.lds-spinner div:nth-child(4){transform:rotate(90deg);animation-delay:-.8s}.lds-spinner div:nth-child(5){transform:rotate(120deg);animation-delay:-.7s}.lds-spinner div:nth-child(6){transform:rotate(150deg);animation-delay:-.6s}.lds-spinner div:nth-child(7){transform:rotate(180deg);animation-delay:-.5s}.lds-spinner div:nth-child(8){transform:rotate(210deg);animation-delay:-.4s}.lds-spinner div:nth-child(9){transform:rotate(240deg);animation-delay:-.3s}.lds-spinner div:nth-child(10){transform:rotate(270deg);animation-delay:-.2s}.lds-spinner div:nth-child(11){transform:rotate(300deg);animation-delay:-.1s}.lds-spinner div:nth-child(12){transform:rotate(330deg);animation-delay:0s}@keyframes lds-spinner{0%{opacity:1}to{opacity:0}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
962
1022
|
}
|
|
963
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1023
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: SpinnerComponent, decorators: [{
|
|
964
1024
|
type: Component,
|
|
965
1025
|
args: [{ selector: 'rolatech-spinner', imports: [CommonModule], template: "<div class=\"flex justify-center\">\n <div class=\"lds-spinner\">\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n </div>\n</div>\n", styles: [".lds-spinner{color:official;display:inline-block;position:relative;width:40px;height:40px}.lds-spinner div{transform-origin:20px 20px;animation:lds-spinner 1.2s linear infinite}.lds-spinner div:after{content:\" \";display:block;position:absolute;top:4px;left:18px;width:4px;height:8px;border-radius:20%;background:#333}.lds-spinner div:nth-child(1){transform:rotate(0);animation-delay:-1.1s}.lds-spinner div:nth-child(2){transform:rotate(30deg);animation-delay:-1s}.lds-spinner div:nth-child(3){transform:rotate(60deg);animation-delay:-.9s}.lds-spinner div:nth-child(4){transform:rotate(90deg);animation-delay:-.8s}.lds-spinner div:nth-child(5){transform:rotate(120deg);animation-delay:-.7s}.lds-spinner div:nth-child(6){transform:rotate(150deg);animation-delay:-.6s}.lds-spinner div:nth-child(7){transform:rotate(180deg);animation-delay:-.5s}.lds-spinner div:nth-child(8){transform:rotate(210deg);animation-delay:-.4s}.lds-spinner div:nth-child(9){transform:rotate(240deg);animation-delay:-.3s}.lds-spinner div:nth-child(10){transform:rotate(270deg);animation-delay:-.2s}.lds-spinner div:nth-child(11){transform:rotate(300deg);animation-delay:-.1s}.lds-spinner div:nth-child(12){transform:rotate(330deg);animation-delay:0s}@keyframes lds-spinner{0%{opacity:1}to{opacity:0}}\n"] }]
|
|
966
1026
|
}] });
|
|
967
1027
|
|
|
968
1028
|
class MediaUploadComponent {
|
|
969
|
-
title = input('上传图片');
|
|
970
|
-
subtitle = input('文件大小');
|
|
971
|
-
description = input('不能超过5MB');
|
|
972
|
-
isUploading = input(false);
|
|
1029
|
+
title = input('上传图片', ...(ngDevMode ? [{ debugName: "title" }] : []));
|
|
1030
|
+
subtitle = input('文件大小', ...(ngDevMode ? [{ debugName: "subtitle" }] : []));
|
|
1031
|
+
description = input('不能超过5MB', ...(ngDevMode ? [{ debugName: "description" }] : []));
|
|
1032
|
+
isUploading = input(false, ...(ngDevMode ? [{ debugName: "isUploading" }] : []));
|
|
973
1033
|
mediaItemClick = output();
|
|
974
1034
|
upload = output();
|
|
975
1035
|
media = [];
|
|
@@ -1007,31 +1067,31 @@ class MediaUploadComponent {
|
|
|
1007
1067
|
};
|
|
1008
1068
|
}
|
|
1009
1069
|
}
|
|
1010
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1011
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1070
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MediaUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1071
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: MediaUploadComponent, isStandalone: true, selector: "rolatech-media-upload", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, isUploading: { classPropertyName: "isUploading", publicName: "isUploading", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { mediaItemClick: "mediaItemClick", upload: "upload" }, ngImport: i0, template: "<div class=\"bg-[--rt-raised-background] 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-[--rt-text-secondary]\">{{ subtitle() }}</div>\n <div class=\"font-sm text-[--rt-text-secondary]\">{{ 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 (click)=\"fileInput.click()\" i18n>Upload</button>\n </div>\n </div>\n } @else {\n <rolatech-spinner title=\"Uploading\"></rolatech-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\" alt />\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: i3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }] });
|
|
1012
1072
|
}
|
|
1013
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1073
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MediaUploadComponent, decorators: [{
|
|
1014
1074
|
type: Component,
|
|
1015
1075
|
args: [{ imports: [AngularCommonModule, AngularComponentsModule, SpinnerComponent], selector: 'rolatech-media-upload', template: "<div class=\"bg-[--rt-raised-background] 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-[--rt-text-secondary]\">{{ subtitle() }}</div>\n <div class=\"font-sm text-[--rt-text-secondary]\">{{ 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 (click)=\"fileInput.click()\" i18n>Upload</button>\n </div>\n </div>\n } @else {\n <rolatech-spinner title=\"Uploading\"></rolatech-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\" alt />\n </div>\n }\n</div>\n", styles: [".mat-icon{transform:scale(2)}\n"] }]
|
|
1016
1076
|
}] });
|
|
1017
1077
|
|
|
1018
1078
|
class StorageBucketCreateComponent {
|
|
1019
|
-
name = input();
|
|
1079
|
+
name = input(...(ngDevMode ? [undefined, { debugName: "name" }] : []));
|
|
1020
1080
|
output = output();
|
|
1021
1081
|
ngOnInit() { }
|
|
1022
1082
|
ngDoCheck() {
|
|
1023
1083
|
this.output.emit(this.name());
|
|
1024
1084
|
}
|
|
1025
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1026
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0
|
|
1085
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: StorageBucketCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1086
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.0", type: StorageBucketCreateComponent, isStandalone: true, selector: "rolatech-storage-bucket-create", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { output: "output" }, ngImport: i0, template: "<div>\n <mat-form-field>\n <mat-label i18n>Name</mat-label>\n <input matInput placeholder=\"Enter name\" [(ngModel)]=\"name\" i18n-placeholder />\n </mat-form-field>\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$3.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
1027
1087
|
}
|
|
1028
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1088
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: StorageBucketCreateComponent, decorators: [{
|
|
1029
1089
|
type: Component,
|
|
1030
1090
|
args: [{ selector: 'rolatech-storage-bucket-create', imports: [MatFormFieldModule, MatInputModule, FormsModule], template: "<div>\n <mat-form-field>\n <mat-label i18n>Name</mat-label>\n <input matInput placeholder=\"Enter name\" [(ngModel)]=\"name\" i18n-placeholder />\n </mat-form-field>\n</div>\n", styles: ["mat-form-field{width:100%}\n"] }]
|
|
1031
1091
|
}] });
|
|
1032
1092
|
|
|
1033
1093
|
class StorageFileUploadComponent {
|
|
1034
|
-
title = input();
|
|
1094
|
+
title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : []));
|
|
1035
1095
|
output = output();
|
|
1036
1096
|
fileData;
|
|
1037
1097
|
progressInfos = [];
|
|
@@ -1053,26 +1113,26 @@ class StorageFileUploadComponent {
|
|
|
1053
1113
|
removeFile() {
|
|
1054
1114
|
this.file = null;
|
|
1055
1115
|
}
|
|
1056
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1057
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1116
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: StorageFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1117
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: StorageFileUploadComponent, isStandalone: true, selector: "rolatech-storage-file-upload", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, 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$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
|
|
1058
1118
|
}
|
|
1059
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1119
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: StorageFileUploadComponent, decorators: [{
|
|
1060
1120
|
type: Component,
|
|
1061
1121
|
args: [{ selector: 'rolatech-storage-file-upload', 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"] }]
|
|
1062
1122
|
}] });
|
|
1063
1123
|
|
|
1064
1124
|
class StorageFolderCreateComponent {
|
|
1065
|
-
name = input();
|
|
1066
|
-
isPublic = input(true);
|
|
1125
|
+
name = input(...(ngDevMode ? [undefined, { debugName: "name" }] : []));
|
|
1126
|
+
isPublic = input(true, ...(ngDevMode ? [{ debugName: "isPublic" }] : []));
|
|
1067
1127
|
output = output();
|
|
1068
1128
|
ngOnInit() { }
|
|
1069
1129
|
ngDoCheck() {
|
|
1070
1130
|
this.output.emit({ name: this.name(), isPublic: this.isPublic() });
|
|
1071
1131
|
}
|
|
1072
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1073
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0
|
|
1132
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: StorageFolderCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1133
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.0", type: StorageFolderCreateComponent, isStandalone: true, selector: "rolatech-storage-folder-create", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, isPublic: { classPropertyName: "isPublic", publicName: "isPublic", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { output: "output" }, ngImport: i0, template: "<div>\n <mat-form-field>\n <mat-label i18n>Name</mat-label>\n <input matInput placeholder=\"Name\" [(ngModel)]=\"name\" i18n />\n </mat-form-field>\n <div class=\"flex flex-col\">\n <mat-checkbox [(ngModel)]=\"isPublic\" i18n>Public resources</mat-checkbox>\n <span class=\"text-sm text-[--rt-text-secondary] ml-2 mt-1\" i18n>\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$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$3.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i3$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }] });
|
|
1074
1134
|
}
|
|
1075
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1135
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: StorageFolderCreateComponent, decorators: [{
|
|
1076
1136
|
type: Component,
|
|
1077
1137
|
args: [{ selector: 'rolatech-storage-folder-create', imports: [MatFormFieldModule, MatInputModule, FormsModule, MatCheckboxModule], template: "<div>\n <mat-form-field>\n <mat-label i18n>Name</mat-label>\n <input matInput placeholder=\"Name\" [(ngModel)]=\"name\" i18n />\n </mat-form-field>\n <div class=\"flex flex-col\">\n <mat-checkbox [(ngModel)]=\"isPublic\" i18n>Public resources</mat-checkbox>\n <span class=\"text-sm text-[--rt-text-secondary] ml-2 mt-1\" i18n>\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"] }]
|
|
1078
1138
|
}] });
|
|
@@ -1080,21 +1140,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
1080
1140
|
class MenuUserComponent {
|
|
1081
1141
|
environment = inject(APP_CONFIG);
|
|
1082
1142
|
myaccountUrl = this.environment.myaccountUrl;
|
|
1083
|
-
user = input();
|
|
1084
|
-
title = input();
|
|
1085
|
-
subtitle = input();
|
|
1143
|
+
user = input(...(ngDevMode ? [undefined, { debugName: "user" }] : []));
|
|
1144
|
+
title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : []));
|
|
1145
|
+
subtitle = input(...(ngDevMode ? [undefined, { debugName: "subtitle" }] : []));
|
|
1086
1146
|
avatar = computed(() => {
|
|
1087
1147
|
return this.user().avatar;
|
|
1088
|
-
});
|
|
1148
|
+
}, ...(ngDevMode ? [{ debugName: "avatar" }] : []));
|
|
1089
1149
|
constructor() {
|
|
1090
1150
|
// effect(() => {
|
|
1091
1151
|
// this.data = this.user();
|
|
1092
1152
|
// });
|
|
1093
1153
|
}
|
|
1094
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1095
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1154
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MenuUserComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1155
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: MenuUserComponent, isStandalone: true, selector: "rolatech-menu-user", inputs: { user: { classPropertyName: "user", publicName: "user", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"min-w-[256px]\">\n @if (user()) {\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-[--rt-brand-color]\">\n @if (user().avatar) {\n <img [src]=\"user().avatar\" class=\"w-14 h-14 object-cover rounded-full\" alt />\n }\n </div>\n <div class=\"flex flex-col\">\n <div>\n <div class=\"text-lg font-bold\">{{ title() ? title() : user().name }}</div>\n <div class=\"formated-string\">\n @if (subtitle()) {\n <span>@{{ subtitle() }}</span>\n } @else {\n <span>@{{ user().username }}</span>\n }\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n\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\" i18n> Manage account </span>\n <span class=\"flex\"> <mat-icon>open_in_new</mat-icon></span>\n </span>\n </a>\n </div>\n</div>\n", styles: ["rolatech-menu-user{background-color:var(--rt-menu-background, #fff);color:var(--rt-text-primary, #000)}.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$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1096
1156
|
}
|
|
1097
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1157
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MenuUserComponent, decorators: [{
|
|
1098
1158
|
type: Component,
|
|
1099
1159
|
args: [{ imports: [MatMenuModule, MatIconModule], selector: 'rolatech-menu-user', encapsulation: ViewEncapsulation.None, template: "<div class=\"min-w-[256px]\">\n @if (user()) {\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-[--rt-brand-color]\">\n @if (user().avatar) {\n <img [src]=\"user().avatar\" class=\"w-14 h-14 object-cover rounded-full\" alt />\n }\n </div>\n <div class=\"flex flex-col\">\n <div>\n <div class=\"text-lg font-bold\">{{ title() ? title() : user().name }}</div>\n <div class=\"formated-string\">\n @if (subtitle()) {\n <span>@{{ subtitle() }}</span>\n } @else {\n <span>@{{ user().username }}</span>\n }\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n\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\" i18n> Manage account </span>\n <span class=\"flex\"> <mat-icon>open_in_new</mat-icon></span>\n </span>\n </a>\n </div>\n</div>\n", styles: ["rolatech-menu-user{background-color:var(--rt-menu-background, #fff);color:var(--rt-text-primary, #000)}.formated-string{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}\n"] }]
|
|
1100
1160
|
}], ctorParameters: () => [] });
|
|
@@ -1102,9 +1162,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
1102
1162
|
class WechatConnectDialogComponent {
|
|
1103
1163
|
dialogRef = inject(MatDialogRef);
|
|
1104
1164
|
environment = inject(APP_CONFIG);
|
|
1105
|
-
appId = model();
|
|
1106
|
-
redirectUri = model('');
|
|
1107
|
-
state = model();
|
|
1165
|
+
appId = model(...(ngDevMode ? [undefined, { debugName: "appId" }] : []));
|
|
1166
|
+
redirectUri = model('', ...(ngDevMode ? [{ debugName: "redirectUri" }] : []));
|
|
1167
|
+
state = model(...(ngDevMode ? [undefined, { debugName: "state" }] : []));
|
|
1108
1168
|
urlSafe;
|
|
1109
1169
|
sanitizer = inject(DomSanitizer);
|
|
1110
1170
|
baseUrl = 'https://open.weixin.qq.com/connect/qrconnect';
|
|
@@ -1126,10 +1186,10 @@ class WechatConnectDialogComponent {
|
|
|
1126
1186
|
this.dialogRef.close();
|
|
1127
1187
|
}
|
|
1128
1188
|
}
|
|
1129
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1130
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1189
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: WechatConnectDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1190
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: WechatConnectDialogComponent, isStandalone: true, selector: "rolatech-wechat-connect-dialog", inputs: { appId: { classPropertyName: "appId", publicName: "appId", isSignal: true, isRequired: false, transformFunction: null }, redirectUri: { classPropertyName: "redirectUri", publicName: "redirectUri", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { appId: "appIdChange", redirectUri: "redirectUriChange", state: "stateChange" }, host: { listeners: { "window:message": "onLogin($event)" } }, ngImport: i0, template: "<div class=\"flex flex-col p-3 items-center\">\n <div class=\"w-[190px] h-[190px]\">\n @if (loaded) {\n <iframe [src]=\"urlSafe\" class=\"w-full h-full inline\" scrolling=\"no\" frameBorder=\"no\"></iframe>\n }\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"] });
|
|
1131
1191
|
}
|
|
1132
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1192
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: WechatConnectDialogComponent, decorators: [{
|
|
1133
1193
|
type: Component,
|
|
1134
1194
|
args: [{ selector: 'rolatech-wechat-connect-dialog', template: "<div class=\"flex flex-col p-3 items-center\">\n <div class=\"w-[190px] h-[190px]\">\n @if (loaded) {\n <iframe [src]=\"urlSafe\" class=\"w-full h-full inline\" scrolling=\"no\" frameBorder=\"no\"></iframe>\n }\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"] }]
|
|
1135
1195
|
}], ctorParameters: () => [], propDecorators: { onLogin: [{
|
|
@@ -1206,21 +1266,21 @@ class MediaUploadDialogComponent {
|
|
|
1206
1266
|
},
|
|
1207
1267
|
});
|
|
1208
1268
|
}
|
|
1209
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1210
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1269
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MediaUploadDialogComponent, deps: [{ token: i1$2.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: i2$3.MediaService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1270
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: MediaUploadDialogComponent, isStandalone: true, selector: "rolatech-media-upload-dialog", ngImport: i0, template: "<mat-dialog-content>\n <div class=\"border-dashed border-2 border-[--rt-border-color] 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()\" i18n>Upload</button>\n </div>\n <div class=\"mt-4\">\n <h2 class=\"\" i18n>Preview</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-[--rt-raised-background] 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\" alt />\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\n (click)=\"removeImage(i)\"\n class=\"delete ml-auto focus:outline-none hover:bg-[--rt-base-background] p-1 rounded-md\"\n >\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-[--rt-text-secondary]\">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 i18n>Cancel</button>\n @if (preMedia.length <= 0) {\n <button mat-button i18n>Awaiting</button>\n }\n @if (!isFinished && preMedia.length > 0) {\n <button mat-button (click)=\"uploadFiles()\" i18n>Upload</button>\n }\n @if (isFinished) {\n <button mat-button [mat-dialog-close]=\"media\" i18n>Donw</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: i3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i4.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"] }] });
|
|
1211
1271
|
}
|
|
1212
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1272
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MediaUploadDialogComponent, decorators: [{
|
|
1213
1273
|
type: Component,
|
|
1214
1274
|
args: [{ selector: 'rolatech-media-upload-dialog', imports: [MatDialogContent, MatButtonModule, NgClass, MatProgressSpinnerModule, MatDialogActions, MatDialogClose], template: "<mat-dialog-content>\n <div class=\"border-dashed border-2 border-[--rt-border-color] 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()\" i18n>Upload</button>\n </div>\n <div class=\"mt-4\">\n <h2 class=\"\" i18n>Preview</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-[--rt-raised-background] 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\" alt />\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\n (click)=\"removeImage(i)\"\n class=\"delete ml-auto focus:outline-none hover:bg-[--rt-base-background] p-1 rounded-md\"\n >\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-[--rt-text-secondary]\">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 i18n>Cancel</button>\n @if (preMedia.length <= 0) {\n <button mat-button i18n>Awaiting</button>\n }\n @if (!isFinished && preMedia.length > 0) {\n <button mat-button (click)=\"uploadFiles()\" i18n>Upload</button>\n }\n @if (isFinished) {\n <button mat-button [mat-dialog-close]=\"media\" i18n>Donw</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"] }]
|
|
1215
|
-
}], ctorParameters: () => [{ type: i1$
|
|
1275
|
+
}], ctorParameters: () => [{ type: i1$2.MatDialogRef }, { type: undefined, decorators: [{
|
|
1216
1276
|
type: Inject,
|
|
1217
1277
|
args: [MAT_DIALOG_DATA]
|
|
1218
1278
|
}] }, { type: i2$3.MediaService }] });
|
|
1219
1279
|
|
|
1220
1280
|
class MediaListComponent {
|
|
1221
|
-
isUploading = input();
|
|
1222
|
-
media = input();
|
|
1223
|
-
showAdd = input(true);
|
|
1281
|
+
isUploading = input(...(ngDevMode ? [undefined, { debugName: "isUploading" }] : []));
|
|
1282
|
+
media = input(...(ngDevMode ? [undefined, { debugName: "media" }] : []));
|
|
1283
|
+
showAdd = input(true, ...(ngDevMode ? [{ debugName: "showAdd" }] : []));
|
|
1224
1284
|
mediaItemClick = output();
|
|
1225
1285
|
upload = output();
|
|
1226
1286
|
onMediaItemClick(item) {
|
|
@@ -1229,18 +1289,18 @@ class MediaListComponent {
|
|
|
1229
1289
|
onUpload(event) {
|
|
1230
1290
|
this.upload.emit(event);
|
|
1231
1291
|
}
|
|
1232
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1233
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1292
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MediaListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1293
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: MediaListComponent, isStandalone: true, selector: "rolatech-media-list", inputs: { isUploading: { classPropertyName: "isUploading", publicName: "isUploading", isSignal: true, isRequired: false, transformFunction: null }, media: { classPropertyName: "media", publicName: "media", isSignal: true, isRequired: false, transformFunction: null }, showAdd: { classPropertyName: "showAdd", publicName: "showAdd", isSignal: true, isRequired: false, transformFunction: null } }, 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 multiple />\n @if (showAdd()) {\n <div class=\"add-button\">\n <div (click)=\"fileInput.click()\" class=\"tile-media flex justify-center items-center\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"48px\" viewBox=\"0 -960 960 960\" width=\"48px\" fill=\"#5f6368\">\n <path d=\"M444-444H240v-72h204v-204h72v204h204v72H516v204h-72v-204Z\" />\n </svg>\n </div>\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}rolatech-media-list-item:before{border-radius:12px}\n"], dependencies: [{ kind: "ngmodule", type: MatProgressBarModule }, { kind: "component", type: i1$1.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }] });
|
|
1234
1294
|
}
|
|
1235
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1295
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MediaListComponent, decorators: [{
|
|
1236
1296
|
type: Component,
|
|
1237
1297
|
args: [{ selector: 'rolatech-media-list', 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 multiple />\n @if (showAdd()) {\n <div class=\"add-button\">\n <div (click)=\"fileInput.click()\" class=\"tile-media flex justify-center items-center\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"48px\" viewBox=\"0 -960 960 960\" width=\"48px\" fill=\"#5f6368\">\n <path d=\"M444-444H240v-72h204v-204h72v204h204v72H516v204h-72v-204Z\" />\n </svg>\n </div>\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}rolatech-media-list-item:before{border-radius:12px}\n"] }]
|
|
1238
1298
|
}] });
|
|
1239
1299
|
|
|
1240
1300
|
class MediaListItemComponent {
|
|
1241
|
-
media = input.required();
|
|
1242
|
-
uploadProgress = input(0);
|
|
1243
|
-
uploading = input(false);
|
|
1301
|
+
media = input.required(...(ngDevMode ? [{ debugName: "media" }] : []));
|
|
1302
|
+
uploadProgress = input(0, ...(ngDevMode ? [{ debugName: "uploadProgress" }] : []));
|
|
1303
|
+
uploading = input(false, ...(ngDevMode ? [{ debugName: "uploading" }] : []));
|
|
1244
1304
|
mediaItemClick = output();
|
|
1245
1305
|
deleteMedia = output();
|
|
1246
1306
|
onMediaItemClick(event) {
|
|
@@ -1249,10 +1309,10 @@ class MediaListItemComponent {
|
|
|
1249
1309
|
onDeleteMedia(media) {
|
|
1250
1310
|
this.deleteMedia.emit(media);
|
|
1251
1311
|
}
|
|
1252
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1253
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1312
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MediaListItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1313
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: MediaListItemComponent, isStandalone: true, selector: "rolatech-media-list-item", inputs: { media: { classPropertyName: "media", publicName: "media", isSignal: true, isRequired: true, transformFunction: null }, uploadProgress: { classPropertyName: "uploadProgress", publicName: "uploadProgress", isSignal: true, isRequired: false, transformFunction: null }, uploading: { classPropertyName: "uploading", publicName: "uploading", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { mediaItemClick: "mediaItemClick", deleteMedia: "deleteMedia" }, ngImport: i0, template: "<div\n class=\"group media-list-item relative hasImage focus:outline-none focus:shadow-outline bg-[--rt-raised-background] cursor-pointer text-transparent hover:text-white shadow-sm\"\n>\n <div class=\"absolute z-30 right-0 p-1 group-hover:bg-white\">\n <div class=\"flex-1\"></div>\n <div class=\"w-full\">\n <button\n mat-icon-button\n [matMenuTriggerFor]=\"beforeMenu\"\n class=\"ml-auto focus:outline-none hover:bg-[--rt-base-background] p-1 group-hover:bg-white\"\n >\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 i18n>Delete</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<div class=\"w-full py-1\">\n @if (uploading()) {\n <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n }\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: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i2$1.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$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i2$1.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$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }] });
|
|
1254
1314
|
}
|
|
1255
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1315
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MediaListItemComponent, decorators: [{
|
|
1256
1316
|
type: Component,
|
|
1257
1317
|
args: [{ selector: 'rolatech-media-list-item', imports: [MatButtonModule, MatMenuModule, MatIconModule, MatProgressBar], template: "<div\n class=\"group media-list-item relative hasImage focus:outline-none focus:shadow-outline bg-[--rt-raised-background] cursor-pointer text-transparent hover:text-white shadow-sm\"\n>\n <div class=\"absolute z-30 right-0 p-1 group-hover:bg-white\">\n <div class=\"flex-1\"></div>\n <div class=\"w-full\">\n <button\n mat-icon-button\n [matMenuTriggerFor]=\"beforeMenu\"\n class=\"ml-auto focus:outline-none hover:bg-[--rt-base-background] p-1 group-hover:bg-white\"\n >\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 i18n>Delete</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<div class=\"w-full py-1\">\n @if (uploading()) {\n <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n }\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"] }]
|
|
1258
1318
|
}] });
|
|
@@ -1274,10 +1334,10 @@ class NotFoundComponent {
|
|
|
1274
1334
|
}
|
|
1275
1335
|
});
|
|
1276
1336
|
}
|
|
1277
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1278
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
1337
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NotFoundComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1338
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.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: ["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}.not-found-content a{text-decoration:underline}\n"] });
|
|
1279
1339
|
}
|
|
1280
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1340
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NotFoundComponent, decorators: [{
|
|
1281
1341
|
type: Component,
|
|
1282
1342
|
args: [{ selector: 'rolatech-not-found', 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: ["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}.not-found-content a{text-decoration:underline}\n"] }]
|
|
1283
1343
|
}], ctorParameters: () => [] });
|
|
@@ -1288,10 +1348,10 @@ class ConfirmationDialogComponent {
|
|
|
1288
1348
|
onNoClick() {
|
|
1289
1349
|
this.dialogRef.close();
|
|
1290
1350
|
}
|
|
1291
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1292
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1351
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ConfirmationDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1352
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.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 i18n>Cancel</button>\n <button mat-button [mat-dialog-close]=\"true\" cdkFocusInitial i18n>Ok</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: i3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
|
|
1293
1353
|
}
|
|
1294
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1354
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ConfirmationDialogComponent, decorators: [{
|
|
1295
1355
|
type: Component,
|
|
1296
1356
|
args: [{ selector: 'rolatech-confirmation-dialog', 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 i18n>Cancel</button>\n <button mat-button [mat-dialog-close]=\"true\" cdkFocusInitial i18n>Ok</button>\n</div>\n" }]
|
|
1297
1357
|
}] });
|
|
@@ -1369,29 +1429,29 @@ class LocationSelectorComponent {
|
|
|
1369
1429
|
});
|
|
1370
1430
|
}
|
|
1371
1431
|
selectionChange(event) { }
|
|
1372
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1373
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1432
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LocationSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1433
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: LocationSelectorComponent, isStandalone: true, selector: "rolatech-location-selector", outputs: { output: "output" }, ngImport: i0, template: "<div class=\"h-full\">\n <div class=\"relative h-full\">\n <div id=\"map-container\" class=\"h-full\"></div>\n <div class=\"absolute bg-white z-[9999] top-[30px] left-[30px]\">\n <div class=\"flex gap-3 px-3 pt-3\">\n <mat-form-field appearance=\"fill\" [style.width.px]=\"180\">\n <mat-label>\u57CE\u5E02</mat-label>\n <mat-select #select=\"matSelect\" [(ngModel)]=\"region\" (selectionChange)=\"selectionChange($event)\">\n @for (city of cities; track city) {\n <mat-option [value]=\"city\">\n {{ city }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <input matInput placeholder=\"\u8F93\u5165\u5173\u952E\u5B57\u641C\u7D22\" (input)=\"onSearchChange($event)\" />\n </mat-form-field>\n </div>\n <div class=\"max-h-[320px] overflow-scroll pb-3 bg-white\">\n @for (item of lists; track item; let index = $index) {\n <div (click)=\"setLocation(index)\" class=\"cursor-pointer\">\n <div class=\"p-3 flex items-center gap-2 hover:bg-[--rt-raised-background]\">\n <mat-icon fontIcon=\"location_on\"></mat-icon>\n <div class=\"text-sm font-thin\">{{ item.title }}</div>\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n</div>\n", styles: ["mat-form-field{width:100%;margin-bottom:-1.25em}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$3.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$4.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i3$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }] });
|
|
1374
1434
|
}
|
|
1375
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1435
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: LocationSelectorComponent, decorators: [{
|
|
1376
1436
|
type: Component,
|
|
1377
1437
|
args: [{ selector: 'rolatech-location-selector', imports: [MatFormFieldModule, MatSelectModule, FormsModule, MatOptionModule, MatInputModule, MatIconModule, MatButtonModule], template: "<div class=\"h-full\">\n <div class=\"relative h-full\">\n <div id=\"map-container\" class=\"h-full\"></div>\n <div class=\"absolute bg-white z-[9999] top-[30px] left-[30px]\">\n <div class=\"flex gap-3 px-3 pt-3\">\n <mat-form-field appearance=\"fill\" [style.width.px]=\"180\">\n <mat-label>\u57CE\u5E02</mat-label>\n <mat-select #select=\"matSelect\" [(ngModel)]=\"region\" (selectionChange)=\"selectionChange($event)\">\n @for (city of cities; track city) {\n <mat-option [value]=\"city\">\n {{ city }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <input matInput placeholder=\"\u8F93\u5165\u5173\u952E\u5B57\u641C\u7D22\" (input)=\"onSearchChange($event)\" />\n </mat-form-field>\n </div>\n <div class=\"max-h-[320px] overflow-scroll pb-3 bg-white\">\n @for (item of lists; track item; let index = $index) {\n <div (click)=\"setLocation(index)\" class=\"cursor-pointer\">\n <div class=\"p-3 flex items-center gap-2 hover:bg-[--rt-raised-background]\">\n <mat-icon fontIcon=\"location_on\"></mat-icon>\n <div class=\"text-sm font-thin\">{{ item.title }}</div>\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n</div>\n", styles: ["mat-form-field{width:100%;margin-bottom:-1.25em}\n"] }]
|
|
1378
1438
|
}] });
|
|
1379
1439
|
|
|
1380
1440
|
class FilterComponent {
|
|
1381
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1382
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
1441
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: FilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1442
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: FilterComponent, isStandalone: true, selector: "rolatech-filter", ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
1383
1443
|
}
|
|
1384
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1444
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: FilterComponent, decorators: [{
|
|
1385
1445
|
type: Component,
|
|
1386
1446
|
args: [{ selector: 'rolatech-filter', imports: [CommonModule], template: "<ng-content></ng-content>\n" }]
|
|
1387
1447
|
}] });
|
|
1388
1448
|
|
|
1389
1449
|
class ConfirmationComponent {
|
|
1390
|
-
message = model();
|
|
1391
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1392
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0
|
|
1450
|
+
message = model(...(ngDevMode ? [undefined, { debugName: "message" }] : []));
|
|
1451
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ConfirmationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1452
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.0", type: ConfirmationComponent, isStandalone: true, selector: "rolatech-confirmation", inputs: { message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { message: "messageChange" }, ngImport: i0, template: "<div>\n {{ message() }}\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
1393
1453
|
}
|
|
1394
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1454
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ConfirmationComponent, decorators: [{
|
|
1395
1455
|
type: Component,
|
|
1396
1456
|
args: [{ selector: 'rolatech-confirmation', imports: [CommonModule], template: "<div>\n {{ message() }}\n</div>\n" }]
|
|
1397
1457
|
}] });
|
|
@@ -1408,15 +1468,15 @@ class BaseComponent {
|
|
|
1408
1468
|
}
|
|
1409
1469
|
|
|
1410
1470
|
class TableComponent {
|
|
1411
|
-
dataSource = input.required();
|
|
1471
|
+
dataSource = input.required(...(ngDevMode ? [{ debugName: "dataSource" }] : []));
|
|
1412
1472
|
displayedColumns = [];
|
|
1413
1473
|
ngOnInit() {
|
|
1414
1474
|
this.displayedColumns = map$1(this.dataSource().columns, 'ref');
|
|
1415
1475
|
}
|
|
1416
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1417
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1476
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1477
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: TableComponent, isStandalone: true, selector: "rolatech-table", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<table mat-table [dataSource]=\"dataSource().data\">\n @for (column of dataSource().columns; track $index) {\n <ng-container [matColumnDef]=\"column.ref\" sticky>\n <th mat-header-cell *matHeaderCellDef>{{ column.name }}</th>\n <td mat-cell *matCellDef=\"let item\">{{ item[column.ref] }}</td>\n </ng-container>\n }\n <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n <tr mat-row *matRowDef=\"let row; columns: displayedColumns\"></tr>\n</table>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i1$4.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i1$4.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i1$4.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i1$4.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i1$4.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i1$4.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i1$4.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i1$4.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i1$4.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i1$4.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: RouterModule }] });
|
|
1418
1478
|
}
|
|
1419
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1479
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TableComponent, decorators: [{
|
|
1420
1480
|
type: Component,
|
|
1421
1481
|
args: [{ selector: 'rolatech-table', imports: [CommonModule, MatTableModule, RouterModule], template: "<table mat-table [dataSource]=\"dataSource().data\">\n @for (column of dataSource().columns; track $index) {\n <ng-container [matColumnDef]=\"column.ref\" sticky>\n <th mat-header-cell *matHeaderCellDef>{{ column.name }}</th>\n <td mat-cell *matCellDef=\"let item\">{{ item[column.ref] }}</td>\n </ng-container>\n }\n <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n <tr mat-row *matRowDef=\"let row; columns: displayedColumns\"></tr>\n</table>\n" }]
|
|
1422
1482
|
}] });
|
|
@@ -1424,19 +1484,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
1424
1484
|
class PaginatorComponent {
|
|
1425
1485
|
prevClick() { }
|
|
1426
1486
|
nextClick() { }
|
|
1427
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1428
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
1487
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1488
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: PaginatorComponent, isStandalone: true, selector: "rolatech-paginator", ngImport: i0, template: "<div class=\"flex h-14 items-center\">\n <button mat-icon-button (click)=\"prevClick()\">\n <mat-icon>chevron_left</mat-icon>\n </button>\n <div></div>\n <button mat-icon-button (click)=\"nextClick()\">\n <mat-icon>chevron_right</mat-icon>\n </button>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1429
1489
|
}
|
|
1430
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1490
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PaginatorComponent, decorators: [{
|
|
1431
1491
|
type: Component,
|
|
1432
1492
|
args: [{ selector: 'rolatech-paginator', imports: [CommonModule, MatButtonModule, MatIconModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"flex h-14 items-center\">\n <button mat-icon-button (click)=\"prevClick()\">\n <mat-icon>chevron_left</mat-icon>\n </button>\n <div></div>\n <button mat-icon-button (click)=\"nextClick()\">\n <mat-icon>chevron_right</mat-icon>\n </button>\n</div>\n" }]
|
|
1433
1493
|
}] });
|
|
1434
1494
|
|
|
1435
1495
|
class MediaPreviewComponent {
|
|
1436
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1437
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
1496
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MediaPreviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1497
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: MediaPreviewComponent, isStandalone: true, selector: "rolatech-media-preview", ngImport: i0, template: "<p>media-preview works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
1438
1498
|
}
|
|
1439
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1499
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: MediaPreviewComponent, decorators: [{
|
|
1440
1500
|
type: Component,
|
|
1441
1501
|
args: [{ selector: 'rolatech-media-preview', imports: [CommonModule], template: "<p>media-preview works!</p>\n" }]
|
|
1442
1502
|
}] });
|
|
@@ -1444,16 +1504,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
1444
1504
|
class ToolbarComponent {
|
|
1445
1505
|
hasId = 'rolatech-toolbar';
|
|
1446
1506
|
hasClass = true;
|
|
1447
|
-
title = input();
|
|
1448
|
-
subtitle = input();
|
|
1449
|
-
back = input(false, { transform: booleanAttribute });
|
|
1450
|
-
link = input('');
|
|
1451
|
-
large = input(false, { transform: booleanAttribute });
|
|
1452
|
-
divider = input(false, { transform: booleanAttribute });
|
|
1453
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1454
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1455
|
-
}
|
|
1456
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1507
|
+
title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : []));
|
|
1508
|
+
subtitle = input(...(ngDevMode ? [undefined, { debugName: "subtitle" }] : []));
|
|
1509
|
+
back = input(false, ...(ngDevMode ? [{ debugName: "back", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
1510
|
+
link = input('', ...(ngDevMode ? [{ debugName: "link" }] : []));
|
|
1511
|
+
large = input(false, ...(ngDevMode ? [{ debugName: "large", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
1512
|
+
divider = input(false, ...(ngDevMode ? [{ debugName: "divider", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
1513
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1514
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: ToolbarComponent, isStandalone: true, selector: "rolatech-toolbar", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, back: { classPropertyName: "back", publicName: "back", isSignal: true, isRequired: false, transformFunction: null }, link: { classPropertyName: "link", publicName: "link", isSignal: true, isRequired: false, transformFunction: null }, large: { classPropertyName: "large", publicName: "large", isSignal: true, isRequired: false, transformFunction: null }, divider: { classPropertyName: "divider", publicName: "divider", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "id": "this.hasId", "class.rolatech-toolbar": "this.hasClass" } }, ngImport: i0, template: "<div class=\"flex justify-between items-center\" [ngClass]=\"subtitle() ? 'h-16' : 'h-14'\">\n <ng-container>\n @if (back()) {\n <rolatech-icon-button rolatechBackButton class=\"left-button\">arrow_back</rolatech-icon-button>\n }\n @if (link()) {\n <rolatech-icon-button [routerLink]=\"link()\" class=\"left-button\">arrow_back</rolatech-icon-button>\n }\n </ng-container>\n @if (title()) {\n @if (large()) {\n <span class=\"text-2xl font-bold\" i18n>{{ title() }}</span>\n } @else {\n <span class=\"text-xl font-bold\" i18n>{{ title() }}</span>\n }\n }\n <div class=\"flex-1\"></div>\n <div class=\"flex justify-center items-center gap-3\">\n <ng-content></ng-content>\n </div>\n</div>\n@if (subtitle()) {\n <div class=\"-mt-4 mb-2 leading-none\" [ngClass]=\"back() || link() ? 'ml-[40px]' : ''\">\n <span class=\"text-sm text-[--rt-text-secondary]\" i18n>{{ subtitle() }}</span>\n </div>\n}\n@if (divider()) {\n <mat-divider></mat-divider>\n}\n", styles: ["rolatech-toolbar{display:block;padding-left:var(--rt-toolbar-padding-left, 16px);padding-right:var(--rt-toolbar-padding-right, 16px);background-color:var(--rt-base-background, #fff);border-radius:var(--rt-toolbar-border-radius, 0px);color:var(--rt-text-primary, #000)}rolatech-toolbar:has(.left-button){--rt-toolbar-padding-left: 8px;--rt-toolbar-padding-right: 8px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "directive", type: BackButtonDirective, selector: "[rolatechBackButton]" }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1515
|
+
}
|
|
1516
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ToolbarComponent, decorators: [{
|
|
1457
1517
|
type: Component,
|
|
1458
1518
|
args: [{ selector: 'rolatech-toolbar', imports: [CommonModule, RouterLink, IconButtonComponent, BackButtonDirective, MatDivider], encapsulation: ViewEncapsulation.None, template: "<div class=\"flex justify-between items-center\" [ngClass]=\"subtitle() ? 'h-16' : 'h-14'\">\n <ng-container>\n @if (back()) {\n <rolatech-icon-button rolatechBackButton class=\"left-button\">arrow_back</rolatech-icon-button>\n }\n @if (link()) {\n <rolatech-icon-button [routerLink]=\"link()\" class=\"left-button\">arrow_back</rolatech-icon-button>\n }\n </ng-container>\n @if (title()) {\n @if (large()) {\n <span class=\"text-2xl font-bold\" i18n>{{ title() }}</span>\n } @else {\n <span class=\"text-xl font-bold\" i18n>{{ title() }}</span>\n }\n }\n <div class=\"flex-1\"></div>\n <div class=\"flex justify-center items-center gap-3\">\n <ng-content></ng-content>\n </div>\n</div>\n@if (subtitle()) {\n <div class=\"-mt-4 mb-2 leading-none\" [ngClass]=\"back() || link() ? 'ml-[40px]' : ''\">\n <span class=\"text-sm text-[--rt-text-secondary]\" i18n>{{ subtitle() }}</span>\n </div>\n}\n@if (divider()) {\n <mat-divider></mat-divider>\n}\n", styles: ["rolatech-toolbar{display:block;padding-left:var(--rt-toolbar-padding-left, 16px);padding-right:var(--rt-toolbar-padding-right, 16px);background-color:var(--rt-base-background, #fff);border-radius:var(--rt-toolbar-border-radius, 0px);color:var(--rt-text-primary, #000)}rolatech-toolbar:has(.left-button){--rt-toolbar-padding-left: 8px;--rt-toolbar-padding-right: 8px}\n"] }]
|
|
1459
1519
|
}], propDecorators: { hasId: [{
|
|
@@ -1468,17 +1528,17 @@ class ThumbnailComponent {
|
|
|
1468
1528
|
hasClass = true;
|
|
1469
1529
|
myColor = '56.25%';
|
|
1470
1530
|
el = inject((ElementRef));
|
|
1471
|
-
src = input();
|
|
1472
|
-
size = input();
|
|
1473
|
-
mode = input('clip'); // full, clip
|
|
1474
|
-
ratio = input('rectangle'); // rectangle, square
|
|
1531
|
+
src = input(...(ngDevMode ? [undefined, { debugName: "src" }] : []));
|
|
1532
|
+
size = input(...(ngDevMode ? [undefined, { debugName: "size" }] : []));
|
|
1533
|
+
mode = input('clip', ...(ngDevMode ? [{ debugName: "mode" }] : [])); // full, clip
|
|
1534
|
+
ratio = input('rectangle', ...(ngDevMode ? [{ debugName: "ratio" }] : [])); // rectangle, square
|
|
1475
1535
|
img = viewChild.required('img');
|
|
1476
|
-
width = input();
|
|
1477
|
-
height = input();
|
|
1536
|
+
width = input(...(ngDevMode ? [undefined, { debugName: "width" }] : []));
|
|
1537
|
+
height = input(...(ngDevMode ? [undefined, { debugName: "height" }] : []));
|
|
1478
1538
|
renderer = inject(Renderer2);
|
|
1479
1539
|
sizea = effect(() => {
|
|
1480
1540
|
this.renderer.setAttribute(this.el.nativeElement, 'size', this.size());
|
|
1481
|
-
});
|
|
1541
|
+
}, ...(ngDevMode ? [{ debugName: "sizea" }] : []));
|
|
1482
1542
|
full = effect(() => {
|
|
1483
1543
|
this.renderer.setAttribute(this.el.nativeElement, 'mode', this.mode());
|
|
1484
1544
|
if (this.mode() === 'full') {
|
|
@@ -1494,14 +1554,14 @@ class ThumbnailComponent {
|
|
|
1494
1554
|
}
|
|
1495
1555
|
}
|
|
1496
1556
|
}
|
|
1497
|
-
});
|
|
1557
|
+
}, ...(ngDevMode ? [{ debugName: "full" }] : []));
|
|
1498
1558
|
ratioSet = effect(() => {
|
|
1499
1559
|
this.renderer.setAttribute(this.el.nativeElement, 'ratio', this.ratio());
|
|
1500
|
-
});
|
|
1501
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1502
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1560
|
+
}, ...(ngDevMode ? [{ debugName: "ratioSet" }] : []));
|
|
1561
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ThumbnailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1562
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: ThumbnailComponent, isStandalone: true, selector: "rolatech-thumbnail", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, ratio: { classPropertyName: "ratio", publicName: "ratio", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rt-rich-grid-media": "this.hasClass", "style.--rt-thumbnail-padding-top": "this.myColor" } }, viewQueries: [{ propertyName: "img", first: true, predicate: ["img"], descendants: true, isSignal: true }], ngImport: i0, template: "<div #edge class=\"absolute top-0 left-0\"></div>\n@defer (on viewport(edge)) {\n <a id=\"thumbnail\" class=\"rt-thumbnail\">\n <rolatech-image [src]=\"src()\"> </rolatech-image>\n </a>\n} @placeholder {\n <div class=\"bg-[--rt-raised-background] w-full h-full rounded-lg\"></div>\n}\n", styles: ["rolatech-thumbnail{display:block;width:100%;position:relative;--rt-thumbnail-padding-top: 56.25%}rolatech-thumbnail:before{display:block;content:\"\";width:100%;height:100%;background-color:var(--rt-10-percent-layer, rgba(0, 0, 0, .1))}rolatech-thumbnail[mode=full]:before{padding-top:0}rolatech-thumbnail[ratio=square]:before{--rt-thumbnail-padding-top: 100%}rolatech-thumbnail[mode=clip]:before{padding-top:var(--rt-thumbnail-padding-top)}rolatech-thumbnail #thumbnail.rt-thumbnail{height:100%;position:relative;margin-left:auto;margin-right:auto;overflow:hidden;display:block}rolatech-thumbnail #thumbnail.rt-thumbnail{position:absolute;inset:0}rolatech-thumbnail[mode=clip] #thumbnail.rt-thumbnail{position:absolute;inset:0}rolatech-thumbnail a.rt-thumbnail,rolatech-thumbnail:before{border-radius:0}rolatech-thumbnail[size][circular] a.rt-thumbnail,rolatech-thumbnail[size][circular]:before{border-radius:50%}rolatech-thumbnail[size=small] a.rt-thumbnail,rolatech-thumbnail[size=small]:before{border-radius:4px}rolatech-thumbnail[size=medium] a.rt-thumbnail,rolatech-thumbnail[size=medium]:before{border-radius:8px}rolatech-thumbnail[size=large] a.rt-thumbnail,rolatech-thumbnail[size=large]:before{border-radius:12px}rolatech-thumbnail[size][has-clip] a.rt-thumbnail,rolatech-thumbnail[size][has-clip]:before{border-radius:0}rolatech-thumbnail[mode=full] #thumbnail rolatech-image img{object-fit:contain;background-color:var(--rt-thumbnail-background-color)}rolatech-thumbnail #thumbnail rolatech-image img{background-color:var(--rt-thumbnail-background-color)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None, deferBlockDependencies: [() => [Promise.resolve().then(function () { return image_component; }).then(m => m.ImageComponent)]] });
|
|
1503
1563
|
}
|
|
1504
|
-
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "20.0
|
|
1564
|
+
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "20.2.0", ngImport: i0, type: ThumbnailComponent, resolveDeferredDeps: () => [Promise.resolve().then(function () { return image_component; }).then(m => m.ImageComponent)], resolveMetadata: ImageComponent => ({ decorators: [{
|
|
1505
1565
|
type: Component,
|
|
1506
1566
|
args: [{ selector: 'rolatech-thumbnail', imports: [CommonModule, ImageComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #edge class=\"absolute top-0 left-0\"></div>\n@defer (on viewport(edge)) {\n <a id=\"thumbnail\" class=\"rt-thumbnail\">\n <rolatech-image [src]=\"src()\"> </rolatech-image>\n </a>\n} @placeholder {\n <div class=\"bg-[--rt-raised-background] w-full h-full rounded-lg\"></div>\n}\n", styles: ["rolatech-thumbnail{display:block;width:100%;position:relative;--rt-thumbnail-padding-top: 56.25%}rolatech-thumbnail:before{display:block;content:\"\";width:100%;height:100%;background-color:var(--rt-10-percent-layer, rgba(0, 0, 0, .1))}rolatech-thumbnail[mode=full]:before{padding-top:0}rolatech-thumbnail[ratio=square]:before{--rt-thumbnail-padding-top: 100%}rolatech-thumbnail[mode=clip]:before{padding-top:var(--rt-thumbnail-padding-top)}rolatech-thumbnail #thumbnail.rt-thumbnail{height:100%;position:relative;margin-left:auto;margin-right:auto;overflow:hidden;display:block}rolatech-thumbnail #thumbnail.rt-thumbnail{position:absolute;inset:0}rolatech-thumbnail[mode=clip] #thumbnail.rt-thumbnail{position:absolute;inset:0}rolatech-thumbnail a.rt-thumbnail,rolatech-thumbnail:before{border-radius:0}rolatech-thumbnail[size][circular] a.rt-thumbnail,rolatech-thumbnail[size][circular]:before{border-radius:50%}rolatech-thumbnail[size=small] a.rt-thumbnail,rolatech-thumbnail[size=small]:before{border-radius:4px}rolatech-thumbnail[size=medium] a.rt-thumbnail,rolatech-thumbnail[size=medium]:before{border-radius:8px}rolatech-thumbnail[size=large] a.rt-thumbnail,rolatech-thumbnail[size=large]:before{border-radius:12px}rolatech-thumbnail[size][has-clip] a.rt-thumbnail,rolatech-thumbnail[size][has-clip]:before{border-radius:0}rolatech-thumbnail[mode=full] #thumbnail rolatech-image img{object-fit:contain;background-color:var(--rt-thumbnail-background-color)}rolatech-thumbnail #thumbnail rolatech-image img{background-color:var(--rt-thumbnail-background-color)}\n"] }]
|
|
1507
1567
|
}], ctorParameters: null, propDecorators: { hasClass: [{
|
|
@@ -1520,7 +1580,7 @@ var thumbnail_component = /*#__PURE__*/Object.freeze({
|
|
|
1520
1580
|
class ImageComponent {
|
|
1521
1581
|
hasId = 'rolatech-image';
|
|
1522
1582
|
hasClass = true;
|
|
1523
|
-
src = input();
|
|
1583
|
+
src = input(...(ngDevMode ? [undefined, { debugName: "src" }] : []));
|
|
1524
1584
|
img = viewChild.required('img');
|
|
1525
1585
|
ngOnInit() {
|
|
1526
1586
|
const image = this.img().nativeElement;
|
|
@@ -1528,10 +1588,10 @@ class ImageComponent {
|
|
|
1528
1588
|
image.style.visibility = 'visible';
|
|
1529
1589
|
};
|
|
1530
1590
|
}
|
|
1531
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1532
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.0
|
|
1591
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ImageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1592
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.2.0", type: ImageComponent, isStandalone: true, selector: "rolatech-image", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "id": "this.hasId", "class.rt-image": "this.hasClass" } }, viewQueries: [{ propertyName: "img", first: true, predicate: ["img"], descendants: true, isSignal: true }], ngImport: i0, template: "<img #img class=\"rolatech-image bg-[--rt-base-background]\" [src]=\"src()\" style=\"visibility: hidden\" loading=\"lazy\" alt />\n", styles: [".rolatech-image{display:inline-block;min-height:1px;min-width:1px;width:100%;height:100%;object-fit:cover}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1533
1593
|
}
|
|
1534
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1594
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ImageComponent, decorators: [{
|
|
1535
1595
|
type: Component,
|
|
1536
1596
|
args: [{ selector: 'rolatech-image', imports: [CommonModule], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<img #img class=\"rolatech-image bg-[--rt-base-background]\" [src]=\"src()\" style=\"visibility: hidden\" loading=\"lazy\" alt />\n", styles: [".rolatech-image{display:inline-block;min-height:1px;min-width:1px;width:100%;height:100%;object-fit:cover}\n"] }]
|
|
1537
1597
|
}], propDecorators: { hasId: [{
|
|
@@ -1550,12 +1610,12 @@ var image_component = /*#__PURE__*/Object.freeze({
|
|
|
1550
1610
|
class TabComponent {
|
|
1551
1611
|
hasId = 'tab';
|
|
1552
1612
|
hasClass = true;
|
|
1553
|
-
label = input.required();
|
|
1554
|
-
item = viewChild('content');
|
|
1555
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1556
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.0
|
|
1613
|
+
label = input.required(...(ngDevMode ? [{ debugName: "label" }] : []));
|
|
1614
|
+
item = viewChild('content', ...(ngDevMode ? [{ debugName: "item" }] : []));
|
|
1615
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1616
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.2.0", type: TabComponent, isStandalone: true, selector: "rolatech-tab", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "id": "this.hasId", "class.tab": "this.hasClass" } }, viewQueries: [{ propertyName: "item", first: true, predicate: ["content"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"content\" #content>\n <span i18n>{{ label() }}</span>\n</div>\n", styles: ["rolatech-tab{display:inline-flex;align-items:center;-ms-flex-pack:center;justify-content:center;flex:1 1 auto;position:relative;padding-left:var(--rt-tab-padding-left, 12px);padding-right:var(--rt-tab-padding-right, 12px);overflow:hidden;cursor:pointer;vertical-align:middle;font-family:Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased}rolatech-tab:hover{background-color:var(--rt-tab-hover-background-color, rgb(243, 244, 246))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
1557
1617
|
}
|
|
1558
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1618
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TabComponent, decorators: [{
|
|
1559
1619
|
type: Component,
|
|
1560
1620
|
args: [{ selector: 'rolatech-tab', imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"content\" #content>\n <span i18n>{{ label() }}</span>\n</div>\n", styles: ["rolatech-tab{display:inline-flex;align-items:center;-ms-flex-pack:center;justify-content:center;flex:1 1 auto;position:relative;padding-left:var(--rt-tab-padding-left, 12px);padding-right:var(--rt-tab-padding-right, 12px);overflow:hidden;cursor:pointer;vertical-align:middle;font-family:Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased}rolatech-tab:hover{background-color:var(--rt-tab-hover-background-color, rgb(243, 244, 246))}\n"] }]
|
|
1561
1621
|
}], propDecorators: { hasId: [{
|
|
@@ -1571,10 +1631,10 @@ class TabsComponent {
|
|
|
1571
1631
|
// this.init();
|
|
1572
1632
|
}
|
|
1573
1633
|
renderer = inject(Renderer2);
|
|
1574
|
-
tabs = contentChildren(TabComponent, { read: ElementRef });
|
|
1634
|
+
tabs = contentChildren(TabComponent, ...(ngDevMode ? [{ debugName: "tabs", read: ElementRef }] : [{ read: ElementRef }]));
|
|
1575
1635
|
selectionBar = viewChild.required('selectionBar', { read: ElementRef });
|
|
1576
|
-
select = model(0);
|
|
1577
|
-
loading = input(false);
|
|
1636
|
+
select = model(0, ...(ngDevMode ? [{ debugName: "select" }] : []));
|
|
1637
|
+
loading = input(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
|
|
1578
1638
|
preSelect = 0;
|
|
1579
1639
|
clientWidths = [];
|
|
1580
1640
|
_isServer = !inject(Platform).isBrowser;
|
|
@@ -1613,10 +1673,10 @@ class TabsComponent {
|
|
|
1613
1673
|
}
|
|
1614
1674
|
return offset;
|
|
1615
1675
|
}
|
|
1616
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1617
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1676
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1677
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: TabsComponent, isStandalone: true, selector: "rolatech-tabs", inputs: { select: { classPropertyName: "select", publicName: "select", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { select: "selectChange" }, host: { attributes: { "ngSkipHydration": "" }, classAttribute: "rolatech-tabs" }, queries: [{ propertyName: "tabs", predicate: TabComponent, read: ElementRef, isSignal: true }], viewQueries: [{ propertyName: "selectionBar", first: true, predicate: ["selectionBar"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "<!-- <rolatech-icon-button>chevron_left</rolatech-icon-button> -->\n<div id=\"tabsContainer\" class=\"h-full\">\n <div id=\"tabsContent\" class=\"flex flex-row h-full\" style-target=\"selection-bar\">\n <div #selectionBar id=\"selectionBar\" class=\"selection-bar\"></div>\n @for (tab of tabs(); track $index) {\n <ng-content></ng-content>\n }\n </div>\n</div>\n<!-- <rolatech-icon-button>chevron_right</rolatech-icon-button> -->\n", styles: ["rolatech-tabs{display:flex;flex-direction:row;align-items:center;font-weight:500;height:44px;padding-left:var(--rt-tabs-padding-left, 0px);padding-right:var(--rt-tabs-padding-right, 0px)}.selection-bar{position:absolute;height:0;bottom:0;left:0;right:0;border-bottom:2px solid var(--rt-tabs-selection-bar-color, var(--rt-brand-color));transform:scale(0);transform-origin:left center;transition:transform;z-index:100}rolatech-tab[style-target=host]{color:var(--rt-tab-color, var(--rt-brand-color))}.selection-bar[transition-target=selection-bar-transition]{transition:width .15s cubic-bezier(.4,0,1,1),left .15s cubic-bezier(.4,0,1,1)}.selection-bar[style-target=selection-bar]{border-width:0;background-color:var(--rt-tab-color, var(--rt-brand-color));border-radius:3px 3px 0 0;height:3px;margin-left:12px;right:auto;transform:none}#tabsContainer{position:relative}#tabsContent>:not(#selectionBar){height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
1618
1678
|
}
|
|
1619
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1679
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: TabsComponent, decorators: [{
|
|
1620
1680
|
type: Component,
|
|
1621
1681
|
args: [{ selector: 'rolatech-tabs', imports: [CommonModule], encapsulation: ViewEncapsulation.None, host: {
|
|
1622
1682
|
ngSkipHydration: '',
|
|
@@ -1627,10 +1687,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
1627
1687
|
class ListComponent {
|
|
1628
1688
|
id = 'rolatech-list';
|
|
1629
1689
|
hasClass = true;
|
|
1630
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1631
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
1690
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1691
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: ListComponent, isStandalone: true, selector: "rolatech-list", host: { properties: { "id": "this.id", "class.rolatech-list": "this.hasClass" } }, ngImport: i0, template: "<div class=\"flex flex-col divide-y divide-[--rt-10-percent-layer]\">\n <ng-content></ng-content>\n</div>\n", styles: ["rolatech-list{padding-left:var(--rt-list-padding-left, 0px);padding-right:var(--rt-list-padding-right, 0px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
1632
1692
|
}
|
|
1633
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1693
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ListComponent, decorators: [{
|
|
1634
1694
|
type: Component,
|
|
1635
1695
|
args: [{ selector: 'rolatech-list', imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"flex flex-col divide-y divide-[--rt-10-percent-layer]\">\n <ng-content></ng-content>\n</div>\n", styles: ["rolatech-list{padding-left:var(--rt-list-padding-left, 0px);padding-right:var(--rt-list-padding-right, 0px)}\n"] }]
|
|
1636
1696
|
}], propDecorators: { id: [{
|
|
@@ -1642,10 +1702,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
1642
1702
|
}] } });
|
|
1643
1703
|
|
|
1644
1704
|
class ContentComponent {
|
|
1645
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1646
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
1705
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1706
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: ContentComponent, isStandalone: true, selector: "rolatech-content", ngImport: i0, template: "<ng-content></ng-content>\n", styles: ["rolatech-content{padding-left:var(--rt-content-padding-left, 0px);padding-right:var(--rt-content-padding-right, 0px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
1647
1707
|
}
|
|
1648
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1708
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ContentComponent, decorators: [{
|
|
1649
1709
|
type: Component,
|
|
1650
1710
|
args: [{ selector: 'rolatech-content', imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n", styles: ["rolatech-content{padding-left:var(--rt-content-padding-left, 0px);padding-right:var(--rt-content-padding-right, 0px)}\n"] }]
|
|
1651
1711
|
}] });
|
|
@@ -1680,12 +1740,12 @@ class ChipBarComponent {
|
|
|
1680
1740
|
el = inject(ElementRef);
|
|
1681
1741
|
renderer = inject(Renderer2);
|
|
1682
1742
|
resizeObserver;
|
|
1683
|
-
chips = viewChild('chips', { read: ElementRef });
|
|
1743
|
+
chips = viewChild('chips', ...(ngDevMode ? [{ debugName: "chips", read: ElementRef }] : [{ read: ElementRef }]));
|
|
1684
1744
|
scroller = viewChild.required('scroller', { read: ElementRef });
|
|
1685
|
-
router = input('../courses/categories/');
|
|
1686
|
-
items = input([]);
|
|
1687
|
-
fluid = input(false, { transform: booleanAttribute });
|
|
1688
|
-
fixed = input(false, { transform: booleanAttribute });
|
|
1745
|
+
router = input('../courses/categories/', ...(ngDevMode ? [{ debugName: "router" }] : []));
|
|
1746
|
+
items = input([], ...(ngDevMode ? [{ debugName: "items" }] : []));
|
|
1747
|
+
fluid = input(false, ...(ngDevMode ? [{ debugName: "fluid", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
1748
|
+
fixed = input(false, ...(ngDevMode ? [{ debugName: "fixed", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
1689
1749
|
platformId = inject(PLATFORM_ID);
|
|
1690
1750
|
clientWidth = 0;
|
|
1691
1751
|
scrollWidth = 0;
|
|
@@ -1746,10 +1806,10 @@ class ChipBarComponent {
|
|
|
1746
1806
|
rightArrowClick() {
|
|
1747
1807
|
this.scroller().nativeElement.scrollLeft += 320;
|
|
1748
1808
|
}
|
|
1749
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1750
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1809
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ChipBarComponent, deps: [{ token: i2$2.MatIconRegistry }, { token: i2$5.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
|
|
1810
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: ChipBarComponent, isStandalone: true, selector: "rolatech-chip-bar", inputs: { router: { classPropertyName: "router", publicName: "router", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, fluid: { classPropertyName: "fluid", publicName: "fluid", isSignal: true, isRequired: false, transformFunction: null }, fixed: { classPropertyName: "fixed", publicName: "fixed", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "id": "this.hasId", "class.rolatech-chip-bar": "this.hasClass" } }, viewQueries: [{ propertyName: "chips", first: true, predicate: ["chips"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "scroller", first: true, predicate: ["scroller"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "<div id=\"chips-wrapper\" class=\"rolatech-chip-bar\">\n <div id=\"chips-content\" class=\"rolatech-chip-bar\">\n <div id=\"left-arrow\" class=\"rolatech-chip-bar\">\n <div id=\"left-arrow-button\" class=\"rolatech-chip-bar\">\n <button mat-icon-button (click)=\"leftArrowClick()\">\n <mat-icon>chevron_left</mat-icon>\n <!-- <mat-icon svgIcon=\"chevron_left\"></mat-icon> -->\n\n <!-- <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n width=\"24\"\n focusable=\"false\"\n style=\"pointer-events: none; display: inherit; width: 100%; height: 100%\"\n >\n <path d=\"M14.96 18.96 8 12l6.96-6.96.71.71L9.41 12l6.25 6.25-.7.71z\"></path>\n </svg> -->\n </button>\n </div>\n </div>\n <div\n id=\"scroll-container\"\n #scroller\n class=\"rolatech-chip-bar overflow-x-scroll overflow-y-hidden scrollbar-hide\"\n (scroll)=\"onScroll($event)\"\n >\n <div id=\"chips\" #chips class=\"rolatech-chip-bar inline-block\">\n @for (link of items(); track link; let index = $index) {\n <a\n id=\"chip-item\"\n class=\"rolatech-chip-bar h-8 cursor-pointer bg-[--rt-10-percent-layer] rounded-md inline-flex items-center px-3 m-3 ml-0\"\n routerLinkActive=\"chip-bar-active\"\n [routerLink]=\"[router(), link.link]\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n >\n <span class=\"px-3 text-md\">{{ link.name }}</span>\n </a>\n }\n </div>\n </div>\n <div id=\"right-arrow\" class=\"rolatech-chip-bar\">\n <div id=\"right-arrow-button\" class=\"rolatech-chip-bar\">\n <button mat-icon-button (click)=\"rightArrowClick()\">\n <mat-icon>chevron_right</mat-icon>\n <!-- <mat-icon svgIcon=\"chevron_right\"></mat-icon> -->\n\n <!-- <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n width=\"24\"\n focusable=\"false\"\n style=\"pointer-events: none; display: inherit; width: 100%; height: 100%\"\n >\n <path d=\"m9.4 18.4-.7-.7 5.6-5.6-5.7-5.7.7-.7 6.4 6.4-6.3 6.3z\"></path>\n </svg> -->\n </button>\n </div>\n </div>\n </div>\n</div>\n", styles: [".scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}rolatech-chip-bar{--rt-chips-bar-base-height: 56px;display:flex;width:100%;padding-left:var(--rt-chip-bar-padding, 0px);padding-right:var(--rt-chip-bar-padding, 0px);background-color:var(--rt-chip-bar-barckground-color, #fff);color:var(--rt-chip-bar-color, #000);height:var(--rt-chips-bar-base-height)}.chip-bar-active{border-radius:var(--rt-chip-bar-border-radius, 8px);color:var(--rt-chip-bar-active-color, orangered)}@media (max-width: 768px){.chip-bar-active{border-radius:var(--rt-chip-bar-border-radius, 8px);background-color:#000;color:#fff}}#scroll-container.rolatech-chip-bar{scroll-behavior:smooth;position:relative;white-space:nowrap}rolatech-chip-bar[fixed] #chips-wrapper.rolatech-chip-bar{position:fixed;top:var(--rt-rich-grid-chips-bar-top, 56px)}#chips-wrapper.rolatech-chip-bar{position:relative;width:var(--rt-rich-grid-chips-bar-width);background-color:var(--rt-base-background);z-index:2000;display:flex;justify-content:center}rolatech-chip-bar[fluid-width] #chips-content.rolatech-chip-bar{max-width:calc(var(--rt-rich-grid-content-max-width) + 2 * var(--rt-chip-bar-padding));padding-left:var(--rt-chip-bar-padding, 0px);padding-right:var(--rt-chip-bar-padding, 0px)}#chips-content.rolatech-chip-bar{box-sizing:border-box;width:100%;display:flex}#chips.rolatech-chip-bar{transition-duration:.15s;transition-timing-function:cubic-bezier(.05,0,0,1);will-change:transform;white-space:nowrap}#left-arrow.rolatech-chip-bar,#right-arrow.rolatech-chip-bar{position:absolute;height:100%;z-index:2020;display:flex;flex-direction:row;justify-content:center}#left-arrow.rolatech-chip-bar{top:0;left:0}#right-arrow.rolatech-chip-bar{top:0;right:0}#left-arrow-button.rolatech-chip-bar,#right-arrow-button.rolatech-chip-bar{background-color:var(--rt-base-background);display:flex;flex-direction:column;justify-content:center}#right-arrow.rolatech-chip-bar:before{height:100%;width:50px;content:\"\";pointer-events:none}rolatech-chip-bar[at-start] #left-arrow.rolatech-chip-bar{display:none}rolatech-chip-bar[at-end] #right-arrow.rolatech-chip-bar{display:none}#left-arrow.rolatech-chip-bar:after,#right-arrow.rolatech-chip-bar:before{height:100%;width:50px;content:\"\";pointer-events:none}#left-arrow.rolatech-chip-bar:after{background:linear-gradient(to right,var(--rt-base-background) 20%,rgba(255,255,255,0) 80%)}#right-arrow.rolatech-chip-bar:before{background:linear-gradient(to left,var(--rt-base-background) 20%,rgba(255,255,255,0) 80%)}#chip-item.rolatech-chip-bar{margin:12px 12px 12px 0}#chip-item.rolatech-chip-bar:last-of-type{margin-right:0}#chip-item:not([selected]):hover,#chip-item:not([selected]):focus{background-color:var(--rt-20-percent-layer)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i3$4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3$4.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1751
1811
|
}
|
|
1752
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1812
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ChipBarComponent, decorators: [{
|
|
1753
1813
|
type: Component,
|
|
1754
1814
|
args: [{ selector: 'rolatech-chip-bar', imports: [CommonModule, RouterModule, MatButtonModule, MatIconModule], encapsulation: ViewEncapsulation.None, template: "<div id=\"chips-wrapper\" class=\"rolatech-chip-bar\">\n <div id=\"chips-content\" class=\"rolatech-chip-bar\">\n <div id=\"left-arrow\" class=\"rolatech-chip-bar\">\n <div id=\"left-arrow-button\" class=\"rolatech-chip-bar\">\n <button mat-icon-button (click)=\"leftArrowClick()\">\n <mat-icon>chevron_left</mat-icon>\n <!-- <mat-icon svgIcon=\"chevron_left\"></mat-icon> -->\n\n <!-- <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n width=\"24\"\n focusable=\"false\"\n style=\"pointer-events: none; display: inherit; width: 100%; height: 100%\"\n >\n <path d=\"M14.96 18.96 8 12l6.96-6.96.71.71L9.41 12l6.25 6.25-.7.71z\"></path>\n </svg> -->\n </button>\n </div>\n </div>\n <div\n id=\"scroll-container\"\n #scroller\n class=\"rolatech-chip-bar overflow-x-scroll overflow-y-hidden scrollbar-hide\"\n (scroll)=\"onScroll($event)\"\n >\n <div id=\"chips\" #chips class=\"rolatech-chip-bar inline-block\">\n @for (link of items(); track link; let index = $index) {\n <a\n id=\"chip-item\"\n class=\"rolatech-chip-bar h-8 cursor-pointer bg-[--rt-10-percent-layer] rounded-md inline-flex items-center px-3 m-3 ml-0\"\n routerLinkActive=\"chip-bar-active\"\n [routerLink]=\"[router(), link.link]\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n >\n <span class=\"px-3 text-md\">{{ link.name }}</span>\n </a>\n }\n </div>\n </div>\n <div id=\"right-arrow\" class=\"rolatech-chip-bar\">\n <div id=\"right-arrow-button\" class=\"rolatech-chip-bar\">\n <button mat-icon-button (click)=\"rightArrowClick()\">\n <mat-icon>chevron_right</mat-icon>\n <!-- <mat-icon svgIcon=\"chevron_right\"></mat-icon> -->\n\n <!-- <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n width=\"24\"\n focusable=\"false\"\n style=\"pointer-events: none; display: inherit; width: 100%; height: 100%\"\n >\n <path d=\"m9.4 18.4-.7-.7 5.6-5.6-5.7-5.7.7-.7 6.4 6.4-6.3 6.3z\"></path>\n </svg> -->\n </button>\n </div>\n </div>\n </div>\n</div>\n", styles: [".scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}rolatech-chip-bar{--rt-chips-bar-base-height: 56px;display:flex;width:100%;padding-left:var(--rt-chip-bar-padding, 0px);padding-right:var(--rt-chip-bar-padding, 0px);background-color:var(--rt-chip-bar-barckground-color, #fff);color:var(--rt-chip-bar-color, #000);height:var(--rt-chips-bar-base-height)}.chip-bar-active{border-radius:var(--rt-chip-bar-border-radius, 8px);color:var(--rt-chip-bar-active-color, orangered)}@media (max-width: 768px){.chip-bar-active{border-radius:var(--rt-chip-bar-border-radius, 8px);background-color:#000;color:#fff}}#scroll-container.rolatech-chip-bar{scroll-behavior:smooth;position:relative;white-space:nowrap}rolatech-chip-bar[fixed] #chips-wrapper.rolatech-chip-bar{position:fixed;top:var(--rt-rich-grid-chips-bar-top, 56px)}#chips-wrapper.rolatech-chip-bar{position:relative;width:var(--rt-rich-grid-chips-bar-width);background-color:var(--rt-base-background);z-index:2000;display:flex;justify-content:center}rolatech-chip-bar[fluid-width] #chips-content.rolatech-chip-bar{max-width:calc(var(--rt-rich-grid-content-max-width) + 2 * var(--rt-chip-bar-padding));padding-left:var(--rt-chip-bar-padding, 0px);padding-right:var(--rt-chip-bar-padding, 0px)}#chips-content.rolatech-chip-bar{box-sizing:border-box;width:100%;display:flex}#chips.rolatech-chip-bar{transition-duration:.15s;transition-timing-function:cubic-bezier(.05,0,0,1);will-change:transform;white-space:nowrap}#left-arrow.rolatech-chip-bar,#right-arrow.rolatech-chip-bar{position:absolute;height:100%;z-index:2020;display:flex;flex-direction:row;justify-content:center}#left-arrow.rolatech-chip-bar{top:0;left:0}#right-arrow.rolatech-chip-bar{top:0;right:0}#left-arrow-button.rolatech-chip-bar,#right-arrow-button.rolatech-chip-bar{background-color:var(--rt-base-background);display:flex;flex-direction:column;justify-content:center}#right-arrow.rolatech-chip-bar:before{height:100%;width:50px;content:\"\";pointer-events:none}rolatech-chip-bar[at-start] #left-arrow.rolatech-chip-bar{display:none}rolatech-chip-bar[at-end] #right-arrow.rolatech-chip-bar{display:none}#left-arrow.rolatech-chip-bar:after,#right-arrow.rolatech-chip-bar:before{height:100%;width:50px;content:\"\";pointer-events:none}#left-arrow.rolatech-chip-bar:after{background:linear-gradient(to right,var(--rt-base-background) 20%,rgba(255,255,255,0) 80%)}#right-arrow.rolatech-chip-bar:before{background:linear-gradient(to left,var(--rt-base-background) 20%,rgba(255,255,255,0) 80%)}#chip-item.rolatech-chip-bar{margin:12px 12px 12px 0}#chip-item.rolatech-chip-bar:last-of-type{margin-right:0}#chip-item:not([selected]):hover,#chip-item:not([selected]):focus{background-color:var(--rt-20-percent-layer)}\n"] }]
|
|
1755
1815
|
}], ctorParameters: () => [{ type: i2$2.MatIconRegistry }, { type: i2$5.DomSanitizer }], propDecorators: { hasId: [{
|
|
@@ -1762,17 +1822,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
1762
1822
|
|
|
1763
1823
|
class AvatarComponent {
|
|
1764
1824
|
hasClass = true;
|
|
1765
|
-
src = input();
|
|
1766
|
-
size = input.required();
|
|
1825
|
+
src = input(...(ngDevMode ? [undefined, { debugName: "src" }] : []));
|
|
1826
|
+
size = input.required(...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
1767
1827
|
el = inject(ElementRef);
|
|
1768
1828
|
renderer = inject(Renderer2);
|
|
1769
1829
|
sizea = effect(() => {
|
|
1770
1830
|
this.renderer.setAttribute(this.el.nativeElement, 'size', this.size());
|
|
1771
|
-
});
|
|
1772
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1773
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1831
|
+
}, ...(ngDevMode ? [{ debugName: "sizea" }] : []));
|
|
1832
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: AvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1833
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: AvatarComponent, isStandalone: true, selector: "rolatech-avatar", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "class.rt-rich-grid-media": "this.hasClass" } }, ngImport: i0, template: "@defer (on viewport()) {\n <a id=\"avatar\" class=\"rt-avatar\">\n <rolatech-image [src]=\"src()\"> </rolatech-image>\n </a>\n} @placeholder {\n <div class=\"bg-[--rt-10-percent-layer] w-full h-full rounded-lg\"></div>\n}\n", styles: ["rolatech-avatar{display:block;width:100%;position:relative}rolatech-avatar:before{display:block;content:\"\";width:100%;padding-top:100%;background-color:var(--rt-10-percent-layer, #f1f1f1)}rolatech-avatar #avatar.rt-avatar{height:100%;position:relative;margin-left:auto;margin-right:auto;overflow:hidden;display:block}rolatech-avatar #avatar.rt-avatar{position:absolute;inset:0}rolatech-avatar a.rt-avatar,rolatech-avatar:before{border-radius:0}rolatech-avatar[size=small] a.rt-avatar,rolatech-avatar[size=small]:before{border-radius:4px}rolatech-avatar[size=medium] a.rt-avatar,rolatech-avatar[size=medium]:before{border-radius:8px}rolatech-avatar[size=large] a.rt-avatar,rolatech-avatar[size=large]:before{border-radius:12px}rolatech-avatar[size=full] a.rt-avatar,rolatech-avatar[size=full]:before{border-radius:50%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None, deferBlockDependencies: [() => [Promise.resolve().then(function () { return image_component; }).then(m => m.ImageComponent)]] });
|
|
1774
1834
|
}
|
|
1775
|
-
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "20.0
|
|
1835
|
+
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "20.2.0", ngImport: i0, type: AvatarComponent, resolveDeferredDeps: () => [Promise.resolve().then(function () { return image_component; }).then(m => m.ImageComponent)], resolveMetadata: ImageComponent => ({ decorators: [{
|
|
1776
1836
|
type: Component,
|
|
1777
1837
|
args: [{ selector: 'rolatech-avatar', imports: [CommonModule, ImageComponent], encapsulation: ViewEncapsulation.None, template: "@defer (on viewport()) {\n <a id=\"avatar\" class=\"rt-avatar\">\n <rolatech-image [src]=\"src()\"> </rolatech-image>\n </a>\n} @placeholder {\n <div class=\"bg-[--rt-10-percent-layer] w-full h-full rounded-lg\"></div>\n}\n", styles: ["rolatech-avatar{display:block;width:100%;position:relative}rolatech-avatar:before{display:block;content:\"\";width:100%;padding-top:100%;background-color:var(--rt-10-percent-layer, #f1f1f1)}rolatech-avatar #avatar.rt-avatar{height:100%;position:relative;margin-left:auto;margin-right:auto;overflow:hidden;display:block}rolatech-avatar #avatar.rt-avatar{position:absolute;inset:0}rolatech-avatar a.rt-avatar,rolatech-avatar:before{border-radius:0}rolatech-avatar[size=small] a.rt-avatar,rolatech-avatar[size=small]:before{border-radius:4px}rolatech-avatar[size=medium] a.rt-avatar,rolatech-avatar[size=medium]:before{border-radius:8px}rolatech-avatar[size=large] a.rt-avatar,rolatech-avatar[size=large]:before{border-radius:12px}rolatech-avatar[size=full] a.rt-avatar,rolatech-avatar[size=full]:before{border-radius:50%}\n"] }]
|
|
1778
1838
|
}], ctorParameters: null, propDecorators: { hasClass: [{
|
|
@@ -1782,10 +1842,10 @@ i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "20.0.3", ng
|
|
|
1782
1842
|
|
|
1783
1843
|
class ImagePlaceholderComponent {
|
|
1784
1844
|
ngOnInit() { }
|
|
1785
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1786
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
1845
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ImagePlaceholderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1846
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: ImagePlaceholderComponent, isStandalone: true, selector: "rolatech-image-placeholder", ngImport: i0, template: "<div class=\"w-full h-full flex justify-center items-center\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-560H200v560Zm40-80h480L570-480 450-320l-90-120-120 160Zm-40 80v-560 560Z\"\n />\n </svg>\n</div>\n", styles: ["rolatech-image-placeholder{display:block;aspect-ratio:16/9;background-color:var(--rt-10-percent-layer);border-radius:var(--rt-rounded-base, 8px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
1787
1847
|
}
|
|
1788
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1848
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ImagePlaceholderComponent, decorators: [{
|
|
1789
1849
|
type: Component,
|
|
1790
1850
|
args: [{ selector: 'rolatech-image-placeholder', imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"w-full h-full flex justify-center items-center\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-560H200v560Zm40-80h480L570-480 450-320l-90-120-120 160Zm-40 80v-560 560Z\"\n />\n </svg>\n</div>\n", styles: ["rolatech-image-placeholder{display:block;aspect-ratio:16/9;background-color:var(--rt-10-percent-layer);border-radius:var(--rt-rounded-base, 8px)}\n"] }]
|
|
1791
1851
|
}] });
|
|
@@ -1820,51 +1880,51 @@ class ImagePreviewDialogComponent {
|
|
|
1820
1880
|
this.prevDisabled = this.selected === 0;
|
|
1821
1881
|
this.nextDisabled = this.selected === this.data.media.length - 1;
|
|
1822
1882
|
}
|
|
1823
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1824
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1883
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ImagePreviewDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1$2.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
1884
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: ImagePreviewDialogComponent, isStandalone: true, selector: "rolatech-image-preview-dialog", ngImport: i0, template: "<div class=\"flex flex-col h-full overflow-hidden\">\n <div class=\"h-16 flex justify-between items-center p-5\">\n @if (data.title) {\n <div class=\"text-lg font-bold\">{{ 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 justify-center items-center overflow-hidden\">\n <div class=\"p-3 flex items-center justify-center h-full\">\n <img class=\"object-contain p-3 h-full\" [src]=\"data.media[selected].url\" alt />\n </div>\n </div>\n <div class=\"flex-1\"></div>\n <mat-divider></mat-divider>\n <div class=\"h-16 flex justify-between items-center p-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$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1825
1885
|
}
|
|
1826
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1886
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ImagePreviewDialogComponent, decorators: [{
|
|
1827
1887
|
type: Component,
|
|
1828
1888
|
args: [{ selector: 'rolatech-image-preview-dialog', imports: [MatIconModule, MatDividerModule, MatButtonModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"flex flex-col h-full overflow-hidden\">\n <div class=\"h-16 flex justify-between items-center p-5\">\n @if (data.title) {\n <div class=\"text-lg font-bold\">{{ 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 justify-center items-center overflow-hidden\">\n <div class=\"p-3 flex items-center justify-center h-full\">\n <img class=\"object-contain p-3 h-full\" [src]=\"data.media[selected].url\" alt />\n </div>\n </div>\n <div class=\"flex-1\"></div>\n <mat-divider></mat-divider>\n <div class=\"h-16 flex justify-between items-center p-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" }]
|
|
1829
1889
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
1830
1890
|
type: Inject,
|
|
1831
1891
|
args: [MAT_DIALOG_DATA]
|
|
1832
|
-
}] }, { type: i1$
|
|
1892
|
+
}] }, { type: i1$2.MatDialogRef }] });
|
|
1833
1893
|
|
|
1834
1894
|
class EmptyComponent {
|
|
1835
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1836
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
1895
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: EmptyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1896
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: EmptyComponent, isStandalone: true, selector: "rolatech-empty", ngImport: i0, template: "<div class=\"px-4 py-2 flex items-center\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"M460-300h40v-220h-40v220Zm20-276.92q10.46 0 17.54-7.08 7.08-7.08 7.08-17.54 0-10.46-7.08-17.54-7.08-7.07-17.54-7.07-10.46 0-17.54 7.07-7.08 7.08-7.08 17.54 0 10.46 7.08 17.54 7.08 7.08 17.54 7.08Zm.13 456.92q-74.67 0-140.41-28.34-65.73-28.34-114.36-76.92-48.63-48.58-76.99-114.26Q120-405.19 120-479.87q0-74.67 28.34-140.41 28.34-65.73 76.92-114.36 48.58-48.63 114.26-76.99Q405.19-840 479.87-840q74.67 0 140.41 28.34 65.73 28.34 114.36 76.92 48.63 48.58 76.99 114.26Q840-554.81 840-480.13q0 74.67-28.34 140.41-28.34 65.73-76.92 114.36-48.58 48.63-114.26 76.99Q554.81-120 480.13-120Zm-.13-40q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z\"\n />\n </svg>\n <span class=\"ml-2\">No Data</span>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
1837
1897
|
}
|
|
1838
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1898
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: EmptyComponent, decorators: [{
|
|
1839
1899
|
type: Component,
|
|
1840
1900
|
args: [{ selector: 'rolatech-empty', imports: [CommonModule], template: "<div class=\"px-4 py-2 flex items-center\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"M460-300h40v-220h-40v220Zm20-276.92q10.46 0 17.54-7.08 7.08-7.08 7.08-17.54 0-10.46-7.08-17.54-7.08-7.07-17.54-7.07-10.46 0-17.54 7.07-7.08 7.08-7.08 17.54 0 10.46 7.08 17.54 7.08 7.08 17.54 7.08Zm.13 456.92q-74.67 0-140.41-28.34-65.73-28.34-114.36-76.92-48.63-48.58-76.99-114.26Q120-405.19 120-479.87q0-74.67 28.34-140.41 28.34-65.73 76.92-114.36 48.58-48.63 114.26-76.99Q405.19-840 479.87-840q74.67 0 140.41 28.34 65.73 28.34 114.36 76.92 48.63 48.58 76.99 114.26Q840-554.81 840-480.13q0 74.67-28.34 140.41-28.34 65.73-76.92 114.36-48.58 48.63-114.26 76.99Q554.81-120 480.13-120Zm-.13-40q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z\"\n />\n </svg>\n <span class=\"ml-2\">No Data</span>\n</div>\n" }]
|
|
1841
1901
|
}] });
|
|
1842
1902
|
|
|
1843
1903
|
class InputComponent {
|
|
1844
|
-
title = model();
|
|
1845
|
-
placeholder = input('Title');
|
|
1846
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1847
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0
|
|
1904
|
+
title = model(...(ngDevMode ? [undefined, { debugName: "title" }] : []));
|
|
1905
|
+
placeholder = input('Title', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
|
|
1906
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1907
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.0", type: InputComponent, isStandalone: true, selector: "rolatech-input", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { title: "titleChange" }, ngImport: i0, template: "<div class=\"rt-input-wrapper\">\n <input class=\"rt__input\" [placeholder]=\"placeholder()\" [(ngModel)]=\"title\" />\n</div>\n", styles: ["rolatech-input{width:100%;padding:8px}.rt-input-wrapper{width:100%;z-index:0;padding:12px;background-color:var(--rt-additive-background, #fff);border-radius:var(--rt-input-rounded, 8px);border:1px solid var(--rt-brand-color)}.rt__input{box-shadow:none;background:none;border-radius:0;width:100%;min-width:0;border:none;display:block}.rt__input:focus-visible{outline:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1848
1908
|
}
|
|
1849
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1909
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: InputComponent, decorators: [{
|
|
1850
1910
|
type: Component,
|
|
1851
1911
|
args: [{ selector: 'rolatech-input', imports: [CommonModule, FormsModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"rt-input-wrapper\">\n <input class=\"rt__input\" [placeholder]=\"placeholder()\" [(ngModel)]=\"title\" />\n</div>\n", styles: ["rolatech-input{width:100%;padding:8px}.rt-input-wrapper{width:100%;z-index:0;padding:12px;background-color:var(--rt-additive-background, #fff);border-radius:var(--rt-input-rounded, 8px);border:1px solid var(--rt-brand-color)}.rt__input{box-shadow:none;background:none;border-radius:0;width:100%;min-width:0;border:none;display:block}.rt__input:focus-visible{outline:none}\n"] }]
|
|
1852
1912
|
}] });
|
|
1853
1913
|
|
|
1854
1914
|
class RichItemComponent {
|
|
1855
1915
|
hasClass = true;
|
|
1856
|
-
list = input(false, { transform: booleanAttribute });
|
|
1857
|
-
thumbnail = input();
|
|
1858
|
-
avatar = input();
|
|
1859
|
-
title = input();
|
|
1860
|
-
subtitle = input();
|
|
1861
|
-
price = input(0);
|
|
1862
|
-
thumbnailRatio = input('rectangle');
|
|
1863
|
-
currencySymbol = input('¥');
|
|
1864
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1865
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0
|
|
1866
|
-
}
|
|
1867
|
-
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "20.0
|
|
1916
|
+
list = input(false, ...(ngDevMode ? [{ debugName: "list", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
1917
|
+
thumbnail = input(...(ngDevMode ? [undefined, { debugName: "thumbnail" }] : []));
|
|
1918
|
+
avatar = input(...(ngDevMode ? [undefined, { debugName: "avatar" }] : []));
|
|
1919
|
+
title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : []));
|
|
1920
|
+
subtitle = input(...(ngDevMode ? [undefined, { debugName: "subtitle" }] : []));
|
|
1921
|
+
price = input(0, ...(ngDevMode ? [{ debugName: "price" }] : []));
|
|
1922
|
+
thumbnailRatio = input('rectangle', ...(ngDevMode ? [{ debugName: "thumbnailRatio" }] : []));
|
|
1923
|
+
currencySymbol = input('¥', ...(ngDevMode ? [{ debugName: "currencySymbol" }] : []));
|
|
1924
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: RichItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1925
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: RichItemComponent, isStandalone: true, selector: "rolatech-rich-item", inputs: { list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null }, thumbnail: { classPropertyName: "thumbnail", publicName: "thumbnail", isSignal: true, isRequired: false, transformFunction: null }, avatar: { classPropertyName: "avatar", publicName: "avatar", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, price: { classPropertyName: "price", publicName: "price", isSignal: true, isRequired: false, transformFunction: null }, thumbnailRatio: { classPropertyName: "thumbnailRatio", publicName: "thumbnailRatio", isSignal: true, isRequired: false, transformFunction: null }, currencySymbol: { classPropertyName: "currencySymbol", publicName: "currencySymbol", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-rich-item": "this.hasClass" } }, ngImport: i0, template: "<div id=\"thumbnail\" class=\"rolatech-rich-item\">\n @defer (on viewport()) {\n <rolatech-thumbnail [src]=\"thumbnail()\" size=\"medium\" [ratio]=\"thumbnailRatio()\" mode=\"full\"></rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-10-percent-layer] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n</div>\n<div id=\"details\" class=\"rolatech-rich-item\">\n <div>\n <div class=\"py-1\">\n <a class=\"md:text-xl font-bold break-words line-clamp-1 md:line-clamp-2 whitespace-normal\">\n {{ title() }}\n </a>\n </div>\n <div class=\"invisible h-0 md:h-auto md:visible break-words line-clamp-1 whitespace-normal\">\n {{ subtitle() }}\n </div>\n <ng-content></ng-content>\n </div>\n @if (price()) {\n <div class=\"md:text-lg font-bold py-1\">{{ currencySymbol() }}{{ price() }}</div>\n }\n</div>\n", styles: ["rolatech-rich-item{--rt-rich-view-item-margin: 16px;display:flex;position:relative;cursor:pointer;flex-direction:column;margin-left:calc(var(--rt-rich-view-item-margin) / 2);margin-right:calc(var(--rt-rich-view-item-margin) / 2);width:calc(100% / var(--rt-rich-view-items-per-row) - var(--rt-rich-view-item-margin) - .01px)}#details.rolatech-rich-item{display:flex;flex-direction:column;justify-content:space-between}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None, deferBlockDependencies: [() => [Promise.resolve().then(function () { return thumbnail_component; }).then(m => m.ThumbnailComponent)]] });
|
|
1926
|
+
}
|
|
1927
|
+
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "20.2.0", ngImport: i0, type: RichItemComponent, resolveDeferredDeps: () => [Promise.resolve().then(function () { return thumbnail_component; }).then(m => m.ThumbnailComponent)], resolveMetadata: ThumbnailComponent => ({ decorators: [{
|
|
1868
1928
|
type: Component,
|
|
1869
1929
|
args: [{ selector: 'rolatech-rich-item', imports: [CommonModule, ThumbnailComponent], encapsulation: ViewEncapsulation.None, template: "<div id=\"thumbnail\" class=\"rolatech-rich-item\">\n @defer (on viewport()) {\n <rolatech-thumbnail [src]=\"thumbnail()\" size=\"medium\" [ratio]=\"thumbnailRatio()\" mode=\"full\"></rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-10-percent-layer] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n</div>\n<div id=\"details\" class=\"rolatech-rich-item\">\n <div>\n <div class=\"py-1\">\n <a class=\"md:text-xl font-bold break-words line-clamp-1 md:line-clamp-2 whitespace-normal\">\n {{ title() }}\n </a>\n </div>\n <div class=\"invisible h-0 md:h-auto md:visible break-words line-clamp-1 whitespace-normal\">\n {{ subtitle() }}\n </div>\n <ng-content></ng-content>\n </div>\n @if (price()) {\n <div class=\"md:text-lg font-bold py-1\">{{ currencySymbol() }}{{ price() }}</div>\n }\n</div>\n", styles: ["rolatech-rich-item{--rt-rich-view-item-margin: 16px;display:flex;position:relative;cursor:pointer;flex-direction:column;margin-left:calc(var(--rt-rich-view-item-margin) / 2);margin-right:calc(var(--rt-rich-view-item-margin) / 2);width:calc(100% / var(--rt-rich-view-items-per-row) - var(--rt-rich-view-item-margin) - .01px)}#details.rolatech-rich-item{display:flex;flex-direction:column;justify-content:space-between}\n"] }]
|
|
1870
1930
|
}], ctorParameters: null, propDecorators: { hasClass: [{
|
|
@@ -1877,9 +1937,9 @@ class RichViewComponent {
|
|
|
1877
1937
|
disableScrollbar = true;
|
|
1878
1938
|
platformId = inject(PLATFORM_ID);
|
|
1879
1939
|
el = inject(ElementRef);
|
|
1880
|
-
items = contentChildren(RichItemComponent, { read: ElementRef });
|
|
1881
|
-
list = input(false, { transform: booleanAttribute });
|
|
1882
|
-
wrap = input(false, { transform: booleanAttribute });
|
|
1940
|
+
items = contentChildren(RichItemComponent, ...(ngDevMode ? [{ debugName: "items", read: ElementRef }] : [{ read: ElementRef }]));
|
|
1941
|
+
list = input(false, ...(ngDevMode ? [{ debugName: "list", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
1942
|
+
wrap = input(false, ...(ngDevMode ? [{ debugName: "wrap", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
1883
1943
|
resizeObserver;
|
|
1884
1944
|
constructor() {
|
|
1885
1945
|
effect(() => {
|
|
@@ -1925,10 +1985,10 @@ class RichViewComponent {
|
|
|
1925
1985
|
this.el.nativeElement.style.setProperty('--rt-rich-view-items-per-row', 5);
|
|
1926
1986
|
}
|
|
1927
1987
|
}
|
|
1928
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1929
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.0
|
|
1988
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: RichViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1989
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.2.0", type: RichViewComponent, isStandalone: true, selector: "rolatech-rich-view", inputs: { list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null }, wrap: { classPropertyName: "wrap", publicName: "wrap", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-rich-view": "this.hasClass", "class.scrollbar-hide": "this.disableScrollbar" } }, queries: [{ propertyName: "items", predicate: RichItemComponent, read: ElementRef, isSignal: true }], ngImport: i0, template: "<ng-content></ng-content>\n\n<!-- <div class=\"rich-view-content\">\n <ng-content></ng-content>\n</div> -->\n<!-- <div class=\"rich-view-button\">\n <button mat-stroked-button>\u52A0\u8F7D\u66F4\u591A</button>\n</div> -->\n", styles: ["rolatech-rich-view{--rt-rich-view-items-per-row: 1;--rt-rich-view-item-max-width: 500px;position:relative;display:flex;padding-bottom:16px;margin-bottom:56px}rolatech-rich-view[list]{flex-direction:column;flex-wrap:nowrap}rolatech-rich-view[wrap]{flex-wrap:wrap;--rt-rich-view-items-per-row: 2}rolatech-rich-view:not([wrap]){overflow-x:scroll}rolatech-rich-view:not([wrap]) rolatech-rich-item{--rt-rich-view-item-min-width: 40%;min-width:var(--rt-rich-view-item-min-width)}@media (min-width: 768px){rolatech-rich-view:not([wrap]) rolatech-rich-item{--rt-rich-view-item-min-width: 28%}}rolatech-rich-view[list] rolatech-rich-item{flex-direction:row;padding:12px 0;cursor:pointer}rolatech-rich-view[list] rolatech-rich-item #thumbnail.rolatech-rich-item{width:33%;min-width:33%}rolatech-rich-view[list] rolatech-rich-item #details.rolatech-rich-item{margin-left:12px}rolatech-rich-view[list] rolatech-rich-item:hover{background-color:var(--rt-10-percent-layer)}rolatech-rich-view:not([list]) rolatech-rich-item{margin-bottom:32px}@media (min-width: 600px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 2}}@media (min-width: 768px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 3}}@media (min-width: 1280px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 3}}@media (min-width: 1536px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 4}}@media (min-width: 1920px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 5}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}.rich-view-button{position:absolute;bottom:-44px;left:50%;transform:translate(-50%,-50%);background-color:var(--yt-spec-base-background);z-index:1;width:360px;max-width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
1930
1990
|
}
|
|
1931
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
1991
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: RichViewComponent, decorators: [{
|
|
1932
1992
|
type: Component,
|
|
1933
1993
|
args: [{ selector: 'rolatech-rich-view', imports: [CommonModule, MatButtonModule], encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n\n<!-- <div class=\"rich-view-content\">\n <ng-content></ng-content>\n</div> -->\n<!-- <div class=\"rich-view-button\">\n <button mat-stroked-button>\u52A0\u8F7D\u66F4\u591A</button>\n</div> -->\n", styles: ["rolatech-rich-view{--rt-rich-view-items-per-row: 1;--rt-rich-view-item-max-width: 500px;position:relative;display:flex;padding-bottom:16px;margin-bottom:56px}rolatech-rich-view[list]{flex-direction:column;flex-wrap:nowrap}rolatech-rich-view[wrap]{flex-wrap:wrap;--rt-rich-view-items-per-row: 2}rolatech-rich-view:not([wrap]){overflow-x:scroll}rolatech-rich-view:not([wrap]) rolatech-rich-item{--rt-rich-view-item-min-width: 40%;min-width:var(--rt-rich-view-item-min-width)}@media (min-width: 768px){rolatech-rich-view:not([wrap]) rolatech-rich-item{--rt-rich-view-item-min-width: 28%}}rolatech-rich-view[list] rolatech-rich-item{flex-direction:row;padding:12px 0;cursor:pointer}rolatech-rich-view[list] rolatech-rich-item #thumbnail.rolatech-rich-item{width:33%;min-width:33%}rolatech-rich-view[list] rolatech-rich-item #details.rolatech-rich-item{margin-left:12px}rolatech-rich-view[list] rolatech-rich-item:hover{background-color:var(--rt-10-percent-layer)}rolatech-rich-view:not([list]) rolatech-rich-item{margin-bottom:32px}@media (min-width: 600px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 2}}@media (min-width: 768px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 3}}@media (min-width: 1280px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 3}}@media (min-width: 1536px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 4}}@media (min-width: 1920px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 5}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}.rich-view-button{position:absolute;bottom:-44px;left:50%;transform:translate(-50%,-50%);background-color:var(--yt-spec-base-background);z-index:1;width:360px;max-width:100%}\n"] }]
|
|
1934
1994
|
}], ctorParameters: () => [], propDecorators: { hasClass: [{
|
|
@@ -1989,20 +2049,20 @@ class EditorComponent {
|
|
|
1989
2049
|
});
|
|
1990
2050
|
}
|
|
1991
2051
|
}
|
|
1992
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
1993
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
2052
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: EditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2053
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: EditorComponent, isStandalone: true, selector: "rolatech-editor", ngImport: i0, template: "<div id=\"editor\"></div>\n", styles: ["@import\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.snow.css\";.ql-snow{position:relative}.ql-snow .ql-toolbar{position:sticky;top:5em}.ql-snow button{width:inherit!important;height:24px!important}.ql-snow .ql-editor{border:4px solid #efefef}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
1994
2054
|
}
|
|
1995
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
2055
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: EditorComponent, decorators: [{
|
|
1996
2056
|
type: Component,
|
|
1997
2057
|
args: [{ selector: 'rolatech-editor', imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<div id=\"editor\"></div>\n", styles: ["@import\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.snow.css\";.ql-snow{position:relative}.ql-snow .ql-toolbar{position:sticky;top:5em}.ql-snow button{width:inherit!important;height:24px!important}.ql-snow .ql-editor{border:4px solid #efefef}\n"] }]
|
|
1998
2058
|
}], ctorParameters: () => [] });
|
|
1999
2059
|
|
|
2000
2060
|
class AccordionComponent {
|
|
2001
2061
|
hasClass = true;
|
|
2002
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
2003
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
2062
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: AccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2063
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: AccordionComponent, isStandalone: true, selector: "rolatech-accordion", host: { properties: { "class.rolatech-accordion": "this.hasClass" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
2004
2064
|
}
|
|
2005
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
2065
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: AccordionComponent, decorators: [{
|
|
2006
2066
|
type: Component,
|
|
2007
2067
|
args: [{ selector: 'rolatech-accordion', imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n" }]
|
|
2008
2068
|
}], propDecorators: { hasClass: [{
|
|
@@ -2028,11 +2088,11 @@ const panelAnimations = {
|
|
|
2028
2088
|
|
|
2029
2089
|
class PanelComponent {
|
|
2030
2090
|
hasClass = true;
|
|
2031
|
-
border = input(false, { transform: booleanAttribute });
|
|
2032
|
-
divider = input(false, { transform: booleanAttribute });
|
|
2033
|
-
expanded = model(false);
|
|
2034
|
-
title = input();
|
|
2035
|
-
subtitle = input();
|
|
2091
|
+
border = input(false, ...(ngDevMode ? [{ debugName: "border", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
2092
|
+
divider = input(false, ...(ngDevMode ? [{ debugName: "divider", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
2093
|
+
expanded = model(false, ...(ngDevMode ? [{ debugName: "expanded" }] : []));
|
|
2094
|
+
title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : []));
|
|
2095
|
+
subtitle = input(...(ngDevMode ? [undefined, { debugName: "subtitle" }] : []));
|
|
2036
2096
|
el = inject(ElementRef);
|
|
2037
2097
|
constructor() {
|
|
2038
2098
|
effect(() => {
|
|
@@ -2061,10 +2121,10 @@ class PanelComponent {
|
|
|
2061
2121
|
toggle() {
|
|
2062
2122
|
this.expanded.set(!this.expanded());
|
|
2063
2123
|
}
|
|
2064
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
2065
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0
|
|
2124
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2125
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.0", type: PanelComponent, isStandalone: true, selector: "rolatech-panel", inputs: { border: { classPropertyName: "border", publicName: "border", isSignal: true, isRequired: false, transformFunction: null }, divider: { classPropertyName: "divider", publicName: "divider", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expanded: "expandedChange" }, host: { properties: { "class.rolatech-panel": "this.hasClass" } }, ngImport: i0, template: "<div id=\"header\" class=\"header rolatech-panel w-full h-11\" (click)=\"toggle(); $event.stopPropagation()\">\n <ng-content select=\"rolatech-panel-header\"></ng-content>\n <div>{{ title() }}</div>\n <rolatech-icon [@indicator]=\"expanded() === true ? 'expanded' : 'collapsed'\">expand_more</rolatech-icon>\n</div>\n<div class=\"content-container rolatech-panel\" [@content]=\"expanded() === true ? 'expanded' : 'collapsed'\">\n <div class=\"content-inner rolatech-panel\">\n <ng-content>No content</ng-content>\n </div>\n</div>\n", styles: ["rolatech-panel{box-sizing:content-box;display:block;overflow:hidden;background:var(--rt-base-background);color:var(--rt-text-primary);--rt-panel-padding: 12px}rolatech-panel:not([border]){margin-bottom:var(--rt-panel-padding)}rolatech-panel .header{padding:var(--rt-panel-padding);display:flex;justify-content:space-between;align-items:center;height:44px;background-color:var(--rt-10-percent-layer);cursor:pointer}rolatech-panel .header:hover{background-color:var(--rt-20-percent-layer)}rolatech-panel .content-container{overflow:visible}rolatech-panel .content-container .content-inner{padding:var(--rt-panel-padding)}rolatech-panel[border]{border-top:1px solid #d1d7dc;border-left:1px solid #d1d7dc;border-right:1px solid #d1d7dc}rolatech-panel[border]:last-child{border-bottom:1px solid #d1d7dc}rolatech-panel[divider]{border-bottom:1px solid #d1d7dc}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: IconComponent, selector: "rolatech-icon", inputs: ["filled"] }], animations: [panelAnimations.indicator, panelAnimations.content], encapsulation: i0.ViewEncapsulation.None });
|
|
2066
2126
|
}
|
|
2067
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
2127
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PanelComponent, decorators: [{
|
|
2068
2128
|
type: Component,
|
|
2069
2129
|
args: [{ selector: 'rolatech-panel', imports: [CommonModule, IconComponent], encapsulation: ViewEncapsulation.None, animations: [panelAnimations.indicator, panelAnimations.content], template: "<div id=\"header\" class=\"header rolatech-panel w-full h-11\" (click)=\"toggle(); $event.stopPropagation()\">\n <ng-content select=\"rolatech-panel-header\"></ng-content>\n <div>{{ title() }}</div>\n <rolatech-icon [@indicator]=\"expanded() === true ? 'expanded' : 'collapsed'\">expand_more</rolatech-icon>\n</div>\n<div class=\"content-container rolatech-panel\" [@content]=\"expanded() === true ? 'expanded' : 'collapsed'\">\n <div class=\"content-inner rolatech-panel\">\n <ng-content>No content</ng-content>\n </div>\n</div>\n", styles: ["rolatech-panel{box-sizing:content-box;display:block;overflow:hidden;background:var(--rt-base-background);color:var(--rt-text-primary);--rt-panel-padding: 12px}rolatech-panel:not([border]){margin-bottom:var(--rt-panel-padding)}rolatech-panel .header{padding:var(--rt-panel-padding);display:flex;justify-content:space-between;align-items:center;height:44px;background-color:var(--rt-10-percent-layer);cursor:pointer}rolatech-panel .header:hover{background-color:var(--rt-20-percent-layer)}rolatech-panel .content-container{overflow:visible}rolatech-panel .content-container .content-inner{padding:var(--rt-panel-padding)}rolatech-panel[border]{border-top:1px solid #d1d7dc;border-left:1px solid #d1d7dc;border-right:1px solid #d1d7dc}rolatech-panel[border]:last-child{border-bottom:1px solid #d1d7dc}rolatech-panel[divider]{border-bottom:1px solid #d1d7dc}\n"] }]
|
|
2070
2130
|
}], ctorParameters: () => [], propDecorators: { hasClass: [{
|
|
@@ -2073,17 +2133,111 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImpor
|
|
|
2073
2133
|
}] } });
|
|
2074
2134
|
|
|
2075
2135
|
class PanelHeaderComponent {
|
|
2076
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0
|
|
2077
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0
|
|
2136
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PanelHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2137
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: PanelHeaderComponent, isStandalone: true, selector: "rolatech-panel-header", ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
2078
2138
|
}
|
|
2079
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0
|
|
2139
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: PanelHeaderComponent, decorators: [{
|
|
2080
2140
|
type: Component,
|
|
2081
2141
|
args: [{ selector: 'rolatech-panel-header', imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n" }]
|
|
2082
2142
|
}] });
|
|
2083
2143
|
|
|
2144
|
+
class ConversationMessage {
|
|
2145
|
+
message = input.required(...(ngDevMode ? [{ debugName: "message" }] : []));
|
|
2146
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ConversationMessage, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2147
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: ConversationMessage, isStandalone: true, selector: "rolatech-conversation-message", inputs: { message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "@if (message().role === 'user') {\n<div class=\"flex justify-end\">\n <div class=\"flex flex-col items-end w-full pb-3\">\n <div\n class=\"max-w-[80%] rounded-2xl px-4 py-2 shadow-sm bg-[var(--rt-brand-color)] text-white whitespace-pre-wrap break-words\"\n >\n <div>{{ message().text }}</div>\n </div>\n\n <div class=\"text-xs text-gray-400 mt-1 pr-1\">{{ message().createdAt | date:'shortTime' }}</div>\n </div>\n</div>\n}@else {\n<div class=\"flex justify-start\">\n <div class=\"flex flex-col items-start w-full pb-3\">\n @if (message().role === 'assistant') { @for (seg of message().segments ?? []; track $index) { @switch (seg.kind) { @case\n ('text') {\n <div class=\"whitespace-pre-wrap break-all\">{{ seg.text }}</div>\n } @case ('group') {\n <a\n class=\"w-full flex flex-row py-2 hover:bg-[--rt-raised-background] cursor-pointer\"\n [routerLink]=\"['/properties', seg.item.id]\"\n target=\"_blank\"\n >\n @if (seg.item.mediaUrl) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer (on viewport()) {\n <rolatech-thumbnail [src]=\"seg.item.mediaUrl\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col gap-3 p-1\">\n <div class=\"font-bold\">{{ seg.item.title }}</div>\n <div class=\"mt-1\">\u00A3{{ seg.item.price }}</div>\n </div>\n </div>\n </div>\n </a>\n } @case ('json') {\n <pre class=\"mt-2 text-xs overflow-auto\">{{ seg.data | json }}</pre>\n } @case ('tool') {\n <div class=\"opacity-70 mb-3\">\uD83D\uDEE0 {{ seg.tool.tool }}: {{ seg.tool.args }} {{seg.tool.results}}</div>\n } } } @if (message().done) {\n <div class=\"text-xs opacity-50 mt-1\">[done]</div>\n } }\n </div>\n</div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder" }, { kind: "pipe", type: i1.JsonPipe, name: "json" }, { kind: "pipe", type: i1.DatePipe, name: "date" }], deferBlockDependencies: [() => [Promise.resolve().then(function () { return thumbnail_component; }).then(m => m.ThumbnailComponent)]] });
|
|
2148
|
+
}
|
|
2149
|
+
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "20.2.0", ngImport: i0, type: ConversationMessage, resolveDeferredDeps: () => [Promise.resolve().then(function () { return thumbnail_component; }).then(m => m.ThumbnailComponent)], resolveMetadata: ThumbnailComponent => ({ decorators: [{
|
|
2150
|
+
type: Component,
|
|
2151
|
+
args: [{ selector: 'rolatech-conversation-message', imports: [CommonModule, RouterLink, ThumbnailComponent, ImagePlaceholderComponent], template: "@if (message().role === 'user') {\n<div class=\"flex justify-end\">\n <div class=\"flex flex-col items-end w-full pb-3\">\n <div\n class=\"max-w-[80%] rounded-2xl px-4 py-2 shadow-sm bg-[var(--rt-brand-color)] text-white whitespace-pre-wrap break-words\"\n >\n <div>{{ message().text }}</div>\n </div>\n\n <div class=\"text-xs text-gray-400 mt-1 pr-1\">{{ message().createdAt | date:'shortTime' }}</div>\n </div>\n</div>\n}@else {\n<div class=\"flex justify-start\">\n <div class=\"flex flex-col items-start w-full pb-3\">\n @if (message().role === 'assistant') { @for (seg of message().segments ?? []; track $index) { @switch (seg.kind) { @case\n ('text') {\n <div class=\"whitespace-pre-wrap break-all\">{{ seg.text }}</div>\n } @case ('group') {\n <a\n class=\"w-full flex flex-row py-2 hover:bg-[--rt-raised-background] cursor-pointer\"\n [routerLink]=\"['/properties', seg.item.id]\"\n target=\"_blank\"\n >\n @if (seg.item.mediaUrl) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer (on viewport()) {\n <rolatech-thumbnail [src]=\"seg.item.mediaUrl\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col gap-3 p-1\">\n <div class=\"font-bold\">{{ seg.item.title }}</div>\n <div class=\"mt-1\">\u00A3{{ seg.item.price }}</div>\n </div>\n </div>\n </div>\n </a>\n } @case ('json') {\n <pre class=\"mt-2 text-xs overflow-auto\">{{ seg.data | json }}</pre>\n } @case ('tool') {\n <div class=\"opacity-70 mb-3\">\uD83D\uDEE0 {{ seg.tool.tool }}: {{ seg.tool.args }} {{seg.tool.results}}</div>\n } } } @if (message().done) {\n <div class=\"text-xs opacity-50 mt-1\">[done]</div>\n } }\n </div>\n</div>\n}\n" }]
|
|
2152
|
+
}], ctorParameters: null, propDecorators: null }) });
|
|
2153
|
+
|
|
2154
|
+
class ConversationContent {
|
|
2155
|
+
messages = input.required(...(ngDevMode ? [{ debugName: "messages" }] : []));
|
|
2156
|
+
scrollArea = viewChild('scrollArea', ...(ngDevMode ? [{ debugName: "scrollArea" }] : []));
|
|
2157
|
+
shouldStick = signal(true, ...(ngDevMode ? [{ debugName: "shouldStick" }] : []));
|
|
2158
|
+
streaming = input.required(...(ngDevMode ? [{ debugName: "streaming" }] : []));
|
|
2159
|
+
ngAfterViewInit() {
|
|
2160
|
+
const el = this.scrollArea()?.nativeElement;
|
|
2161
|
+
if (!el)
|
|
2162
|
+
return;
|
|
2163
|
+
el.addEventListener('scroll', () => {
|
|
2164
|
+
const atBottom = el.scrollTop + el.clientHeight >= el.scrollHeight - 20;
|
|
2165
|
+
this.shouldStick.set(atBottom);
|
|
2166
|
+
// you can handle autoscroll logic here
|
|
2167
|
+
});
|
|
2168
|
+
}
|
|
2169
|
+
scrollToBottom(behavior = 'smooth') {
|
|
2170
|
+
// const el = this.scrollArea()?.nativeElement;
|
|
2171
|
+
// if (!el) return;
|
|
2172
|
+
// const target = el.scrollHeight - el.clientHeight;
|
|
2173
|
+
// el.scrollTop = target;
|
|
2174
|
+
// el.scrollTo({ top: target, behavior });
|
|
2175
|
+
const el = this.scrollArea()?.nativeElement;
|
|
2176
|
+
if (!el)
|
|
2177
|
+
return;
|
|
2178
|
+
// primary
|
|
2179
|
+
// el.scrollTop = el.scrollHeight;
|
|
2180
|
+
// smooth if supported
|
|
2181
|
+
el.scrollTo({ top: el.scrollHeight, behavior });
|
|
2182
|
+
// fallback
|
|
2183
|
+
el.lastElementChild?.scrollIntoView({ behavior, block: 'end' });
|
|
2184
|
+
}
|
|
2185
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ConversationContent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2186
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0", type: ConversationContent, isStandalone: true, selector: "rolatech-conversation-content", inputs: { messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: true, transformFunction: null }, streaming: { classPropertyName: "streaming", publicName: "streaming", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "block h-full min-h-0" }, viewQueries: [{ propertyName: "scrollArea", first: true, predicate: ["scrollArea"], descendants: true, isSignal: true }], ngImport: i0, template: "<div #scrollArea class=\"h-full min-h-0 overflow-y-auto p-4\">\n <div class=\"w-full xl:max-w-[1024px] 2xl:max-w-[1280px] px-4 mx-auto\">\n @for (m of messages(); track m.id) {\n <rolatech-conversation-message [message]=\"m\" class=\"mb-3\" />\n } @if (streaming()) {\n <div class=\"flex items-center gap-2 text-sm opacity-80\">\n <span class=\"inline-block w-4 h-4 border-2 border-current border-t-transparent rounded-full animate-spin\"></span>\n <span>Streaming\u2026</span>\n </div>\n }\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ConversationMessage, selector: "rolatech-conversation-message", inputs: ["message"] }] });
|
|
2187
|
+
}
|
|
2188
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ConversationContent, decorators: [{
|
|
2189
|
+
type: Component,
|
|
2190
|
+
args: [{ selector: 'rolatech-conversation-content', imports: [CommonModule, ConversationMessage], host: { class: 'block h-full min-h-0' }, template: "<div #scrollArea class=\"h-full min-h-0 overflow-y-auto p-4\">\n <div class=\"w-full xl:max-w-[1024px] 2xl:max-w-[1280px] px-4 mx-auto\">\n @for (m of messages(); track m.id) {\n <rolatech-conversation-message [message]=\"m\" class=\"mb-3\" />\n } @if (streaming()) {\n <div class=\"flex items-center gap-2 text-sm opacity-80\">\n <span class=\"inline-block w-4 h-4 border-2 border-current border-t-transparent rounded-full animate-spin\"></span>\n <span>Streaming\u2026</span>\n </div>\n }\n </div>\n</div>\n" }]
|
|
2191
|
+
}] });
|
|
2192
|
+
|
|
2193
|
+
class ConversationHeader {
|
|
2194
|
+
status = input("u", ...(ngDevMode ? [{ debugName: "status" }] : []));
|
|
2195
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ConversationHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2196
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.0", type: ConversationHeader, isStandalone: true, selector: "rolatech-conversation-header", inputs: { status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<header class=\"px-4 py-3 flex items-center gap-3\">\n <div class=\"size-9 rounded-full bg-gray-200\"></div>\n <div class=\"font-medium\">Property Assistant</div>\n <div class=\"ml-auto text-sm text-gray-500\">{{status()}}</div>\n</header>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
2197
|
+
}
|
|
2198
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ConversationHeader, decorators: [{
|
|
2199
|
+
type: Component,
|
|
2200
|
+
args: [{ selector: 'rolatech-conversation-header', imports: [CommonModule], template: "<header class=\"px-4 py-3 flex items-center gap-3\">\n <div class=\"size-9 rounded-full bg-gray-200\"></div>\n <div class=\"font-medium\">Property Assistant</div>\n <div class=\"ml-auto text-sm text-gray-500\">{{status()}}</div>\n</header>\n" }]
|
|
2201
|
+
}] });
|
|
2202
|
+
|
|
2203
|
+
class ConversationInput {
|
|
2204
|
+
send = output();
|
|
2205
|
+
ta = viewChild('ta', ...(ngDevMode ? [{ debugName: "ta" }] : []));
|
|
2206
|
+
onKeydown(e) {
|
|
2207
|
+
if (e.key === 'Enter' && !e.shiftKey) {
|
|
2208
|
+
e.preventDefault();
|
|
2209
|
+
this.emitSend();
|
|
2210
|
+
}
|
|
2211
|
+
}
|
|
2212
|
+
emitSend() {
|
|
2213
|
+
const el = this.ta()?.nativeElement;
|
|
2214
|
+
if (!el)
|
|
2215
|
+
return;
|
|
2216
|
+
const value = el.value.trim();
|
|
2217
|
+
if (!value)
|
|
2218
|
+
return;
|
|
2219
|
+
this.send.emit(value); // ✅ emit via output() signal
|
|
2220
|
+
el.value = '';
|
|
2221
|
+
this.autoResize();
|
|
2222
|
+
}
|
|
2223
|
+
autoResize() {
|
|
2224
|
+
const el = this.ta()?.nativeElement;
|
|
2225
|
+
if (!el)
|
|
2226
|
+
return;
|
|
2227
|
+
el.style.height = 'auto';
|
|
2228
|
+
el.style.height = Math.min(el.scrollHeight, 220) + 'px';
|
|
2229
|
+
}
|
|
2230
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ConversationInput, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2231
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.2.0", type: ConversationInput, isStandalone: true, selector: "rolatech-conversation-input", outputs: { send: "send" }, viewQueries: [{ propertyName: "ta", first: true, predicate: ["ta"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"p-3 w-full xl:max-w-[1024px] 2xl:max-w-[1280px] mx-auto\">\n <div class=\"flex rounded-full px-3 py-2 dark:bg-[--rt-raised-background] border border-black border-opacity-20\">\n <textarea\n #ta\n rows=\"1\"\n class=\"w-full border border-transparent appearance-none rounded p-2 py-2.5 resize-none outline-none dark:bg-[--rt-raised-background]\"\n placeholder=\"Ask about properties...\"\n (keydown)=\"onKeydown($event)\"\n (input)=\"autoResize()\"\n ></textarea>\n <button\n matIconButton\n (click)=\"emitSend()\"\n [disabled]=\"!ta.value.trim()\"\n [ngClass]=\"!ta.value.trim() ? '' : '!bg-[--rt-brand-color] !text-[--rt-text-primary-inverse]'\"\n >\n <mat-icon>arrow_upward</mat-icon>\n </button>\n </div>\n <div\n class=\"text-token-text-secondary relative mt-auto flex min-h-8 w-full items-center justify-center p-2 text-center text-xs md:px-[60px]\"\n >\n Primecasa Assistant can make mistakes. Check important info.\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
|
|
2232
|
+
}
|
|
2233
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ConversationInput, decorators: [{
|
|
2234
|
+
type: Component,
|
|
2235
|
+
args: [{ selector: 'rolatech-conversation-input', imports: [CommonModule, MatButtonModule, MatIcon], template: "<div class=\"p-3 w-full xl:max-w-[1024px] 2xl:max-w-[1280px] mx-auto\">\n <div class=\"flex rounded-full px-3 py-2 dark:bg-[--rt-raised-background] border border-black border-opacity-20\">\n <textarea\n #ta\n rows=\"1\"\n class=\"w-full border border-transparent appearance-none rounded p-2 py-2.5 resize-none outline-none dark:bg-[--rt-raised-background]\"\n placeholder=\"Ask about properties...\"\n (keydown)=\"onKeydown($event)\"\n (input)=\"autoResize()\"\n ></textarea>\n <button\n matIconButton\n (click)=\"emitSend()\"\n [disabled]=\"!ta.value.trim()\"\n [ngClass]=\"!ta.value.trim() ? '' : '!bg-[--rt-brand-color] !text-[--rt-text-primary-inverse]'\"\n >\n <mat-icon>arrow_upward</mat-icon>\n </button>\n </div>\n <div\n class=\"text-token-text-secondary relative mt-auto flex min-h-8 w-full items-center justify-center p-2 text-center text-xs md:px-[60px]\"\n >\n Primecasa Assistant can make mistakes. Check important info.\n </div>\n</div>\n" }]
|
|
2236
|
+
}] });
|
|
2237
|
+
|
|
2084
2238
|
/**
|
|
2085
2239
|
* Generated bundle index. Do not edit.
|
|
2086
2240
|
*/
|
|
2087
2241
|
|
|
2088
|
-
export { APP_LAYOUT, AcceptDialogComponent, AccordionComponent, AngularComponentsModule, AppPageComponent, AvatarComponent, BaseComponent, ChipBarComponent, ConfirmationComponent, ConfirmationDialogComponent, ConsoleLayoutComponent, ContainerComponent, ContentComponent, DrawerComponent, EditorComponent, EmptyComponent, FilterComponent, FolderComponent, FooterComponent, IconButtonComponent, IconComponent, ImageComponent, ImagePlaceholderComponent, ImagePreviewDialogComponent, InputComponent, LayoutComponent, ListComponent, LocationSelectorComponent, MaterialModule, MediaListComponent, MediaListItemComponent, MediaPreviewComponent, MediaPreviewDialogComponent, MediaUploadComponent, MediaUploadDialogComponent, MenuIconComponent, MenuUserComponent, MiniGuideComponent, NotFoundComponent, PaginatorComponent, PanelComponent, PanelHeaderComponent, PdfViewerComponent, RejectDialogComponent, ResizableContainerComponent, RichGridMediaComponent, RichItemComponent, RichLabelComponent, RichViewComponent, SpinnerComponent, StorageBucketCreateComponent, StorageFileUploadComponent, StorageFolderCreateComponent, TabComponent, TableComponent, TabsComponent, ThumbnailComponent, TitleComponent, ToolbarComponent, TopbarAvatarMenuComponent, TopbarComponent, WechatConnectDialogComponent, provideAngularLayout };
|
|
2242
|
+
export { APP_LAYOUT, AcceptDialogComponent, AccordionComponent, AngularComponentsModule, AppPageComponent, AvatarComponent, BaseComponent, ChatBox, ChipBarComponent, ConfirmationComponent, ConfirmationDialogComponent, ConsoleLayoutComponent, ContainerComponent, ContentComponent, ConversationContent, ConversationHeader, ConversationInput, ConversationMessage, DrawerComponent, EditorComponent, EmptyComponent, FilterComponent, FolderComponent, FooterComponent, IconButtonComponent, IconComponent, ImageComponent, ImagePlaceholderComponent, ImagePreviewDialogComponent, InputComponent, LayoutComponent, ListComponent, LocationSelectorComponent, MaterialModule, MediaListComponent, MediaListItemComponent, MediaPreviewComponent, MediaPreviewDialogComponent, MediaUploadComponent, MediaUploadDialogComponent, MenuIconComponent, MenuUserComponent, MiniGuideComponent, NotFoundComponent, PaginatorComponent, PanelComponent, PanelHeaderComponent, PdfViewerComponent, RejectDialogComponent, ResizableContainerComponent, RichGridMediaComponent, RichItemComponent, RichLabelComponent, RichViewComponent, SpinnerComponent, StorageBucketCreateComponent, StorageFileUploadComponent, StorageFolderCreateComponent, TabComponent, TableComponent, TabsComponent, ThumbnailComponent, TitleComponent, ToolbarComponent, TopbarAvatarMenuComponent, TopbarComponent, VideoUpload, WechatConnectDialogComponent, provideAngularLayout };
|
|
2089
2243
|
//# sourceMappingURL=rolatech-angular-components.mjs.map
|