import {Cls} from "@ash9g/cls"
import * as React from "react"

export const h = React.createElement
export const Component = React.Component
export type Component<P, S> = React.Component<P, S>
export const childrenToArray = React.Children.toArray
export type HTMLProps<T> = React.HTMLProps<T>

export const X: typeof React.createElement = function(
  name: any,
  props: any,
  ...children: any[]
) {
  if (typeof name === "string") {
    const {tag, props: nprops} = Cls.extractTagToProps(name, props)
    return h(tag, nprops, ...children)
  } else {
    return h(name, props, ...children)
  }
} as any

//Enforces types
export function rstyle(elems: React.CSSProperties) {
  return {style: elems}
}

//Useful
export function Clss(s: string, props: {className?: string | null}) {
  return {className: s + " " + (props.className || "")}
}