Emoji Picker component for React Applications on the web
74
{
"context": "This evaluation assesses how effectively the engineer uses the emoji-picker-react package's theming capabilities to implement a themed emoji picker component. The focus is exclusively on proper usage of the package's theme-related features and core emoji selection functionality.",
"type": "weighted_checklist",
"checklist": [
{
"name": "EmojiPicker Component Import",
"description": "Correctly imports the EmojiPicker component from emoji-picker-react package",
"max_score": 10
},
{
"name": "Theme Enum Import",
"description": "Imports and uses the Theme enum from emoji-picker-react (e.g., Theme.LIGHT, Theme.DARK, Theme.AUTO)",
"max_score": 15
},
{
"name": "Theme Prop Usage",
"description": "Uses the 'theme' prop on the EmojiPicker component to pass the selected theme value",
"max_score": 20
},
{
"name": "Light Theme Implementation",
"description": "Correctly implements light theme mode using Theme.LIGHT value",
"max_score": 10
},
{
"name": "Dark Theme Implementation",
"description": "Correctly implements dark theme mode using Theme.DARK value",
"max_score": 10
},
{
"name": "Auto Theme Implementation",
"description": "Correctly implements auto/system theme mode using Theme.AUTO value",
"max_score": 10
},
{
"name": "onEmojiClick Handler",
"description": "Uses the onEmojiClick prop to handle emoji selection events from the EmojiPicker component",
"max_score": 15
},
{
"name": "EmojiClickData Usage",
"description": "Accesses the emoji property from the EmojiClickData object passed to the onEmojiClick callback to get the selected emoji character",
"max_score": 10
}
]
}Install with Tessl CLI
npx tessl i tessl/npm-emoji-picker-reactevals
scenario-1
scenario-2
scenario-3
scenario-4
scenario-5
scenario-6
scenario-7
scenario-8
scenario-9
scenario-10