Skip to content

Commit

Permalink
fix(missive#872): When you slide the scroll bar very fast, the icon b…
Browse files Browse the repository at this point in the history
…elow cannot be rendered.
  • Loading branch information
liukai committed Mar 15, 2024
1 parent 21a2708 commit 7c9ccf8
Show file tree
Hide file tree
Showing 4 changed files with 16 additions and 2 deletions.
3 changes: 2 additions & 1 deletion packages/emoji-mart/src/components/Emoji/Emoji.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { Data } from '../../config'
import { SearchIndex } from '../../helpers'
import { SearchIndex, UserAgent } from '../../helpers'

export default function Emoji(props) {
let { id, skin, emoji } = props
Expand Down Expand Up @@ -50,6 +50,7 @@ export default function Emoji(props) {
<span
style={{
fontSize: props.size,
backfaceVisibility: UserAgent.isMacOs && UserAgent.chromeVersion > 0 && UserAgent.chromeVersion < 121 ? 'hidden': undefined,
fontFamily:
'"EmojiMart", "Segoe UI Emoji", "Segoe UI Symbol", "Segoe UI", "Apple Color Emoji", "Twemoji Mozilla", "Noto Color Emoji", "Android Emoji"',
}}
Expand Down
3 changes: 2 additions & 1 deletion packages/emoji-mart/src/components/Picker/Picker.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { Component, createRef } from 'preact'

import { deepEqual, sleep, getEmojiData } from '../../utils'
import { Data, I18n, init } from '../../config'
import { SearchIndex, Store, FrequentlyUsed } from '../../helpers'
import { SearchIndex, Store, FrequentlyUsed, UserAgent } from '../../helpers'
import Icons from '../../icons'

import { Emoji } from '../Emoji'
Expand Down Expand Up @@ -782,6 +782,7 @@ export default class Picker extends Component {
aria-hidden="true"
class="background"
style={{
backfaceVisibility: UserAgent.isMacOs && UserAgent.chromeVersion > 0 && UserAgent.chromeVersion < 121 ? 'hidden': undefined,
borderRadius: this.props.emojiButtonRadius,
backgroundColor: this.props.emojiButtonColors
? this.props.emojiButtonColors[
Expand Down
1 change: 1 addition & 0 deletions packages/emoji-mart/src/helpers/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ export { default as Store } from './store'
export { default as NativeSupport } from './native-support'
export { default as FrequentlyUsed } from './frequently-used'
export { default as SearchIndex } from './search-index'
export { default as UserAgent } from './user-agent'

export const SafeFlags = [
'checkered_flag',
Expand Down
11 changes: 11 additions & 0 deletions packages/emoji-mart/src/helpers/user-agent.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
const agent: string = window.navigator.userAgent.toLowerCase()

const isMacOs: boolean = agent.indexOf('mac') !== -1
const isChrome: boolean = agent.indexOf('chrome') > -1
const chromeVersion: number = isChrome ? parseInt(agent.match(/chrome\/(\d{2})/)[1]) : 0

export default {
isMacOs,
isChrome,
chromeVersion,
}

0 comments on commit 7c9ccf8

Please sign in to comment.