kopia lustrzana https://github.com/Tldraw/Tldraw
29 wiersze
821 B
TypeScript
29 wiersze
821 B
TypeScript
import * as DropdownMenu from '@radix-ui/react-dropdown-menu'
|
|
import { strokes } from 'state/shape-styles'
|
|
import { ColorStyle } from 'types'
|
|
import { RowButton, IconWrapper } from '../shared'
|
|
import { Square } from 'react-feather'
|
|
import ColorContent from './color-content'
|
|
|
|
interface Props {
|
|
color: ColorStyle
|
|
onChange: (color: ColorStyle) => void
|
|
}
|
|
|
|
export default function ColorPicker({ color, onChange }: Props): JSX.Element {
|
|
return (
|
|
<DropdownMenu.Root>
|
|
<DropdownMenu.Trigger
|
|
as={RowButton}
|
|
bp={{ '@initial': 'mobile', '@sm': 'small' }}
|
|
>
|
|
<label htmlFor="color">Color</label>
|
|
<IconWrapper>
|
|
<Square fill={strokes[color]} />
|
|
</IconWrapper>
|
|
</DropdownMenu.Trigger>
|
|
<ColorContent onChange={onChange} />
|
|
</DropdownMenu.Root>
|
|
)
|
|
}
|