@jackuait/blok-cli 0.15.1 → 0.16.1

package/dist/cli.mjs

@@ -1,6 +1,6 @@
 import * as e from "node:fs";
 //#region src/cli/commands/migrationContent.ts
-var t = "# Migrating from EditorJS to Blok\n\nThis guide covers the breaking changes when migrating from EditorJS to Blok.\n\n## Table of Contents\n\n- [Core Changes](#core-changes)\n- [Data Attributes](#data-attributes)\n- [CSS Classes](#css-classes)\n- [Bundled Tools](#bundled-tools)\n  - [Tool Configuration](#tool-configuration)\n  - [Lifecycle Hooks](#lifecycle-hooks)\n  - [Delimiter → Divider](#delimiter--divider)\n- [Configuration Defaults](#configuration-defaults)\n- [New API Methods](#new-api-methods)\n- [DOM Selectors](#dom-selectors)\n- [E2E Test Selectors](#e2e-test-selectors)\n\n---\n\n## Core Changes\n\n### Class Name\n\n```diff\n- import EditorJS from '@editorjs/editorjs';\n+ import Blok from '@jackuait/blok';\n\n- const editor = new EditorJS({ ... });\n+ const editor = new Blok({ ... });\n```\n\n### Default Holder\n\nThe default holder ID changed from `editorjs` to `blok`:\n\n```diff\n- <div id=\"editorjs\"></div>\n+ <div id=\"blok\"></div>\n```\n\nOr specify explicitly:\n\n```javascript\nconst editor = new Blok({\n  holder: 'my-editor', // works the same as before\n});\n```\n\n### TypeScript Types\n\n```diff\n- import type { EditorConfig, OutputData } from '@editorjs/editorjs';\n+ import type { BlokConfig, OutputData } from '@jackuait/blok';\n```\n\n---\n\n## Data Attributes\n\nBlok uses `data-blok-*` attributes instead of EditorJS's mixed naming conventions.\n\n| EditorJS | Blok |\n|----------|------|\n| `data-id` | `data-blok-id` |\n| `data-item-name` | `data-blok-item-name` |\n| `data-empty` | `data-blok-empty` |\n| `.ce-block--selected` (class) | `data-blok-selected=\"true\"` |\n| — | `data-blok-component` (tool name) |\n| — | `data-blok-interface` (element type) |\n| — | `data-blok-testid` (testing) |\n| — | `data-blok-opened` (toolbar state) |\n| — | `data-blok-placeholder` |\n| — | `data-blok-stretched` |\n| — | `data-blok-focused` |\n| — | `data-blok-popover-opened` |\n| — | `data-blok-tool` (tool name on rendered element) |\n| — | `data-blok-dragging` (block being dragged) |\n| — | `data-blok-hidden` (hidden state) |\n| — | `data-blok-rtl` (RTL mode) |\n| — | `data-blok-drag-handle` (drag handle element) |\n| — | `data-blok-overlay` (selection overlay) |\n| — | `data-blok-overlay-rectangle` (selection rectangle) |\n\n### Querying Blocks\n\n```diff\n- document.querySelector('[data-id=\"abc123\"]');\n+ document.querySelector('[data-blok-id=\"abc123\"]');\n\n- document.querySelector('[data-item-name=\"bold\"]');\n+ document.querySelector('[data-blok-item-name=\"bold\"]');\n```\n\n---\n\n## CSS Classes\n\nBlok replaces BEM class names with data attributes for selection.\n\n### Editor Wrapper\n\n| EditorJS | Blok |\n|----------|------|\n| `.codex-editor` | `[data-blok-editor]` |\n| `.codex-editor__redactor` | `[data-blok-redactor]` |\n| `.codex-editor--rtl` | `[data-blok-rtl=\"true\"]` |\n\n### Block Elements\n\n| EditorJS | Blok |\n|----------|------|\n| `.ce-block` | `[data-blok-element]` |\n| `.ce-block--selected` | `[data-blok-selected=\"true\"]` |\n| `.ce-block--stretched` | `[data-blok-stretched=\"true\"]` |\n| `.ce-block--focused` | `[data-blok-focused=\"true\"]` |\n| `.ce-block__content` | `[data-blok-element-content]` |\n\n### Toolbar\n\n| EditorJS | Blok |\n|----------|------|\n| `.ce-toolbar` | `[data-blok-toolbar]` |\n| `.ce-toolbar__plus` | `[data-blok-testid=\"plus-button\"]` |\n| `.ce-toolbar__settings-btn` | `[data-blok-settings-toggler]` |\n| `.ce-toolbar__actions` | `[data-blok-testid=\"toolbar-actions\"]` |\n| `.ce-toolbox` | `[data-blok-toolbox]` |\n| `.ce-toolbox--opened` | `[data-blok-toolbox][data-blok-opened=\"true\"]` |\n\n### Inline Toolbar\n\n| EditorJS | Blok |\n|----------|------|\n| `.ce-inline-toolbar` | `[data-blok-testid=\"inline-toolbar\"]` |\n| `.ce-inline-tool` | `[data-blok-testid=\"inline-tool\"]` |\n| `.ce-inline-tool--link` | `[data-blok-testid=\"inline-tool-link\"]` |\n| `.ce-inline-tool--bold` | `[data-blok-testid=\"inline-tool-bold\"]` |\n| `.ce-inline-tool--italic` | `[data-blok-testid=\"inline-tool-italic\"]` |\n\n### Popover\n\n| EditorJS | Blok |\n|----------|------|\n| `.ce-popover` | `[data-blok-popover]` |\n| `.ce-popover--opened` | `[data-blok-popover][data-blok-opened=\"true\"]` |\n| `.ce-popover__container` | `[data-blok-popover-container]` |\n| `.ce-popover-item` | `[data-blok-testid=\"popover-item\"]` |\n| `.ce-popover-item--focused` | `[data-blok-focused=\"true\"]` |\n| `.ce-popover-item--confirmation` | `[data-blok-confirmation=\"true\"]` |\n| `.ce-popover-item__icon` | `[data-blok-testid=\"popover-item-icon\"]` |\n| `.ce-popover-item__icon--tool` | `[data-blok-testid=\"popover-item-icon-tool\"]` |\n\n### Tool-Specific Classes\n\n| EditorJS | Blok |\n|----------|------|\n| `.ce-paragraph` | `[data-blok-tool=\"paragraph\"]` |\n| `.ce-header` | `[data-blok-tool=\"header\"]` |\n\n### Conversion Toolbar & Settings\n\n| EditorJS | Blok |\n|----------|------|\n| `.ce-conversion-toolbar` | `[data-blok-testid=\"conversion-toolbar\"]` |\n| `.ce-conversion-tool` | `[data-blok-testid=\"conversion-tool\"]` |\n| `.ce-settings` | `[data-blok-testid=\"block-settings\"]` |\n| `.ce-tune` | `[data-blok-testid=\"block-tune\"]` |\n\n### Other Elements\n\n| EditorJS | Blok |\n|----------|------|\n| `.ce-stub` | `[data-blok-stub]` |\n| `.ce-drag-handle` | `[data-blok-drag-handle]` |\n| `.ce-ragged-right` | `[data-blok-ragged-right=\"true\"]` |\n\n### CDX List Classes\n\n| EditorJS | Blok |\n|----------|------|\n| `.cdx-list` | `[data-blok-list]` |\n| `.cdx-list__item` | `[data-blok-list-item]` |\n| `.cdx-list--ordered` | `[data-blok-list=\"ordered\"]` |\n| `.cdx-list--unordered` | `[data-blok-list=\"unordered\"]` |\n\n### CDX Utility Classes\n\n| EditorJS | Blok |\n|----------|------|\n| `.cdx-button` | `[data-blok-button]` |\n| `.cdx-input` | `[data-blok-input]` |\n| `.cdx-loader` | `[data-blok-loader]` |\n| `.cdx-search-field` | `[data-blok-search-field]` |\n\n---\n\n## Bundled Tools\n\nBlok includes Header and Paragraph tools. No external packages needed:\n\n```diff\n- import Header from '@editorjs/header';\n- import Paragraph from '@editorjs/paragraph';\n\n+ import Blok from '@jackuait/blok';\n\nconst editor = new Blok({\n  tools: {\n-   header: Header,\n-   paragraph: Paragraph,\n+   header: Blok.Header,\n+   paragraph: Blok.Paragraph, // optional, it's the default\n  },\n});\n```\n\n### Tool Configuration\n\nBoth bundled tools accept configuration options:\n\n#### HeaderConfig\n\n```typescript\nimport type { HeaderConfig } from '@jackuait/blok';\n\nconst editor = new Blok({\n  tools: {\n    header: {\n      class: Blok.Header,\n      config: {\n        placeholder: 'Enter a heading',\n        levels: [2, 3, 4],      // Restrict to H2-H4 only\n        defaultLevel: 2,        // Default to H2\n      } as HeaderConfig,\n    },\n  },\n});\n```\n\n| Option | Type | Default | Description |\n|--------|------|---------|-------------|\n| `placeholder` | `string` | `''` | Placeholder text for empty header |\n| `levels` | `number[]` | `[1,2,3,4,5,6]` | Available heading levels (1-6) |\n| `defaultLevel` | `number` | `2` | Default heading level |\n\n#### ParagraphConfig\n\n```typescript\nimport type { ParagraphConfig } from '@jackuait/blok';\n\nconst editor = new Blok({\n  tools: {\n    paragraph: {\n      class: Blok.Paragraph,\n      config: {\n        placeholder: 'Start typing...',\n        preserveBlank: true,\n      } as ParagraphConfig,\n    },\n  },\n});\n```\n\n| Option | Type | Default | Description |\n|--------|------|---------|-------------|\n| `placeholder` | `string` | `''` | Placeholder text for empty paragraph |\n| `preserveBlank` | `boolean` | `false` | Keep empty paragraphs when saving |\n\n### Delimiter → Divider\n\nEditor.js's `@editorjs/delimiter` is replaced by Blok's built-in `divider` tool:\n\n```diff\n- import Delimiter from '@editorjs/delimiter';\n\nconst editor = new Blok({\n  tools: {\n-   delimiter: Delimiter,\n+   divider: Blok.Divider,\n  },\n});\n```\n\n**Saved data migration:** The block type name changed from `\"delimiter\"` to `\"divider\"`. The data format is identical (empty `{}`):\n\n```diff\n  {\n-   \"type\": \"delimiter\",\n+   \"type\": \"divider\",\n    \"data\": {}\n  }\n```\n\n> **Note:** Blok automatically recognizes `\"delimiter\"` blocks and renders them as dividers, so existing articles work without data migration. However, renaming the type in your database is recommended for consistency.\n\n---\n\n## Configuration Defaults\n\n| Option | EditorJS | Blok |\n|--------|----------|------|\n| `holder` | `\"editorjs\"` | `\"blok\"` |\n| `defaultBlock` | `\"paragraph\"` | `\"paragraph\"` |\n\n---\n\n## New API Methods\n\nBlok exposes shorthand methods directly on the instance:\n\n```javascript\nconst editor = new Blok({ ... });\n\n// Shorthand methods\nawait editor.save();      // Same as editor.saver.save()\neditor.clear();           // Same as editor.blocks.clear()\nawait editor.render(data);// Same as editor.blocks.render(data)\neditor.focus();           // Same as editor.caret.focus()\n\n// Event methods\neditor.on('change', handler);   // Same as editor.events.on()\neditor.off('change', handler);  // Same as editor.events.off()\neditor.emit('custom', data);    // Same as editor.events.emit()\n```\n\n---\n\n## DOM Selectors\n\nBlok uses consistent `data-blok-interface` attributes for major UI components:\n\n```javascript\n// Find the editor wrapper\nconst editorWrapper = document.querySelector('[data-blok-interface=\"blok\"]');\n\n// Find inline toolbar\nconst inlineToolbar = document.querySelector('[data-blok-interface=\"inline-toolbar\"]');\n\n// Find tooltip\nconst tooltip = document.querySelector('[data-blok-interface=\"tooltip\"]');\n```\n\nThese selectors are stable and recommended for programmatic access to Blok's UI components.\n\n### Key Changes\n\n1. **Prefix custom classes** with `blok-` instead of `ce-` or `cdx-`\n2. **Use `data-blok-*`** attributes instead of `data-*`\n\n---\n\n## E2E Test Selectors\n\nUpdate your test selectors to use Blok's `data-blok-testid` attributes:\n\n| EditorJS | Blok |\n|----------|------|\n| `[data-cy=editorjs]` | `[data-blok-testid=\"blok-editor\"]` |\n| `.ce-block` | `[data-blok-element]` |\n| `.ce-block__content` | `[data-blok-element-content]` |\n| `.ce-toolbar` | `[data-blok-toolbar]` |\n| `.ce-toolbar__plus` | `[data-blok-testid=\"plus-button\"]` |\n| `.ce-toolbar__settings-btn` | `[data-blok-settings-toggler]` |\n| `.ce-toolbar__actions` | `[data-blok-testid=\"toolbar-actions\"]` |\n| `.ce-toolbox` | `[data-blok-toolbox]` |\n| `.ce-inline-toolbar` | `[data-blok-testid=\"inline-toolbar\"]` |\n| `.ce-popover` | `[data-blok-popover]` |\n| `.ce-popover-item` | `[data-blok-testid=\"popover-item\"]` |\n| `[data-item-name=\"...\"]` | `[data-blok-item-name=\"...\"]` |\n\n### Playwright Example\n\n```diff\n// EditorJS\n- await page.locator('[data-cy=editorjs] .ce-block').click();\n- await page.locator('.ce-toolbar__settings-btn').click();\n- await page.locator('[data-item-name=\"delete\"]').click();\n\n// Blok\n+ await page.locator('[data-blok-element]').click();\n+ await page.locator('[data-blok-settings-toggler]').click();\n+ await page.locator('[data-blok-item-name=\"delete\"]').click();\n```\n\n### Additional Test Selectors\n\n| Element | Selector |\n|---------|----------|\n| Block tunes popover | `[data-blok-testid=\"block-tunes-popover\"]` |\n| Popover search input | `[data-blok-testid=\"popover-search-input\"]` |\n| Popover item title | `[data-blok-testid=\"popover-item-title\"]` |\n| Popover overlay | `[data-blok-testid=\"popover-overlay\"]` |\n| Inline tool input | `[data-blok-testid=\"inline-tool-input\"]` |\n| Tooltip | `[data-blok-testid=\"tooltip\"]` |\n| Redactor | `[data-blok-testid=\"redactor\"]` |\n| Toolbox | `[data-blok-testid=\"toolbox\"]` |\n| Toolbox popover | `[data-blok-testid=\"toolbox-popover\"]` |\n| Selection overlay | `[data-blok-testid=\"overlay\"]` |\n| Selection rectangle | `[data-blok-testid=\"overlay-rectangle\"]` |\n\n---\n\n### State Selectors\n\n| State | Selector |\n|-------|----------|\n| Toolbar opened | `[data-blok-opened=\"true\"]` |\n| Block selected | `[data-blok-selected=\"true\"]` |\n| Popover opened | `[data-blok-popover-opened=\"true\"]` |\n| Item focused | `[data-blok-focused=\"true\"]` |\n| Item disabled | `[data-blok-disabled=\"true\"]` |\n| Nested popover | `[data-blok-nested=\"true\"]` |\n| Toolbox opened | `[data-blok-toolbox-opened=\"true\"]` |\n| Block dragging | `[data-blok-dragging=\"true\"]` |\n| Element hidden | `[data-blok-hidden=\"true\"]` |\n| RTL mode | `[data-blok-rtl=\"true\"]` |\n\n---\n\n## Quick Checklist\n\n- [ ] Replace `new EditorJS` with `new Blok`\n- [ ] Update imports from `@editorjs/*` to `@jackuait/blok`\n- [ ] Change holder from `editorjs` to `blok` (or specify explicitly)\n- [ ] Use bundled tools: `Blok.Header`, `Blok.Paragraph`\n- [ ] Replace `@editorjs/delimiter` with built-in `Blok.Divider`\n- [ ] Update `EditorConfig` type to `BlokConfig`\n- [ ] Replace `data-id` with `data-blok-id` in queries\n- [ ] Replace `data-item-name` with `data-blok-item-name`\n- [ ] Replace `.ce-*` selectors with `[data-blok-*]` attributes\n- [ ] Replace `.cdx-*` selectors with `[data-blok-*]` attributes\n- [ ] Update E2E test selectors\n", n = (e) => [
+var t = "# Migrating from EditorJS to Blok\n\nThis guide covers the breaking changes when migrating from EditorJS to Blok.\n\n## Table of Contents\n\n- [Supported Editor.js Versions](#supported-editorjs-versions)\n- [Core Changes](#core-changes)\n- [Data Attributes](#data-attributes)\n- [CSS Classes](#css-classes)\n- [Bundled Tools](#bundled-tools)\n  - [Tool Configuration](#tool-configuration)\n  - [Lifecycle Hooks](#lifecycle-hooks)\n  - [Delimiter → Divider](#delimiter--divider)\n- [Migrating Custom Tools](#migrating-custom-tools)\n  - [Custom Block Tools (port unchanged)](#custom-block-tools-port-unchanged)\n  - [Custom Inline Tools (breaking rewrite)](#custom-inline-tools-breaking-rewrite)\n- [Saved Content / Data Migration](#saved-content--data-migration)\n  - [Auto-Migrated on Load](#auto-migrated-on-load)\n  - [Dropped Fields](#dropped-fields)\n- [Configuration Defaults](#configuration-defaults)\n- [New API Methods](#new-api-methods)\n- [DOM Selectors](#dom-selectors)\n- [E2E Test Selectors](#e2e-test-selectors)\n\n---\n\n## Supported Editor.js Versions\n\nBlok targets the **Editor.js 2.x** line. The [codemod](./codemod) is built against the package versions a typical Editor.js 2.x project ships — `@editorjs/editorjs@^2.28.x`, `@editorjs/header@^2.8.x`, `@editorjs/paragraph@^2.11.x`, `@editorjs/list@^1.9.x` — and the runtime auto-migration reads the saved-data shapes those versions produce. Older 2.x data formats are still recognized; the matrix below describes coverage per block/tool, not per Editor.js point release.\n\nThere is no pinned single source version: Blok is API-compatible with the Editor.js 2.x `BlockTool` / `InlineTool` contracts, so what matters is **which tools your content uses**, covered below.\n\n### Compatibility Matrix\n\nHow each Editor.js block/tool is handled. \"Auto-migrated at runtime\" means the conversion happens on `render()` with no script needed; \"Codemod\" means the [codemod](./codemod) rewrites saved JSON; \"Drop-in unchanged\" means the data passes through as-is; \"Not bundled\" means Blok ships no equivalent tool, so you must register your own (a ported Editor.js block tool works unchanged — see [Migrating Custom Tools](#migrating-custom-tools)) or the block renders as a preserved stub with a `console.warn` and round-trips untouched on save.\n\n| Editor.js block / tool | Migration status | Notes |\n|------------------------|------------------|-------|\n| `paragraph` | Drop-in unchanged | Bundled as `Blok.Paragraph` (the default block). |\n| `header` | Drop-in unchanged | Bundled as `Blok.Header`. |\n| `list` (nested **and** string-array items) | Auto-migrated at runtime | Each item expands to a flat `list` block. |\n| `checklist` (standalone tool) | Auto-migrated at runtime | Becomes `list` blocks with checklist style. Handled by the runtime only, not the codemod. |\n| `image`, `simple-image` | Auto-migrated at runtime **+** codemod | `file.url` (or `simple-image`'s flat `url`) → `url`; `withBorder` → `frame`, `stretched` → `size`. `withBackground` is dropped (warns). |\n| `linkTool` | Auto-migrated at runtime **+** codemod → `bookmark` | `meta` flattens onto the bookmark shape; `meta.site_name` is dropped (warns). |\n| `delimiter` | Codemod renames type → `divider` | Data format is identical (`{}`). Also recognized at render, so existing data works without the rename. |\n| `quote` | Auto-migrated at runtime **+** codemod | `caption` becomes a trailing `paragraph` sibling; `alignment` is dropped (warns). The quote text/size render unchanged. |\n| `code` | Drop-in unchanged | Passes through to Blok's bundled `code` tool. |\n| `table` (HTML-string cells) | Auto-migrated at runtime **+** codemod | Each non-empty cell becomes a `{ blocks: [id] }` cell-ref plus a child `paragraph` (`parent` = table id); empty cells become `{ blocks: [] }`. `withHeadings` is preserved. Cells already in block-ref shape pass through. |\n| `embed` | Drop-in unchanged | Bundled as `Blok.Embed`. `{ service, source, embed, width, height, caption }` map 1:1; iframe providers render correctly (Blok-only fields default). |\n| `raw` | Auto-migrated at runtime **+** codemod → `code` | Blok has no raw tool; `{ html }` becomes a `code` block showing the markup as source verbatim. |\n| `warning` | Auto-migrated at runtime **+** codemod → `callout` | Becomes a ⚠️ orange `callout`; `title` and `message` become child `paragraph` blocks. |\n| `attaches` | Auto-migrated at runtime **+** codemod → `bookmark` | `file.url` + `title` map to a `bookmark`; file metadata (`name`/`size`/`extension`) is dropped (warns). |\n| `marker`, `inlineCode` (inline) | Not bundled | Register your own (port unchanged or wrap with `wrapLegacyInlineTool`). See [Custom Inline Tools](#custom-inline-tools). |\n| Other third-party block tools (`personality`, `button`, audio, …) | Not bundled | No built-in equivalent. Register a tool to render them; otherwise the block is preserved as a stub (warns) and survives a save/load round-trip. |\n\n> **Heads-up:** any block type Blok doesn't recognize and has no registered tool for renders as a stub and logs `Tool «<name>» is not found`. Its data is preserved, so registering the tool later restores the block.\n\n---\n\n## Core Changes\n\n### Class Name\n\n```diff\n- import EditorJS from '@editorjs/editorjs';\n+ import Blok from '@jackuait/blok';\n\n- const editor = new EditorJS({ ... });\n+ const editor = new Blok({ ... });\n```\n\n`Blok` is also exported as the **default export** and under an `EditorJS` alias, so you can keep your existing variable name and only change the import path — a minimal-diff, drop-in migration:\n\n```diff\n- import EditorJS from '@editorjs/editorjs';\n+ import { EditorJS } from '@jackuait/blok';\n\n  const editor = new EditorJS({ ... }); // unchanged\n```\n\n`import Blok`, `import { Blok }`, and `import { EditorJS }` all resolve to the same class.\n\n### Default Holder\n\nThe default holder ID changed from `editorjs` to `blok`:\n\n```diff\n- <div id=\"editorjs\"></div>\n+ <div id=\"blok\"></div>\n```\n\nOr specify explicitly:\n\n```javascript\nconst editor = new Blok({\n  holder: 'my-editor', // works the same as before\n});\n```\n\n### TypeScript Types\n\n```diff\n- import type { EditorConfig, OutputData } from '@editorjs/editorjs';\n+ import type { BlokConfig, OutputData } from '@jackuait/blok';\n```\n\n---\n\n## Data Attributes\n\nBlok uses `data-blok-*` attributes instead of EditorJS's mixed naming conventions.\n\n| EditorJS | Blok |\n|----------|------|\n| `data-id` | `data-blok-id` |\n| `data-item-name` | `data-blok-item-name` |\n| `data-empty` | `data-blok-empty` |\n| `.ce-block--selected` (class) | `data-blok-selected=\"true\"` |\n| — | `data-blok-component` (tool name) |\n| — | `data-blok-interface` (element type) |\n| — | `data-blok-testid` (testing) |\n| — | `data-blok-opened` (toolbar state) |\n| — | `data-blok-placeholder` |\n| — | `data-blok-stretched` |\n| — | `data-blok-focused` |\n| — | `data-blok-popover-opened` |\n| — | `data-blok-tool` (tool name on rendered element) |\n| — | `data-blok-dragging` (block being dragged) |\n| — | `data-blok-hidden` (hidden state) |\n| — | `data-blok-rtl` (RTL mode) |\n| — | `data-blok-drag-handle` (drag handle element) |\n| — | `data-blok-overlay` (selection overlay) |\n| — | `data-blok-overlay-rectangle` (selection rectangle) |\n\n### Querying Blocks\n\n```diff\n- document.querySelector('[data-id=\"abc123\"]');\n+ document.querySelector('[data-blok-id=\"abc123\"]');\n\n- document.querySelector('[data-item-name=\"bold\"]');\n+ document.querySelector('[data-blok-item-name=\"bold\"]');\n```\n\n---\n\n## CSS Classes\n\nBlok replaces BEM class names with data attributes for selection.\n\n### Editor Wrapper\n\n| EditorJS | Blok |\n|----------|------|\n| `.codex-editor` | `[data-blok-editor]` |\n| `.codex-editor__redactor` | `[data-blok-redactor]` |\n| `.codex-editor--rtl` | `[data-blok-rtl=\"true\"]` |\n\n### Block Elements\n\n| EditorJS | Blok |\n|----------|------|\n| `.ce-block` | `[data-blok-element]` |\n| `.ce-block--selected` | `[data-blok-selected=\"true\"]` |\n| `.ce-block--stretched` | `[data-blok-stretched=\"true\"]` |\n| `.ce-block--focused` | `[data-blok-focused=\"true\"]` |\n| `.ce-block__content` | `[data-blok-element-content]` |\n\n### Toolbar\n\n| EditorJS | Blok |\n|----------|------|\n| `.ce-toolbar` | `[data-blok-toolbar]` |\n| `.ce-toolbar__plus` | `[data-blok-testid=\"plus-button\"]` |\n| `.ce-toolbar__settings-btn` | `[data-blok-settings-toggler]` |\n| `.ce-toolbar__actions` | `[data-blok-testid=\"toolbar-actions\"]` |\n| `.ce-toolbox` | `[data-blok-toolbox]` |\n| `.ce-toolbox--opened` | `[data-blok-toolbox][data-blok-opened=\"true\"]` |\n\n### Inline Toolbar\n\n| EditorJS | Blok |\n|----------|------|\n| `.ce-inline-toolbar` | `[data-blok-testid=\"inline-toolbar\"]` |\n| `.ce-inline-tool` | `[data-blok-testid=\"inline-tool\"]` |\n| `.ce-inline-tool--link` | `[data-blok-testid=\"inline-tool-link\"]` |\n| `.ce-inline-tool--bold` | `[data-blok-testid=\"inline-tool-bold\"]` |\n| `.ce-inline-tool--italic` | `[data-blok-testid=\"inline-tool-italic\"]` |\n\n### Popover\n\n| EditorJS | Blok |\n|----------|------|\n| `.ce-popover` | `[data-blok-popover]` |\n| `.ce-popover--opened` | `[data-blok-popover][data-blok-opened=\"true\"]` |\n| `.ce-popover__container` | `[data-blok-popover-container]` |\n| `.ce-popover-item` | `[data-blok-testid=\"popover-item\"]` |\n| `.ce-popover-item--focused` | `[data-blok-focused=\"true\"]` |\n| `.ce-popover-item--confirmation` | `[data-blok-confirmation=\"true\"]` |\n| `.ce-popover-item__icon` | `[data-blok-testid=\"popover-item-icon\"]` |\n| `.ce-popover-item__icon--tool` | `[data-blok-testid=\"popover-item-icon-tool\"]` |\n\n### Tool-Specific Classes\n\n| EditorJS | Blok |\n|----------|------|\n| `.ce-paragraph` | `[data-blok-tool=\"paragraph\"]` |\n| `.ce-header` | `[data-blok-tool=\"header\"]` |\n\n### Conversion Toolbar & Settings\n\n| EditorJS | Blok |\n|----------|------|\n| `.ce-conversion-toolbar` | `[data-blok-testid=\"conversion-toolbar\"]` |\n| `.ce-conversion-tool` | `[data-blok-testid=\"conversion-tool\"]` |\n| `.ce-settings` | `[data-blok-testid=\"block-settings\"]` |\n| `.ce-tune` | `[data-blok-testid=\"block-tune\"]` |\n\n### Other Elements\n\n| EditorJS | Blok |\n|----------|------|\n| `.ce-stub` | `[data-blok-stub]` |\n| `.ce-drag-handle` | `[data-blok-drag-handle]` |\n| `.ce-ragged-right` | `[data-blok-ragged-right=\"true\"]` |\n\n### CDX List Classes\n\n| EditorJS | Blok |\n|----------|------|\n| `.cdx-list` | `[data-blok-list]` |\n| `.cdx-list__item` | `[data-blok-list-item]` |\n| `.cdx-list--ordered` | `[data-blok-list=\"ordered\"]` |\n| `.cdx-list--unordered` | `[data-blok-list=\"unordered\"]` |\n\n### CDX Utility Classes\n\n| EditorJS | Blok |\n|----------|------|\n| `.cdx-button` | `[data-blok-button]` |\n| `.cdx-input` | `[data-blok-input]` |\n| `.cdx-loader` | `[data-blok-loader]` |\n| `.cdx-search-field` | `[data-blok-search-field]` |\n\n---\n\n## Bundled Tools\n\nBlok includes Header and Paragraph tools. No external packages needed:\n\n```diff\n- import Header from '@editorjs/header';\n- import Paragraph from '@editorjs/paragraph';\n\n+ import Blok from '@jackuait/blok';\n\nconst editor = new Blok({\n  tools: {\n-   header: Header,\n-   paragraph: Paragraph,\n+   header: Blok.Header,\n+   paragraph: Blok.Paragraph, // optional, it's the default\n  },\n});\n```\n\n### Tool Configuration\n\nBoth bundled tools accept configuration options:\n\n#### HeaderConfig\n\n```typescript\nimport type { HeaderConfig } from '@jackuait/blok';\n\nconst editor = new Blok({\n  tools: {\n    header: {\n      class: Blok.Header,\n      config: {\n        placeholder: 'Enter a heading',\n        levels: [2, 3, 4],      // Restrict to H2-H4 only\n        defaultLevel: 2,        // Default to H2\n      } as HeaderConfig,\n    },\n  },\n});\n```\n\n| Option | Type | Default | Description |\n|--------|------|---------|-------------|\n| `placeholder` | `string` | `''` | Placeholder text for empty header |\n| `levels` | `number[]` | `[1,2,3,4,5,6]` | Available heading levels (1-6) |\n| `defaultLevel` | `number` | `2` | Default heading level |\n\n#### ParagraphConfig\n\n```typescript\nimport type { ParagraphConfig } from '@jackuait/blok';\n\nconst editor = new Blok({\n  tools: {\n    paragraph: {\n      class: Blok.Paragraph,\n      config: {\n        placeholder: 'Start typing...',\n        preserveBlank: true,\n      } as ParagraphConfig,\n    },\n  },\n});\n```\n\n| Option | Type | Default | Description |\n|--------|------|---------|-------------|\n| `placeholder` | `string` | `''` | Placeholder text for empty paragraph |\n| `preserveBlank` | `boolean` | `false` | Keep empty paragraphs when saving |\n\n### Delimiter → Divider\n\nEditor.js's `@editorjs/delimiter` is replaced by Blok's built-in `divider` tool:\n\n```diff\n- import Delimiter from '@editorjs/delimiter';\n\nconst editor = new Blok({\n  tools: {\n-   delimiter: Delimiter,\n+   divider: Blok.Divider,\n  },\n});\n```\n\n**Saved data migration:** The block type name changed from `\"delimiter\"` to `\"divider\"`. The data format is identical (empty `{}`):\n\n```diff\n  {\n-   \"type\": \"delimiter\",\n+   \"type\": \"divider\",\n    \"data\": {}\n  }\n```\n\n> **Note:** Blok automatically recognizes `\"delimiter\"` blocks and renders them as dividers, so existing articles work without data migration. However, renaming the type in your database is recommended for consistency.\n\n---\n\n## Migrating Custom Tools\n\nIf your project ships its own tools, here's what changes and what doesn't.\n\n### Custom Block Tools (port unchanged)\n\n**Custom block tools work as-is.** Blok's `BlockTool` interface keeps the same shape as EditorJS, read by the **same keys**:\n\n- Methods: `render()`, `save()`, `validate()`, `renderSettings()`, `merge()`, `onPaste()`, and the lifecycle hooks `rendered()`, `updated()`, `removed()`, `moved()`.\n- Statics: `toolbox`, `conversionConfig`, `pasteConfig`, `isReadOnlySupported`, `enableLineBreaks`.\n\nIn most cases you can drop your existing block tool into Blok without touching its code.\n\n#### New optional `setReadOnly(state)` method\n\nBlok adds an **optional** `setReadOnly(state: boolean)` method. It is not a breaking change:\n\n- **If you omit it**, read-only toggling still works — Blok falls back to a full re-render of the block (graceful degradation).\n- **If you implement it**, Blok performs a cheaper in-place toggle instead of re-rendering.\n\n```typescript\nclass MyTool {\n  // ...render / save / validate as before...\n\n  // Optional: enables the cheaper in-place read-only toggle\n  setReadOnly(state: boolean): void {\n    this.input.contentEditable = state ? 'false' : 'true';\n  }\n}\n```\n\n#### New optional statics\n\nTwo new **optional** statics exist for advanced cases; existing tools never need them:\n\n- `titleKey` — a translation key for the tool's toolbox title (i18n).\n- `provides` — lets one class register multiple block types.\n\n### Custom Inline Tools\n\n**This is the one API difference for custom tools.** EditorJS inline tools built a DOM button and used imperative `surround` / `checkState` / `renderActions` / `clear` methods. Blok's `InlineTool` (`types/tools/inline-tool.d.ts`) instead expects `render()` to return a declarative `MenuConfig` object with `onActivate` / `isActive` callbacks.\n\nYou have two paths:\n\n#### Fast path — wrap with `wrapLegacyInlineTool`\n\nTo keep an existing EditorJS inline tool working without a rewrite, wrap its class:\n\n```typescript\nimport { wrapLegacyInlineTool } from '@jackuait/blok';\nimport MarkerTool from './marker-tool'; // your existing EditorJS inline tool\n\nconst editor = new Blok({\n  tools: {\n    marker: wrapLegacyInlineTool(MarkerTool),\n  },\n});\n```\n\nThe shim adapts the legacy contract automatically: it calls your tool's `render()` for the icon, routes `onActivate` → `surround(range)` and `isActive` → `checkState(selection)`, and forwards the static `title` / `shortcut` / `sanitize`. Without wrapping, Blok silently skips a legacy `render()` that returns an `HTMLElement`, so the tool would vanish from the inline toolbar. `renderActions()` / `clear()` are not bridged.\n\n#### Native path — rewrite to `MenuConfig` (recommended)\n\nFor full access to Blok features (nested items, confirmation), port to the native shape:\n\n#### Before (EditorJS)\n\n```typescript\nclass MarkerTool {\n  static get isInline() { return true; }\n  static get title() { return 'Marker'; }\n\n  private button: HTMLButtonElement;\n\n  render(): HTMLElement {\n    this.button = document.createElement('button');\n    this.button.innerHTML = '<svg>...</svg>';\n    return this.button;\n  }\n\n  // Apply / remove formatting on the current range\n  surround(range: Range): void {\n    document.execCommand('backColor', false, '#ffd700');\n  }\n\n  // Reflect active state by inspecting the selection\n  checkState(selection: Selection): boolean {\n    const isActive = /* ...inspect selection... */;\n    this.button.classList.toggle('active', isActive);\n    return isActive;\n  }\n\n  renderActions(): HTMLElement { /* extra UI */ }\n  clear(): void { /* reset extra UI */ }\n}\n```\n\n#### After (Blok)\n\n```typescript\nimport type { InlineTool, MenuConfig } from '@jackuait/blok';\n\nclass MarkerTool implements InlineTool {\n  static isInline = true;\n  static title = 'Marker';\n  static titleKey = 'marker'; // optional i18n key\n\n  // render() now returns a MenuConfig object, not an HTMLElement\n  render(): MenuConfig {\n    return {\n      icon: '<svg>...</svg>',\n      name: 'marker',\n      // surround(range) logic moves here\n      onActivate: () => {\n        document.execCommand('backColor', false, '#ffd700');\n      },\n      // checkState(selection) logic moves here\n      isActive: () => {\n        const selection = window.getSelection();\n        return selection ? /* ...inspect selection... */ false : false;\n      },\n    };\n  }\n}\n```\n\n> See `src/components/inline-tools/inline-tool-bold.ts` for Blok's canonical inline tool. Its `render()` returns a `MenuConfig` with `onActivate` (apply/remove bold) and `isActive` (read the selection).\n\n#### Mapping reference\n\n| EditorJS | Blok |\n|----------|------|\n| `render()` returns an `HTMLElement` button | `render()` returns a `MenuConfig` `{ icon, name, onActivate, isActive }` |\n| `surround(range)` | logic moves into `onActivate()` |\n| `checkState(selection)` | logic moves into `isActive()` |\n| `renderActions()` / `clear()` | **removed** — no direct equivalent; use `MenuConfig` `children` for nested items |\n| `static get isInline()` / `static get title()` | still apply (plus optional `titleKey` for i18n) |\n\n---\n\n## Saved Content / Data Migration\n\nExisting EditorJS output data keeps working. Blok converts legacy block shapes to its own format **automatically when the block renders** — no migration script needed.\n\n### Auto-Migrated on Load\n\nThese EditorJS block types and data shapes are recognized and converted on `render()`:\n\n| EditorJS block / shape | Becomes in Blok |\n|------------------------|-----------------|\n| `list` (nested items **and** string-array items) | Blok `list` |\n| `checklist` (standalone tool) | Blok `list` (checklist style) |\n| `image` `{ file: { url }, withBorder, stretched }` | Blok `image` |\n| `table` (HTML-string cells) | Blok `table` |\n| `header` | Blok `header` |\n| `code` | Blok `code` |\n| `delimiter` | Blok `divider` |\n| `linkTool` | Blok `bookmark` |\n\nNo action is required — load your existing data and it renders correctly.\n\n### Dropped Fields\n\nA few EditorJS fields have no Blok equivalent and are **dropped** on load. The block still renders; only these specific fields are lost:\n\n| Block | Dropped field(s) |\n|-------|------------------|\n| `quote` | `caption`, `alignment` |\n| `image` | `withBackground` |\n| `linkTool` | `meta.site_name` |\n| `list` item | `meta` |\n\nWhen migration drops one of these, Blok emits a `console.warn` (prefixed `[Blok migration]`) naming the block type and field, so the loss is visible in the console rather than silent. If you depend on any of these, capture them before migrating.\n\n---\n\n## Configuration Defaults\n\n| Option | EditorJS | Blok |\n|--------|----------|------|\n| `holder` | `\"editorjs\"` | `\"blok\"` |\n| `defaultBlock` | `\"paragraph\"` | `\"paragraph\"` |\n\n---\n\n## New API Methods\n\nBlok exposes shorthand methods directly on the instance:\n\n```javascript\nconst editor = new Blok({ ... });\n\n// Shorthand methods\nawait editor.save();      // Same as editor.saver.save()\neditor.clear();           // Same as editor.blocks.clear()\nawait editor.render(data);// Same as editor.blocks.render(data)\neditor.focus();           // Same as editor.caret.focus()\n\n// Event methods\neditor.on('change', handler);   // Same as editor.events.on()\neditor.off('change', handler);  // Same as editor.events.off()\neditor.emit('custom', data);    // Same as editor.events.emit()\n```\n\n---\n\n## DOM Selectors\n\nBlok uses consistent `data-blok-interface` attributes for major UI components:\n\n```javascript\n// Find the editor wrapper\nconst editorWrapper = document.querySelector('[data-blok-interface=\"blok\"]');\n\n// Find inline toolbar\nconst inlineToolbar = document.querySelector('[data-blok-interface=\"inline-toolbar\"]');\n\n// Find tooltip\nconst tooltip = document.querySelector('[data-blok-interface=\"tooltip\"]');\n```\n\nThese selectors are stable and recommended for programmatic access to Blok's UI components.\n\n### Key Changes\n\n1. **Prefix custom classes** with `blok-` instead of `ce-` or `cdx-`\n2. **Use `data-blok-*`** attributes instead of `data-*`\n\n---\n\n## E2E Test Selectors\n\nUpdate your test selectors to use Blok's `data-blok-testid` attributes:\n\n| EditorJS | Blok |\n|----------|------|\n| `[data-cy=editorjs]` | `[data-blok-testid=\"blok-editor\"]` |\n| `.ce-block` | `[data-blok-element]` |\n| `.ce-block__content` | `[data-blok-element-content]` |\n| `.ce-toolbar` | `[data-blok-toolbar]` |\n| `.ce-toolbar__plus` | `[data-blok-testid=\"plus-button\"]` |\n| `.ce-toolbar__settings-btn` | `[data-blok-settings-toggler]` |\n| `.ce-toolbar__actions` | `[data-blok-testid=\"toolbar-actions\"]` |\n| `.ce-toolbox` | `[data-blok-toolbox]` |\n| `.ce-inline-toolbar` | `[data-blok-testid=\"inline-toolbar\"]` |\n| `.ce-popover` | `[data-blok-popover]` |\n| `.ce-popover-item` | `[data-blok-testid=\"popover-item\"]` |\n| `[data-item-name=\"...\"]` | `[data-blok-item-name=\"...\"]` |\n\n### Playwright Example\n\n```diff\n// EditorJS\n- await page.locator('[data-cy=editorjs] .ce-block').click();\n- await page.locator('.ce-toolbar__settings-btn').click();\n- await page.locator('[data-item-name=\"delete\"]').click();\n\n// Blok\n+ await page.locator('[data-blok-element]').click();\n+ await page.locator('[data-blok-settings-toggler]').click();\n+ await page.locator('[data-blok-item-name=\"delete\"]').click();\n```\n\n### Additional Test Selectors\n\n| Element | Selector |\n|---------|----------|\n| Block tunes popover | `[data-blok-testid=\"block-tunes-popover\"]` |\n| Popover search input | `[data-blok-testid=\"popover-search-input\"]` |\n| Popover item title | `[data-blok-testid=\"popover-item-title\"]` |\n| Popover overlay | `[data-blok-testid=\"popover-overlay\"]` |\n| Inline tool input | `[data-blok-testid=\"inline-tool-input\"]` |\n| Tooltip | `[data-blok-testid=\"tooltip\"]` |\n| Redactor | `[data-blok-testid=\"redactor\"]` |\n| Toolbox | `[data-blok-testid=\"toolbox\"]` |\n| Toolbox popover | `[data-blok-testid=\"toolbox-popover\"]` |\n| Selection overlay | `[data-blok-testid=\"overlay\"]` |\n| Selection rectangle | `[data-blok-testid=\"overlay-rectangle\"]` |\n\n---\n\n### State Selectors\n\n| State | Selector |\n|-------|----------|\n| Toolbar opened | `[data-blok-opened=\"true\"]` |\n| Block selected | `[data-blok-selected=\"true\"]` |\n| Popover opened | `[data-blok-popover-opened=\"true\"]` |\n| Item focused | `[data-blok-focused=\"true\"]` |\n| Item disabled | `[data-blok-disabled=\"true\"]` |\n| Nested popover | `[data-blok-nested=\"true\"]` |\n| Toolbox opened | `[data-blok-toolbox-opened=\"true\"]` |\n| Block dragging | `[data-blok-dragging=\"true\"]` |\n| Element hidden | `[data-blok-hidden=\"true\"]` |\n| RTL mode | `[data-blok-rtl=\"true\"]` |\n\n---\n\n## Quick Checklist\n\n- [ ] Replace `new EditorJS` with `new Blok`\n- [ ] Update imports from `@editorjs/*` to `@jackuait/blok`\n- [ ] Change holder from `editorjs` to `blok` (or specify explicitly)\n- [ ] Use bundled tools: `Blok.Header`, `Blok.Paragraph`\n- [ ] Replace `@editorjs/delimiter` with built-in `Blok.Divider`\n- [ ] Update `EditorConfig` type to `BlokConfig`\n- [ ] Replace `data-id` with `data-blok-id` in queries\n- [ ] Replace `data-item-name` with `data-blok-item-name`\n- [ ] Replace `.ce-*` selectors with `[data-blok-*]` attributes\n- [ ] Replace `.cdx-*` selectors with `[data-blok-*]` attributes\n- [ ] Update E2E test selectors\n", n = (e) => [
 	"# Blok Migration Guide (for LLM-assisted migration)",
 	"",
 	"> This document contains everything needed to migrate a project from EditorJS to Blok.",
@@ -41,14 +41,14 @@ var t = "# Migrating from EditorJS to Blok\n\nThis guide covers the breaking cha
 		case "convert-html": {
 			let e = new (await (import("jsdom"))).JSDOM("");
 			globalThis.DOMParser = e.window.DOMParser, globalThis.Node = e.window.Node;
-			let { convertHtml: t } = await import("./convert-html-2QUTiRcG.mjs");
+			let { convertHtml: t } = await import("./convert-html-BfUpTbgb.mjs");
 			r(t((await import("node:fs")).readFileSync("/dev/stdin", "utf-8")), s);
 			break;
 		}
 		case "convert-gdocs": {
 			let e = new (await (import("jsdom"))).JSDOM("");
 			globalThis.DOMParser = e.window.DOMParser, globalThis.Node = e.window.Node, globalThis.document = e.window.document;
-			let { convertGdocs: t } = await import("./convert-gdocs-DoeAZEVT.mjs");
+			let { convertGdocs: t } = await import("./convert-gdocs-Ccu4VdoO.mjs");
 			r(t((await import("node:fs")).readFileSync("/dev/stdin", "utf-8")), s);
 			break;
 		}

package/dist/convert-gdocs-Ccu4VdoO.mjs

@@ -0,0 +1,165 @@
+import { a as e, i as t, n, o as r, r as i, t as a } from "./block-builder-B_eFe3eS.mjs";
+//#region src/components/modules/paste/google-docs-preprocessor.ts
+function o(e) {
+	let t = document.createElement("div");
+	t.innerHTML = e;
+	let n = p(t);
+	return w(t, n), n && (E(t), f(t)), t.innerHTML;
+}
+function s(e, t) {
+	let n = e.parentElement;
+	return n === null ? null : n === t ? e : s(n, t);
+}
+function c(e, t, n) {
+	let r = e.cloneNode(!1), i = [];
+	for (let n of Array.from(e.childNodes)) {
+		if (n === t) break;
+		i.push(n);
+	}
+	return i.forEach((e) => r.appendChild(e)), n !== null && r.appendChild(n), r.childNodes.length > 0 ? r : null;
+}
+function l(e, t, n) {
+	let r = e.cloneNode(!1), i = Array.from(e.childNodes), a = i.findIndex((e) => e === t), o = i.slice(a + 1);
+	return n !== null && r.appendChild(n), o.forEach((e) => r.appendChild(e)), r.childNodes.length > 0 ? r : null;
+}
+function u(e, t) {
+	let n = (e, r, i) => {
+		if (e === t) return {
+			before: r,
+			after: i
+		};
+		let a = e.parentElement;
+		return a === null ? {
+			before: r,
+			after: i
+		} : n(a, c(a, e, r), l(a, e, i));
+	};
+	return n(e, null, null);
+}
+function d(e, t) {
+	let n = e.parentElement;
+	return n === null || n === t ? !1 : n.tagName === "TABLE" ? !0 : d(n, t);
+}
+function f(e) {
+	let t = Array.from(e.querySelectorAll("img"));
+	for (let n of t) {
+		if (d(n, e)) continue;
+		let t = s(n, e);
+		if (!t) continue;
+		let { before: r, after: i } = u(n, t), a = document.createDocumentFragment();
+		r && a.appendChild(r), a.appendChild(n), i && a.appendChild(i), t.replaceWith(a);
+	}
+}
+function p(e) {
+	let t = e.querySelector("b[id^=\"docs-internal-guid-\"]");
+	if (!t) return !1;
+	let n = document.createDocumentFragment();
+	for (; t.firstChild;) n.appendChild(t.firstChild);
+	return t.replaceWith(n), !0;
+}
+function m(e, t, n) {
+	return e ? `background-color: ${n}` : t ? "background-color: transparent" : "";
+}
+function h(e) {
+	let t = e.replace(/\s/g, "");
+	return t === "rgb(0,0,0)" || t === "#000000";
+}
+function g(e) {
+	let t = e.replace(/\s/g, "").toLowerCase(), n = /^rgba?\((\d+),(\d+),(\d+)(?:,[\d.]+)?\)$/.exec(t);
+	if (n) {
+		let e = parseInt(n[1], 10) / 255, t = parseInt(n[2], 10) / 255, r = parseInt(n[3], 10) / 255;
+		return .2126 * e + .7152 * t + .0722 * r;
+	}
+	let r = /^hsla?\(([\d.]+),([\d.]+)%,([\d.]+)%(?:,[\d.]+)?\)$/.exec(t);
+	if (r) {
+		let e = parseFloat(r[1]) / 360, t = parseFloat(r[2]) / 100, n = parseFloat(r[3]) / 100;
+		if (t === 0) return .2126 * n + .7152 * n + .0722 * n;
+		let i = n < .5 ? n * (1 + t) : n + t - n * t, a = 2 * n - i, o = (e) => {
+			let t = e < 0 ? e + 1 : e > 1 ? e - 1 : e;
+			return t < 1 / 6 ? a + (i - a) * 6 * t : t < 1 / 2 ? i : t < 2 / 3 ? a + (i - a) * (2 / 3 - t) * 6 : a;
+		}, s = o(e + 1 / 3), c = o(e), l = o(e - 1 / 3);
+		return .2126 * s + .7152 * c + .0722 * l;
+	}
+	let i = /^#([0-9a-f]{6}|[0-9a-f]{3})$/.exec(t);
+	if (i) {
+		let e = i[1], t = e.length === 3 ? [
+			e[0] + e[0],
+			e[1] + e[1],
+			e[2] + e[2]
+		] : [
+			e.substring(0, 2),
+			e.substring(2, 4),
+			e.substring(4, 6)
+		], n = parseInt(t[0], 16) / 255, r = parseInt(t[1], 16) / 255, a = parseInt(t[2], 16) / 255;
+		return .2126 * n + .7152 * r + .0722 * a;
+	}
+	return -1;
+}
+var _ = r, v = e;
+function y(e) {
+	let t = g(e);
+	return t >= 0 && t > .75;
+}
+function b(e, n, r, i, a) {
+	if (!n && !r) return e;
+	let o = n && i !== void 0 ? t(i, "text") : "", s = r && a !== void 0 ? t(a, "bg") : "", c = [n ? `color: ${o}` : "", m(r, n, s)].filter(Boolean).join("; ");
+	return c ? `<mark style="${c};">${e}</mark>` : e;
+}
+var x = new Set([
+	"H1",
+	"H2",
+	"H3",
+	"H4",
+	"H5",
+	"H6"
+]);
+function S(e) {
+	let t = e.parentElement;
+	return t === null ? !1 : x.has(t.tagName) ? !0 : S(t);
+}
+function C(e, t) {
+	let n = e.getAttribute("style") ?? "", r = /font-weight\s*:\s*(700|bold)/i.test(n) && !S(e), i = /font-style\s*:\s*italic/i.test(n), a = /(?<![a-z-])color\s*:\s*([^;]+)/i.exec(n), o = /background-color\s*:\s*([^;]+)/i.exec(n), s = a?.[1]?.trim(), c = o?.[1]?.trim(), l = t ? s !== void 0 && !h(s) : s !== void 0 && !h(s) && !y(s), u = c !== void 0 && c !== "transparent" && !_(c) && !v(c);
+	if (!r && !i && !l && !u) return null;
+	let d = b(e.innerHTML, l, u, s, c), f = i ? `<i>${d}</i>` : d;
+	return r ? `<b>${f}</b>` : f;
+}
+function w(e, t) {
+	for (let n of Array.from(e.querySelectorAll("span[style]"))) {
+		let e = C(n, t);
+		e !== null && n.replaceWith(document.createRange().createContextualFragment(e));
+	}
+	t && T(e);
+}
+function T(e) {
+	for (let n of Array.from(e.querySelectorAll("a[style]"))) {
+		let e = n.getAttribute("style") ?? "", r = /(?<![a-z-])color\s*:\s*([^;]+)/i.exec(e), i = /background-color\s*:\s*([^;]+)/i.exec(e), a = r?.[1]?.trim(), o = i?.[1]?.trim(), s = a !== void 0 && !h(a) && a !== "inherit", c = o !== void 0 && o !== "transparent" && o !== "inherit";
+		if (!s && !c) continue;
+		let l = s ? t(a, "text") : "", u = c ? t(o, "bg") : "", d = [s ? `color: ${l}` : "", m(c, s, u)].filter(Boolean).join("; "), f = n;
+		f.innerHTML = `<mark style="${d};">${f.innerHTML}</mark>`, f.style.removeProperty("color"), f.style.removeProperty("background-color");
+	}
+}
+function E(e) {
+	for (let t of Array.from(e.querySelectorAll("td, th"))) {
+		let e = t.querySelectorAll("p");
+		if (e.length !== 0) {
+			for (let t of Array.from(e)) {
+				let e = document.createRange().createContextualFragment(t.innerHTML + "<br>");
+				t.replaceWith(e);
+			}
+			t.innerHTML = t.innerHTML.replace(/(<br\s*\/?>|\s)+$/i, "");
+		}
+	}
+}
+//#endregion
+//#region src/cli/commands/convert-gdocs/index.ts
+function D(e) {
+	let t = o(e), r = new DOMParser().parseFromString(t, "text/html").body;
+	i(r), n(r);
+	let s = {
+		version: "0.16.1",
+		blocks: a(r)
+	};
+	return JSON.stringify(s);
+}
+//#endregion
+export { D as convertGdocs };

package/dist/convert-gdocs-K0B32Ft0.mjs

@@ -0,0 +1,165 @@
+import { a as e, i as t, n, o as r, r as i, t as a } from "./block-builder-B_eFe3eS.mjs";
+//#region src/components/modules/paste/google-docs-preprocessor.ts
+function o(e) {
+	let t = document.createElement("div");
+	t.innerHTML = e;
+	let n = p(t);
+	return w(t, n), n && (E(t), f(t)), t.innerHTML;
+}
+function s(e, t) {
+	let n = e.parentElement;
+	return n === null ? null : n === t ? e : s(n, t);
+}
+function c(e, t, n) {
+	let r = e.cloneNode(!1), i = [];
+	for (let n of Array.from(e.childNodes)) {
+		if (n === t) break;
+		i.push(n);
+	}
+	return i.forEach((e) => r.appendChild(e)), n !== null && r.appendChild(n), r.childNodes.length > 0 ? r : null;
+}
+function l(e, t, n) {
+	let r = e.cloneNode(!1), i = Array.from(e.childNodes), a = i.findIndex((e) => e === t), o = i.slice(a + 1);
+	return n !== null && r.appendChild(n), o.forEach((e) => r.appendChild(e)), r.childNodes.length > 0 ? r : null;
+}
+function u(e, t) {
+	let n = (e, r, i) => {
+		if (e === t) return {
+			before: r,
+			after: i
+		};
+		let a = e.parentElement;
+		return a === null ? {
+			before: r,
+			after: i
+		} : n(a, c(a, e, r), l(a, e, i));
+	};
+	return n(e, null, null);
+}
+function d(e, t) {
+	let n = e.parentElement;
+	return n === null || n === t ? !1 : n.tagName === "TABLE" ? !0 : d(n, t);
+}
+function f(e) {
+	let t = Array.from(e.querySelectorAll("img"));
+	for (let n of t) {
+		if (d(n, e)) continue;
+		let t = s(n, e);
+		if (!t) continue;
+		let { before: r, after: i } = u(n, t), a = document.createDocumentFragment();
+		r && a.appendChild(r), a.appendChild(n), i && a.appendChild(i), t.replaceWith(a);
+	}
+}
+function p(e) {
+	let t = e.querySelector("b[id^=\"docs-internal-guid-\"]");
+	if (!t) return !1;
+	let n = document.createDocumentFragment();
+	for (; t.firstChild;) n.appendChild(t.firstChild);
+	return t.replaceWith(n), !0;
+}
+function m(e, t, n) {
+	return e ? `background-color: ${n}` : t ? "background-color: transparent" : "";
+}
+function h(e) {
+	let t = e.replace(/\s/g, "");
+	return t === "rgb(0,0,0)" || t === "#000000";
+}
+function g(e) {
+	let t = e.replace(/\s/g, "").toLowerCase(), n = /^rgba?\((\d+),(\d+),(\d+)(?:,[\d.]+)?\)$/.exec(t);
+	if (n) {
+		let e = parseInt(n[1], 10) / 255, t = parseInt(n[2], 10) / 255, r = parseInt(n[3], 10) / 255;
+		return .2126 * e + .7152 * t + .0722 * r;
+	}
+	let r = /^hsla?\(([\d.]+),([\d.]+)%,([\d.]+)%(?:,[\d.]+)?\)$/.exec(t);
+	if (r) {
+		let e = parseFloat(r[1]) / 360, t = parseFloat(r[2]) / 100, n = parseFloat(r[3]) / 100;
+		if (t === 0) return .2126 * n + .7152 * n + .0722 * n;
+		let i = n < .5 ? n * (1 + t) : n + t - n * t, a = 2 * n - i, o = (e) => {
+			let t = e < 0 ? e + 1 : e > 1 ? e - 1 : e;
+			return t < 1 / 6 ? a + (i - a) * 6 * t : t < 1 / 2 ? i : t < 2 / 3 ? a + (i - a) * (2 / 3 - t) * 6 : a;
+		}, s = o(e + 1 / 3), c = o(e), l = o(e - 1 / 3);
+		return .2126 * s + .7152 * c + .0722 * l;
+	}
+	let i = /^#([0-9a-f]{6}|[0-9a-f]{3})$/.exec(t);
+	if (i) {
+		let e = i[1], t = e.length === 3 ? [
+			e[0] + e[0],
+			e[1] + e[1],
+			e[2] + e[2]
+		] : [
+			e.substring(0, 2),
+			e.substring(2, 4),
+			e.substring(4, 6)
+		], n = parseInt(t[0], 16) / 255, r = parseInt(t[1], 16) / 255, a = parseInt(t[2], 16) / 255;
+		return .2126 * n + .7152 * r + .0722 * a;
+	}
+	return -1;
+}
+var _ = r, v = e;
+function y(e) {
+	let t = g(e);
+	return t >= 0 && t > .75;
+}
+function b(e, n, r, i, a) {
+	if (!n && !r) return e;
+	let o = n && i !== void 0 ? t(i, "text") : "", s = r && a !== void 0 ? t(a, "bg") : "", c = [n ? `color: ${o}` : "", m(r, n, s)].filter(Boolean).join("; ");
+	return c ? `<mark style="${c};">${e}</mark>` : e;
+}
+var x = new Set([
+	"H1",
+	"H2",
+	"H3",
+	"H4",
+	"H5",
+	"H6"
+]);
+function S(e) {
+	let t = e.parentElement;
+	return t === null ? !1 : x.has(t.tagName) ? !0 : S(t);
+}
+function C(e, t) {
+	let n = e.getAttribute("style") ?? "", r = /font-weight\s*:\s*(700|bold)/i.test(n) && !S(e), i = /font-style\s*:\s*italic/i.test(n), a = /(?<![a-z-])color\s*:\s*([^;]+)/i.exec(n), o = /background-color\s*:\s*([^;]+)/i.exec(n), s = a?.[1]?.trim(), c = o?.[1]?.trim(), l = t ? s !== void 0 && !h(s) : s !== void 0 && !h(s) && !y(s), u = c !== void 0 && c !== "transparent" && !_(c) && !v(c);
+	if (!r && !i && !l && !u) return null;
+	let d = b(e.innerHTML, l, u, s, c), f = i ? `<i>${d}</i>` : d;
+	return r ? `<b>${f}</b>` : f;
+}
+function w(e, t) {
+	for (let n of Array.from(e.querySelectorAll("span[style]"))) {
+		let e = C(n, t);
+		e !== null && n.replaceWith(document.createRange().createContextualFragment(e));
+	}
+	t && T(e);
+}
+function T(e) {
+	for (let n of Array.from(e.querySelectorAll("a[style]"))) {
+		let e = n.getAttribute("style") ?? "", r = /(?<![a-z-])color\s*:\s*([^;]+)/i.exec(e), i = /background-color\s*:\s*([^;]+)/i.exec(e), a = r?.[1]?.trim(), o = i?.[1]?.trim(), s = a !== void 0 && !h(a) && a !== "inherit", c = o !== void 0 && o !== "transparent" && o !== "inherit";
+		if (!s && !c) continue;
+		let l = s ? t(a, "text") : "", u = c ? t(o, "bg") : "", d = [s ? `color: ${l}` : "", m(c, s, u)].filter(Boolean).join("; "), f = n;
+		f.innerHTML = `<mark style="${d};">${f.innerHTML}</mark>`, f.style.removeProperty("color"), f.style.removeProperty("background-color");
+	}
+}
+function E(e) {
+	for (let t of Array.from(e.querySelectorAll("td, th"))) {
+		let e = t.querySelectorAll("p");
+		if (e.length !== 0) {
+			for (let t of Array.from(e)) {
+				let e = document.createRange().createContextualFragment(t.innerHTML + "<br>");
+				t.replaceWith(e);
+			}
+			t.innerHTML = t.innerHTML.replace(/(<br\s*\/?>|\s)+$/i, "");
+		}
+	}
+}
+//#endregion
+//#region src/cli/commands/convert-gdocs/index.ts
+function D(e) {
+	let t = o(e), r = new DOMParser().parseFromString(t, "text/html").body;
+	i(r), n(r);
+	let s = {
+		version: "0.16.0",
+		blocks: a(r)
+	};
+	return JSON.stringify(s);
+}
+//#endregion
+export { D as convertGdocs };

package/dist/convert-html-586sEV0_.mjs

@@ -0,0 +1,13 @@
+import { n as e, r as t, t as n } from "./block-builder-B_eFe3eS.mjs";
+//#region src/cli/commands/convert-html/index.ts
+function r(r) {
+	let i = new DOMParser().parseFromString(r, "text/html").body;
+	t(i), e(i);
+	let a = {
+		version: "0.16.0",
+		blocks: n(i)
+	};
+	return JSON.stringify(a);
+}
+//#endregion
+export { r as convertHtml };

package/dist/convert-html-BfUpTbgb.mjs

@@ -0,0 +1,13 @@
+import { n as e, r as t, t as n } from "./block-builder-B_eFe3eS.mjs";
+//#region src/cli/commands/convert-html/index.ts
+function r(r) {
+	let i = new DOMParser().parseFromString(r, "text/html").body;
+	t(i), e(i);
+	let a = {
+		version: "0.16.1",
+		blocks: n(i)
+	};
+	return JSON.stringify(a);
+}
+//#endregion
+export { r as convertHtml };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jackuait/blok-cli",
-  "version": "0.15.1",
+  "version": "0.16.1",
   "description": "CLI tools for Blok — convert HTML to Blok JSON, generate migration guides",
   "bin": {
     "blok-cli": "bin/blok-cli.mjs"