import { CloseOutlined, LoadingOutlined } from '@ant-design/icons'; import { connect, mapProps, mapReadPretty } from '@formily/react'; import { isValid } from '@formily/shared'; import { Button, Input, Popover } from 'antd'; import React, { useState } from 'react'; import { useTranslation } from 'react-i18next'; import { hasIcon, Icon, icons } from '../../../components/icon'; function IconField(props: any) { const { value, onChange } = props; const [visible, setVisible] = useState(false); const { t } = useTranslation(); return (
{ setVisible(val); }} content={
{[...icons.keys()].map((key) => ( { onChange(key); setVisible(false); }} > ))}
} title={t('Icon')} trigger="click" >
{value && ( )}
); } export const IconPicker = connect( IconField, mapProps((props, field) => { return { ...props, suffix: {field?.['loading'] || field?.['validating'] ? : props.suffix}, }; }), mapReadPretty((props) => { if (!isValid(props.value)) { return
; } return ; }), ); export default IconPicker;