emoji-picker-react@4.8.0

ealush · Feb 22, 2024 · 42fc3c3 · 42fc3c3
1 parent ca214df
commit 42fc3c3
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 5 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -10,7 +10,7 @@
   },
   "dependencies": {
     "@vercel/analytics": "^1.1.1",
-    "emoji-picker-react": "^4.7.18",
+    "emoji-picker-react": "^4.8.0",
     "next": "13.5.6",
     "react": "^18",
     "react-dom": "^18"

diff --git a/src/components/PickerControls.tsx b/src/components/PickerControls.tsx
@@ -80,6 +80,12 @@ export function PickerControls({
           updateState("reactionsDefaultOpen", reactionsDefaultOpen)
         }
       />
+      <ChkAllowExpandReactions
+        allowExpandReactions={pickerProps.allowExpandReactions}
+        setAllowExpandReactions={(allowExpandReactions) =>
+          updateState("allowExpandReactions", allowExpandReactions)
+        }
+      />
       <div className={styles.spacer} />
       <button onClick={reset} className={styles.ButtonReset}>
         Reset
@@ -327,3 +333,21 @@ function ChkReactions({
     </Label>
   );
 }
+
+function ChkAllowExpandReactions({
+  allowExpandReactions,
+  setAllowExpandReactions,
+}: {
+  allowExpandReactions?: boolean;
+  setAllowExpandReactions: (allowExpandReactions: boolean) => void;
+}) {
+  return (
+    <Label text="Allow Expand Reactions">
+      <input
+        type="checkbox"
+        checked={allowExpandReactions}
+        onChange={(e) => setAllowExpandReactions(e.target.checked)}
+      />
+    </Label>
+  );
+}
diff --git a/src/components/PickerDemo.tsx b/src/components/PickerDemo.tsx
@@ -17,6 +17,7 @@ const DEFAULT_THEME = Theme.AUTO;
 const DEFAULT_SUGGESTED_EMOJIS_MODE = SuggestionMode.RECENT;
 const DEFAULT_HEIGHT = 450;
 const DEFAULT_WIDTH = 350;
+const DEFAULT_ALLOW_EXPAND_REACTIONS = true;
 const DEFAULT_SKIN_TONE_PICKER_LOCATION = SkinTonePickerLocation.SEARCH;
 
 export default function PickerDemo() {
@@ -92,4 +93,5 @@ const defaultProps = {
   height: DEFAULT_HEIGHT,
   width: DEFAULT_WIDTH,
   skinTonePickerLocation: DEFAULT_SKIN_TONE_PICKER_LOCATION,
+  allowExpandReactions: DEFAULT_ALLOW_EXPAND_REACTIONS,
 } as PickerProps;