[Enhancement] Improve StyledComponents theme Autocomplete for React Client Code

check the code here - https://github.com/appsmithorg/appsmith/blob/release/app/client/src/constants/DefaultTheme.tsx#L345

## Problem
Currently, for generic type value in theme for example `colors: any`, when we need to add something like
`color: ${props.theme.colors.dropdown.header.text};` using styled-components

We do not get an auto-complete prediction for such cases and also if wrote theme objects value reference incorrectly no error is generated.

## Expected

1. To see predictions when referring to theme objects value :

#### Example
```js
`props.theme.colors.dropdown.hea`
-- header
-- heading
```

2. See error when incorrectly used theme object
#### Example
```js
const theme = {
colors: {
primary: "#FFFFFF"
}
};

// demo component
const Wrapper = styled.div`
color: ${props => props.theme.colors.incorrectPrimary}; // Should show error - no incorrectPrimary is defined
`
```

## Solution
Ideally, we could generate the `Colors` type from the union of theme object's colors value & dark and light theme's color values.