28 wiersze
585 B
TypeScript
28 wiersze
585 B
TypeScript
import React from "react";
|
|
import { slugify } from "./util";
|
|
|
|
import "./color-widget.css";
|
|
|
|
type ColorWidgetProps = {
|
|
label: string;
|
|
value: string;
|
|
onChange: (value: string) => void;
|
|
id?: string;
|
|
};
|
|
|
|
export const ColorWidget: React.FC<ColorWidgetProps> = (props) => {
|
|
const id = props.id || slugify(props.label);
|
|
|
|
return (
|
|
<span className="color-widget">
|
|
<label htmlFor={id}>{props.label}: </label>
|
|
<input
|
|
id={id}
|
|
type="color"
|
|
value={props.value}
|
|
onChange={(e) => props.onChange(e.target.value)}
|
|
/>
|
|
</span>
|
|
);
|
|
};
|