type DisplayConstructor = Constructor<Display>

interface ComposeOptions<T extends DisplayConstructor> {
  display: T
  layouts?: (LayoutConstructor & {type: string})[]
  scriptName: string
}

export function Compose<TBase extends DisplayConstructor>(
		options: ComposeOptions<TBase>
): TBase

Description

The compose function is a fundamental part of the framework architecture. It leverages a mixin pattern to merge one display with an array of one or more layouts. A scriptName is also required as an argument.

To create an Unless component, classes need to extend from this mixin.

Import

import {Compose} from '@unless/component-library.utils.compose'

Parameters

Name	Type	Description
`display`	`DisplayContructor`	The constructor for the display
`layouts`	`(LayoutConstructor & {type: string})[]`	An array of constructors for the layouts. If one or fewer layouts are provided, the component will render as a single-step component. Otherwise, it will render as a multistep.
`scriptName`	`string`	This must be unique and is used by the Unless script to launch the component. By convention, we use [Name of Display][Name of first layout] as such: ‘OverlayOneColumn’.

Return

This mixin provides a class constructor that combines the display and layouts. Due to TypeScript's limitations, it will be returned as a typeof Display with the display being the constructor that was provided. While this isn't technically accurate because it will actually be a class derived from that display, it will behave in much the same way.