mirror/tiptap
1
0
Fork 0
mirror of https://github.com/ueberdosis/tiptap.git synced 2025-06-11 11:45:15 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat!: Add editor to items prop in suggestion plugin (#2082)

Browse Source 
* add editor to items prop

* docs: update content
This commit is contained in:
Philipp Kühn 2021-10-25 09:42:41 +02:00 committed by GitHub
parent c01afc6791
commit a6f731af39
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 13 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
demos/src/Examples/Community/React/suggestion.js
View File

@ -3,7 +3,7 @@ import tippy from 'tippy.js'
import { MentionList } from './MentionList' import { MentionList } from './MentionList'
export default { export default {
items: query => { items: ({ query }) => {
return [ return [
'Lea Thompson', 'Cyndi Lauper', 'Tom Cruise', 'Madonna', 'Jerry Hall', 'Joan Collins', 'Winona Ryder', 'Christina Applegate', 'Alyssa Milano', 'Molly Ringwald', 'Ally Sheedy', 'Debbie Harry', 'Olivia Newton-John', 'Elton John', 'Michael J. Fox', 'Axl Rose', 'Emilio Estevez', 'Ralph Macchio', 'Rob Lowe', 'Jennifer Grey', 'Mickey Rourke', 'John Cusack', 'Matthew Broderick', 'Justine Bateman', 'Lisa Bonet', 'Lea Thompson', 'Cyndi Lauper', 'Tom Cruise', 'Madonna', 'Jerry Hall', 'Joan Collins', 'Winona Ryder', 'Christina Applegate', 'Alyssa Milano', 'Molly Ringwald', 'Ally Sheedy', 'Debbie Harry', 'Olivia Newton-John', 'Elton John', 'Michael J. Fox', 'Axl Rose', 'Emilio Estevez', 'Ralph Macchio', 'Rob Lowe', 'Jennifer Grey', 'Mickey Rourke', 'John Cusack', 'Matthew Broderick', 'Justine Bateman', 'Lisa Bonet',
].filter(item => item.toLowerCase().startsWith(query.toLowerCase())).slice(0, 5) ].filter(item => item.toLowerCase().startsWith(query.toLowerCase())).slice(0, 5)

2
demos/src/Examples/Community/Vue/suggestion.js
View File

@ -3,7 +3,7 @@ import tippy from 'tippy.js'
import MentionList from './MentionList.vue' import MentionList from './MentionList.vue'
export default { export default {
items: query => { items: ({ query }) => {
return [ return [
'Lea Thompson', 'Cyndi Lauper', 'Tom Cruise', 'Madonna', 'Jerry Hall', 'Joan Collins', 'Winona Ryder', 'Christina Applegate', 'Alyssa Milano', 'Molly Ringwald', 'Ally Sheedy', 'Debbie Harry', 'Olivia Newton-John', 'Elton John', 'Michael J. Fox', 'Axl Rose', 'Emilio Estevez', 'Ralph Macchio', 'Rob Lowe', 'Jennifer Grey', 'Mickey Rourke', 'John Cusack', 'Matthew Broderick', 'Justine Bateman', 'Lisa Bonet', 'Lea Thompson', 'Cyndi Lauper', 'Tom Cruise', 'Madonna', 'Jerry Hall', 'Joan Collins', 'Winona Ryder', 'Christina Applegate', 'Alyssa Milano', 'Molly Ringwald', 'Ally Sheedy', 'Debbie Harry', 'Olivia Newton-John', 'Elton John', 'Michael J. Fox', 'Axl Rose', 'Emilio Estevez', 'Ralph Macchio', 'Rob Lowe', 'Jennifer Grey', 'Mickey Rourke', 'John Cusack', 'Matthew Broderick', 'Justine Bateman', 'Lisa Bonet',
].filter(item => item.toLowerCase().startsWith(query.toLowerCase())).slice(0, 5) ].filter(item => item.toLowerCase().startsWith(query.toLowerCase())).slice(0, 5)

2
demos/src/Experiments/Commands/Vue/suggestion.js
View File

@ -3,7 +3,7 @@ import { VueRenderer } from '@tiptap/vue-3'
import CommandsList from './CommandsList.vue' import CommandsList from './CommandsList.vue'
export default { export default {
items: query => { items: ({ query }) => {
return [ return [
{ {
title: 'H1', title: 'H1',

2
demos/src/Nodes/Mention/Vue/suggestion.js
View File

@ -3,7 +3,7 @@ import tippy from 'tippy.js'
import MentionList from './MentionList.vue' import MentionList from './MentionList.vue'
export default { export default {
items: query => { items: ({ query }) => {
return [ return [
'Lea Thompson', 'Cyndi Lauper', 'Tom Cruise', 'Madonna', 'Jerry Hall', 'Joan Collins', 'Winona Ryder', 'Christina Applegate', 'Alyssa Milano', 'Molly Ringwald', 'Ally Sheedy', 'Debbie Harry', 'Olivia Newton-John', 'Elton John', 'Michael J. Fox', 'Axl Rose', 'Emilio Estevez', 'Ralph Macchio', 'Rob Lowe', 'Jennifer Grey', 'Mickey Rourke', 'John Cusack', 'Matthew Broderick', 'Justine Bateman', 'Lisa Bonet', 'Lea Thompson', 'Cyndi Lauper', 'Tom Cruise', 'Madonna', 'Jerry Hall', 'Joan Collins', 'Winona Ryder', 'Christina Applegate', 'Alyssa Milano', 'Molly Ringwald', 'Ally Sheedy', 'Debbie Harry', 'Olivia Newton-John', 'Elton John', 'Michael J. Fox', 'Axl Rose', 'Emilio Estevez', 'Ralph Macchio', 'Rob Lowe', 'Jennifer Grey', 'Mickey Rourke', 'John Cusack', 'Matthew Broderick', 'Justine Bateman', 'Lisa Bonet',
].filter(item => item.toLowerCase().startsWith(query.toLowerCase())).slice(0, 5) ].filter(item => item.toLowerCase().startsWith(query.toLowerCase())).slice(0, 5)

2
docs/api/utilities/suggestion.md
View File

@ -44,7 +44,7 @@ Default: `() => {}'`
### items ### items
Pass an array of filtered suggestions, can be async. Pass an array of filtered suggestions, can be async.
Default: `() => {}` Default: `({ editor, query }) => []`
### render ### render
A render function for the autocomplete popup. A render function for the autocomplete popup.

10
packages/suggestion/src/suggestion.ts
View File

@ -17,7 +17,10 @@ export interface SuggestionOptions {
range: Range, range: Range,
props: any, props: any,
}) => void, }) => void,
items?: (query: string) => any[] | Promise<any[]>, items?: (props: {
query: string,
editor: Editor,
}) => any[] | Promise<any[]>,
render?: () => { render?: () => {
onStart?: (props: SuggestionProps) => void, onStart?: (props: SuggestionProps) => void,
onUpdate?: (props: SuggestionProps) => void, onUpdate?: (props: SuggestionProps) => void,
@ -99,7 +102,10 @@ export function Suggestion({
query: state.query, query: state.query,
text: state.text, text: state.text,
items: (handleChange || handleStart) items: (handleChange || handleStart)
? await items(state.query) ? await items({
editor,
query: state.query,
})
: [], : [],
command: commandProps => { command: commandProps => {
command({ command({