Ready to take your JavaScript development to the next level? Meet npm Enterprise - the ultimate in enterprise JavaScript. Learn more »

substrate

5.0.0 • Public • Published

substrate

A new way to build user interfaces.

To build a runnable javascript bundle from a substrate model, see https://github.com/mreinstein/substrate-build

substrate nodes

DOM node

{
    id: "b2c-1w23",
    nodeType: "dom",
    name: "activate product",
    tagName: "button",
    children: [ ... ],
    attributes: { ... },
    style: { ... }
}

script node

{
    id: "aefc-3456-edf9",
    nodeType: "script",
    name: "resize-sensor",
    description: "a neat way to do component based rules. ",
    content: "'use strict'; ... "
}

Script nodes must specify either content which is an inline string of valid javascript, or source which is a path to the script, either absolute or relative to the substrate model.

prefab node

{
    id: "b2c-1w23",
    nodeType: "prefab",
    name: "activate product",
    prefabId: "aec-1w23"
}

script reference node

{
    id: "b2c-1w23",
    nodeType: "reference-script",
    name: "resize-sensor",
    scriptId: "aefc-3456-edf9"
}

example model

{
  rootNode: {
    id: "b2c-1w23",
    nodeType: "dom",
    name: "sample application",
    tagName: "div",
    attributes: { },
    children: [
        {
            id: "ded-422323",
            nodeType: "dom",
            name: "welcome banner",
            tagName: "div",
            attributes: { },
            children: [ ... ],
            style: { ... }
        },
        {
            id: "b2c-1w23",
            nodeType: "prefab",
            name: "activate product",
            prefabId: "aec-1w23"
        },
        {
            id: "b2c-1w23",
            nodeType: "reference-script",
            name: "resize-sensor",
            scriptId: "aefc-3456-edf9"
        }
    ],
    style: { ... }
  },
  registry: {
    prefabs: [
        {
           id: "aec-1w23",
           name: "prefab 1 name",
           nodeType: "dom",
           tagName: "div",
           attributes: { },
           children: [ ... ],
           style: { ... }
        },
        {
          id: "dee-455",
          name: "another prefab",
          nodeType: "dom",
          tagName: "div",
          attributes: { },
          children: [ ... ],
          style: { ... }
        }
    ],
    scripts: [
        {
            id: "aefc-3456-edf9",
            nodeType: "script",
            name: "resize-sensor",
            description: "a neat way to do component based rules. ",
            scriptContent: "'use strict'; ... "
        }
    ]
  } 
}

Runtime

These properties are added to all dom nodes after the substrate model is built:

{
    dom: DOMElement
    disposed: false,
}

These properties are added to all script nodes after the substrate model is built:

{
    started: false
}

Keywords

none

install

npm i substrate

Downloadsweekly downloads

10

version

5.0.0

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability