Widget Canvas

Widget layout extension, that provides the canvas web-component, where all the other elements can be flexibly situated.

TODO

Prepare the bootstrap of the extension

Install

NPM

To install the package from NPM registry you should run

yarn add @capsulajs/capsulahub-widget-canvas

or

npm install @capsulajs/capsulahub-widget-canvas

CDN

You can get the default export from the link

https://capsulajs.s3.amazonaws.com/develop/capsulahub-widget-canvas/index.js

WorkspaceConfiguration example

{
  "components": {
    "layouts": {
      "capsulahub-root": {
        "componentName": "web-canvas",
        "path": "https://capsulajs.s3.amazonaws.com/develop/capsulahub-widget-canvas/index.js",
        "config": {}
      }
    },
    "items": {}
  }
}

Exports

Default

Bootstrap function of the extension.

Named (API)

The public API of the extension.

API

CDN

The documentation about public API.

Local

Run

yarn doc

And open doc/index.html in browser.

Example

Internally example prepares the widget almost in the same way as Workspace does it.

Run

yarn start

It will use the local version of extension from local src.

The bundle is being loaded statically in order to provide watch mode.

Tests

Run

1. yarn test
2. yarn test:debug

Add new commands (in Cypress)

New commands have to be typed correctly in typescript.

For example:

Cypress.Commands.add('getHeading', () => {
  return cy.get('h1');
});

declare namespace Cypress {
  interface Chainable {
    getHeading: () => Chainable;
  }
}

Licence

CapsulaHub and related services are released under MIT Licence.

Back to the Main Page