* feat: block schema * feat: improve code * feat: improve code * feat: improve code * feat: improve code * feat: styling for kanban * feat: improve code * feat: improve code * fix(client): auto collapse menu items when overflow * feat: improve code * fix: fieldNames prop for calendar * fix: improve code * feat: improve code * feat: improve code * feat: improve code * feat: improve code * feat: improve code * feat: improve code * feat: improve code * feat: improve code * fix: list the sub-table data source * fix: useFilterByTk * feat: improve code * feat: improve code * feat: improve code
77 lines
2.1 KiB
TypeScript
77 lines
2.1 KiB
TypeScript
import { usePrefixCls } from '@formily/antd/lib/__builtins__';
|
|
import { InputProps, TextAreaProps } from 'antd/lib/input';
|
|
import cls from 'classnames';
|
|
import React from 'react';
|
|
import { useCompile } from '../..';
|
|
import { EllipsisWithTooltip } from './EllipsisWithTooltip';
|
|
import { HTMLEncode } from './shared';
|
|
|
|
type Composed = {
|
|
Input: React.FC<InputProps & { ellipsis?: any }>;
|
|
URL: React.FC<InputProps>;
|
|
TextArea: React.FC<
|
|
TextAreaProps & { ellipsis?: any; text?: any; addonBefore?: any; suffix?: any; addonAfter?: any; autop?: boolean }
|
|
>;
|
|
};
|
|
|
|
export const ReadPretty: Composed = () => null;
|
|
|
|
ReadPretty.Input = (props) => {
|
|
const prefixCls = usePrefixCls('description-input', props);
|
|
const compile = useCompile();
|
|
return (
|
|
<div className={cls(prefixCls, props.className)} style={props.style}>
|
|
{props.addonBefore}
|
|
{props.prefix}
|
|
<EllipsisWithTooltip ellipsis={props.ellipsis}>{compile(props.value)}</EllipsisWithTooltip>
|
|
{props.suffix}
|
|
{props.addonAfter}
|
|
</div>
|
|
);
|
|
};
|
|
|
|
ReadPretty.TextArea = (props) => {
|
|
const prefixCls = usePrefixCls('description-textarea', props);
|
|
const compile = useCompile();
|
|
const value = compile(props.value ?? '');
|
|
const { autop = true } = props;
|
|
let content = null;
|
|
const values = HTMLEncode(value).split('\n').join('<br/>');
|
|
content = (
|
|
<EllipsisWithTooltip
|
|
ellipsis={props.ellipsis}
|
|
popoverContent={autop ? <div dangerouslySetInnerHTML={{ __html: values }} /> : value}
|
|
>
|
|
{props.text ?? value}
|
|
</EllipsisWithTooltip>
|
|
);
|
|
|
|
return (
|
|
<div className={cls(prefixCls, props.className)} style={props.style}>
|
|
{props.addonBefore}
|
|
{props.prefix}
|
|
{content}
|
|
{props.suffix}
|
|
{props.addonAfter}
|
|
</div>
|
|
);
|
|
};
|
|
|
|
ReadPretty.URL = (props) => {
|
|
const prefixCls = usePrefixCls('description-url', props);
|
|
const content = props.value && (
|
|
<a target={'_blank'} href={props.value as any}>
|
|
{props.value}
|
|
</a>
|
|
);
|
|
return (
|
|
<div className={cls(prefixCls, props.className)} style={props.style}>
|
|
{props.addonBefore}
|
|
{props.prefix}
|
|
{content}
|
|
{props.suffix}
|
|
{props.addonAfter}
|
|
</div>
|
|
);
|
|
};
|