xt-plugin-editor 0.0.0-stage → 1.0.0

package/projects/editor/tsconfig.lib.json

@@ -0,0 +1,13 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/lib",
+    "declaration": true,
+    "declarationMap": true,
+    "types": []
+  },
+  "include": ["src/**/*.ts"],
+  "exclude": ["**/*.spec.ts"]
+}

package/projects/editor/tsconfig.lib.prod.json

@@ -0,0 +1,11 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "./tsconfig.lib.json",
+  "compilerOptions": {
+    "declarationMap": false
+  },
+  "angularCompilerOptions": {
+    "compilationMode": "partial"
+  }
+}

package/projects/editor/tsconfig.spec.json

@@ -0,0 +1,10 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/spec",
+    "types": ["vitest/globals"]
+  },
+  "include": ["src/**/*.d.ts", "src/**/*.spec.ts"]
+}

package/projects/editor-plugin/federation.config.js

@@ -0,0 +1,33 @@
+const { withNativeFederation, shareAll, share } = require('@angular-architects/native-federation/config');
+
+module.exports = withNativeFederation({
+
+  name: 'editor-plugin',
+
+  exposes: {
+    './EditorComponent': './projects/editor/src/lib/editor/editor.component.ts',
+    './Register': './projects/editor/src/lib/register.ts'
+  },
+
+  shared: {
+    ...shareAll({ singleton: true, strictVersion: true, requiredVersion: 'auto' })
+  },
+
+  features: {
+    ignoreUnusedDeps:true
+  },
+  skip: [
+    'rxjs/ajax',
+    'rxjs/fetch',
+    'rxjs/testing',
+    'rxjs/webSocket',
+    /^@primeuix\//,
+    'chart.js/auto',
+    'primeng/chart',
+    'primeicons'
+  ]
+
+  // Please read our FAQ about sharing libs:
+  // https://shorturl.at/jmzH0
+
+});

package/projects/editor-plugin/src/app/app.component.html

@@ -0,0 +1,3 @@
+<h1>Editor Plugin Testing app</h1>
+
+<router-outlet />

package/projects/editor-plugin/src/app/app.component.spec.ts

@@ -0,0 +1,34 @@
+import { provideZonelessChangeDetection } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
+import { AppComponent } from './app.component';
+import { beforeEach, describe, expect, it } from 'vitest';
+import { provideNoopAnimations } from '@angular/platform-browser/animations';
+
+describe('Editor Tester', () => {
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [AppComponent],
+      providers: [provideNoopAnimations(),provideZonelessChangeDetection()]
+    }).compileComponents();
+  });
+
+  it('should create the app', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.componentInstance;
+    expect(app).toBeTruthy();
+  });
+
+  it(`should have the 'EditorTester' title`, () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.componentInstance;
+    expect(app.title).toEqual('EditorTester');
+  });
+
+  it('should render title', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    fixture.detectChanges();
+    const compiled = fixture.nativeElement as HTMLElement;
+    expect(compiled.querySelector('h1')?.textContent).toContain('Editor Plugin Testing app');
+  });
+});

package/projects/editor-plugin/src/app/app.component.ts

@@ -0,0 +1,23 @@
+import { Component, inject } from '@angular/core';
+import { RouterOutlet } from '@angular/router';
+import { XtResolverService } from 'xt-components';
+import { registerEditorPlugin } from '../../../editor/src/lib/register';
+import { registerDefaultPlugin } from 'xt-plugin-default';
+
+@Component({
+  selector: 'app-root',
+  imports: [RouterOutlet],
+  templateUrl: './app.component.html',
+  styleUrl: './app.component.css'
+})
+export class AppComponent {
+  title = 'EditorTester';
+
+  protected resolverService = inject (XtResolverService);
+
+  constructor () {
+    registerDefaultPlugin (this.resolverService);
+    registerEditorPlugin(this.resolverService);
+  }
+
+}

package/projects/editor-plugin/src/app/app.config.ts

@@ -0,0 +1,22 @@
+import { ApplicationConfig, provideBrowserGlobalErrorListeners, provideZonelessChangeDetection } from '@angular/core';
+import { provideRouter } from '@angular/router';
+
+import { routes } from './app.routes';
+import { provideAnimationsAsync } from '@angular/platform-browser/animations/async';
+import { providePrimeNG } from 'primeng/config';
+import Aura from '@primeuix/themes/aura';
+import { provideHttpClient } from '@angular/common/http';
+
+export const appConfig: ApplicationConfig = {
+  providers: [
+    provideBrowserGlobalErrorListeners(),
+    provideZonelessChangeDetection(),
+    provideHttpClient(),
+    provideAnimationsAsync(),
+    providePrimeNG({
+      theme: {
+        preset: Aura
+      }
+    }),
+    provideRouter(routes)]
+};

package/projects/editor-plugin/src/app/app.routes.ts

@@ -0,0 +1,6 @@
+import { Routes } from '@angular/router';
+import { EditorTestComponent } from './editor-test-component/editor-test.component';
+
+export const routes: Routes = [{
+  path:'', component:EditorTestComponent
+}];

package/projects/editor-plugin/src/app/editor-test-component/editor-test.component.css

@@ -0,0 +1,4 @@
+.displayForm {
+  background-color: #1B2230;
+  width: 60em;
+}

package/projects/editor-plugin/src/app/editor-test-component/editor-test.component.html

@@ -0,0 +1,19 @@
+<h1 class="text-2xl">Testing Editor</h1>
+@let mainForm=simpleForm();
+
+<form [formGroup]="mainForm">
+    <xt-render-sub [context]="simpleContext()" ></xt-render-sub>
+</form>
+<div style="margin-top:2em">
+  Form Value is
+  <div class="displayForm" [innerHTML]="formValue() | markdown">
+  </div>
+  , Form is {{mainForm.pristine?"pristine":"Dirty"}}
+</div>
+<div style="margin-top:2em">
+  Inline display: <xt-render-sub [context]="inlineContext()"></xt-render-sub>
+</div>
+<div style="margin-top:2em">
+  Full view display:<br/>
+  <xt-render-sub [context]="fullviewContext()"></xt-render-sub>
+</div>

package/projects/editor-plugin/src/app/editor-test-component/editor-test.component.spec.ts

@@ -0,0 +1,33 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { beforeEach, describe, expect, it } from 'vitest';
+import { provideZonelessChangeDetection } from '@angular/core';
+import { registerEditorPlugin } from '../../../../editor/src/lib/register';
+import { XtResolverService } from 'xt-components';
+import { provideNoopAnimations } from '@angular/platform-browser/animations';
+import { registerDefaultPlugin } from 'xt-plugin-default';
+import { EditorTestComponent } from './editor-test.component';
+
+describe('EditorTestComponent', () => {
+  let component: EditorTestComponent;
+  let fixture: ComponentFixture<EditorTestComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [EditorTestComponent],
+      providers: [provideNoopAnimations(), provideZonelessChangeDetection()]
+    })
+    .compileComponents();
+
+    const resolver = TestBed.inject(XtResolverService);
+    registerDefaultPlugin(resolver);
+    registerEditorPlugin(resolver);
+    fixture = TestBed.createComponent(EditorTestComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/projects/editor-plugin/src/app/editor-test-component/editor-test.component.ts

@@ -0,0 +1,67 @@
+import { Component, inject, OnDestroy, OnInit, signal } from '@angular/core';
+import { FormBuilder, FormGroup, FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { Subscription } from 'rxjs';
+import { XtBaseContext, XtContext, XtRenderSubComponent, XtResolverService } from 'xt-components';
+import { MarkdownPipe } from '../../../../editor/src/lib/markdown/markdown-pipe';
+
+@Component({
+  selector: 'app-editor-test',
+  imports: [
+    FormsModule,
+    ReactiveFormsModule,
+    XtRenderSubComponent,
+    MarkdownPipe
+  ],
+  templateUrl: './editor-test.component.html',
+  styleUrl: './editor-test.component.css'
+})
+export class EditorTestComponent implements OnInit,OnDestroy {
+
+  protected builder = inject(FormBuilder);
+
+  protected resolver = inject (XtResolverService);
+  protected readonly formValue = signal<any>(null);
+
+  protected subscriptions= new Subscription();
+  protected readonly simpleForm = signal<FormGroup>(this.builder.group({
+    simpleText: ["# Header\n\nSimple **text**"]
+  }));
+
+  constructor() {
+  }
+
+  ngOnInit() {
+    this.subscriptions.add(this.simpleForm().valueChanges.subscribe({
+      next: (value)=>this.formValue.set(value.simpleText)
+    }));
+    const initValue=this.simpleForm().value?.simpleText;
+    if( initValue!=null) {
+      this.formValue.set(initValue);
+    }
+  }
+
+  ngOnDestroy(): void {
+    this.subscriptions.unsubscribe();
+  }
+
+  protected simpleContext():XtContext<any> {
+    const ret= new XtBaseContext('FULL_EDITABLE', "simpleText",this.simpleForm());
+    ret.valueType='markdown';
+    return ret;
+  }
+
+  protected inlineContext():XtContext<any> {
+    const ret= new XtBaseContext('INLINE_VIEW');
+    ret.setDisplayValue(this.formValue());
+    ret.valueType='markdown';
+    return ret;
+  }
+
+  protected fullviewContext():XtContext<any> {
+    const ret= new XtBaseContext('FULL_VIEW');
+    ret.setDisplayValue(this.formValue());
+    ret.valueType='markdown';
+    return ret;
+  }
+
+}

package/projects/editor-plugin/src/bootstrap.ts

@@ -0,0 +1,6 @@
+import { bootstrapApplication } from '@angular/platform-browser';
+import { appConfig } from './app/app.config';
+import { AppComponent } from './app/app.component';
+
+bootstrapApplication(AppComponent, appConfig)
+  .catch((err) => console.error(err));

package/projects/editor-plugin/src/index.html

@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <title>Editor Tester</title>
+  <base href="/">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="icon" type="image/x-icon" href="favicon.ico">
+</head>
+<body>
+  <app-root></app-root>
+</body>
+</html>

package/projects/editor-plugin/src/main.ts

@@ -0,0 +1,6 @@
+import { initFederation } from '@angular-architects/native-federation';
+
+initFederation()
+  .catch(err => console.error(err))
+  .then(_ => import('./bootstrap'))
+  .catch(err => console.error(err));

package/projects/editor-plugin/src/styles.css

@@ -0,0 +1,14 @@
+/* You can add global styles to this file, and also import other style files */
+@import "primeicons/primeicons.css";
+@import "prosemirror-view/style/prosemirror.css";
+@import "prosemirror-menu/style/menu.css";
+@import "prosemirror-gapcursor/style/gapcursor.css";
+
+html {
+  height: 100%;
+}
+body {
+  min-height: 100%;
+  margin: 0;
+  padding: 0;
+}

package/projects/editor-plugin/tsconfig.app.json

@@ -0,0 +1,11 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/app",
+    "types": []
+  },
+  "include": ["src/**/*.ts"],
+  "exclude": ["src/**/*.spec.ts"]
+}

package/projects/editor-plugin/tsconfig.federation.json

@@ -0,0 +1,13 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/app",
+    "types": []
+  },
+  "files": [
+    "src/main.ts"
+  ],
+  "include": [
+    "src/**/*.d.ts"
+  ]
+}

package/projects/editor-plugin/tsconfig.spec.json

@@ -0,0 +1,10 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/spec",
+    "types": ["vitest/globals"]
+  },
+  "include": ["src/**/*.d.ts", "src/**/*.spec.ts"]
+}

package/rush-logs/xt-plugin-editor.build.error.log

@@ -0,0 +1,8 @@
+- Compiling with Angular sources in full compilation mode.
+✔ Compiling with Angular sources in full compilation mode.
+✔ Generating FESM and DTS bundles
+- Copying assets
+✔ Copying assets
+- Writing package manifest
+✔ Writing package manifest
+✔ Built xt-plugin-editor

package/rush-logs/xt-plugin-editor.build.log

@@ -0,0 +1,23 @@
+Invoking: ng build editor 
+Building Angular Package
+
+------------------------------------------------------------------------------
+Building entry point 'xt-plugin-editor'
+------------------------------------------------------------------------------
+- Compiling with Angular sources in full compilation mode.
+✔ Compiling with Angular sources in full compilation mode.
+✔ Generating FESM and DTS bundles
+- Copying assets
+✔ Copying assets
+- Writing package manifest
+✔ Writing package manifest
+✔ Built xt-plugin-editor
+
+------------------------------------------------------------------------------
+Built Angular Package
+- from: /home/gc-garunda/devs/dont-code/github/ng-xtend/plugins/xt-editor/projects/editor
+- to:   /home/gc-garunda/devs/dont-code/github/ng-xtend/plugins/xt-editor/dist/xt-plugin-editor
+------------------------------------------------------------------------------
+
+Build at: 2026-10-10T09:01:31.738Z - Time: 6278ms
+

package/rush-logs/xt-plugin-editor.test.error.log

@@ -0,0 +1 @@
+The 'buildTarget' is configured to use '@angular-architects/native-federation:build', which is not supported. The 'unit-test' builder is designed to work with '@angular/build:application' or '@angular/build:ng-packagr'. Unexpected behavior or build failures may occur.

package/rush-logs/xt-plugin-editor.test.log

@@ -0,0 +1,50 @@
+Invoking: ng test editor && ng test editor-plugin 
+❯ Building...
+✔ Building...
+Initial chunk files                       | Names                                  |  Raw size
+spec-lib-editor-editor.component.js       | spec-lib-editor-editor.component       |  31.72 kB | 
+chunk-CGZBV6BD.js                         | -                                      |   4.07 kB | 
+chunk-5ODHH5YL.js                         | -                                      |   1.64 kB | 
+chunk-ZSP5A4GD.js                         | -                                      |   1.25 kB | 
+init-testbed.js                           | init-testbed                           |   1.21 kB | 
+spec-lib-markdown-markdown-pipe.js        | spec-lib-markdown-markdown-pipe        |   1.12 kB | 
+spec-lib-markdown-inline-markdown-pipe.js | spec-lib-markdown-inline-markdown-pipe |   1.04 kB | 
+vitest-mock-patch.js                      | vitest-mock-patch                      | 969 bytes | 
+
+                                          | Initial total                          |  43.01 kB
+
+Application bundle generation complete. [6.892 seconds] - 2026-10-10T12:18:52.351Z
+
+
+ RUN  v4.1.2 /home/gc-garunda/devs/dont-code/github/ng-xtend/plugins/xt-editor
+
+
+ Test Files  3 passed (3)
+      Tests  7 passed (7)
+   Start at  14:18:54
+   Duration  8.59s (transform 1.72s, setup 4.48s, import 7.18s, tests 445ms, environment 3.39s)
+
+The 'buildTarget' is configured to use '@angular-architects/native-federation:build', which is not supported. The 'unit-test' builder is designed to work with '@angular/build:application' or '@angular/build:ng-packagr'. Unexpected behavior or build failures may occur.
+❯ Building...
+✔ Building...
+Initial chunk files                                     | Names                                                |  Raw size
+chunk-YCTZP6SR.js                                       | -                                                    |  33.24 kB | 
+spec-app-editor-test-component-editor-test.component.js | spec-app-editor-test-component-editor-test.component |   7.12 kB | 
+chunk-CGZBV6BD.js                                       | -                                                    |   4.07 kB | 
+spec-app-app.component.js                               | spec-app-app.component                               |   3.10 kB | 
+init-testbed.js                                         | init-testbed                                         |   1.21 kB | 
+vitest-mock-patch.js                                    | vitest-mock-patch                                    | 969 bytes | 
+
+                                                        | Initial total                                        |  49.71 kB
+
+Application bundle generation complete. [3.807 seconds] - 2026-10-10T12:19:07.718Z
+
+
+ RUN  v4.1.2 /home/gc-garunda/devs/dont-code/github/ng-xtend/plugins/xt-editor
+
+
+ Test Files  2 passed (2)
+      Tests  4 passed (4)
+   Start at  14:19:08
+   Duration  4.98s (transform 789ms, setup 1.24s, import 6.22s, tests 447ms, environment 1.17s)
+

package/tsconfig.json

@@ -0,0 +1,33 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "compileOnSave": false,
+  "compilerOptions": {
+    "outDir": "./dist/out-tsc",
+    "strict": true,
+    "noImplicitOverride": true,
+    "noPropertyAccessFromIndexSignature": true,
+    "noImplicitReturns": true,
+    "noFallthroughCasesInSwitch": true,
+    "skipLibCheck": true,
+    "esModuleInterop": true,
+    "sourceMap": true,
+    "declaration": false,
+    "isolatedModules": true,
+    "experimentalDecorators": true,
+    "moduleResolution": "bundler",
+    "importHelpers": true,
+    "target": "ES2022",
+    "module": "preserve",
+    "useDefineForClassFields": false,
+    "paths": {
+    }
+
+  },
+  "angularCompilerOptions": {
+    "enableI18nLegacyMessageIdFormat": false,
+    "strictInjectionParameters": true,
+    "strictInputAccessModifiers": true,
+    "strictTemplates": true
+  }
+}