{"id":50688318,"url":"https://github.com/artisanpack-ui/visual-editor","last_synced_at":"2026-06-09T01:00:54.581Z","repository":{"id":335959803,"uuid":"1147553893","full_name":"ArtisanPack-UI/visual-editor","owner":"ArtisanPack-UI","description":"Empower your users with a modern, intuitive visual editor. This package provides a complete block-based editing experience, allowing for the creation of dynamic, beautiful content. Visual editors are becoming a crucial part of any content management system, enabling website owners to see how the page looks as they are creating it.","archived":false,"fork":false,"pushed_at":"2026-06-08T23:07:07.000Z","size":5530,"stargazers_count":0,"open_issues_count":22,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-06-08T23:07:51.442Z","etag":null,"topics":["block-editor","laravel","laravel-package","livewire","page-builder","php","visual-editor","wysiwyg"],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ArtisanPack-UI.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-02-01T23:11:21.000Z","updated_at":"2026-06-08T23:05:09.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/ArtisanPack-UI/visual-editor","commit_stats":null,"previous_names":["artisanpack-ui/visual-editor"],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/ArtisanPack-UI/visual-editor","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ArtisanPack-UI%2Fvisual-editor","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ArtisanPack-UI%2Fvisual-editor/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ArtisanPack-UI%2Fvisual-editor/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ArtisanPack-UI%2Fvisual-editor/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ArtisanPack-UI","download_url":"https://codeload.github.com/ArtisanPack-UI/visual-editor/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ArtisanPack-UI%2Fvisual-editor/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34086664,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-08T02:00:07.615Z","response_time":111,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["block-editor","laravel","laravel-package","livewire","page-builder","php","visual-editor","wysiwyg"],"created_at":"2026-06-09T01:00:33.708Z","updated_at":"2026-06-09T01:00:54.571Z","avatar_url":"https://github.com/ArtisanPack-UI.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ArtisanPack UI Visual Editor\n\nA Gutenberg-powered visual editor for Laravel applications. Brings the\nWordPress block editor to any Eloquent model, plus a full site editor\nfor templates, template parts, global styles, navigation menus, and\npatterns.\n\nV1.0 ships:\n\n- **Post editor** — block-based content editing on any model that opts\n  in via the `HasBlockContent` trait.\n- **Site editor** — templates, template parts, theme.json-backed global\n  styles, navigation menus, and patterns; mounted at `/visual-editor/site`.\n- **42 forked core blocks** under the `artisanpack/*` namespace.\n  `core/*` markup pasted from upstream auto-converts on insert.\n- **Three renderer packages** — Blade (server-side), React, and Vue —\n  for rendering saved block content on the public site.\n- **First-class pairing** with [`artisanpack-ui/cms-framework`](https://github.com/ArtisanPack-UI/cms-framework)\n  for Posts, Pages, site-meta, navigation, and global-styles persistence.\n  Both packages remain usable standalone.\n\nFull documentation: see [`docs/`](docs/). Start with [Quick Start](docs/Quick-Start.md), or browse the [documentation home](docs/home.md) for the full surface.\n\n---\n\n## Installation\n\n```bash\ncomposer require artisanpack-ui/visual-editor\nphp artisan migrate\n```\n\nFor the site editor (recommended for most apps):\n\n```bash\ncomposer require artisanpack-ui/cms-framework\nphp artisan migrate\n```\n\nSee the [Installation Guide](docs/Installation-Guide.md) and [Quick Start](docs/Quick-Start.md) for the full setup.\n\n---\n\n## Version compatibility\n\nThe visual-editor and `artisanpack-ui/cms-framework` packages ship as a\nversion pair — both packages need to be present, and both need to be on\na compatible major version, for the site-editor integration to work.\nInstall one without the other and the site-editor's install gate (#432)\nsurfaces a \"cms-framework required\" page instead of mounting.\n\n| visual-editor | cms-framework | Notes                                          |\n| ------------- | ------------- | ---------------------------------------------- |\n| v1.x          | v1.x          | Site-editor integration (this release)         |\n| v0.x          | v0.x          | Pre-v1 — no site-editor integration            |\n\nBumping the major on either package without bumping the partner is\nunsupported.\n\n---\n\n## Peer dependencies\n\nThe editor UI is built on [`@artisanpack-ui/react`](https://www.npmjs.com/package/@artisanpack-ui/react),\nwhich is styled with DaisyUI and Tailwind CSS. Host applications\nembedding the editor must have the following installed and loaded:\n\n- `tailwindcss` `^4.0.0`\n- `daisyui` `^5.0.0`\n\n---\n\n## Usage\n\nAdd the `HasBlockContent` trait to any model and register it in\n`config/artisanpack/visual-editor.php`:\n\n```php\nuse ArtisanPackUI\\VisualEditor\\Concerns\\HasBlockContent;\n\nclass Post extends Model\n{\n    use HasBlockContent;\n}\n```\n\n```php\n// config/artisanpack/visual-editor.php\nreturn [\n    'resources' =\u003e [\n        'posts' =\u003e App\\Models\\Post::class,\n    ],\n];\n```\n\nMount the editor in a Blade view:\n\n```blade\n\u003cx-visual-editor :model=\"$post\" /\u003e\n```\n\nThe site editor mounts automatically at `/visual-editor/site` when\ncms-framework is installed and the configured `SiteEditorAccessGate`\npermits the request.\n\nSee [`docs/post-editor/Blade-Component.md`](docs/post-editor/Blade-Component.md) for the full\ncomponent reference and [`docs/site-editor.md`](docs/site-editor.md) for\nthe site-editor surface.\n\n---\n\n## Documentation\n\n📚 **[Complete Documentation](docs/home.md)**\n\n### Getting Started\n\n- **[Installation Guide](docs/Installation-Guide.md)** — Setup and configuration\n- **[Quick Start](docs/Quick-Start.md)** — Ship your first post in under an hour\n- **[Configuration](docs/Configuration.md)** — Full configuration reference\n\n### Core Concepts\n\n| Topic | Doc |\n|-------|-----|\n| `HasBlockContent` + resource map | [`docs/content-model.md`](docs/content-model.md) |\n| Blade / React / Vue renderers | [`docs/renderers.md`](docs/renderers.md) |\n| Filters, actions, browser events | [`docs/Hooks-and-Events.md`](docs/Hooks-and-Events.md) |\n| Migration \u0026 WP import | [`docs/migration.md`](docs/migration.md) |\n| Common problems | [`docs/troubleshooting.md`](docs/troubleshooting.md) |\n\n### Post Editor\n\n| Topic | Doc |\n|-------|-----|\n| Surface tour | [`docs/post-editor.md`](docs/post-editor.md) |\n| Quick start | [`docs/post-editor/Getting-Started.md`](docs/post-editor/Getting-Started.md) |\n| `\u003cx-visual-editor /\u003e` reference | [`docs/post-editor/Blade-Component.md`](docs/post-editor/Blade-Component.md) |\n| Embedding in Livewire | [`docs/post-editor/Livewire-Integration.md`](docs/post-editor/Livewire-Integration.md) |\n| Embedding in Inertia (React/Vue) | [`docs/post-editor/Inertia-Integration.md`](docs/post-editor/Inertia-Integration.md) |\n| Theming editor chrome | [`docs/post-editor/Theming.md`](docs/post-editor/Theming.md) |\n\n### Site Editor\n\n| Topic | Doc |\n|-------|-----|\n| Surface tour | [`docs/site-editor.md`](docs/site-editor.md) |\n| Quick start | [`docs/site-editor/Getting-Started.md`](docs/site-editor/Getting-Started.md) |\n| `SiteEditorAccessGate` contract | [`docs/site-editor/Access-Gate.md`](docs/site-editor/Access-Gate.md) |\n| Template hierarchy + parts | [`docs/site-editor/Templates.md`](docs/site-editor/Templates.md) |\n| theme.json-backed global styles | [`docs/site-editor/Global-Styles.md`](docs/site-editor/Global-Styles.md) |\n| Menus, locations, fallbacks | [`docs/site-editor/Navigation.md`](docs/site-editor/Navigation.md) |\n| Synced vs unsynced patterns | [`docs/site-editor/Patterns.md`](docs/site-editor/Patterns.md) |\n\n### Blocks\n\n| Topic | Doc |\n|-------|-----|\n| Block library overview | [`docs/blocks.md`](docs/blocks.md) |\n| Authoring custom blocks | [`docs/blocks/Custom-Blocks.md`](docs/blocks/Custom-Blocks.md) |\n| Per-breakpoint values | [`docs/blocks/Responsive-Design-Tools.md`](docs/blocks/Responsive-Design-Tools.md) |\n| Per-state overrides | [`docs/blocks/State-Design-Tools.md`](docs/blocks/State-Design-Tools.md) |\n\n### Developer Resources\n\n- **[Developer Guide](docs/Developer-Guide.md)** — Extending the editor\n- **[Hooks and Events](docs/Hooks-and-Events.md)** — Filters, actions, and browser events\n\n---\n\n## Gutenberg adoption — transient shims\n\nThe V1 editor adopts the upstream `@wordpress/*` packages. Some of those\npackages expect a WordPress backend that this package doesn't provide,\nso we ship temporary shims under `resources/js/visual-editor/vendor/`:\n\n- **`core-data-shim.ts`** — aliased in `vite.config.ts` as\n  `@wordpress/core-data`. Provides the entity registrations and\n  selectors Gutenberg expects (`getEntityRecord`, `getEntityRecords`,\n  resolvers, permissions stubs). Templates, template parts, navigation,\n  patterns, global styles, attachments, and site-meta are wired through\n  to the package's REST surface.\n- **`media-upload-stub.tsx`** — registers `editor.MediaUpload` via\n  `@wordpress/hooks` so the media-library picker on `core/image` is\n  routed through a stub or the real\n  `registerArtisanpackMediaBridge(MediaModal, uploadMedia)` bridge.\n\nBoth shims will be replaced over the V1.x release line as the cms-framework\nside surfaces real backings. Every selector or filter implemented here is\none to re-verify against Gutenberg upgrades. See\n[`docs/troubleshooting.md`](docs/troubleshooting.md#2-core-data-shim-entities-and-missing-data).\n\n---\n\n## Block defaults\n\nV1 ships a frozen allow-list of forked blocks under the `artisanpack/*`\nnamespace. The defaults in `config/artisanpack/visual-editor.php` expose every block\nthat landed during the Phase I block fork — `@wordpress/block-library`'s\n`registerCoreBlocks()` is no longer called, and the editor registers\nonly the in-package forks discovered under\n`resources/js/visual-editor/blocks/`. See [`docs/blocks.md`](docs/blocks.md)\nfor the full block library overview and the `core/*` → `artisanpack/*`\nmapping.\n\nThe forked allow-list covers the content, media, layout, widget, entity,\nloop/feed, comments, query/pagination, and authentication clusters.\nEntity blocks (`artisanpack/post-*`, `artisanpack/site-*`,\n`artisanpack/template-part`, `artisanpack/navigation`) and the loop /\nfeed cluster (`artisanpack/query`, `artisanpack/post-template`,\n`artisanpack/archives`, `artisanpack/categories`,\n`artisanpack/tag-cloud`) need an entity in scope to render meaningful\ncontent — pair the editor with\n[`artisanpack-ui/cms-framework`](https://github.com/ArtisanPack-UI/cms-framework)\nand they resolve against Posts / Pages / templates / site settings\nend-to-end. Standalone, they fall back to empty shells rather than\ncrashing.\n\n`disabled_blocks` is empty by default: with the I7 cutover (#415) the\neditor no longer registers any `core/*` block, so there's nothing to\ndeny-list. New `@wordpress/block-library` releases similarly bring no\nnew registrations into this package — additions land only when a fork\nis added to the in-package blocks directory and to the allow-list.\n`from:core/*` transforms ship on each fork so existing `core/*` markup\npasted from upstream converts on insert.\n\nOverride the defaults by publishing the config to\n`config/artisanpack/visual-editor.php` and editing the `enabled_blocks`\n/ `disabled_blocks` arrays. The deny-list always wins over the allow-list.\n\n---\n\n## Using with cms-framework\n\nThe visual editor is fully usable standalone, but pairs with\n[`artisanpack-ui/cms-framework`](https://github.com/ArtisanPack-UI/cms-framework)\nto unlock:\n\n- Editable `Post` and `Page` content out of the box.\n- A real backing for `core/site-*` blocks (site title, tagline, logo, icon).\n- Working `core/post-*`, `core/query`, taxonomy widget, and navigation\n  blocks.\n- Templates, template parts, patterns, global styles, and menus\n  persisted via cms-framework's models.\n- Seeded `visual_editor.*` permissions.\n\n```bash\ncomposer require artisanpack-ui/visual-editor artisanpack-ui/cms-framework\nphp artisan migrate\n```\n\nBoth packages are loosely coupled — cms-framework's editor wiring is\nguarded by `class_exists(\\ArtisanPackUI\\VisualEditor\\VisualEditor::class)`,\nso each remains usable on its own. See\n[`docs/site-editor/Getting-Started.md`](docs/site-editor/Getting-Started.md)\nfor the site-editor pairing walkthrough.\n\n---\n\n## Extensibility\n\n### `ap.visual-editor.resources`\n\nRegister slug → Eloquent model class mappings used by\n`/visual-editor/api/{resource}/{id}/content`. Filter contributions are\nmerged with `config('artisanpack.visual-editor.resources')`; the static\nconfig wins on key collision so host-app overrides always take\nprecedence. Models must use\n`ArtisanPackUI\\VisualEditor\\Concerns\\HasBlockContent` — invalid entries\nsurface as `InvalidArgumentException` on first request rather than at\nboot, so a contributor's standalone install never trips host boot.\n\n```php\naddFilter('ap.visual-editor.resources', function (array $resources): array {\n    return array_merge([\n        'posts' =\u003e App\\Models\\Post::class,\n    ], $resources);\n});\n```\n\nFull contract: [`docs/content-model.md`](docs/content-model.md#2-the-resource-map) and\n[`docs/Hooks-and-Events.md`](docs/Hooks-and-Events.md#ap-visual-editor-resources).\n\n### `ap.icons.register-icon-sets`\n\nEditor chrome icons resolve through `artisanpack-ui/icons`. Register\nadditional icon sets in a service provider — see the\n[`artisanpack-ui/icons`](https://github.com/ArtisanPack-UI/icons) docs.\n\n---\n\n## i18n\n\nEditor strings use `@wordpress/i18n` with the `artisanpack-visual-editor`\ntext domain. The domain is initialized via `bootI18n()` in\n`resources/js/visual-editor/vendor/i18n.ts`.\n\nRegenerate the placeholder `.pot` catalog with:\n\n```bash\nnpm run i18n:extract\n```\n\nThe extractor scans `resources/js/visual-editor/**/*.{ts,tsx}` for\n`__/_x/_n/_nx` calls bound to the text domain and writes\n`languages/artisanpack-visual-editor.pot`.\n\n---\n\n## Contributing\n\nAs an open source project, this package is open to contributions from\nanyone. Please [read through the contributing\nguidelines](CONTRIBUTING.md) to learn more about how you can contribute\nto this project.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fartisanpack-ui%2Fvisual-editor","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fartisanpack-ui%2Fvisual-editor","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fartisanpack-ui%2Fvisual-editor/lists"}