Skip to content

Commit

Permalink
Merge pull request #3479 from udecode/registry
Browse files Browse the repository at this point in the history 
Update Registry
  • Loading branch information
@zbeyens
zbeyens authored Aug 30, 2024
2 parents 949a602 + e3f9e34 commit 0c89fa8
Show file tree
Hide file tree
Showing 5 changed files with 198 additions and 198 deletions.
2 changes: 1 addition & 1 deletion apps/www/public/registry/styles/default/cursor-overlay.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
"dependencies": [],
"files": [
{
"content": "import React from 'react';\n\nimport { cn } from '@udecode/cn';\nimport { useEditorRef } from '@udecode/plate-core/react';\nimport {\n type CursorData,\n CursorOverlay as CursorOverlayPrimitive,\n type CursorOverlayProps,\n type CursorProps,\n} from '@udecode/plate-cursor';\n\nimport { DragOverCursorPlugin } from '@/lib/plate/demo/plugins/DragOverCursorPlugin';\n\nexport function Cursor({\n caretPosition,\n classNames,\n data,\n disableCaret,\n disableSelection,\n selectionRects,\n}: CursorProps<CursorData>) {\n const { style, selectionStyle = style } = data ?? {};\n\n return (\n <>\n {!disableSelection &&\n selectionRects.map((position, i) => (\n <div\n className={cn(\n 'pointer-events-none absolute z-10 opacity-30',\n classNames?.selectionRect\n )}\n key={i}\n style={{\n ...selectionStyle,\n ...position,\n }}\n />\n ))}\n {!disableCaret && caretPosition && (\n <div\n className={cn(\n 'pointer-events-none absolute z-10 w-0.5',\n classNames?.caret\n )}\n style={{ ...caretPosition, ...style }}\n />\n )}\n </>\n );\n}\n\nexport function CursorOverlay({ cursors, ...props }: CursorOverlayProps) {\n const editor = useEditorRef();\n const dynamicCursors = editor.useOption(DragOverCursorPlugin, 'cursors');\n\n const allCursors = { ...cursors, ...dynamicCursors };\n\n return (\n <CursorOverlayPrimitive\n {...props}\n cursors={allCursors}\n onRenderCursor={Cursor}\n />\n );\n}\n",
"content": "import React from 'react';\n\nimport { cn } from '@udecode/cn';\nimport {\n createPlatePlugin,\n findEventRange,\n useEditorRef,\n} from '@udecode/plate-common/react';\nimport {\n type CursorData,\n CursorOverlay as CursorOverlayPrimitive,\n type CursorOverlayProps,\n type CursorProps,\n type CursorState,\n} from '@udecode/plate-cursor';\nimport { DndPlugin } from '@udecode/plate-dnd';\n\nexport function Cursor({\n caretPosition,\n classNames,\n data,\n disableCaret,\n disableSelection,\n selectionRects,\n}: CursorProps<CursorData>) {\n const { style, selectionStyle = style } = data ?? ({} as CursorData);\n\n return (\n <>\n {!disableSelection &&\n selectionRects.map((position, i) => (\n <div\n className={cn(\n 'pointer-events-none absolute z-10 opacity-30',\n classNames?.selectionRect\n )}\n key={i}\n style={{\n ...selectionStyle,\n ...position,\n }}\n />\n ))}\n {!disableCaret && caretPosition && (\n <div\n className={cn(\n 'pointer-events-none absolute z-10 w-0.5',\n classNames?.caret\n )}\n style={{ ...caretPosition, ...style }}\n />\n )}\n </>\n );\n}\n\nexport function CursorOverlay({ cursors, ...props }: CursorOverlayProps) {\n const editor = useEditorRef();\n const dynamicCursors = editor.useOption(DragOverCursorPlugin, 'cursors');\n\n const allCursors = { ...cursors, ...dynamicCursors };\n\n return (\n <CursorOverlayPrimitive\n {...props}\n cursors={allCursors}\n onRenderCursor={Cursor}\n />\n );\n}\n\nconst DragOverCursorPlugin = createPlatePlugin({\n handlers: {\n onDragEnd: ({ editor, plugin }) => {\n editor.setOption(plugin, 'cursors', {});\n },\n onDragLeave: ({ editor, plugin }) => {\n editor.setOption(plugin, 'cursors', {});\n },\n onDragOver: ({ editor, event, plugin }) => {\n if (editor.getOptions(DndPlugin).isDragging) return;\n\n const range = findEventRange(editor, event);\n\n if (!range) return;\n\n editor.setOption(plugin, 'cursors', {\n drag: {\n data: {\n style: {\n backgroundColor: 'hsl(222.2 47.4% 11.2%)',\n width: 3,\n },\n },\n key: 'drag',\n selection: range,\n },\n });\n },\n onDrop: ({ editor, plugin }) => {\n editor.setOption(plugin, 'cursors', {});\n },\n },\n key: 'dragOverCursor',\n options: { cursors: {} as Record<string, CursorState<CursorData>> },\n});\n",
"name": "cursor-overlay.tsx"
}
],
Expand Down
2 changes: 1 addition & 1 deletion apps/www/public/registry/styles/default/emoji-input-element.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
],
"files": [
{
"content": "import React, { useMemo, useState } from 'react';\n\nimport { withRef } from '@udecode/cn';\nimport { PlateElement } from '@udecode/plate-common/react';\nimport { EmojiInlineIndexSearch, insertEmoji } from '@udecode/plate-emoji';\n\nimport { useDebounce } from '@/hooks/use-debounce';\n\nimport {\n InlineCombobox,\n InlineComboboxContent,\n InlineComboboxEmpty,\n InlineComboboxInput,\n InlineComboboxItem,\n} from './inline-combobox';\n\nexport const EmojiInputElement = withRef<typeof PlateElement>(\n ({ className, ...props }, ref) => {\n const { children, editor, element } = props;\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()\n .search(debouncedValue.replace(/:$/, ''))\n .get();\n }, [debouncedValue]);\n\n return (\n <PlateElement\n as=\"span\"\n data-slate-value={element.value}\n ref={ref}\n {...props}\n >\n <InlineCombobox\n element={element}\n filter={false}\n hideWhenNoValue\n setValue={setValue}\n trigger=\":\"\n value={value}\n >\n <InlineComboboxInput />\n\n <InlineComboboxContent>\n {!isPending && (\n <InlineComboboxEmpty>No matching emoji found</InlineComboboxEmpty>\n )}\n\n {filteredEmojis.map((emoji) => (\n <InlineComboboxItem\n key={emoji.id}\n onClick={() => insertEmoji(editor, emoji)}\n value={emoji.name}\n >\n {emoji.skins[0].native} {emoji.name}\n </InlineComboboxItem>\n ))}\n </InlineComboboxContent>\n </InlineCombobox>\n\n {children}\n </PlateElement>\n );\n }\n);\n",
"content": "import React, { useMemo, useState } from 'react';\n\nimport { withRef } from '@udecode/cn';\nimport { PlateElement } from '@udecode/plate-common/react';\nimport { EmojiInlineIndexSearch, insertEmoji } from '@udecode/plate-emoji';\n\nimport {\n InlineCombobox,\n InlineComboboxContent,\n InlineComboboxEmpty,\n InlineComboboxInput,\n InlineComboboxItem,\n} from './inline-combobox';\n\nexport const EmojiInputElement = withRef<typeof PlateElement>(\n ({ className, ...props }, ref) => {\n const { children, editor, element } = props;\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()\n .search(debouncedValue.replace(/:$/, ''))\n .get();\n }, [debouncedValue]);\n\n return (\n <PlateElement\n as=\"span\"\n data-slate-value={element.value}\n ref={ref}\n {...props}\n >\n <InlineCombobox\n element={element}\n filter={false}\n hideWhenNoValue\n setValue={setValue}\n trigger=\":\"\n value={value}\n >\n <InlineComboboxInput />\n\n <InlineComboboxContent>\n {!isPending && (\n <InlineComboboxEmpty>No matching emoji found</InlineComboboxEmpty>\n )}\n\n {filteredEmojis.map((emoji) => (\n <InlineComboboxItem\n key={emoji.id}\n onClick={() => insertEmoji(editor, emoji)}\n value={emoji.name}\n >\n {emoji.skins[0].native} {emoji.name}\n </InlineComboboxItem>\n ))}\n </InlineComboboxContent>\n </InlineCombobox>\n\n {children}\n </PlateElement>\n );\n }\n);\n\nconst useDebounce = (value: any, delay = 500) => {\n const [debouncedValue, setDebouncedValue] = React.useState(value);\n\n React.useEffect(() => {\n const handler: NodeJS.Timeout = setTimeout(() => {\n setDebouncedValue(value);\n }, delay);\n\n // Cancel the timeout if value changes (also on delay change or unmount)\n return () => {\n clearTimeout(handler);\n };\n }, [value, delay]);\n\n return debouncedValue;\n};\n",
"name": "emoji-input-element.tsx"
}
],
Expand Down
2 changes: 1 addition & 1 deletion apps/www/public/registry/styles/default/mention-input-element.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
],
"files": [
{
"content": "import React, { useState } from 'react';\n\nimport { cn, withRef } from '@udecode/cn';\nimport { PlateElement } from '@udecode/plate-common/react';\nimport { getMentionOnSelectItem } from '@udecode/plate-mention';\n\nimport { MENTIONABLES } from '@/lib/plate/demo/values/mentionables';\n\nimport {\n InlineCombobox,\n InlineComboboxContent,\n InlineComboboxEmpty,\n InlineComboboxInput,\n InlineComboboxItem,\n} from './inline-combobox';\n\nconst onSelectItem = getMentionOnSelectItem();\n\nexport const MentionInputElement = withRef<typeof PlateElement>(\n ({ className, ...props }, ref) => {\n const { children, editor, element } = props;\n const [search, setSearch] = useState('');\n\n return (\n <PlateElement\n as=\"span\"\n data-slate-value={element.value}\n ref={ref}\n {...props}\n >\n <InlineCombobox\n element={element}\n setValue={setSearch}\n showTrigger={false}\n trigger=\"@\"\n value={search}\n >\n <span\n className={cn(\n 'inline-block rounded-md bg-muted px-1.5 py-0.5 align-baseline text-sm ring-ring focus-within:ring-2',\n className\n )}\n >\n <InlineComboboxInput />\n </span>\n\n <InlineComboboxContent className=\"my-1.5\">\n <InlineComboboxEmpty>No results found</InlineComboboxEmpty>\n\n {MENTIONABLES.map((item) => (\n <InlineComboboxItem\n key={item.key}\n onClick={() => onSelectItem(editor, item, search)}\n value={item.text}\n >\n {item.text}\n </InlineComboboxItem>\n ))}\n </InlineComboboxContent>\n </InlineCombobox>\n\n {children}\n </PlateElement>\n );\n }\n);\n",
"content": "import React, { useState } from 'react';\n\nimport { cn, withRef } from '@udecode/cn';\nimport { PlateElement } from '@udecode/plate-common/react';\nimport { getMentionOnSelectItem } from '@udecode/plate-mention';\n\nimport {\n InlineCombobox,\n InlineComboboxContent,\n InlineComboboxEmpty,\n InlineComboboxInput,\n InlineComboboxItem,\n} from './inline-combobox';\n\nconst onSelectItem = getMentionOnSelectItem();\n\nexport const MentionInputElement = withRef<typeof PlateElement>(\n ({ className, ...props }, ref) => {\n const { children, editor, element } = props;\n const [search, setSearch] = useState('');\n\n return (\n <PlateElement\n as=\"span\"\n data-slate-value={element.value}\n ref={ref}\n {...props}\n >\n <InlineCombobox\n element={element}\n setValue={setSearch}\n showTrigger={false}\n trigger=\"@\"\n value={search}\n >\n <span\n className={cn(\n 'inline-block rounded-md bg-muted px-1.5 py-0.5 align-baseline text-sm ring-ring focus-within:ring-2',\n className\n )}\n >\n <InlineComboboxInput />\n </span>\n\n <InlineComboboxContent className=\"my-1.5\">\n <InlineComboboxEmpty>No results found</InlineComboboxEmpty>\n\n {MENTIONABLES.map((item) => (\n <InlineComboboxItem\n key={item.key}\n onClick={() => onSelectItem(editor, item, search)}\n value={item.text}\n >\n {item.text}\n </InlineComboboxItem>\n ))}\n </InlineComboboxContent>\n </InlineCombobox>\n\n {children}\n </PlateElement>\n );\n }\n);\n\nexport const MENTIONABLES = [\n { key: '0', text: 'Aayla Secura' },\n { key: '1', text: 'Adi Gallia' },\n {\n key: '2',\n text: 'Admiral Dodd Rancit',\n },\n {\n key: '3',\n text: 'Admiral Firmus Piett',\n },\n {\n key: '4',\n text: 'Admiral Gial Ackbar',\n },\n { key: '5', text: 'Admiral Ozzel' },\n { key: '6', text: 'Admiral Raddus' },\n {\n key: '7',\n text: 'Admiral Terrinald Screed',\n },\n { key: '8', text: 'Admiral Trench' },\n {\n key: '9',\n text: 'Admiral U.O. Statura',\n },\n { key: '10', text: 'Agen Kolar' },\n { key: '11', text: 'Agent Kallus' },\n {\n key: '12',\n text: 'Aiolin and Morit Astarte',\n },\n { key: '13', text: 'Aks Moe' },\n { key: '14', text: 'Almec' },\n { key: '15', text: 'Alton Kastle' },\n { key: '16', text: 'Amee' },\n { key: '17', text: 'AP-5' },\n { key: '18', text: 'Armitage Hux' },\n { key: '19', text: 'Artoo' },\n { key: '20', text: 'Arvel Crynyd' },\n { key: '21', text: 'Asajj Ventress' },\n { key: '22', text: 'Aurra Sing' },\n { key: '23', text: 'AZI-3' },\n { key: '24', text: 'Bala-Tik' },\n { key: '25', text: 'Barada' },\n { key: '26', text: 'Bargwill Tomder' },\n { key: '27', text: 'Baron Papanoida' },\n { key: '28', text: 'Barriss Offee' },\n { key: '29', text: 'Baze Malbus' },\n { key: '30', text: 'Bazine Netal' },\n { key: '31', text: 'BB-8' },\n { key: '32', text: 'BB-9E' },\n { key: '33', text: 'Ben Quadinaros' },\n { key: '34', text: 'Berch Teller' },\n { key: '35', text: 'Beru Lars' },\n { key: '36', text: 'Bib Fortuna' },\n {\n key: '37',\n text: 'Biggs Darklighter',\n },\n { key: '38', text: 'Black Krrsantan' },\n { key: '39', text: 'Bo-Katan Kryze' },\n { key: '40', text: 'Boba Fett' },\n { key: '41', text: 'Bobbajo' },\n { key: '42', text: 'Bodhi Rook' },\n { key: '43', text: 'Borvo the Hutt' },\n { key: '44', text: 'Boss Nass' },\n { key: '45', text: 'Bossk' },\n {\n key: '46',\n text: 'Breha Antilles-Organa',\n },\n { key: '47', text: 'Bren Derlin' },\n { key: '48', text: 'Brendol Hux' },\n { key: '49', text: 'BT-1' },\n];\n",
"name": "mention-input-element.tsx"
}
],
Expand Down
Loading

0 comments on commit 0c89fa8

Please sign in to comment.