What problem does this feature solve?
Introducing a size
prop will allow users to easily customize the size of tags based on their importance or hierarchy, providing a more nuanced visual representation.
While most Ant Design components provide a size prop, the absence of this prop in the <Tag>
component creates visual inconsistencies. In my actual app, I am using custom css to change the size of the <Tag>
<Tag style={{ fontSize: "large", fontWeight: "bold", padding: "8px" }}>Ant Design</Tag>;
What does the proposed API look like?
it looks like <Input>
size
prop (large | middle | small)
<Tag size="large">Ant Design</Tag>;
I would like to contribute to this feature with some guidance
2条答案
按热度按时间4urapxun1#
Maybe
style
is enough for users to customize size. It hasn't been designed yet.iaqfqrcu2#
you can create custom component like this
import { Tag as AntTag, TagProps } from "antd";
interface ItagProps extends TagProps {
size: "large" | "medium" | "small";
}
const Tag = ({ size, ...rest }: ItagProps) => {
return (
<AntTag
{...rest}
style={{
fontSize:
size === "small"
? "your style"
: size === "medium"
? "custom style "
: "custom style",
}}
/>
);
};
export default Tag;