@ckeditor/ckeditor5-mention 41.3.0-alpha.3 → 41.3.0

Sign up to get free protection for your applications and to get access to all the features.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ckeditor/ckeditor5-mention",
3
- "version": "41.3.0-alpha.3",
3
+ "version": "41.3.0",
4
4
  "description": "Mention feature for CKEditor 5.",
5
5
  "keywords": [
6
6
  "ckeditor",
@@ -13,7 +13,7 @@
13
13
  "type": "module",
14
14
  "main": "src/index.js",
15
15
  "dependencies": {
16
- "ckeditor5": "41.3.0-alpha.3",
16
+ "ckeditor5": "41.3.0",
17
17
  "lodash-es": "4.17.21"
18
18
  },
19
19
  "author": "CKSource (http://cksource.com/)",
@@ -26,7 +26,6 @@
26
26
  "directory": "packages/ckeditor5-mention"
27
27
  },
28
28
  "files": [
29
- "dist",
30
29
  "lang",
31
30
  "src/**/*.js",
32
31
  "src/**/*.d.ts",
@@ -1,4 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
@@ -1,17 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
5
- :root {
6
- --ck-mention-list-max-height: 300px;
7
- }
8
- .ck.ck-mentions {
9
- max-height: var(--ck-mention-list-max-height);
10
- overflow-y: auto;
11
- overflow-x: hidden;
12
- overscroll-behavior: contain;
13
- }
14
- .ck.ck-mentions > .ck-list__item {
15
- overflow: hidden;
16
- flex-shrink: 0;
17
- }
package/dist/index.css DELETED
@@ -1,34 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
5
- /*
6
- * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
7
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
8
- */
9
-
10
- :root {
11
- --ck-mention-list-max-height: 300px;
12
- }
13
-
14
- .ck.ck-mentions {
15
- max-height: var(--ck-mention-list-max-height);
16
-
17
- overflow-y: auto;
18
-
19
- /* Prevent unnecessary horizontal scrollbar in Safari
20
- https://github.com/ckeditor/ckeditor5-mention/issues/41 */
21
- overflow-x: hidden;
22
-
23
- overscroll-behavior: contain;
24
-
25
- /* Prevent unnecessary vertical scrollbar in Safari
26
- https://github.com/ckeditor/ckeditor5-mention/issues/41 */
27
- }
28
-
29
- .ck.ck-mentions > .ck-list__item {
30
- overflow: hidden;
31
- flex-shrink: 0;
32
- }
33
-
34
- /*# sourceMappingURL=index.css.map */
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../theme/mentionui.css","index.css"],"names":[],"mappings":";;;;AAAA,CAAA,CAAA;ACCA,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC,QAAQ,CAAC;AAC5E,CAAC,CAAC,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,OAAO;AACnF,CAAC,CDAC,CAAA;ACCF;ADCA,CAAA,IAAA,CAAA,CAAA;ACCA,CDAC,CAAA,CAAA,EAAA,CAAA,OAAA,CAAA,IAAA,CAAA,GAAA,CAAA,MAAA,CAAA,CAAA,KAAmC,CAAA;AACpC,CAAA;ACCA;ADCA,CAAA,EAAA,CAAA,EAAA,CAAA,QAAA,CAAA,CAAA;ACCA,CDAC,GAAA,CAAA,MAAA,CAAA,CAAA,GAAA,CAAA,CAAA,CAAA,EAAA,CAAA,OAAA,CAAA,IAAA,CAAA,GAAA,CAAA,MAAA,CAA6C,CAAA;ACC9C;AACA,CDAC,QAAA,CAAA,CAAA,CAAA,CAAA,IAAgB,CAAA;ACCjB;AACA,CDAC,CAAA,CAAA,CAAA,OAAA,CAAA,WAAA,CAAA,UAAA,CAAA,SAAA,CAAA,EAAA,CAAA,MAAA;ACCD,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,QAAQ,CAAC,SAAS,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC,CDAC,CAAA;ACC1D,CDAC,QAAA,CAAA,CAAA,CAAA,CAAA,MAAkB,CAAA;ACCnB;AACA,CDAC,UAAA,CAAA,QAAA,CAAA,CAAA,OAA4B,CAAA;ACC7B;AACA,CDAC,CAAA,CAAA,CAAA,OAAA,CAAA,WAAA,CAAA,QAAA,CAAA,SAAA,CAAA,EAAA,CAAA,MAAA;ACCD,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,QAAQ,CAAC,SAAS,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC,CDAC,CAAA;AAK1D,CAAA;ACHA;ADDC,CAAA,EAAA,CAAA,EAAA,CAAA,QAAA,CAAA,CAAA,CAAA,CAAA,EAAA,CAAA,UAAA,CAAA,CAAA;ACGD,CAAC,CDFC,QAAA,CAAA,CAAA,MAAgB,CAAA;ACGlB,CAAC,CDFC,IAAA,CAAA,MAAA,CAAA,CAAA,CAAc,CAAA;ACGhB,CDFC,CAAA;ACGD;AACA,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC","file":"index.css.map","sourcesContent":["/*\n * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.\n * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license\n */\n\n:root {\n\t--ck-mention-list-max-height: 300px;\n}\n\n.ck.ck-mentions {\n\tmax-height: var(--ck-mention-list-max-height);\n\n\toverflow-y: auto;\n\n\t/* Prevent unnecessary horizontal scrollbar in Safari\n\thttps://github.com/ckeditor/ckeditor5-mention/issues/41 */\n\toverflow-x: hidden;\n\n\toverscroll-behavior: contain;\n\n\t/* Prevent unnecessary vertical scrollbar in Safari\n\thttps://github.com/ckeditor/ckeditor5-mention/issues/41 */\n\t& > .ck-list__item {\n\t\toverflow: hidden;\n\t\tflex-shrink: 0;\n\t}\n}\n","/*\n * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.\n * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license\n */\n\n:root {\n\t--ck-mention-list-max-height: 300px;\n}\n\n.ck.ck-mentions {\n\tmax-height: var(--ck-mention-list-max-height);\n\n\toverflow-y: auto;\n\n\t/* Prevent unnecessary horizontal scrollbar in Safari\n\thttps://github.com/ckeditor/ckeditor5-mention/issues/41 */\n\toverflow-x: hidden;\n\n\toverscroll-behavior: contain;\n\n\t/* Prevent unnecessary vertical scrollbar in Safari\n\thttps://github.com/ckeditor/ckeditor5-mention/issues/41 */\n}\n\n.ck.ck-mentions > .ck-list__item {\n\t\toverflow: hidden;\n\t\tflex-shrink: 0;\n\t}\n\n/*# sourceMappingURL=index.css.map */"]}
@@ -1,27 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
5
- /**
6
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
7
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
8
- */
9
- import type { MentionConfig, Mention, MentionEditing, MentionUI, MentionCommand } from './index.js';
10
- declare module '@ckeditor/ckeditor5-core' {
11
- interface EditorConfig {
12
- /**
13
- * The configuration of the {@link module:mention/mention~Mention} feature.
14
- *
15
- * Read more in {@link module:mention/mentionconfig~MentionConfig}.
16
- */
17
- mention?: MentionConfig;
18
- }
19
- interface PluginsMap {
20
- [Mention.pluginName]: Mention;
21
- [MentionEditing.pluginName]: MentionEditing;
22
- [MentionUI.pluginName]: MentionUI;
23
- }
24
- interface CommandsMap {
25
- mention: MentionCommand;
26
- }
27
- }
@@ -1,20 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
5
- /**
6
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
7
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
8
- */
9
- /**
10
- * @module mention
11
- */
12
- export { default as Mention } from './mention.js';
13
- export { default as MentionEditing } from './mentionediting.js';
14
- export { default as MentionUI } from './mentionui.js';
15
- export { default as MentionsView } from './ui/mentionsview.js';
16
- export { default as MentionListItemView } from './ui/mentionlistitemview.js';
17
- export { default as DomWrapperView } from './ui/domwrapperview.js';
18
- export type { MentionConfig, MentionFeed, ItemRenderer, MentionFeedObjectItem } from './mentionconfig.js';
19
- export type { default as MentionCommand } from './mentioncommand.js';
20
- import './augmentation.js';
@@ -1,81 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
5
- /**
6
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
7
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
8
- */
9
- /**
10
- * @module mention/mention
11
- */
12
- import { Plugin } from 'ckeditor5/src/core.js';
13
- import type { Element } from 'ckeditor5/src/engine.js';
14
- import MentionEditing from './mentionediting.js';
15
- import MentionUI from './mentionui.js';
16
- import '../theme/mention.css';
17
- /**
18
- * The mention plugin.
19
- *
20
- * For a detailed overview, check the {@glink features/mentions Mention feature} guide.
21
- */
22
- export default class Mention extends Plugin {
23
- /**
24
- * Creates a mention attribute value from the provided view element and additional data.
25
- *
26
- * ```ts
27
- * editor.plugins.get( 'Mention' ).toMentionAttribute( viewElement, { userId: '1234' } );
28
- *
29
- * // For a view element: <span data-mention="@joe">@John Doe</span>
30
- * // it will return:
31
- * // { id: '@joe', userId: '1234', uid: '7a7bc7...', _text: '@John Doe' }
32
- * ```
33
- *
34
- * @param data Additional data to be stored in the mention attribute.
35
- */
36
- toMentionAttribute<MentionData extends Record<string, unknown>>(viewElement: Element, data: MentionData): (MentionAttribute & MentionData) | undefined;
37
- /**
38
- * Creates a mention attribute value from the provided view element.
39
- *
40
- * ```ts
41
- * editor.plugins.get( 'Mention' ).toMentionAttribute( viewElement );
42
- *
43
- * // For a view element: <span data-mention="@joe">@John Doe</span>
44
- * // it will return:
45
- * // { id: '@joe', uid: '7a7bc7...', _text: '@John Doe' }
46
- * ```
47
- */
48
- toMentionAttribute(viewElement: Element): MentionAttribute | undefined;
49
- /**
50
- * @inheritDoc
51
- */
52
- static get pluginName(): "Mention";
53
- /**
54
- * @inheritDoc
55
- */
56
- static get requires(): readonly [typeof MentionEditing, typeof MentionUI];
57
- }
58
- /**
59
- * Represents a mention in the model.
60
- *
61
- * See {@link module:mention/mention~Mention#toMentionAttribute `Mention#toMentionAttribute()`}.
62
- */
63
- export type MentionAttribute = {
64
- /**
65
- * The ID of a mention. It identifies the mention item in the mention feed. There can be multiple mentions
66
- * in the document with the same ID (e.g. the same hashtag being mentioned).
67
- */
68
- id: string;
69
- /**
70
- * A unique ID of this mention instance. Should be passed as an `option.id` when using
71
- * {@link module:engine/view/downcastwriter~DowncastWriter#createAttributeElement writer.createAttributeElement()}.
72
- */
73
- uid: string;
74
- /**
75
- * Helper property that stores the text of the inserted mention. Used for detecting a broken mention
76
- * in the editing area.
77
- *
78
- * @internal
79
- */
80
- _text: string;
81
- };
@@ -1,81 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
5
- /**
6
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
7
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
8
- */
9
- /**
10
- * @module mention/mentioncommand
11
- */
12
- import { Command, type Editor } from 'ckeditor5/src/core.js';
13
- import type { Range } from 'ckeditor5/src/engine.js';
14
- /**
15
- * The mention command.
16
- *
17
- * The command is registered by {@link module:mention/mentionediting~MentionEditing} as `'mention'`.
18
- *
19
- * To insert a mention into a range, execute the command and specify a mention object with a range to replace:
20
- *
21
- * ```ts
22
- * const focus = editor.model.document.selection.focus;
23
- *
24
- * // It will replace one character before the selection focus with the '#1234' text
25
- * // with the mention attribute filled with passed attributes.
26
- * editor.execute( 'mention', {
27
- * marker: '#',
28
- * mention: {
29
- * id: '#1234',
30
- * name: 'Foo',
31
- * title: 'Big Foo'
32
- * },
33
- * range: editor.model.createRange( focus.getShiftedBy( -1 ), focus )
34
- * } );
35
- *
36
- * // It will replace one character before the selection focus with the 'The "Big Foo"' text
37
- * // with the mention attribute filled with passed attributes.
38
- * editor.execute( 'mention', {
39
- * marker: '#',
40
- * mention: {
41
- * id: '#1234',
42
- * name: 'Foo',
43
- * title: 'Big Foo'
44
- * },
45
- * text: 'The "Big Foo"',
46
- * range: editor.model.createRange( focus.getShiftedBy( -1 ), focus )
47
- * } );
48
- * ```
49
- */
50
- export default class MentionCommand extends Command {
51
- /**
52
- * @inheritDoc
53
- */
54
- constructor(editor: Editor);
55
- /**
56
- * @inheritDoc
57
- */
58
- refresh(): void;
59
- /**
60
- * Executes the command.
61
- *
62
- * @param options Options for the executed command.
63
- * @param options.mention The mention object to insert. When a string is passed, it will be used to create a plain
64
- * object with the name attribute that equals the passed string.
65
- * @param options.marker The marker character (e.g. `'@'`).
66
- * @param options.text The text of the inserted mention. Defaults to the full mention string composed from `marker` and
67
- * `mention` string or `mention.id` if an object is passed.
68
- * @param options.range The range to replace.
69
- * Note that the replaced range might be shorter than the inserted text with the mention attribute.
70
- * @fires execute
71
- */
72
- execute(options: {
73
- mention: string | {
74
- id: string;
75
- [key: string]: unknown;
76
- };
77
- marker: string;
78
- text?: string;
79
- range?: Range;
80
- }): void;
81
- }
@@ -1,269 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
5
- /**
6
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
7
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
8
- */
9
- /**
10
- * @module mention/mentionconfig
11
- */
12
- /**
13
- * The configuration of the mention feature.
14
- *
15
- * Read more about {@glink features/mentions#configuration configuring the mention feature}.
16
- *
17
- * ```ts
18
- * ClassicEditor
19
- * .create( editorElement, {
20
- * mention: ... // Mention feature options.
21
- * } )
22
- * .then( ... )
23
- * .catch( ... );
24
- * ```
25
- *
26
- * See {@link module:core/editor/editorconfig~EditorConfig all editor options}.
27
- */
28
- export interface MentionConfig {
29
- /**
30
- * The list of mention feeds supported by the editor.
31
- *
32
- * ```ts
33
- * ClassicEditor
34
- * .create( editorElement, {
35
- * plugins: [ Mention, ... ],
36
- * mention: {
37
- * feeds: [
38
- * {
39
- * marker: '@',
40
- * feed: [ '@Barney', '@Lily', '@Marshall', '@Robin', '@Ted' ]
41
- * },
42
- * ...
43
- * ]
44
- * }
45
- * } )
46
- * .then( ... )
47
- * .catch( ... );
48
- * ```
49
- *
50
- * You can provide many mention feeds but they must use different `marker`s.
51
- * For example, you can use `'@'` to autocomplete people and `'#'` to autocomplete tags.
52
- */
53
- feeds: Array<MentionFeed>;
54
- /**
55
- * The configuration of the custom commit keys supported by the editor.
56
- *
57
- * ```ts
58
- * ClassicEditor
59
- * .create( editorElement, {
60
- * plugins: [ Mention, ... ],
61
- * mention: {
62
- * // [ Enter, Space ]
63
- * commitKeys: [ 13, 32 ]
64
- * feeds: [
65
- * { ... }
66
- * ...
67
- * ]
68
- * }
69
- * } )
70
- * .then( ... )
71
- * .catch( ... );
72
- * ```
73
- *
74
- * Custom commit keys configuration allows you to customize how users will confirm the selection of mentions from the dropdown list.
75
- * You can add as many mention commit keys as you need. For instance, in the snippet above new mentions will be committed by pressing
76
- * either <kbd>Enter</kbd> or <kbd>Space</kbd> (13 and 32 key codes respectively).
77
- *
78
- * @default [ 13, 9 ] // [ Enter, Tab ]
79
- */
80
- commitKeys?: Array<number>;
81
- /**
82
- * The configuration of the custom number of visible mentions.
83
- *
84
- * Customizing the number of visible mentions allows you to specify how many available elements will the users be able to see
85
- * in the dropdown list. You can specify any number you see fit. For example, in the snippets below you will find the
86
- * dropdownLimit set to `20` and `Infinity` (the latter will result in showing all available mentions).
87
- *
88
- * ```ts
89
- * ClassicEditor
90
- * .create( editorElement, {
91
- * plugins: [ Mention, ... ],
92
- * mention: {
93
- * dropdownLimit: 20,
94
- * feeds: [
95
- * { ... }
96
- * ...
97
- * ]
98
- * }
99
- * } )
100
- * .then( ... )
101
- * .catch( ... );
102
- *
103
- * ClassicEditor
104
- * .create( editorElement, {
105
- * plugins: [ Mention, ... ],
106
- * mention: {
107
- * dropdownLimit: Infinity,
108
- * feeds: [
109
- * { ... }
110
- * ...
111
- * ]
112
- * }
113
- * } )
114
- * .then( ... )
115
- * .catch( ... );
116
- * ```
117
- *
118
- * @default 10
119
- */
120
- dropdownLimit?: number;
121
- }
122
- /**
123
- * The mention feed descriptor. Used in {@link module:mention/mentionconfig~MentionConfig `config.mention`}.
124
- *
125
- * See {@link module:mention/mentionconfig~MentionConfig} to learn more.
126
- *
127
- * ```ts
128
- * // Static configuration.
129
- * const mentionFeedPeople = {
130
- * marker: '@',
131
- * feed: [ '@Alice', '@Bob', ... ],
132
- * minimumCharacters: 2
133
- * };
134
- *
135
- * // Simple synchronous callback.
136
- * const mentionFeedTags = {
137
- * marker: '#',
138
- * feed: ( searchString: string ) => {
139
- * return tags
140
- * // Filter the tags list.
141
- * .filter( tag => {
142
- * return tag.toLowerCase().includes( queryText.toLowerCase() );
143
- * } )
144
- * }
145
- * };
146
- *
147
- * const tags = [ 'wysiwyg', 'rte', 'rich-text-edior', 'collaboration', 'real-time', ... ];
148
- *
149
- * // Asynchronous callback.
150
- * const mentionFeedPlaceholders = {
151
- * marker: '$',
152
- * feed: ( searchString: string ) => {
153
- * return getMatchingPlaceholders( searchString );
154
- * }
155
- * };
156
- *
157
- * function getMatchingPlaceholders( searchString: string ) {
158
- * return new Promise<Array<MentionFeedItem>>( resolve => {
159
- * doSomeXHRQuery( result => {
160
- * // console.log( result );
161
- * // -> [ '$name', '$surname', '$postal', ... ]
162
- *
163
- * resolve( result );
164
- * } );
165
- * } );
166
- * }
167
- * ```
168
- */
169
- export interface MentionFeed {
170
- /**
171
- * The character which triggers autocompletion for mention. It must be a single character.
172
- */
173
- marker: string;
174
- /**
175
- * Autocomplete items. Provide an array for
176
- * a static configuration (the mention feature will show matching items automatically) or a function which returns an array of
177
- * matching items (directly, or via a promise). If a function is passed, it is executed in the context of the editor instance.
178
- */
179
- feed: Array<MentionFeedItem> | FeedCallback;
180
- /**
181
- * Specifies after how many characters the autocomplete panel should be shown.
182
- *
183
- * @default 0
184
- */
185
- minimumCharacters?: number;
186
- /**
187
- * A function that renders a {@link module:mention/mentionconfig~MentionFeedItem}
188
- * to the autocomplete panel.
189
- */
190
- itemRenderer?: ItemRenderer;
191
- /**
192
- * Specify how many available elements per feeds will the users be able to see in the dropdown list.
193
- * If it not set, limit is inherited from {@link module:mention/mentionconfig~MentionConfig#dropdownLimit MentionConfig}.
194
- */
195
- dropdownLimit?: number;
196
- }
197
- /**
198
- * Function that renders an array of {@link module:mention/mentionconfig~MentionFeedItem} based on string input.
199
- */
200
- export type FeedCallback = (searchString: string) => Array<MentionFeedItem> | Promise<Array<MentionFeedItem>>;
201
- /**
202
- * Function that takes renders a {@link module:mention/mentionconfig~MentionFeedObjectItem} as HTMLElement.
203
- */
204
- export type ItemRenderer = (item: MentionFeedObjectItem) => HTMLElement | string;
205
- /**
206
- * The mention feed item. It may be defined as a string or a plain object.
207
- *
208
- * When defining a feed item as a plain object, the `id` property is obligatory. Additional properties
209
- * can be used when customizing the mention feature bahavior
210
- * (see {@glink features/mentions#customizing-the-autocomplete-list "Customizing the autocomplete list"}
211
- * and {@glink features/mentions#customizing-the-output "Customizing the output"} sections).
212
- *
213
- * ```ts
214
- * ClassicEditor
215
- * .create( editorElement, {
216
- * plugins: [ Mention, ... ],
217
- * mention: {
218
- * feeds: [
219
- * // Feed items as objects.
220
- * {
221
- * marker: '@',
222
- * feed: [
223
- * {
224
- * id: '@Barney',
225
- * fullName: 'Barney Bloom'
226
- * },
227
- * {
228
- * id: '@Lily',
229
- * fullName: 'Lily Smith'
230
- * },
231
- * {
232
- * id: '@Marshall',
233
- * fullName: 'Marshall McDonald'
234
- * },
235
- * {
236
- * id: '@Robin',
237
- * fullName: 'Robin Hood'
238
- * },
239
- * {
240
- * id: '@Ted',
241
- * fullName: 'Ted Cruze'
242
- * },
243
- * // ...
244
- * ]
245
- * },
246
- *
247
- * // Feed items as plain strings.
248
- * {
249
- * marker: '#',
250
- * feed: [ 'wysiwyg', 'rte', 'rich-text-edior', 'collaboration', 'real-time', ... ]
251
- * },
252
- * ]
253
- * }
254
- * } )
255
- * .then( ... )
256
- * .catch( ... );
257
- * ```
258
- */
259
- export type MentionFeedItem = string | MentionFeedObjectItem;
260
- export type MentionFeedObjectItem = {
261
- /**
262
- * A unique ID of the mention. It must start with the marker character.
263
- */
264
- id: string;
265
- /**
266
- * Text inserted into the editor when creating a mention.
267
- */
268
- text?: string;
269
- };
@@ -1,47 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
5
- /**
6
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
7
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
8
- */
9
- /**
10
- * @module mention/mentionediting
11
- */
12
- import { Plugin } from 'ckeditor5/src/core.js';
13
- import type { Element } from 'ckeditor5/src/engine.js';
14
- import type { MentionAttribute } from './mention.js';
15
- /**
16
- * The mention editing feature.
17
- *
18
- * It introduces the {@link module:mention/mentioncommand~MentionCommand command} and the `mention`
19
- * attribute in the {@link module:engine/model/model~Model model} which renders in the {@link module:engine/view/view view}
20
- * as a `<span class="mention" data-mention="@mention">`.
21
- */
22
- export default class MentionEditing extends Plugin {
23
- /**
24
- * @inheritDoc
25
- */
26
- static get pluginName(): "MentionEditing";
27
- /**
28
- * @inheritDoc
29
- */
30
- init(): void;
31
- }
32
- /**
33
- * @internal
34
- */
35
- export declare function _addMentionAttributes(baseMentionData: {
36
- id: string;
37
- _text: string;
38
- }, data?: Record<string, unknown>): MentionAttribute;
39
- /**
40
- * Creates a mention attribute value from the provided view element and optional data.
41
- *
42
- * This function is exposed as
43
- * {@link module:mention/mention~Mention#toMentionAttribute `editor.plugins.get( 'Mention' ).toMentionAttribute()`}.
44
- *
45
- * @internal
46
- */
47
- export declare function _toMentionAttribute(viewElementOrMention: Element, data?: Record<string, unknown>): MentionAttribute | undefined;
@@ -1,106 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
5
- /**
6
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
7
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
8
- */
9
- /**
10
- * @module mention/mentionui
11
- */
12
- import { Plugin, type Editor } from 'ckeditor5/src/core.js';
13
- import { ContextualBalloon } from 'ckeditor5/src/ui.js';
14
- /**
15
- * The mention UI feature.
16
- */
17
- export default class MentionUI extends Plugin {
18
- /**
19
- * The mention view.
20
- */
21
- private readonly _mentionsView;
22
- /**
23
- * Stores mention feeds configurations.
24
- */
25
- private _mentionsConfigurations;
26
- /**
27
- * The contextual balloon plugin instance.
28
- */
29
- private _balloon;
30
- private _items;
31
- private _lastRequested?;
32
- /**
33
- * Debounced feed requester. It uses `lodash#debounce` method to delay function call.
34
- */
35
- private _requestFeedDebounced;
36
- /**
37
- * @inheritDoc
38
- */
39
- static get pluginName(): "MentionUI";
40
- /**
41
- * @inheritDoc
42
- */
43
- static get requires(): readonly [typeof ContextualBalloon];
44
- /**
45
- * @inheritDoc
46
- */
47
- constructor(editor: Editor);
48
- /**
49
- * @inheritDoc
50
- */
51
- init(): void;
52
- /**
53
- * @inheritDoc
54
- */
55
- destroy(): void;
56
- /**
57
- * Returns true when {@link #_mentionsView} is in the {@link module:ui/panel/balloon/contextualballoon~ContextualBalloon} and it is
58
- * currently visible.
59
- */
60
- private get _isUIVisible();
61
- /**
62
- * Creates the {@link #_mentionsView}.
63
- */
64
- private _createMentionView;
65
- /**
66
- * Returns item renderer for the marker.
67
- */
68
- private _getItemRenderer;
69
- /**
70
- * Requests a feed from a configured callbacks.
71
- */
72
- private _requestFeed;
73
- /**
74
- * Registers a text watcher for the marker.
75
- */
76
- private _setupTextWatcher;
77
- /**
78
- * Handles the feed response event data.
79
- */
80
- private _handleFeedResponse;
81
- /**
82
- * Shows the mentions balloon. If the panel is already visible, it will reposition it.
83
- */
84
- private _showOrUpdateUI;
85
- /**
86
- * Hides the mentions balloon and removes the 'mention' marker from the markers collection.
87
- */
88
- private _hideUIAndRemoveMarker;
89
- /**
90
- * Renders a single item in the autocomplete list.
91
- */
92
- private _renderItem;
93
- /**
94
- * Creates a position options object used to position the balloon panel.
95
- *
96
- * @param mentionMarker
97
- * @param preferredPosition The name of the last matched position name.
98
- */
99
- private _getBalloonPanelPositionData;
100
- }
101
- /**
102
- * Creates a RegExp pattern for the marker.
103
- *
104
- * Function has to be exported to achieve 100% code coverage.
105
- */
106
- export declare function createRegExp(marker: string, minimumCharacters: number): RegExp;
@@ -1,45 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
5
- /**
6
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
7
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
8
- */
9
- /**
10
- * @module mention/ui/domwrapperview
11
- */
12
- import { View } from 'ckeditor5/src/ui.js';
13
- import type { Locale } from 'ckeditor5/src/utils.js';
14
- /**
15
- * This class wraps DOM element as a CKEditor5 UI View.
16
- *
17
- * It allows to render any DOM element and use it in mentions list.
18
- */
19
- export default class DomWrapperView extends View {
20
- /**
21
- * The DOM element for which wrapper was created.
22
- */
23
- domElement: HTMLElement;
24
- /**
25
- * Controls whether the dom wrapper view is "on". This is in line with {@link module:ui/button/button~Button#isOn} property.
26
- *
27
- * @observable
28
- * @default true
29
- */
30
- isOn: boolean;
31
- /**
32
- * Creates an instance of {@link module:mention/ui/domwrapperview~DomWrapperView} class.
33
- *
34
- * Also see {@link #render}.
35
- */
36
- constructor(locale: Locale, domElement: HTMLElement);
37
- /**
38
- * @inheritDoc
39
- */
40
- render(): void;
41
- /**
42
- * Focuses the DOM element.
43
- */
44
- focus(): void;
45
- }
@@ -1,19 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
5
- /**
6
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
7
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
8
- */
9
- /**
10
- * @module mention/ui/mentionlistitemview
11
- */
12
- import { ListItemView } from 'ckeditor5/src/ui.js';
13
- import type { MentionFeedItem } from '../mentionconfig.js';
14
- export default class MentionListItemView extends ListItemView {
15
- item: MentionFeedItem;
16
- marker: string;
17
- highlight(): void;
18
- removeHighlight(): void;
19
- }
@@ -1,64 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
5
- /**
6
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
7
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
8
- */
9
- /**
10
- * @module mention/ui/mentionsview
11
- */
12
- import { ListView } from 'ckeditor5/src/ui.js';
13
- import { type Locale } from 'ckeditor5/src/utils.js';
14
- import type MentionListItemView from './mentionlistitemview.js';
15
- import '../../theme/mentionui.css';
16
- /**
17
- * The mention ui view.
18
- */
19
- export default class MentionsView extends ListView {
20
- selected: MentionListItemView | undefined;
21
- position: string | undefined;
22
- /**
23
- * @inheritDoc
24
- */
25
- constructor(locale: Locale);
26
- /**
27
- * {@link #select Selects} the first item.
28
- */
29
- selectFirst(): void;
30
- /**
31
- * Selects next item to the currently {@link #select selected}.
32
- *
33
- * If the last item is already selected, it will select the first item.
34
- */
35
- selectNext(): void;
36
- /**
37
- * Selects previous item to the currently {@link #select selected}.
38
- *
39
- * If the first item is already selected, it will select the last item.
40
- */
41
- selectPrevious(): void;
42
- /**
43
- * Marks item at a given index as selected.
44
- *
45
- * Handles selection cycling when passed index is out of bounds:
46
- * - if the index is lower than 0, it will select the last item,
47
- * - if the index is higher than the last item index, it will select the first item.
48
- *
49
- * @param index Index of an item to be marked as selected.
50
- */
51
- select(index: number): void;
52
- /**
53
- * Triggers the `execute` event on the {@link #select selected} item.
54
- */
55
- executeSelected(): void;
56
- /**
57
- * Checks if an item is visible in the scrollable area.
58
- *
59
- * The item is considered visible when:
60
- * - its top boundary is inside the scrollable rect
61
- * - its bottom boundary is inside the scrollable rect (the whole item must be visible)
62
- */
63
- private _isItemVisibleInScrolledArea;
64
- }