
配色方案卡片
代表不同的颜色方案,并专为浅色和深色主题量身定制。- 用法
- 属性
复制
询问AI
import { ColorSchemeCard } from "twenty-ui/display";
export const MyComponent = () => {
return (
<ColorSchemeCard
variant="Dark"
selected={true}
/>
);
};
| 属性 | 类型 | 描述 | 默认 |
|---|---|---|---|
| 变体 | 字符串 | 颜色方案的变体。 选项包括 深色, 浅色 和 系统 | 浅色 |
| 已选择 | 布尔值 | 如果 true,显示一个选中标记以指示选定的颜色方案。 | |
| 额外属性 | React.ComponentPropsWithoutRef<'div'> | 标准 HTML div 元素属性 |
颜色方案选择器
允许用户在不同的颜色方案之间进行选择。- 用法
- 属性
复制
询问AI
import { ColorSchemePicker } from "twenty-ui/display";
export const MyComponent = () => {
return <ColorSchemePicker
value="Dark"
onChange
/>;
};
| 属性 | 类型 | 描述 |
|---|---|---|
| 值 | 配色方案 | 当前选定的颜色方案 |
| onChange | 函数 | 当用户选择颜色方案时,触发您想要的回调函数。 |