Export CSSPseudos, CSSProperties, StrictCSSProperties types for a strict XCSSProp implementation. (#1600)

* Export `CSSPseudos, CSSProperties, StrictCSSProperties` types for a strict `XCSSProp` implementation.

To avoid the complexity of requiring `ReturnType<typeof XCSSProp<…>>` when creating a `createStrictAPI().XCSSProp` and `props.xcss` implementation, being able to use these types in generics are helpful.

The example usage is:
```tsx
const { XCSSProp, css, cssMap, cx } = createStrictAPI<…>();

export type StrictXCSSProp<
  TAllowedProperties extends keyof StrictCSSProperties,
  TAllowedPseudos extends CSSPseudos,
  TRequiredProperties extends {
    requiredProperties: TAllowedProperties;
    requiredPseudos: TAllowedPseudos;
  } = never,
> = ReturnType<
  typeof XCSSProp<TAllowedProperties, TAllowedPseudos, TRequiredProperties>
>;
```

Then this becomes a bit easier of a type to understand:
```diff
-export const Component = ({ xcss }: { xcss?: ReturnType<typeof XCSSProp<…>> }) =>
+export const Component = ({ xcss }: { xcss?: StrictXCSSProp<…> }) =>
  <div className={xcss} />
```

Particularly when contrasted against the non-createStrictAPI `XCSSProp` type, which is different.

* Change `XCSSAllProperties` (which we document for usage) to be our `StrictCSSProperties` as it removes some edge-cases.

Author: kylorhall-atlassian

.changeset/gorgeous-melons-sniff.md

@@ -0,0 +1,5 @@
+---
+'@compiled/react': patch
+---
+
+Export `CSSPseudos, CSSProperties, StrictCSSProperties` types for a strict `XCSSProp` implementation.

packages/react/src/index.ts

@@ -1,16 +1,21 @@
 import { createElement } from 'react';
 
 import type { CompiledJSX } from './jsx/jsx-local-namespace';
-import type { CssFunction, CSSProps, CssType } from './types';
 
-export type { CSSProps, CssFunction, CssType };
-
-export { keyframes } from './keyframes';
-export { styled } from './styled';
 export { ClassNames } from './class-names';
+export { createStrictAPI } from './create-strict-api';
 export { default as css } from './css';
 export { default as cssMap } from './css-map';
-export { createStrictAPI } from './create-strict-api';
+export { keyframes } from './keyframes';
+export { styled } from './styled';
+export type {
+  CSSProperties,
+  CSSProps,
+  CSSPseudos,
+  CssFunction,
+  CssType,
+  StrictCSSProperties,
+} from './types';
 export { type XCSSAllProperties, type XCSSAllPseudos, type XCSSProp, cx } from './xcss-prop';
 
 // Pass through the (classic) jsx runtime.

packages/react/src/xcss-prop/index.ts

@@ -1,7 +1,7 @@
 import type * as CSS from 'csstype';
 
 import { ac } from '../runtime';
-import type { CSSPseudos, CSSProperties } from '../types';
+import type { CSSPseudos, CSSProperties, StrictCSSProperties } from '../types';
 
 type MarkAsRequired<T, K extends keyof T> = T & { [P in K]-?: T[P] };
 
@@ -64,7 +64,7 @@ export type CompiledStyles<TObject> = {
  * Use in conjunction with {@link XCSSProp} to allow all properties to be given to
  * your component.
  */
-export type XCSSAllProperties = keyof CSSProperties;
+export type XCSSAllProperties = keyof StrictCSSProperties;
 
 /**
  * Please think twice before using this type, you're better off declaring explicitly