Custom Option Component Styles

[DrogoNevets]

I am trying to crate a custom Option component that uses the default styles. I currently have

import React from 'react';
import Event from '../../models/Event';
import { GroupBase, OptionProps } from 'react-select';

type OptionData = {
  label: string;
  value: Event;
};

const CustomOption = <
  Option,
  IsMulti extends boolean,
  Group extends GroupBase<Option>
>(props: OptionProps<Option, IsMulti, Group>) => {
  const { data, className, isDisabled, isFocused, isSelected, innerRef, innerProps, cx, getStyles } = props;
  const item = data as OptionData;

  return <div
    css={getStyles('option', props)}
    className={cx(
      {
        option: true,
        'option--is-disabled': isDisabled,
        'option--is-focused': isFocused,
        'option--is-selected': isSelected,
      },
      className
    )}
    {...innerProps}
    ref={innerRef}
    aria-disabled={isDisabled}
  >
    !! {item.label}
  </div>;
};

export default CustomOption;

However I cannot seem to get the styles working, for the above i get the css prop doesn't exist, and the example I have found in the documentation isn't valid TypeScript (according to my VSCode anyways)

any help please?