颜色选择器

import { CanvasColorPicker, FontColorPicker } from "@/components/ui/color-picker"

export function ColorPickerBasic() {
  return (
    <div>
      <CanvasColorPicker />
      <FontColorPicker />
    </div>
  )
}

import { useState } from "react"
import { CanvasColorPicker } from "@/components/ui/color-picker"

export function CanvasStickyAndPenColors() {
  const [stickyColor, setStickyColor] = useState("#FFECD9")
  const [penColor, setPenColor] = useState("#FF7D00")

  return (
    <div>
      <div style={{ backgroundColor: stickyColor }}>便签</div>
      <CanvasColorPicker
        value={stickyColor}
        interaction="hover"
        onChange={(next) => { if (next) setStickyColor(next) }}
      />
      <CanvasColorPicker
        value={penColor}
        interaction="hover"
        onChange={(next) => { if (next) setPenColor(next) }}
      />
    </div>
  )
}