@portabletext/plugin-emoji-picker 0.0.15 → 1.0.1

package/src/match-emojis.ts

@@ -1,45 +1,16 @@
-import {emojis} from './emojis'
-
 /**
- * Proposed, but not required type, to represent an emoji match.
- *
- * @example
- * ```tsx
- * {
- *   type: 'exact',
- *   key: '😂-joy',
- *   emoji: '😂',
- *   keyword: 'joy',
- * }
- * ```
- * @example
- * ```tsx
- * {
- *   type: 'partial',
- *   key: '😹-joy-_cat',
- *   emoji: '😹',
- *   keyword: 'joy',
- *   startSlice: '',
- *   endSlice: '_cat',
- * }
- * ```
+ * The base type representing an emoji match.
  *
  * @beta
  */
-export type EmojiMatch =
+export type BaseEmojiMatch =
   | {
       type: 'exact'
-      key: string
       emoji: string
-      keyword: string
     }
   | {
       type: 'partial'
-      key: string
       emoji: string
-      keyword: string
-      startSlice: string
-      endSlice: string
     }
 
 /**
@@ -47,75 +18,5 @@ export type EmojiMatch =
  *
  * @beta
  */
-export type MatchEmojis<TEmojiMatch = EmojiMatch> = (query: {
-  keyword: string
-}) => ReadonlyArray<TEmojiMatch>
-
-/**
- * Proposed, but not required, default implementation of `MatchEmojis`.
- *
- * @beta
- */
-export const matchEmojis: MatchEmojis = createMatchEmojis({emojis})
-
-/**
- * Proposed, but not required, function to create a `MatchEmojis` function.
- *
- * @example
- * ```ts
- * const matchEmojis = createMatchEmojis({
- *   emojis: {
- *     '😂': ['joy'],
- *     '😹': ['joy_cat'],
- *   },
- * })
- * ```
- *
- * @beta
- */
-export function createMatchEmojis(config: {
-  emojis: Record<string, ReadonlyArray<string>>
-}): MatchEmojis {
-  return ({keyword}: {keyword: string}) => {
-    const foundEmojis: Array<EmojiMatch> = []
-
-    if (keyword.length < 1) {
-      return foundEmojis
-    }
-
-    for (const emoji in config.emojis) {
-      const emojiKeywords = config.emojis[emoji] ?? []
-
-      for (const emojiKeyword of emojiKeywords) {
-        const keywordIndex = emojiKeyword.indexOf(keyword)
-
-        if (keywordIndex === -1) {
-          continue
-        }
-
-        if (emojiKeyword === keyword) {
-          foundEmojis.push({
-            type: 'exact',
-            key: `${emoji}-${keyword}`,
-            emoji,
-            keyword,
-          })
-        } else {
-          const start = emojiKeyword.slice(0, keywordIndex)
-          const end = emojiKeyword.slice(keywordIndex + keyword.length)
-
-          foundEmojis.push({
-            type: 'partial',
-            key: `${emoji}-${start}${keyword}${end}`,
-            emoji,
-            keyword,
-            startSlice: start,
-            endSlice: end,
-          })
-        }
-      }
-    }
-
-    return foundEmojis
-  }
-}
+export type MatchEmojis<TEmojiMatch extends BaseEmojiMatch = BaseEmojiMatch> =
+  (query: {keyword: string}) => ReadonlyArray<TEmojiMatch>

package/src/use-emoji-picker.ts

@@ -2,12 +2,12 @@ import {useEditor} from '@portabletext/editor'
 import {useActorRef, useSelector} from '@xstate/react'
 import {useCallback} from 'react'
 import {emojiPickerMachine} from './emoji-picker-machine'
-import type {EmojiMatch, MatchEmojis} from './match-emojis'
+import type {BaseEmojiMatch, MatchEmojis} from './match-emojis'
 
 /**
  * @beta
  */
-export type EmojiPicker<TEmojiMatch = EmojiMatch> = {
+export type EmojiPicker<TEmojiMatch extends BaseEmojiMatch = BaseEmojiMatch> = {
   /**
    * The matched keyword, including colons.
    *
@@ -105,7 +105,9 @@ export type EmojiPicker<TEmojiMatch = EmojiMatch> = {
 /**
  * @beta
  */
-export type EmojiPickerProps<TEmojiMatch = EmojiMatch> = {
+export type EmojiPickerProps<
+  TEmojiMatch extends BaseEmojiMatch = BaseEmojiMatch,
+> = {
   matchEmojis: MatchEmojis<TEmojiMatch>
 }
 
@@ -136,12 +138,12 @@ export type EmojiPickerProps<TEmojiMatch = EmojiMatch> = {
  *
  * @beta
  */
-export function useEmojiPicker<TEmojiMatch = EmojiMatch>(
-  props: EmojiPickerProps<TEmojiMatch>,
-): EmojiPicker<TEmojiMatch> {
+export function useEmojiPicker<
+  TEmojiMatch extends BaseEmojiMatch = BaseEmojiMatch,
+>(props: EmojiPickerProps<TEmojiMatch>): EmojiPicker<TEmojiMatch> {
   const editor = useEditor()
   const emojiPickerActor = useActorRef(emojiPickerMachine, {
-    input: {editor, matchEmojis: props.matchEmojis as MatchEmojis<EmojiMatch>},
+    input: {editor, matchEmojis: props.matchEmojis},
   })
   const keyword = useSelector(
     emojiPickerActor,