mistercrunch opened a new pull request, #36417: URL: https://github.com/apache/superset/pull/36417
## Summary Introduces a new `EmojiTextArea` component with Slack-like emoji autocomplete behavior for use in text input areas throughout Superset. ### Key Features: - Triggers on `:` prefix with 2+ character minimum (configurable via `minCharsBeforePopup`) - Smart trigger detection: colon must be preceded by whitespace, start of text, or another emoji (prevents false positives like URLs `http://example.com`) - Prevents accidental Enter key selection when typing quickly after colon - Includes 400+ curated emojis with shortcodes and keyword search - Fully typed with TypeScript ### Usage: ```tsx import { EmojiTextArea } from '@superset-ui/core/components'; <EmojiTextArea placeholder="Type :smile: to add emojis..." onChange={(text) => console.log(text)} onEmojiSelect={(emoji) => console.log('Selected:', emoji)} minCharsBeforePopup={2} // default maxSuggestions={10} // default /> ``` ### Trigger Behavior (Slack-like): | Input | Shows Popup? | Reason | |-------|-------------|--------| | `:sm` | Yes | Start of text | | `hello :sm` | Yes | After space | | `😀:sm` | Yes | After emoji | | `hello:sm` | No | No space before colon | | `:s` | No | Only 1 character | ## BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF Component demonstrated in Storybook - see `EmojiTextArea.stories.tsx` ## TESTING INSTRUCTIONS 1. Run tests: `npm run test -- --testPathPatterns=EmojiTextArea` 2. Run Storybook: `npm run storybook` and navigate to Components > EmojiTextArea 3. Try typing `:sm` to see emoji suggestions 4. Verify popup doesn't appear for `hello:sm` (no space before colon) ## ADDITIONAL INFORMATION - [ ] Has associated issue: N/A (new feature) - [x] Required feature flags: None - [x] Changes UI: Yes (new component) - [ ] Includes DB Migration: No - [ ] Changes API: No 🤖 Generated with [Claude Code](https://claude.com/claude-code) -- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. To unsubscribe, e-mail: [email protected] For queries about this service, please contact Infrastructure at: [email protected] --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
