@foliokit/cms-admin-ui 0.0.0 → 0.1.0

package/esm2022/lib/post-editor/post-editor.store.js

@@ -0,0 +1,189 @@
+import { inject } from '@angular/core';
+import { patchState, signalStore, watchState, withComputed, withHooks, withMethods, withState, } from '@ngrx/signals';
+import { computed } from '@angular/core';
+import { Subject } from 'rxjs';
+import { debounceTime, filter, switchMap } from 'rxjs/operators';
+import { PostService } from '@foliokit/cms-core';
+const initialState = {
+    post: null,
+    isDirty: false,
+    isSaving: false,
+    saveError: null,
+    mode: 'new',
+    cursorPosition: 0,
+    tempPostId: crypto.randomUUID(),
+};
+function blankPost() {
+    const now = Date.now();
+    return {
+        id: '',
+        slug: '',
+        title: '',
+        subtitle: '',
+        status: 'draft',
+        content: '',
+        excerpt: '',
+        tags: [],
+        embeddedMedia: {},
+        seo: {},
+        publishedAt: now,
+        updatedAt: now,
+        createdAt: now,
+    };
+}
+export const PostEditorStore = signalStore(withState(initialState), withComputed((store) => ({
+    isNew: computed(() => store.mode() === 'new'),
+    canPublish: computed(() => {
+        const post = store.post();
+        return (post !== null &&
+            post.title.trim().length > 0 &&
+            post.status !== 'published');
+    }),
+})), withMethods((store, postService = inject(PostService)) => {
+    let autosaveTrigger$ = null;
+    function cancelAutosave() {
+        autosaveTrigger$?.next('cancel');
+    }
+    return {
+        _setAutosaveTrigger(trigger) {
+            autosaveTrigger$ = trigger;
+        },
+        loadPost(id) {
+            postService.getPostById(id).subscribe((post) => {
+                patchState(store, {
+                    post,
+                    isDirty: false,
+                    isSaving: false,
+                    saveError: null,
+                    mode: 'edit',
+                });
+            });
+        },
+        initNew() {
+            patchState(store, {
+                post: blankPost(),
+                isDirty: false,
+                isSaving: false,
+                saveError: null,
+                mode: 'new',
+            });
+        },
+        updateField(field, value) {
+            const current = store.post();
+            if (!current)
+                return;
+            patchState(store, { post: { ...current, [field]: value }, isDirty: true });
+        },
+        save() {
+            const post = store.post();
+            if (!post)
+                return;
+            cancelAutosave();
+            patchState(store, { isSaving: true, saveError: null });
+            postService.savePost(post).subscribe({
+                next: (saved) => {
+                    patchState(store, {
+                        post: saved,
+                        isDirty: false,
+                        isSaving: false,
+                        mode: 'edit',
+                    });
+                },
+                error: (err) => {
+                    const message = err instanceof Error ? err.message : 'Save failed';
+                    patchState(store, { isSaving: false, saveError: message });
+                },
+            });
+        },
+        setCursorPosition(position) {
+            patchState(store, { cursorPosition: position });
+        },
+        insertMediaAtCursor(token) {
+            const post = store.post();
+            const pos = store.cursorPosition();
+            if (!post)
+                return;
+            const before = post.content.slice(0, pos);
+            const after = post.content.slice(pos);
+            const insertion = `![alt](${token})`;
+            patchState(store, {
+                post: { ...post, content: `${before}${insertion}${after}` },
+                isDirty: true,
+                cursorPosition: pos + insertion.length,
+            });
+        },
+        removeEmbeddedMedia(token) {
+            const post = store.post();
+            if (!post)
+                return;
+            const entry = post.embeddedMedia[token];
+            const { [token]: _, ...remaining } = post.embeddedMedia;
+            patchState(store, {
+                post: { ...post, embeddedMedia: remaining },
+                isDirty: true,
+            });
+            if (entry) {
+                postService.deleteStorageFile(entry.storagePath).subscribe();
+            }
+        },
+        publish() {
+            const post = store.post();
+            if (!post)
+                return;
+            const prevStatus = post.status;
+            const prevPublishedAt = post.publishedAt;
+            const now = Date.now();
+            patchState(store, {
+                post: { ...post, status: 'published', publishedAt: now },
+                isDirty: true,
+            });
+            cancelAutosave();
+            patchState(store, { isSaving: true, saveError: null });
+            postService.savePost({ ...post, status: 'published', publishedAt: now }).subscribe({
+                next: (saved) => {
+                    patchState(store, {
+                        post: saved,
+                        isDirty: false,
+                        isSaving: false,
+                        mode: 'edit',
+                    });
+                },
+                error: (err) => {
+                    const message = err instanceof Error ? err.message : 'Publish failed';
+                    const current = store.post();
+                    patchState(store, {
+                        post: current
+                            ? { ...current, status: prevStatus, publishedAt: prevPublishedAt }
+                            : current,
+                        isSaving: false,
+                        saveError: message,
+                    });
+                },
+            });
+        },
+    };
+}), withHooks({
+    onInit(store) {
+        const trigger$ = new Subject();
+        store._setAutosaveTrigger(trigger$);
+        const autosaveSub = trigger$
+            .pipe(filter((v) => v === 'save'), debounceTime(2000), switchMap(() => {
+            const post = store.post();
+            if (!post || !store.isDirty() || post.status !== 'draft') {
+                return [];
+            }
+            return [true];
+        }))
+            .subscribe(() => store.save());
+        watchState(store, (state) => {
+            if (state.isDirty && state.post?.status === 'draft' && !state.isSaving) {
+                trigger$.next('save');
+            }
+        });
+        return () => {
+            autosaveSub.unsubscribe();
+            trigger$.complete();
+        };
+    },
+}));
+//# sourceMappingURL=post-editor.store.js.map

package/esm2022/lib/post-editor/post-editor.store.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"post-editor.store.js","sourceRoot":"","sources":["../../../../../../libs/cms-admin-ui/src/lib/post-editor/post-editor.store.ts"],"names":[],"mappings":"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","sourcesContent":["import { inject } from '@angular/core';\nimport {\n  patchState,\n  signalStore,\n  watchState,\n  withComputed,\n  withHooks,\n  withMethods,\n  withState,\n} from '@ngrx/signals';\nimport { computed } from '@angular/core';\nimport { Subject } from 'rxjs';\nimport { debounceTime, filter, switchMap } from 'rxjs/operators';\nimport { BlogPost, PostService } from '@foliokit/cms-core';\n\nexport interface PostEditorState {\n  post: BlogPost | null;\n  isDirty: boolean;\n  isSaving: boolean;\n  saveError: string | null;\n  mode: 'new' | 'edit';\n  cursorPosition: number;\n  tempPostId: string;\n}\n\nconst initialState: PostEditorState = {\n  post: null,\n  isDirty: false,\n  isSaving: false,\n  saveError: null,\n  mode: 'new',\n  cursorPosition: 0,\n  tempPostId: crypto.randomUUID(),\n};\n\nfunction blankPost(): BlogPost {\n  const now = Date.now();\n  return {\n    id: '',\n    slug: '',\n    title: '',\n    subtitle: '',\n    status: 'draft',\n    content: '',\n    excerpt: '',\n    tags: [],\n    embeddedMedia: {},\n    seo: {},\n    publishedAt: now,\n    updatedAt: now,\n    createdAt: now,\n  };\n}\n\nexport const PostEditorStore = signalStore(\n  withState<PostEditorState>(initialState),\n\n  withComputed((store) => ({\n    isNew: computed(() => store.mode() === 'new'),\n    canPublish: computed(() => {\n      const post = store.post();\n      return (\n        post !== null &&\n        post.title.trim().length > 0 &&\n        post.status !== 'published'\n      );\n    }),\n  })),\n\n  withMethods((store, postService = inject(PostService)) => {\n    let autosaveTrigger$: Subject<'save' | 'cancel'> | null = null;\n\n    function cancelAutosave() {\n      autosaveTrigger$?.next('cancel');\n    }\n\n    return {\n      _setAutosaveTrigger(trigger: Subject<'save' | 'cancel'>) {\n        autosaveTrigger$ = trigger;\n      },\n\n      loadPost(id: string): void {\n        postService.getPostById(id).subscribe((post) => {\n          patchState(store, {\n            post,\n            isDirty: false,\n            isSaving: false,\n            saveError: null,\n            mode: 'edit',\n          });\n        });\n      },\n\n      initNew(): void {\n        patchState(store, {\n          post: blankPost(),\n          isDirty: false,\n          isSaving: false,\n          saveError: null,\n          mode: 'new',\n        });\n      },\n\n      updateField<K extends keyof BlogPost>(field: K, value: BlogPost[K]): void {\n        const current = store.post();\n        if (!current) return;\n        patchState(store, { post: { ...current, [field]: value }, isDirty: true });\n      },\n\n      save(): void {\n        const post = store.post();\n        if (!post) return;\n        cancelAutosave();\n        patchState(store, { isSaving: true, saveError: null });\n        postService.savePost(post).subscribe({\n          next: (saved) => {\n            patchState(store, {\n              post: saved,\n              isDirty: false,\n              isSaving: false,\n              mode: 'edit',\n            });\n          },\n          error: (err: unknown) => {\n            const message =\n              err instanceof Error ? err.message : 'Save failed';\n            patchState(store, { isSaving: false, saveError: message });\n          },\n        });\n      },\n\n      setCursorPosition(position: number): void {\n        patchState(store, { cursorPosition: position });\n      },\n\n      insertMediaAtCursor(token: string): void {\n        const post = store.post();\n        const pos = store.cursorPosition();\n        if (!post) return;\n        const before = post.content.slice(0, pos);\n        const after = post.content.slice(pos);\n        const insertion = `![alt](${token})`;\n        patchState(store, {\n          post: { ...post, content: `${before}${insertion}${after}` },\n          isDirty: true,\n          cursorPosition: pos + insertion.length,\n        });\n      },\n\n      removeEmbeddedMedia(token: string): void {\n        const post = store.post();\n        if (!post) return;\n        const entry = post.embeddedMedia[token];\n        const { [token]: _, ...remaining } = post.embeddedMedia;\n        patchState(store, {\n          post: { ...post, embeddedMedia: remaining },\n          isDirty: true,\n        });\n        if (entry) {\n          postService.deleteStorageFile(entry.storagePath).subscribe();\n        }\n      },\n\n      publish(): void {\n        const post = store.post();\n        if (!post) return;\n        const prevStatus = post.status;\n        const prevPublishedAt = post.publishedAt;\n        const now = Date.now();\n        patchState(store, {\n          post: { ...post, status: 'published', publishedAt: now },\n          isDirty: true,\n        });\n        cancelAutosave();\n        patchState(store, { isSaving: true, saveError: null });\n        postService.savePost({ ...post, status: 'published', publishedAt: now }).subscribe({\n          next: (saved) => {\n            patchState(store, {\n              post: saved,\n              isDirty: false,\n              isSaving: false,\n              mode: 'edit',\n            });\n          },\n          error: (err: unknown) => {\n            const message =\n              err instanceof Error ? err.message : 'Publish failed';\n            const current = store.post();\n            patchState(store, {\n              post: current\n                ? { ...current, status: prevStatus, publishedAt: prevPublishedAt }\n                : current,\n              isSaving: false,\n              saveError: message,\n            });\n          },\n        });\n      },\n    };\n  }),\n\n  withHooks({\n    onInit(store) {\n      const trigger$ = new Subject<'save' | 'cancel'>();\n      store._setAutosaveTrigger(trigger$);\n\n      const autosaveSub = trigger$\n        .pipe(\n          filter((v) => v === 'save'),\n          debounceTime(2000),\n          switchMap(() => {\n            const post = store.post();\n            if (!post || !store.isDirty() || post.status !== 'draft') {\n              return [];\n            }\n            return [true];\n          }),\n        )\n        .subscribe(() => store.save());\n\n      watchState(store, (state) => {\n        if (state.isDirty && state.post?.status === 'draft' && !state.isSaving) {\n          trigger$.next('save');\n        }\n      });\n\n      return () => {\n        autosaveSub.unsubscribe();\n        trigger$.complete();\n      };\n    },\n  }),\n);\n"]}

package/esm2022/lib/posts-list/posts-board.component.js

@@ -0,0 +1,66 @@
+import { ChangeDetectionStrategy, Component, inject, output, } from '@angular/core';
+import { PostsListStore } from './posts-list.store';
+import { PostsDraftColumnComponent } from './posts-draft-column.component';
+import { PostsQueueColumnComponent } from './posts-queue-column.component';
+import { PostsPublishedColumnComponent } from './posts-published-column.component';
+import * as i0 from "@angular/core";
+export class PostsBoardComponent {
+    store = inject(PostsListStore);
+    postSelected = output();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: PostsBoardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: PostsBoardComponent, isStandalone: true, selector: "folio-posts-board", outputs: { postSelected: "postSelected" }, host: { classAttribute: "block h-full" }, ngImport: i0, template: `
+    <div class="grid grid-cols-1 lg:grid-cols-3 gap-4 h-full">
+      <folio-posts-draft-column
+        [posts]="store.draftPosts()"
+        (postSelected)="postSelected.emit($event)"
+      />
+
+      <folio-posts-queue-column
+        [posts]="store.scheduledPosts()"
+        (postSelected)="postSelected.emit($event)"
+        (reorderQueue)="store.reorderQueue($event.previousIndex, $event.currentIndex)"
+      />
+
+      <folio-posts-published-column
+        [posts]="store.publishedPosts()"
+        [archivedPosts]="store.archivedPosts()"
+        (postSelected)="postSelected.emit($event)"
+      />
+    </div>
+  `, isInline: true, dependencies: [{ kind: "component", type: PostsDraftColumnComponent, selector: "folio-posts-draft-column", inputs: ["posts"], outputs: ["postSelected"] }, { kind: "component", type: PostsQueueColumnComponent, selector: "folio-posts-queue-column", inputs: ["posts"], outputs: ["postSelected", "reorderQueue"] }, { kind: "component", type: PostsPublishedColumnComponent, selector: "folio-posts-published-column", inputs: ["posts", "archivedPosts"], outputs: ["postSelected"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: PostsBoardComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'folio-posts-board',
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [
+                        PostsDraftColumnComponent,
+                        PostsQueueColumnComponent,
+                        PostsPublishedColumnComponent,
+                    ],
+                    host: { class: 'block h-full' },
+                    template: `
+    <div class="grid grid-cols-1 lg:grid-cols-3 gap-4 h-full">
+      <folio-posts-draft-column
+        [posts]="store.draftPosts()"
+        (postSelected)="postSelected.emit($event)"
+      />
+
+      <folio-posts-queue-column
+        [posts]="store.scheduledPosts()"
+        (postSelected)="postSelected.emit($event)"
+        (reorderQueue)="store.reorderQueue($event.previousIndex, $event.currentIndex)"
+      />
+
+      <folio-posts-published-column
+        [posts]="store.publishedPosts()"
+        [archivedPosts]="store.archivedPosts()"
+        (postSelected)="postSelected.emit($event)"
+      />
+    </div>
+  `,
+                }]
+        }], propDecorators: { postSelected: [{ type: i0.Output, args: ["postSelected"] }] } });
+//# sourceMappingURL=posts-board.component.js.map

package/esm2022/lib/posts-list/posts-board.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"posts-board.component.js","sourceRoot":"","sources":["../../../../../../libs/cms-admin-ui/src/lib/posts-list/posts-board.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,MAAM,EACN,MAAM,GACP,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAC;AAC3E,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAC;AAC3E,OAAO,EAAE,6BAA6B,EAAE,MAAM,oCAAoC,CAAC;;AAiCnF,MAAM,OAAO,mBAAmB;IACX,KAAK,GAAG,MAAM,CAAC,cAAc,CAAC,CAAC;IAClD,YAAY,GAAG,MAAM,EAAU,CAAC;uGAFrB,mBAAmB;2FAAnB,mBAAmB,kKArBpB;;;;;;;;;;;;;;;;;;;GAmBT,4DAxBC,yBAAyB,mHACzB,yBAAyB,mIACzB,6BAA6B;;2FAwBpB,mBAAmB;kBA/B/B,SAAS;mBAAC;oBACT,QAAQ,EAAE,mBAAmB;oBAC7B,UAAU,EAAE,IAAI;oBAChB,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,OAAO,EAAE;wBACP,yBAAyB;wBACzB,yBAAyB;wBACzB,6BAA6B;qBAC9B;oBACD,IAAI,EAAE,EAAE,KAAK,EAAE,cAAc,EAAE;oBAC/B,QAAQ,EAAE;;;;;;;;;;;;;;;;;;;GAmBT;iBACF","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  inject,\n  output,\n} from '@angular/core';\nimport { PostsListStore } from './posts-list.store';\nimport { PostsDraftColumnComponent } from './posts-draft-column.component';\nimport { PostsQueueColumnComponent } from './posts-queue-column.component';\nimport { PostsPublishedColumnComponent } from './posts-published-column.component';\n\n@Component({\n  selector: 'folio-posts-board',\n  standalone: true,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [\n    PostsDraftColumnComponent,\n    PostsQueueColumnComponent,\n    PostsPublishedColumnComponent,\n  ],\n  host: { class: 'block h-full' },\n  template: `\n    <div class=\"grid grid-cols-1 lg:grid-cols-3 gap-4 h-full\">\n      <folio-posts-draft-column\n        [posts]=\"store.draftPosts()\"\n        (postSelected)=\"postSelected.emit($event)\"\n      />\n\n      <folio-posts-queue-column\n        [posts]=\"store.scheduledPosts()\"\n        (postSelected)=\"postSelected.emit($event)\"\n        (reorderQueue)=\"store.reorderQueue($event.previousIndex, $event.currentIndex)\"\n      />\n\n      <folio-posts-published-column\n        [posts]=\"store.publishedPosts()\"\n        [archivedPosts]=\"store.archivedPosts()\"\n        (postSelected)=\"postSelected.emit($event)\"\n      />\n    </div>\n  `,\n})\nexport class PostsBoardComponent {\n  protected readonly store = inject(PostsListStore);\n  postSelected = output<string>();\n}\n"]}

package/esm2022/lib/posts-list/posts-draft-column.component.js

@@ -0,0 +1,71 @@
+import { ChangeDetectionStrategy, Component, input, output } from '@angular/core';
+import { DatePipe } from '@angular/common';
+import { MatCardModule } from '@angular/material/card';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/material/card";
+export class PostsDraftColumnComponent {
+    posts = input.required(...(ngDevMode ? [{ debugName: "posts" }] : /* istanbul ignore next */ []));
+    postSelected = output();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: PostsDraftColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: PostsDraftColumnComponent, isStandalone: true, selector: "folio-posts-draft-column", inputs: { posts: { classPropertyName: "posts", publicName: "posts", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { postSelected: "postSelected" }, host: { classAttribute: "contents" }, ngImport: i0, template: `
+    <mat-card appearance="outlined" class="flex flex-col overflow-hidden">
+      <div class="shrink-0 flex items-center gap-2 px-4 py-3 border-b border-[var(--mat-sys-outline-variant)]">
+        <span class="text-sm font-semibold">Draft</span>
+        <span class="inline-flex items-center justify-center rounded-full bg-[var(--mat-sys-secondary-container)] text-[var(--mat-sys-on-secondary-container)] text-xs font-medium min-w-[1.25rem] h-5 px-1.5">
+          {{ posts().length }}
+        </span>
+      </div>
+
+      <div class="flex-1 overflow-y-auto divide-y divide-[var(--mat-sys-outline-variant)]">
+        @for (post of posts(); track post.id) {
+          <button
+            type="button"
+            class="w-full flex items-center justify-between gap-3 px-4 py-3 text-left hover:bg-[var(--mat-sys-surface-container-high)] transition-colors"
+            (click)="postSelected.emit(post.id)"
+          >
+            <span class="truncate text-sm font-medium">{{ post.title || '(Untitled)' }}</span>
+            <span class="shrink-0 text-xs opacity-50">{{ post.updatedAt | date: 'mediumDate' }}</span>
+          </button>
+        } @empty {
+          <div class="py-10 text-center text-sm opacity-40">No drafts</div>
+        }
+      </div>
+    </mat-card>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: PostsDraftColumnComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'folio-posts-draft-column',
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [DatePipe, MatCardModule],
+                    host: { class: 'contents' },
+                    template: `
+    <mat-card appearance="outlined" class="flex flex-col overflow-hidden">
+      <div class="shrink-0 flex items-center gap-2 px-4 py-3 border-b border-[var(--mat-sys-outline-variant)]">
+        <span class="text-sm font-semibold">Draft</span>
+        <span class="inline-flex items-center justify-center rounded-full bg-[var(--mat-sys-secondary-container)] text-[var(--mat-sys-on-secondary-container)] text-xs font-medium min-w-[1.25rem] h-5 px-1.5">
+          {{ posts().length }}
+        </span>
+      </div>
+
+      <div class="flex-1 overflow-y-auto divide-y divide-[var(--mat-sys-outline-variant)]">
+        @for (post of posts(); track post.id) {
+          <button
+            type="button"
+            class="w-full flex items-center justify-between gap-3 px-4 py-3 text-left hover:bg-[var(--mat-sys-surface-container-high)] transition-colors"
+            (click)="postSelected.emit(post.id)"
+          >
+            <span class="truncate text-sm font-medium">{{ post.title || '(Untitled)' }}</span>
+            <span class="shrink-0 text-xs opacity-50">{{ post.updatedAt | date: 'mediumDate' }}</span>
+          </button>
+        } @empty {
+          <div class="py-10 text-center text-sm opacity-40">No drafts</div>
+        }
+      </div>
+    </mat-card>
+  `,
+                }]
+        }], propDecorators: { posts: [{ type: i0.Input, args: [{ isSignal: true, alias: "posts", required: true }] }], postSelected: [{ type: i0.Output, args: ["postSelected"] }] } });
+//# sourceMappingURL=posts-draft-column.component.js.map

package/esm2022/lib/posts-list/posts-draft-column.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"posts-draft-column.component.js","sourceRoot":"","sources":["../../../../../../libs/cms-admin-ui/src/lib/posts-list/posts-draft-column.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAClF,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;;;AAmCvD,MAAM,OAAO,yBAAyB;IACpC,KAAK,GAAG,KAAK,CAAC,QAAQ,2EAAc,CAAC;IACrC,YAAY,GAAG,MAAM,EAAU,CAAC;uGAFrB,yBAAyB;2FAAzB,yBAAyB,wSA1B1B;;;;;;;;;;;;;;;;;;;;;;;;GAwBT,2DA1BmB,aAAa,wIAAvB,QAAQ;;2FA4BP,yBAAyB;kBAhCrC,SAAS;mBAAC;oBACT,QAAQ,EAAE,0BAA0B;oBACpC,UAAU,EAAE,IAAI;oBAChB,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,OAAO,EAAE,CAAC,QAAQ,EAAE,aAAa,CAAC;oBAClC,IAAI,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE;oBAC3B,QAAQ,EAAE;;;;;;;;;;;;;;;;;;;;;;;;GAwBT;iBACF","sourcesContent":["import { ChangeDetectionStrategy, Component, input, output } from '@angular/core';\nimport { DatePipe } from '@angular/common';\nimport { MatCardModule } from '@angular/material/card';\nimport { BlogPost } from '@foliokit/cms-core';\n\n@Component({\n  selector: 'folio-posts-draft-column',\n  standalone: true,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [DatePipe, MatCardModule],\n  host: { class: 'contents' },\n  template: `\n    <mat-card appearance=\"outlined\" class=\"flex flex-col overflow-hidden\">\n      <div class=\"shrink-0 flex items-center gap-2 px-4 py-3 border-b border-[var(--mat-sys-outline-variant)]\">\n        <span class=\"text-sm font-semibold\">Draft</span>\n        <span class=\"inline-flex items-center justify-center rounded-full bg-[var(--mat-sys-secondary-container)] text-[var(--mat-sys-on-secondary-container)] text-xs font-medium min-w-[1.25rem] h-5 px-1.5\">\n          {{ posts().length }}\n        </span>\n      </div>\n\n      <div class=\"flex-1 overflow-y-auto divide-y divide-[var(--mat-sys-outline-variant)]\">\n        @for (post of posts(); track post.id) {\n          <button\n            type=\"button\"\n            class=\"w-full flex items-center justify-between gap-3 px-4 py-3 text-left hover:bg-[var(--mat-sys-surface-container-high)] transition-colors\"\n            (click)=\"postSelected.emit(post.id)\"\n          >\n            <span class=\"truncate text-sm font-medium\">{{ post.title || '(Untitled)' }}</span>\n            <span class=\"shrink-0 text-xs opacity-50\">{{ post.updatedAt | date: 'mediumDate' }}</span>\n          </button>\n        } @empty {\n          <div class=\"py-10 text-center text-sm opacity-40\">No drafts</div>\n        }\n      </div>\n    </mat-card>\n  `,\n})\nexport class PostsDraftColumnComponent {\n  posts = input.required<BlogPost[]>();\n  postSelected = output<string>();\n}\n"]}

package/esm2022/lib/posts-list/posts-list.component.js

@@ -0,0 +1,79 @@
+import { ChangeDetectionStrategy, Component, inject, } from '@angular/core';
+import { Router } from '@angular/router';
+import { MatButtonModule } from '@angular/material/button';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { PostsListStore } from './posts-list.store';
+import { PostsBoardComponent } from './posts-board.component';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/material/button";
+import * as i2 from "@angular/material/progress-spinner";
+export class PostsListComponent {
+    store = inject(PostsListStore);
+    router = inject(Router);
+    ngOnInit() {
+        this.store.loadPosts();
+    }
+    newPost() {
+        this.router.navigate(['/posts/new']);
+    }
+    onPostSelected(id) {
+        this.router.navigate(['/posts', id, 'edit']);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: PostsListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: PostsListComponent, isStandalone: true, selector: "folio-posts-list", host: { classAttribute: "block h-full" }, providers: [PostsListStore], ngImport: i0, template: `
+    <div class="flex flex-col h-full">
+      <header class="shrink-0 flex items-center justify-between px-6 pt-6 pb-4">
+        <h1 class="text-2xl font-bold">Posts</h1>
+        <button mat-raised-button (click)="newPost()">New Post</button>
+      </header>
+
+      @if (store.loading()) {
+        <div class="flex-1 flex items-center justify-center">
+          <mat-spinner diameter="40" />
+        </div>
+      } @else if (store.error()) {
+        <div class="flex-1 flex items-center justify-center opacity-60 text-sm">
+          Failed to load posts. Please try again.
+        </div>
+      } @else {
+        <div class="flex-1 min-h-0 px-6 pb-6">
+          <folio-posts-board (postSelected)="onPostSelected($event)" />
+        </div>
+      }
+    </div>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.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: MatProgressSpinnerModule }, { kind: "component", type: i2.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: PostsBoardComponent, selector: "folio-posts-board", outputs: ["postSelected"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: PostsListComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'folio-posts-list',
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    providers: [PostsListStore],
+                    imports: [MatButtonModule, MatProgressSpinnerModule, PostsBoardComponent],
+                    host: { class: 'block h-full' },
+                    template: `
+    <div class="flex flex-col h-full">
+      <header class="shrink-0 flex items-center justify-between px-6 pt-6 pb-4">
+        <h1 class="text-2xl font-bold">Posts</h1>
+        <button mat-raised-button (click)="newPost()">New Post</button>
+      </header>
+
+      @if (store.loading()) {
+        <div class="flex-1 flex items-center justify-center">
+          <mat-spinner diameter="40" />
+        </div>
+      } @else if (store.error()) {
+        <div class="flex-1 flex items-center justify-center opacity-60 text-sm">
+          Failed to load posts. Please try again.
+        </div>
+      } @else {
+        <div class="flex-1 min-h-0 px-6 pb-6">
+          <folio-posts-board (postSelected)="onPostSelected($event)" />
+        </div>
+      }
+    </div>
+  `,
+                }]
+        }] });
+//# sourceMappingURL=posts-list.component.js.map

package/esm2022/lib/posts-list/posts-list.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"posts-list.component.js","sourceRoot":"","sources":["../../../../../../libs/cms-admin-ui/src/lib/posts-list/posts-list.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,MAAM,GAEP,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAC3D,OAAO,EAAE,wBAAwB,EAAE,MAAM,oCAAoC,CAAC;AAC9E,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;;;;AAgC9D,MAAM,OAAO,kBAAkB;IACV,KAAK,GAAG,MAAM,CAAC,cAAc,CAAC,CAAC;IACjC,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC;IAEzC,QAAQ;QACN,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE,CAAC;IACzB,CAAC;IAES,OAAO;QACf,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC;IACvC,CAAC;IAES,cAAc,CAAC,EAAU;QACjC,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,QAAQ,EAAE,EAAE,EAAE,MAAM,CAAC,CAAC,CAAC;IAC/C,CAAC;uGAdU,kBAAkB;2FAAlB,kBAAkB,yGA1BlB,CAAC,cAAc,CAAC,0BAGjB;;;;;;;;;;;;;;;;;;;;;GAqBT,2DAvBS,eAAe,mXAAE,wBAAwB,mOAAE,mBAAmB;;2FAyB7D,kBAAkB;kBA9B9B,SAAS;mBAAC;oBACT,QAAQ,EAAE,kBAAkB;oBAC5B,UAAU,EAAE,IAAI;oBAChB,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,SAAS,EAAE,CAAC,cAAc,CAAC;oBAC3B,OAAO,EAAE,CAAC,eAAe,EAAE,wBAAwB,EAAE,mBAAmB,CAAC;oBACzE,IAAI,EAAE,EAAE,KAAK,EAAE,cAAc,EAAE;oBAC/B,QAAQ,EAAE;;;;;;;;;;;;;;;;;;;;;GAqBT;iBACF","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  inject,\n  OnInit,\n} from '@angular/core';\nimport { Router } from '@angular/router';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatProgressSpinnerModule } from '@angular/material/progress-spinner';\nimport { PostsListStore } from './posts-list.store';\nimport { PostsBoardComponent } from './posts-board.component';\n\n@Component({\n  selector: 'folio-posts-list',\n  standalone: true,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [PostsListStore],\n  imports: [MatButtonModule, MatProgressSpinnerModule, PostsBoardComponent],\n  host: { class: 'block h-full' },\n  template: `\n    <div class=\"flex flex-col h-full\">\n      <header class=\"shrink-0 flex items-center justify-between px-6 pt-6 pb-4\">\n        <h1 class=\"text-2xl font-bold\">Posts</h1>\n        <button mat-raised-button (click)=\"newPost()\">New Post</button>\n      </header>\n\n      @if (store.loading()) {\n        <div class=\"flex-1 flex items-center justify-center\">\n          <mat-spinner diameter=\"40\" />\n        </div>\n      } @else if (store.error()) {\n        <div class=\"flex-1 flex items-center justify-center opacity-60 text-sm\">\n          Failed to load posts. Please try again.\n        </div>\n      } @else {\n        <div class=\"flex-1 min-h-0 px-6 pb-6\">\n          <folio-posts-board (postSelected)=\"onPostSelected($event)\" />\n        </div>\n      }\n    </div>\n  `,\n})\nexport class PostsListComponent implements OnInit {\n  protected readonly store = inject(PostsListStore);\n  private readonly router = inject(Router);\n\n  ngOnInit(): void {\n    this.store.loadPosts();\n  }\n\n  protected newPost(): void {\n    this.router.navigate(['/posts/new']);\n  }\n\n  protected onPostSelected(id: string): void {\n    this.router.navigate(['/posts', id, 'edit']);\n  }\n}\n"]}

package/esm2022/lib/posts-list/posts-list.store.js

@@ -0,0 +1,43 @@
+import { computed, inject, PLATFORM_ID } from '@angular/core';
+import { isPlatformBrowser } from '@angular/common';
+import { patchState, signalStore, withComputed, withMethods, withState, } from '@ngrx/signals';
+import { moveItemInArray } from '@angular/cdk/drag-drop';
+import { PostService } from '@foliokit/cms-core';
+const initialState = {
+    posts: [],
+    loading: false,
+    error: null,
+};
+export const PostsListStore = signalStore(withState(initialState), withComputed((store) => ({
+    draftPosts: computed(() => store.posts().filter((p) => p.status === 'draft')),
+    scheduledPosts: computed(() => store.posts().filter((p) => p.status === 'scheduled')),
+    publishedPosts: computed(() => store.posts().filter((p) => p.status === 'published')),
+    archivedPosts: computed(() => store.posts().filter((p) => p.status === 'archived')),
+    // Kept for backward compatibility
+    draftCount: computed(() => store.posts().filter((p) => p.status === 'draft').length),
+    scheduledCount: computed(() => store.posts().filter((p) => p.status === 'scheduled').length),
+    publishedCount: computed(() => store.posts().filter((p) => p.status === 'published').length),
+})), withMethods((store, postService = inject(PostService), platformId = inject(PLATFORM_ID)) => ({
+    loadPosts() {
+        if (!isPlatformBrowser(platformId))
+            return;
+        patchState(store, { loading: true, error: null });
+        postService.getAllPosts().subscribe({
+            next: (posts) => {
+                patchState(store, { posts, loading: false });
+            },
+            error: (err) => {
+                const message = err instanceof Error ? err.message : 'Failed to load posts';
+                patchState(store, { loading: false, error: message });
+            },
+        });
+    },
+    reorderQueue(previousIndex, currentIndex) {
+        const reordered = [...store.scheduledPosts()];
+        moveItemInArray(reordered, previousIndex, currentIndex);
+        const nonScheduled = store.posts().filter((p) => p.status !== 'scheduled');
+        patchState(store, { posts: [...nonScheduled, ...reordered] });
+        // TODO: persist queueOrder to Firestore when ready
+    },
+})));
+//# sourceMappingURL=posts-list.store.js.map

package/esm2022/lib/posts-list/posts-list.store.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"posts-list.store.js","sourceRoot":"","sources":["../../../../../../libs/cms-admin-ui/src/lib/posts-list/posts-list.store.ts"],"names":[],"mappings":"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","sourcesContent":["import { computed, inject, PLATFORM_ID } from '@angular/core';\nimport { isPlatformBrowser } from '@angular/common';\nimport {\n  patchState,\n  signalStore,\n  withComputed,\n  withMethods,\n  withState,\n} from '@ngrx/signals';\nimport { moveItemInArray } from '@angular/cdk/drag-drop';\nimport { BlogPost, PostService } from '@foliokit/cms-core';\n\nexport interface PostsListState {\n  posts: BlogPost[];\n  loading: boolean;\n  error: string | null;\n}\n\nconst initialState: PostsListState = {\n  posts: [],\n  loading: false,\n  error: null,\n};\n\nexport const PostsListStore = signalStore(\n  withState<PostsListState>(initialState),\n\n  withComputed((store) => ({\n    draftPosts: computed(() =>\n      store.posts().filter((p) => p.status === 'draft'),\n    ),\n    scheduledPosts: computed(() =>\n      store.posts().filter((p) => p.status === 'scheduled'),\n    ),\n    publishedPosts: computed(() =>\n      store.posts().filter((p) => p.status === 'published'),\n    ),\n    archivedPosts: computed(() =>\n      store.posts().filter((p) => p.status === 'archived'),\n    ),\n    // Kept for backward compatibility\n    draftCount: computed(\n      () => store.posts().filter((p) => p.status === 'draft').length,\n    ),\n    scheduledCount: computed(\n      () => store.posts().filter((p) => p.status === 'scheduled').length,\n    ),\n    publishedCount: computed(\n      () => store.posts().filter((p) => p.status === 'published').length,\n    ),\n  })),\n\n  withMethods(\n    (store, postService = inject(PostService), platformId = inject(PLATFORM_ID)) => ({\n      loadPosts(): void {\n        if (!isPlatformBrowser(platformId)) return;\n        patchState(store, { loading: true, error: null });\n        postService.getAllPosts().subscribe({\n          next: (posts) => {\n            patchState(store, { posts, loading: false });\n          },\n          error: (err: unknown) => {\n            const message =\n              err instanceof Error ? err.message : 'Failed to load posts';\n            patchState(store, { loading: false, error: message });\n          },\n        });\n      },\n\n      reorderQueue(previousIndex: number, currentIndex: number): void {\n        const reordered = [...store.scheduledPosts()];\n        moveItemInArray(reordered, previousIndex, currentIndex);\n        const nonScheduled = store.posts().filter((p) => p.status !== 'scheduled');\n        patchState(store, { posts: [...nonScheduled, ...reordered] });\n        // TODO: persist queueOrder to Firestore when ready\n      },\n    }),\n  ),\n);\n"]}