Class Component

getAttributes

• getAttributes(): {
      [key: string]: string;
  }

• Get the attributes of the component

  Returns

  Object containing all the attributes of the component

  Example

  var myComponent = new Component("div",{"id":"my-component"});
  
  var attributes = myComponent.getAttributes(); // a div component
  console.log(attributes); // {"id":"my-component"}; 
  
  

  Returns {
      [key: string]: string;
  }

  • [key: string]: string

getChildren

• getChildren(): Component[]

• Get the children of the component

  Returns

  List of all the Childrens of the component

  Returns Component[]

addChild

getParent

• getParent(): null | Component

• Get the parent of the component

  Returns

  Parent of the component

  Returns null | Component

addChildren

• addChildren(...childrenToAdd: Component[]): void

• Add multiple children to the component

  Parameters

  • Rest ...childrenToAdd: Component[]

    A destructured list of components to add as children

  Returns void

removeChild

• removeChild(child: Component): void

• Remove the child from the parent. Note if the child is not refrenced anywhere but only by the parent, then remove it will delete it.

  Parameters

  • child: Component

    The children component to remove as a child

  Returns void

setAttribute

• setAttribute(name: string, value: string): void

• Sets or Creates a new attribute on the component

  Example

  
  var myComponent = new Component("p");
  myComponent.setAttribute("class", "my-component para lg:mx-5 sm:mx-1");
  myComponent.setAttribute("id","my-unique-id");
  
  

  Parameters

  • name: string

    nmae of the attribute to set

  • value: string

    the value of the attribute to set

  Returns void

getAttribute

• getAttribute(name: string): undefined | string

• Get the value of the attribute at the specified name

  Returns

  the value of the attribute

  Parameters

  • name: string

    the value of the attribute to get

  Returns undefined | string

removeAttribute

• removeAttribute(name: string): void

• Remove the attribute at the specified name

  Parameters

  • name: string

    Attribute to remove from the component

  Returns void

addClass

addChild

• addChild(child: Component): void

• Add a new child to the component

  Example

   var component1 = new Component("div"); // parent component
   var component2 = new Component("p"); // child component
   component1.addChild(component2);
  
  

  Deprecated

  Use addChildren instead

  Parameters

  • child: Component

    Add a child to the component. Child can be of any level of inheritance of component.

  Returns void

addChildren

• addChildren(...childrenToAdd: Component[]): void

• Add multiple children to the component

  Example

   var component1 = new Component("div"); // parent component
   var component2 = new Component("p"); // child component
   component1.addChildren(component2);
  
  

  Parameters

  • Rest ...childrenToAdd: Component[]

    A destructured list of components to add as children

  Returns void

removeChild

• removeChild(child: Component): void

• Remove the child from the parent. Note if the child is not refrenced anywhere but only by the parent, then remove it will delete it.

  Parameters

  • child: Component

    The children component to remove as a child

  Returns void

addClasses

• addClasses(...classNames: string[]): void

• Add multiple classes to the list of classes

  Example

   var myComponent = new Component("div");
   myComponent.addClasses("mx-5"); // class = "mx-5"
   myComponent.addClasses("my-1"); // class = "my-1" "mx-5"
  

  Parameters

  • Rest ...classNames: string[]

    the destructured string array of class names to add to the component

  Returns void

setStyles

• setStyles(properties: {
      [key: string]: string;
  }): void

• Set styles for the Component

  Parameters

  • properties: {
        [key: string]: string;
    }

    style properties to set

    • [key: string]: string

  Returns void

deleteStyles

• deleteStyles(...properties: string[]): void

• Delete the specified css properties

  Parameters

  • Rest ...properties: string[]

    Destructured list of properties to delete

  Returns void

toString

• toString(): string

• Get the string version of the entire component

  Returns

  converted string representation

  Returns string

fill

• fill(direction: "both" | "vertical" | "horizontal"): void

• Fills the component in the specified direction.

  Parameters

  • direction: "both" | "vertical" | "horizontal"

    The direction to fill. Can be "vertical", "horizontal", or "both".

  Returns void

align

• align(vertical: "top" | "bottom" | "middle", horizontal: "center" | "left" | "right"): void

• Aligns the component vertically and horizontally.

  Parameters

  • vertical: "top" | "bottom" | "middle"

    The vertical alignment. Can be "top", "bottom", or "middle".

  • horizontal: "center" | "left" | "right"

    The horizontal alignment. Can be "left", "right", or "center".

  Returns void