@mdzip/editor-ng 1.3.0 → 1.3.1
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.
- package/README.md +40 -9
- package/dist/README.md +40 -9
- package/package.json +10 -1
package/README.md
CHANGED
|
@@ -97,18 +97,49 @@ exposed as component methods: `removeFile`, `renameFile`, `setEntryPoint`, and `
|
|
|
97
97
|
|
|
98
98
|
## Imperative API
|
|
99
99
|
|
|
100
|
-
|
|
101
|
-
|
|
100
|
+
All imperative methods are public instance methods on `MdzipWorkspaceComponent`,
|
|
101
|
+
so any reference to the component instance works. No view query is required: a
|
|
102
|
+
template reference variable can hand the instance directly to an event handler.
|
|
102
103
|
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
104
|
+
```ts
|
|
105
|
+
@Component({
|
|
106
|
+
imports: [MdzipWorkspaceComponent],
|
|
107
|
+
template: `
|
|
108
|
+
<mdzip-workspace #workspace [bytes]="bytes" mode="editable" controls="hosted-editor" />
|
|
109
|
+
<button (click)="save(workspace)">Save</button>
|
|
110
|
+
`,
|
|
111
|
+
})
|
|
112
|
+
export class AppComponent {
|
|
113
|
+
async save(workspace: MdzipWorkspaceComponent): Promise<void> {
|
|
114
|
+
// Flush pending edits and persist
|
|
115
|
+
const snapshot = await workspace.flush();
|
|
116
|
+
if (snapshot) {
|
|
117
|
+
await persist(snapshot.bytes);
|
|
118
|
+
workspace.markPersisted();
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
// Execute editor commands
|
|
122
|
+
await workspace.executeCommand('bold');
|
|
123
|
+
}
|
|
108
124
|
}
|
|
125
|
+
```
|
|
126
|
+
|
|
127
|
+
To call methods outside an event handler, use a view query — the signal-based
|
|
128
|
+
`viewChild` or the classic `@ViewChild` decorator:
|
|
109
129
|
|
|
110
|
-
|
|
111
|
-
|
|
130
|
+
```ts
|
|
131
|
+
private readonly workspace = viewChild.required(MdzipWorkspaceComponent);
|
|
132
|
+
|
|
133
|
+
async save(): Promise<void> {
|
|
134
|
+
const snapshot = await this.workspace().flush();
|
|
135
|
+
if (snapshot) {
|
|
136
|
+
await persist(snapshot.bytes);
|
|
137
|
+
this.workspace().markPersisted();
|
|
138
|
+
}
|
|
139
|
+
}
|
|
112
140
|
```
|
|
113
141
|
|
|
142
|
+
Methods called before the view initializes are safe: they no-op and resolve to
|
|
143
|
+
`false`/`null`/empty rather than throwing.
|
|
144
|
+
|
|
114
145
|
See the [`@mdzip/editor`](https://www.npmjs.com/package/@mdzip/editor) package for the full API reference, theming guide, and framework-agnostic usage.
|
package/dist/README.md
CHANGED
|
@@ -97,18 +97,49 @@ exposed as component methods: `removeFile`, `renameFile`, `setEntryPoint`, and `
|
|
|
97
97
|
|
|
98
98
|
## Imperative API
|
|
99
99
|
|
|
100
|
-
|
|
101
|
-
|
|
100
|
+
All imperative methods are public instance methods on `MdzipWorkspaceComponent`,
|
|
101
|
+
so any reference to the component instance works. No view query is required: a
|
|
102
|
+
template reference variable can hand the instance directly to an event handler.
|
|
102
103
|
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
104
|
+
```ts
|
|
105
|
+
@Component({
|
|
106
|
+
imports: [MdzipWorkspaceComponent],
|
|
107
|
+
template: `
|
|
108
|
+
<mdzip-workspace #workspace [bytes]="bytes" mode="editable" controls="hosted-editor" />
|
|
109
|
+
<button (click)="save(workspace)">Save</button>
|
|
110
|
+
`,
|
|
111
|
+
})
|
|
112
|
+
export class AppComponent {
|
|
113
|
+
async save(workspace: MdzipWorkspaceComponent): Promise<void> {
|
|
114
|
+
// Flush pending edits and persist
|
|
115
|
+
const snapshot = await workspace.flush();
|
|
116
|
+
if (snapshot) {
|
|
117
|
+
await persist(snapshot.bytes);
|
|
118
|
+
workspace.markPersisted();
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
// Execute editor commands
|
|
122
|
+
await workspace.executeCommand('bold');
|
|
123
|
+
}
|
|
108
124
|
}
|
|
125
|
+
```
|
|
126
|
+
|
|
127
|
+
To call methods outside an event handler, use a view query — the signal-based
|
|
128
|
+
`viewChild` or the classic `@ViewChild` decorator:
|
|
109
129
|
|
|
110
|
-
|
|
111
|
-
|
|
130
|
+
```ts
|
|
131
|
+
private readonly workspace = viewChild.required(MdzipWorkspaceComponent);
|
|
132
|
+
|
|
133
|
+
async save(): Promise<void> {
|
|
134
|
+
const snapshot = await this.workspace().flush();
|
|
135
|
+
if (snapshot) {
|
|
136
|
+
await persist(snapshot.bytes);
|
|
137
|
+
this.workspace().markPersisted();
|
|
138
|
+
}
|
|
139
|
+
}
|
|
112
140
|
```
|
|
113
141
|
|
|
142
|
+
Methods called before the view initializes are safe: they no-op and resolve to
|
|
143
|
+
`false`/`null`/empty rather than throwing.
|
|
144
|
+
|
|
114
145
|
See the [`@mdzip/editor`](https://www.npmjs.com/package/@mdzip/editor) package for the full API reference, theming guide, and framework-agnostic usage.
|
package/package.json
CHANGED
|
@@ -1,8 +1,17 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mdzip/editor-ng",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.1",
|
|
4
4
|
"description": "Angular UI components for the MDZip workspace engine.",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
|
+
"repository": {
|
|
7
|
+
"type": "git",
|
|
8
|
+
"url": "git+https://github.com/mdzip-project/mdzip-editor.git",
|
|
9
|
+
"directory": "packages/editor-ng"
|
|
10
|
+
},
|
|
11
|
+
"homepage": "https://mdzip.org",
|
|
12
|
+
"bugs": {
|
|
13
|
+
"url": "https://github.com/mdzip-project/mdzip-editor/issues"
|
|
14
|
+
},
|
|
6
15
|
"type": "module",
|
|
7
16
|
"module": "dist/fesm2022/mdzip-editor-ng.mjs",
|
|
8
17
|
"types": "dist/index.d.ts",
|