diff --git a/README.md b/README.md
index 02d4e3d..9ac60dc 100644
--- a/README.md
+++ b/README.md
@@ -45,6 +45,8 @@ export default function App() {
| open | boolean | false | yes | Opens modal picker |
| onClose | function | undefined | yes | Request close modal *runs when onEmojiSelected or backdrop pressed* |
| emojiSize | number | 28 | no | Custom emoji size |
+| enableRecentlyUsed | boolean | false | no | Enable recently used emojis in categories |
+| categoryPosition | 'floating' \| 'top' \| 'bottom' | 'floating' | no | Specify category container position |
| headerStyles | TextStyle | {} | no | Override category name styles |
| knobStyles | ViewStyle | {} | no | Override knob styles |
| containerStyles | ViewStyle | {} | no | Override container styles |
@@ -60,7 +62,6 @@ export default function App() {
| onCategoryChangeFailed | function | warn(info) | no | Callback on category change failed (info: {index, highestMeasuredFrameIndex, averageItemLength}) |
| translation | CategoryTranslation | en | no | Translation object *see translation section* |
| disabledCategory | CategoryTypes[] | [] | no | Hide categories by passing their slugs |
-| categoryPosition | CategoryPosition | categoryPosition | no | Specify category container position |
## 📊 Comparison
@@ -119,6 +120,8 @@ You can clone the repo and run `yarn example ios` or `yarn example android` to p
![Preview](/example/assets/static-modal-preview.jpg)
### [Static](/example/src/Static/Static.tsx)
![Preview](/example/assets/static-preview.jpg)
+### [Recently used](/example/src/EnableRecently/EnableRecently.tsx)
+![Preview](/example/assets/enable-recently-used-preview.jpg)
### [Categories Top](/example/src/TopCategory/TopCategory.tsx)
![Preview](/example/assets/categories-top-preview.jpg)
### [Categories Bottom](/example/src/BottomCategory/BottomCategory.tsx)
diff --git a/example/assets/enable-recently-used-preview.jpg b/example/assets/enable-recently-used-preview.jpg
new file mode 100644
index 0000000..b4461b9
Binary files /dev/null and b/example/assets/enable-recently-used-preview.jpg differ
diff --git a/example/src/App.tsx b/example/src/App.tsx
index 320eeab..673a137 100644
--- a/example/src/App.tsx
+++ b/example/src/App.tsx
@@ -9,6 +9,7 @@ import Translated from './Translated/Translated';
import DisabledCategories from './DisabledCategories/DisabledCategories';
import StaticModal from './StaticModal/StaticModal';
import Static from './Static/Static';
+import EnableRecently from './EnableRecently/EnableRecently';
import TopCategory from './TopCategory/TopCategory';
import BottomCategory from './BottomCategory/BottomCategory';
@@ -19,7 +20,10 @@ export default () => {
+
+
+
{
/>
-
-
);
diff --git a/example/src/EnableRecently/EnableRecently.tsx b/example/src/EnableRecently/EnableRecently.tsx
new file mode 100644
index 0000000..6ab7d68
--- /dev/null
+++ b/example/src/EnableRecently/EnableRecently.tsx
@@ -0,0 +1,44 @@
+import * as React from 'react';
+import { StyleSheet, Text, TouchableOpacity } from 'react-native';
+import { SafeAreaView } from 'react-native-safe-area-context';
+import EmojiPicker from 'rn-emoji-keyboard';
+import type { EmojiType } from 'src/types';
+
+const EnableRecently = () => {
+ const [result, setResult] = React.useState();
+ const [isModalOpen, setIsModalOpen] = React.useState(false);
+
+ const handlePick = (emoji: EmojiType) => {
+ console.log(emoji);
+ setResult(emoji.emoji);
+ setIsModalOpen((prev) => !prev);
+ };
+ return (
+
+ Result: {result}
+ setIsModalOpen(true)}>
+ Open
+
+
+ setIsModalOpen(false)}
+ enableRecentlyUsed
+ />
+
+ );
+};
+
+const styles = StyleSheet.create({
+ container: {
+ flex: 1,
+ },
+ text: {
+ textAlign: 'center',
+ margin: 64,
+ fontSize: 18,
+ },
+});
+
+export default EnableRecently;
diff --git a/example/src/Examples/Examples.tsx b/example/src/Examples/Examples.tsx
index 675a11a..f3af438 100644
--- a/example/src/Examples/Examples.tsx
+++ b/example/src/Examples/Examples.tsx
@@ -11,6 +11,7 @@ type RootStackParamList = {
DisabledCategories: undefined;
StaticModal: undefined;
Static: undefined;
+ EnableRecently: undefined;
TopCategory: undefined;
BottomCategory: undefined;
};
@@ -39,6 +40,10 @@ const Examples = ({ navigation }: Props) => {
title="Static Component"
onPress={() => navigation.navigate('Static')}
/>
+