@rolatech/angular-community 20.2.9-beta.7 → 20.3.0-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (18) hide show
  1. package/fesm2022/rolatech-angular-community-community-details.component-B4kDYAna.mjs +46 -0
  2. package/fesm2022/rolatech-angular-community-community-details.component-B4kDYAna.mjs.map +1 -0
  3. package/fesm2022/rolatech-angular-community-community-index.component-CJ_ddZSo.mjs +65 -0
  4. package/fesm2022/rolatech-angular-community-community-index.component-CJ_ddZSo.mjs.map +1 -0
  5. package/fesm2022/rolatech-angular-community-community-manage-index.component-CQYy_iI7.mjs +68 -0
  6. package/fesm2022/rolatech-angular-community-community-manage-index.component-CQYy_iI7.mjs.map +1 -0
  7. package/fesm2022/rolatech-angular-community-community-manage-post-details.component-B70ewcPc.mjs +70 -0
  8. package/fesm2022/rolatech-angular-community-community-manage-post-details.component-B70ewcPc.mjs.map +1 -0
  9. package/fesm2022/rolatech-angular-community-community-manage-post.component-DVRDQzXA.mjs +137 -0
  10. package/fesm2022/rolatech-angular-community-community-manage-post.component-DVRDQzXA.mjs.map +1 -0
  11. package/fesm2022/rolatech-angular-community-rolatech-angular-community-40yr8v0S.mjs +500 -0
  12. package/fesm2022/rolatech-angular-community-rolatech-angular-community-40yr8v0S.mjs.map +1 -0
  13. package/fesm2022/rolatech-angular-community.mjs +1 -112
  14. package/fesm2022/rolatech-angular-community.mjs.map +1 -1
  15. package/package.json +13 -5
  16. package/types/rolatech-angular-community.d.ts +44 -2
  17. package/fesm2022/rolatech-angular-community-community-index.component-DI3vIua7.mjs +0 -15
  18. package/fesm2022/rolatech-angular-community-community-index.component-DI3vIua7.mjs.map +0 -1
package/fesm2022/rolatech-angular-community-community-details.component-B4kDYAna.mjs ADDED
@@ -0,0 +1,46 @@
1
+ import { CommonModule } from '@angular/common';
2
+ import * as i0 from '@angular/core';
3
+ import { inject, signal, computed, Component } from '@angular/core';
4
+ import { MatButtonModule } from '@angular/material/button';
5
+ import * as i3 from '@angular/material/icon';
6
+ import { MatIconModule } from '@angular/material/icon';
7
+ import { ActivatedRoute, RouterLink } from '@angular/router';
8
+ import { EmptyComponent } from '@rolatech/angular-components';
9
+ import { TitleService } from '@rolatech/angular-services';
10
+ import { C as CommunityPostStoreService, c as createPostPreview } from './rolatech-angular-community-rolatech-angular-community-40yr8v0S.mjs';
11
+
12
+ class CommunityDetailsComponent {
13
+ constructor() {
14
+ this.route = inject(ActivatedRoute);
15
+ this.postStore = inject(CommunityPostStoreService);
16
+ this.titleService = inject(TitleService);
17
+ this.loading = signal(true, ...(ngDevMode ? [{ debugName: "loading" }] : []));
18
+ this.post = signal(null, ...(ngDevMode ? [{ debugName: "post" }] : []));
19
+ this.preview = computed(() => createPostPreview(this.post()?.content ?? ''), ...(ngDevMode ? [{ debugName: "preview" }] : []));
20
+ const id = this.route.snapshot.paramMap.get('id') ?? '';
21
+ this.loadPost(id);
22
+ }
23
+ loadPost(id) {
24
+ this.loading.set(true);
25
+ this.postStore.getPublishedPost(id).subscribe({
26
+ next: (post) => {
27
+ this.post.set(post);
28
+ this.loading.set(false);
29
+ this.titleService.setTitle(post?.title ? `${post.title} | Community` : 'Community');
30
+ },
31
+ error: () => {
32
+ this.post.set(null);
33
+ this.loading.set(false);
34
+ },
35
+ });
36
+ }
37
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CommunityDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
38
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CommunityDetailsComponent, isStandalone: true, selector: "rolatech-community-details", ngImport: i0, template: "@if (loading()) {\n <div class=\"community-details__state\">Loading post...</div>\n} @else if (post(); as post) {\n <article class=\"community-details\">\n <a class=\"community-details__back cursor-pointer\" [routerLink]=\"['../']\">\n <mat-icon>arrow_back</mat-icon>\n <span>Back to community</span>\n </a>\n\n <div class=\"community-details__meta\">\n <span>{{ post.authorName || 'RolaTech' }}</span>\n <span>{{ preview().readingTimeMinutes }} min read</span>\n <span>{{ post.status }}</span>\n </div>\n\n <h1>{{ post.title }}</h1>\n <p class=\"community-details__summary\">{{ post.summary || post.excerpt }}</p>\n\n <div class=\"community-details__tags\">\n @for (tag of post.tags ?? []; track tag) {\n <span>{{ tag }}</span>\n }\n </div>\n\n <section class=\"community-details__content markdown-body\" [innerHTML]=\"preview().html\"></section>\n </article>\n} @else {\n <div class=\"community-details__state\">\n <rolatech-empty></rolatech-empty>\n </div>\n}\n", styles: [".community-details,.community-details__state{border:1px solid var(--community-border);border-radius:28px;background:var(--community-surface-strong);box-shadow:var(--community-shadow)}.community-details{padding:clamp(1.25rem,3vw,2rem)}.community-details__back{display:inline-flex;align-items:center;gap:.35rem;color:#0284c7;text-decoration:none;font-weight:600}.community-details__meta{display:flex;flex-wrap:wrap;gap:.9rem;margin:1.5rem 0 1rem;color:var(--community-muted);font-size:.95rem}.community-details h1{margin:0;font-size:clamp(2rem,4vw,3.2rem);line-height:1;letter-spacing:-.05em}.community-details__summary{margin:1rem 0 0;max-width:48rem;color:var(--community-muted);font-size:1.05rem;line-height:1.8}.community-details__tags{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.4rem 0 1.8rem}.community-details__tags span{padding:.35rem .8rem;border-radius:999px;background:#0ea5e91f;color:#0369a1;font-size:.88rem;font-weight:600}.community-details__content{color:var(--community-text);line-height:1.8}.community-details__state{padding:2rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }] }); }
39
+ }
40
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CommunityDetailsComponent, decorators: [{
41
+ type: Component,
42
+ args: [{ selector: 'rolatech-community-details', imports: [CommonModule, RouterLink, MatButtonModule, MatIconModule, EmptyComponent], template: "@if (loading()) {\n <div class=\"community-details__state\">Loading post...</div>\n} @else if (post(); as post) {\n <article class=\"community-details\">\n <a class=\"community-details__back cursor-pointer\" [routerLink]=\"['../']\">\n <mat-icon>arrow_back</mat-icon>\n <span>Back to community</span>\n </a>\n\n <div class=\"community-details__meta\">\n <span>{{ post.authorName || 'RolaTech' }}</span>\n <span>{{ preview().readingTimeMinutes }} min read</span>\n <span>{{ post.status }}</span>\n </div>\n\n <h1>{{ post.title }}</h1>\n <p class=\"community-details__summary\">{{ post.summary || post.excerpt }}</p>\n\n <div class=\"community-details__tags\">\n @for (tag of post.tags ?? []; track tag) {\n <span>{{ tag }}</span>\n }\n </div>\n\n <section class=\"community-details__content markdown-body\" [innerHTML]=\"preview().html\"></section>\n </article>\n} @else {\n <div class=\"community-details__state\">\n <rolatech-empty></rolatech-empty>\n </div>\n}\n", styles: [".community-details,.community-details__state{border:1px solid var(--community-border);border-radius:28px;background:var(--community-surface-strong);box-shadow:var(--community-shadow)}.community-details{padding:clamp(1.25rem,3vw,2rem)}.community-details__back{display:inline-flex;align-items:center;gap:.35rem;color:#0284c7;text-decoration:none;font-weight:600}.community-details__meta{display:flex;flex-wrap:wrap;gap:.9rem;margin:1.5rem 0 1rem;color:var(--community-muted);font-size:.95rem}.community-details h1{margin:0;font-size:clamp(2rem,4vw,3.2rem);line-height:1;letter-spacing:-.05em}.community-details__summary{margin:1rem 0 0;max-width:48rem;color:var(--community-muted);font-size:1.05rem;line-height:1.8}.community-details__tags{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.4rem 0 1.8rem}.community-details__tags span{padding:.35rem .8rem;border-radius:999px;background:#0ea5e91f;color:#0369a1;font-size:.88rem;font-weight:600}.community-details__content{color:var(--community-text);line-height:1.8}.community-details__state{padding:2rem}\n"] }]
43
+ }], ctorParameters: () => [] });
44
+
45
+ export { CommunityDetailsComponent };
46
+ //# sourceMappingURL=rolatech-angular-community-community-details.component-B4kDYAna.mjs.map
package/fesm2022/rolatech-angular-community-community-details.component-B4kDYAna.mjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"rolatech-angular-community-community-details.component-B4kDYAna.mjs","sources":["../../../../packages/angular-community/src/lib/pages/community/community-details/community-details.component.ts","../../../../packages/angular-community/src/lib/pages/community/community-details/community-details.component.html"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, computed, inject, signal } from '@angular/core';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatIconModule } from '@angular/material/icon';\nimport { ActivatedRoute, RouterLink } from '@angular/router';\nimport { EmptyComponent } from '@rolatech/angular-components';\nimport { PostRecord, TitleService } from '@rolatech/angular-services';\nimport { CommunityPostStoreService } from '../../../services/community-post-store.service';\nimport { createPostPreview } from '../../../utils/post-view.util';\n\n@Component({\n selector: 'rolatech-community-details',\n imports: [CommonModule, RouterLink, MatButtonModule, MatIconModule, EmptyComponent],\n templateUrl: './community-details.component.html',\n styleUrl: './community-details.component.scss',\n})\nexport class CommunityDetailsComponent {\n private readonly route = inject(ActivatedRoute);\n private readonly postStore = inject(CommunityPostStoreService);\n private readonly titleService = inject(TitleService);\n\n readonly loading = signal(true);\n readonly post = signal<PostRecord | null>(null);\n readonly preview = computed(() => createPostPreview(this.post()?.content ?? ''));\n\n constructor() {\n const id = this.route.snapshot.paramMap.get('id') ?? '';\n this.loadPost(id);\n }\n\n private loadPost(id: string) {\n this.loading.set(true);\n this.postStore.getPublishedPost(id).subscribe({\n next: (post) => {\n this.post.set(post);\n this.loading.set(false);\n this.titleService.setTitle(post?.title ? `${post.title} | Community` : 'Community');\n },\n error: () => {\n this.post.set(null);\n this.loading.set(false);\n },\n });\n }\n}\n","@if (loading()) {\n <div class=\"community-details__state\">Loading post...</div>\n} @else if (post(); as post) {\n <article class=\"community-details\">\n <a class=\"community-details__back cursor-pointer\" [routerLink]=\"['../']\">\n <mat-icon>arrow_back</mat-icon>\n <span>Back to community</span>\n </a>\n\n <div class=\"community-details__meta\">\n <span>{{ post.authorName || 'RolaTech' }}</span>\n <span>{{ preview().readingTimeMinutes }} min read</span>\n <span>{{ post.status }}</span>\n </div>\n\n <h1>{{ post.title }}</h1>\n <p class=\"community-details__summary\">{{ post.summary || post.excerpt }}</p>\n\n <div class=\"community-details__tags\">\n @for (tag of post.tags ?? []; track tag) {\n <span>{{ tag }}</span>\n }\n </div>\n\n <section class=\"community-details__content markdown-body\" [innerHTML]=\"preview().html\"></section>\n </article>\n} @else {\n <div class=\"community-details__state\">\n <rolatech-empty></rolatech-empty>\n </div>\n}\n"],"names":["i1"],"mappings":"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"}
package/fesm2022/rolatech-angular-community-community-index.component-CJ_ddZSo.mjs ADDED
@@ -0,0 +1,65 @@
1
+ import { CommonModule } from '@angular/common';
2
+ import * as i0 from '@angular/core';
3
+ import { inject, model, signal, computed, Component } from '@angular/core';
4
+ import * as i1 from '@angular/forms';
5
+ import { FormsModule } from '@angular/forms';
6
+ import { RouterLink } from '@angular/router';
7
+ import { TabsComponent, TabComponent, EmptyComponent } from '@rolatech/angular-components';
8
+ import { TitleService } from '@rolatech/angular-services';
9
+ import { C as CommunityPostStoreService, c as createPostPreview } from './rolatech-angular-community-rolatech-angular-community-40yr8v0S.mjs';
10
+
11
+ class CommunityIndexComponent {
12
+ constructor() {
13
+ this.postStore = inject(CommunityPostStoreService);
14
+ this.titleService = inject(TitleService);
15
+ this.filters = [
16
+ { label: 'All', tag: '' },
17
+ { label: 'Angular', tag: 'angular' },
18
+ { label: 'Architecture', tag: 'architecture' },
19
+ { label: 'Operations', tag: 'operations' },
20
+ ];
21
+ this.filterIndex = model(0, ...(ngDevMode ? [{ debugName: "filterIndex" }] : []));
22
+ this.search = signal('', ...(ngDevMode ? [{ debugName: "search" }] : []));
23
+ this.loading = signal(true, ...(ngDevMode ? [{ debugName: "loading" }] : []));
24
+ this.posts = signal([], ...(ngDevMode ? [{ debugName: "posts" }] : []));
25
+ this.filteredPosts = computed(() => {
26
+ const activeTag = this.filters[this.filterIndex()]?.tag;
27
+ const search = this.search().trim().toLowerCase();
28
+ return this.posts().filter((post) => {
29
+ const matchesTag = !activeTag || (post.tags ?? []).map((tag) => tag.toLowerCase()).includes(activeTag);
30
+ const haystack = [post.title, post.summary, post.authorName, ...(post.tags ?? [])].join(' ').toLowerCase();
31
+ const matchesSearch = !search || haystack.includes(search);
32
+ return matchesTag && matchesSearch;
33
+ });
34
+ }, ...(ngDevMode ? [{ debugName: "filteredPosts" }] : []));
35
+ this.featuredPost = computed(() => this.filteredPosts()[0] ?? null, ...(ngDevMode ? [{ debugName: "featuredPost" }] : []));
36
+ this.feedPosts = computed(() => this.filteredPosts().slice(1), ...(ngDevMode ? [{ debugName: "feedPosts" }] : []));
37
+ this.titleService.setTitle('Community');
38
+ this.loadPosts();
39
+ }
40
+ meta(post) {
41
+ return createPostPreview(post.content);
42
+ }
43
+ loadPosts() {
44
+ this.loading.set(true);
45
+ this.postStore.listPublished().subscribe({
46
+ next: (posts) => {
47
+ this.posts.set(posts);
48
+ this.loading.set(false);
49
+ },
50
+ error: () => {
51
+ this.posts.set([]);
52
+ this.loading.set(false);
53
+ },
54
+ });
55
+ }
56
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CommunityIndexComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
57
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CommunityIndexComponent, isStandalone: true, selector: "rolatech-community-index", inputs: { filterIndex: { classPropertyName: "filterIndex", publicName: "filterIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filterIndex: "filterIndexChange" }, ngImport: i0, template: "<div class=\"community-index\">\n <section class=\"community-index__controls\">\n <rolatech-tabs [(select)]=\"filterIndex\">\n @for (filter of filters; track filter.label) {\n <rolatech-tab [label]=\"filter.label\"></rolatech-tab>\n }\n </rolatech-tabs>\n\n <label class=\"community-index__search\">\n <span>Search posts</span>\n <input\n type=\"search\"\n [ngModel]=\"search()\"\n (ngModelChange)=\"search.set($event)\"\n placeholder=\"Find notes on signals, drafts, and product delivery\"\n />\n </label>\n </section>\n\n @if (loading()) {\n <div class=\"community-index__empty\">Loading posts...</div>\n } @else if (featuredPost(); as featured) {\n <section class=\"community-index__hero\">\n <article class=\"community-index__featured\">\n <div class=\"community-index__featured-meta\">\n <span class=\"community-index__status\">Featured</span>\n <span>{{ meta(featured).readingTimeMinutes }} min read</span>\n </div>\n <h2>{{ featured.title }}</h2>\n <p>{{ featured.summary || featured.excerpt }}</p>\n\n <div class=\"community-index__tags\">\n @for (tag of featured.tags ?? []; track tag) {\n <span>{{ tag }}</span>\n }\n </div>\n\n <a class=\"community-index__cta cursor-pointer\" [routerLink]=\"['../', featured.slug || featured.id]\">Read post</a>\n </article>\n\n <div class=\"community-index__sidebar\">\n @for (post of feedPosts(); track post.id) {\n <article class=\"community-index__card\">\n <div class=\"community-index__card-meta\">\n <span>{{ post.authorName || 'RolaTech' }}</span>\n <span>{{ meta(post).readingTimeMinutes }} min</span>\n </div>\n <h3>{{ post.title }}</h3>\n <p>{{ post.summary || post.excerpt }}</p>\n <a class=\"cursor-pointer\" [routerLink]=\"['../', post.slug || post.id]\">Open</a>\n </article>\n }\n </div>\n </section>\n } @else {\n <div class=\"community-index__empty\">\n <rolatech-empty></rolatech-empty>\n </div>\n }\n</div>\n", styles: [".community-index{display:grid;gap:1.5rem}.community-index__controls{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem}.community-index :is(rolatech-tabs){--rt-tabs-selection-bar-color: #0284c7;--rt-tab-active-color: #0284c7}.community-index__search{display:grid;gap:.45rem;min-width:min(100%,22rem);color:var(--community-muted);font-size:.92rem}.community-index__search input{min-height:3rem;border:1px solid var(--community-border);border-radius:16px;background:var(--community-surface-strong);color:var(--community-text);padding:0 1rem;outline:none}.community-index__hero{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(18rem,1fr);gap:1.25rem}.community-index__featured,.community-index__card,.community-index__empty{border:1px solid var(--community-border);border-radius:28px;background:var(--community-surface-strong);box-shadow:var(--community-shadow)}.community-index__featured{padding:clamp(1.25rem,3vw,2rem);background:linear-gradient(145deg,rgba(2,132,199,.14),transparent 42%),var(--community-surface-strong)}.community-index__featured-meta,.community-index__card-meta{display:flex;justify-content:space-between;gap:1rem;color:var(--community-muted);font-size:.92rem}.community-index__status{color:#0284c7;font-weight:700}.community-index__featured h2{margin:.9rem 0 .8rem;font-size:clamp(1.8rem,4vw,2.6rem);line-height:1.02;letter-spacing:-.04em}.community-index__featured p,.community-index__card p{margin:0;color:var(--community-muted);line-height:1.7}.community-index__tags{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.25rem 0 1.5rem}.community-index__tags span{display:inline-flex;align-items:center;min-height:2rem;padding:0 .8rem;border-radius:999px;background:#0ea5e91f;color:#0369a1;font-size:.85rem;font-weight:600}.community-index__cta,.community-index__card a{display:inline-flex;align-items:center;width:fit-content;margin-top:1.2rem;color:#0284c7;font-weight:700;text-decoration:none}.community-index__sidebar{display:grid;gap:1rem}.community-index__card{padding:1.1rem 1.2rem}.community-index__card h3{margin:.7rem 0 .55rem;font-size:1.15rem;line-height:1.2}.community-index__empty{padding:2rem}@media(max-width:900px){.community-index__hero{grid-template-columns:1fr}.community-index__controls{flex-direction:column}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading", "block", "mode"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"], outputs: ["selectRequested"] }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }] }); }
58
+ }
59
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CommunityIndexComponent, decorators: [{
60
+ type: Component,
61
+ args: [{ selector: 'rolatech-community-index', imports: [CommonModule, FormsModule, RouterLink, TabsComponent, TabComponent, EmptyComponent], template: "<div class=\"community-index\">\n <section class=\"community-index__controls\">\n <rolatech-tabs [(select)]=\"filterIndex\">\n @for (filter of filters; track filter.label) {\n <rolatech-tab [label]=\"filter.label\"></rolatech-tab>\n }\n </rolatech-tabs>\n\n <label class=\"community-index__search\">\n <span>Search posts</span>\n <input\n type=\"search\"\n [ngModel]=\"search()\"\n (ngModelChange)=\"search.set($event)\"\n placeholder=\"Find notes on signals, drafts, and product delivery\"\n />\n </label>\n </section>\n\n @if (loading()) {\n <div class=\"community-index__empty\">Loading posts...</div>\n } @else if (featuredPost(); as featured) {\n <section class=\"community-index__hero\">\n <article class=\"community-index__featured\">\n <div class=\"community-index__featured-meta\">\n <span class=\"community-index__status\">Featured</span>\n <span>{{ meta(featured).readingTimeMinutes }} min read</span>\n </div>\n <h2>{{ featured.title }}</h2>\n <p>{{ featured.summary || featured.excerpt }}</p>\n\n <div class=\"community-index__tags\">\n @for (tag of featured.tags ?? []; track tag) {\n <span>{{ tag }}</span>\n }\n </div>\n\n <a class=\"community-index__cta cursor-pointer\" [routerLink]=\"['../', featured.slug || featured.id]\">Read post</a>\n </article>\n\n <div class=\"community-index__sidebar\">\n @for (post of feedPosts(); track post.id) {\n <article class=\"community-index__card\">\n <div class=\"community-index__card-meta\">\n <span>{{ post.authorName || 'RolaTech' }}</span>\n <span>{{ meta(post).readingTimeMinutes }} min</span>\n </div>\n <h3>{{ post.title }}</h3>\n <p>{{ post.summary || post.excerpt }}</p>\n <a class=\"cursor-pointer\" [routerLink]=\"['../', post.slug || post.id]\">Open</a>\n </article>\n }\n </div>\n </section>\n } @else {\n <div class=\"community-index__empty\">\n <rolatech-empty></rolatech-empty>\n </div>\n }\n</div>\n", styles: [".community-index{display:grid;gap:1.5rem}.community-index__controls{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem}.community-index :is(rolatech-tabs){--rt-tabs-selection-bar-color: #0284c7;--rt-tab-active-color: #0284c7}.community-index__search{display:grid;gap:.45rem;min-width:min(100%,22rem);color:var(--community-muted);font-size:.92rem}.community-index__search input{min-height:3rem;border:1px solid var(--community-border);border-radius:16px;background:var(--community-surface-strong);color:var(--community-text);padding:0 1rem;outline:none}.community-index__hero{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(18rem,1fr);gap:1.25rem}.community-index__featured,.community-index__card,.community-index__empty{border:1px solid var(--community-border);border-radius:28px;background:var(--community-surface-strong);box-shadow:var(--community-shadow)}.community-index__featured{padding:clamp(1.25rem,3vw,2rem);background:linear-gradient(145deg,rgba(2,132,199,.14),transparent 42%),var(--community-surface-strong)}.community-index__featured-meta,.community-index__card-meta{display:flex;justify-content:space-between;gap:1rem;color:var(--community-muted);font-size:.92rem}.community-index__status{color:#0284c7;font-weight:700}.community-index__featured h2{margin:.9rem 0 .8rem;font-size:clamp(1.8rem,4vw,2.6rem);line-height:1.02;letter-spacing:-.04em}.community-index__featured p,.community-index__card p{margin:0;color:var(--community-muted);line-height:1.7}.community-index__tags{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.25rem 0 1.5rem}.community-index__tags span{display:inline-flex;align-items:center;min-height:2rem;padding:0 .8rem;border-radius:999px;background:#0ea5e91f;color:#0369a1;font-size:.85rem;font-weight:600}.community-index__cta,.community-index__card a{display:inline-flex;align-items:center;width:fit-content;margin-top:1.2rem;color:#0284c7;font-weight:700;text-decoration:none}.community-index__sidebar{display:grid;gap:1rem}.community-index__card{padding:1.1rem 1.2rem}.community-index__card h3{margin:.7rem 0 .55rem;font-size:1.15rem;line-height:1.2}.community-index__empty{padding:2rem}@media(max-width:900px){.community-index__hero{grid-template-columns:1fr}.community-index__controls{flex-direction:column}}\n"] }]
62
+ }], ctorParameters: () => [], propDecorators: { filterIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterIndex", required: false }] }, { type: i0.Output, args: ["filterIndexChange"] }] } });
63
+
64
+ export { CommunityIndexComponent };
65
+ //# sourceMappingURL=rolatech-angular-community-community-index.component-CJ_ddZSo.mjs.map
package/fesm2022/rolatech-angular-community-community-index.component-CJ_ddZSo.mjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"rolatech-angular-community-community-index.component-CJ_ddZSo.mjs","sources":["../../../../packages/angular-community/src/lib/pages/community/community-index/community-index.component.ts","../../../../packages/angular-community/src/lib/pages/community/community-index/community-index.component.html"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, computed, inject, model, signal } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { RouterLink } from '@angular/router';\nimport { EmptyComponent, TabComponent, TabsComponent } from '@rolatech/angular-components';\nimport { PostRecord, TitleService } from '@rolatech/angular-services';\nimport { CommunityPostStoreService } from '../../../services/community-post-store.service';\nimport { createPostPreview } from '../../../utils/post-view.util';\n\n@Component({\n selector: 'rolatech-community-index',\n imports: [CommonModule, FormsModule, RouterLink, TabsComponent, TabComponent, EmptyComponent],\n templateUrl: './community-index.component.html',\n styleUrl: './community-index.component.scss',\n})\nexport class CommunityIndexComponent {\n private readonly postStore = inject(CommunityPostStoreService);\n private readonly titleService = inject(TitleService);\n\n readonly filters = [\n { label: 'All', tag: '' },\n { label: 'Angular', tag: 'angular' },\n { label: 'Architecture', tag: 'architecture' },\n { label: 'Operations', tag: 'operations' },\n ];\n\n readonly filterIndex = model(0);\n readonly search = signal('');\n readonly loading = signal(true);\n readonly posts = signal<PostRecord[]>([]);\n\n readonly filteredPosts = computed(() => {\n const activeTag = this.filters[this.filterIndex()]?.tag;\n const search = this.search().trim().toLowerCase();\n\n return this.posts().filter((post) => {\n const matchesTag = !activeTag || (post.tags ?? []).map((tag) => tag.toLowerCase()).includes(activeTag);\n const haystack = [post.title, post.summary, post.authorName, ...(post.tags ?? [])].join(' ').toLowerCase();\n const matchesSearch = !search || haystack.includes(search);\n return matchesTag && matchesSearch;\n });\n });\n\n readonly featuredPost = computed(() => this.filteredPosts()[0] ?? null);\n readonly feedPosts = computed(() => this.filteredPosts().slice(1));\n\n constructor() {\n this.titleService.setTitle('Community');\n this.loadPosts();\n }\n\n meta(post: PostRecord) {\n return createPostPreview(post.content);\n }\n\n private loadPosts() {\n this.loading.set(true);\n this.postStore.listPublished().subscribe({\n next: (posts) => {\n this.posts.set(posts);\n this.loading.set(false);\n },\n error: () => {\n this.posts.set([]);\n this.loading.set(false);\n },\n });\n }\n}\n","<div class=\"community-index\">\n <section class=\"community-index__controls\">\n <rolatech-tabs [(select)]=\"filterIndex\">\n @for (filter of filters; track filter.label) {\n <rolatech-tab [label]=\"filter.label\"></rolatech-tab>\n }\n </rolatech-tabs>\n\n <label class=\"community-index__search\">\n <span>Search posts</span>\n <input\n type=\"search\"\n [ngModel]=\"search()\"\n (ngModelChange)=\"search.set($event)\"\n placeholder=\"Find notes on signals, drafts, and product delivery\"\n />\n </label>\n </section>\n\n @if (loading()) {\n <div class=\"community-index__empty\">Loading posts...</div>\n } @else if (featuredPost(); as featured) {\n <section class=\"community-index__hero\">\n <article class=\"community-index__featured\">\n <div class=\"community-index__featured-meta\">\n <span class=\"community-index__status\">Featured</span>\n <span>{{ meta(featured).readingTimeMinutes }} min read</span>\n </div>\n <h2>{{ featured.title }}</h2>\n <p>{{ featured.summary || featured.excerpt }}</p>\n\n <div class=\"community-index__tags\">\n @for (tag of featured.tags ?? []; track tag) {\n <span>{{ tag }}</span>\n }\n </div>\n\n <a class=\"community-index__cta cursor-pointer\" [routerLink]=\"['../', featured.slug || featured.id]\">Read post</a>\n </article>\n\n <div class=\"community-index__sidebar\">\n @for (post of feedPosts(); track post.id) {\n <article class=\"community-index__card\">\n <div class=\"community-index__card-meta\">\n <span>{{ post.authorName || 'RolaTech' }}</span>\n <span>{{ meta(post).readingTimeMinutes }} min</span>\n </div>\n <h3>{{ post.title }}</h3>\n <p>{{ post.summary || post.excerpt }}</p>\n <a class=\"cursor-pointer\" [routerLink]=\"['../', post.slug || post.id]\">Open</a>\n </article>\n }\n </div>\n </section>\n } @else {\n <div class=\"community-index__empty\">\n <rolatech-empty></rolatech-empty>\n </div>\n }\n</div>\n"],"names":[],"mappings":"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"}
package/fesm2022/rolatech-angular-community-community-manage-index.component-CQYy_iI7.mjs ADDED
@@ -0,0 +1,68 @@
1
+ import { CommonModule } from '@angular/common';
2
+ import * as i0 from '@angular/core';
3
+ import { inject, model, signal, computed, Component } from '@angular/core';
4
+ import * as i1 from '@angular/forms';
5
+ import { FormsModule } from '@angular/forms';
6
+ import * as i2 from '@angular/material/button';
7
+ import { MatButtonModule } from '@angular/material/button';
8
+ import * as i3 from '@angular/material/icon';
9
+ import { MatIconModule } from '@angular/material/icon';
10
+ import { RouterLink } from '@angular/router';
11
+ import { TabsComponent, TabComponent, EmptyComponent } from '@rolatech/angular-components';
12
+ import { TitleService } from '@rolatech/angular-services';
13
+ import { C as CommunityPostStoreService, c as createPostPreview } from './rolatech-angular-community-rolatech-angular-community-40yr8v0S.mjs';
14
+
15
+ class CommunityManageIndexComponent {
16
+ constructor() {
17
+ this.postStore = inject(CommunityPostStoreService);
18
+ this.titleService = inject(TitleService);
19
+ this.tabs = [
20
+ { label: 'All', status: '' },
21
+ { label: 'Drafts', status: 'DRAFT' },
22
+ { label: 'Published', status: 'PUBLISHED' },
23
+ ];
24
+ this.tabIndex = model(0, ...(ngDevMode ? [{ debugName: "tabIndex" }] : []));
25
+ this.search = signal('', ...(ngDevMode ? [{ debugName: "search" }] : []));
26
+ this.loading = signal(true, ...(ngDevMode ? [{ debugName: "loading" }] : []));
27
+ this.posts = signal([], ...(ngDevMode ? [{ debugName: "posts" }] : []));
28
+ this.filteredPosts = computed(() => {
29
+ const status = this.tabs[this.tabIndex()]?.status;
30
+ const search = this.search().trim().toLowerCase();
31
+ return this.posts().filter((post) => {
32
+ const matchesStatus = !status || post.status === status;
33
+ const haystack = [post.title, post.summary, post.authorName, ...(post.tags ?? [])].join(' ').toLowerCase();
34
+ const matchesSearch = !search || haystack.includes(search);
35
+ return matchesStatus && matchesSearch;
36
+ });
37
+ }, ...(ngDevMode ? [{ debugName: "filteredPosts" }] : []));
38
+ this.totalDrafts = computed(() => this.posts().filter((post) => post.status === 'DRAFT').length, ...(ngDevMode ? [{ debugName: "totalDrafts" }] : []));
39
+ this.totalPublished = computed(() => this.posts().filter((post) => post.status === 'PUBLISHED').length, ...(ngDevMode ? [{ debugName: "totalPublished" }] : []));
40
+ this.titleService.setTitle('Manage posts | Community');
41
+ this.loadPosts();
42
+ }
43
+ previewMeta(post) {
44
+ return createPostPreview(post.content);
45
+ }
46
+ loadPosts() {
47
+ this.loading.set(true);
48
+ this.postStore.listMyPosts().subscribe({
49
+ next: (posts) => {
50
+ this.posts.set(posts);
51
+ this.loading.set(false);
52
+ },
53
+ error: () => {
54
+ this.posts.set([]);
55
+ this.loading.set(false);
56
+ },
57
+ });
58
+ }
59
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CommunityManageIndexComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
60
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CommunityManageIndexComponent, isStandalone: true, selector: "rolatech-community-manage-index", inputs: { tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { tabIndex: "tabIndexChange" }, ngImport: i0, template: "<div class=\"community-manage-index\">\n <section class=\"community-manage-index__header\">\n <div>\n <h2>Post management</h2>\n <p>Track drafts, keep previews honest, and move finished work into published state.</p>\n </div>\n\n <a class=\"cursor-pointer\" mat-flat-button color=\"primary\" [routerLink]=\"['./create']\">\n <mat-icon>add</mat-icon>\n <span>New post</span>\n </a>\n </section>\n\n <section class=\"community-manage-index__stats\">\n <article>\n <span class=\"community-manage-index__stat-value\">{{ totalDrafts() }}</span>\n <span class=\"community-manage-index__stat-label\">Drafts</span>\n </article>\n <article>\n <span class=\"community-manage-index__stat-value\">{{ totalPublished() }}</span>\n <span class=\"community-manage-index__stat-label\">Published</span>\n </article>\n </section>\n\n <section class=\"community-manage-index__filters\">\n <rolatech-tabs [(select)]=\"tabIndex\">\n @for (tab of tabs; track tab.label) {\n <rolatech-tab [label]=\"tab.label\"></rolatech-tab>\n }\n </rolatech-tabs>\n\n <label>\n <span>Search</span>\n <input type=\"search\" [ngModel]=\"search()\" (ngModelChange)=\"search.set($event)\" placeholder=\"Find a draft or published post\" />\n </label>\n </section>\n\n @if (loading()) {\n <div class=\"community-manage-index__state\">Loading posts...</div>\n } @else if (filteredPosts().length > 0) {\n <section class=\"community-manage-index__list\">\n @for (post of filteredPosts(); track post.id) {\n <article class=\"community-manage-index__card\">\n <div class=\"community-manage-index__card-main\">\n <div class=\"community-manage-index__card-topline\">\n <span class=\"community-manage-index__status\" [attr.data-status]=\"post.status\">{{ post.status }}</span>\n <span>{{ previewMeta(post).readingTimeMinutes }} min read</span>\n </div>\n <h3>{{ post.title }}</h3>\n <p>{{ post.summary || post.excerpt }}</p>\n </div>\n\n <div class=\"community-manage-index__actions\">\n <a class=\"cursor-pointer\" [routerLink]=\"['./', post.id]\">Preview</a>\n <a class=\"cursor-pointer\" [routerLink]=\"['./', post.id, 'edit']\">Edit</a>\n </div>\n </article>\n }\n </section>\n } @else {\n <div class=\"community-manage-index__state\">\n <rolatech-empty></rolatech-empty>\n </div>\n }\n</div>\n", styles: [".community-manage-index{display:grid;gap:1.25rem}.community-manage-index__header,.community-manage-index__stats,.community-manage-index__filters,.community-manage-index__card,.community-manage-index__state{border:1px solid var(--community-border);border-radius:24px;background:var(--community-surface-strong);box-shadow:var(--community-shadow)}.community-manage-index__header,.community-manage-index__filters{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1.1rem 1.2rem}.community-manage-index__header h2{margin:0;font-size:1.6rem}.community-manage-index__header p{margin:.45rem 0 0;color:var(--community-muted)}.community-manage-index__stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;padding:1.1rem 1.2rem}.community-manage-index__stats article{display:grid;gap:.3rem}.community-manage-index__stat-value{font-size:2rem;font-weight:700;letter-spacing:-.04em}.community-manage-index__stat-label{color:var(--community-muted)}.community-manage-index__filters label{display:grid;gap:.35rem;min-width:min(100%,20rem);color:var(--community-muted);font-size:.92rem}.community-manage-index__filters input{min-height:2.8rem;border:1px solid var(--community-border);border-radius:16px;background:transparent;color:var(--community-text);padding:0 .9rem}.community-manage-index__list{display:grid;gap:1rem}.community-manage-index__card{display:flex;justify-content:space-between;gap:1rem;padding:1.2rem}.community-manage-index__card-main h3{margin:.6rem 0 .45rem;font-size:1.2rem}.community-manage-index__card-main p,.community-manage-index__card-topline{margin:0;color:var(--community-muted)}.community-manage-index__card-topline{display:flex;gap:.8rem;font-size:.92rem}.community-manage-index__status{font-weight:700}.community-manage-index__status[data-status=PUBLISHED]{color:#059669}.community-manage-index__status[data-status=DRAFT]{color:#d97706}.community-manage-index__actions{display:flex;flex-direction:column;align-items:flex-end;gap:.5rem}.community-manage-index__actions a{color:#0284c7;text-decoration:none;font-weight:600}.community-manage-index__state{padding:2rem}@media(max-width:840px){.community-manage-index__header,.community-manage-index__filters,.community-manage-index__card{flex-direction:column;align-items:stretch}.community-manage-index__actions{flex-direction:row;justify-content:flex-start}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2.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: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading", "block", "mode"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"], outputs: ["selectRequested"] }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }] }); }
61
+ }
62
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CommunityManageIndexComponent, decorators: [{
63
+ type: Component,
64
+ args: [{ selector: 'rolatech-community-manage-index', imports: [CommonModule, FormsModule, RouterLink, MatButtonModule, MatIconModule, TabsComponent, TabComponent, EmptyComponent], template: "<div class=\"community-manage-index\">\n <section class=\"community-manage-index__header\">\n <div>\n <h2>Post management</h2>\n <p>Track drafts, keep previews honest, and move finished work into published state.</p>\n </div>\n\n <a class=\"cursor-pointer\" mat-flat-button color=\"primary\" [routerLink]=\"['./create']\">\n <mat-icon>add</mat-icon>\n <span>New post</span>\n </a>\n </section>\n\n <section class=\"community-manage-index__stats\">\n <article>\n <span class=\"community-manage-index__stat-value\">{{ totalDrafts() }}</span>\n <span class=\"community-manage-index__stat-label\">Drafts</span>\n </article>\n <article>\n <span class=\"community-manage-index__stat-value\">{{ totalPublished() }}</span>\n <span class=\"community-manage-index__stat-label\">Published</span>\n </article>\n </section>\n\n <section class=\"community-manage-index__filters\">\n <rolatech-tabs [(select)]=\"tabIndex\">\n @for (tab of tabs; track tab.label) {\n <rolatech-tab [label]=\"tab.label\"></rolatech-tab>\n }\n </rolatech-tabs>\n\n <label>\n <span>Search</span>\n <input type=\"search\" [ngModel]=\"search()\" (ngModelChange)=\"search.set($event)\" placeholder=\"Find a draft or published post\" />\n </label>\n </section>\n\n @if (loading()) {\n <div class=\"community-manage-index__state\">Loading posts...</div>\n } @else if (filteredPosts().length > 0) {\n <section class=\"community-manage-index__list\">\n @for (post of filteredPosts(); track post.id) {\n <article class=\"community-manage-index__card\">\n <div class=\"community-manage-index__card-main\">\n <div class=\"community-manage-index__card-topline\">\n <span class=\"community-manage-index__status\" [attr.data-status]=\"post.status\">{{ post.status }}</span>\n <span>{{ previewMeta(post).readingTimeMinutes }} min read</span>\n </div>\n <h3>{{ post.title }}</h3>\n <p>{{ post.summary || post.excerpt }}</p>\n </div>\n\n <div class=\"community-manage-index__actions\">\n <a class=\"cursor-pointer\" [routerLink]=\"['./', post.id]\">Preview</a>\n <a class=\"cursor-pointer\" [routerLink]=\"['./', post.id, 'edit']\">Edit</a>\n </div>\n </article>\n }\n </section>\n } @else {\n <div class=\"community-manage-index__state\">\n <rolatech-empty></rolatech-empty>\n </div>\n }\n</div>\n", styles: [".community-manage-index{display:grid;gap:1.25rem}.community-manage-index__header,.community-manage-index__stats,.community-manage-index__filters,.community-manage-index__card,.community-manage-index__state{border:1px solid var(--community-border);border-radius:24px;background:var(--community-surface-strong);box-shadow:var(--community-shadow)}.community-manage-index__header,.community-manage-index__filters{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1.1rem 1.2rem}.community-manage-index__header h2{margin:0;font-size:1.6rem}.community-manage-index__header p{margin:.45rem 0 0;color:var(--community-muted)}.community-manage-index__stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;padding:1.1rem 1.2rem}.community-manage-index__stats article{display:grid;gap:.3rem}.community-manage-index__stat-value{font-size:2rem;font-weight:700;letter-spacing:-.04em}.community-manage-index__stat-label{color:var(--community-muted)}.community-manage-index__filters label{display:grid;gap:.35rem;min-width:min(100%,20rem);color:var(--community-muted);font-size:.92rem}.community-manage-index__filters input{min-height:2.8rem;border:1px solid var(--community-border);border-radius:16px;background:transparent;color:var(--community-text);padding:0 .9rem}.community-manage-index__list{display:grid;gap:1rem}.community-manage-index__card{display:flex;justify-content:space-between;gap:1rem;padding:1.2rem}.community-manage-index__card-main h3{margin:.6rem 0 .45rem;font-size:1.2rem}.community-manage-index__card-main p,.community-manage-index__card-topline{margin:0;color:var(--community-muted)}.community-manage-index__card-topline{display:flex;gap:.8rem;font-size:.92rem}.community-manage-index__status{font-weight:700}.community-manage-index__status[data-status=PUBLISHED]{color:#059669}.community-manage-index__status[data-status=DRAFT]{color:#d97706}.community-manage-index__actions{display:flex;flex-direction:column;align-items:flex-end;gap:.5rem}.community-manage-index__actions a{color:#0284c7;text-decoration:none;font-weight:600}.community-manage-index__state{padding:2rem}@media(max-width:840px){.community-manage-index__header,.community-manage-index__filters,.community-manage-index__card{flex-direction:column;align-items:stretch}.community-manage-index__actions{flex-direction:row;justify-content:flex-start}}\n"] }]
65
+ }], ctorParameters: () => [], propDecorators: { tabIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabIndex", required: false }] }, { type: i0.Output, args: ["tabIndexChange"] }] } });
66
+
67
+ export { CommunityManageIndexComponent };
68
+ //# sourceMappingURL=rolatech-angular-community-community-manage-index.component-CQYy_iI7.mjs.map
package/fesm2022/rolatech-angular-community-community-manage-index.component-CQYy_iI7.mjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"rolatech-angular-community-community-manage-index.component-CQYy_iI7.mjs","sources":["../../../../packages/angular-community/src/lib/pages/community-manage/community-manage-index/community-manage-index.component.ts","../../../../packages/angular-community/src/lib/pages/community-manage/community-manage-index/community-manage-index.component.html"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, computed, inject, model, signal } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatIconModule } from '@angular/material/icon';\nimport { RouterLink } from '@angular/router';\nimport { EmptyComponent, TabComponent, TabsComponent } from '@rolatech/angular-components';\nimport { PostRecord, TitleService } from '@rolatech/angular-services';\nimport { CommunityPostStoreService } from '../../../services/community-post-store.service';\nimport { createPostPreview } from '../../../utils/post-view.util';\n\n@Component({\n selector: 'rolatech-community-manage-index',\n imports: [CommonModule, FormsModule, RouterLink, MatButtonModule, MatIconModule, TabsComponent, TabComponent, EmptyComponent],\n templateUrl: './community-manage-index.component.html',\n styleUrl: './community-manage-index.component.scss',\n})\nexport class CommunityManageIndexComponent {\n private readonly postStore = inject(CommunityPostStoreService);\n private readonly titleService = inject(TitleService);\n\n readonly tabs = [\n { label: 'All', status: '' },\n { label: 'Drafts', status: 'DRAFT' },\n { label: 'Published', status: 'PUBLISHED' },\n ];\n\n readonly tabIndex = model(0);\n readonly search = signal('');\n readonly loading = signal(true);\n readonly posts = signal<PostRecord[]>([]);\n\n readonly filteredPosts = computed(() => {\n const status = this.tabs[this.tabIndex()]?.status;\n const search = this.search().trim().toLowerCase();\n\n return this.posts().filter((post) => {\n const matchesStatus = !status || post.status === status;\n const haystack = [post.title, post.summary, post.authorName, ...(post.tags ?? [])].join(' ').toLowerCase();\n const matchesSearch = !search || haystack.includes(search);\n return matchesStatus && matchesSearch;\n });\n });\n\n readonly totalDrafts = computed(() => this.posts().filter((post) => post.status === 'DRAFT').length);\n readonly totalPublished = computed(() => this.posts().filter((post) => post.status === 'PUBLISHED').length);\n\n constructor() {\n this.titleService.setTitle('Manage posts | Community');\n this.loadPosts();\n }\n\n previewMeta(post: PostRecord) {\n return createPostPreview(post.content);\n }\n\n private loadPosts() {\n this.loading.set(true);\n this.postStore.listMyPosts().subscribe({\n next: (posts) => {\n this.posts.set(posts);\n this.loading.set(false);\n },\n error: () => {\n this.posts.set([]);\n this.loading.set(false);\n },\n });\n }\n}\n","<div class=\"community-manage-index\">\n <section class=\"community-manage-index__header\">\n <div>\n <h2>Post management</h2>\n <p>Track drafts, keep previews honest, and move finished work into published state.</p>\n </div>\n\n <a class=\"cursor-pointer\" mat-flat-button color=\"primary\" [routerLink]=\"['./create']\">\n <mat-icon>add</mat-icon>\n <span>New post</span>\n </a>\n </section>\n\n <section class=\"community-manage-index__stats\">\n <article>\n <span class=\"community-manage-index__stat-value\">{{ totalDrafts() }}</span>\n <span class=\"community-manage-index__stat-label\">Drafts</span>\n </article>\n <article>\n <span class=\"community-manage-index__stat-value\">{{ totalPublished() }}</span>\n <span class=\"community-manage-index__stat-label\">Published</span>\n </article>\n </section>\n\n <section class=\"community-manage-index__filters\">\n <rolatech-tabs [(select)]=\"tabIndex\">\n @for (tab of tabs; track tab.label) {\n <rolatech-tab [label]=\"tab.label\"></rolatech-tab>\n }\n </rolatech-tabs>\n\n <label>\n <span>Search</span>\n <input type=\"search\" [ngModel]=\"search()\" (ngModelChange)=\"search.set($event)\" placeholder=\"Find a draft or published post\" />\n </label>\n </section>\n\n @if (loading()) {\n <div class=\"community-manage-index__state\">Loading posts...</div>\n } @else if (filteredPosts().length > 0) {\n <section class=\"community-manage-index__list\">\n @for (post of filteredPosts(); track post.id) {\n <article class=\"community-manage-index__card\">\n <div class=\"community-manage-index__card-main\">\n <div class=\"community-manage-index__card-topline\">\n <span class=\"community-manage-index__status\" [attr.data-status]=\"post.status\">{{ post.status }}</span>\n <span>{{ previewMeta(post).readingTimeMinutes }} min read</span>\n </div>\n <h3>{{ post.title }}</h3>\n <p>{{ post.summary || post.excerpt }}</p>\n </div>\n\n <div class=\"community-manage-index__actions\">\n <a class=\"cursor-pointer\" [routerLink]=\"['./', post.id]\">Preview</a>\n <a class=\"cursor-pointer\" [routerLink]=\"['./', post.id, 'edit']\">Edit</a>\n </div>\n </article>\n }\n </section>\n } @else {\n <div class=\"community-manage-index__state\">\n <rolatech-empty></rolatech-empty>\n </div>\n }\n</div>\n"],"names":[],"mappings":"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"}
package/fesm2022/rolatech-angular-community-community-manage-post-details.component-B70ewcPc.mjs ADDED
@@ -0,0 +1,70 @@
1
+ import { CommonModule } from '@angular/common';
2
+ import * as i0 from '@angular/core';
3
+ import { inject, signal, computed, Component } from '@angular/core';
4
+ import * as i2 from '@angular/material/button';
5
+ import { MatButtonModule } from '@angular/material/button';
6
+ import { MatIconModule } from '@angular/material/icon';
7
+ import { ActivatedRoute, RouterLink } from '@angular/router';
8
+ import { EmptyComponent } from '@rolatech/angular-components';
9
+ import { SnackBarService, TitleService } from '@rolatech/angular-services';
10
+ import { C as CommunityPostStoreService, c as createPostPreview } from './rolatech-angular-community-rolatech-angular-community-40yr8v0S.mjs';
11
+
12
+ class CommunityManagePostDetailsComponent {
13
+ constructor() {
14
+ this.route = inject(ActivatedRoute);
15
+ this.postStore = inject(CommunityPostStoreService);
16
+ this.snackBar = inject(SnackBarService);
17
+ this.titleService = inject(TitleService);
18
+ this.loading = signal(true, ...(ngDevMode ? [{ debugName: "loading" }] : []));
19
+ this.post = signal(null, ...(ngDevMode ? [{ debugName: "post" }] : []));
20
+ this.preview = computed(() => createPostPreview(this.post()?.content ?? ''), ...(ngDevMode ? [{ debugName: "preview" }] : []));
21
+ this.loadPost(this.route.snapshot.paramMap.get('id') ?? '');
22
+ }
23
+ saveDraft() {
24
+ const post = this.post();
25
+ if (!post) {
26
+ return;
27
+ }
28
+ this.postStore.saveDraft(post).subscribe({
29
+ next: (saved) => {
30
+ this.post.set(saved);
31
+ this.snackBar.open('Draft saved');
32
+ },
33
+ });
34
+ }
35
+ publish() {
36
+ const post = this.post();
37
+ if (!post) {
38
+ return;
39
+ }
40
+ this.postStore.publish(post).subscribe({
41
+ next: (saved) => {
42
+ this.post.set(saved);
43
+ this.snackBar.open('Post published');
44
+ },
45
+ });
46
+ }
47
+ loadPost(id) {
48
+ this.loading.set(true);
49
+ this.postStore.getManagePost(id).subscribe({
50
+ next: (post) => {
51
+ this.post.set(post);
52
+ this.loading.set(false);
53
+ this.titleService.setTitle(post?.title ? `${post.title} | Manage post` : 'Manage post');
54
+ },
55
+ error: () => {
56
+ this.post.set(null);
57
+ this.loading.set(false);
58
+ },
59
+ });
60
+ }
61
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CommunityManagePostDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
62
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CommunityManagePostDetailsComponent, isStandalone: true, selector: "rolatech-community-manage-post-details", ngImport: i0, template: "@if (loading()) {\n <div class=\"community-manage-post-details__state\">Loading post...</div>\n} @else if (post(); as post) {\n <article class=\"community-manage-post-details\">\n <div class=\"community-manage-post-details__topbar\">\n <a class=\"cursor-pointer\" [routerLink]=\"['../']\">Back to posts</a>\n <div class=\"community-manage-post-details__actions\">\n <button mat-stroked-button type=\"button\" (click)=\"saveDraft()\">Save draft</button>\n <button mat-flat-button color=\"primary\" type=\"button\" (click)=\"publish()\">Publish</button>\n <a class=\"cursor-pointer\" mat-stroked-button [routerLink]=\"['./edit']\">Edit</a>\n </div>\n </div>\n\n <div class=\"community-manage-post-details__meta\">\n <span>{{ post.status }}</span>\n <span>{{ preview().readingTimeMinutes }} min read</span>\n <span>{{ post.slug }}</span>\n </div>\n\n <h1>{{ post.title }}</h1>\n <p class=\"community-manage-post-details__summary\">{{ post.summary || post.excerpt }}</p>\n\n <div class=\"community-manage-post-details__tags\">\n @for (tag of post.tags ?? []; track tag) {\n <span>{{ tag }}</span>\n }\n </div>\n\n <section class=\"community-manage-post-details__content markdown-body\" [innerHTML]=\"preview().html\"></section>\n </article>\n} @else {\n <div class=\"community-manage-post-details__state\">\n <rolatech-empty></rolatech-empty>\n </div>\n}\n", styles: [".community-manage-post-details,.community-manage-post-details__state{border:1px solid var(--community-border);border-radius:28px;background:var(--community-surface-strong);box-shadow:var(--community-shadow)}.community-manage-post-details{padding:clamp(1.2rem,3vw,2rem)}.community-manage-post-details__topbar,.community-manage-post-details__meta{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}.community-manage-post-details__topbar a{color:#0284c7;text-decoration:none;font-weight:600}.community-manage-post-details__actions{display:flex;gap:.75rem;flex-wrap:wrap}.community-manage-post-details__meta{margin:1.35rem 0 1rem;color:var(--community-muted)}.community-manage-post-details h1{margin:0;font-size:clamp(1.9rem,4vw,3rem);line-height:1;letter-spacing:-.05em}.community-manage-post-details__summary{margin:.9rem 0 0;color:var(--community-muted);line-height:1.7}.community-manage-post-details__tags{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.35rem 0 1.6rem}.community-manage-post-details__tags span{padding:.35rem .8rem;border-radius:999px;background:#0ea5e91f;color:#0369a1;font-size:.88rem;font-weight:600}.community-manage-post-details__content{color:var(--community-text);line-height:1.8}.community-manage-post-details__state{padding:2rem}@media(max-width:840px){.community-manage-post-details__actions{width:100%}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2.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: MatIconModule }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }] }); }
63
+ }
64
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CommunityManagePostDetailsComponent, decorators: [{
65
+ type: Component,
66
+ args: [{ selector: 'rolatech-community-manage-post-details', imports: [CommonModule, RouterLink, MatButtonModule, MatIconModule, EmptyComponent], template: "@if (loading()) {\n <div class=\"community-manage-post-details__state\">Loading post...</div>\n} @else if (post(); as post) {\n <article class=\"community-manage-post-details\">\n <div class=\"community-manage-post-details__topbar\">\n <a class=\"cursor-pointer\" [routerLink]=\"['../']\">Back to posts</a>\n <div class=\"community-manage-post-details__actions\">\n <button mat-stroked-button type=\"button\" (click)=\"saveDraft()\">Save draft</button>\n <button mat-flat-button color=\"primary\" type=\"button\" (click)=\"publish()\">Publish</button>\n <a class=\"cursor-pointer\" mat-stroked-button [routerLink]=\"['./edit']\">Edit</a>\n </div>\n </div>\n\n <div class=\"community-manage-post-details__meta\">\n <span>{{ post.status }}</span>\n <span>{{ preview().readingTimeMinutes }} min read</span>\n <span>{{ post.slug }}</span>\n </div>\n\n <h1>{{ post.title }}</h1>\n <p class=\"community-manage-post-details__summary\">{{ post.summary || post.excerpt }}</p>\n\n <div class=\"community-manage-post-details__tags\">\n @for (tag of post.tags ?? []; track tag) {\n <span>{{ tag }}</span>\n }\n </div>\n\n <section class=\"community-manage-post-details__content markdown-body\" [innerHTML]=\"preview().html\"></section>\n </article>\n} @else {\n <div class=\"community-manage-post-details__state\">\n <rolatech-empty></rolatech-empty>\n </div>\n}\n", styles: [".community-manage-post-details,.community-manage-post-details__state{border:1px solid var(--community-border);border-radius:28px;background:var(--community-surface-strong);box-shadow:var(--community-shadow)}.community-manage-post-details{padding:clamp(1.2rem,3vw,2rem)}.community-manage-post-details__topbar,.community-manage-post-details__meta{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}.community-manage-post-details__topbar a{color:#0284c7;text-decoration:none;font-weight:600}.community-manage-post-details__actions{display:flex;gap:.75rem;flex-wrap:wrap}.community-manage-post-details__meta{margin:1.35rem 0 1rem;color:var(--community-muted)}.community-manage-post-details h1{margin:0;font-size:clamp(1.9rem,4vw,3rem);line-height:1;letter-spacing:-.05em}.community-manage-post-details__summary{margin:.9rem 0 0;color:var(--community-muted);line-height:1.7}.community-manage-post-details__tags{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.35rem 0 1.6rem}.community-manage-post-details__tags span{padding:.35rem .8rem;border-radius:999px;background:#0ea5e91f;color:#0369a1;font-size:.88rem;font-weight:600}.community-manage-post-details__content{color:var(--community-text);line-height:1.8}.community-manage-post-details__state{padding:2rem}@media(max-width:840px){.community-manage-post-details__actions{width:100%}}\n"] }]
67
+ }], ctorParameters: () => [] });
68
+
69
+ export { CommunityManagePostDetailsComponent };
70
+ //# sourceMappingURL=rolatech-angular-community-community-manage-post-details.component-B70ewcPc.mjs.map
package/fesm2022/rolatech-angular-community-community-manage-post-details.component-B70ewcPc.mjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"rolatech-angular-community-community-manage-post-details.component-B70ewcPc.mjs","sources":["../../../../packages/angular-community/src/lib/pages/community-manage/community-manage-post-details/community-manage-post-details.component.ts","../../../../packages/angular-community/src/lib/pages/community-manage/community-manage-post-details/community-manage-post-details.component.html"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, computed, inject, signal } from '@angular/core';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatIconModule } from '@angular/material/icon';\nimport { ActivatedRoute, RouterLink } from '@angular/router';\nimport { EmptyComponent } from '@rolatech/angular-components';\nimport { PostRecord, SnackBarService, TitleService } from '@rolatech/angular-services';\nimport { CommunityPostStoreService } from '../../../services/community-post-store.service';\nimport { createPostPreview } from '../../../utils/post-view.util';\n\n@Component({\n selector: 'rolatech-community-manage-post-details',\n imports: [CommonModule, RouterLink, MatButtonModule, MatIconModule, EmptyComponent],\n templateUrl: './community-manage-post-details.component.html',\n styleUrl: './community-manage-post-details.component.scss',\n})\nexport class CommunityManagePostDetailsComponent {\n private readonly route = inject(ActivatedRoute);\n private readonly postStore = inject(CommunityPostStoreService);\n private readonly snackBar = inject(SnackBarService);\n private readonly titleService = inject(TitleService);\n\n readonly loading = signal(true);\n readonly post = signal<PostRecord | null>(null);\n readonly preview = computed(() => createPostPreview(this.post()?.content ?? ''));\n\n constructor() {\n this.loadPost(this.route.snapshot.paramMap.get('id') ?? '');\n }\n\n saveDraft() {\n const post = this.post();\n if (!post) {\n return;\n }\n\n this.postStore.saveDraft(post).subscribe({\n next: (saved) => {\n this.post.set(saved);\n this.snackBar.open('Draft saved');\n },\n });\n }\n\n publish() {\n const post = this.post();\n if (!post) {\n return;\n }\n\n this.postStore.publish(post).subscribe({\n next: (saved) => {\n this.post.set(saved);\n this.snackBar.open('Post published');\n },\n });\n }\n\n private loadPost(id: string) {\n this.loading.set(true);\n this.postStore.getManagePost(id).subscribe({\n next: (post) => {\n this.post.set(post);\n this.loading.set(false);\n this.titleService.setTitle(post?.title ? `${post.title} | Manage post` : 'Manage post');\n },\n error: () => {\n this.post.set(null);\n this.loading.set(false);\n },\n });\n }\n}\n","@if (loading()) {\n <div class=\"community-manage-post-details__state\">Loading post...</div>\n} @else if (post(); as post) {\n <article class=\"community-manage-post-details\">\n <div class=\"community-manage-post-details__topbar\">\n <a class=\"cursor-pointer\" [routerLink]=\"['../']\">Back to posts</a>\n <div class=\"community-manage-post-details__actions\">\n <button mat-stroked-button type=\"button\" (click)=\"saveDraft()\">Save draft</button>\n <button mat-flat-button color=\"primary\" type=\"button\" (click)=\"publish()\">Publish</button>\n <a class=\"cursor-pointer\" mat-stroked-button [routerLink]=\"['./edit']\">Edit</a>\n </div>\n </div>\n\n <div class=\"community-manage-post-details__meta\">\n <span>{{ post.status }}</span>\n <span>{{ preview().readingTimeMinutes }} min read</span>\n <span>{{ post.slug }}</span>\n </div>\n\n <h1>{{ post.title }}</h1>\n <p class=\"community-manage-post-details__summary\">{{ post.summary || post.excerpt }}</p>\n\n <div class=\"community-manage-post-details__tags\">\n @for (tag of post.tags ?? []; track tag) {\n <span>{{ tag }}</span>\n }\n </div>\n\n <section class=\"community-manage-post-details__content markdown-body\" [innerHTML]=\"preview().html\"></section>\n </article>\n} @else {\n <div class=\"community-manage-post-details__state\">\n <rolatech-empty></rolatech-empty>\n </div>\n}\n"],"names":["i1"],"mappings":"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"}
package/fesm2022/rolatech-angular-community-community-manage-post.component-DVRDQzXA.mjs ADDED
@@ -0,0 +1,137 @@
1
+ import { CommonModule } from '@angular/common';
2
+ import * as i0 from '@angular/core';
3
+ import { inject, model, signal, computed, Component } from '@angular/core';
4
+ import { toSignal } from '@angular/core/rxjs-interop';
5
+ import * as i1 from '@angular/forms';
6
+ import { FormBuilder, Validators, ReactiveFormsModule } from '@angular/forms';
7
+ import * as i2 from '@angular/material/button';
8
+ import { MatButtonModule } from '@angular/material/button';
9
+ import * as i3 from '@angular/material/icon';
10
+ import { MatIconModule } from '@angular/material/icon';
11
+ import { ActivatedRoute, Router } from '@angular/router';
12
+ import { TabsComponent, TabComponent } from '@rolatech/angular-components';
13
+ import { SnackBarService, TitleService } from '@rolatech/angular-services';
14
+ import { C as CommunityPostStoreService, c as createPostPreview, t as toTagInput } from './rolatech-angular-community-rolatech-angular-community-40yr8v0S.mjs';
15
+ import { startWith } from 'rxjs';
16
+
17
+ class CommunityManagePostComponent {
18
+ constructor() {
19
+ this.formBuilder = inject(FormBuilder);
20
+ this.route = inject(ActivatedRoute);
21
+ this.router = inject(Router);
22
+ this.postStore = inject(CommunityPostStoreService);
23
+ this.snackBar = inject(SnackBarService);
24
+ this.titleService = inject(TitleService);
25
+ this.editorTab = model(0, ...(ngDevMode ? [{ debugName: "editorTab" }] : []));
26
+ this.loading = signal(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
27
+ this.savingDraft = signal(false, ...(ngDevMode ? [{ debugName: "savingDraft" }] : []));
28
+ this.publishing = signal(false, ...(ngDevMode ? [{ debugName: "publishing" }] : []));
29
+ this.postId = signal(this.route.snapshot.paramMap.get('id'), ...(ngDevMode ? [{ debugName: "postId" }] : []));
30
+ this.form = this.formBuilder.nonNullable.group({
31
+ title: ['', [Validators.required, Validators.minLength(4)]],
32
+ slug: [''],
33
+ summary: [''],
34
+ tags: [''],
35
+ coverImage: [''],
36
+ content: ['', [Validators.required, Validators.minLength(20)]],
37
+ });
38
+ this.formValue = toSignal(this.form.valueChanges.pipe(startWith(this.form.getRawValue())), {
39
+ initialValue: this.form.getRawValue(),
40
+ });
41
+ this.preview = computed(() => createPostPreview(this.formValue().content ?? ''), ...(ngDevMode ? [{ debugName: "preview" }] : []));
42
+ this.canSubmit = computed(() => (this.formValue().title?.trim().length ?? 0) >= 4 && (this.formValue().content?.trim().length ?? 0) >= 20, ...(ngDevMode ? [{ debugName: "canSubmit" }] : []));
43
+ this.titleService.setTitle(this.postId() ? 'Edit post | Community' : 'Write post | Community');
44
+ if (this.postId()) {
45
+ this.loadPost(this.postId());
46
+ }
47
+ }
48
+ saveDraft() {
49
+ if (!this.canSubmit()) {
50
+ this.form.markAllAsTouched();
51
+ return;
52
+ }
53
+ this.savingDraft.set(true);
54
+ this.postStore.saveDraft({ id: this.postId() ?? undefined, ...this.payload() }).subscribe({
55
+ next: (post) => {
56
+ this.postId.set(post.id);
57
+ this.form.patchValue({ slug: post.slug ?? '', tags: toTagInput(post.tags) }, { emitEvent: false });
58
+ this.savingDraft.set(false);
59
+ this.snackBar.open('Draft saved');
60
+ this.navigateToEditor(post.id);
61
+ },
62
+ error: () => {
63
+ this.savingDraft.set(false);
64
+ },
65
+ });
66
+ }
67
+ publish() {
68
+ if (!this.canSubmit()) {
69
+ this.form.markAllAsTouched();
70
+ return;
71
+ }
72
+ this.publishing.set(true);
73
+ this.postStore.publish({ id: this.postId() ?? undefined, ...this.payload() }).subscribe({
74
+ next: (post) => {
75
+ this.postId.set(post.id);
76
+ this.publishing.set(false);
77
+ this.snackBar.open('Post published');
78
+ this.navigateToPreview(post.id);
79
+ },
80
+ error: () => {
81
+ this.publishing.set(false);
82
+ },
83
+ });
84
+ }
85
+ loadPost(id) {
86
+ this.loading.set(true);
87
+ this.postStore.getManagePost(id).subscribe({
88
+ next: (post) => {
89
+ if (post) {
90
+ this.form.patchValue({
91
+ title: post.title,
92
+ slug: post.slug ?? '',
93
+ summary: post.summary ?? post.excerpt ?? '',
94
+ tags: toTagInput(post.tags),
95
+ coverImage: post.coverImage ?? post.cover ?? '',
96
+ content: post.content,
97
+ });
98
+ }
99
+ this.loading.set(false);
100
+ },
101
+ error: () => {
102
+ this.loading.set(false);
103
+ },
104
+ });
105
+ }
106
+ payload() {
107
+ const value = this.form.getRawValue();
108
+ return {
109
+ title: value.title,
110
+ slug: value.slug,
111
+ summary: value.summary,
112
+ coverImage: value.coverImage,
113
+ tags: value.tags
114
+ .split(',')
115
+ .map((tag) => tag.trim())
116
+ .filter(Boolean),
117
+ content: value.content,
118
+ };
119
+ }
120
+ navigateToEditor(id) {
121
+ const parent = this.route.parent ?? this.route;
122
+ this.router.navigate(['manage', id, 'edit'], { relativeTo: parent });
123
+ }
124
+ navigateToPreview(id) {
125
+ const parent = this.route.parent ?? this.route;
126
+ this.router.navigate(['manage', id], { relativeTo: parent });
127
+ }
128
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CommunityManagePostComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
129
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: CommunityManagePostComponent, isStandalone: true, selector: "rolatech-community-manage-post", inputs: { editorTab: { classPropertyName: "editorTab", publicName: "editorTab", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { editorTab: "editorTabChange" }, ngImport: i0, template: "<div class=\"community-manage-post\">\n <section class=\"community-manage-post__header\">\n <div>\n <h2>{{ postId() ? 'Edit post' : 'Create post' }}</h2>\n <p>Write in markdown, check the preview, then save a durable draft or publish immediately.</p>\n </div>\n\n <div class=\"community-manage-post__actions\">\n <button mat-stroked-button type=\"button\" (click)=\"saveDraft()\" [disabled]=\"savingDraft() || publishing()\">\n <mat-icon>save</mat-icon>\n <span>{{ savingDraft() ? 'Saving...' : 'Save draft' }}</span>\n </button>\n\n <button mat-flat-button color=\"primary\" type=\"button\" (click)=\"publish()\" [disabled]=\"savingDraft() || publishing()\">\n <mat-icon>publish</mat-icon>\n <span>{{ publishing() ? 'Publishing...' : 'Publish' }}</span>\n </button>\n </div>\n </section>\n\n @if (loading()) {\n <div class=\"community-manage-post__state\">Loading post...</div>\n } @else {\n <section class=\"community-manage-post__workspace\">\n <form class=\"community-manage-post__form\" [formGroup]=\"form\">\n <label>\n <span>Title</span>\n <input type=\"text\" formControlName=\"title\" placeholder=\"Write a clear, scannable title\" />\n </label>\n\n <label>\n <span>Slug</span>\n <input type=\"text\" formControlName=\"slug\" placeholder=\"url-ready-post-slug\" />\n </label>\n\n <label>\n <span>Summary</span>\n <textarea rows=\"3\" formControlName=\"summary\" placeholder=\"Short summary shown in cards and previews\"></textarea>\n </label>\n\n <label>\n <span>Tags</span>\n <input type=\"text\" formControlName=\"tags\" placeholder=\"angular, community, design\" />\n </label>\n\n <label>\n <span>Cover image URL</span>\n <input type=\"url\" formControlName=\"coverImage\" placeholder=\"https://...\" />\n </label>\n\n <label>\n <span>Content</span>\n <textarea rows=\"18\" formControlName=\"content\" placeholder=\"# Heading&#10;&#10;Write markdown content here...\"></textarea>\n </label>\n </form>\n\n <aside class=\"community-manage-post__preview\">\n <rolatech-tabs mode=\"background\" [(select)]=\"editorTab\">\n <rolatech-tab label=\"Preview\"></rolatech-tab>\n <rolatech-tab label=\"Stats\"></rolatech-tab>\n </rolatech-tabs>\n\n @if (editorTab() === 0) {\n <article class=\"community-manage-post__preview-card\">\n <h3>{{ form.controls.title.value || 'Untitled post' }}</h3>\n <p>{{ form.controls.summary.value || 'Add a summary so cards and detail pages have useful context.' }}</p>\n <div class=\"community-manage-post__preview-content markdown-body\" [innerHTML]=\"preview().html\"></div>\n </article>\n } @else {\n <article class=\"community-manage-post__stats-card\">\n <div>\n <span class=\"community-manage-post__stat-label\">Words</span>\n <strong>{{ preview().wordCount }}</strong>\n </div>\n <div>\n <span class=\"community-manage-post__stat-label\">Reading time</span>\n <strong>{{ preview().readingTimeMinutes }} min</strong>\n </div>\n <div>\n <span class=\"community-manage-post__stat-label\">Slug</span>\n <strong>{{ form.controls.slug.value || 'Generated on save' }}</strong>\n </div>\n </article>\n }\n </aside>\n </section>\n }\n</div>\n", styles: [".community-manage-post{display:grid;gap:1.25rem}.community-manage-post__header,.community-manage-post__workspace,.community-manage-post__state,.community-manage-post__preview-card,.community-manage-post__stats-card{border:1px solid var(--community-border);border-radius:24px;background:var(--community-surface-strong);box-shadow:var(--community-shadow)}.community-manage-post__header{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1.1rem 1.2rem}.community-manage-post__header h2{margin:0;font-size:1.55rem}.community-manage-post__header p{margin:.4rem 0 0;color:var(--community-muted)}.community-manage-post__actions{display:flex;gap:.75rem;flex-wrap:wrap}.community-manage-post__workspace{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(20rem,.8fr);gap:1.25rem;padding:1.2rem}.community-manage-post__form{display:grid;gap:.95rem}.community-manage-post__form label{display:grid;gap:.4rem;color:var(--community-muted);font-size:.92rem}.community-manage-post__form input,.community-manage-post__form textarea{width:100%;border:1px solid var(--community-border);border-radius:16px;background:transparent;color:var(--community-text);padding:.85rem 1rem;resize:vertical;outline:none}.community-manage-post__preview{display:grid;gap:.9rem}.community-manage-post__preview-card,.community-manage-post__stats-card{padding:1.1rem 1.2rem}.community-manage-post__preview-card h3{margin:0;font-size:1.45rem}.community-manage-post__preview-card p{margin:.8rem 0 1rem;color:var(--community-muted);line-height:1.7}.community-manage-post__preview-content{max-height:34rem;overflow:auto}.community-manage-post__stats-card{display:grid;gap:1rem}.community-manage-post__stats-card div{display:grid;gap:.25rem}.community-manage-post__stat-label{color:var(--community-muted);font-size:.9rem}.community-manage-post__state{padding:2rem}@media(max-width:980px){.community-manage-post__header{flex-direction:column;align-items:stretch}.community-manage-post__workspace{grid-template-columns:1fr}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2.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: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading", "block", "mode"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"], outputs: ["selectRequested"] }] }); }
130
+ }
131
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: CommunityManagePostComponent, decorators: [{
132
+ type: Component,
133
+ args: [{ selector: 'rolatech-community-manage-post', imports: [CommonModule, ReactiveFormsModule, MatButtonModule, MatIconModule, TabsComponent, TabComponent], template: "<div class=\"community-manage-post\">\n <section class=\"community-manage-post__header\">\n <div>\n <h2>{{ postId() ? 'Edit post' : 'Create post' }}</h2>\n <p>Write in markdown, check the preview, then save a durable draft or publish immediately.</p>\n </div>\n\n <div class=\"community-manage-post__actions\">\n <button mat-stroked-button type=\"button\" (click)=\"saveDraft()\" [disabled]=\"savingDraft() || publishing()\">\n <mat-icon>save</mat-icon>\n <span>{{ savingDraft() ? 'Saving...' : 'Save draft' }}</span>\n </button>\n\n <button mat-flat-button color=\"primary\" type=\"button\" (click)=\"publish()\" [disabled]=\"savingDraft() || publishing()\">\n <mat-icon>publish</mat-icon>\n <span>{{ publishing() ? 'Publishing...' : 'Publish' }}</span>\n </button>\n </div>\n </section>\n\n @if (loading()) {\n <div class=\"community-manage-post__state\">Loading post...</div>\n } @else {\n <section class=\"community-manage-post__workspace\">\n <form class=\"community-manage-post__form\" [formGroup]=\"form\">\n <label>\n <span>Title</span>\n <input type=\"text\" formControlName=\"title\" placeholder=\"Write a clear, scannable title\" />\n </label>\n\n <label>\n <span>Slug</span>\n <input type=\"text\" formControlName=\"slug\" placeholder=\"url-ready-post-slug\" />\n </label>\n\n <label>\n <span>Summary</span>\n <textarea rows=\"3\" formControlName=\"summary\" placeholder=\"Short summary shown in cards and previews\"></textarea>\n </label>\n\n <label>\n <span>Tags</span>\n <input type=\"text\" formControlName=\"tags\" placeholder=\"angular, community, design\" />\n </label>\n\n <label>\n <span>Cover image URL</span>\n <input type=\"url\" formControlName=\"coverImage\" placeholder=\"https://...\" />\n </label>\n\n <label>\n <span>Content</span>\n <textarea rows=\"18\" formControlName=\"content\" placeholder=\"# Heading&#10;&#10;Write markdown content here...\"></textarea>\n </label>\n </form>\n\n <aside class=\"community-manage-post__preview\">\n <rolatech-tabs mode=\"background\" [(select)]=\"editorTab\">\n <rolatech-tab label=\"Preview\"></rolatech-tab>\n <rolatech-tab label=\"Stats\"></rolatech-tab>\n </rolatech-tabs>\n\n @if (editorTab() === 0) {\n <article class=\"community-manage-post__preview-card\">\n <h3>{{ form.controls.title.value || 'Untitled post' }}</h3>\n <p>{{ form.controls.summary.value || 'Add a summary so cards and detail pages have useful context.' }}</p>\n <div class=\"community-manage-post__preview-content markdown-body\" [innerHTML]=\"preview().html\"></div>\n </article>\n } @else {\n <article class=\"community-manage-post__stats-card\">\n <div>\n <span class=\"community-manage-post__stat-label\">Words</span>\n <strong>{{ preview().wordCount }}</strong>\n </div>\n <div>\n <span class=\"community-manage-post__stat-label\">Reading time</span>\n <strong>{{ preview().readingTimeMinutes }} min</strong>\n </div>\n <div>\n <span class=\"community-manage-post__stat-label\">Slug</span>\n <strong>{{ form.controls.slug.value || 'Generated on save' }}</strong>\n </div>\n </article>\n }\n </aside>\n </section>\n }\n</div>\n", styles: [".community-manage-post{display:grid;gap:1.25rem}.community-manage-post__header,.community-manage-post__workspace,.community-manage-post__state,.community-manage-post__preview-card,.community-manage-post__stats-card{border:1px solid var(--community-border);border-radius:24px;background:var(--community-surface-strong);box-shadow:var(--community-shadow)}.community-manage-post__header{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1.1rem 1.2rem}.community-manage-post__header h2{margin:0;font-size:1.55rem}.community-manage-post__header p{margin:.4rem 0 0;color:var(--community-muted)}.community-manage-post__actions{display:flex;gap:.75rem;flex-wrap:wrap}.community-manage-post__workspace{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(20rem,.8fr);gap:1.25rem;padding:1.2rem}.community-manage-post__form{display:grid;gap:.95rem}.community-manage-post__form label{display:grid;gap:.4rem;color:var(--community-muted);font-size:.92rem}.community-manage-post__form input,.community-manage-post__form textarea{width:100%;border:1px solid var(--community-border);border-radius:16px;background:transparent;color:var(--community-text);padding:.85rem 1rem;resize:vertical;outline:none}.community-manage-post__preview{display:grid;gap:.9rem}.community-manage-post__preview-card,.community-manage-post__stats-card{padding:1.1rem 1.2rem}.community-manage-post__preview-card h3{margin:0;font-size:1.45rem}.community-manage-post__preview-card p{margin:.8rem 0 1rem;color:var(--community-muted);line-height:1.7}.community-manage-post__preview-content{max-height:34rem;overflow:auto}.community-manage-post__stats-card{display:grid;gap:1rem}.community-manage-post__stats-card div{display:grid;gap:.25rem}.community-manage-post__stat-label{color:var(--community-muted);font-size:.9rem}.community-manage-post__state{padding:2rem}@media(max-width:980px){.community-manage-post__header{flex-direction:column;align-items:stretch}.community-manage-post__workspace{grid-template-columns:1fr}}\n"] }]
134
+ }], ctorParameters: () => [], propDecorators: { editorTab: [{ type: i0.Input, args: [{ isSignal: true, alias: "editorTab", required: false }] }, { type: i0.Output, args: ["editorTabChange"] }] } });
135
+
136
+ export { CommunityManagePostComponent };
137
+ //# sourceMappingURL=rolatech-angular-community-community-manage-post.component-DVRDQzXA.mjs.map