Spaces:
Build error
Build error
File size: 1,928 Bytes
a8b3f00 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 |
'use client'
import type { FC } from 'react'
import React, { useCallback, useState } from 'react'
import { useTranslation } from 'react-i18next'
import s from './style.module.css'
import EmojiPickerInner from './Inner'
import cn from '@/utils/classnames'
import Divider from '@/app/components/base/divider'
import Button from '@/app/components/base/button'
import Modal from '@/app/components/base/modal'
type IEmojiPickerProps = {
isModal?: boolean
onSelect?: (emoji: string, background: string) => void
onClose?: () => void
className?: string
}
const EmojiPicker: FC<IEmojiPickerProps> = ({
isModal = true,
onSelect,
onClose,
className,
}) => {
const { t } = useTranslation()
const [selectedEmoji, setSelectedEmoji] = useState('')
const [selectedBackground, setSelectedBackground] = useState<string>()
const handleSelectEmoji = useCallback((emoji: string, background: string) => {
setSelectedEmoji(emoji)
setSelectedBackground(background)
}, [setSelectedEmoji, setSelectedBackground])
return isModal
? <Modal
onClose={() => { }}
isShow
closable={false}
wrapperClassName={className}
className={cn(s.container, '!w-[362px] !p-0')}
>
<EmojiPickerInner
className="pt-3"
onSelect={handleSelectEmoji} />
<Divider className='m-0' />
<div className='w-full flex items-center justify-center p-3 gap-2'>
<Button className='w-full' onClick={() => {
onClose && onClose()
}}>
{t('app.iconPicker.cancel')}
</Button>
<Button
disabled={selectedEmoji === '' || !selectedBackground}
variant="primary"
className='w-full'
onClick={() => {
onSelect && onSelect(selectedEmoji, selectedBackground!)
}}>
{t('app.iconPicker.ok')}
</Button>
</div>
</Modal>
: <></>
}
export default EmojiPicker
|