sveil (alpha version)

Sveil core.

• Allow to subscribe for svelte stores (with unsubscribeAll option)
• Allow to get current value of store with $ sign (emulate svelte store auto subscription behaiour)

Instalation

  npm i @sveil/core

Basic example

/* eslint-disable @typescript-eslint/no-empty-interface */
import { type SubscribitionsBase, Subscribitions } from '@sveil/core';
import type { SvelteComponentState, SvelteStore, SvelteStoreFn } from '@sveil/core';

export interface State extends SvelteComponentState {
    counter: SvelteStore<number>;
    counterIncrement: SvelteStoreFn<unknown>;
    counterSet: SvelteStoreFn<number>;
}

// Add properties in type
export interface ComponentService extends SubscribitionsBase<State> {}

// Add properties in runtime
export class ComponentService extends Subscribitions {
    constructor(state: State) {
        super(state);
        // after call super - value of counter should be accessable in class with this.$counter
        // in component you just need to call this.unsubscribeAll() in onDestroy
        this.addSubscription(this.addSubscriptionLog()); //subscription option 1
        this.subscribeStore(this.counter, this.subscribeStoreLog); //subscription option 2
    }

    logCounter() {
        console.log('this.$counter', this.$counter); //current value of counter store
    }

    addSubscriptionLog() {
        return this.counter.subscribe((n) => {
            console.log('addSubscription callback', n);
        });
    }

    subscribeStoreLog(n: number) {
        console.log('subscribeStore callback', n);
    }
}