import * as CSS from 'csstype'

type SingleOrArray<Properties, T extends keyof Properties> = {
  [P in T]: Properties[P] | Array<Properties[P]>
}

type CSSPropertiesLoosePseudo = { [K in CSS.Pseudos]?: CSSPropertiesLoose }
type CSSPropertiesPseudo = { [K in CSS.Pseudos]?: CSSProperties }

type CSSPropertiesComplete = SingleOrArray<CSS.Properties, keyof CSS.Properties>

interface CSSPropertiesLossy {
  [propertyName: string]:
    | string
    | number
    | CSSPropertiesComplete
    | undefined
    | Array<CSSPropertiesComplete[keyof CSSPropertiesComplete]>
    | CSSPropertiesLossy
}

interface CSSPropertiesLoose
  extends CSSPropertiesComplete,
    CSSPropertiesLoosePseudo,
    CSSPropertiesLossy {}

interface CSSProperties extends CSSPropertiesComplete, CSSPropertiesPseudo {}

type CSSFunction = (props: {}) => Style

type Style =
  | CSSPropertiesComplete & CSSPropertiesPseudo
  | CSSFunction
  | StyleArray

interface StyleArray extends Array<Style | undefined> {}

type StyleLoose = CSSPropertiesLoose | CSSFunction | StyleLooseArray | boolean

interface StyleLooseArray extends Array<StyleLoose | undefined> {}