From e7127e886e7a737b27cdf62e928723166f499c53 Mon Sep 17 00:00:00 2001 From: zbeyens Date: Tue, 26 Nov 2024 18:44:18 +0100 Subject: [PATCH] docs --- apps/www/content/docs/multi-select.mdx | 148 +++++++++++++++++++++++-- 1 file changed, 139 insertions(+), 9 deletions(-) diff --git a/apps/www/content/docs/multi-select.mdx b/apps/www/content/docs/multi-select.mdx index 16296e10aa..d726fbff18 100644 --- a/apps/www/content/docs/multi-select.mdx +++ b/apps/www/content/docs/multi-select.mdx @@ -77,20 +77,150 @@ export default function MySelectEditor() { ## Plugins +### TagPlugin + +Inline void element plugin. + ### MultiSelectPlugin -Handling multi-select elements in the editor. Built on top of TagPlugin. +Extension of the TagPlugin that constrains the editor to tag elements. - - -The type identifier for multi-select elements. +## API + +### editor.tf.insert.tag -- **Default:** `'multi-select'` +Inserts a new multi-select element at the current selection. + + + +Properties for the multi-select element: + + +The unique value of the multi-select element. + + - + -### TagPlugin +## Hooks -Inline void element plugin. +### useSelectedItems -## API +Hook to get the currently selected tag items in the editor. + + + + Array of selected tag items, each containing a value and any additional properties. + + + +### getSelectedItems + +Gets all tag items in the editor. + + + + The Slate editor instance. + + + + + + Array of tag items in the editor. + + + +### isEqualTags + +Utility function to compare two sets of tags for equality, ignoring order. + + + + The Slate editor instance. + + + New set of tags to compare against the current editor tags. + + + + + + `true` if both sets contain the same values, `false` otherwise. + + + +### useSelectableItems + +Hook to get the available items that can be selected, filtered by search and excluding already selected items. + + + + + +Whether to allow creating new items. + +- **Default:** `true` + + +Custom filter function for items. + + +Array of available items. + + +Filter function for new items. + + +Position of new items in the list. + +- **Default:** `'end'` + + + + + + + + Filtered array of selectable items. + + + +### useSelectEditorCombobox + +Hook to handle combobox behavior in the editor, including text cleanup and item selection. + + + + + +Whether the combobox is open. + + +Function to select the first item in the combobox. + + +Callback when selected items change. + + + + + +## Types + +### TTagElement + +```ts +type TTagElement = TElement & { + value: string; + [key: string]: unknown; +}; +``` + +### TagLike + +```ts +type TagLike = { + value: string; + [key: string]: unknown; +}; +``` \ No newline at end of file