Hi Ryan. Can we use mentions feature? I have tried following code for con

Jeyhun · February 17, 2022, 1:27pm

Hi Ryan.

Can we use mentions feature?

I have tried following code for config, but editor becomes unresponsive

Config config = new Config();
config.addExtraPlugin(Plugins.Mention)
config.mention = List.of("""
	{
		marker: '@',
		feed: [ '@Barney', '@Lily', '@Marshall', '@Robin', '@Ted' ]

,
minimumCharacters: 1
}“”")

Error from console

a@webpack-internal:///../node_modules/@vaadin/flow-frontend/ckeditor.js:6:196989
init@webpack-internal:///../node_modules/@vaadin/flow-frontend/ckeditor.js:6:949897
promise callback*m/<@webpack-internal:///../node_modules/@vaadin/flow-frontend/ckeditor.js:6:229312
m@webpack-internal:///../node_modules/@vaadin/flow-frontend/ckeditor.js:6:229263
init@webpack-internal:///../node_modules/@vaadin/flow-frontend/ckeditor.js:6:228457
initPlugins@webpack-internal:///../node_modules/@vaadin/flow-frontend/ckeditor.js:6:484625
create/<@webpack-internal:///../node_modules/@vaadin/flow-frontend/ckeditor.js:6:603327
create@webpack-internal:///../node_modules/@vaadin/flow-frontend/ckeditor.js:6:603200
createEditor@webpack-internal:///../node_modules/@vaadin/flow-frontend/vaadin-ckeditor.js:165:47
firstUpdated@webpack-internal:///../node_modules/@vaadin/flow-frontend/vaadin-ckeditor.js:116:14
performUpdate@webpack-internal:///../node_modules/lit-element/lib/updating-element.js:576:22
_enqueueUpdate@webpack-internal:///../node_modules/lit-element/lib/updating-element.js:512:29
async*requestUpdateInternal@webpack-internal:///../node_modules/lit-element/lib/updating-element.js:478:40
initialize@webpack-internal:///../node_modules/lit-element/lib/updating-element.js:330:14
initialize@webpack-internal:///../node_modules/lit-element/lit-element.js:199:15
UpdatingElement@webpack-internal:///../node_modules/lit-element/lib/updating-element.js:94:14
LitElement@webpack-internal:///../node_modules/lit-element/lit-element.js:131:1
VaadinCKEditor@webpack-internal:///../node_modules/@vaadin/flow-frontend/vaadin-ckeditor.js:13:9
mD@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:432:27
Nw@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:807:124
zx@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1040:27132
Tv@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:754:51
Ew@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:939:177
Dw@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1034:513
wx@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1040:27091
Rv@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:824:133
Tv@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:754:100
Ew@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:939:177
Dw@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1034:513
wx@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1040:27091
Rv@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:824:133
Tv@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:754:100
Ew@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:939:177
Dw@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1034:513
wx@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1040:27091
Rv@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:824:133
Tv@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:754:100
Ew@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:939:177
Dw@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1034:513
wx@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1040:27091
Rv@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:824:133
Tv@http://localhost:8080/VAADIN/static/client/client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:754:100
vaadin-ckeditor.js:222
    createEditor vaadin-ckeditor.js:222
    (Asenkron: promise callback)
    createEditor vaadin-ckeditor.js:221
    firstUpdated vaadin-ckeditor.js:111
    performUpdate updating-element.js:572
    _enqueueUpdate updating-element.js:508
    requestUpdateInternal updating-element.js:474
    initialize updating-element.js:326
    initialize lit-element.js:150
    UpdatingElement updating-element.js:90
    LitElement lit-element.js:82
    VaadinCKEditor vaadin-ckeditor.js:8
    mD client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:432
    Nw client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:807
    zx client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1040
    Tv client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:754
    Ew client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:939
    Dw client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1034
    wx client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1040
    Rv client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:824
    Tv client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:754
    Ew client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:939
    Dw client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1034
    wx client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1040
    Rv client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:824
    Tv client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:754
    Ew client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:939
    Dw client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1034
    wx client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1040
    Rv client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:824
    Tv client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:754
    Ew client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:939
    Dw client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1034
    wx client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:1040
    Rv client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:824
    Tv client-DD1A4890E3DDAB10E37B970AF1C3D2AF.cache.js:754

Thanks

Ryan100 · February 17, 2022, 8:07pm

It’s not working as expected. I will fix it in next release.
Cheers,Ryan

Ryan100 · February 19, 2022, 11:28am

New version released to fix this issue.

MentionFeed mentionFeed = new MentionFeed();
List<MentionFeed> mentionFeeds = new ArrayList<>();
List<MentionFeedItem> mentionFeedItems = new ArrayList<>();
MentionFeedItem mentionFeedItem = new MentionFeedItem();
mentionFeedItem.setId("@Ryan");
mentionFeedItem.setText("@Ryan Pang");
mentionFeedItems.add(mentionFeedItem);
mentionFeedItem = new MentionFeedItem();
mentionFeedItem.setId("@Bar");
mentionFeedItem.setText("@Barney");
mentionFeedItems.add(mentionFeedItem);
mentionFeedItem = new MentionFeedItem();
mentionFeedItem.setId("@Marry");
mentionFeedItem.setText("@Marry Ann");
mentionFeedItems.add(mentionFeedItem);
mentionFeedItem = new MentionFeedItem();
mentionFeedItem.setId("@Ted");
mentionFeedItem.setText("@Ted");
mentionFeedItems.add(mentionFeedItem);
mentionFeed.setFeed(mentionFeedItems);
mentionFeed.setMarker("@");
MentionConfig mentionConfig = new MentionConfig();
mentionConfig.setDropdownLimit(4);
mentionFeeds.add(mentionFeed);
mentionConfig.setFeeds(mentionFeeds);
config.setMention(mentionConfig);

Jeyhun · February 19, 2022, 9:39pm

You are awesome Ryan, thanks.