@mdzip/editor 1.3.11 → 1.3.13

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 CHANGED
@@ -5,6 +5,9 @@
5
5
 
6
6
  # @mdzip/editor
7
7
 
8
+ [![npm](https://img.shields.io/npm/v/@mdzip/editor?logo=npm)](https://www.npmjs.com/package/@mdzip/editor)
9
+ [![license](https://img.shields.io/npm/l/@mdzip/editor)](https://github.com/mdzip-project/mdzip-editor/blob/main/LICENSE)
10
+
8
11
  Framework-independent MDZip workspace engine and browser view.
9
12
 
10
13
  `@mdzip/editor` provides reusable helpers for opening `.mdz` archives, rendering Markdown previews, editing archive contents, comparing archive inventories, and embedding a configurable MDZip workspace UI.
@@ -107,6 +110,44 @@ workspace dirty.
107
110
  - `standalone-editor`: full editor controls, including save.
108
111
  - `hosted-editor`: editor controls without an embedded save button, for hosts such as VS Code that own persistence.
109
112
 
113
+ Call `setControls(nextControls)` to update the policy after construction
114
+ without rebuilding the workspace view. `lineNumbers` changes are applied to the
115
+ existing CodeMirror editor, preserving the current document and selection.
116
+
117
+ ## Density and Spacing
118
+
119
+ Hosts can opt into smaller built-in UI without targeting private classes:
120
+
121
+ ```ts
122
+ const view = new MdzipWorkspaceView(container, {
123
+ controls: 'hosted-editor',
124
+ toolbarDensity: 'compact', // 'comfortable' | 'compact' | 'dense'
125
+ contentDensity: 'compact' // 'comfortable' | 'compact'
126
+ });
127
+
128
+ view.setDensityOptions({
129
+ toolbarDensity: 'dense',
130
+ contentDensity: 'compact'
131
+ });
132
+ ```
133
+
134
+ For exact sizing, set stable CSS custom properties on an ancestor of the
135
+ workspace:
136
+
137
+ ```css
138
+ .studio-editor {
139
+ --mdzip-toolbar-button-size: 28px;
140
+ --mdzip-toolbar-compact-button-size: 26px;
141
+ --mdzip-toolbar-icon-size: 14px;
142
+ --mdzip-format-button-size: 26px;
143
+ --mdzip-format-icon-size: 14px;
144
+ --mdzip-toolbar-padding: 2px 8px;
145
+ --mdzip-toolbar-gap: 4px;
146
+ --mdzip-editor-content-padding: 16px 20px;
147
+ --mdzip-preview-content-padding: 16px 20px 24px;
148
+ }
149
+ ```
150
+
110
151
  ## Host Persistence
111
152
 
112
153
  Desktop hosts can flush pending editor content, persist the returned bytes, and
@@ -171,6 +212,23 @@ selection while a host dialog is open; it returns `false` if that document has
171
212
  changed. `context.convertToMdz()` runs the built-in conversion and image action
172
213
  against the same captured selection.
173
214
 
215
+ ## Image Insert Hook
216
+
217
+ Set `imageInsertMode` to choose the built-in image markup flow:
218
+ `'markdown'` keeps the default `![alt](path)` insertion, `'html'` inserts a
219
+ default `<img>` element, and `'ask'` opens a small dialog for Markdown vs HTML,
220
+ alt text, proportional size, and alignment.
221
+
222
+ For host-owned UI, provide `imageInsertHandler`. It receives file metadata,
223
+ intrinsic image size when detected, and the source (`'paste'`, `'drop'`, or
224
+ `'picker'`). Return `{ mode: 'markdown', altText }` or
225
+ `{ mode: 'html', altText, width, height, position }`; return `null` to cancel.
226
+ The built-in dialog asks for width, height, or percent scaling and preserves
227
+ aspect ratio by emitting one dimension, or proportional dimensions for percent
228
+ scaling. Returning `undefined` falls back to `imageInsertMode`.
229
+ The built-in HTML path uses portable `align` attributes for positioning because
230
+ the default preview sanitizer strips inline `style` attributes.
231
+
174
232
  `MdzipRenderingService` uses `defaultSafeMarkdownRenderer` when no renderer is
175
233
  injected. The default renderer sanitizes generated HTML and unsafe URL schemes.
176
234
 
@@ -332,6 +390,11 @@ under `prefers-reduced-motion`). `onPreviewRendered` fires when the text is
332
390
  mounted; `onAssetsHydrated` fires once every referenced image has resolved and
333
391
  its final `src` is assigned.
334
392
 
393
+ In live-editing hosts where the preview re-renders frequently, pass
394
+ `imageHydrationAnimation: 'initial'` to keep the first-load reveal but snap
395
+ images open on same-document edits. Use `'off'` to disable the loading pulse
396
+ and slide-open animation entirely.
397
+
335
398
  ## Content Security Policy (restricted hosts)
336
399
 
337
400
  Archive images resolve to `URL.createObjectURL()` **`blob:` object URLs** (the
@@ -1,11 +1,11 @@
1
1
  export declare const MDZIP_RUNTIME_LIBRARIES: readonly [{
2
2
  readonly name: "@mdzip/editor";
3
- readonly version: "1.3.11";
3
+ readonly version: "1.3.13";
4
4
  readonly repositoryUrl: "https://github.com/mdzip-project/mdzip-editor";
5
5
  readonly description: "MDZip workspace engine and browser UI.";
6
6
  }, {
7
7
  readonly name: "@mdzip/core-js";
8
- readonly version: "1.3.1";
8
+ readonly version: "1.3.2";
9
9
  readonly repositoryUrl: "https://github.com/mdzip-project/mdzip-core-js";
10
10
  readonly description: "MDZip archive reading, writing, and validation.";
11
11
  }, {
@@ -2,13 +2,13 @@
2
2
  export const MDZIP_RUNTIME_LIBRARIES = [
3
3
  {
4
4
  "name": "@mdzip/editor",
5
- "version": "1.3.11",
5
+ "version": "1.3.13",
6
6
  "repositoryUrl": "https://github.com/mdzip-project/mdzip-editor",
7
7
  "description": "MDZip workspace engine and browser UI."
8
8
  },
9
9
  {
10
10
  "name": "@mdzip/core-js",
11
- "version": "1.3.1",
11
+ "version": "1.3.2",
12
12
  "repositoryUrl": "https://github.com/mdzip-project/mdzip-core-js",
13
13
  "description": "MDZip archive reading, writing, and validation."
14
14
  },
@@ -1 +1 @@
1
- {"version":3,"file":"view-css.d.ts","sourceRoot":"","sources":["../src/view-css.ts"],"names":[],"mappings":"AAeA,eAAO,MAAM,aAAa,QAshDzB,CAAC"}
1
+ {"version":3,"file":"view-css.d.ts","sourceRoot":"","sources":["../src/view-css.ts"],"names":[],"mappings":"AAeA,eAAO,MAAM,aAAa,QA6xDzB,CAAC"}