@rolatech/angular-components 20.2.8-bete.1 → 20.2.9-beta.2
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,13 +1,12 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { inject, input, model, signal, ViewEncapsulation, ChangeDetectionStrategy, Component, output, viewChild, Renderer2, ViewChild,
|
|
2
|
+
import { inject, input, model, signal, ViewEncapsulation, ChangeDetectionStrategy, Component, output, viewChild, Renderer2, ViewChild, booleanAttribute, ElementRef, effect, HostBinding, InjectionToken, makeEnvironmentProviders, PLATFORM_ID, NgModule, computed, contentChild, ChangeDetectorRef, HostListener, Input, DestroyRef, Directive, contentChildren, Pipe, viewChildren } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/material/form-field';
|
|
4
4
|
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
5
5
|
import * as i3 from '@angular/material/progress-spinner';
|
|
6
6
|
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
|
|
7
7
|
import * as i2 from '@angular/material/select';
|
|
8
8
|
import { MatSelectModule } from '@angular/material/select';
|
|
9
|
-
import
|
|
10
|
-
import { EnumApiClient, LoadingService, DialogService, SnackBarService, TitleService, NavigationService, BackButtonDirective } from '@rolatech/angular-services';
|
|
9
|
+
import { EnumApiClient, LoadingService, MediaService, DialogService, SnackBarService, TitleService, NavigationService, BackButtonDirective } from '@rolatech/angular-services';
|
|
11
10
|
import * as i1$1 from '@angular/common';
|
|
12
11
|
import { CommonModule, isPlatformBrowser, NgClass } from '@angular/common';
|
|
13
12
|
import * as i3$1 from '@angular/forms';
|
|
@@ -22,24 +21,19 @@ import * as i1$3 from '@angular/material/progress-bar';
|
|
|
22
21
|
import { MatProgressBarModule, MatProgressBar } from '@angular/material/progress-bar';
|
|
23
22
|
import { DurationPipe, APP_CONFIG, AngularCommonModule, PricePipe } from '@rolatech/angular-common';
|
|
24
23
|
import { DomSanitizer } from '@angular/platform-browser';
|
|
25
|
-
import * as i1$4 from '@angular/material/dialog';
|
|
26
24
|
import { MatDialogRef, MAT_DIALOG_DATA, MatDialogContent, MatDialogActions, MatDialogClose, MatDialogTitle, MatDialogModule, MatDialog } from '@angular/material/dialog';
|
|
27
25
|
import { MatSidenavModule } from '@angular/material/sidenav';
|
|
28
|
-
import * as i3$2 from '@angular/material/list';
|
|
29
26
|
import { MatListModule } from '@angular/material/list';
|
|
30
|
-
import * as i1$
|
|
27
|
+
import * as i1$5 from '@angular/router';
|
|
31
28
|
import { RouterLink, RouterLinkActive, Router, RouterEvent, NavigationEnd, ActivatedRoute, RouterModule } from '@angular/router';
|
|
32
|
-
import { BreakpointObserver,
|
|
29
|
+
import { BreakpointObserver, LayoutModule, Breakpoints } from '@angular/cdk/layout';
|
|
33
30
|
import { map, distinctUntilChanged, filter } from 'rxjs';
|
|
34
31
|
import { Platform } from '@angular/cdk/platform';
|
|
35
|
-
import { ViewportRuler, ScrollingModule } from '@angular/cdk/scrolling';
|
|
36
|
-
import * as i2$2 from '@angular/material/menu';
|
|
37
|
-
import { MatMenuModule } from '@angular/material/menu';
|
|
38
|
-
import { MatDividerModule, MatDivider } from '@angular/material/divider';
|
|
39
32
|
import { A11yModule } from '@angular/cdk/a11y';
|
|
40
33
|
import { ClipboardModule } from '@angular/cdk/clipboard';
|
|
41
34
|
import { DragDropModule } from '@angular/cdk/drag-drop';
|
|
42
35
|
import { PortalModule } from '@angular/cdk/portal';
|
|
36
|
+
import { ScrollingModule, ViewportRuler } from '@angular/cdk/scrolling';
|
|
43
37
|
import { CdkStepperModule } from '@angular/cdk/stepper';
|
|
44
38
|
import { CdkTableModule } from '@angular/cdk/table';
|
|
45
39
|
import { CdkTreeModule } from '@angular/cdk/tree';
|
|
@@ -53,8 +47,12 @@ import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
|
53
47
|
import { MatChipsModule } from '@angular/material/chips';
|
|
54
48
|
import { MatNativeDateModule, MatRippleModule, MatOptionModule } from '@angular/material/core';
|
|
55
49
|
import { MatDatepickerModule } from '@angular/material/datepicker';
|
|
50
|
+
import * as i2$4 from '@angular/material/divider';
|
|
51
|
+
import { MatDividerModule, MatDivider } from '@angular/material/divider';
|
|
56
52
|
import { MatExpansionModule } from '@angular/material/expansion';
|
|
57
53
|
import { MatGridListModule } from '@angular/material/grid-list';
|
|
54
|
+
import * as i2$2 from '@angular/material/menu';
|
|
55
|
+
import { MatMenuModule } from '@angular/material/menu';
|
|
58
56
|
import { MatPaginatorModule } from '@angular/material/paginator';
|
|
59
57
|
import { MatRadioModule } from '@angular/material/radio';
|
|
60
58
|
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
|
|
@@ -62,7 +60,7 @@ import { MatSliderModule } from '@angular/material/slider';
|
|
|
62
60
|
import { MatSnackBarModule } from '@angular/material/snack-bar';
|
|
63
61
|
import { MatSortModule } from '@angular/material/sort';
|
|
64
62
|
import { MatStepperModule } from '@angular/material/stepper';
|
|
65
|
-
import * as i1$
|
|
63
|
+
import * as i1$4 from '@angular/material/table';
|
|
66
64
|
import { MatTableModule } from '@angular/material/table';
|
|
67
65
|
import { MatTabsModule } from '@angular/material/tabs';
|
|
68
66
|
import { MatToolbarModule } from '@angular/material/toolbar';
|
|
@@ -96,19 +94,19 @@ class EnumSelect {
|
|
|
96
94
|
},
|
|
97
95
|
});
|
|
98
96
|
}
|
|
99
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
100
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
97
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: EnumSelect, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
98
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: EnumSelect, isStandalone: true, selector: "rolatech-enum-select", inputs: { resource: { classPropertyName: "resource", publicName: "resource", isSignal: true, isRequired: true, transformFunction: null }, enumName: { classPropertyName: "enumName", publicName: "enumName", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, ngImport: i0, template: "<mat-form-field appearance=\"fill\" class=\"w-full\" subscriptSizing=\"dynamic\">\n @if (label()) {\n <mat-label>{{ label() }}</mat-label>\n }\n <mat-select [disabled]=\"disabled() || loading()\" [value]=\"value()\" (selectionChange)=\"value.set($event.value)\">\n <mat-option [value]=\"null\">{{ placeholder() }}</mat-option>\n\n @for (opt of options(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n\n @if (loading()) {\n <mat-hint>\n <span class=\"inline-flex items-center gap-2\">\n <mat-progress-spinner diameter=\"14\" mode=\"indeterminate\"></mat-progress-spinner>\n Loading\u2026\n </span>\n </mat-hint>\n } @if (error()) {\n <mat-error>{{ error() }}</mat-error>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2.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: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
101
99
|
}
|
|
102
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
100
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: EnumSelect, decorators: [{
|
|
103
101
|
type: Component,
|
|
104
102
|
args: [{ selector: 'rolatech-enum-select', imports: [MatFormFieldModule, MatSelectModule, MatProgressSpinnerModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<mat-form-field appearance=\"fill\" class=\"w-full\" subscriptSizing=\"dynamic\">\n @if (label()) {\n <mat-label>{{ label() }}</mat-label>\n }\n <mat-select [disabled]=\"disabled() || loading()\" [value]=\"value()\" (selectionChange)=\"value.set($event.value)\">\n <mat-option [value]=\"null\">{{ placeholder() }}</mat-option>\n\n @for (opt of options(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n\n @if (loading()) {\n <mat-hint>\n <span class=\"inline-flex items-center gap-2\">\n <mat-progress-spinner diameter=\"14\" mode=\"indeterminate\"></mat-progress-spinner>\n Loading\u2026\n </span>\n </mat-hint>\n } @if (error()) {\n <mat-error>{{ error() }}</mat-error>\n }\n</mat-form-field>\n" }]
|
|
105
103
|
}], propDecorators: { resource: [{ type: i0.Input, args: [{ isSignal: true, alias: "resource", required: true }] }], enumName: [{ type: i0.Input, args: [{ isSignal: true, alias: "enumName", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }] } });
|
|
106
104
|
|
|
107
105
|
class Skeleton {
|
|
108
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
109
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
106
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: Skeleton, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
107
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: Skeleton, isStandalone: true, selector: "rolatech-skeleton", host: { attributes: { "id": "rolatech-skeleton" }, classAttribute: "rolatech-skeleton rounded" }, ngImport: i0, template: "<div class=\"rolatech-skeleton-inner inline-grid animate-pulse\"></div>\n", styles: ["rolatech-skeleton{display:grid}.rolatech-skeleton{background-color:var(--rt-skeleton-background)}.rolatech-skeleton-inner{width:100%;height:100%;border-radius:inherit;background-color:inherit}\n"], encapsulation: i0.ViewEncapsulation.None });
|
|
110
108
|
}
|
|
111
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
109
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: Skeleton, decorators: [{
|
|
112
110
|
type: Component,
|
|
113
111
|
args: [{ selector: 'rolatech-skeleton', imports: [], encapsulation: ViewEncapsulation.None, host: {
|
|
114
112
|
id: 'rolatech-skeleton',
|
|
@@ -129,10 +127,10 @@ class ChatBox {
|
|
|
129
127
|
sendMessage() {
|
|
130
128
|
this.send.emit();
|
|
131
129
|
}
|
|
132
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
133
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
130
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ChatBox, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
131
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", 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$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$2.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 });
|
|
134
132
|
}
|
|
135
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
133
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ChatBox, decorators: [{
|
|
136
134
|
type: Component,
|
|
137
135
|
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"] }]
|
|
138
136
|
}], propDecorators: { userInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "userInput", required: false }] }, { type: i0.Output, args: ["userInputChange"] }], send: [{ type: i0.Output, args: ["send"] }] } });
|
|
@@ -164,15 +162,21 @@ class VideoUpload {
|
|
|
164
162
|
this.upload.emit({ data });
|
|
165
163
|
}
|
|
166
164
|
onMediaEdit() {
|
|
167
|
-
this.
|
|
165
|
+
const item = this.item();
|
|
166
|
+
if (item) {
|
|
167
|
+
this.mediaEdit.emit(item);
|
|
168
|
+
}
|
|
168
169
|
}
|
|
169
170
|
onDeleteMedia() {
|
|
170
|
-
this.
|
|
171
|
+
const item = this.item();
|
|
172
|
+
if (item) {
|
|
173
|
+
this.deleteMedia.emit(item);
|
|
174
|
+
}
|
|
171
175
|
}
|
|
172
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
173
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
176
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: VideoUpload, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
177
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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$3.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$2.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" }] });
|
|
174
178
|
}
|
|
175
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
179
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: VideoUpload, decorators: [{
|
|
176
180
|
type: Component,
|
|
177
181
|
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"] }]
|
|
178
182
|
}], propDecorators: { myVideo: [{ type: i0.ViewChild, args: ['video', { isSignal: true }] }], item: [{ type: i0.Input, args: [{ isSignal: true, alias: "item", required: false }] }], uploading: [{ type: i0.Input, args: [{ isSignal: true, alias: "uploading", required: false }] }, { type: i0.Output, args: ["uploadingChange"] }], editing: [{ type: i0.Input, args: [{ isSignal: true, alias: "editing", required: false }] }, { type: i0.Output, args: ["editingChange"] }], progress: [{ type: i0.Input, args: [{ isSignal: true, alias: "progress", required: false }] }], mediaEdit: [{ type: i0.Output, args: ["mediaEdit"] }], thumbnailUpload: [{ type: i0.Output, args: ["thumbnailUpload"] }], upload: [{ type: i0.Output, args: ["upload"] }], deleteMedia: [{ type: i0.Output, args: ["deleteMedia"] }], editId: [{ type: i0.Input, args: [{ isSignal: true, alias: "editId", required: false }] }, { type: i0.Output, args: ["editIdChange"] }], hasUnsaved: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasUnsaved", required: false }] }] } });
|
|
@@ -185,10 +189,10 @@ class PdfViewerComponent {
|
|
|
185
189
|
constructor() {
|
|
186
190
|
this.safeUrl = this.sanitizer.bypassSecurityTrustResourceUrl(this.url);
|
|
187
191
|
}
|
|
188
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
189
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
192
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: PdfViewerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
193
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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 }] });
|
|
190
194
|
}
|
|
191
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
195
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: PdfViewerComponent, decorators: [{
|
|
192
196
|
type: Component,
|
|
193
197
|
args: [{ selector: 'rolatech-pdf-viewer', imports: [CommonModule], template: "<iframe [src]=\"safeUrl\" width=\"100%\" height=\"100%\" frameborder=\"0\"></iframe>\n" }]
|
|
194
198
|
}], ctorParameters: () => [] });
|
|
@@ -196,10 +200,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
196
200
|
class RichLabelComponent {
|
|
197
201
|
label = input.required(...(ngDevMode ? [{ debugName: "label" }] : []));
|
|
198
202
|
title = input.required(...(ngDevMode ? [{ debugName: "title" }] : []));
|
|
199
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
200
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
203
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: RichLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
204
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", 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 }] });
|
|
201
205
|
}
|
|
202
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
206
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: RichLabelComponent, decorators: [{
|
|
203
207
|
type: Component,
|
|
204
208
|
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" }]
|
|
205
209
|
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }] } });
|
|
@@ -230,10 +234,10 @@ class ResizableContainerComponent {
|
|
|
230
234
|
stopResizing() {
|
|
231
235
|
this.isResizing = false;
|
|
232
236
|
}
|
|
233
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
234
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
237
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ResizableContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
238
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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 }] });
|
|
235
239
|
}
|
|
236
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
240
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ResizableContainerComponent, decorators: [{
|
|
237
241
|
type: Component,
|
|
238
242
|
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"] }]
|
|
239
243
|
}], propDecorators: { leftDiv: [{
|
|
@@ -248,10 +252,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
248
252
|
}] } });
|
|
249
253
|
|
|
250
254
|
class RichGridMediaComponent {
|
|
251
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
252
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
255
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: RichGridMediaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
256
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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 }] });
|
|
253
257
|
}
|
|
254
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
258
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: RichGridMediaComponent, decorators: [{
|
|
255
259
|
type: Component,
|
|
256
260
|
args: [{ selector: 'rolatech-rich-grid-media', imports: [CommonModule], template: "<p>rich-grid-media works!</p>\n" }]
|
|
257
261
|
}] });
|
|
@@ -270,10 +274,10 @@ class RejectDialogComponent {
|
|
|
270
274
|
});
|
|
271
275
|
this.rejectForm.setValue(this.data);
|
|
272
276
|
}
|
|
273
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
274
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
277
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: RejectDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
278
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$1.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: i3$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$1.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: i1$2.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"] }] });
|
|
275
279
|
}
|
|
276
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
280
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: RejectDialogComponent, decorators: [{
|
|
277
281
|
type: Component,
|
|
278
282
|
args: [{ selector: 'rolatech-reject-dialog', imports: [
|
|
279
283
|
MatDialogContent,
|
|
@@ -288,25 +292,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
288
292
|
}] });
|
|
289
293
|
|
|
290
294
|
class AcceptDialogComponent {
|
|
291
|
-
dialogRef;
|
|
292
|
-
data;
|
|
293
|
-
constructor(dialogRef, data) {
|
|
294
|
-
this.dialogRef = dialogRef;
|
|
295
|
-
this.data = data;
|
|
296
|
-
}
|
|
295
|
+
dialogRef = inject((MatDialogRef));
|
|
296
|
+
data = inject(MAT_DIALOG_DATA);
|
|
297
297
|
onNoClick() {
|
|
298
298
|
this.dialogRef.close();
|
|
299
299
|
}
|
|
300
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
301
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
300
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AcceptDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
301
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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: i1$2.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"] }] });
|
|
302
302
|
}
|
|
303
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
303
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AcceptDialogComponent, decorators: [{
|
|
304
304
|
type: Component,
|
|
305
305
|
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" }]
|
|
306
|
-
}]
|
|
307
|
-
type: Inject,
|
|
308
|
-
args: [MAT_DIALOG_DATA]
|
|
309
|
-
}] }] });
|
|
306
|
+
}] });
|
|
310
307
|
|
|
311
308
|
class IconComponent {
|
|
312
309
|
hasClass = true;
|
|
@@ -322,10 +319,10 @@ class IconComponent {
|
|
|
322
319
|
}
|
|
323
320
|
});
|
|
324
321
|
}
|
|
325
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
326
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
322
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
323
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", 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 });
|
|
327
324
|
}
|
|
328
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
325
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: IconComponent, decorators: [{
|
|
329
326
|
type: Component,
|
|
330
327
|
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"] }]
|
|
331
328
|
}], ctorParameters: () => [], propDecorators: { hasClass: [{
|
|
@@ -335,10 +332,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
335
332
|
|
|
336
333
|
class IconButtonComponent {
|
|
337
334
|
hasClass = true;
|
|
338
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
339
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
335
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: IconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
336
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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 });
|
|
340
337
|
}
|
|
341
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
338
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: IconButtonComponent, decorators: [{
|
|
342
339
|
type: Component,
|
|
343
340
|
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"] }]
|
|
344
341
|
}], propDecorators: { hasClass: [{
|
|
@@ -351,10 +348,10 @@ class TitleComponent {
|
|
|
351
348
|
title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : []));
|
|
352
349
|
subtitle = input(...(ngDevMode ? [undefined, { debugName: "subtitle" }] : []));
|
|
353
350
|
large = input(false, { ...(ngDevMode ? { debugName: "large" } : {}), transform: booleanAttribute });
|
|
354
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
355
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
351
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
352
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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 });
|
|
356
353
|
}
|
|
357
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
354
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TitleComponent, decorators: [{
|
|
358
355
|
type: Component,
|
|
359
356
|
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"] }]
|
|
360
357
|
}], propDecorators: { hasClass: [{
|
|
@@ -365,10 +362,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
365
362
|
class ContainerComponent {
|
|
366
363
|
hasId = 'rolatech-container';
|
|
367
364
|
hasClass = true;
|
|
368
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
369
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
365
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
366
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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-fit\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: ["rolatech-container{--rt-tabs-padding-left: 4px;--rt-tabs-padding-right: 4px}@media(min-width:1280px){.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 });
|
|
370
367
|
}
|
|
371
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
368
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ContainerComponent, decorators: [{
|
|
372
369
|
type: Component,
|
|
373
370
|
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-fit\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: ["rolatech-container{--rt-tabs-padding-left: 4px;--rt-tabs-padding-right: 4px}@media(min-width:1280px){.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"] }]
|
|
374
371
|
}], propDecorators: { hasId: [{
|
|
@@ -392,10 +389,10 @@ function provideAngularLayout(config) {
|
|
|
392
389
|
|
|
393
390
|
class MenuIconComponent {
|
|
394
391
|
hasClass = true;
|
|
395
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
396
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
392
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MenuIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
393
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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 });
|
|
397
394
|
}
|
|
398
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
395
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MenuIconComponent, decorators: [{
|
|
399
396
|
type: Component,
|
|
400
397
|
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"] }]
|
|
401
398
|
}], propDecorators: { hasClass: [{
|
|
@@ -429,10 +426,10 @@ class TopbarComponent {
|
|
|
429
426
|
}
|
|
430
427
|
this.appDrawer.toggle();
|
|
431
428
|
}
|
|
432
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
433
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
429
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TopbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
430
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", 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 });
|
|
434
431
|
}
|
|
435
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
432
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TopbarComponent, decorators: [{
|
|
436
433
|
type: Component,
|
|
437
434
|
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"] }]
|
|
438
435
|
}], propDecorators: { hostId: [{
|
|
@@ -443,10 +440,220 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
443
440
|
args: ['class.rolatech-topbar']
|
|
444
441
|
}], link: [{ type: i0.Input, args: [{ isSignal: true, alias: "link", required: false }] }] } });
|
|
445
442
|
|
|
443
|
+
const MAT_MODULE = [
|
|
444
|
+
A11yModule,
|
|
445
|
+
ClipboardModule,
|
|
446
|
+
CdkStepperModule,
|
|
447
|
+
CdkTableModule,
|
|
448
|
+
CdkTreeModule,
|
|
449
|
+
DragDropModule,
|
|
450
|
+
LayoutModule,
|
|
451
|
+
MatAutocompleteModule,
|
|
452
|
+
MatBadgeModule,
|
|
453
|
+
MatBottomSheetModule,
|
|
454
|
+
MatButtonModule,
|
|
455
|
+
MatButtonToggleModule,
|
|
456
|
+
MatCardModule,
|
|
457
|
+
MatCheckboxModule,
|
|
458
|
+
MatChipsModule,
|
|
459
|
+
MatStepperModule,
|
|
460
|
+
MatDatepickerModule,
|
|
461
|
+
MatDialogModule,
|
|
462
|
+
MatDividerModule,
|
|
463
|
+
MatExpansionModule,
|
|
464
|
+
MatGridListModule,
|
|
465
|
+
MatIconModule,
|
|
466
|
+
MatFormFieldModule,
|
|
467
|
+
MatInputModule,
|
|
468
|
+
MatListModule,
|
|
469
|
+
MatMenuModule,
|
|
470
|
+
MatNativeDateModule,
|
|
471
|
+
MatPaginatorModule,
|
|
472
|
+
MatProgressBarModule,
|
|
473
|
+
MatProgressSpinnerModule,
|
|
474
|
+
MatRadioModule,
|
|
475
|
+
MatRippleModule,
|
|
476
|
+
MatSelectModule,
|
|
477
|
+
MatSidenavModule,
|
|
478
|
+
MatSliderModule,
|
|
479
|
+
MatSlideToggleModule,
|
|
480
|
+
MatSnackBarModule,
|
|
481
|
+
MatSortModule,
|
|
482
|
+
MatTableModule,
|
|
483
|
+
MatTabsModule,
|
|
484
|
+
MatToolbarModule,
|
|
485
|
+
MatTooltipModule,
|
|
486
|
+
MatTreeModule,
|
|
487
|
+
PortalModule,
|
|
488
|
+
ScrollingModule,
|
|
489
|
+
];
|
|
490
|
+
class MaterialModule {
|
|
491
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MaterialModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
492
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: MaterialModule, imports: [A11yModule,
|
|
493
|
+
ClipboardModule,
|
|
494
|
+
CdkStepperModule,
|
|
495
|
+
CdkTableModule,
|
|
496
|
+
CdkTreeModule,
|
|
497
|
+
DragDropModule,
|
|
498
|
+
LayoutModule,
|
|
499
|
+
MatAutocompleteModule,
|
|
500
|
+
MatBadgeModule,
|
|
501
|
+
MatBottomSheetModule,
|
|
502
|
+
MatButtonModule,
|
|
503
|
+
MatButtonToggleModule,
|
|
504
|
+
MatCardModule,
|
|
505
|
+
MatCheckboxModule,
|
|
506
|
+
MatChipsModule,
|
|
507
|
+
MatStepperModule,
|
|
508
|
+
MatDatepickerModule,
|
|
509
|
+
MatDialogModule,
|
|
510
|
+
MatDividerModule,
|
|
511
|
+
MatExpansionModule,
|
|
512
|
+
MatGridListModule,
|
|
513
|
+
MatIconModule,
|
|
514
|
+
MatFormFieldModule,
|
|
515
|
+
MatInputModule,
|
|
516
|
+
MatListModule,
|
|
517
|
+
MatMenuModule,
|
|
518
|
+
MatNativeDateModule,
|
|
519
|
+
MatPaginatorModule,
|
|
520
|
+
MatProgressBarModule,
|
|
521
|
+
MatProgressSpinnerModule,
|
|
522
|
+
MatRadioModule,
|
|
523
|
+
MatRippleModule,
|
|
524
|
+
MatSelectModule,
|
|
525
|
+
MatSidenavModule,
|
|
526
|
+
MatSliderModule,
|
|
527
|
+
MatSlideToggleModule,
|
|
528
|
+
MatSnackBarModule,
|
|
529
|
+
MatSortModule,
|
|
530
|
+
MatTableModule,
|
|
531
|
+
MatTabsModule,
|
|
532
|
+
MatToolbarModule,
|
|
533
|
+
MatTooltipModule,
|
|
534
|
+
MatTreeModule,
|
|
535
|
+
PortalModule,
|
|
536
|
+
ScrollingModule], exports: [A11yModule,
|
|
537
|
+
ClipboardModule,
|
|
538
|
+
CdkStepperModule,
|
|
539
|
+
CdkTableModule,
|
|
540
|
+
CdkTreeModule,
|
|
541
|
+
DragDropModule,
|
|
542
|
+
LayoutModule,
|
|
543
|
+
MatAutocompleteModule,
|
|
544
|
+
MatBadgeModule,
|
|
545
|
+
MatBottomSheetModule,
|
|
546
|
+
MatButtonModule,
|
|
547
|
+
MatButtonToggleModule,
|
|
548
|
+
MatCardModule,
|
|
549
|
+
MatCheckboxModule,
|
|
550
|
+
MatChipsModule,
|
|
551
|
+
MatStepperModule,
|
|
552
|
+
MatDatepickerModule,
|
|
553
|
+
MatDialogModule,
|
|
554
|
+
MatDividerModule,
|
|
555
|
+
MatExpansionModule,
|
|
556
|
+
MatGridListModule,
|
|
557
|
+
MatIconModule,
|
|
558
|
+
MatFormFieldModule,
|
|
559
|
+
MatInputModule,
|
|
560
|
+
MatListModule,
|
|
561
|
+
MatMenuModule,
|
|
562
|
+
MatNativeDateModule,
|
|
563
|
+
MatPaginatorModule,
|
|
564
|
+
MatProgressBarModule,
|
|
565
|
+
MatProgressSpinnerModule,
|
|
566
|
+
MatRadioModule,
|
|
567
|
+
MatRippleModule,
|
|
568
|
+
MatSelectModule,
|
|
569
|
+
MatSidenavModule,
|
|
570
|
+
MatSliderModule,
|
|
571
|
+
MatSlideToggleModule,
|
|
572
|
+
MatSnackBarModule,
|
|
573
|
+
MatSortModule,
|
|
574
|
+
MatTableModule,
|
|
575
|
+
MatTabsModule,
|
|
576
|
+
MatToolbarModule,
|
|
577
|
+
MatTooltipModule,
|
|
578
|
+
MatTreeModule,
|
|
579
|
+
PortalModule,
|
|
580
|
+
ScrollingModule] });
|
|
581
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MaterialModule, imports: [MAT_MODULE, A11yModule,
|
|
582
|
+
ClipboardModule,
|
|
583
|
+
CdkStepperModule,
|
|
584
|
+
CdkTableModule,
|
|
585
|
+
CdkTreeModule,
|
|
586
|
+
DragDropModule,
|
|
587
|
+
LayoutModule,
|
|
588
|
+
MatAutocompleteModule,
|
|
589
|
+
MatBadgeModule,
|
|
590
|
+
MatBottomSheetModule,
|
|
591
|
+
MatButtonModule,
|
|
592
|
+
MatButtonToggleModule,
|
|
593
|
+
MatCardModule,
|
|
594
|
+
MatCheckboxModule,
|
|
595
|
+
MatChipsModule,
|
|
596
|
+
MatStepperModule,
|
|
597
|
+
MatDatepickerModule,
|
|
598
|
+
MatDialogModule,
|
|
599
|
+
MatDividerModule,
|
|
600
|
+
MatExpansionModule,
|
|
601
|
+
MatGridListModule,
|
|
602
|
+
MatIconModule,
|
|
603
|
+
MatFormFieldModule,
|
|
604
|
+
MatInputModule,
|
|
605
|
+
MatListModule,
|
|
606
|
+
MatMenuModule,
|
|
607
|
+
MatNativeDateModule,
|
|
608
|
+
MatPaginatorModule,
|
|
609
|
+
MatProgressBarModule,
|
|
610
|
+
MatProgressSpinnerModule,
|
|
611
|
+
MatRadioModule,
|
|
612
|
+
MatRippleModule,
|
|
613
|
+
MatSelectModule,
|
|
614
|
+
MatSidenavModule,
|
|
615
|
+
MatSliderModule,
|
|
616
|
+
MatSlideToggleModule,
|
|
617
|
+
MatSnackBarModule,
|
|
618
|
+
MatSortModule,
|
|
619
|
+
MatTableModule,
|
|
620
|
+
MatTabsModule,
|
|
621
|
+
MatToolbarModule,
|
|
622
|
+
MatTooltipModule,
|
|
623
|
+
MatTreeModule,
|
|
624
|
+
PortalModule,
|
|
625
|
+
ScrollingModule] });
|
|
626
|
+
}
|
|
627
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MaterialModule, decorators: [{
|
|
628
|
+
type: NgModule,
|
|
629
|
+
args: [{
|
|
630
|
+
imports: [...MAT_MODULE],
|
|
631
|
+
exports: [...MAT_MODULE],
|
|
632
|
+
}]
|
|
633
|
+
}] });
|
|
634
|
+
|
|
635
|
+
class AngularComponentsModule {
|
|
636
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AngularComponentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
637
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: AngularComponentsModule, imports: [MaterialModule], exports: [MaterialModule] });
|
|
638
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AngularComponentsModule, imports: [MaterialModule, MaterialModule] });
|
|
639
|
+
}
|
|
640
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AngularComponentsModule, decorators: [{
|
|
641
|
+
type: NgModule,
|
|
642
|
+
args: [{
|
|
643
|
+
imports: [MaterialModule],
|
|
644
|
+
exports: [MaterialModule],
|
|
645
|
+
}]
|
|
646
|
+
}] });
|
|
647
|
+
|
|
446
648
|
class DrawerComponent {
|
|
447
649
|
_enableAnimations = false;
|
|
448
650
|
persistent = inject(APP_LAYOUT).persistent;
|
|
449
651
|
links = input(...(ngDevMode ? [undefined, { debugName: "links" }] : []));
|
|
652
|
+
/** index of the FIRST item that has children (or -1 if none) */
|
|
653
|
+
firstChildrenIndex = computed(() => {
|
|
654
|
+
const arr = this.links() ?? [];
|
|
655
|
+
return arr.findIndex((x) => !!x.children?.length);
|
|
656
|
+
}, ...(ngDevMode ? [{ debugName: "firstChildrenIndex" }] : []));
|
|
450
657
|
position = input('left', ...(ngDevMode ? [{ debugName: "position" }] : []));
|
|
451
658
|
opened = input(true, ...(ngDevMode ? [{ debugName: "opened" }] : []));
|
|
452
659
|
el = inject(ElementRef);
|
|
@@ -487,6 +694,10 @@ class DrawerComponent {
|
|
|
487
694
|
this.open();
|
|
488
695
|
}
|
|
489
696
|
}
|
|
697
|
+
isNextItemChildren(index) {
|
|
698
|
+
const items = this.links() ?? [];
|
|
699
|
+
return !!items[index + 1]?.children?.length;
|
|
700
|
+
}
|
|
490
701
|
init(isMobile) {
|
|
491
702
|
this._opened = !isMobile;
|
|
492
703
|
this.isMobile = isMobile;
|
|
@@ -524,17 +735,26 @@ class DrawerComponent {
|
|
|
524
735
|
this._enableAnimations = true;
|
|
525
736
|
}
|
|
526
737
|
}
|
|
527
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
528
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", 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 class=\"indicator-collapsed\" [class.indicator-expanded]=\"panelOpenState === true\"\n >expand_more</rolatech-icon\n >\n </div>\n <div\n class=\"flex flex-col ml-4 overflow-visible content-collapsed\"\n [class.content-expanded]=\"panelOpenState === true\"\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}.indicator-collapsed{transform:rotate(0);transition:transform 225ms cubic-bezier(.4,0,.2,1)}.indicator-expanded{transform:rotate(180deg)}.content-collapsed{max-height:0;visibility:hidden;transition:max-height 225ms cubic-bezier(.4,0,.2,1)}.content-expanded{max-height:1000px;visibility:visible}\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 }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
738
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
739
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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; let i = $index) {\n @if (item.children) {\n <div\n class=\"children-group flex cursor-pointer overflow-hidden my-3 py-3 border-y border-[--rt-border-color]\"\n [class.mb-0]=\"isNextItemChildren(i)\"\n >\n <div class=\"w-full\">\n <div class=\"flex items-center h-10\">\n <span class=\"ml-3 text-md font-bold\" i18n>{{ item.title }}</span>\n </div>\n <div class=\"flex flex-col\">\n @for (child of item.children; track child) {\n <a\n id=\"endpoint\"\n class=\"flex hover:bg-[--rt-10-percent-layer] min-h-11 rt-guide-entry\"\n [routerLink]=\"child.link\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n routerLinkActive=\"drawer-active\"\n [routerLinkActiveOptions]=\"{ exact: child.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 (child.icon) {\n <rolatech-icon class=\"ml-3\" [filled]=\"routerLink.isActive\">{{ child.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span i18n>{{ child.title }}</span>\n <span class=\"text-sm text-[--rt-text-secondary]\" i18n>{{ child.subtitle }}</span>\n </div>\n </div>\n </div>\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}.indicator-collapsed{transform:rotate(0);transition:transform 225ms cubic-bezier(.4,0,.2,1)}.indicator-expanded{transform:rotate(180deg)}.content-collapsed{max-height:0;visibility:hidden;transition:max-height 225ms cubic-bezier(.4,0,.2,1)}.content-expanded{max-height:1000px;visibility:visible}.children-group+.children-group{border-top:0;margin-top:0}\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 }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "ngmodule", type: MatDividerModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
529
740
|
}
|
|
530
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
741
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DrawerComponent, decorators: [{
|
|
531
742
|
type: Component,
|
|
532
|
-
args: [{ selector: 'rolatech-drawer', imports: [
|
|
743
|
+
args: [{ selector: 'rolatech-drawer', imports: [
|
|
744
|
+
CommonModule,
|
|
745
|
+
RouterLink,
|
|
746
|
+
RouterLinkActive,
|
|
747
|
+
IconComponent,
|
|
748
|
+
MenuIconComponent,
|
|
749
|
+
MatButtonModule,
|
|
750
|
+
AngularComponentsModule,
|
|
751
|
+
MatDividerModule,
|
|
752
|
+
], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
533
753
|
id: 'rolatech-drawer',
|
|
534
754
|
class: 'rolatech-drawer',
|
|
535
755
|
'style.transition-duration': '200ms',
|
|
536
756
|
ngSkipHydration: '',
|
|
537
|
-
}, 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 class=\"indicator-collapsed\" [class.indicator-expanded]=\"panelOpenState === true\"\n >expand_more</rolatech-icon\n >\n </div>\n <div\n class=\"flex flex-col ml-4 overflow-visible content-collapsed\"\n [class.content-expanded]=\"panelOpenState === true\"\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}.indicator-collapsed{transform:rotate(0);transition:transform 225ms cubic-bezier(.4,0,.2,1)}.indicator-expanded{transform:rotate(180deg)}.content-collapsed{max-height:0;visibility:hidden;transition:max-height 225ms cubic-bezier(.4,0,.2,1)}.content-expanded{max-height:1000px;visibility:visible}\n"] }]
|
|
757
|
+
}, 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; let i = $index) {\n @if (item.children) {\n <div\n class=\"children-group flex cursor-pointer overflow-hidden my-3 py-3 border-y border-[--rt-border-color]\"\n [class.mb-0]=\"isNextItemChildren(i)\"\n >\n <div class=\"w-full\">\n <div class=\"flex items-center h-10\">\n <span class=\"ml-3 text-md font-bold\" i18n>{{ item.title }}</span>\n </div>\n <div class=\"flex flex-col\">\n @for (child of item.children; track child) {\n <a\n id=\"endpoint\"\n class=\"flex hover:bg-[--rt-10-percent-layer] min-h-11 rt-guide-entry\"\n [routerLink]=\"child.link\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n routerLinkActive=\"drawer-active\"\n [routerLinkActiveOptions]=\"{ exact: child.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 (child.icon) {\n <rolatech-icon class=\"ml-3\" [filled]=\"routerLink.isActive\">{{ child.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span i18n>{{ child.title }}</span>\n <span class=\"text-sm text-[--rt-text-secondary]\" i18n>{{ child.subtitle }}</span>\n </div>\n </div>\n </div>\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}.indicator-collapsed{transform:rotate(0);transition:transform 225ms cubic-bezier(.4,0,.2,1)}.indicator-expanded{transform:rotate(180deg)}.content-collapsed{max-height:0;visibility:hidden;transition:max-height 225ms cubic-bezier(.4,0,.2,1)}.content-expanded{max-height:1000px;visibility:visible}.children-group+.children-group{border-top:0;margin-top:0}\n"] }]
|
|
538
758
|
}], propDecorators: { links: [{ type: i0.Input, args: [{ isSignal: true, alias: "links", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], opened: [{ type: i0.Input, args: [{ isSignal: true, alias: "opened", required: false }] }], guideEl: [{ type: i0.ViewChild, args: ['guide', { isSignal: true }] }], content: [{ type: i0.ViewChild, args: ['content', { isSignal: true }] }], scrimEl: [{ type: i0.ViewChild, args: ['scrim', { isSignal: true }] }], headerEl: [{ type: i0.ViewChild, args: ['header', { isSignal: true }] }] } });
|
|
539
759
|
|
|
540
760
|
class MiniGuideComponent {
|
|
@@ -596,10 +816,10 @@ class MiniGuideComponent {
|
|
|
596
816
|
this.open();
|
|
597
817
|
}
|
|
598
818
|
}
|
|
599
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
600
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
819
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MiniGuideComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
820
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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 });
|
|
601
821
|
}
|
|
602
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
822
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MiniGuideComponent, decorators: [{
|
|
603
823
|
type: Component,
|
|
604
824
|
args: [{ selector: 'rolatech-mini-guide', imports: [CommonModule, IconComponent, RouterLink, RouterLinkActive], encapsulation: ViewEncapsulation.None, host: {
|
|
605
825
|
id: 'rolatech-mini-guide',
|
|
@@ -612,10 +832,10 @@ class AppPageComponent {
|
|
|
612
832
|
constructor() { }
|
|
613
833
|
ngOnInit() { }
|
|
614
834
|
ngAfterContentInit() { }
|
|
615
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
616
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
835
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AppPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
836
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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 });
|
|
617
837
|
}
|
|
618
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
838
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AppPageComponent, decorators: [{
|
|
619
839
|
type: Component,
|
|
620
840
|
args: [{ selector: 'rolatech-page', imports: [CommonModule], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
621
841
|
id: 'rolatech-page',
|
|
@@ -686,10 +906,10 @@ class LayoutComponent {
|
|
|
686
906
|
this.renderer.removeAttribute(this.el.nativeElement, 'mini-guide-visible');
|
|
687
907
|
}
|
|
688
908
|
}
|
|
689
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
690
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.
|
|
909
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: LayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
910
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.1", 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<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;flex:1 1 auto}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 });
|
|
691
911
|
}
|
|
692
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
912
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: LayoutComponent, decorators: [{
|
|
693
913
|
type: Component,
|
|
694
914
|
args: [{ selector: 'rolatech-layout', imports: [CommonModule, MatListModule, MatButtonModule, MatIconModule, MatSidenavModule], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
695
915
|
id: 'rolatech-layout',
|
|
@@ -706,10 +926,10 @@ class FooterComponent {
|
|
|
706
926
|
copyright = input('', ...(ngDevMode ? [{ debugName: "copyright" }] : []));
|
|
707
927
|
fTitle = computed(() => this.title() || this.config.name, ...(ngDevMode ? [{ debugName: "fTitle" }] : []));
|
|
708
928
|
fCopyright = computed(() => this.copyright() || this.config.name, ...(ngDevMode ? [{ debugName: "fCopyright" }] : []));
|
|
709
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
710
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
929
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
930
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", 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 });
|
|
711
931
|
}
|
|
712
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
932
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FooterComponent, decorators: [{
|
|
713
933
|
type: Component,
|
|
714
934
|
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"] }]
|
|
715
935
|
}], propDecorators: { hostId: [{
|
|
@@ -721,10 +941,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
721
941
|
}], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], copyright: [{ type: i0.Input, args: [{ isSignal: true, alias: "copyright", required: false }] }] } });
|
|
722
942
|
|
|
723
943
|
class ConsoleLayoutComponent {
|
|
724
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
725
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
944
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ConsoleLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
945
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: ConsoleLayoutComponent, isStandalone: true, selector: "rolatech-console-layout", ngImport: i0, template: "<p>console-layout works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
726
946
|
}
|
|
727
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
947
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ConsoleLayoutComponent, decorators: [{
|
|
728
948
|
type: Component,
|
|
729
949
|
args: [{ selector: 'rolatech-console-layout', imports: [CommonModule], template: "<p>console-layout works!</p>\n" }]
|
|
730
950
|
}] });
|
|
@@ -737,36 +957,32 @@ class TopbarAvatarMenuComponent {
|
|
|
737
957
|
openMenu() {
|
|
738
958
|
this.menu().focusFirstItem('mouse');
|
|
739
959
|
}
|
|
740
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
741
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
960
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TopbarAvatarMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
961
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }] });
|
|
742
962
|
}
|
|
743
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
963
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TopbarAvatarMenuComponent, decorators: [{
|
|
744
964
|
type: Component,
|
|
745
965
|
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" }]
|
|
746
966
|
}], propDecorators: { menu: [{ type: i0.Input, args: [{ isSignal: true, alias: "menu", required: true }] }], avatar: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatar", required: false }] }] } });
|
|
747
967
|
|
|
748
968
|
class FolderComponent {
|
|
749
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
750
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
969
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FolderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
970
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: FolderComponent, isStandalone: true, selector: "rolatech-folder", ngImport: i0, template: "<div></div>\n", styles: [""] });
|
|
751
971
|
}
|
|
752
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
972
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FolderComponent, decorators: [{
|
|
753
973
|
type: Component,
|
|
754
974
|
args: [{ selector: 'rolatech-folder', template: "<div></div>\n" }]
|
|
755
975
|
}] });
|
|
756
976
|
|
|
757
977
|
class MediaPreviewDialogComponent {
|
|
758
|
-
data;
|
|
759
|
-
dialogRef;
|
|
760
978
|
selected;
|
|
761
979
|
index = 0;
|
|
762
980
|
prevDisabled = false;
|
|
763
981
|
nextDisabled = false;
|
|
764
|
-
|
|
765
|
-
|
|
766
|
-
this.dialogRef = dialogRef;
|
|
767
|
-
this.data.title = 'Preview';
|
|
768
|
-
}
|
|
982
|
+
data = inject(MAT_DIALOG_DATA);
|
|
983
|
+
dialogRef = inject((MatDialogRef));
|
|
769
984
|
ngOnInit() {
|
|
985
|
+
this.data.title = this.data.title || 'Preview';
|
|
770
986
|
this.selected = this.data.selected;
|
|
771
987
|
this.prevDisabled = this.selected === 0;
|
|
772
988
|
this.nextDisabled = this.selected === this.data.media.length - 1;
|
|
@@ -784,220 +1000,12 @@ class MediaPreviewDialogComponent {
|
|
|
784
1000
|
this.prevDisabled = this.selected === 0;
|
|
785
1001
|
this.nextDisabled = this.selected === this.data.media.length - 1;
|
|
786
1002
|
}
|
|
787
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
788
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1003
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MediaPreviewDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1004
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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$3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i2$4.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$2.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"] }] });
|
|
789
1005
|
}
|
|
790
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1006
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MediaPreviewDialogComponent, decorators: [{
|
|
791
1007
|
type: Component,
|
|
792
1008
|
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" }]
|
|
793
|
-
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
794
|
-
type: Inject,
|
|
795
|
-
args: [MAT_DIALOG_DATA]
|
|
796
|
-
}] }, { type: i1$4.MatDialogRef }] });
|
|
797
|
-
|
|
798
|
-
const MAT_MODULE = [
|
|
799
|
-
A11yModule,
|
|
800
|
-
ClipboardModule,
|
|
801
|
-
CdkStepperModule,
|
|
802
|
-
CdkTableModule,
|
|
803
|
-
CdkTreeModule,
|
|
804
|
-
DragDropModule,
|
|
805
|
-
LayoutModule,
|
|
806
|
-
MatAutocompleteModule,
|
|
807
|
-
MatBadgeModule,
|
|
808
|
-
MatBottomSheetModule,
|
|
809
|
-
MatButtonModule,
|
|
810
|
-
MatButtonToggleModule,
|
|
811
|
-
MatCardModule,
|
|
812
|
-
MatCheckboxModule,
|
|
813
|
-
MatChipsModule,
|
|
814
|
-
MatStepperModule,
|
|
815
|
-
MatDatepickerModule,
|
|
816
|
-
MatDialogModule,
|
|
817
|
-
MatDividerModule,
|
|
818
|
-
MatExpansionModule,
|
|
819
|
-
MatGridListModule,
|
|
820
|
-
MatIconModule,
|
|
821
|
-
MatFormFieldModule,
|
|
822
|
-
MatInputModule,
|
|
823
|
-
MatListModule,
|
|
824
|
-
MatMenuModule,
|
|
825
|
-
MatNativeDateModule,
|
|
826
|
-
MatPaginatorModule,
|
|
827
|
-
MatProgressBarModule,
|
|
828
|
-
MatProgressSpinnerModule,
|
|
829
|
-
MatRadioModule,
|
|
830
|
-
MatRippleModule,
|
|
831
|
-
MatSelectModule,
|
|
832
|
-
MatSidenavModule,
|
|
833
|
-
MatSliderModule,
|
|
834
|
-
MatSlideToggleModule,
|
|
835
|
-
MatSnackBarModule,
|
|
836
|
-
MatSortModule,
|
|
837
|
-
MatTableModule,
|
|
838
|
-
MatTabsModule,
|
|
839
|
-
MatToolbarModule,
|
|
840
|
-
MatTooltipModule,
|
|
841
|
-
MatTreeModule,
|
|
842
|
-
PortalModule,
|
|
843
|
-
ScrollingModule,
|
|
844
|
-
];
|
|
845
|
-
class MaterialModule {
|
|
846
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MaterialModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
847
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.6", ngImport: i0, type: MaterialModule, imports: [A11yModule,
|
|
848
|
-
ClipboardModule,
|
|
849
|
-
CdkStepperModule,
|
|
850
|
-
CdkTableModule,
|
|
851
|
-
CdkTreeModule,
|
|
852
|
-
DragDropModule,
|
|
853
|
-
LayoutModule,
|
|
854
|
-
MatAutocompleteModule,
|
|
855
|
-
MatBadgeModule,
|
|
856
|
-
MatBottomSheetModule,
|
|
857
|
-
MatButtonModule,
|
|
858
|
-
MatButtonToggleModule,
|
|
859
|
-
MatCardModule,
|
|
860
|
-
MatCheckboxModule,
|
|
861
|
-
MatChipsModule,
|
|
862
|
-
MatStepperModule,
|
|
863
|
-
MatDatepickerModule,
|
|
864
|
-
MatDialogModule,
|
|
865
|
-
MatDividerModule,
|
|
866
|
-
MatExpansionModule,
|
|
867
|
-
MatGridListModule,
|
|
868
|
-
MatIconModule,
|
|
869
|
-
MatFormFieldModule,
|
|
870
|
-
MatInputModule,
|
|
871
|
-
MatListModule,
|
|
872
|
-
MatMenuModule,
|
|
873
|
-
MatNativeDateModule,
|
|
874
|
-
MatPaginatorModule,
|
|
875
|
-
MatProgressBarModule,
|
|
876
|
-
MatProgressSpinnerModule,
|
|
877
|
-
MatRadioModule,
|
|
878
|
-
MatRippleModule,
|
|
879
|
-
MatSelectModule,
|
|
880
|
-
MatSidenavModule,
|
|
881
|
-
MatSliderModule,
|
|
882
|
-
MatSlideToggleModule,
|
|
883
|
-
MatSnackBarModule,
|
|
884
|
-
MatSortModule,
|
|
885
|
-
MatTableModule,
|
|
886
|
-
MatTabsModule,
|
|
887
|
-
MatToolbarModule,
|
|
888
|
-
MatTooltipModule,
|
|
889
|
-
MatTreeModule,
|
|
890
|
-
PortalModule,
|
|
891
|
-
ScrollingModule], exports: [A11yModule,
|
|
892
|
-
ClipboardModule,
|
|
893
|
-
CdkStepperModule,
|
|
894
|
-
CdkTableModule,
|
|
895
|
-
CdkTreeModule,
|
|
896
|
-
DragDropModule,
|
|
897
|
-
LayoutModule,
|
|
898
|
-
MatAutocompleteModule,
|
|
899
|
-
MatBadgeModule,
|
|
900
|
-
MatBottomSheetModule,
|
|
901
|
-
MatButtonModule,
|
|
902
|
-
MatButtonToggleModule,
|
|
903
|
-
MatCardModule,
|
|
904
|
-
MatCheckboxModule,
|
|
905
|
-
MatChipsModule,
|
|
906
|
-
MatStepperModule,
|
|
907
|
-
MatDatepickerModule,
|
|
908
|
-
MatDialogModule,
|
|
909
|
-
MatDividerModule,
|
|
910
|
-
MatExpansionModule,
|
|
911
|
-
MatGridListModule,
|
|
912
|
-
MatIconModule,
|
|
913
|
-
MatFormFieldModule,
|
|
914
|
-
MatInputModule,
|
|
915
|
-
MatListModule,
|
|
916
|
-
MatMenuModule,
|
|
917
|
-
MatNativeDateModule,
|
|
918
|
-
MatPaginatorModule,
|
|
919
|
-
MatProgressBarModule,
|
|
920
|
-
MatProgressSpinnerModule,
|
|
921
|
-
MatRadioModule,
|
|
922
|
-
MatRippleModule,
|
|
923
|
-
MatSelectModule,
|
|
924
|
-
MatSidenavModule,
|
|
925
|
-
MatSliderModule,
|
|
926
|
-
MatSlideToggleModule,
|
|
927
|
-
MatSnackBarModule,
|
|
928
|
-
MatSortModule,
|
|
929
|
-
MatTableModule,
|
|
930
|
-
MatTabsModule,
|
|
931
|
-
MatToolbarModule,
|
|
932
|
-
MatTooltipModule,
|
|
933
|
-
MatTreeModule,
|
|
934
|
-
PortalModule,
|
|
935
|
-
ScrollingModule] });
|
|
936
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MaterialModule, imports: [MAT_MODULE, A11yModule,
|
|
937
|
-
ClipboardModule,
|
|
938
|
-
CdkStepperModule,
|
|
939
|
-
CdkTableModule,
|
|
940
|
-
CdkTreeModule,
|
|
941
|
-
DragDropModule,
|
|
942
|
-
LayoutModule,
|
|
943
|
-
MatAutocompleteModule,
|
|
944
|
-
MatBadgeModule,
|
|
945
|
-
MatBottomSheetModule,
|
|
946
|
-
MatButtonModule,
|
|
947
|
-
MatButtonToggleModule,
|
|
948
|
-
MatCardModule,
|
|
949
|
-
MatCheckboxModule,
|
|
950
|
-
MatChipsModule,
|
|
951
|
-
MatStepperModule,
|
|
952
|
-
MatDatepickerModule,
|
|
953
|
-
MatDialogModule,
|
|
954
|
-
MatDividerModule,
|
|
955
|
-
MatExpansionModule,
|
|
956
|
-
MatGridListModule,
|
|
957
|
-
MatIconModule,
|
|
958
|
-
MatFormFieldModule,
|
|
959
|
-
MatInputModule,
|
|
960
|
-
MatListModule,
|
|
961
|
-
MatMenuModule,
|
|
962
|
-
MatNativeDateModule,
|
|
963
|
-
MatPaginatorModule,
|
|
964
|
-
MatProgressBarModule,
|
|
965
|
-
MatProgressSpinnerModule,
|
|
966
|
-
MatRadioModule,
|
|
967
|
-
MatRippleModule,
|
|
968
|
-
MatSelectModule,
|
|
969
|
-
MatSidenavModule,
|
|
970
|
-
MatSliderModule,
|
|
971
|
-
MatSlideToggleModule,
|
|
972
|
-
MatSnackBarModule,
|
|
973
|
-
MatSortModule,
|
|
974
|
-
MatTableModule,
|
|
975
|
-
MatTabsModule,
|
|
976
|
-
MatToolbarModule,
|
|
977
|
-
MatTooltipModule,
|
|
978
|
-
MatTreeModule,
|
|
979
|
-
PortalModule,
|
|
980
|
-
ScrollingModule] });
|
|
981
|
-
}
|
|
982
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MaterialModule, decorators: [{
|
|
983
|
-
type: NgModule,
|
|
984
|
-
args: [{
|
|
985
|
-
imports: [...MAT_MODULE],
|
|
986
|
-
exports: [...MAT_MODULE],
|
|
987
|
-
}]
|
|
988
|
-
}] });
|
|
989
|
-
|
|
990
|
-
class AngularComponentsModule {
|
|
991
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AngularComponentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
992
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.6", ngImport: i0, type: AngularComponentsModule, imports: [MaterialModule], exports: [MaterialModule] });
|
|
993
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AngularComponentsModule, imports: [MaterialModule, MaterialModule] });
|
|
994
|
-
}
|
|
995
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AngularComponentsModule, decorators: [{
|
|
996
|
-
type: NgModule,
|
|
997
|
-
args: [{
|
|
998
|
-
imports: [MaterialModule],
|
|
999
|
-
exports: [MaterialModule],
|
|
1000
|
-
}]
|
|
1001
1009
|
}] });
|
|
1002
1010
|
|
|
1003
1011
|
class SpinnerComponent {
|
|
@@ -1019,10 +1027,10 @@ class SpinnerComponent {
|
|
|
1019
1027
|
if (this.loadingSubscription)
|
|
1020
1028
|
this.loadingSubscription.unsubscribe();
|
|
1021
1029
|
}
|
|
1022
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1023
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
1030
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1031
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", 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 }] });
|
|
1024
1032
|
}
|
|
1025
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1033
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SpinnerComponent, decorators: [{
|
|
1026
1034
|
type: Component,
|
|
1027
1035
|
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"] }]
|
|
1028
1036
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }] } });
|
|
@@ -1069,10 +1077,10 @@ class MediaUploadComponent {
|
|
|
1069
1077
|
};
|
|
1070
1078
|
}
|
|
1071
1079
|
}
|
|
1072
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1073
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1080
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MediaUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1081
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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: i1$2.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$3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }] });
|
|
1074
1082
|
}
|
|
1075
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1083
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MediaUploadComponent, decorators: [{
|
|
1076
1084
|
type: Component,
|
|
1077
1085
|
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"] }]
|
|
1078
1086
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }], isUploading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isUploading", required: false }] }], mediaItemClick: [{ type: i0.Output, args: ["mediaItemClick"] }], upload: [{ type: i0.Output, args: ["upload"] }] } });
|
|
@@ -1084,10 +1092,10 @@ class StorageBucketCreateComponent {
|
|
|
1084
1092
|
ngDoCheck() {
|
|
1085
1093
|
this.output.emit(this.name());
|
|
1086
1094
|
}
|
|
1087
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1088
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
1095
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: StorageBucketCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1096
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", 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.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$1.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: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
1089
1097
|
}
|
|
1090
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1098
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: StorageBucketCreateComponent, decorators: [{
|
|
1091
1099
|
type: Component,
|
|
1092
1100
|
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"] }]
|
|
1093
1101
|
}], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], output: [{ type: i0.Output, args: ["output"] }] } });
|
|
@@ -1115,10 +1123,10 @@ class StorageFileUploadComponent {
|
|
|
1115
1123
|
removeFile() {
|
|
1116
1124
|
this.file = null;
|
|
1117
1125
|
}
|
|
1118
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1119
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1126
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: StorageFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1127
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$1.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: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$2.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: i1$2.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$3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
|
|
1120
1128
|
}
|
|
1121
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1129
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: StorageFileUploadComponent, decorators: [{
|
|
1122
1130
|
type: Component,
|
|
1123
1131
|
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"] }]
|
|
1124
1132
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], output: [{ type: i0.Output, args: ["output"] }] } });
|
|
@@ -1131,10 +1139,10 @@ class StorageFolderCreateComponent {
|
|
|
1131
1139
|
ngDoCheck() {
|
|
1132
1140
|
this.output.emit({ name: this.name(), isPublic: this.isPublic() });
|
|
1133
1141
|
}
|
|
1134
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1135
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
1142
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: StorageFolderCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1143
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", 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.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$1.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: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i4.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"] }] });
|
|
1136
1144
|
}
|
|
1137
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1145
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: StorageFolderCreateComponent, decorators: [{
|
|
1138
1146
|
type: Component,
|
|
1139
1147
|
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"] }]
|
|
1140
1148
|
}], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], isPublic: [{ type: i0.Input, args: [{ isSignal: true, alias: "isPublic", required: false }] }], output: [{ type: i0.Output, args: ["output"] }] } });
|
|
@@ -1153,10 +1161,10 @@ class MenuUserComponent {
|
|
|
1153
1161
|
// this.data = this.user();
|
|
1154
1162
|
// });
|
|
1155
1163
|
}
|
|
1156
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1157
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1164
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MenuUserComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1165
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1158
1166
|
}
|
|
1159
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1167
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MenuUserComponent, decorators: [{
|
|
1160
1168
|
type: Component,
|
|
1161
1169
|
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"] }]
|
|
1162
1170
|
}], ctorParameters: () => [], propDecorators: { user: [{ type: i0.Input, args: [{ isSignal: true, alias: "user", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }] } });
|
|
@@ -1188,10 +1196,10 @@ class WechatConnectDialogComponent {
|
|
|
1188
1196
|
this.dialogRef.close();
|
|
1189
1197
|
}
|
|
1190
1198
|
}
|
|
1191
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1192
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1199
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: WechatConnectDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1200
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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"] });
|
|
1193
1201
|
}
|
|
1194
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1202
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: WechatConnectDialogComponent, decorators: [{
|
|
1195
1203
|
type: Component,
|
|
1196
1204
|
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"] }]
|
|
1197
1205
|
}], ctorParameters: () => [], propDecorators: { appId: [{ type: i0.Input, args: [{ isSignal: true, alias: "appId", required: false }] }, { type: i0.Output, args: ["appIdChange"] }], redirectUri: [{ type: i0.Input, args: [{ isSignal: true, alias: "redirectUri", required: false }] }, { type: i0.Output, args: ["redirectUriChange"] }], state: [{ type: i0.Input, args: [{ isSignal: true, alias: "state", required: false }] }, { type: i0.Output, args: ["stateChange"] }], onLogin: [{
|
|
@@ -1200,20 +1208,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
1200
1208
|
}] } });
|
|
1201
1209
|
|
|
1202
1210
|
class MediaUploadDialogComponent {
|
|
1203
|
-
dialogRef;
|
|
1204
|
-
data;
|
|
1205
|
-
mediaService;
|
|
1206
1211
|
fileData;
|
|
1207
1212
|
progressInfos = [];
|
|
1208
1213
|
media = [];
|
|
1209
1214
|
preMedia = [];
|
|
1210
1215
|
isFinished = false;
|
|
1211
1216
|
isUploaded = false;
|
|
1212
|
-
|
|
1213
|
-
|
|
1214
|
-
|
|
1215
|
-
this.mediaService = mediaService;
|
|
1216
|
-
}
|
|
1217
|
+
dialogRef = inject((MatDialogRef));
|
|
1218
|
+
data = inject(MAT_DIALOG_DATA);
|
|
1219
|
+
mediaService = inject(MediaService);
|
|
1217
1220
|
ngOnInit() { }
|
|
1218
1221
|
selectFiles(event) {
|
|
1219
1222
|
this.isFinished = false;
|
|
@@ -1268,16 +1271,13 @@ class MediaUploadDialogComponent {
|
|
|
1268
1271
|
},
|
|
1269
1272
|
});
|
|
1270
1273
|
}
|
|
1271
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1272
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1274
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MediaUploadDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1275
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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: i1$2.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: i3.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"] }] });
|
|
1273
1276
|
}
|
|
1274
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1277
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MediaUploadDialogComponent, decorators: [{
|
|
1275
1278
|
type: Component,
|
|
1276
1279
|
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"] }]
|
|
1277
|
-
}]
|
|
1278
|
-
type: Inject,
|
|
1279
|
-
args: [MAT_DIALOG_DATA]
|
|
1280
|
-
}] }, { type: i2$4.MediaService }] });
|
|
1280
|
+
}] });
|
|
1281
1281
|
|
|
1282
1282
|
class MediaListComponent {
|
|
1283
1283
|
isUploading = input(...(ngDevMode ? [undefined, { debugName: "isUploading" }] : []));
|
|
@@ -1291,10 +1291,10 @@ class MediaListComponent {
|
|
|
1291
1291
|
onUpload(event) {
|
|
1292
1292
|
this.upload.emit(event);
|
|
1293
1293
|
}
|
|
1294
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1295
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1294
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MediaListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1295
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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" }, host: { attributes: { "id": "rolatech-media-list" }, classAttribute: "rolatech-media-list" }, ngImport: i0, template: "<div class=\"flex flex-row flex-wrap box-border items-center\">\n <div class=\"flex flex-row flex-wrap box-border items-center w-full\">\n <ng-content></ng-content>\n @if (showAdd()) {\n <div class=\"upload-button\">\n @if (!isUploading()) {\n <div\n class=\"flex flex-col items-center justify-center border border-[--rt-border-color] border-dashed rounded-md aspect-video cursor-pointer\"\n (click)=\"fileInput.click()\"\n >\n <input\n style=\"display: none\"\n type=\"file\"\n accept=\"image/*, video/*\"\n (change)=\"onUpload($event)\"\n #fileInput\n multiple\n />\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 } @else {\n <div class=\"w-full py-1\">\n <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n </div>\n }\n </div>\n }\n </div>\n</div>\n", styles: ["rolatech-media-list{--rt-media-items-per-row: 1;--rt-media-item-margin: 16px}rolatech-media-list-item:before{border-radius:12px}.upload-button{margin-left:calc(var(--rt-media-item-margin) / 2);margin-right:calc(var(--rt-media-item-margin) / 2);margin-bottom:var(--rt-media-item-margin);width:calc(100% / var(--rt-media-items-per-row) - var(--rt-media-item-margin))}rolatech-media-list:not([list]){--rt-media-items-per-row: 2}rolatech-media-list:not([list]) rolatech-media-list-item{margin-bottom:16px}@media(min-width:600px){rolatech-media-list:not([list]){--rt-media-items-per-row: 2}}@media(min-width:768px){rolatech-media-list:not([list]){--rt-media-items-per-row: 2}}@media(min-width:1280px){rolatech-media-list:not([list]){--rt-media-items-per-row: 3}}@media(min-width:1536px){rolatech-media-list:not([list]){--rt-media-items-per-row: 4}}@media(min-width:1920px){rolatech-media-list:not([list]){--rt-media-items-per-row: 5}}\n"], dependencies: [{ kind: "ngmodule", type: MatProgressBarModule }, { kind: "component", type: i1$3.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1296
1296
|
}
|
|
1297
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1297
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MediaListComponent, decorators: [{
|
|
1298
1298
|
type: Component,
|
|
1299
1299
|
args: [{ selector: 'rolatech-media-list', imports: [MatProgressBarModule], encapsulation: ViewEncapsulation.None, host: {
|
|
1300
1300
|
id: 'rolatech-media-list',
|
|
@@ -1314,10 +1314,10 @@ class MediaListItemComponent {
|
|
|
1314
1314
|
onDeleteMedia(media) {
|
|
1315
1315
|
this.deleteMedia.emit(media);
|
|
1316
1316
|
}
|
|
1317
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1318
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1317
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MediaListItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1318
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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" }, host: { attributes: { "id": "rolatech-media-list-item" }, classAttribute: "rolatech-media-list-item" }, ngImport: i0, template: "<div\n class=\"group media-list-item rounded-md 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: ["rolatech-media-list-item{--rt-media-item-margin: 16px;margin-left:calc(var(--rt-media-item-margin) / 2);margin-right:calc(var(--rt-media-item-margin) / 2);width:calc(100% / var(--rt-media-items-per-row) - var(--rt-media-item-margin))}.media-list-item{cursor:pointer;width:100%;aspect-ratio:16/9}.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}rolatech-media-list-item{--rt-media-item-margin: 16px;display:flex;position:relative;cursor:pointer;flex-direction:column;margin-left:calc(var(--rt-media-item-margin) / 2);margin-right:calc(var(--rt-media-item-margin) / 2);width:calc(100% / var(--rt-media-items-per-row) - var(--rt-media-item-margin))}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$2.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$2.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$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i2$2.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$3.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"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1319
1319
|
}
|
|
1320
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1320
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MediaListItemComponent, decorators: [{
|
|
1321
1321
|
type: Component,
|
|
1322
1322
|
args: [{ selector: 'rolatech-media-list-item', imports: [MatButtonModule, MatMenuModule, MatIconModule, MatProgressBar], encapsulation: ViewEncapsulation.None, host: {
|
|
1323
1323
|
id: 'rolatech-media-list-item',
|
|
@@ -1342,10 +1342,10 @@ class NotFoundComponent {
|
|
|
1342
1342
|
}
|
|
1343
1343
|
});
|
|
1344
1344
|
}
|
|
1345
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1346
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
1345
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: NotFoundComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1346
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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"] });
|
|
1347
1347
|
}
|
|
1348
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1348
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: NotFoundComponent, decorators: [{
|
|
1349
1349
|
type: Component,
|
|
1350
1350
|
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"] }]
|
|
1351
1351
|
}], ctorParameters: () => [] });
|
|
@@ -1356,10 +1356,10 @@ class ConfirmationDialogComponent {
|
|
|
1356
1356
|
onNoClick() {
|
|
1357
1357
|
this.dialogRef.close();
|
|
1358
1358
|
}
|
|
1359
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1360
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1359
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ConfirmationDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1360
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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: i1$2.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"] }] });
|
|
1361
1361
|
}
|
|
1362
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1362
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ConfirmationDialogComponent, decorators: [{
|
|
1363
1363
|
type: Component,
|
|
1364
1364
|
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" }]
|
|
1365
1365
|
}] });
|
|
@@ -1437,29 +1437,29 @@ class LocationSelectorComponent {
|
|
|
1437
1437
|
});
|
|
1438
1438
|
}
|
|
1439
1439
|
selectionChange(event) { }
|
|
1440
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1441
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1440
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: LocationSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1441
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2.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: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$1.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$3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }] });
|
|
1442
1442
|
}
|
|
1443
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1443
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: LocationSelectorComponent, decorators: [{
|
|
1444
1444
|
type: Component,
|
|
1445
1445
|
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"] }]
|
|
1446
1446
|
}], propDecorators: { output: [{ type: i0.Output, args: ["output"] }] } });
|
|
1447
1447
|
|
|
1448
1448
|
class FilterComponent {
|
|
1449
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1450
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
1449
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1450
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: FilterComponent, isStandalone: true, selector: "rolatech-filter", ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
1451
1451
|
}
|
|
1452
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1452
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FilterComponent, decorators: [{
|
|
1453
1453
|
type: Component,
|
|
1454
1454
|
args: [{ selector: 'rolatech-filter', imports: [CommonModule], template: "<ng-content></ng-content>\n" }]
|
|
1455
1455
|
}] });
|
|
1456
1456
|
|
|
1457
1457
|
class ConfirmationComponent {
|
|
1458
1458
|
message = model(...(ngDevMode ? [undefined, { debugName: "message" }] : []));
|
|
1459
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1460
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
1459
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ConfirmationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1460
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", 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 }] });
|
|
1461
1461
|
}
|
|
1462
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1462
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ConfirmationComponent, decorators: [{
|
|
1463
1463
|
type: Component,
|
|
1464
1464
|
args: [{ selector: 'rolatech-confirmation', imports: [CommonModule], template: "<div>\n {{ message() }}\n</div>\n" }]
|
|
1465
1465
|
}], propDecorators: { message: [{ type: i0.Input, args: [{ isSignal: true, alias: "message", required: false }] }, { type: i0.Output, args: ["messageChange"] }] } });
|
|
@@ -1498,10 +1498,10 @@ class SearchIcon {
|
|
|
1498
1498
|
if (this.open())
|
|
1499
1499
|
this.close();
|
|
1500
1500
|
}
|
|
1501
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1502
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1501
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SearchIcon, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1502
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: SearchIcon, isStandalone: true, selector: "rolatech-search-icon", inputs: { placeholder: "placeholder", param: "param" }, host: { listeners: { "document:keydown.escape": "onDocEsc()" } }, viewQueries: [{ propertyName: "qInput", first: true, predicate: ["qInput"], descendants: true }], ngImport: i0, template: "<div\n class=\"absolute right-0 top-1/2 -translate-y-1/2 z-50 flex items-center gap-2 h-9 px-2 rounded-md border border-transparent bg-transparent shadow-none transition-all duration-300 ease-out\"\n [ngClass]=\"{\n 'w-9': !open(),\n 'w-[min(92vw,520px)]': open(),\n 'bg-black/80': open(),\n 'border-white/50': open(),\n 'shadow-lg': open()\n }\"\n (keydown.escape)=\"close()\"\n>\n <!-- leading icon -->\n <!-- <svg class=\"w-5 h-5 text-white/90 shrink-0\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M21 21l-4.35-4.35m1.1-5.4a7.5 7.5 0 11-15 0 7.5 7.5 0 0115 0z\" />\n </svg> -->\n <mat-icon>search</mat-icon>\n\n <!-- input -->\n <input\n #qInput\n class=\"border-0 outline-none bg-transparent text-white text-sm transition-all duration-300 ease-out\"\n [ngClass]=\"{\n 'w-0 opacity-0': !open(),\n 'w-full opacity-100': open()\n }\"\n [placeholder]=\"placeholder\"\n [value]=\"model.q ?? ''\"\n (input)=\"onInput($event)\"\n (keydown.enter)=\"submit()\"\n />\n\n <!-- clear -->\n @if (open() && (model.q?.length ?? 0) > 0) {\n <button\n type=\"button\"\n class=\"min-w-0 w-8 h-8 grid place-items-center rounded-full hover:bg-white/10\"\n (click)=\"clear()\"\n aria-label=\"Clear\"\n >\n <!-- <svg class=\"w-4 h-4 text-white/80\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18L18 6M6 6l12 12\" />\n </svg> -->\n <mat-icon>search</mat-icon>\n </button>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
1503
1503
|
}
|
|
1504
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1504
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SearchIcon, decorators: [{
|
|
1505
1505
|
type: Component,
|
|
1506
1506
|
args: [{ selector: 'rolatech-search-icon', imports: [MatButtonModule, MatIcon, CommonModule], template: "<div\n class=\"absolute right-0 top-1/2 -translate-y-1/2 z-50 flex items-center gap-2 h-9 px-2 rounded-md border border-transparent bg-transparent shadow-none transition-all duration-300 ease-out\"\n [ngClass]=\"{\n 'w-9': !open(),\n 'w-[min(92vw,520px)]': open(),\n 'bg-black/80': open(),\n 'border-white/50': open(),\n 'shadow-lg': open()\n }\"\n (keydown.escape)=\"close()\"\n>\n <!-- leading icon -->\n <!-- <svg class=\"w-5 h-5 text-white/90 shrink-0\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M21 21l-4.35-4.35m1.1-5.4a7.5 7.5 0 11-15 0 7.5 7.5 0 0115 0z\" />\n </svg> -->\n <mat-icon>search</mat-icon>\n\n <!-- input -->\n <input\n #qInput\n class=\"border-0 outline-none bg-transparent text-white text-sm transition-all duration-300 ease-out\"\n [ngClass]=\"{\n 'w-0 opacity-0': !open(),\n 'w-full opacity-100': open()\n }\"\n [placeholder]=\"placeholder\"\n [value]=\"model.q ?? ''\"\n (input)=\"onInput($event)\"\n (keydown.enter)=\"submit()\"\n />\n\n <!-- clear -->\n @if (open() && (model.q?.length ?? 0) > 0) {\n <button\n type=\"button\"\n class=\"min-w-0 w-8 h-8 grid place-items-center rounded-full hover:bg-white/10\"\n (click)=\"clear()\"\n aria-label=\"Clear\"\n >\n <!-- <svg class=\"w-4 h-4 text-white/80\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18L18 6M6 6l12 12\" />\n </svg> -->\n <mat-icon>search</mat-icon>\n </button>\n }\n</div>\n" }]
|
|
1507
1507
|
}], propDecorators: { placeholder: [{
|
|
@@ -1517,6 +1517,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
1517
1517
|
}] } });
|
|
1518
1518
|
|
|
1519
1519
|
class SearchBar {
|
|
1520
|
+
placeholder = input('Search...', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
|
|
1520
1521
|
show = model(false, ...(ngDevMode ? [{ debugName: "show" }] : []));
|
|
1521
1522
|
search = output();
|
|
1522
1523
|
close = output();
|
|
@@ -1550,13 +1551,13 @@ class SearchBar {
|
|
|
1550
1551
|
onCompositionEnd() {
|
|
1551
1552
|
this.isComposing = false;
|
|
1552
1553
|
}
|
|
1553
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1554
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1554
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SearchBar, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1555
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: SearchBar, isStandalone: true, selector: "rolatech-search-bar", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, show: { classPropertyName: "show", publicName: "show", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { show: "showChange", search: "search", close: "close" }, viewQueries: [{ propertyName: "qInput", first: true, predicate: ["qInput"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (show()) {\n<div class=\"p-2 flex flex-row items-center justify-between\" animate.enter=\"expanded\">\n <mat-form-field appearance=\"fill\" class=\"w-full\" subscriptSizing=\"dynamic\">\n <mat-icon matPrefix>search</mat-icon>\n <input\n #qInput\n matInput\n [placeholder]=\"placeholder()\"\n [(ngModel)]=\"text\"\n (keydown)=\"onKeydown($event)\"\n (compositionstart)=\"onCompositionStart()\"\n (compositionend)=\"onCompositionEnd()\"\n />\n @if (qInput.value.length) {\n <button matSuffix mat-icon-button type=\"button\" (click)=\"onClose()\">\n <mat-icon>close</mat-icon>\n </button>\n }\n </mat-form-field>\n</div>\n}\n", styles: [".collapsed{transition:.5s cubic-bezier(.4,0,.2,1);height:\"0px\";min-height:\"0\"}.expanded{transition:.5s cubic-bezier(.4,0,.2,1);height:fit-content}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$2.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"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$1.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: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
1555
1556
|
}
|
|
1556
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1557
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SearchBar, decorators: [{
|
|
1557
1558
|
type: Component,
|
|
1558
|
-
args: [{ selector: 'rolatech-search-bar', imports: [MatButtonModule, MatIcon, MatFormFieldModule, MatInputModule, FormsModule], template: "@if (show()) {\n<div class=\"p-2 flex flex-row items-center justify-between\" animate.enter=\"expanded\">\n <mat-form-field appearance=\"fill\" class=\"w-full\" subscriptSizing=\"dynamic\">\n <mat-icon matPrefix>search</mat-icon>\n <input\n #qInput\n matInput\n placeholder=\"
|
|
1559
|
-
}], ctorParameters: () => [], propDecorators: { show: [{ type: i0.Input, args: [{ isSignal: true, alias: "show", required: false }] }, { type: i0.Output, args: ["showChange"] }], search: [{ type: i0.Output, args: ["search"] }], close: [{ type: i0.Output, args: ["close"] }], qInput: [{ type: i0.ViewChild, args: ['qInput', { isSignal: true }] }] } });
|
|
1559
|
+
args: [{ selector: 'rolatech-search-bar', imports: [MatButtonModule, MatIcon, MatFormFieldModule, MatInputModule, FormsModule], template: "@if (show()) {\n<div class=\"p-2 flex flex-row items-center justify-between\" animate.enter=\"expanded\">\n <mat-form-field appearance=\"fill\" class=\"w-full\" subscriptSizing=\"dynamic\">\n <mat-icon matPrefix>search</mat-icon>\n <input\n #qInput\n matInput\n [placeholder]=\"placeholder()\"\n [(ngModel)]=\"text\"\n (keydown)=\"onKeydown($event)\"\n (compositionstart)=\"onCompositionStart()\"\n (compositionend)=\"onCompositionEnd()\"\n />\n @if (qInput.value.length) {\n <button matSuffix mat-icon-button type=\"button\" (click)=\"onClose()\">\n <mat-icon>close</mat-icon>\n </button>\n }\n </mat-form-field>\n</div>\n}\n", styles: [".collapsed{transition:.5s cubic-bezier(.4,0,.2,1);height:\"0px\";min-height:\"0\"}.expanded{transition:.5s cubic-bezier(.4,0,.2,1);height:fit-content}\n"] }]
|
|
1560
|
+
}], ctorParameters: () => [], propDecorators: { placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], show: [{ type: i0.Input, args: [{ isSignal: true, alias: "show", required: false }] }, { type: i0.Output, args: ["showChange"] }], search: [{ type: i0.Output, args: ["search"] }], close: [{ type: i0.Output, args: ["close"] }], qInput: [{ type: i0.ViewChild, args: ['qInput', { isSignal: true }] }] } });
|
|
1560
1561
|
|
|
1561
1562
|
class BaseComponent {
|
|
1562
1563
|
platformId = inject(PLATFORM_ID);
|
|
@@ -1580,10 +1581,10 @@ class Loading extends BaseComponent {
|
|
|
1580
1581
|
get loading() {
|
|
1581
1582
|
return this.loadingSignal;
|
|
1582
1583
|
}
|
|
1583
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1584
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.
|
|
1584
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: Loading, deps: null, target: i0.ɵɵFactoryTarget.Directive });
|
|
1585
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: Loading, isStandalone: true, inputs: { loading: "loading" }, usesInheritance: true, ngImport: i0 });
|
|
1585
1586
|
}
|
|
1586
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1587
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: Loading, decorators: [{
|
|
1587
1588
|
type: Directive
|
|
1588
1589
|
}], propDecorators: { loading: [{
|
|
1589
1590
|
type: Input
|
|
@@ -1595,10 +1596,10 @@ class TableComponent {
|
|
|
1595
1596
|
ngOnInit() {
|
|
1596
1597
|
this.displayedColumns = map$1(this.dataSource().columns, 'ref');
|
|
1597
1598
|
}
|
|
1598
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1599
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1599
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1600
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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 }] });
|
|
1600
1601
|
}
|
|
1601
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1602
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TableComponent, decorators: [{
|
|
1602
1603
|
type: Component,
|
|
1603
1604
|
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" }]
|
|
1604
1605
|
}], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }] } });
|
|
@@ -1606,19 +1607,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
1606
1607
|
class PaginatorComponent {
|
|
1607
1608
|
prevClick() { }
|
|
1608
1609
|
nextClick() { }
|
|
1609
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1610
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
1610
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: PaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1611
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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: i1$2.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$3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1611
1612
|
}
|
|
1612
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1613
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: PaginatorComponent, decorators: [{
|
|
1613
1614
|
type: Component,
|
|
1614
1615
|
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" }]
|
|
1615
1616
|
}] });
|
|
1616
1617
|
|
|
1617
1618
|
class MediaPreviewComponent {
|
|
1618
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1619
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
1619
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MediaPreviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1620
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: MediaPreviewComponent, isStandalone: true, selector: "rolatech-media-preview", ngImport: i0, template: "<p>media-preview works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
1620
1621
|
}
|
|
1621
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1622
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MediaPreviewComponent, decorators: [{
|
|
1622
1623
|
type: Component,
|
|
1623
1624
|
args: [{ selector: 'rolatech-media-preview', imports: [CommonModule], template: "<p>media-preview works!</p>\n" }]
|
|
1624
1625
|
}] });
|
|
@@ -1632,10 +1633,10 @@ class ToolbarComponent {
|
|
|
1632
1633
|
link = input('', ...(ngDevMode ? [{ debugName: "link" }] : []));
|
|
1633
1634
|
large = input(false, { ...(ngDevMode ? { debugName: "large" } : {}), transform: booleanAttribute });
|
|
1634
1635
|
divider = input(false, { ...(ngDevMode ? { debugName: "divider" } : {}), transform: booleanAttribute });
|
|
1635
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1636
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1636
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1637
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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$1.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 });
|
|
1637
1638
|
}
|
|
1638
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1639
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ToolbarComponent, decorators: [{
|
|
1639
1640
|
type: Component,
|
|
1640
1641
|
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"] }]
|
|
1641
1642
|
}], propDecorators: { hasId: [{
|
|
@@ -1659,13 +1660,21 @@ class ThumbnailComponent {
|
|
|
1659
1660
|
height = input(...(ngDevMode ? [undefined, { debugName: "height" }] : []));
|
|
1660
1661
|
renderer = inject(Renderer2);
|
|
1661
1662
|
sizea = effect(() => {
|
|
1662
|
-
|
|
1663
|
+
const size = this.size();
|
|
1664
|
+
if (size) {
|
|
1665
|
+
this.renderer.setAttribute(this.el.nativeElement, 'size', size);
|
|
1666
|
+
}
|
|
1667
|
+
else {
|
|
1668
|
+
this.renderer.removeAttribute(this.el.nativeElement, 'size');
|
|
1669
|
+
}
|
|
1663
1670
|
}, ...(ngDevMode ? [{ debugName: "sizea" }] : []));
|
|
1664
1671
|
full = effect(() => {
|
|
1665
1672
|
this.renderer.setAttribute(this.el.nativeElement, 'mode', this.mode());
|
|
1666
1673
|
if (this.mode() === 'full') {
|
|
1667
|
-
|
|
1668
|
-
|
|
1674
|
+
const width = this.width();
|
|
1675
|
+
const height = this.height();
|
|
1676
|
+
if (width && height) {
|
|
1677
|
+
this.renderer.setStyle(this.el.nativeElement, 'aspect-ratio', width / height);
|
|
1669
1678
|
}
|
|
1670
1679
|
else {
|
|
1671
1680
|
if (this.ratio() == 'square') {
|
|
@@ -1680,10 +1689,10 @@ class ThumbnailComponent {
|
|
|
1680
1689
|
ratioSet = effect(() => {
|
|
1681
1690
|
this.renderer.setAttribute(this.el.nativeElement, 'ratio', this.ratio());
|
|
1682
1691
|
}, ...(ngDevMode ? [{ debugName: "ratioSet" }] : []));
|
|
1683
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1684
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1692
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ThumbnailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1693
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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)]] });
|
|
1685
1694
|
}
|
|
1686
|
-
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "21.
|
|
1695
|
+
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "21.1.1", ngImport: i0, type: ThumbnailComponent, resolveDeferredDeps: () => [Promise.resolve().then(function () { return image_component; }).then(m => m.ImageComponent)], resolveMetadata: ImageComponent => ({ decorators: [{
|
|
1687
1696
|
type: Component,
|
|
1688
1697
|
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"] }]
|
|
1689
1698
|
}], ctorParameters: null, propDecorators: { hasClass: [{
|
|
@@ -1710,10 +1719,10 @@ class ImageComponent {
|
|
|
1710
1719
|
image.style.visibility = 'visible';
|
|
1711
1720
|
};
|
|
1712
1721
|
}
|
|
1713
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1714
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.
|
|
1722
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ImageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1723
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.1", 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 });
|
|
1715
1724
|
}
|
|
1716
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1725
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ImageComponent, decorators: [{
|
|
1717
1726
|
type: Component,
|
|
1718
1727
|
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"] }]
|
|
1719
1728
|
}], propDecorators: { hasId: [{
|
|
@@ -1734,10 +1743,10 @@ class TabComponent {
|
|
|
1734
1743
|
hasClass = true;
|
|
1735
1744
|
label = input.required(...(ngDevMode ? [{ debugName: "label" }] : []));
|
|
1736
1745
|
item = viewChild('content', ...(ngDevMode ? [{ debugName: "item" }] : []));
|
|
1737
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1738
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.
|
|
1746
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1747
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.1", 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;background-color:var(--rt-raised-background);border-radius:12px;margin-left:8px;font-weight:700}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 });
|
|
1739
1748
|
}
|
|
1740
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1749
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TabComponent, decorators: [{
|
|
1741
1750
|
type: Component,
|
|
1742
1751
|
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;background-color:var(--rt-raised-background);border-radius:12px;margin-left:8px;font-weight:700}rolatech-tab:hover{background-color:var(--rt-tab-hover-background-color, rgb(243, 244, 246))}\n"] }]
|
|
1743
1752
|
}], propDecorators: { hasId: [{
|
|
@@ -1798,24 +1807,24 @@ class TabsComponent {
|
|
|
1798
1807
|
}
|
|
1799
1808
|
return offset;
|
|
1800
1809
|
}
|
|
1801
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1802
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1810
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1811
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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 }, block: { classPropertyName: "block", publicName: "block", 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\n id=\"tabsContainer\"\n class=\"h-full flex gap-2 overflow-x-auto whitespace-nowrap pb-1 [-webkit-overflow-scrolling:touch] scrollbar-hide\"\n>\n <div id=\"tabsContent\" class=\"flex flex-row h-full\" style-target=\"selection-bar\">\n @if (!block()) {\n <div #selectionBar id=\"selectionBar\" class=\"selection-bar\"></div>\n }\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%}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
1803
1812
|
}
|
|
1804
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1813
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TabsComponent, decorators: [{
|
|
1805
1814
|
type: Component,
|
|
1806
1815
|
args: [{ selector: 'rolatech-tabs', imports: [CommonModule], encapsulation: ViewEncapsulation.None, host: {
|
|
1807
1816
|
ngSkipHydration: '',
|
|
1808
1817
|
class: 'rolatech-tabs',
|
|
1809
|
-
}, template: "<!-- <rolatech-icon-button>chevron_left</rolatech-icon-button> -->\n<div
|
|
1818
|
+
}, template: "<!-- <rolatech-icon-button>chevron_left</rolatech-icon-button> -->\n<div\n id=\"tabsContainer\"\n class=\"h-full flex gap-2 overflow-x-auto whitespace-nowrap pb-1 [-webkit-overflow-scrolling:touch] scrollbar-hide\"\n>\n <div id=\"tabsContent\" class=\"flex flex-row h-full\" style-target=\"selection-bar\">\n @if (!block()) {\n <div #selectionBar id=\"selectionBar\" class=\"selection-bar\"></div>\n }\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%}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"] }]
|
|
1810
1819
|
}], propDecorators: { tabs: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => TabComponent), { ...{ read: ElementRef }, isSignal: true }] }], selectionBar: [{ type: i0.ViewChild, args: ['selectionBar', { ...{ read: ElementRef }, isSignal: true }] }], select: [{ type: i0.Input, args: [{ isSignal: true, alias: "select", required: false }] }, { type: i0.Output, args: ["selectChange"] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], block: [{ type: i0.Input, args: [{ isSignal: true, alias: "block", required: false }] }] } });
|
|
1811
1820
|
|
|
1812
1821
|
class ListComponent {
|
|
1813
1822
|
id = 'rolatech-list';
|
|
1814
1823
|
hasClass = true;
|
|
1815
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1816
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
1824
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1825
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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 });
|
|
1817
1826
|
}
|
|
1818
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1827
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ListComponent, decorators: [{
|
|
1819
1828
|
type: Component,
|
|
1820
1829
|
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"] }]
|
|
1821
1830
|
}], propDecorators: { id: [{
|
|
@@ -1827,10 +1836,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
1827
1836
|
}] } });
|
|
1828
1837
|
|
|
1829
1838
|
class ContentComponent {
|
|
1830
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1831
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
1839
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1840
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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 });
|
|
1832
1841
|
}
|
|
1833
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1842
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ContentComponent, decorators: [{
|
|
1834
1843
|
type: Component,
|
|
1835
1844
|
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"] }]
|
|
1836
1845
|
}] });
|
|
@@ -1933,10 +1942,10 @@ class ChipBarComponent {
|
|
|
1933
1942
|
rightArrowClick() {
|
|
1934
1943
|
this.scroller().nativeElement.scrollLeft += 320;
|
|
1935
1944
|
}
|
|
1936
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1937
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1945
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ChipBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1946
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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: i1$5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$5.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$2.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$3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1938
1947
|
}
|
|
1939
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1948
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ChipBarComponent, decorators: [{
|
|
1940
1949
|
type: Component,
|
|
1941
1950
|
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"] }]
|
|
1942
1951
|
}], ctorParameters: () => [], propDecorators: { hasId: [{
|
|
@@ -1956,10 +1965,10 @@ class AvatarComponent {
|
|
|
1956
1965
|
sizea = effect(() => {
|
|
1957
1966
|
this.renderer.setAttribute(this.el.nativeElement, 'size', this.size());
|
|
1958
1967
|
}, ...(ngDevMode ? [{ debugName: "sizea" }] : []));
|
|
1959
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1960
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1968
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1969
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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)]] });
|
|
1961
1970
|
}
|
|
1962
|
-
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "21.
|
|
1971
|
+
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "21.1.1", ngImport: i0, type: AvatarComponent, resolveDeferredDeps: () => [Promise.resolve().then(function () { return image_component; }).then(m => m.ImageComponent)], resolveMetadata: ImageComponent => ({ decorators: [{
|
|
1963
1972
|
type: Component,
|
|
1964
1973
|
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"] }]
|
|
1965
1974
|
}], ctorParameters: null, propDecorators: { hasClass: [{
|
|
@@ -1977,27 +1986,23 @@ class ImagePlaceholderComponent {
|
|
|
1977
1986
|
});
|
|
1978
1987
|
}
|
|
1979
1988
|
ngOnInit() { }
|
|
1980
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1981
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
1989
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ImagePlaceholderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1990
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", type: ImagePlaceholderComponent, isStandalone: true, selector: "rolatech-image-placeholder", inputs: { ratio: { classPropertyName: "ratio", publicName: "ratio", isSignal: true, isRequired: false, transformFunction: null } }, 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)}rolatech-image-placeholder[ratio=square]{aspect-ratio:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
1982
1991
|
}
|
|
1983
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1992
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ImagePlaceholderComponent, decorators: [{
|
|
1984
1993
|
type: Component,
|
|
1985
1994
|
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)}rolatech-image-placeholder[ratio=square]{aspect-ratio:1}\n"] }]
|
|
1986
1995
|
}], ctorParameters: () => [], propDecorators: { ratio: [{ type: i0.Input, args: [{ isSignal: true, alias: "ratio", required: false }] }] } });
|
|
1987
1996
|
|
|
1988
1997
|
class ImagePreviewDialogComponent {
|
|
1989
|
-
data;
|
|
1990
|
-
dialogRef;
|
|
1991
1998
|
selected;
|
|
1992
1999
|
index = 0;
|
|
1993
2000
|
prevDisabled = false;
|
|
1994
2001
|
nextDisabled = false;
|
|
1995
|
-
|
|
1996
|
-
|
|
1997
|
-
this.dialogRef = dialogRef;
|
|
1998
|
-
this.data.title = 'Preview';
|
|
1999
|
-
}
|
|
2002
|
+
data = inject(MAT_DIALOG_DATA);
|
|
2003
|
+
dialogRef = inject((MatDialogRef));
|
|
2000
2004
|
ngOnInit() {
|
|
2005
|
+
this.data.title = this.data.title || 'Preview';
|
|
2001
2006
|
this.selected = this.data.selected;
|
|
2002
2007
|
this.prevDisabled = this.selected === 0;
|
|
2003
2008
|
this.nextDisabled = this.selected === this.data.media.length - 1;
|
|
@@ -2015,22 +2020,19 @@ class ImagePreviewDialogComponent {
|
|
|
2015
2020
|
this.prevDisabled = this.selected === 0;
|
|
2016
2021
|
this.nextDisabled = this.selected === this.data.media.length - 1;
|
|
2017
2022
|
}
|
|
2018
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2019
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
2023
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ImagePreviewDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2024
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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$3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i2$4.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$2.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 });
|
|
2020
2025
|
}
|
|
2021
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2026
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ImagePreviewDialogComponent, decorators: [{
|
|
2022
2027
|
type: Component,
|
|
2023
2028
|
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" }]
|
|
2024
|
-
}]
|
|
2025
|
-
type: Inject,
|
|
2026
|
-
args: [MAT_DIALOG_DATA]
|
|
2027
|
-
}] }, { type: i1$4.MatDialogRef }] });
|
|
2029
|
+
}] });
|
|
2028
2030
|
|
|
2029
2031
|
class EmptyComponent {
|
|
2030
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2031
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
2032
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: EmptyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2033
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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 }] });
|
|
2032
2034
|
}
|
|
2033
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2035
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: EmptyComponent, decorators: [{
|
|
2034
2036
|
type: Component,
|
|
2035
2037
|
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" }]
|
|
2036
2038
|
}] });
|
|
@@ -2038,10 +2040,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
2038
2040
|
class InputComponent {
|
|
2039
2041
|
title = model(...(ngDevMode ? [undefined, { debugName: "title" }] : []));
|
|
2040
2042
|
placeholder = input('Title', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
|
|
2041
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2042
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
2043
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2044
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", 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: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
2043
2045
|
}
|
|
2044
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2046
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: InputComponent, decorators: [{
|
|
2045
2047
|
type: Component,
|
|
2046
2048
|
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"] }]
|
|
2047
2049
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }, { type: i0.Output, args: ["titleChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }] } });
|
|
@@ -2056,10 +2058,10 @@ class RichItemComponent {
|
|
|
2056
2058
|
price = input(0, ...(ngDevMode ? [{ debugName: "price" }] : []));
|
|
2057
2059
|
thumbnailRatio = input('rectangle', ...(ngDevMode ? [{ debugName: "thumbnailRatio" }] : []));
|
|
2058
2060
|
thumbnailMode = input('full', ...(ngDevMode ? [{ debugName: "thumbnailMode" }] : []));
|
|
2059
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2060
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
2061
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: RichItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2062
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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 }, thumbnailMode: { classPropertyName: "thumbnailMode", publicName: "thumbnailMode", 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\n [src]=\"thumbnail()\"\n size=\"medium\"\n [ratio]=\"thumbnailRatio()\"\n [mode]=\"thumbnailMode()\"\n ></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\">{{ price() | 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))}#details.rolatech-rich-item{display:flex;flex-direction:column;justify-content:space-between}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: PricePipe, name: "price" }], encapsulation: i0.ViewEncapsulation.None, deferBlockDependencies: [() => [Promise.resolve().then(function () { return thumbnail_component; }).then(m => m.ThumbnailComponent)]] });
|
|
2061
2063
|
}
|
|
2062
|
-
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "21.
|
|
2064
|
+
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "21.1.1", ngImport: i0, type: RichItemComponent, resolveDeferredDeps: () => [Promise.resolve().then(function () { return thumbnail_component; }).then(m => m.ThumbnailComponent)], resolveMetadata: ThumbnailComponent => ({ decorators: [{
|
|
2063
2065
|
type: Component,
|
|
2064
2066
|
args: [{ selector: 'rolatech-rich-item', imports: [CommonModule, ThumbnailComponent, PricePipe], encapsulation: ViewEncapsulation.None, template: "<div id=\"thumbnail\" class=\"rolatech-rich-item\">\n @defer (on viewport()) {\n <rolatech-thumbnail\n [src]=\"thumbnail()\"\n size=\"medium\"\n [ratio]=\"thumbnailRatio()\"\n [mode]=\"thumbnailMode()\"\n ></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\">{{ price() | 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))}#details.rolatech-rich-item{display:flex;flex-direction:column;justify-content:space-between}\n"] }]
|
|
2065
2067
|
}], ctorParameters: null, propDecorators: { hasClass: [{
|
|
@@ -2120,10 +2122,10 @@ class RichViewComponent {
|
|
|
2120
2122
|
this.el.nativeElement.style.setProperty('--rt-rich-view-items-per-row', 5);
|
|
2121
2123
|
}
|
|
2122
2124
|
}
|
|
2123
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2124
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.
|
|
2125
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: RichViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2126
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.1", 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: 1}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]){--rt-rich-view-items-per-row: 1}rolatech-rich-view:not([list]) rolatech-rich-item{margin-bottom:16px}@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 });
|
|
2125
2127
|
}
|
|
2126
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2128
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: RichViewComponent, decorators: [{
|
|
2127
2129
|
type: Component,
|
|
2128
2130
|
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: 1}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]){--rt-rich-view-items-per-row: 1}rolatech-rich-view:not([list]) rolatech-rich-item{margin-bottom:16px}@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"] }]
|
|
2129
2131
|
}], ctorParameters: () => [], propDecorators: { hasClass: [{
|
|
@@ -2184,20 +2186,20 @@ class EditorComponent {
|
|
|
2184
2186
|
});
|
|
2185
2187
|
}
|
|
2186
2188
|
}
|
|
2187
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2188
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
2189
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: EditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2190
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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 });
|
|
2189
2191
|
}
|
|
2190
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2192
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: EditorComponent, decorators: [{
|
|
2191
2193
|
type: Component,
|
|
2192
2194
|
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"] }]
|
|
2193
2195
|
}], ctorParameters: () => [] });
|
|
2194
2196
|
|
|
2195
2197
|
class AccordionComponent {
|
|
2196
2198
|
hasClass = true;
|
|
2197
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2198
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
2199
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2200
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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 });
|
|
2199
2201
|
}
|
|
2200
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2202
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AccordionComponent, decorators: [{
|
|
2201
2203
|
type: Component,
|
|
2202
2204
|
args: [{ selector: 'rolatech-accordion', imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n" }]
|
|
2203
2205
|
}], propDecorators: { hasClass: [{
|
|
@@ -2240,10 +2242,10 @@ class PanelComponent {
|
|
|
2240
2242
|
toggle() {
|
|
2241
2243
|
this.expanded.set(!this.expanded());
|
|
2242
2244
|
}
|
|
2243
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2244
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
2245
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: PanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2246
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", 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 class=\"indicator-collapsed\" [class.indicator-expanded]=\"expanded() === true\">expand_more</rolatech-icon>\n</div>\n<div class=\"content-container rolatech-panel content-collapsed\" [class.content-expanded]=\"expanded() === true\">\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"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
2245
2247
|
}
|
|
2246
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2248
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: PanelComponent, decorators: [{
|
|
2247
2249
|
type: Component,
|
|
2248
2250
|
args: [{ selector: 'rolatech-panel', imports: [CommonModule, IconComponent], encapsulation: ViewEncapsulation.None, 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 class=\"indicator-collapsed\" [class.indicator-expanded]=\"expanded() === true\">expand_more</rolatech-icon>\n</div>\n<div class=\"content-container rolatech-panel content-collapsed\" [class.content-expanded]=\"expanded() === true\">\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"] }]
|
|
2249
2251
|
}], ctorParameters: () => [], propDecorators: { hasClass: [{
|
|
@@ -2252,10 +2254,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
2252
2254
|
}], border: [{ type: i0.Input, args: [{ isSignal: true, alias: "border", required: false }] }], divider: [{ type: i0.Input, args: [{ isSignal: true, alias: "divider", required: false }] }], expanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "expanded", required: false }] }, { type: i0.Output, args: ["expandedChange"] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }] } });
|
|
2253
2255
|
|
|
2254
2256
|
class PanelHeaderComponent {
|
|
2255
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2256
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
2257
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: PanelHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2258
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: PanelHeaderComponent, isStandalone: true, selector: "rolatech-panel-header", ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".indicator-collapsed{transform:rotate(0);transition:transform 225ms cubic-bezier(.4,0,.2,1)}.indicator-expanded{transform:rotate(180deg)}.content-collapsed{max-height:0;visibility:hidden;transition:max-height 225ms cubic-bezier(.4,0,.2,1)}.content-expanded{max-height:fit-content;visibility:visible}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
2257
2259
|
}
|
|
2258
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2260
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: PanelHeaderComponent, decorators: [{
|
|
2259
2261
|
type: Component,
|
|
2260
2262
|
args: [{ selector: 'rolatech-panel-header', imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n", styles: [".indicator-collapsed{transform:rotate(0);transition:transform 225ms cubic-bezier(.4,0,.2,1)}.indicator-expanded{transform:rotate(180deg)}.content-collapsed{max-height:0;visibility:hidden;transition:max-height 225ms cubic-bezier(.4,0,.2,1)}.content-expanded{max-height:fit-content;visibility:visible}\n"] }]
|
|
2261
2263
|
}] });
|
|
@@ -2279,10 +2281,10 @@ class MarkdownPipe {
|
|
|
2279
2281
|
const html = marked.parse(value);
|
|
2280
2282
|
return this.sanitizer.bypassSecurityTrustHtml(html);
|
|
2281
2283
|
}
|
|
2282
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2283
|
-
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.
|
|
2284
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MarkdownPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
2285
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: MarkdownPipe, isStandalone: true, name: "markdown" });
|
|
2284
2286
|
}
|
|
2285
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2287
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MarkdownPipe, decorators: [{
|
|
2286
2288
|
type: Pipe,
|
|
2287
2289
|
args: [{
|
|
2288
2290
|
name: 'markdown',
|
|
@@ -2292,10 +2294,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
2292
2294
|
class ConversationMessage {
|
|
2293
2295
|
message = input.required(...(ngDevMode ? [{ debugName: "message" }] : []));
|
|
2294
2296
|
call() { }
|
|
2295
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2296
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
2297
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ConversationMessage, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2298
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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 py-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 py-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 <!-- <div class=\"markdown-body\" [innerHTML]=\"seg.text | markdown\"></div> -->\n <article class=\"prose dark:prose-invert max-w-none\" [innerHTML]=\"seg.text | markdown\"></article>\n\n } @case ('group') {\n <a\n class=\"w-full flex flex-col p-3 mb-3 shadow rounded-xl hover:bg-[--rt-raised-background] cursor-pointer\"\n [routerLink]=\"['/properties', seg.item.id]\"\n target=\"_blank\"\n >\n <div class=\"flex flex-row\">\n @if (seg.item.mediaUrl) {\n <div class=\"min-w-20 w-20 object-cover aspect-video rounded-lg mr-3\">\n @defer (on viewport()) {\n <rolatech-thumbnail [src]=\"seg.item.mediaUrl\" ratio=\"square\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-square rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-20 w-20 object-cover aspect-square rounded-lg mr-3\">\n <rolatech-image-placeholder ratio=\"square\"></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\">{{ seg.item.price }}</div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"mx-2 my-3 bg-black opacity-10 h-[1px]\"></div>\n <div class=\"px-1\">\n <div><span class=\"opacity-70 text-sm\">Address: </span>{{seg.item.address}}</div>\n @if (seg.item.phone) {\n <div><span class=\"opacity-70 text-sm\">Phone: </span>{{seg.item.phone}}</div>\n <button mat-flat-button (click)=\"call()\">Call me</button>\n }\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=\"w-full opacity-70 py-2 rounded-xl text-sm bg-[--rt-raised-background] mb-2 break-all\">\n <span class=\"font-bold\">Using Tool</span><span> | {{ seg.tool.tool }}: {{ seg.tool.args }} {{seg.tool.results}}</span>\n </div>\n } } } @if (message().done) {\n <div class=\"text-xs opacity-50 mt-2\">[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", inputs: ["ratio"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$2.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: "pipe", type: i1$1.JsonPipe, name: "json" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: MarkdownPipe, name: "markdown" }], deferBlockDependencies: [() => [Promise.resolve().then(function () { return thumbnail_component; }).then(m => m.ThumbnailComponent)]] });
|
|
2297
2299
|
}
|
|
2298
|
-
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "21.
|
|
2300
|
+
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "21.1.1", ngImport: i0, type: ConversationMessage, resolveDeferredDeps: () => [Promise.resolve().then(function () { return thumbnail_component; }).then(m => m.ThumbnailComponent)], resolveMetadata: ThumbnailComponent => ({ decorators: [{
|
|
2299
2301
|
type: Component,
|
|
2300
2302
|
args: [{ selector: 'rolatech-conversation-message', imports: [CommonModule, RouterLink, ThumbnailComponent, ImagePlaceholderComponent, MatButtonModule, MarkdownPipe], template: "@if (message().role === 'user') {\n<div class=\"flex justify-end\">\n <div class=\"flex flex-col items-end w-full py-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 py-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 <!-- <div class=\"markdown-body\" [innerHTML]=\"seg.text | markdown\"></div> -->\n <article class=\"prose dark:prose-invert max-w-none\" [innerHTML]=\"seg.text | markdown\"></article>\n\n } @case ('group') {\n <a\n class=\"w-full flex flex-col p-3 mb-3 shadow rounded-xl hover:bg-[--rt-raised-background] cursor-pointer\"\n [routerLink]=\"['/properties', seg.item.id]\"\n target=\"_blank\"\n >\n <div class=\"flex flex-row\">\n @if (seg.item.mediaUrl) {\n <div class=\"min-w-20 w-20 object-cover aspect-video rounded-lg mr-3\">\n @defer (on viewport()) {\n <rolatech-thumbnail [src]=\"seg.item.mediaUrl\" ratio=\"square\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-square rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-20 w-20 object-cover aspect-square rounded-lg mr-3\">\n <rolatech-image-placeholder ratio=\"square\"></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\">{{ seg.item.price }}</div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"mx-2 my-3 bg-black opacity-10 h-[1px]\"></div>\n <div class=\"px-1\">\n <div><span class=\"opacity-70 text-sm\">Address: </span>{{seg.item.address}}</div>\n @if (seg.item.phone) {\n <div><span class=\"opacity-70 text-sm\">Phone: </span>{{seg.item.phone}}</div>\n <button mat-flat-button (click)=\"call()\">Call me</button>\n }\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=\"w-full opacity-70 py-2 rounded-xl text-sm bg-[--rt-raised-background] mb-2 break-all\">\n <span class=\"font-bold\">Using Tool</span><span> | {{ seg.tool.tool }}: {{ seg.tool.args }} {{seg.tool.results}}</span>\n </div>\n } } } @if (message().done) {\n <div class=\"text-xs opacity-50 mt-2\">[done]</div>\n } }\n </div>\n</div>\n}\n" }]
|
|
2301
2303
|
}], ctorParameters: null, propDecorators: { message: [{ type: i0.Input, args: [{ isSignal: true, alias: "message", required: true }] }] } }) });
|
|
@@ -2400,20 +2402,20 @@ class ConversationContent {
|
|
|
2400
2402
|
this.firstPaint = false;
|
|
2401
2403
|
});
|
|
2402
2404
|
}
|
|
2403
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2404
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
2405
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ConversationContent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2406
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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 }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block h-full min-h-0" }, viewQueries: [{ propertyName: "scrollArea", first: true, predicate: ["scrollArea"], descendants: true, isSignal: true }, { propertyName: "messageItems", predicate: ["messageItem"], descendants: true, read: ElementRef, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"h-full min-h-0 overflow-y-auto px-4\">\n <div #scrollArea class=\"w-full md:max-w-[768px] xl:max-w-[1024px] 2xl:max-w-[1024px] mx-auto [overflow-anchor:none]\">\n @for (m of messages(); track m.id) {\n <rolatech-conversation-message #messageItem [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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2405
2407
|
}
|
|
2406
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2408
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ConversationContent, decorators: [{
|
|
2407
2409
|
type: Component,
|
|
2408
2410
|
args: [{ selector: 'rolatech-conversation-content', imports: [CommonModule, ConversationMessage], host: { class: 'block h-full min-h-0' }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"h-full min-h-0 overflow-y-auto px-4\">\n <div #scrollArea class=\"w-full md:max-w-[768px] xl:max-w-[1024px] 2xl:max-w-[1024px] mx-auto [overflow-anchor:none]\">\n @for (m of messages(); track m.id) {\n <rolatech-conversation-message #messageItem [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" }]
|
|
2409
2411
|
}], ctorParameters: () => [], propDecorators: { messages: [{ type: i0.Input, args: [{ isSignal: true, alias: "messages", required: true }] }], scrollArea: [{ type: i0.ViewChild, args: ['scrollArea', { isSignal: true }] }], messageItems: [{ type: i0.ViewChildren, args: ['messageItem', { ...{ read: (ElementRef) }, isSignal: true }] }], streaming: [{ type: i0.Input, args: [{ isSignal: true, alias: "streaming", required: true }] }], direction: [{ type: i0.Input, args: [{ isSignal: true, alias: "direction", required: false }] }] } });
|
|
2410
2412
|
|
|
2411
2413
|
class ConversationHeader {
|
|
2412
2414
|
status = input('u', ...(ngDevMode ? [{ debugName: "status" }] : []));
|
|
2413
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2414
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
2415
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ConversationHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2416
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", 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 }] });
|
|
2415
2417
|
}
|
|
2416
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2418
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ConversationHeader, decorators: [{
|
|
2417
2419
|
type: Component,
|
|
2418
2420
|
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" }]
|
|
2419
2421
|
}], propDecorators: { status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }] } });
|
|
@@ -2452,10 +2454,10 @@ class ConversationInput {
|
|
|
2452
2454
|
el.style.height = 'auto';
|
|
2453
2455
|
el.style.height = Math.min(el.scrollHeight, 220) + 'px';
|
|
2454
2456
|
}
|
|
2455
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2456
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.
|
|
2457
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ConversationInput, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2458
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.1", 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=\"px-3 py-3 md:px-0 w-full md:max-w-[768px] xl:max-w-[1024px] 2xl:max-w-[1024px] mx-auto\">\n <div class=\"flex rounded-2xl p-1 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 (compositionstart)=\"onCompositionStart()\"\n (compositionend)=\"onCompositionEnd()\"\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$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$2.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"] }] });
|
|
2457
2459
|
}
|
|
2458
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2460
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ConversationInput, decorators: [{
|
|
2459
2461
|
type: Component,
|
|
2460
2462
|
args: [{ selector: 'rolatech-conversation-input', imports: [CommonModule, MatButtonModule, MatIcon], template: "<div class=\"px-3 py-3 md:px-0 w-full md:max-w-[768px] xl:max-w-[1024px] 2xl:max-w-[1024px] mx-auto\">\n <div class=\"flex rounded-2xl p-1 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 (compositionstart)=\"onCompositionStart()\"\n (compositionend)=\"onCompositionEnd()\"\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" }]
|
|
2461
2463
|
}], propDecorators: { send: [{ type: i0.Output, args: ["send"] }], ta: [{ type: i0.ViewChild, args: ['ta', { isSignal: true }] }] } });
|