migrated emoji picker to typescript
This commit is contained in:
ewwwwwwww
parent
4b7876f1a6
commit
eeb30b5492
|
|
@ -1,270 +0,0 @@
|
||||||
import classNames from 'classnames';
|
|
||||||
import { supportsPassiveEvents } from 'detect-passive-events';
|
|
||||||
import PropTypes from 'prop-types';
|
|
||||||
import React from 'react';
|
|
||||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
|
||||||
import { defineMessages, injectIntl } from 'react-intl';
|
|
||||||
import Overlay from 'react-overlays/lib/Overlay';
|
|
||||||
|
|
||||||
import { IconButton } from 'soapbox/components/ui';
|
|
||||||
|
|
||||||
import { buildCustomEmojis } from '../../emoji/emoji';
|
|
||||||
import { EmojiPicker as EmojiPickerAsync } from '../../ui/util/async-components';
|
|
||||||
|
|
||||||
const messages = defineMessages({
|
|
||||||
emoji: { id: 'emoji_button.label', defaultMessage: 'Insert emoji' },
|
|
||||||
emoji_search: { id: 'emoji_button.search', defaultMessage: 'Search…' },
|
|
||||||
emoji_not_found: { id: 'emoji_button.not_found', defaultMessage: 'No emoji\'s found.' },
|
|
||||||
custom: { id: 'emoji_button.custom', defaultMessage: 'Custom' },
|
|
||||||
recent: { id: 'emoji_button.recent', defaultMessage: 'Frequently used' },
|
|
||||||
search_results: { id: 'emoji_button.search_results', defaultMessage: 'Search results' },
|
|
||||||
people: { id: 'emoji_button.people', defaultMessage: 'People' },
|
|
||||||
nature: { id: 'emoji_button.nature', defaultMessage: 'Nature' },
|
|
||||||
food: { id: 'emoji_button.food', defaultMessage: 'Food & Drink' },
|
|
||||||
activity: { id: 'emoji_button.activity', defaultMessage: 'Activity' },
|
|
||||||
travel: { id: 'emoji_button.travel', defaultMessage: 'Travel & Places' },
|
|
||||||
objects: { id: 'emoji_button.objects', defaultMessage: 'Objects' },
|
|
||||||
symbols: { id: 'emoji_button.symbols', defaultMessage: 'Symbols' },
|
|
||||||
flags: { id: 'emoji_button.flags', defaultMessage: 'Flags' },
|
|
||||||
});
|
|
||||||
|
|
||||||
let EmojiPicker; // load asynchronously
|
|
||||||
|
|
||||||
const listenerOptions = supportsPassiveEvents ? { passive: true } : false;
|
|
||||||
|
|
||||||
@injectIntl
|
|
||||||
class EmojiPickerMenu extends React.PureComponent {
|
|
||||||
|
|
||||||
static propTypes = {
|
|
||||||
custom_emojis: ImmutablePropTypes.list,
|
|
||||||
frequentlyUsedEmojis: PropTypes.arrayOf(PropTypes.string),
|
|
||||||
loading: PropTypes.bool,
|
|
||||||
onClose: PropTypes.func.isRequired,
|
|
||||||
onPick: PropTypes.func.isRequired,
|
|
||||||
style: PropTypes.object,
|
|
||||||
placement: PropTypes.string,
|
|
||||||
arrowOffsetLeft: PropTypes.string,
|
|
||||||
arrowOffsetTop: PropTypes.string,
|
|
||||||
intl: PropTypes.object.isRequired,
|
|
||||||
skinTone: PropTypes.number.isRequired,
|
|
||||||
onSkinTone: PropTypes.func.isRequired,
|
|
||||||
};
|
|
||||||
|
|
||||||
static defaultProps = {
|
|
||||||
style: {},
|
|
||||||
loading: true,
|
|
||||||
frequentlyUsedEmojis: [],
|
|
||||||
};
|
|
||||||
|
|
||||||
state = {
|
|
||||||
modifierOpen: false,
|
|
||||||
placement: null,
|
|
||||||
};
|
|
||||||
|
|
||||||
handleDocumentClick = e => {
|
|
||||||
if (this.node && !this.node.contains(e.target)) {
|
|
||||||
this.props.onClose();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
componentDidMount() {
|
|
||||||
document.addEventListener('click', this.handleDocumentClick, false);
|
|
||||||
document.addEventListener('touchend', this.handleDocumentClick, listenerOptions);
|
|
||||||
}
|
|
||||||
|
|
||||||
componentWillUnmount() {
|
|
||||||
document.removeEventListener('click', this.handleDocumentClick, false);
|
|
||||||
document.removeEventListener('touchend', this.handleDocumentClick, listenerOptions);
|
|
||||||
}
|
|
||||||
|
|
||||||
setRef = c => {
|
|
||||||
this.node = c;
|
|
||||||
}
|
|
||||||
|
|
||||||
getI18n = () => {
|
|
||||||
const { intl } = this.props;
|
|
||||||
|
|
||||||
return {
|
|
||||||
search: intl.formatMessage(messages.emoji_search),
|
|
||||||
notfound: intl.formatMessage(messages.emoji_not_found),
|
|
||||||
categories: {
|
|
||||||
search: intl.formatMessage(messages.search_results),
|
|
||||||
recent: intl.formatMessage(messages.recent),
|
|
||||||
people: intl.formatMessage(messages.people),
|
|
||||||
nature: intl.formatMessage(messages.nature),
|
|
||||||
foods: intl.formatMessage(messages.food),
|
|
||||||
activity: intl.formatMessage(messages.activity),
|
|
||||||
places: intl.formatMessage(messages.travel),
|
|
||||||
objects: intl.formatMessage(messages.objects),
|
|
||||||
symbols: intl.formatMessage(messages.symbols),
|
|
||||||
flags: intl.formatMessage(messages.flags),
|
|
||||||
custom: intl.formatMessage(messages.custom),
|
|
||||||
},
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
handleClick = emoji => {
|
|
||||||
if (!emoji.native) {
|
|
||||||
emoji.native = emoji.shortcodes;
|
|
||||||
}
|
|
||||||
|
|
||||||
this.props.onClose();
|
|
||||||
this.props.onPick(emoji);
|
|
||||||
}
|
|
||||||
|
|
||||||
handleModifierOpen = () => {
|
|
||||||
this.setState({ modifierOpen: true });
|
|
||||||
}
|
|
||||||
|
|
||||||
handleModifierClose = () => {
|
|
||||||
this.setState({ modifierOpen: false });
|
|
||||||
}
|
|
||||||
|
|
||||||
handleModifierChange = modifier => {
|
|
||||||
this.props.onSkinTone(modifier);
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
const { loading, style, intl, custom_emojis, skinTone, frequentlyUsedEmojis } = this.props;
|
|
||||||
|
|
||||||
if (loading) {
|
|
||||||
return <div style={{ width: 299 }} />;
|
|
||||||
}
|
|
||||||
|
|
||||||
const title = intl.formatMessage(messages.emoji);
|
|
||||||
const { modifierOpen } = this.state;
|
|
||||||
const theme = 'dark';
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className={classNames('emoji-picker-dropdown__menu', { selecting: modifierOpen })} style={style} ref={this.setRef}>
|
|
||||||
<EmojiPicker
|
|
||||||
custom={[{ emojis: buildCustomEmojis(custom_emojis) }]}
|
|
||||||
title={title}
|
|
||||||
onEmojiSelect={this.handleClick}
|
|
||||||
recent={frequentlyUsedEmojis}
|
|
||||||
skin={skinTone}
|
|
||||||
perLine={8}
|
|
||||||
emojiSize={38}
|
|
||||||
emojiButtonSize={50}
|
|
||||||
navPosition={'bottom'}
|
|
||||||
theme={theme}
|
|
||||||
set={'twitter'}
|
|
||||||
previewEmoji={false}
|
|
||||||
autoFocus
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
export default @injectIntl
|
|
||||||
class EmojiPickerDropdown extends React.PureComponent {
|
|
||||||
|
|
||||||
static propTypes = {
|
|
||||||
custom_emojis: ImmutablePropTypes.list,
|
|
||||||
frequentlyUsedEmojis: PropTypes.arrayOf(PropTypes.string),
|
|
||||||
intl: PropTypes.object.isRequired,
|
|
||||||
onPickEmoji: PropTypes.func.isRequired,
|
|
||||||
onSkinTone: PropTypes.func.isRequired,
|
|
||||||
skinTone: PropTypes.number.isRequired,
|
|
||||||
};
|
|
||||||
|
|
||||||
state = {
|
|
||||||
active: false,
|
|
||||||
loading: false,
|
|
||||||
};
|
|
||||||
|
|
||||||
setRef = (c) => {
|
|
||||||
this.dropdown = c;
|
|
||||||
}
|
|
||||||
|
|
||||||
onShowDropdown = (e) => {
|
|
||||||
e.stopPropagation();
|
|
||||||
|
|
||||||
this.setState({ active: true });
|
|
||||||
|
|
||||||
if (!EmojiPicker) {
|
|
||||||
this.setState({ loading: true });
|
|
||||||
|
|
||||||
EmojiPickerAsync().then(EmojiMart => {
|
|
||||||
EmojiPicker = EmojiMart;
|
|
||||||
|
|
||||||
this.setState({ loading: false });
|
|
||||||
}).catch(() => {
|
|
||||||
this.setState({ loading: false });
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
const { top } = e.target.getBoundingClientRect();
|
|
||||||
this.setState({ placement: top * 2 < innerHeight ? 'bottom' : 'top' });
|
|
||||||
}
|
|
||||||
|
|
||||||
onHideDropdown = () => {
|
|
||||||
this.setState({ active: false });
|
|
||||||
}
|
|
||||||
|
|
||||||
onToggle = (e) => {
|
|
||||||
if (!this.state.loading && (!e.key || e.key === 'Enter')) {
|
|
||||||
if (this.state.active) {
|
|
||||||
this.onHideDropdown();
|
|
||||||
} else {
|
|
||||||
this.onShowDropdown(e);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
handleKeyDown = e => {
|
|
||||||
if (e.key === 'Escape') {
|
|
||||||
this.onHideDropdown();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setTargetRef = c => {
|
|
||||||
this.target = c;
|
|
||||||
}
|
|
||||||
|
|
||||||
findTarget = () => {
|
|
||||||
return this.target;
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
const { intl, onPickEmoji, onSkinTone, skinTone, frequentlyUsedEmojis } = this.props;
|
|
||||||
const title = intl.formatMessage(messages.emoji);
|
|
||||||
const { active, loading, placement } = this.state;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className='relative' onKeyDown={this.handleKeyDown}>
|
|
||||||
<IconButton
|
|
||||||
ref={this.setTargetRef}
|
|
||||||
className={classNames({
|
|
||||||
'text-gray-400 hover:text-gray-600': true,
|
|
||||||
'pulse-loading': active && loading,
|
|
||||||
})}
|
|
||||||
alt='😀'
|
|
||||||
src={require('@tabler/icons/icons/mood-happy.svg')}
|
|
||||||
title={title}
|
|
||||||
aria-label={title}
|
|
||||||
aria-expanded={active}
|
|
||||||
role='button'
|
|
||||||
onClick={this.onToggle}
|
|
||||||
onKeyDown={this.onToggle}
|
|
||||||
tabIndex={0}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Overlay show={active} placement={placement} target={this.findTarget}>
|
|
||||||
<EmojiPickerMenu
|
|
||||||
custom_emojis={this.props.custom_emojis}
|
|
||||||
loading={loading}
|
|
||||||
onClose={this.onHideDropdown}
|
|
||||||
onPick={onPickEmoji}
|
|
||||||
onSkinTone={onSkinTone}
|
|
||||||
skinTone={skinTone}
|
|
||||||
frequentlyUsedEmojis={frequentlyUsedEmojis}
|
|
||||||
/>
|
|
||||||
</Overlay>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
@ -0,0 +1,188 @@
|
||||||
|
import classNames from 'classnames';
|
||||||
|
import React, { useRef, useEffect, useState } from 'react';
|
||||||
|
import { usePopper } from 'react-popper';
|
||||||
|
import { defineMessages, useIntl } from 'react-intl';
|
||||||
|
import { createPortal } from 'react-dom';
|
||||||
|
import { supportsPassiveEvents } from 'detect-passive-events';
|
||||||
|
|
||||||
|
import { IconButton, Toggle } from 'soapbox/components/ui';
|
||||||
|
import { useSettings, useSystemTheme } from 'soapbox/hooks';
|
||||||
|
import type { List } from 'immutable';
|
||||||
|
|
||||||
|
import { buildCustomEmojis } from '../../emoji/emoji';
|
||||||
|
import { EmojiPicker as EmojiPickerAsync } from '../../ui/util/async-components';
|
||||||
|
// import EmojiPicker from '../../emoji/emoji_picker';
|
||||||
|
|
||||||
|
let EmojiPicker: any; // load asynchronously
|
||||||
|
|
||||||
|
const messages = defineMessages({
|
||||||
|
emoji: { id: 'emoji_button.label', defaultMessage: 'Insert emoji' },
|
||||||
|
emoji_search: { id: 'emoji_button.search', defaultMessage: 'Search…' },
|
||||||
|
emoji_not_found: { id: 'emoji_button.not_found', defaultMessage: 'No emoji\'s found.' },
|
||||||
|
custom: { id: 'emoji_button.custom', defaultMessage: 'Custom' },
|
||||||
|
recent: { id: 'emoji_button.recent', defaultMessage: 'Frequently used' },
|
||||||
|
search_results: { id: 'emoji_button.search_results', defaultMessage: 'Search results' },
|
||||||
|
people: { id: 'emoji_button.people', defaultMessage: 'People' },
|
||||||
|
nature: { id: 'emoji_button.nature', defaultMessage: 'Nature' },
|
||||||
|
food: { id: 'emoji_button.food', defaultMessage: 'Food & Drink' },
|
||||||
|
activity: { id: 'emoji_button.activity', defaultMessage: 'Activity' },
|
||||||
|
travel: { id: 'emoji_button.travel', defaultMessage: 'Travel & Places' },
|
||||||
|
objects: { id: 'emoji_button.objects', defaultMessage: 'Objects' },
|
||||||
|
symbols: { id: 'emoji_button.symbols', defaultMessage: 'Symbols' },
|
||||||
|
flags: { id: 'emoji_button.flags', defaultMessage: 'Flags' },
|
||||||
|
});
|
||||||
|
|
||||||
|
interface IEmojiPickerDropdown {
|
||||||
|
custom_emojis: any,
|
||||||
|
frequentlyUsedEmojis: string[],
|
||||||
|
intl: any,
|
||||||
|
onPickEmoji: (emoji: any) => void,
|
||||||
|
onSkinTone: () => void,
|
||||||
|
skinTone: () => void,
|
||||||
|
}
|
||||||
|
|
||||||
|
const listenerOptions = supportsPassiveEvents ? { passive: true } : false;
|
||||||
|
|
||||||
|
const EmojiPickerDropdown: React.FC<IEmojiPickerDropdown> = ({ custom_emojis, frequentlyUsedEmojis, onPickEmoji, onSkinTone, skinTone }) => {
|
||||||
|
const intl = useIntl();
|
||||||
|
const settings = useSettings();
|
||||||
|
const title = intl.formatMessage(messages.emoji);
|
||||||
|
const userTheme = settings.get('themeMode');
|
||||||
|
const theme = (userTheme === 'dark' || userTheme === 'light') ? userTheme : 'auto';
|
||||||
|
|
||||||
|
const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);
|
||||||
|
const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(null);
|
||||||
|
const [containerElement, setContainerElement] = useState<HTMLDivElement | null>(null);
|
||||||
|
|
||||||
|
const [visible, setVisible] = useState(false);
|
||||||
|
const [loading, setLoading] = useState(false);
|
||||||
|
|
||||||
|
const { styles, attributes } = usePopper(referenceElement, popperElement, {
|
||||||
|
placement: 'top-start',
|
||||||
|
});
|
||||||
|
|
||||||
|
const handleToggle = () => {
|
||||||
|
setVisible(!visible);
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleHide = () => {
|
||||||
|
setVisible(false);
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleDocClick = (e: any) => {
|
||||||
|
if (!containerElement?.contains(e.target) && !popperElement?.contains(e.target)) {
|
||||||
|
setVisible(false);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const handlePick = (emoji: any) => {
|
||||||
|
if (!emoji.native) {
|
||||||
|
emoji.native = emoji.shortcodes;
|
||||||
|
}
|
||||||
|
|
||||||
|
setVisible(false);
|
||||||
|
onPickEmoji(emoji);
|
||||||
|
}
|
||||||
|
|
||||||
|
const getI18n = () => {
|
||||||
|
return {
|
||||||
|
search: intl.formatMessage(messages.emoji_search),
|
||||||
|
notfound: intl.formatMessage(messages.emoji_not_found),
|
||||||
|
categories: {
|
||||||
|
search: intl.formatMessage(messages.search_results),
|
||||||
|
recent: intl.formatMessage(messages.recent),
|
||||||
|
people: intl.formatMessage(messages.people),
|
||||||
|
nature: intl.formatMessage(messages.nature),
|
||||||
|
foods: intl.formatMessage(messages.food),
|
||||||
|
activity: intl.formatMessage(messages.activity),
|
||||||
|
places: intl.formatMessage(messages.travel),
|
||||||
|
objects: intl.formatMessage(messages.objects),
|
||||||
|
symbols: intl.formatMessage(messages.symbols),
|
||||||
|
flags: intl.formatMessage(messages.flags),
|
||||||
|
custom: intl.formatMessage(messages.custom),
|
||||||
|
},
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
document.addEventListener('click', handleDocClick, false);
|
||||||
|
document.addEventListener('touchend', handleDocClick, listenerOptions);
|
||||||
|
|
||||||
|
return function cleanup() {
|
||||||
|
document.removeEventListener('click', handleDocClick);
|
||||||
|
document.removeEventListener('touchend', handleDocClick);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (!EmojiPicker) {
|
||||||
|
setLoading(true);
|
||||||
|
|
||||||
|
EmojiPickerAsync().then(EmojiMart => {
|
||||||
|
EmojiPicker = EmojiMart.Picker;
|
||||||
|
|
||||||
|
setLoading(false);
|
||||||
|
}).catch(() => {
|
||||||
|
setLoading(false);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}, [visible]);
|
||||||
|
|
||||||
|
let Popup;
|
||||||
|
|
||||||
|
if (loading) {
|
||||||
|
Popup = () => <div />;
|
||||||
|
} else {
|
||||||
|
Popup = () => <div>
|
||||||
|
<EmojiPicker
|
||||||
|
custom={[{ emojis: buildCustomEmojis(custom_emojis) }]}
|
||||||
|
title={title}
|
||||||
|
onEmojiSelect={handlePick}
|
||||||
|
recent={frequentlyUsedEmojis}
|
||||||
|
perLine={8}
|
||||||
|
skin={onSkinTone}
|
||||||
|
emojiSize={38}
|
||||||
|
emojiButtonSize={50}
|
||||||
|
set={'twitter'}
|
||||||
|
theme={theme}
|
||||||
|
autoFocus
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className='relative' ref={setContainerElement}>
|
||||||
|
<IconButton
|
||||||
|
className={classNames({
|
||||||
|
'text-gray-400 hover:text-gray-600': true,
|
||||||
|
'pulse-loading': visible && loading,
|
||||||
|
})}
|
||||||
|
ref={setReferenceElement}
|
||||||
|
src={require('@tabler/icons/icons/mood-happy.svg')}
|
||||||
|
title={title}
|
||||||
|
aria-label={title}
|
||||||
|
aria-expanded={visible}
|
||||||
|
role='button'
|
||||||
|
onClick={handleToggle}
|
||||||
|
onKeyDown={handleToggle}
|
||||||
|
tabIndex={0}
|
||||||
|
/>
|
||||||
|
|
||||||
|
{createPortal(
|
||||||
|
<div
|
||||||
|
className={classNames({
|
||||||
|
'z-1000': true,
|
||||||
|
})}
|
||||||
|
ref={setPopperElement}
|
||||||
|
style={styles.popper}
|
||||||
|
{...attributes.popper}
|
||||||
|
>
|
||||||
|
{visible && (<Popup />)}
|
||||||
|
</div>,
|
||||||
|
document.body
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default EmojiPickerDropdown;
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
import data from '@emoji-mart/data';
|
import data from '@emoji-mart/data/sets/14/twitter.json'
|
||||||
import { Picker as EmojiPicker } from 'emoji-mart';
|
import { Picker as EmojiPicker, PickerProps } from 'emoji-mart';
|
||||||
import React, { useRef, useEffect } from 'react';
|
import React, { useRef, useEffect } from 'react';
|
||||||
|
|
||||||
// const categories = [
|
// const categories = [
|
||||||
|
|
@ -14,9 +14,10 @@ import React, { useRef, useEffect } from 'react';
|
||||||
// 'symbols',
|
// 'symbols',
|
||||||
// 'flags',
|
// 'flags',
|
||||||
// ];
|
// ];
|
||||||
|
//
|
||||||
|
|
||||||
export default function Picker(props) {
|
function Picker(props: PickerProps) {
|
||||||
const ref = useRef();
|
const ref = useRef(null);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const input = { ...props, data, ref };
|
const input = { ...props, data, ref };
|
||||||
|
|
@ -26,3 +27,7 @@ export default function Picker(props) {
|
||||||
|
|
||||||
return <div ref={ref} />;
|
return <div ref={ref} />;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export {
|
||||||
|
Picker
|
||||||
|
}
|
||||||
|
|
@ -1,4 +1,3 @@
|
||||||
.emoji-mart,
|
|
||||||
.emoji-mart * {
|
.emoji-mart * {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
line-height: 1.15;
|
line-height: 1.15;
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,26 @@
|
||||||
|
declare module 'emoji-mart' {
|
||||||
|
export type PickerProps = {
|
||||||
|
custom?: { emojis: any[] }[],
|
||||||
|
set?: string,
|
||||||
|
title?: string,
|
||||||
|
theme?: string,
|
||||||
|
onEmojiSelect?: any,
|
||||||
|
recent?: any,
|
||||||
|
skin?: any,
|
||||||
|
perLine?: number,
|
||||||
|
emojiSize?: number,
|
||||||
|
emojiButtonSize?: number,
|
||||||
|
navPosition?: string,
|
||||||
|
set?: string,
|
||||||
|
theme?: string,
|
||||||
|
autoFocus?: boolean,
|
||||||
|
i18n?: any,
|
||||||
|
}
|
||||||
|
|
||||||
|
export class Picker {
|
||||||
|
|
||||||
|
constructor(props: PickerProps);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue