@doug-williamson/ng-rhombus 0.0.17 → 0.0.19
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.
|
@@ -20,7 +20,7 @@ import { MatSnackBar } from '@angular/material/snack-bar';
|
|
|
20
20
|
import { Auth, authState, signInWithEmailAndPassword } from '@angular/fire/auth';
|
|
21
21
|
import { switchMap } from 'rxjs/operators';
|
|
22
22
|
import * as i4$2 from '@angular/common';
|
|
23
|
-
import { isPlatformBrowser, TitleCasePipe,
|
|
23
|
+
import { isPlatformBrowser, TitleCasePipe, DatePipe, CommonModule } from '@angular/common';
|
|
24
24
|
import * as i4 from '@angular/material/progress-bar';
|
|
25
25
|
import { MatProgressBarModule } from '@angular/material/progress-bar';
|
|
26
26
|
import * as i1$2 from '@angular/material/list';
|
|
@@ -110,10 +110,10 @@ class WrapperService {
|
|
|
110
110
|
openSnackbar(message) {
|
|
111
111
|
this.snackbar.open(message, undefined, { duration: 3000 });
|
|
112
112
|
}
|
|
113
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
114
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
113
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: WrapperService, deps: [{ token: i1.Router }, { token: i1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
114
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: WrapperService, providedIn: 'root' }); }
|
|
115
115
|
}
|
|
116
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
116
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: WrapperService, decorators: [{
|
|
117
117
|
type: Injectable,
|
|
118
118
|
args: [{
|
|
119
119
|
providedIn: 'root'
|
|
@@ -133,10 +133,10 @@ class NgRhombusAuthenticationService {
|
|
|
133
133
|
return signInWithEmailAndPassword(this.firebaseAuth, email, password).then(() => { });
|
|
134
134
|
}
|
|
135
135
|
logout() { return this.firebaseAuth.signOut(); }
|
|
136
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
137
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
136
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusAuthenticationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
137
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusAuthenticationService, providedIn: 'root' }); }
|
|
138
138
|
}
|
|
139
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
139
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusAuthenticationService, decorators: [{
|
|
140
140
|
type: Injectable,
|
|
141
141
|
args: [{
|
|
142
142
|
providedIn: 'root'
|
|
@@ -161,7 +161,9 @@ class ThemeService {
|
|
|
161
161
|
}
|
|
162
162
|
}
|
|
163
163
|
getThemeFromLocalStorage() {
|
|
164
|
-
|
|
164
|
+
if (!isPlatformBrowser(this.platformId))
|
|
165
|
+
return 'system';
|
|
166
|
+
return localStorage.getItem(this.PREFERRED_THEME_COOKIE) ?? 'system';
|
|
165
167
|
}
|
|
166
168
|
constructor() {
|
|
167
169
|
this.platformId = inject(PLATFORM_ID);
|
|
@@ -175,10 +177,10 @@ class ThemeService {
|
|
|
175
177
|
this.selectedTheme = computed(() => this.themes.find((t) => t.name === this.appTheme()), ...(ngDevMode ? [{ debugName: "selectedTheme" }] : []));
|
|
176
178
|
this.setTheme(this.getThemeFromLocalStorage());
|
|
177
179
|
}
|
|
178
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
179
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
180
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: ThemeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
181
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: ThemeService, providedIn: 'root' }); }
|
|
180
182
|
}
|
|
181
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
183
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: ThemeService, decorators: [{
|
|
182
184
|
type: Injectable,
|
|
183
185
|
args: [{
|
|
184
186
|
providedIn: 'root',
|
|
@@ -204,13 +206,13 @@ class NgRhombusHeaderComponent {
|
|
|
204
206
|
logout() {
|
|
205
207
|
this.logOut.emit();
|
|
206
208
|
}
|
|
207
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
208
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
209
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
210
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.4", type: NgRhombusHeaderComponent, isStandalone: true, selector: "ng-rhombus-header", inputs: { isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isMobile: { classPropertyName: "isMobile", publicName: "isMobile", isSignal: false, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { logOut: "logOut", menuToggled: "menuToggled" }, ngImport: i0, template: "<mat-toolbar class=\"header-theme relative\">\r\n @if (isMobile) {\r\n <button mat-icon-button (click)=\"toggleSidebar()\" color=\"red\">\r\n <mat-icon>menu</mat-icon>\r\n </button>\r\n }\r\n\r\n <span class=\"flex-1\">{{ title }}</span>\r\n\r\n <button class=\"mr-2\" mat-icon-button [mat-menu-trigger-for]=\"themeMenu\">\r\n <mat-icon>{{ themeService.selectedTheme()?.icon }}</mat-icon>\r\n </button>\r\n <mat-menu #themeMenu=\"matMenu\">\r\n @for (theme of themeService.getThemes(); track theme.name) {\r\n <button [class.selected-theme]=\"themeService.selectedTheme()?.name === theme.name\" mat-menu-item\r\n (click)=\"themeService.setTheme(theme.name)\">\r\n <mat-icon>{{ theme.icon }}</mat-icon>\r\n <span>{{ theme.name | titlecase }}</span>\r\n </button>\r\n }\r\n </mat-menu>\r\n\r\n @if (user()) {\r\n <button mat-raised-button color=\"primary\" class=\"logout-button\" (click)=\"logout()\">\r\n Logout\r\n </button>\r\n }\r\n</mat-toolbar>\r\n@if (isLoading()) {\r\n<mat-progress-bar class=\"!absolute top-[64px] z-10\" mode=\"indeterminate\" />\r\n}", styles: [".header-theme{--mat-toolbar-container-background-color: var(--mat-sys-primary);--mat-toolbar-container-text-color: var(--mat-sys-on-primary);--mat-icon-button-icon-color: var(--mat-sys-on-primary);box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024,0 1px 18px #0000001f}.selected-theme{--mat-menu-item-icon-color: var(--mat-sys-primary);--mat-menu-item-label-text-color: var(--mat-sys-primary)}mat-progress-bar{--mat-progress-bar-active-indicator-color: var(--mat-sys-primary);--mat-progress-bar-track-color: var(--mat-sys-surface-variant)}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.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$1.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.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3.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: i3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "ngmodule", type: MatProgressBarModule }, { kind: "component", type: i4.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "pipe", type: TitleCasePipe, name: "titlecase" }] }); }
|
|
209
211
|
}
|
|
210
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
212
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusHeaderComponent, decorators: [{
|
|
211
213
|
type: Component,
|
|
212
214
|
args: [{ selector: 'ng-rhombus-header', imports: [MatButtonModule, MatIconModule, MatMenuModule, MatToolbar, TitleCasePipe, MatProgressBarModule], template: "<mat-toolbar class=\"header-theme relative\">\r\n @if (isMobile) {\r\n <button mat-icon-button (click)=\"toggleSidebar()\" color=\"red\">\r\n <mat-icon>menu</mat-icon>\r\n </button>\r\n }\r\n\r\n <span class=\"flex-1\">{{ title }}</span>\r\n\r\n <button class=\"mr-2\" mat-icon-button [mat-menu-trigger-for]=\"themeMenu\">\r\n <mat-icon>{{ themeService.selectedTheme()?.icon }}</mat-icon>\r\n </button>\r\n <mat-menu #themeMenu=\"matMenu\">\r\n @for (theme of themeService.getThemes(); track theme.name) {\r\n <button [class.selected-theme]=\"themeService.selectedTheme()?.name === theme.name\" mat-menu-item\r\n (click)=\"themeService.setTheme(theme.name)\">\r\n <mat-icon>{{ theme.icon }}</mat-icon>\r\n <span>{{ theme.name | titlecase }}</span>\r\n </button>\r\n }\r\n </mat-menu>\r\n\r\n @if (user()) {\r\n <button mat-raised-button color=\"primary\" class=\"logout-button\" (click)=\"logout()\">\r\n Logout\r\n </button>\r\n }\r\n</mat-toolbar>\r\n@if (isLoading()) {\r\n<mat-progress-bar class=\"!absolute top-[64px] z-10\" mode=\"indeterminate\" />\r\n}", styles: [".header-theme{--mat-toolbar-container-background-color: var(--mat-sys-primary);--mat-toolbar-container-text-color: var(--mat-sys-on-primary);--mat-icon-button-icon-color: var(--mat-sys-on-primary);box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024,0 1px 18px #0000001f}.selected-theme{--mat-menu-item-icon-color: var(--mat-sys-primary);--mat-menu-item-label-text-color: var(--mat-sys-primary)}mat-progress-bar{--mat-progress-bar-active-indicator-color: var(--mat-sys-primary);--mat-progress-bar-track-color: var(--mat-sys-surface-variant)}\n"] }]
|
|
213
|
-
}], propDecorators: { isMobile: [{
|
|
215
|
+
}], propDecorators: { isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }], logOut: [{ type: i0.Output, args: ["logOut"] }], isMobile: [{
|
|
214
216
|
type: Input
|
|
215
217
|
}], title: [{
|
|
216
218
|
type: Input
|
|
@@ -221,12 +223,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImpor
|
|
|
221
223
|
class NgRhombusNavListComponent {
|
|
222
224
|
ngOnInit() {
|
|
223
225
|
}
|
|
224
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
225
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
226
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusNavListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
227
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.4", type: NgRhombusNavListComponent, isStandalone: true, selector: "ng-rhombus-nav-list", inputs: { routeCollection: "routeCollection" }, ngImport: i0, template: "<mat-nav-list>\r\n @for (link of routeCollection; track link) {\r\n <a mat-list-item [routerLink]=\"link.route\" routerLinkActive=\"selected-menu-item\">\r\n <span>{{ link.label }}</span>\r\n </a>\r\n }\r\n</mat-nav-list>", styles: [".selected-menu-item{--mat-list-list-item-container-color: var(--mat-sys-primary);--mat-list-list-item-label-text-color: var(--mat-sys-on-primary);--mat-list-list-item-hover-label-text-color: var(--mat-sys-on-primary);--mat-list-list-item-focus-label-text-color: var(--mat-sys-on-primary)}\n"], dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: MatListModule }, { kind: "component", type: i1$2.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i1$2.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTabsModule }] }); }
|
|
226
228
|
}
|
|
227
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
229
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusNavListComponent, decorators: [{
|
|
228
230
|
type: Component,
|
|
229
|
-
args: [{ selector: 'ng-rhombus-nav-list', imports: [
|
|
231
|
+
args: [{ selector: 'ng-rhombus-nav-list', imports: [RouterModule, MatListModule, MatIconModule, MatTabsModule], template: "<mat-nav-list>\r\n @for (link of routeCollection; track link) {\r\n <a mat-list-item [routerLink]=\"link.route\" routerLinkActive=\"selected-menu-item\">\r\n <span>{{ link.label }}</span>\r\n </a>\r\n }\r\n</mat-nav-list>", styles: [".selected-menu-item{--mat-list-list-item-container-color: var(--mat-sys-primary);--mat-list-list-item-label-text-color: var(--mat-sys-on-primary);--mat-list-list-item-hover-label-text-color: var(--mat-sys-on-primary);--mat-list-list-item-focus-label-text-color: var(--mat-sys-on-primary)}\n"] }]
|
|
230
232
|
}], propDecorators: { routeCollection: [{
|
|
231
233
|
type: Input
|
|
232
234
|
}] } });
|
|
@@ -265,15 +267,15 @@ class NgRhombusWrapperComponent {
|
|
|
265
267
|
logOut() {
|
|
266
268
|
this.logout.emit();
|
|
267
269
|
}
|
|
268
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
269
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
270
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusWrapperComponent, deps: [{ token: i1$3.BreakpointObserver }, { token: WrapperService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
271
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.4", type: NgRhombusWrapperComponent, isStandalone: true, selector: "ng-rhombus-wrapper", inputs: { isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: false, isRequired: false, transformFunction: null }, routeCollection: { classPropertyName: "routeCollection", publicName: "routeCollection", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { clickAddNewEvent: "clickAddNewEvent", logout: "logout" }, providers: [WrapperService], ngImport: i0, template: "<ng-rhombus-header class=\"header-wrapper\" [isMobile]=\"isMobile\" [title]=\"title\" (menuToggled)=\"sidenav.toggle()\"\r\n (logOut)=\"logOut()\" [isLoading]=\"isLoading()\"></ng-rhombus-header>\r\n<mat-sidenav-container>\r\n <mat-sidenav #sidenav [opened]=\"!isMobile\" [mode]=\"isMobile ? 'over' : 'side'\">\r\n <div class=\"nav-list-wrapper\">\r\n <ng-rhombus-nav-list [routeCollection]=\"routeCollection\"></ng-rhombus-nav-list>\r\n </div>\r\n </mat-sidenav>\r\n <mat-sidenav-content class=\"main-sidenav-content\">\r\n <!-- <mat-toolbar class=\"header-theme\">\r\n <span class=\"wrapper-flex\">\r\n <ng-container *ngFor=\"let breadcrumb of breadcrumbs()\">\r\n {{ breadcrumb.label }}\r\n </ng-container>\r\n </span>\r\n <button mat-icon-button (click)=\"clickedCreateNew()\">\r\n <mat-icon>add</mat-icon>\r\n </button>\r\n </mat-toolbar> -->\r\n <router-outlet #o=\"outlet\"></router-outlet>\r\n </mat-sidenav-content>\r\n</mat-sidenav-container>", styles: [":host{position:relative}.main-sidenav-content{overflow:hidden}mat-sidenav-container{height:calc(100vh - 64px)}\n"], dependencies: [{ kind: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i3$1.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i3$1.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i3$1.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatListModule }, { kind: "ngmodule", type: MatProgressBarModule }, { kind: "ngmodule", type: MatToolbarModule }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: NgRhombusHeaderComponent, selector: "ng-rhombus-header", inputs: ["isLoading", "isMobile", "title"], outputs: ["logOut", "menuToggled"] }, { kind: "component", type: NgRhombusNavListComponent, selector: "ng-rhombus-nav-list", inputs: ["routeCollection"] }] }); }
|
|
270
272
|
}
|
|
271
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
273
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusWrapperComponent, decorators: [{
|
|
272
274
|
type: Component,
|
|
273
|
-
args: [{ selector: 'ng-rhombus-wrapper', imports: [
|
|
275
|
+
args: [{ selector: 'ng-rhombus-wrapper', imports: [MatSidenavModule, MatButtonModule, MatIconModule, MatListModule, MatProgressBarModule, MatToolbarModule, RouterModule, NgRhombusHeaderComponent, NgRhombusNavListComponent], providers: [WrapperService], template: "<ng-rhombus-header class=\"header-wrapper\" [isMobile]=\"isMobile\" [title]=\"title\" (menuToggled)=\"sidenav.toggle()\"\r\n (logOut)=\"logOut()\" [isLoading]=\"isLoading()\"></ng-rhombus-header>\r\n<mat-sidenav-container>\r\n <mat-sidenav #sidenav [opened]=\"!isMobile\" [mode]=\"isMobile ? 'over' : 'side'\">\r\n <div class=\"nav-list-wrapper\">\r\n <ng-rhombus-nav-list [routeCollection]=\"routeCollection\"></ng-rhombus-nav-list>\r\n </div>\r\n </mat-sidenav>\r\n <mat-sidenav-content class=\"main-sidenav-content\">\r\n <!-- <mat-toolbar class=\"header-theme\">\r\n <span class=\"wrapper-flex\">\r\n <ng-container *ngFor=\"let breadcrumb of breadcrumbs()\">\r\n {{ breadcrumb.label }}\r\n </ng-container>\r\n </span>\r\n <button mat-icon-button (click)=\"clickedCreateNew()\">\r\n <mat-icon>add</mat-icon>\r\n </button>\r\n </mat-toolbar> -->\r\n <router-outlet #o=\"outlet\"></router-outlet>\r\n </mat-sidenav-content>\r\n</mat-sidenav-container>", styles: [":host{position:relative}.main-sidenav-content{overflow:hidden}mat-sidenav-container{height:calc(100vh - 64px)}\n"] }]
|
|
274
276
|
}], ctorParameters: () => [{ type: i1$3.BreakpointObserver }, { type: WrapperService }], propDecorators: { clickAddNewEvent: [{
|
|
275
277
|
type: Output
|
|
276
|
-
}], title: [{
|
|
278
|
+
}], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }], logout: [{ type: i0.Output, args: ["logout"] }], title: [{
|
|
277
279
|
type: Input
|
|
278
280
|
}], routeCollection: [{
|
|
279
281
|
type: Input
|
|
@@ -284,13 +286,13 @@ class NgRhombusLoadingContainerComponent {
|
|
|
284
286
|
this.loading = input(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
|
|
285
287
|
this.size = input(40, ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
286
288
|
}
|
|
287
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
288
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
289
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusLoadingContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
290
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.4", type: NgRhombusLoadingContainerComponent, isStandalone: true, selector: "ng-rhombus-loading-container", inputs: { loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (loading()) {\r\n<mat-progress-spinner class=\"loading-spinner\" [diameter]=\"size()\" mode=\"indeterminate\" />\r\n} @else {\r\n<ng-content />\r\n}", styles: [":host{display:block;position:relative}.loading-spinner{position:absolute;top:50%;left:50%;translate:-50% -50%}\n"], dependencies: [{ kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }] }); }
|
|
289
291
|
}
|
|
290
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
292
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusLoadingContainerComponent, decorators: [{
|
|
291
293
|
type: Component,
|
|
292
294
|
args: [{ selector: 'ng-rhombus-loading-container', imports: [MatProgressSpinnerModule], template: "@if (loading()) {\r\n<mat-progress-spinner class=\"loading-spinner\" [diameter]=\"size()\" mode=\"indeterminate\" />\r\n} @else {\r\n<ng-content />\r\n}", styles: [":host{display:block;position:relative}.loading-spinner{position:absolute;top:50%;left:50%;translate:-50% -50%}\n"] }]
|
|
293
|
-
}] });
|
|
295
|
+
}], propDecorators: { loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
|
|
294
296
|
|
|
295
297
|
class NgRhombusLoginComponent {
|
|
296
298
|
constructor(fb, router) {
|
|
@@ -313,13 +315,13 @@ class NgRhombusLoginComponent {
|
|
|
313
315
|
const rawForm = this.loginForm.getRawValue();
|
|
314
316
|
this.onSubmit.emit(rawForm);
|
|
315
317
|
}
|
|
316
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
317
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
318
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusLoginComponent, deps: [{ token: i6.FormBuilder }, { token: i1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
319
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.4", type: NgRhombusLoginComponent, isStandalone: true, selector: "ng-rhombus-login", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSubmit: "onSubmit" }, ngImport: i0, template: "<div class=\"flex min-h-screen items-center justify-center bg-background\">\r\n <mat-card class=\"w-full max-w-[400px] p-10\">\r\n <mat-card-header>\r\n <mat-card-title-group>\r\n <mat-card-title>{{ title() }}</mat-card-title>\r\n <mat-card-subtitle>Administration</mat-card-subtitle>\r\n </mat-card-title-group>\r\n\r\n </mat-card-header>\r\n <form class=\"flex flex-col\" novalidate [formGroup]=\"loginForm\" (ngSubmit)=\"onSubmitForm()\">\r\n <mat-card-content>\r\n <mat-form-field class=\"w-full flex\">\r\n <mat-label>Email Address</mat-label>\r\n <input matInput placeholder=\"Placeholder\" formControlName=\"email\" aria-label=\"Email Address\" />\r\n <mat-icon matSuffix>email</mat-icon>\r\n <mat-error align=\"start\">Email Address Required</mat-error>\r\n </mat-form-field>\r\n <mat-form-field class=\"w-full flex\">\r\n <mat-label>Password</mat-label>\r\n <input matInput [type]=\"hidePassword() ? 'password' : 'text'\" placeholder=\"Placeholder\"\r\n formControlName=\"password\" aria-label=\"Password\" />\r\n <button mat-icon-button matSuffix (click)=\"hidePassword.set(!hidePassword())\" type=\"button\"\r\n style=\"margin-right: 0.25rem;\">\r\n <mat-icon>{{ hidePassword() ? 'visibility_off' : 'visibility' }}</mat-icon>\r\n </button>\r\n <mat-error align=\"start\">Password Required</mat-error>\r\n </mat-form-field>\r\n </mat-card-content>\r\n <button mat-flat-button class=\"login-button\" type=\"submit\" [disabled]=\"loading() || loginForm.invalid\">\r\n <ng-rhombus-loading-container [loading]=\"loading()\" [size]=\"20\">\r\n Login\r\n </ng-rhombus-loading-container>\r\n </button>\r\n </form>\r\n </mat-card>\r\n</div>", styles: ["mat-card{box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024,0 1px 18px #0000001f}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i6.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.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$1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i4$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i4$1.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i4$1.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i4$1.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { kind: "directive", type: i4$1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "component", type: i4$1.MatCardTitleGroup, selector: "mat-card-title-group" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "directive", type: i5.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i5.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7.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: "component", type: NgRhombusLoadingContainerComponent, selector: "ng-rhombus-loading-container", inputs: ["loading", "size"] }] }); }
|
|
318
320
|
}
|
|
319
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
321
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusLoginComponent, decorators: [{
|
|
320
322
|
type: Component,
|
|
321
323
|
args: [{ selector: 'ng-rhombus-login', imports: [ReactiveFormsModule, MatButtonModule, MatCardModule, MatFormFieldModule, MatIconModule, MatInputModule, NgRhombusLoadingContainerComponent], template: "<div class=\"flex min-h-screen items-center justify-center bg-background\">\r\n <mat-card class=\"w-full max-w-[400px] p-10\">\r\n <mat-card-header>\r\n <mat-card-title-group>\r\n <mat-card-title>{{ title() }}</mat-card-title>\r\n <mat-card-subtitle>Administration</mat-card-subtitle>\r\n </mat-card-title-group>\r\n\r\n </mat-card-header>\r\n <form class=\"flex flex-col\" novalidate [formGroup]=\"loginForm\" (ngSubmit)=\"onSubmitForm()\">\r\n <mat-card-content>\r\n <mat-form-field class=\"w-full flex\">\r\n <mat-label>Email Address</mat-label>\r\n <input matInput placeholder=\"Placeholder\" formControlName=\"email\" aria-label=\"Email Address\" />\r\n <mat-icon matSuffix>email</mat-icon>\r\n <mat-error align=\"start\">Email Address Required</mat-error>\r\n </mat-form-field>\r\n <mat-form-field class=\"w-full flex\">\r\n <mat-label>Password</mat-label>\r\n <input matInput [type]=\"hidePassword() ? 'password' : 'text'\" placeholder=\"Placeholder\"\r\n formControlName=\"password\" aria-label=\"Password\" />\r\n <button mat-icon-button matSuffix (click)=\"hidePassword.set(!hidePassword())\" type=\"button\"\r\n style=\"margin-right: 0.25rem;\">\r\n <mat-icon>{{ hidePassword() ? 'visibility_off' : 'visibility' }}</mat-icon>\r\n </button>\r\n <mat-error align=\"start\">Password Required</mat-error>\r\n </mat-form-field>\r\n </mat-card-content>\r\n <button mat-flat-button class=\"login-button\" type=\"submit\" [disabled]=\"loading() || loginForm.invalid\">\r\n <ng-rhombus-loading-container [loading]=\"loading()\" [size]=\"20\">\r\n Login\r\n </ng-rhombus-loading-container>\r\n </button>\r\n </form>\r\n </mat-card>\r\n</div>", styles: ["mat-card{box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024,0 1px 18px #0000001f}\n"] }]
|
|
322
|
-
}], ctorParameters: () => [{ type: i6.FormBuilder }, { type: i1.Router }] });
|
|
324
|
+
}], ctorParameters: () => [{ type: i6.FormBuilder }, { type: i1.Router }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], onSubmit: [{ type: i0.Output, args: ["onSubmit"] }] } });
|
|
323
325
|
|
|
324
326
|
/*
|
|
325
327
|
* Public API Surface of @doug-williamson/ng-rhombus/shell
|
|
@@ -333,27 +335,27 @@ class NgRhombusBlogListComponent {
|
|
|
333
335
|
goToBlogPost(id) {
|
|
334
336
|
this.goToRoute.emit(id);
|
|
335
337
|
}
|
|
336
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
337
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
338
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
339
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.4", type: NgRhombusBlogListComponent, isStandalone: true, selector: "ng-rhombus-blog-list", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { goToRoute: "goToRoute" }, ngImport: i0, template: "<mat-nav-list>\r\n\t@for (blogPost of dataSource(); track blogPost.id) {\r\n\t\t<mat-list-item (click)=\"goToRoute.emit(blogPost.id)\">\r\n\t\t\t<h3 matListItemTitle>{{ blogPost.title }}</h3>\r\n\t\t\t<p matListItemLine>{{ blogPost.description }}</p>\r\n\t\t\t<p matListItemMeta>{{ blogPost.timestamp.toMillis() | date: 'MMMM d, y' }}</p>\r\n\t\t</mat-list-item>\r\n\t}\r\n</mat-nav-list>", styles: [".mdc-list-item{border-radius:0!important}\n"], dependencies: [{ kind: "ngmodule", type: MatListModule }, { kind: "component", type: i1$2.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i1$2.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i1$2.MatListItemLine, selector: "[matListItemLine]" }, { kind: "directive", type: i1$2.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "directive", type: i1$2.MatListItemMeta, selector: "[matListItemMeta]" }, { kind: "pipe", type: DatePipe, name: "date" }] }); }
|
|
338
340
|
}
|
|
339
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
341
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogListComponent, decorators: [{
|
|
340
342
|
type: Component,
|
|
341
343
|
args: [{ selector: 'ng-rhombus-blog-list', imports: [DatePipe, MatListModule], template: "<mat-nav-list>\r\n\t@for (blogPost of dataSource(); track blogPost.id) {\r\n\t\t<mat-list-item (click)=\"goToRoute.emit(blogPost.id)\">\r\n\t\t\t<h3 matListItemTitle>{{ blogPost.title }}</h3>\r\n\t\t\t<p matListItemLine>{{ blogPost.description }}</p>\r\n\t\t\t<p matListItemMeta>{{ blogPost.timestamp.toMillis() | date: 'MMMM d, y' }}</p>\r\n\t\t</mat-list-item>\r\n\t}\r\n</mat-nav-list>", styles: [".mdc-list-item{border-radius:0!important}\n"] }]
|
|
342
344
|
}], propDecorators: { goToRoute: [{
|
|
343
345
|
type: Output
|
|
344
|
-
}] } });
|
|
346
|
+
}], dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: false }] }] } });
|
|
345
347
|
|
|
346
348
|
class NgRhombusBlogPostLatestComponent {
|
|
347
349
|
constructor() {
|
|
348
350
|
this.blogPost = input(...(ngDevMode ? [undefined, { debugName: "blogPost" }] : []));
|
|
349
351
|
}
|
|
350
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
351
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
352
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogPostLatestComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
353
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.4", type: NgRhombusBlogPostLatestComponent, isStandalone: true, selector: "ng-rhombus-blog-post-latest", inputs: { blogPost: { classPropertyName: "blogPost", publicName: "blogPost", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<mat-nav-list>\r\n <mat-list-item [routerLink]=\"['/blog', blogPost()?.id]\">\r\n <span matListItemTitle>{{ blogPost()?.title }}</span>\r\n <span matListItemLine>{{ blogPost()?.description }}</span>\r\n <span matListItemLine>{{ blogPost()?.timestamp?.toMillis() | date: 'MMMM d, y' }}</span>\r\n </mat-list-item>\r\n</mat-nav-list>", styles: [".mdc-list-item{border-radius:0!important}\n"], dependencies: [{ kind: "ngmodule", type: MatListModule }, { kind: "component", type: i1$2.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i1$2.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i1$2.MatListItemLine, selector: "[matListItemLine]" }, { kind: "directive", type: i1$2.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: DatePipe, name: "date" }] }); }
|
|
352
354
|
}
|
|
353
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
355
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogPostLatestComponent, decorators: [{
|
|
354
356
|
type: Component,
|
|
355
357
|
args: [{ selector: 'ng-rhombus-blog-post-latest', imports: [DatePipe, MatListModule, RouterLink], template: "<mat-nav-list>\r\n <mat-list-item [routerLink]=\"['/blog', blogPost()?.id]\">\r\n <span matListItemTitle>{{ blogPost()?.title }}</span>\r\n <span matListItemLine>{{ blogPost()?.description }}</span>\r\n <span matListItemLine>{{ blogPost()?.timestamp?.toMillis() | date: 'MMMM d, y' }}</span>\r\n </mat-list-item>\r\n</mat-nav-list>", styles: [".mdc-list-item{border-radius:0!important}\n"] }]
|
|
356
|
-
}] });
|
|
358
|
+
}], propDecorators: { blogPost: [{ type: i0.Input, args: [{ isSignal: true, alias: "blogPost", required: false }] }] } });
|
|
357
359
|
|
|
358
360
|
class NgRhombusBlogPostHelper {
|
|
359
361
|
static createSlug(title) {
|
|
@@ -425,10 +427,10 @@ class NgRhombusBlogService {
|
|
|
425
427
|
const blogPostDocumentRef = doc(this.firestore, 'blog', id);
|
|
426
428
|
return deleteDoc(blogPostDocumentRef);
|
|
427
429
|
}
|
|
428
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
429
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
430
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
431
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogService, providedIn: 'root' }); }
|
|
430
432
|
}
|
|
431
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
433
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogService, decorators: [{
|
|
432
434
|
type: Injectable,
|
|
433
435
|
args: [{
|
|
434
436
|
providedIn: 'root',
|
|
@@ -449,10 +451,10 @@ class NgRhombusBlogPostThumbnailService {
|
|
|
449
451
|
}).catch((error) => {
|
|
450
452
|
});
|
|
451
453
|
}
|
|
452
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
453
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
454
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogPostThumbnailService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
455
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogPostThumbnailService, providedIn: 'root' }); }
|
|
454
456
|
}
|
|
455
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
457
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogPostThumbnailService, decorators: [{
|
|
456
458
|
type: Injectable,
|
|
457
459
|
args: [{
|
|
458
460
|
providedIn: 'root'
|
|
@@ -475,17 +477,17 @@ class NgRhombusBlogTableComponent {
|
|
|
475
477
|
onDeleteBlogPost(blogPost) {
|
|
476
478
|
this.deleteEvent.emit(blogPost);
|
|
477
479
|
}
|
|
478
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
479
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
480
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
481
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.4", type: NgRhombusBlogTableComponent, isStandalone: true, selector: "ng-rhombus-blog-table", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { editEvent: "editEvent", deleteEvent: "deleteEvent" }, ngImport: i0, template: "@if (dataSource().length > 0) {\r\n<table mat-table [dataSource]=\"dataSource()\" class=\"w-full h-full\">\r\n\t<!-- Timestamp Column -->\r\n\t<ng-container matColumnDef=\"timestamp\">\r\n\t\t<th mat-header-cell *matHeaderCellDef>Date</th>\r\n\t\t<td mat-cell *matCellDef=\"let element\">{{ element.timestamp.toMillis() | date: 'MMMM d, y' }}</td>\r\n\t</ng-container>\r\n\r\n\t<!-- Title Column -->\r\n\t<ng-container matColumnDef=\"title\">\r\n\t\t<th mat-header-cell *matHeaderCellDef>Title</th>\r\n\t\t<td mat-cell *matCellDef=\"let element\">{{element.title}}</td>\r\n\t</ng-container>\r\n\r\n\t<!-- Description Column -->\r\n\t<ng-container matColumnDef=\"description\">\r\n\t\t<th mat-header-cell *matHeaderCellDef>Description</th>\r\n\t\t<td mat-cell *matCellDef=\"let element\">{{element.description}}</td>\r\n\t</ng-container>\r\n\r\n\t<!-- Edit Column -->\r\n\t<ng-container matColumnDef=\"edit\">\r\n\t\t<th mat-header-cell *matHeaderCellDef aria-label=\"row actions\"> </th>\r\n\t\t<td mat-cell *matCellDef=\"let element\">\r\n\t\t\t<button mat-icon-button (click)=\"goToBlogPost(element.id)\">\r\n\t\t\t\t<mat-icon>edit</mat-icon>\r\n\t\t\t</button>\r\n\t\t</td>\r\n\t</ng-container>\r\n\r\n\t<!-- Delete Column -->\r\n\t<ng-container matColumnDef=\"delete\">\r\n\t\t<th mat-header-cell *matHeaderCellDef aria-label=\"row actions\"> </th>\r\n\t\t<td mat-cell *matCellDef=\"let element\">\r\n\t\t\t<button mat-icon-button (click)=\"onDeleteBlogPost(element)\">\r\n\t\t\t\t<mat-icon>delete</mat-icon>\r\n\t\t\t</button>\r\n\t\t</td>\r\n\t</ng-container>\r\n\r\n\t<tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\r\n\t<tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\r\n</table>\r\n} @else {\r\n<div class=\"empty-set\">\r\n\t<span>No blog posts created yet.</span>\r\n</div>\r\n\r\n}", styles: [".empty-set{margin:12px}.rhombus{overflow-y:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.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.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i3$2.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i3$2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i3$2.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i3$2.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i3$2.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i3$2.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i3$2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i3$2.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i3$2.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i3$2.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "pipe", type: i4$2.DatePipe, name: "date" }] }); }
|
|
480
482
|
}
|
|
481
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
483
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogTableComponent, decorators: [{
|
|
482
484
|
type: Component,
|
|
483
485
|
args: [{ selector: 'ng-rhombus-blog-table', imports: [CommonModule, MatButtonModule, MatIconModule, MatTableModule], template: "@if (dataSource().length > 0) {\r\n<table mat-table [dataSource]=\"dataSource()\" class=\"w-full h-full\">\r\n\t<!-- Timestamp Column -->\r\n\t<ng-container matColumnDef=\"timestamp\">\r\n\t\t<th mat-header-cell *matHeaderCellDef>Date</th>\r\n\t\t<td mat-cell *matCellDef=\"let element\">{{ element.timestamp.toMillis() | date: 'MMMM d, y' }}</td>\r\n\t</ng-container>\r\n\r\n\t<!-- Title Column -->\r\n\t<ng-container matColumnDef=\"title\">\r\n\t\t<th mat-header-cell *matHeaderCellDef>Title</th>\r\n\t\t<td mat-cell *matCellDef=\"let element\">{{element.title}}</td>\r\n\t</ng-container>\r\n\r\n\t<!-- Description Column -->\r\n\t<ng-container matColumnDef=\"description\">\r\n\t\t<th mat-header-cell *matHeaderCellDef>Description</th>\r\n\t\t<td mat-cell *matCellDef=\"let element\">{{element.description}}</td>\r\n\t</ng-container>\r\n\r\n\t<!-- Edit Column -->\r\n\t<ng-container matColumnDef=\"edit\">\r\n\t\t<th mat-header-cell *matHeaderCellDef aria-label=\"row actions\"> </th>\r\n\t\t<td mat-cell *matCellDef=\"let element\">\r\n\t\t\t<button mat-icon-button (click)=\"goToBlogPost(element.id)\">\r\n\t\t\t\t<mat-icon>edit</mat-icon>\r\n\t\t\t</button>\r\n\t\t</td>\r\n\t</ng-container>\r\n\r\n\t<!-- Delete Column -->\r\n\t<ng-container matColumnDef=\"delete\">\r\n\t\t<th mat-header-cell *matHeaderCellDef aria-label=\"row actions\"> </th>\r\n\t\t<td mat-cell *matCellDef=\"let element\">\r\n\t\t\t<button mat-icon-button (click)=\"onDeleteBlogPost(element)\">\r\n\t\t\t\t<mat-icon>delete</mat-icon>\r\n\t\t\t</button>\r\n\t\t</td>\r\n\t</ng-container>\r\n\r\n\t<tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\r\n\t<tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\r\n</table>\r\n} @else {\r\n<div class=\"empty-set\">\r\n\t<span>No blog posts created yet.</span>\r\n</div>\r\n\r\n}", styles: [".empty-set{margin:12px}.rhombus{overflow-y:auto}\n"] }]
|
|
484
486
|
}], propDecorators: { editEvent: [{
|
|
485
487
|
type: Output
|
|
486
488
|
}], deleteEvent: [{
|
|
487
489
|
type: Output
|
|
488
|
-
}] } });
|
|
490
|
+
}], dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: false }] }] } });
|
|
489
491
|
|
|
490
492
|
class NgRhombusBlogThumbnailComponent {
|
|
491
493
|
constructor() {
|
|
@@ -499,19 +501,19 @@ class NgRhombusBlogThumbnailComponent {
|
|
|
499
501
|
if (this.width() === 0 && this.height() === 0) {
|
|
500
502
|
}
|
|
501
503
|
}
|
|
502
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
503
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
504
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogThumbnailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
505
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.4", type: NgRhombusBlogThumbnailComponent, isStandalone: true, selector: "ng-rhombus-blog-thumbnail", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, imageSource: { classPropertyName: "imageSource", publicName: "imageSource", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"image-placeholder\" [style.width]=\"width() + 'px'\" [style.height]=\"height() + 'px'\">\r\n <img [src]=\"contentSource()\" [width]=\"width()\" [height]=\"height()\" />\r\n</div>", styles: [".image-placeholder{box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024,0 1px 18px #0000001f}img{width:100%;height:auto}\n"] }); }
|
|
504
506
|
}
|
|
505
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
507
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogThumbnailComponent, decorators: [{
|
|
506
508
|
type: Component,
|
|
507
509
|
args: [{ selector: 'ng-rhombus-blog-thumbnail', imports: [], template: "<div class=\"image-placeholder\" [style.width]=\"width() + 'px'\" [style.height]=\"height() + 'px'\">\r\n <img [src]=\"contentSource()\" [width]=\"width()\" [height]=\"height()\" />\r\n</div>", styles: [".image-placeholder{box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024,0 1px 18px #0000001f}img{width:100%;height:auto}\n"] }]
|
|
508
|
-
}] });
|
|
510
|
+
}], propDecorators: { width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], imageSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "imageSource", required: false }] }] } });
|
|
509
511
|
|
|
510
512
|
class NgRhombusBlogDeleteThumbnailComponent {
|
|
511
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
512
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
513
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogDeleteThumbnailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
514
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.4", type: NgRhombusBlogDeleteThumbnailComponent, isStandalone: true, selector: "ng-rhombus-Blog-delete-thumbnail", ngImport: i0, template: "<h2 mat-dialog-title>Blog Post Thumbnail - Delete</h2>\r\n<mat-dialog-content>\r\n <p>Would you like to delete this thumbnail?</p>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n <button mat-button [mat-dialog-close]=\"false\" cdkFocusInitial>Cancel</button>\r\n <button mat-button [mat-dialog-close]=\"true\">Confirm</button>\r\n</mat-dialog-actions>", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.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: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i2$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i2$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i2$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i2$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }] }); }
|
|
513
515
|
}
|
|
514
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
516
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogDeleteThumbnailComponent, decorators: [{
|
|
515
517
|
type: Component,
|
|
516
518
|
args: [{ selector: 'ng-rhombus-Blog-delete-thumbnail', imports: [MatButtonModule, MatDialogModule], template: "<h2 mat-dialog-title>Blog Post Thumbnail - Delete</h2>\r\n<mat-dialog-content>\r\n <p>Would you like to delete this thumbnail?</p>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n <button mat-button [mat-dialog-close]=\"false\" cdkFocusInitial>Cancel</button>\r\n <button mat-button [mat-dialog-close]=\"true\">Confirm</button>\r\n</mat-dialog-actions>" }]
|
|
517
519
|
}] });
|
|
@@ -554,16 +556,16 @@ class ThumbnailControlComponent {
|
|
|
554
556
|
}
|
|
555
557
|
});
|
|
556
558
|
}
|
|
557
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
558
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
559
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: ThumbnailControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
560
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.4", type: ThumbnailControlComponent, isStandalone: true, selector: "ng-rhombus-thumbnail-control", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, thumbnailSrc: { classPropertyName: "thumbnailSrc", publicName: "thumbnailSrc", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onFileUploaded: "onFileUploaded", onFileDeleted: "onFileDeleted" }, viewQueries: [{ propertyName: "thumbnailInput", first: true, predicate: ["thumbnailInput"], descendants: true }], ngImport: i0, template: "<div class=\"thumbnail-control-wrapper\">\r\n <input #thumbnailInput hidden type=\"file\" (change)=\"onThumbnailSelected(thumbnailInput)\" />\r\n <button mat-icon-button [disabled]=\"uploadedFile() || disabled()\" (click)=\"thumbnailInput.click()\" type=\"button\">\r\n <mat-icon>upload_file</mat-icon>\r\n </button>\r\n <button class=\"delete-button\" mat-icon-button [disabled]=\"!uploadedFile()\" (click)=\"onThumbnailDeleted()\"\r\n type=\"button\">\r\n <mat-icon>delete</mat-icon>\r\n </button>\r\n <div class=\"flex\"></div>\r\n <!-- <div class=\"image-placeholder\" [style.width]=\"width() + 'px'\" [style.height]=\"height() + 'px'\">\r\n <img [src]=\"imageSource()\" [width]=\"width()\" [height]=\"height()\" />\r\n </div> -->\r\n <ng-rhombus-blog-thumbnail [imageSource]=\"thumbnailSrc()\" [width]=\"width()\" [height]=\"height()\"\r\n [imageSource]=\"imageSource()\"></ng-rhombus-blog-thumbnail>\r\n</div>", styles: [".thumbnail-control-wrapper{display:flex;flex:1;align-items:center;padding-bottom:20px}.flex{flex:1 1 auto}.image-placeholder{box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024,0 1px 18px #0000001f}.delete-button{margin-left:12px}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.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.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: NgRhombusBlogThumbnailComponent, selector: "ng-rhombus-blog-thumbnail", inputs: ["width", "height", "imageSource"] }] }); }
|
|
559
561
|
}
|
|
560
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
562
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: ThumbnailControlComponent, decorators: [{
|
|
561
563
|
type: Component,
|
|
562
|
-
args: [{ selector: 'ng-rhombus-thumbnail-control', imports: [
|
|
563
|
-
}], propDecorators: { thumbnailInput: [{
|
|
564
|
+
args: [{ selector: 'ng-rhombus-thumbnail-control', imports: [MatButtonModule, MatIconModule, NgRhombusBlogThumbnailComponent], template: "<div class=\"thumbnail-control-wrapper\">\r\n <input #thumbnailInput hidden type=\"file\" (change)=\"onThumbnailSelected(thumbnailInput)\" />\r\n <button mat-icon-button [disabled]=\"uploadedFile() || disabled()\" (click)=\"thumbnailInput.click()\" type=\"button\">\r\n <mat-icon>upload_file</mat-icon>\r\n </button>\r\n <button class=\"delete-button\" mat-icon-button [disabled]=\"!uploadedFile()\" (click)=\"onThumbnailDeleted()\"\r\n type=\"button\">\r\n <mat-icon>delete</mat-icon>\r\n </button>\r\n <div class=\"flex\"></div>\r\n <!-- <div class=\"image-placeholder\" [style.width]=\"width() + 'px'\" [style.height]=\"height() + 'px'\">\r\n <img [src]=\"imageSource()\" [width]=\"width()\" [height]=\"height()\" />\r\n </div> -->\r\n <ng-rhombus-blog-thumbnail [imageSource]=\"thumbnailSrc()\" [width]=\"width()\" [height]=\"height()\"\r\n [imageSource]=\"imageSource()\"></ng-rhombus-blog-thumbnail>\r\n</div>", styles: [".thumbnail-control-wrapper{display:flex;flex:1;align-items:center;padding-bottom:20px}.flex{flex:1 1 auto}.image-placeholder{box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024,0 1px 18px #0000001f}.delete-button{margin-left:12px}\n"] }]
|
|
565
|
+
}], propDecorators: { width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], thumbnailSrc: [{ type: i0.Input, args: [{ isSignal: true, alias: "thumbnailSrc", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], thumbnailInput: [{
|
|
564
566
|
type: ViewChild,
|
|
565
567
|
args: ['thumbnailInput']
|
|
566
|
-
}] } });
|
|
568
|
+
}], onFileUploaded: [{ type: i0.Output, args: ["onFileUploaded"] }], onFileDeleted: [{ type: i0.Output, args: ["onFileDeleted"] }] } });
|
|
567
569
|
|
|
568
570
|
class IBlog {
|
|
569
571
|
}
|
|
@@ -572,10 +574,10 @@ class NgRhombusBlogConfirmationComponent {
|
|
|
572
574
|
constructor() {
|
|
573
575
|
this.data = inject(MAT_DIALOG_DATA);
|
|
574
576
|
}
|
|
575
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
576
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
577
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogConfirmationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
578
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.4", type: NgRhombusBlogConfirmationComponent, isStandalone: true, selector: "ng-rhombus-blog-confirmation", ngImport: i0, template: "<h2 mat-dialog-title>{{ data.header }}</h2>\r\n<mat-dialog-content>\r\n <p>{{ data.query }}</p>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n <button mat-button [mat-dialog-close]=\"false\" cdkFocusInitial>Cancel</button>\r\n <button mat-button [mat-dialog-close]=\"true\">Confirm</button>\r\n</mat-dialog-actions>", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.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: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i2$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i2$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i2$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i2$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }] }); }
|
|
577
579
|
}
|
|
578
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
580
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogConfirmationComponent, decorators: [{
|
|
579
581
|
type: Component,
|
|
580
582
|
args: [{ selector: 'ng-rhombus-blog-confirmation', imports: [MatButtonModule, MatDialogModule], template: "<h2 mat-dialog-title>{{ data.header }}</h2>\r\n<mat-dialog-content>\r\n <p>{{ data.query }}</p>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n <button mat-button [mat-dialog-close]=\"false\" cdkFocusInitial>Cancel</button>\r\n <button mat-button [mat-dialog-close]=\"true\">Confirm</button>\r\n</mat-dialog-actions>" }]
|
|
581
583
|
}] });
|
|
@@ -703,13 +705,13 @@ class NgRhombusBlogAddEditComponent {
|
|
|
703
705
|
submittedBlogPost.content = rawData.content;
|
|
704
706
|
this.submitEvent.emit(submittedBlogPost);
|
|
705
707
|
}
|
|
706
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
707
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
708
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogAddEditComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
709
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.4", type: NgRhombusBlogAddEditComponent, isStandalone: true, selector: "ng-rhombus-blog-form", inputs: { blogPost: { classPropertyName: "blogPost", publicName: "blogPost", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cancelEvent: "cancelEvent", submitEvent: "submitEvent" }, viewQueries: [{ propertyName: "autosize", first: true, predicate: ["autosize"], descendants: true }, { propertyName: "blogPostPreview", first: true, predicate: ["blogPost"], descendants: true }], ngImport: i0, template: "<div class=\"h-full flex flex-row\">\r\n\t<div class=\"flex flex-col w-1/2 p-4\">\r\n\t\t<form novalidate class=\"h-full flex flex-col\" [formGroup]=\"blogPostForm\">\r\n\t\t\t<mat-form-field>\r\n\t\t\t\t<mat-label>Title</mat-label>\r\n\t\t\t\t<input matInput placeholder=\"Placeholder\" formControlName=\"title\">\r\n\t\t\t</mat-form-field>\r\n\t\t\t<mat-form-field>\r\n\t\t\t\t<mat-label>Description</mat-label>\r\n\t\t\t\t<input matInput placeholder=\"Placeholder\" formControlName=\"description\">\r\n\t\t\t</mat-form-field>\r\n\t\t\t<ng-rhombus-thumbnail-control [thumbnailSrc]=\"thumbnailSource\" [width]=\"200\" [height]=\"112\"\r\n\t\t\t\t[disabled]=\"blogPost() !== undefined\" (onFileUploaded)=\"onFileUploaded($event)\"\r\n\t\t\t\t(onFileDeleted)=\"onFileDeleted()\"></ng-rhombus-thumbnail-control>\r\n\t\t\t<mat-form-field class=\"h-full\">\r\n\t\t\t\t<mat-label>Content</mat-label>\r\n\t\t\t\t<textarea matInput required cdkTextareaAutosize #autosize=\"cdkTextareaAutosize\" cdkAutosizeMinRows=\"1\"\r\n\t\t\t\t\tcdkAutosizeMaxRows=\"20\" formControlName=\"content\" (keyup)=\"onContentChange()\"></textarea>\r\n\t\t\t</mat-form-field>\r\n\t\t\t<div class=\"flex\">\r\n\t\t\t\t<button mat-raised-button class=\"\" (click)=\"onCancelClick()\" type=\"button\">Cancel</button>\r\n\t\t\t\t<div class=\"flex-1\"></div>\r\n\t\t\t\t<button mat-flat-button [disabled]=\"blogPostForm.invalid\" type=\"button\"\r\n\t\t\t\t\t(click)=\"onSubmit()\">Submit</button>\r\n\t\t\t</div>\r\n\t\t</form>\r\n\t</div>\r\n\r\n\t<div class=\"flex flex-col w-1/2 p-4 overflow-y-auto\">\r\n\t\t<mat-card>\r\n\t\t\t<mat-card-header>\r\n\t\t\t\t<mat-card-title>{{ blogPostForm.getRawValue().title }}</mat-card-title>\r\n\t\t\t\t<mat-card-subtitle>{{ blogPostForm.getRawValue().description }}</mat-card-subtitle>\r\n\t\t\t</mat-card-header>\r\n\t\t\t<img [src]=\"blogPostForm.getRawValue().thumbnail\" />\r\n\t\t\t<mat-card-content>\r\n\t\t\t\t<markdown class=\"prose\" [data]=\"contentData()\" />\r\n\t\t\t</mat-card-content>\r\n\t\t</mat-card>\r\n\t</div>\r\n</div>", styles: [""], dependencies: [{ kind: "ngmodule", type: MatListModule }, { kind: "ngmodule", type: MatDividerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.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: "ngmodule", type: MatCardModule }, { kind: "component", type: i4$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i4$1.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i4$1.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i4$1.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { kind: "directive", type: i4$1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7.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: i5$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "ngmodule", type: MatSidenavModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i6.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "component", type: ThumbnailControlComponent, selector: "ng-rhombus-thumbnail-control", inputs: ["width", "height", "thumbnailSrc", "disabled"], outputs: ["onFileUploaded", "onFileDeleted"] }, { kind: "ngmodule", type: MatToolbarModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: MarkdownComponent, selector: "markdown, [markdown]", inputs: ["data", "src", "disableSanitizer", "inline", "clipboard", "clipboardButtonComponent", "clipboardButtonTemplate", "emoji", "katex", "katexOptions", "mermaid", "mermaidOptions", "lineHighlight", "line", "lineOffset", "lineNumbers", "start", "commandLine", "filterOutput", "host", "prompt", "output", "user"], outputs: ["error", "load", "ready"] }] }); }
|
|
708
710
|
}
|
|
709
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
711
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogAddEditComponent, decorators: [{
|
|
710
712
|
type: Component,
|
|
711
|
-
args: [{ selector: 'ng-rhombus-blog-form', imports: [MatListModule, MatDividerModule,
|
|
712
|
-
}], ctorParameters: () => [], propDecorators: { autosize: [{
|
|
713
|
+
args: [{ selector: 'ng-rhombus-blog-form', imports: [MatListModule, MatDividerModule, MatButtonModule, MatCardModule, MatFormFieldModule, MatInputModule, MatProgressSpinnerModule, MatSidenavModule, ReactiveFormsModule, TextFieldModule, ThumbnailControlComponent, MatToolbarModule, MatIconModule, MarkdownComponent], template: "<div class=\"h-full flex flex-row\">\r\n\t<div class=\"flex flex-col w-1/2 p-4\">\r\n\t\t<form novalidate class=\"h-full flex flex-col\" [formGroup]=\"blogPostForm\">\r\n\t\t\t<mat-form-field>\r\n\t\t\t\t<mat-label>Title</mat-label>\r\n\t\t\t\t<input matInput placeholder=\"Placeholder\" formControlName=\"title\">\r\n\t\t\t</mat-form-field>\r\n\t\t\t<mat-form-field>\r\n\t\t\t\t<mat-label>Description</mat-label>\r\n\t\t\t\t<input matInput placeholder=\"Placeholder\" formControlName=\"description\">\r\n\t\t\t</mat-form-field>\r\n\t\t\t<ng-rhombus-thumbnail-control [thumbnailSrc]=\"thumbnailSource\" [width]=\"200\" [height]=\"112\"\r\n\t\t\t\t[disabled]=\"blogPost() !== undefined\" (onFileUploaded)=\"onFileUploaded($event)\"\r\n\t\t\t\t(onFileDeleted)=\"onFileDeleted()\"></ng-rhombus-thumbnail-control>\r\n\t\t\t<mat-form-field class=\"h-full\">\r\n\t\t\t\t<mat-label>Content</mat-label>\r\n\t\t\t\t<textarea matInput required cdkTextareaAutosize #autosize=\"cdkTextareaAutosize\" cdkAutosizeMinRows=\"1\"\r\n\t\t\t\t\tcdkAutosizeMaxRows=\"20\" formControlName=\"content\" (keyup)=\"onContentChange()\"></textarea>\r\n\t\t\t</mat-form-field>\r\n\t\t\t<div class=\"flex\">\r\n\t\t\t\t<button mat-raised-button class=\"\" (click)=\"onCancelClick()\" type=\"button\">Cancel</button>\r\n\t\t\t\t<div class=\"flex-1\"></div>\r\n\t\t\t\t<button mat-flat-button [disabled]=\"blogPostForm.invalid\" type=\"button\"\r\n\t\t\t\t\t(click)=\"onSubmit()\">Submit</button>\r\n\t\t\t</div>\r\n\t\t</form>\r\n\t</div>\r\n\r\n\t<div class=\"flex flex-col w-1/2 p-4 overflow-y-auto\">\r\n\t\t<mat-card>\r\n\t\t\t<mat-card-header>\r\n\t\t\t\t<mat-card-title>{{ blogPostForm.getRawValue().title }}</mat-card-title>\r\n\t\t\t\t<mat-card-subtitle>{{ blogPostForm.getRawValue().description }}</mat-card-subtitle>\r\n\t\t\t</mat-card-header>\r\n\t\t\t<img [src]=\"blogPostForm.getRawValue().thumbnail\" />\r\n\t\t\t<mat-card-content>\r\n\t\t\t\t<markdown class=\"prose\" [data]=\"contentData()\" />\r\n\t\t\t</mat-card-content>\r\n\t\t</mat-card>\r\n\t</div>\r\n</div>" }]
|
|
714
|
+
}], ctorParameters: () => [], propDecorators: { blogPost: [{ type: i0.Input, args: [{ isSignal: true, alias: "blogPost", required: false }] }], cancelEvent: [{ type: i0.Output, args: ["cancelEvent"] }], submitEvent: [{ type: i0.Output, args: ["submitEvent"] }], autosize: [{
|
|
713
715
|
type: ViewChild,
|
|
714
716
|
args: ['autosize']
|
|
715
717
|
}], blogPostPreview: [{
|
|
@@ -721,19 +723,19 @@ class NgRhombusBlogPostComponent {
|
|
|
721
723
|
constructor() {
|
|
722
724
|
this.dataSource = input(...(ngDevMode ? [undefined, { debugName: "dataSource" }] : []));
|
|
723
725
|
}
|
|
724
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
725
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
726
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogPostComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
727
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.4", type: NgRhombusBlogPostComponent, isStandalone: true, selector: "ng-rhombus-blog-post", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<<<<<<< HEAD\r\n\r\n<mat-card>\r\n\t<mat-card-header>\r\n\t\t<mat-card-title>{{ dataSource()?.title }}</mat-card-title>\r\n\t\t<mat-card-subtitle>{{ dataSource()?.description }}</mat-card-subtitle>\r\n\t</mat-card-header>\r\n\t<img [src]=\"dataSource()?.thumbnail\" />\r\n\t<mat-card-content>\r\n\t\t<markdown class=\"prose\" [data]=\"dataSource()?.content\" />\r\n\t</mat-card-content>", styles: [""], dependencies: [{ kind: "component", type: MarkdownComponent, selector: "markdown, [markdown]", inputs: ["data", "src", "disableSanitizer", "inline", "clipboard", "clipboardButtonComponent", "clipboardButtonTemplate", "emoji", "katex", "katexOptions", "mermaid", "mermaidOptions", "lineHighlight", "line", "lineOffset", "lineNumbers", "start", "commandLine", "filterOutput", "host", "prompt", "output", "user"], outputs: ["error", "load", "ready"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i4$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i4$1.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i4$1.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i4$1.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { kind: "directive", type: i4$1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }] }); }
|
|
726
728
|
}
|
|
727
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
729
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogPostComponent, decorators: [{
|
|
728
730
|
type: Component,
|
|
729
731
|
args: [{ selector: 'ng-rhombus-blog-post', imports: [MarkdownComponent, MatCardModule], template: "<<<<<<< HEAD\r\n\r\n<mat-card>\r\n\t<mat-card-header>\r\n\t\t<mat-card-title>{{ dataSource()?.title }}</mat-card-title>\r\n\t\t<mat-card-subtitle>{{ dataSource()?.description }}</mat-card-subtitle>\r\n\t</mat-card-header>\r\n\t<img [src]=\"dataSource()?.thumbnail\" />\r\n\t<mat-card-content>\r\n\t\t<markdown class=\"prose\" [data]=\"dataSource()?.content\" />\r\n\t</mat-card-content>" }]
|
|
730
|
-
}] });
|
|
732
|
+
}], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: false }] }] } });
|
|
731
733
|
|
|
732
734
|
class NgRhombusBlogDeletePostComponent {
|
|
733
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
734
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
735
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogDeletePostComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
736
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.4", type: NgRhombusBlogDeletePostComponent, isStandalone: true, selector: "ng-rhombus-Blog-delete-post", ngImport: i0, template: "<h2 mat-dialog-title>Blog Post - Delete</h2>\r\n<mat-dialog-content>\r\n <p>Would you like to delete this blog post?</p>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n <button mat-button [mat-dialog-close]=\"false\" cdkFocusInitial>Cancel</button>\r\n <button mat-button [mat-dialog-close]=\"true\">Confirm</button>\r\n</mat-dialog-actions>", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.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: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i2$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i2$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i2$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i2$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }] }); }
|
|
735
737
|
}
|
|
736
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
738
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusBlogDeletePostComponent, decorators: [{
|
|
737
739
|
type: Component,
|
|
738
740
|
args: [{ selector: 'ng-rhombus-Blog-delete-post', imports: [MatButtonModule, MatDialogModule], template: "<h2 mat-dialog-title>Blog Post - Delete</h2>\r\n<mat-dialog-content>\r\n <p>Would you like to delete this blog post?</p>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n <button mat-button [mat-dialog-close]=\"false\" cdkFocusInitial>Cancel</button>\r\n <button mat-button [mat-dialog-close]=\"true\">Confirm</button>\r\n</mat-dialog-actions>" }]
|
|
739
741
|
}] });
|
|
@@ -783,13 +785,13 @@ class NgRhombusHomeAdminComponent {
|
|
|
783
785
|
onCancelClick() {
|
|
784
786
|
console.log('cancel');
|
|
785
787
|
}
|
|
786
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
787
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
788
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusHomeAdminComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
789
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.4", type: NgRhombusHomeAdminComponent, isStandalone: true, selector: "ng-rhombus-home-admin", inputs: { formAdminData: { classPropertyName: "formAdminData", publicName: "formAdminData", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cancelEvent: "cancelEvent", submitEvent: "submitEvent" }, ngImport: i0, template: "<mat-toolbar class=\"header-theme\">\r\n\t<span>Admin Component</span>\r\n</mat-toolbar>\r\n<div class=\"h-full flex flex-row\">\r\n\t<div class=\"flex flex-col w-1/2 p-4\">\r\n\t\t<form novalidate class=\"h-full flex flex-col\" [formGroup]=\"homeAdminForm\">\r\n\t\t\t<mat-form-field>\r\n\t\t\t\t<mat-label>Title</mat-label>\r\n\t\t\t\t<input matInput placeholder=\"Placeholder\" formControlName=\"title\">\r\n\t\t\t</mat-form-field>\r\n\t\t\t<mat-form-field>\r\n\t\t\t\t<mat-label>Description</mat-label>\r\n\t\t\t\t<input matInput placeholder=\"Placeholder\" formControlName=\"description\">\r\n\t\t\t</mat-form-field>\r\n\r\n\t\t\t<div class=\"flex\">\r\n\t\t\t\t<button mat-raised-button class=\"\" (click)=\"onCancelClick()\" type=\"button\">Cancel</button>\r\n\t\t\t\t<div class=\"flex-1\"></div>\r\n\t\t\t\t<button mat-flat-button [disabled]=\"homeAdminForm.invalid\" type=\"button\"\r\n\t\t\t\t\t(click)=\"onSubmit()\">Submit</button>\r\n\t\t\t</div>\r\n\t\t</form>\r\n\t</div>\r\n</div>", styles: [":host{height:100%;width:100%;box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024,0 1px 18px #0000001f}.header-theme{--mat-toolbar-container-background-color: var(--mat-sys-outline);--mat-toolbar-container-text-color: var(--mat-sys-on-primary);--mat-icon-button-icon-color: var(--mat-sys-on-primary)}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.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: "ngmodule", type: MatToolbarModule }, { kind: "component", type: i2$2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i6.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7.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"] }] }); }
|
|
788
790
|
}
|
|
789
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
791
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusHomeAdminComponent, decorators: [{
|
|
790
792
|
type: Component,
|
|
791
793
|
args: [{ selector: 'ng-rhombus-home-admin', imports: [MatButtonModule, MatToolbarModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule], template: "<mat-toolbar class=\"header-theme\">\r\n\t<span>Admin Component</span>\r\n</mat-toolbar>\r\n<div class=\"h-full flex flex-row\">\r\n\t<div class=\"flex flex-col w-1/2 p-4\">\r\n\t\t<form novalidate class=\"h-full flex flex-col\" [formGroup]=\"homeAdminForm\">\r\n\t\t\t<mat-form-field>\r\n\t\t\t\t<mat-label>Title</mat-label>\r\n\t\t\t\t<input matInput placeholder=\"Placeholder\" formControlName=\"title\">\r\n\t\t\t</mat-form-field>\r\n\t\t\t<mat-form-field>\r\n\t\t\t\t<mat-label>Description</mat-label>\r\n\t\t\t\t<input matInput placeholder=\"Placeholder\" formControlName=\"description\">\r\n\t\t\t</mat-form-field>\r\n\r\n\t\t\t<div class=\"flex\">\r\n\t\t\t\t<button mat-raised-button class=\"\" (click)=\"onCancelClick()\" type=\"button\">Cancel</button>\r\n\t\t\t\t<div class=\"flex-1\"></div>\r\n\t\t\t\t<button mat-flat-button [disabled]=\"homeAdminForm.invalid\" type=\"button\"\r\n\t\t\t\t\t(click)=\"onSubmit()\">Submit</button>\r\n\t\t\t</div>\r\n\t\t</form>\r\n\t</div>\r\n</div>", styles: [":host{height:100%;width:100%;box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024,0 1px 18px #0000001f}.header-theme{--mat-toolbar-container-background-color: var(--mat-sys-outline);--mat-toolbar-container-text-color: var(--mat-sys-on-primary);--mat-icon-button-icon-color: var(--mat-sys-on-primary)}\n"] }]
|
|
792
|
-
}] });
|
|
794
|
+
}], propDecorators: { formAdminData: [{ type: i0.Input, args: [{ isSignal: true, alias: "formAdminData", required: false }] }], cancelEvent: [{ type: i0.Output, args: ["cancelEvent"] }], submitEvent: [{ type: i0.Output, args: ["submitEvent"] }] } });
|
|
793
795
|
|
|
794
796
|
// ...existing code...
|
|
795
797
|
var SocialsSource;
|
|
@@ -840,10 +842,10 @@ class NgRhombusSocialsService {
|
|
|
840
842
|
await deleteDoc(ref);
|
|
841
843
|
this.socials.set(this.socials().filter(s => s.id !== id));
|
|
842
844
|
}
|
|
843
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
844
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
845
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusSocialsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
846
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusSocialsService, providedIn: 'root' }); }
|
|
845
847
|
}
|
|
846
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
848
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusSocialsService, decorators: [{
|
|
847
849
|
type: Injectable,
|
|
848
850
|
args: [{ providedIn: 'root' }]
|
|
849
851
|
}] });
|
|
@@ -868,13 +870,13 @@ class NgRhombusSocialsListComponent {
|
|
|
868
870
|
return;
|
|
869
871
|
window.open(url, '_blank', 'noopener');
|
|
870
872
|
}
|
|
871
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
872
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
873
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusSocialsListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
874
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.4", type: NgRhombusSocialsListComponent, isStandalone: true, selector: "ng-rhombus-socials-list", inputs: { socials: { classPropertyName: "socials", publicName: "socials", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if ((socials()).length === 0) {\r\n<p>No socials found.</p>\r\n} @else {\r\n<div class=\"toolbar-list\">\r\n @for (s of socials(); track s.id) {\r\n <mat-toolbar class=\"social-toolbar actionable\" color=\"primary\" role=\"button\" tabindex=\"0\" (click)=\"openUrl(s.url)\"\r\n aria-label=\"Open {{ s.source }} link\">\r\n <mat-icon class=\"left\">{{ iconFor(s.source) }}</mat-icon>\r\n <span class=\"center\">{{ s.source }}</span>\r\n @if (s.url) {\r\n <mat-icon class=\"right\">open_in_new</mat-icon>\r\n }\r\n </mat-toolbar>\r\n }\r\n</div>\r\n}", styles: [".social-toolbar{--mat-toolbar-container-background-color: var(--mat-sys-surface);--mat-toolbar-container-text-color: var(--mat-sys-on-surface);--mat-icon-button-icon-color: var(--mat-sys-on-surface);box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024,0 1px 18px #0000001f;display:grid;grid-template-columns:auto 1fr auto;align-items:center;min-height:48px;width:100%}.toolbar-list{display:grid;gap:8px;margin:12px}.actionable{cursor:pointer;transition:background-color .14s ease,box-shadow .14s ease}.actionable:hover{filter:brightness(1.08);box-shadow:0 2px 6px #00000026}.actionable:focus{outline:2px solid rgba(255,255,255,.8);outline-offset:2px}.left{margin-right:8px}.center{text-align:center}.right{display:inline-flex;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: MatToolbarModule }, { kind: "component", type: i2$2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
|
|
873
875
|
}
|
|
874
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
876
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusSocialsListComponent, decorators: [{
|
|
875
877
|
type: Component,
|
|
876
878
|
args: [{ selector: 'ng-rhombus-socials-list', standalone: true, imports: [MatToolbarModule, MatIconModule], template: "@if ((socials()).length === 0) {\r\n<p>No socials found.</p>\r\n} @else {\r\n<div class=\"toolbar-list\">\r\n @for (s of socials(); track s.id) {\r\n <mat-toolbar class=\"social-toolbar actionable\" color=\"primary\" role=\"button\" tabindex=\"0\" (click)=\"openUrl(s.url)\"\r\n aria-label=\"Open {{ s.source }} link\">\r\n <mat-icon class=\"left\">{{ iconFor(s.source) }}</mat-icon>\r\n <span class=\"center\">{{ s.source }}</span>\r\n @if (s.url) {\r\n <mat-icon class=\"right\">open_in_new</mat-icon>\r\n }\r\n </mat-toolbar>\r\n }\r\n</div>\r\n}", styles: [".social-toolbar{--mat-toolbar-container-background-color: var(--mat-sys-surface);--mat-toolbar-container-text-color: var(--mat-sys-on-surface);--mat-icon-button-icon-color: var(--mat-sys-on-surface);box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024,0 1px 18px #0000001f;display:grid;grid-template-columns:auto 1fr auto;align-items:center;min-height:48px;width:100%}.toolbar-list{display:grid;gap:8px;margin:12px}.actionable{cursor:pointer;transition:background-color .14s ease,box-shadow .14s ease}.actionable:hover{filter:brightness(1.08);box-shadow:0 2px 6px #00000026}.actionable:focus{outline:2px solid rgba(255,255,255,.8);outline-offset:2px}.left{margin-right:8px}.center{text-align:center}.right{display:inline-flex;align-items:center}\n"] }]
|
|
877
|
-
}] });
|
|
879
|
+
}], propDecorators: { socials: [{ type: i0.Input, args: [{ isSignal: true, alias: "socials", required: false }] }] } });
|
|
878
880
|
|
|
879
881
|
class NgRhombusSocialsTableComponent {
|
|
880
882
|
constructor() {
|
|
@@ -925,13 +927,13 @@ class NgRhombusSocialsTableComponent {
|
|
|
925
927
|
async delete(row) {
|
|
926
928
|
await this.svc.remove(row.id);
|
|
927
929
|
}
|
|
928
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
929
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
930
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusSocialsTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
931
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.4", type: NgRhombusSocialsTableComponent, isStandalone: true, selector: "ng-rhombus-socials-table", inputs: { socials: { classPropertyName: "socials", publicName: "socials", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"actions-bar\">\r\n <button mat-button color=\"primary\" (click)=\"startCreate()\">\r\n <mat-icon>add</mat-icon> Add Social\r\n </button>\r\n</div>\r\n\r\n<table mat-table [dataSource]=\"socials()\" class=\"mat-elevation-z1\">\r\n <ng-container matColumnDef=\"id\">\r\n <th mat-header-cell *matHeaderCellDef>ID</th>\r\n <td mat-cell *matCellDef=\"let s\">{{ s.id }}</td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"source\">\r\n <th mat-header-cell *matHeaderCellDef>Source</th>\r\n <td mat-cell *matCellDef=\"let s\">{{ s.source }}</td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"url\">\r\n <th mat-header-cell *matHeaderCellDef>URL</th>\r\n <td mat-cell *matCellDef=\"let s\">\r\n <a [href]=\"s.url\" target=\"_blank\" rel=\"noopener\">{{ s.url }}</a>\r\n </td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"actions\">\r\n <th mat-header-cell *matHeaderCellDef>Actions</th>\r\n <td mat-cell *matCellDef=\"let s\">\r\n <button mat-icon-button color=\"primary\" (click)=\"startEdit(s)\"><mat-icon>edit</mat-icon></button>\r\n <button mat-icon-button color=\"warn\" (click)=\"delete(s)\"><mat-icon>delete</mat-icon></button>\r\n </td>\r\n </ng-container>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\r\n</table>\r\n\r\n@if (editingId() !== null) {\r\n<form class=\"edit-form\" [formGroup]=\"form\" (ngSubmit)=\"save()\">\r\n <h3>{{ editingId() === '' ? 'Create Social' : 'Edit Social' }}</h3>\r\n\r\n <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n <mat-label>Source</mat-label>\r\n <mat-select formControlName=\"source\">\r\n @for (opt of socialTypeOptions; track opt.value) {\r\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\r\n }\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <div class=\"form-row\">\r\n <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n <mat-label>URL</mat-label>\r\n <input matInput formControlName=\"url\" placeholder=\"https://example.com/handle\">\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"form-actions\">\r\n <button mat-button type=\"submit\" color=\"primary\">Save</button>\r\n <button mat-button type=\"button\" (click)=\"cancelEdit()\">Cancel</button>\r\n </div>\r\n</form>\r\n}\r\n\r\n@if ((socials()).length === 0) {\r\n<p>No socials found.</p>\r\n}", styles: [".full-width{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i3$2.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i3$2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i3$2.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i3$2.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i3$2.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i3$2.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i3$2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i3$2.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i3$2.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i3$2.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.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$1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "component", type: i4$3.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: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i6.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7.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"] }] }); }
|
|
930
932
|
}
|
|
931
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
933
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.4", ngImport: i0, type: NgRhombusSocialsTableComponent, decorators: [{
|
|
932
934
|
type: Component,
|
|
933
935
|
args: [{ selector: 'ng-rhombus-socials-table', standalone: true, imports: [MatTableModule, MatButtonModule, MatSelectModule, MatIconModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule], template: "<div class=\"actions-bar\">\r\n <button mat-button color=\"primary\" (click)=\"startCreate()\">\r\n <mat-icon>add</mat-icon> Add Social\r\n </button>\r\n</div>\r\n\r\n<table mat-table [dataSource]=\"socials()\" class=\"mat-elevation-z1\">\r\n <ng-container matColumnDef=\"id\">\r\n <th mat-header-cell *matHeaderCellDef>ID</th>\r\n <td mat-cell *matCellDef=\"let s\">{{ s.id }}</td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"source\">\r\n <th mat-header-cell *matHeaderCellDef>Source</th>\r\n <td mat-cell *matCellDef=\"let s\">{{ s.source }}</td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"url\">\r\n <th mat-header-cell *matHeaderCellDef>URL</th>\r\n <td mat-cell *matCellDef=\"let s\">\r\n <a [href]=\"s.url\" target=\"_blank\" rel=\"noopener\">{{ s.url }}</a>\r\n </td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"actions\">\r\n <th mat-header-cell *matHeaderCellDef>Actions</th>\r\n <td mat-cell *matCellDef=\"let s\">\r\n <button mat-icon-button color=\"primary\" (click)=\"startEdit(s)\"><mat-icon>edit</mat-icon></button>\r\n <button mat-icon-button color=\"warn\" (click)=\"delete(s)\"><mat-icon>delete</mat-icon></button>\r\n </td>\r\n </ng-container>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\r\n</table>\r\n\r\n@if (editingId() !== null) {\r\n<form class=\"edit-form\" [formGroup]=\"form\" (ngSubmit)=\"save()\">\r\n <h3>{{ editingId() === '' ? 'Create Social' : 'Edit Social' }}</h3>\r\n\r\n <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n <mat-label>Source</mat-label>\r\n <mat-select formControlName=\"source\">\r\n @for (opt of socialTypeOptions; track opt.value) {\r\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\r\n }\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <div class=\"form-row\">\r\n <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n <mat-label>URL</mat-label>\r\n <input matInput formControlName=\"url\" placeholder=\"https://example.com/handle\">\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"form-actions\">\r\n <button mat-button type=\"submit\" color=\"primary\">Save</button>\r\n <button mat-button type=\"button\" (click)=\"cancelEdit()\">Cancel</button>\r\n </div>\r\n</form>\r\n}\r\n\r\n@if ((socials()).length === 0) {\r\n<p>No socials found.</p>\r\n}", styles: [".full-width{width:100%}\n"] }]
|
|
934
|
-
}] });
|
|
936
|
+
}], propDecorators: { socials: [{ type: i0.Input, args: [{ isSignal: true, alias: "socials", required: false }] }] } });
|
|
935
937
|
|
|
936
938
|
/*
|
|
937
939
|
* Public API Surface of @doug-williamson/ng-rhombus
|