Merge pull request #3981 from udecode/registry

Update Registry

apps/www/public/r/styles/default/emoji-input-element.json

@@ -19,7 +19,7 @@
   },
   "files": [
     {
-      "content": "'use client';\n\nimport React, { useMemo, useState } from 'react';\n\nimport { withRef } from '@udecode/cn';\nimport { useEditorPlugin } from '@udecode/plate-core/react';\nimport { EmojiInlineIndexSearch, insertEmoji } from '@udecode/plate-emoji';\nimport { EmojiPlugin } from '@udecode/plate-emoji/react';\n\nimport { useDebounce } from '@/hooks/use-debounce';\n\nimport {\n  InlineCombobox,\n  InlineComboboxContent,\n  InlineComboboxEmpty,\n  InlineComboboxGroup,\n  InlineComboboxInput,\n  InlineComboboxItem,\n} from './inline-combobox';\nimport { PlateElement } from './plate-element';\n\nexport const EmojiInputElement = withRef<typeof PlateElement>(\n  ({ className, ...props }, ref) => {\n    const { children, editor, element } = props;\n    const { useOption } = useEditorPlugin(EmojiPlugin);\n    const data = useOption('data')!;\n    const [value, setValue] = useState('');\n    const debouncedValue = useDebounce(value, 100);\n    const isPending = value !== debouncedValue;\n\n    const filteredEmojis = useMemo(() => {\n      if (debouncedValue.trim().length === 0) return [];\n\n      return EmojiInlineIndexSearch.getInstance(data)\n        .search(debouncedValue.replace(/:$/, ''))\n        .get();\n    }, [data, debouncedValue]);\n\n    return (\n      <PlateElement\n        ref={ref}\n        as=\"span\"\n        className={className}\n        data-slate-value={element.value}\n        {...props}\n      >\n        <InlineCombobox\n          value={value}\n          element={element}\n          filter={false}\n          setValue={setValue}\n          trigger=\":\"\n          hideWhenNoValue\n        >\n          <InlineComboboxInput />\n\n          <InlineComboboxContent>\n            {!isPending && (\n              <InlineComboboxEmpty>No results</InlineComboboxEmpty>\n            )}\n\n            <InlineComboboxGroup>\n              {filteredEmojis.map((emoji) => (\n                <InlineComboboxItem\n                  key={emoji.id}\n                  value={emoji.name}\n                  onClick={() => insertEmoji(editor, emoji)}\n                >\n                  {emoji.skins[0].native} {emoji.name}\n                </InlineComboboxItem>\n              ))}\n            </InlineComboboxGroup>\n          </InlineComboboxContent>\n        </InlineCombobox>\n\n        {children}\n      </PlateElement>\n    );\n  }\n);\n",
+      "content": "'use client';\n\nimport React, { useMemo, useState } from 'react';\n\nimport { withRef } from '@udecode/cn';\nimport { useEditorPlugin } from '@udecode/plate/react';\nimport { EmojiInlineIndexSearch, insertEmoji } from '@udecode/plate-emoji';\nimport { EmojiPlugin } from '@udecode/plate-emoji/react';\n\nimport { useDebounce } from '@/hooks/use-debounce';\n\nimport {\n  InlineCombobox,\n  InlineComboboxContent,\n  InlineComboboxEmpty,\n  InlineComboboxGroup,\n  InlineComboboxInput,\n  InlineComboboxItem,\n} from './inline-combobox';\nimport { PlateElement } from './plate-element';\n\nexport const EmojiInputElement = withRef<typeof PlateElement>(\n  ({ className, ...props }, ref) => {\n    const { children, editor, element } = props;\n    const { useOption } = useEditorPlugin(EmojiPlugin);\n    const data = useOption('data')!;\n    const [value, setValue] = useState('');\n    const debouncedValue = useDebounce(value, 100);\n    const isPending = value !== debouncedValue;\n\n    const filteredEmojis = useMemo(() => {\n      if (debouncedValue.trim().length === 0) return [];\n\n      return EmojiInlineIndexSearch.getInstance(data)\n        .search(debouncedValue.replace(/:$/, ''))\n        .get();\n    }, [data, debouncedValue]);\n\n    return (\n      <PlateElement\n        ref={ref}\n        as=\"span\"\n        className={className}\n        data-slate-value={element.value}\n        {...props}\n      >\n        <InlineCombobox\n          value={value}\n          element={element}\n          filter={false}\n          setValue={setValue}\n          trigger=\":\"\n          hideWhenNoValue\n        >\n          <InlineComboboxInput />\n\n          <InlineComboboxContent>\n            {!isPending && (\n              <InlineComboboxEmpty>No results</InlineComboboxEmpty>\n            )}\n\n            <InlineComboboxGroup>\n              {filteredEmojis.map((emoji) => (\n                <InlineComboboxItem\n                  key={emoji.id}\n                  value={emoji.name}\n                  onClick={() => insertEmoji(editor, emoji)}\n                >\n                  {emoji.skins[0].native} {emoji.name}\n                </InlineComboboxItem>\n              ))}\n            </InlineComboboxGroup>\n          </InlineComboboxContent>\n        </InlineCombobox>\n\n        {children}\n      </PlateElement>\n    );\n  }\n);\n",
       "path": "plate-ui/emoji-input-element.tsx",
       "target": "components/plate-ui/emoji-input-element.tsx",
       "type": "registry:ui"