Package Exports

define-state
define-state/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (define-state) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

define state

DEPRECATION NOTICE

Just use st8 directly as:

import State from 'st8'

var state = new State({
    a(){
        // onenter
        this === target //true
    },
    
    b(){
        // onenter
        this === target //true
        return () => {
            // onexit
        }
    }
    
}, target);

Object.defineProperty(target, property, {
    set: function (value) {
        return state.set(value);
    },
    get: function () {
        return state.get();
    }
});

Define stateful property on class instance or any object. Behaves like defineProperty, but defines a state.

$ npm install define-state

var defineState = require('define-state');

function MyComponent (el) {
    this.el = el;

    //define state on instance
    defineState(this, 'state', this.state);

    //go to initial state
    this.state = true;
}

//state declaration
MyComponent.prototype.state = {
    true: {
        before: function () {
            this.el.innerHTML = 'Hello world!';
        }
    }
}

//create instance
new MyComponent(document.querySelector('#hello'));

API

defineState(target, name, state, isFn?)

Define stateful property name on a target according to the state declaration (see st8 API). Pass optional isFn argument to define functional accessor instead of getter/setter, might be useful for IE8/ES3 environments or to define functional-style components, like dialog.

defineState(target, 'visible', {
    true: function () {
        this.removeAttribute('hidden');
    },
    false: function () {
        this.setAttribute('hidden', true);
    }
}, true);

target.visible(false);