formatOptionLabel confusion, got it to work but am confused why.

[RareTC]

Hi there guys/gals, I am a new developer and this is my first time playing with react-select. I spent way too many hours plugging away to get this to render, and I think a lot of it was dumb luck. I am a bit confused on why some of this is running. I will post the code below, it is all in the same react component.

const options = palettes.map(p => ({
        value: p._id,
        label: p.title,
        colors: p.colors.map(color => (
            <div key={color} 
            style={{ backgroundColor: color, width: '20px', height: '20px', display: 'inline-block'}}>
            </div>
        ))
    }));

    const formatOptionLabel = ({ value, label, colors }) => (
        <div>
            <span>{label}</span>
            <div>{colors}</div>
        </div>
    ); 

               <Select
                className="palette-menu"
                options={options}
                //Honestly not sure why the two codes below work.
                value={{ value: palette._id, label: `${palette.title}` }}
                onChange={(evt) => setPalette(palettes.find(p => p._id === evt.value))}
                formatOptionLabel={formatOptionLabel}
            />

For starters: in options I reduced value to p._id and label to p.title, but when I was working in the component I was not able to get value to equal p._id. Secondly, I saw someone else use the label in their value field instead of making a new label field, why is that? Lastly, the onChange, does it not need a evt.target.value because it is an option field so it is a unique id? Thanks everyone, I appreciate your time! Love the library, super useful to style the options! --Happy to post the full code if context is needed, the component in total is only 115 lines.