TinyEditor Plugin Enhancements #112
Open
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
- Added shortcodes() method to accept array of shortcodes
- Added getShortcodesJson() method to serialize shortcodes for JS
- Modified getToolbar() to prepend shortcodes button when shortcodes exist
- Modified getExternalPlugins() to include shortcodes plugin
- Added shortcodes.js TinyMCE plugin that reads from global variable
- Updated blade view to pass shortcodes JSON to JS component
- Updated tinymce.js to store shortcodes in window.tinyMceShortcodes
- Added publish rule for shortcodes.js
Usage: TinyEditor::make('body')->shortcodes([
['text' => 'Label', 'value' => 'shortcode_name'],
])
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <[email protected]>
The setup function was causing state corruption by duplicating the state sync logic that's already handled by Alpine.js entangle in tinymce.js. Removed the redundant callback to prevent conflicts. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
Removed trailing comma after the last property in x-data object to prevent JavaScript syntax error. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
…x error The x-init with semicolon-separated statements was causing 'Unexpected token ;' errors in Livewire/Alpine evaluation. Simplified the template by removing the unnecessary wrapper div. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
Changed from {!! $getShortcodesJson() !!} to @js($getShortcodes())
to properly escape double quotes for use within HTML attributes.
The raw JSON was breaking the x-data attribute because double quotes
in the JSON content terminated the attribute prematurely.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <[email protected]>
- Changed shortcodes.js to use editor.getParam() instead of editor.options.get() - This allows reading config values without prior registration - Fixes timing issue where plugin loaded before setup callback ran - Fixed image_class_list warning by conditionally rendering 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
External plugins cannot access TinyMCE init config at load time, so the shortcodes plugin is now registered inline in the setup callback where it has direct access to the shortcodes array and label from the Alpine.js component scope. - Removed external shortcodes.js loading from getExternalPlugins() - Added inline shortcodes plugin registration in tinymce.js setup - Removed unused shortcodes_data and shortcodes_label from init config - Cleaned up debug console.log 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
- Switch default provider from 'cloud' to 'vendor' (local files faster)
- Add 'notification' profile with minimal plugins for faster loading
- Use content_style for shortcodes CSS instead of JS injection
- Removed editor.on('init') CSS injection callback
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <[email protected]>
- Updated BeforeSetContent regex to match {code} and {{ code }} formats
- Removed notification profile from default config (project-specific)
- Keep plugin config generic for reusability
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <[email protected]>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Added ->shortcodes([...]) method to define shortcode array
Added ->shortcodesLabel('Label') for toolbar button text
Shortcodes appear as visual tags (purple gradient badges)
Converts {code} or {{ code }} → visual tag → {{ code }} on save
Shortcodes plugin registered inline in setup callback (not external file)
Fixes timing issue where external plugins can't access TinyMCE init config
Changed default provider to vendor (local files instead of CDN)
CSS injection via content_style instead of JS DOM manipulation
Regex matches both single {code} and double {{ code }} braces
Backwards compatible with existing templates
Profiles remain generic (default, simple, minimal, full)
Project-specific profiles should go in published config
Usage: