@advanced-rest-client/arc-request-workspace NPM

arc-request-workspace

A request workspace component for Advanced REST Client. It is a top level component for ARC to render request editor view.

Usage

Installation

npm install --save @advanced-rest-client/arc-request-workspace

In an html file

<html>
  <head>
    <script type="module">
      import './node_modules/@advanced-rest-client/arc-request-workspace/arc-request-workspace.js';
    </script>
  </head>
  <body>
    <arc-request-workspace></arc-request-workspace>
  </body>
</html>

In a LitElement

import { LitElement, html } from 'lit-element';
import '@advanced-rest-client/arc-request-workspace/arc-request-workspace.js';

class SampleElement extends LitElement {
  render() {
    return html`
    <arc-request-workspace
      ?compatibility="${compatibility}"
      ?outlined="${outlined}"
      ?narrow="${narrow}"
      .oauth2RedirectUri="${oauth2RedirectUri}"
      .sentMessageLimit="${sentMessageLimit}"
      .requestTimeout="${requestTimeout}"
      ?validateCertificates="${validateCertificates}"
      ?ignoreContentOnGet="${ignoreContentOnGet}"
      ?followRedirects="${followRedirects}"
      draggableenabled
    ></arc-request-workspace>
    `;
  }
}
customElements.define('sample-element', SampleElement);

Workspace state events

The element dispatches workspace-state-read custom event to request for workspace data and workspace-state-store to request to store the data in a store.

Data to be stored and later on restored are under value property of workspace-state-store event's detail object. The data may contain huge amount of data as it stores list of requests with responses. Some storage solutions may not be adequate to store such amount of data.

Example implementation

window.addEventListener('workspace-state-read', (e) => {
  e.preventDefault();
  e.detail.result = new Promise((resolve) => {
    let data = localStorage.getItem('workspace.state');
    if (data) {
      data = JSON.parse(data)
    }
    resolve(data);
  });
});
window.addEventListener('workspace-state-store', (e) => {
  localStorage.setItem('workspace.state', JSON.stringify(e.detail.value));
});

Development

git clone https://github.com/advanced-rest-client/arc-request-workspace
cd arc-request-workspace
npm install

Running the demo locally

npm start

Running the tests

npm test

API components

This components is a part of API components ecosystem

advanced-rest-client settings

@everything-registry/sub-chunk-30 @infinitebrahmanuniverse/nolb-_adv @advanced-rest-client/arc-app-mixin

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago