Emoji Picker

About this piece

Inline :shortcode typing with an autocomplete dropdown showing emoji previews.

Usage

The import and the props worth knowing about, in one place.

import { Editor33 } from "@/components/beste/piece/editor33";

<Editor33
  query=":fi"
  items={[
    {
      "shortcode": ":fire:",
      "emoji": "🔥",
      "active": true
    },
    {
      "shortcode": ":finish_line:",
      "emoji": "🏁"
    },
    {
      "shortcode": ":first_place:",
      "emoji": "🥇"
    },
    {
      "shortcode": ":fish:",
      "emoji": "🐟"
    }
  ]}
  bordered={false}
/>

More Editor pieces

View all Editor

user.

idstring
namestring
emailstring
save(): Promise<void>

const greet = (name: string) => `Hello, ${name}!`;

1function·greet(name)·{
2→return·`Hello,·${name}!`;
3}

Launch Checklist

Ship with confidence by running through the five-point review.

Verify preview URL
Run smoke suite
Tag the release

1--primary:  #f43f5e;
2--accent:  #8b5cf6;
3--surface:  #0ea5e9;

const msg = greet("Beste");

function greet(name: string): string

Returns a localized greeting for the given name.