0.9.3 • Published 4 months ago

rune-ts v0.9.3

Weekly downloads
-
License
Apache-2.0
Repository
github
Last release
4 months ago

Rune - Web API based Front-end SDK

Rune is a fast and robust library for building high-quality frontend applications, serving as a modern web technology-based SDK.

  • Object-oriented programming-based architecture
  • Type-safe Generic Views & Enable
  • Single-component Server-Side Rendering
  • Sleek UI component development kit
  • High portability and performance

Getting Started

pnpm add rune-ts
npm install rune-ts

Documentation

Example

interface Setting {
  title: string;
  on: boolean;
}

class SettingItemView extends View<Setting> {
  switchView = new SwitchView(this.data);

  override template() {
    return html`
      <div>
        <span class="title">${this.data.title}</span>
        ${this.switchView}
      </div>
    `;
  }
}

class SettingListView extends ListView<SettingItemView> {
  ItemView = SettingItemView;
}

class SettingPage extends View<Setting[]> {
  private listView = new SettingListView(this.data);
  private checkAllView = new SwitchView({ on: this.isAllOn() });

  override template() {
    return html`
      <div>
        <div class="header">
          <h2>Setting</h2>
          ${this.checkAllView}
        </div>
        <div class="body">${this.listView}</div>
      </div>
    `;
  }

  protected override onRender() {
    this.checkAllView.addEventListener(Toggled, (e) => this.checkAll(e.detail.on));
    this.listView.addEventListener(Toggled, () => this.syncCheckAllView());
  }

  private checkAll(on: boolean) {
    this.listView.itemViews
      .filter(itemView => itemView.data.on !== on)
      .forEach(itemView => itemView.switchView.setOn(on));
  }

  private syncCheckAllView() {
    this.checkAllView.setOn(this.isAllOn());
  }

  private isAllOn() {
    return this.data.every(({ on }) => on);
  }
}
0.9.0

5 months ago

0.9.2

4 months ago

0.9.1

5 months ago

0.9.3

4 months ago

0.8.14

5 months ago

0.8.13

6 months ago

0.8.9

1 year ago

0.8.12

1 year ago

0.8.11

1 year ago

0.8.10

1 year ago

0.8.8

1 year ago

0.8.7

1 year ago

0.8.6

1 year ago

0.8.5

1 year ago

0.8.4

1 year ago

0.8.3

1 year ago

0.8.2

1 year ago

0.8.1

1 year ago

0.8.0

1 year ago

0.7.4

1 year ago

0.7.2

1 year ago

0.7.3

1 year ago

0.7.1

1 year ago

0.7.0

1 year ago

0.5.0

1 year ago

0.4.1

1 year ago

0.3.2

1 year ago

0.4.0

1 year ago

0.3.1

1 year ago

0.5.2

1 year ago

0.6.0

1 year ago

0.5.1

1 year ago

0.3.0

1 year ago

0.2.2

1 year ago

0.2.1

1 year ago

0.2.0

1 year ago

0.1.2

1 year ago

0.1.1

1 year ago

0.1.0

1 year ago

0.0.9

1 year ago

0.0.8

1 year ago

0.0.7

1 year ago

0.0.6

1 year ago

0.0.3

1 year ago

0.0.5

1 year ago

0.0.4

1 year ago

0.0.2

1 year ago

0.0.1

1 year ago