Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Relative Positioning

The picker accepts a “position” an option specifying where the picker should be positioned, relative to the reference element passed to showPicker or togglePicker. This property can be any of the following values:

auto, auto-start, auto-end, top, top-start, top-end, bottom, bottom-start, bottom-end, right, right-start, right-end, left, left-start, left-end

See the Javascript Popper library documentation for a list of valid relative position values.

Fixed Positioning

A fixed position can also be given for the position option. In this case, position is an object with top, bottom, left, and/or right properties.

...

Name

Type (default value)

Description

autoHide

Boolean (true)

Whether or not the picker should be automatically hidden when an emoji is selected.

categories

String Array (all categories)

An array of the emoji categories to include in the picker. Valid values are: smileys, people, animals, food, activities, travel, objects, symbols, flags

emojiSize

String (“1.8em”)

The CSS size to use for the emoji icons.

emojiVersion

String (“12.1”)

The Unicode version of the Emoji specification to use. Valid values are: 1.0, 2.0, 3.0, 4.0, 5.0, 11.0, 12.0, 12.1

initialCategory

String (“smileys”)

The ID of the category to show initially when the picker is shown.

recentsCount

Number (50)

The number of recent emojis to save.

rootElement

HTML DOM Element

The root DOM node to attach the picker element to.

rows

Number (6)

The number of visible rows in the picker.

showCategoryButtons

Boolean (true)

Whether or not to show the category buttons.

showSearch

Boolean (true)

Whether or not to show the search field.

showRecents

Boolean (true)

Whether or not to show (and save) recently selected emojis.

showVariants

Boolean (true)

Whether or not to support emoji skin tone variants.

zIndex

Number

If specified, sets the Z-index for the emoji picker element.

APIs

Method

Params

Description

destroyPicker

-

Destroys the picker and removes it from the DOM. You will no longer be able to show the picker after it is destroyed.

hidePicker

-

Hides the picker.

isPickerVisible

-

Returns true if the picker is currently visible, false if not.

off

String event, function callback

Removes the given listener for the given event.

on

String event, function callback

Adds a listener for the given event.

showPicker

HTML DOM Reference Element

Shows the picker, positioning it relative to the given reference element.

togglePicker

HTML DOM Reference Element

If it is hidden it shows the picker, otherwise hides it if it is visible.