Autocomplete
Esta página aún no está disponible en tu idioma.
Autocomplete is a special interaction which can happen on multiple options can be suggested for a single command.
We’ve implemented this functionality using a simple tree search algorithm within a nested options tree.
Example
In this example, the option list
will autocomplete with the cheeses gouda
, parmesan
, and harvarti
.
1export default commandModule({2 type: CommandType.Slash,3 description: "show me cheese",4 options: [5 {6 name: "list",7 type: ApplicationCommandOptionType.String,8 description: "pick a cheese to show",9 required: true,10 autocomplete: true,11 command: {12 onEvent: [],13 execute: (ctx) => {14 // focus can be used to refine the options15 const focus = ctx.options.getFocused();16 ctx.respond(17 ["gouda", "parmesan", "harvarti"].map((cheese) => ({18 name: cheese,19 value: cheese,20 })),21 );22 },23 },24 },25 ],26 execute: (ctx, [, args]) => {27 const cheese = args.getString("list", true);28 ctx.reply("selected cheese");29 },30});
Using Focus
The focus
object can be used to refine the options. For example, if the user types g
, the focus object will be g
.
We can filter the cheeses based on the focus object, and return only the cheeses that start with the focus object.
You can do a lot more with the focus object, such as performing API calls, or implementing a fuzzy search.
1export default commandModule({2 type: CommandType.Slash,3 description: "show me cheese",4 options: [5 {6 name: "list",7 type: ApplicationCommandOptionType.String,8 description: "pick a cheese to show",9 required: true,10 autocomplete: true,11 command: {12 onEvent: [],13 execute: (ctx) => {14 const focus = ctx.options.getFocused();15 ctx.respond(16 ["gouda", "parmesan", "harvarti"]17 .filter((cheese) => cheese.startsWith(focus))18 .map((cheese) => ({19 name: cheese,20 value: cheese,21 })),22 );23 },24 },25 },26 ],27 execute: (ctx, [, args]) => {28 const cheese = args.getString("list", true);29 ctx.reply("selected cheese");30 },31});