8000 GitHub - jcmellado/WALAS: Frontend framework for web components v1
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content
This repository was archived by the owner on Dec 29, 2023. It is now read-only.

jcmellado/WALAS

 
 

Repository files navigation

Walas

Minimalist framework based on Web Components v1.

Uses Google Incremental DOM as render engine, and supports Facebook JSX as syntax template.

API

Walas.ComponentBase

componentName

Static Method

It must returns a string with the name of the component. This name must follow the Web Component specification, so it must contain a dash (-).

render

Method

It must returns a valid JSX. This JSX will be rendered as a shadow root attached to the component itself.

refresh

Method

To be invoked after a property has changed. It calls to the render method.

created

Method

Called every time the component is inserted into the DOM. It calls to the refresh method.

destroyed

Method

Called every time the component is removed from the DOM. It removes the event listeners.

attributeChanged(name, oldValue, newValue)

Method

Called every time an attribute is added, removed, updated, or replaced.

Walas.DOM

create(type, [attrs], [...children])

Method

Creates and returns a new DOM element of the given type. Has the same behaviour as React.CreateElement.

Walas.Components

register(component)

Method

Registers a new component using the constructor of the given class.

getComponent(name)

Method

Returns the component that matches the given name.

Walas

bootstrap(element, component)

Method

Adds a component into an existing DOM element.

Example

class App extends Walas.ComponentBase {

  static componentName() {
    return 'x-app';
  }
  
  constructor() {
    super();
    this._text = 0;
  }
  
  click() {
    this.text ++;
  }
  
  set text(value) {
    this._text = value;
    this.refresh();
  }

  get text() {
    return this._text;
  }
  
  render() {
    return <div onClick={this.click}>Clicks: {this.text}</div>
  }
}

var app = Walas.Components.register(App);
Walas.bootstrap(document.getElementById('app'), app);

About

Frontend framework for web components v1

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 100.0%
0