Utilities

Utilities are functions that act as helpers to do general and often repeatedly used tasks. These are usually located in client/utils.ts.

The framework comes with some built in utils which can be useful:

buildStyles: CSSStyleDeclaration

A small function that will ensure any inline styles are type safe.

Args

1. styles (styles { [key: string]: string }): An object representing your styles. E.g. { marginTop: "10px", color: "blue" }.

Example

<p style={ buildStyles({ marginTop: "10px", marginBottom: "10px" }) }>This is an example.</p>

getCSSVariable: string

Gets the value of a CSS variable.

Args

1. variableName (string): The CSS variable name to get the value of.

Example

this.color = getCSSVariable("--your-variable-name");

isIE11: boolean

Determines whether the browser is Internet Explorer 11 or not.

Args

None.

Example

const isIE11: boolean = isIE11();

deepClone<T>: T

Performs a deep clone on the object supplied and breaks all references.

Args

1. objectToClone (T): The object to deep clone.

Example

this.newInstance = deepClone([{ "myObj": "cloningThis" }]);

generateGuid: string

Generates a GUID. Can optionally generate a shorter six character length id instead of a full GUID.

Args

1. shortId (boolean - default: false): Generate a short id instead.

Example

this.guid = generateGuid();
this.shortId = generateGuid(true);