makeComponent

makeComponent(tag: string, bluePrint: XinBlueprint<T>): Promise<XinComponentSpec<T>> hydrates blueprints into usable web-components.

Here are the relevant interfaces:

export interface PartsMap<T = Element> {
  [key: string]: T
}

export type XinBlueprint<T = PartsMap> = (
  tag: string,
  module: XinFactory
) => XinComponentSpec<T> | Promise<XinComponentSpec<T>>

export interface XinComponentSpec<T = PartsMap> {
  type: Component<T>
  lightStyleSpec?: XinStyleSheet
  styleSpec?: XinStyleSheet // deprecated, use lightStyleSpec
}

Note that a crucial benefit of blueprints is that the consumer of the blueprint gets to choose the tagName of the custom-element.