Skip to content

Support newer symfony #2

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Yippy wants to merge 28 commits into
base: master
Choose a base branch
from
Open

Support newer symfony #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
28 commits
Select commit Hold shift + click to select a range
12a5244
Amend composer for Symfony 6 and 7, with PHP 8.1+
Yippy Dec 2, 2025
2a38a60
Fix type for twig template filename
Yippy Dec 3, 2025
baf887a
Fix command for Symfony 7
Yippy Dec 3, 2025
671f5ea
Redo asset loader
Yippy Dec 3, 2025
a2159d7
Allow users to assign their own bundle repository using assetReposito…
Yippy Dec 3, 2025
a0a1445
Fix detection for existing TUI Editor in new asset folder structure
Yippy Dec 3, 2025
88bc23b
Add missing options argument
Yippy Dec 4, 2025
c51e761
Fix incorrect path for toastui-editor-plugin-color-syntax
Yippy Dec 4, 2025
8143844
Keep plugin/extension name the same, for editor/viewer parameter
Yippy Dec 4, 2025
39c3ff7
Use generated bundle, remove dependencies
Yippy Dec 5, 2025
102beb5
Display Editor and Viewer with essential plugins
Yippy Dec 6, 2025
03d3769
Fixed missing colour picker CSS
Yippy Dec 8, 2025
354e1f5
Only copy public contents into folder
Yippy Dec 8, 2025
0cba6a5
Fix new public assets folder structure with /css and /js
Yippy Dec 9, 2025
aede97c
Fix function name change for v3
Yippy Dec 9, 2025
51b9db9
Add theme option
Yippy Dec 9, 2025
abc8dc9
Fix config detection
Yippy Dec 9, 2025
ccbe4ea
Provide better support for plugin options, amended the README to disp…
Yippy Dec 9, 2025
8711413
Update README, colorSyntax custom option for preset must be required,…
Yippy Dec 9, 2025
44fddc5
Implement editor_options and viewer_options for configuration
Yippy Dec 10, 2025
9e271f7
Overhaul js and css path loader, use array in Configuration
Yippy Dec 11, 2025
9b390ef
Allow support for backwards compatibility for PHP 7 and 8, and Symfon…
Yippy Dec 11, 2025
a27c832
Provide empty Array for expected Array type
Yippy Dec 11, 2025
ce760f0
Support up to Symfony 6
Yippy Dec 11, 2025
1077d3d
Support Symfony 7
Yippy Dec 11, 2025
28c0796
Remove unnecessary functions
Yippy Dec 12, 2025
78d05ec
Support Symfony <6
Yippy Dec 12, 2025
edcc89e
Fix on change edit
Yippy Dec 15, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
175 changes: 145 additions & 30 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -79,29 +79,152 @@ You can add a config file in `config/packages` folder.（Just a simple config, B
```yaml
#config/packages/teebb_tuieditor.yaml
teebb_tui_editor:
#enable: true # Whether to enable tui.editor.
#jquery: true # Whether to enable jquery in dependencies.
#jquery_path: ~ # Custom jquery path.
#editor_js_path: ~ # Custom tui.editor js path.
# ... # more config options, you can see: bin/console debug:config teebb_tui_editor

default_config: basic_config
#enable: true # Whether to enable tui.editor.
#jquery:
#enable: false # Whether to enable jquery.
#js_paths: # Custom jquery path.
#- /bundles/teebbtuieditor/tui.editor-bundles/js/jquery.min.js
#asset_repository: 'teebbstudios/tui.editor-bundles' # Public assets installer repository
# ... # more config options, you can see: bin/console debug:config teebb_tui_editor

#editor:
#js_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/js/toast-ui-editor-bundle.js
#css_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/css/toastui-editor.css
#options:
#height: 'auto' # Editor's height style value. Height is applied as border-box ex) '300px', '100%', 'auto'
#initial_edit_type: 'wysiwyg' # Initial editor type (markdown, wysiwyg)
#preview_style: 'vertical' # Markdown editor's preview style (tab, vertical)
#theme: 'dark' # override editor color scheme with dark theme
#toolbar_items:
#- ['heading', 'bold', 'italic', 'strike']
#- ['hr', 'quote']
#- ['ul', 'ol', 'task', 'indent', 'outdent']
#- ['table', 'image', 'link']
#- ['code', 'codeblock']
#viewer:
#js_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/js/toast-ui-viewer-bundle.js
#css_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/css/toastui-editor-viewer.css
#options:
#height: 'auto' # Viewer's height style value. Height is applied as border-box ex) '300px', '100%', 'auto'
#extensions: # extensions must defined as array of plugin_name variable or [plugin_name, [plugin_options]]
#chart: # chart custom options
#js_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/js/toast-ui-chart-bundle.js
#css_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/css/toastui-chart.min.css
#options:
#width: 'auto' # number|string 'auto' Default width value
#height: 'auto' # number|string 'auto' Default height value
#minWidth: 0 # number 0 Minimum width value
#maxWidth: 0 # number 0 Minimum height value
#minHeight: Infinity # number Infinity Maximum width value
#maxHeight: Infinity # number Infinity Maximum height value
#codeSyntaxHighlight:
#js_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/js/toast-ui-code-syntax-highlight-bundle.js
#css_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/css/toastui-editor-plugin-code-syntax-highlight.css
#colorSyntax: # colorSyntax custom options
#js_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/js/toast-ui-color-syntax-bundle.js
#css_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/css/toastui-editor-plugin-color-syntax.css
#- /bundles/teebbtuieditor/tui.editor-bundles/css/tui-color-picker.css
#options:
#preset: ['#181818', '#292929'] # [required] preset Array.<string> Preset for color palette
#tableMergedCell:
#js_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/js/toast-ui-table-merged-cell-bundle.js
#css_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/css/toastui-editor-plugin-table-merged-cell.css
#uml: # uml custom options
#js_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/js/toast-ui-uml-bundle.js
#options:
#rendererURL: ~ # [required]string 'http://www.plantuml.com/plantuml/png/' URL of plant uml renderer
#dependencies: # You may add any dependancy that you need here
#editor_dark_theme:
#css_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/css/toastui-editor-dark.css

default_config: basic_config
configs:
basic_config:
to_html: false # Save to database use html syntax?
#previewStyle: 'vertical' # Markdown editor's preview style (tab, vertical)
#height: '400px' # Editor's height style value. Height is applied as border-box ex) '300px', '100%', 'auto'
#initialEditType: 'markdown' # Initial editor type (markdown, wysiwyg)
exts: # exts must defined as array
- scrollSync
- colorSyntax
- uml
- chart
- mark
- table
to_html: false # Save to database use html syntax?
#editor:
#js_paths:
- /bundles/teebbtuieditor/tui.editor-bundles/js/toast-ui-editor-bundle.js
#css_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/css/toastui-editor.css
#options:
#height: 'auto' # Editor's height style value. Height is applied as border-box ex) '300px', '100%', 'auto'
#initial_edit_type: 'wysiwyg' # Initial editor type (markdown, wysiwyg)
#preview_style: 'vertical' # Markdown editor's preview style (tab, vertical)
#theme: 'dark' # override editor color scheme with dark theme
#toolbar_items:
#- ['heading', 'bold', 'italic', 'strike']
#- ['hr', 'quote']
#- ['ul', 'ol', 'task', 'indent', 'outdent']
#- ['table', 'image', 'link']
#- ['code', 'codeblock']
#viewer:
#js_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/js/toast-ui-viewer-bundle.js
#css_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/css/toastui-editor-viewer.css
#options:
#height: 'auto' # Viewer's height style value. Height is applied as border-box ex) '300px', '100%', 'auto'
extensions: # extensions must defined as array of plugin_name variable or [plugin_name, [plugin_options]]
chart: # chart custom options
#js_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/js/toast-ui-chart-bundle.js
#css_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/css/toastui-chart.min.css
#options:
#width: 'auto' # number|string 'auto' Default width value
#height: 'auto' # number|string 'auto' Default height value
#minWidth: 0 # number 0 Minimum width value
#maxWidth: 0 # number 0 Minimum height value
#minHeight: Infinity # number Infinity Maximum width value
#maxHeight: Infinity # number Infinity Maximum height value
codeSyntaxHighlight:
#js_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/js/toast-ui-code-syntax-highlight-bundle.js
#css_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/css/toastui-editor-plugin-code-syntax-highlight.css
colorSyntax: # colorSyntax custom options
#js_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/js/toast-ui-color-syntax-bundle.js
#css_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/css/toastui-editor-plugin-color-syntax.css
#- /bundles/teebbtuieditor/tui.editor-bundles/css/tui-color-picker.css
#options:
#preset: ['#181818', '#292929'] # [required] preset Array.<string> Preset for color palette
tableMergedCell:
#js_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/js/toast-ui-table-merged-cell-bundle.js
#css_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/css/toastui-editor-plugin-table-merged-cell.css
uml: # uml custom options
#js_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/js/toast-ui-uml-bundle.js
#options:
#rendererURL: ~ # [required]string 'http://www.plantuml.com/plantuml/png/' URL of plant uml renderer
#dependencies: # You may add any dependancy that you need here
#editor_dark_theme: # Must include if using 'dark' theme
#css_paths:
#- /bundles/teebbtuieditor/tui.editor-bundles/css/toastui-editor-dark.css


```

> [!CAUTION]
> asset_repository config is the GitHub repository that will be used for the `php bin/console tuieditor:install` command, the script will look for the latest release and download all files into the TeebbTuiEditorBundle `src/Resources/public` folder. Use only trusted repository for this bundle.

You can config tui.editor language.
```yaml
#config/services.yaml
Expand All @@ -111,33 +234,25 @@ parameters:

```


### Step 5: Use the Bundle

Add the tui.editor dependencies in your page top. For example:

```twig
{{ tuieditor_dependencies() }}
```

This will add the tui.editor dependencies JS and CSS libs like:

```html

<script src="/bundles/teebbtuieditor/tui.editor-bundles/lib/jquery/dist/jquery.min.js"></script>
<script src="/bundles/teebbtuieditor/tui.editor-bundles/lib/markdown-it/dist/markdown-it.min.js"></script>
<script src="/bundles/teebbtuieditor/tui.editor-bundles/lib/tui-code-snippet/dist/tui-code-snippet.min.js"></script>
<script src="/bundles/teebbtuieditor/tui.editor-bundles/lib/codemirror/lib/codemirror.js"></script>
<script src="/bundles/teebbtuieditor/tui.editor-bundles/lib/highlight/highlight.pack.js"></script>
<script src="/bundles/teebbtuieditor/tui.editor-bundles/lib/squire-rte/build/squire-raw.js"></script>
<script src="/bundles/teebbtuieditor/tui.editor-bundles/lib/to-mark/dist/to-mark.min.js"></script>
<link rel="stylesheet" href="/bundles/teebbtuieditor/tui.editor-bundles/lib/codemirror/lib/codemirror.css">
<link rel="stylesheet" href="/bundles/teebbtuieditor/tui.editor-bundles/lib/highlight/styles/github.css">

<link rel="stylesheet" href="/bundles/teebbtuieditor/tui.editor-bundles/css/toastui-editor-dark.css">
```

Second, use the `TuiEditorType` in your form field:

```php
use Teebb\TuiEditorBundle\Form\Type\TuiEditorType;

class ArticleType extends AbstractType
{
public function buildForm(FormBuilderInterface $builder, array $options)
Expand Down
Loading