Super variables for React

The TypeScript syntax is used for the designation.

Navigation:

• Super variables for React
  • Types
    • TSuperNumber
    • TSuperString
    • TSuperVector2D
    • TSuperVector3D
  • Regular Variables
    • SuperNumber
    • SuperString
    • SuperVector2D
  • Dynamic variables (Hooks)
    • useNumber
    • useVector2D
    • useVector3D
    • useObject<T>
  • Examples

Types

Implementation of popular data types.

TSuperNumber

Represents an object for number where:

value - the value of the set variable
set - the method for set the value

type TSuperNumber = { > value: number, > set: ( value: number ) > => void }

TSuperString

Represents an object for string.
value - the value of the set variable
set - the method for set the value

type TSuperString = { > value: string, > set: ( value: string ) > => void }

TSuperVector2D

Represents an object for a vector in 2D.

type TSuperVector2D = { x: number, y: number }

TSuperVector3D

Represents an object for a vector in 3D.

type TSuperVector3D = { x: number, y: number, z: number }

Regular Variables

Regular variables with auto-validation

SuperNumber

SuperNumber ( value: number; options? {
  min?: number;
  max? : number;
  step? : number;
  decimal?: number;
} ) => TSuperNumber

type SuperNumber = (value: string, 
  options?: {
    min?: number,
    max?: number,
    step?: number,
    decimal?: number
  }) => TSuperNumber;

SuperString

SuperString ( value: string; options? {
  min?: number;
  max?: number;
  step?: number;
  decimal?: number
} ) => TSuperNumber

SuperVector2D

SuperVector2D (value: Vector2D)

Dynamic variables (Hooks)

useNumber

useNumber (value: number)

useVector2D

useVector2D (value: Vector2D)

useVector3D

type

useObject<T>

Dynamic object

type

Examples

We have several examples on the website. Here is the first one to get you started: