Ling0925
/
buster
mirror of https://github.com/buster-so/buster.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

pass as ref or function

This commit is contained in:
Nate Kelley 2025-09-30 15:39:18 -06:00
parent 12b534db2a
commit 5ada81129b
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
2 changed files with 10 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
apps/web/src/components/ui/inputs/MentionInput/MentionInput.stories.tsx
View File

@ -100,7 +100,8 @@ const arthurCharacters: MentionInputTriggerItem[] = [
const looneyTunesSuggestions = createMentionSuggestionExtension({
trigger: '@',
items: looneyTunesCharacters,
items: ({ defaultQueryMentionsFilter, query }) =>
defaultQueryMentionsFilter(query, looneyTunesCharacters),
popoverContent: (props) => {
return <div className="p-2">Hello {props.value}</div>;
},
@ -158,7 +159,8 @@ const theSimpsonsCharacters: MentionInputTriggerItem[] = [
const theSimpsonsSuggestions = createMentionSuggestionExtension({
trigger: '#',
items: theSimpsonsCharacters,
items: ({ defaultQueryMentionsFilter, query }) =>
defaultQueryMentionsFilter(query, theSimpsonsCharacters),
pillStyling: {
className: () => {
return 'bg-blue-100 border-blue-300 text-blue-500 hover:bg-blue-200';
@ -171,7 +173,8 @@ const theSimpsonsSuggestions = createMentionSuggestionExtension({
const arthurSuggestions = createMentionSuggestionExtension({
trigger: '$',
items: arthurCharacters,
items: ({ defaultQueryMentionsFilter, query }) =>
defaultQueryMentionsFilter(query, arthurCharacters),
pillStyling: {
className: () => {
return 'bg-green-100 border-green-300 text-green-500 hover:bg-green-200';
@ -284,7 +287,8 @@ const manyCharacters: MentionInputTriggerItem[] = [
const spongebobSuggestions = createMentionSuggestionExtension({
trigger: '%',
items: manyCharacters,
items: ({ defaultQueryMentionsFilter, query }) =>
defaultQueryMentionsFilter(query, manyCharacters),
pillStyling: {
className: () => {
return 'bg-yellow-100 border-yellow-300 text-yellow-500 hover:bg-yellow-200';

4
apps/web/src/components/ui/inputs/MentionInput/createMentionSuggestionOption.tsx
View File

@ -21,7 +21,7 @@ export const createMentionSuggestionExtension = ({
}: {
trigger: string;
items:
| MentionInputTriggerItem[]
| React.RefObject<MentionInputTriggerItem[]>
| ((props: {
query: string;
defaultQueryMentionsFilter: typeof defaultQueryMentionsFilter;
@ -37,7 +37,7 @@ export const createMentionSuggestionExtension = ({
? (props) => {
return items({ ...props, defaultQueryMentionsFilter });
}
: ({ query }) => defaultQueryMentionsFilter(query, items),
: ({ query }) => defaultQueryMentionsFilter(query, items.current),
render: () => {
let component: ReactRenderer<MentionListImperativeHandle, MentionListProps<string>>;