1.2.4 • Published 11 months ago

@sfdocs-internal/api-summary v1.2.4

Weekly downloads
-
License
Apache-2.0
Repository
github
Last release
11 months ago

DEPRECATED

This component is being deprecated. The code base has been moved to api-documentation module. This module will be archived when PR 37 is merged.

A component that renders basic information about an API. It uses AMF model to render the view.

Published on NPM

Tests and publishing

Version compatibility

This version only works with AMF model version 2 (AMF parser >= 4.0.0). For compatibility with previous model version use 3.x.x version of the component.

Usage

Installation

npm install --save @api-components/api-summary

In an html file

<html>
  <head>
    <script type="module">
      import '@api-components/api-summary/api-summary.js';
    </script>
  </head>
  <body>
    <api-summary></api-summary>
    <script>
    const amf = await getAmfModel();
    document.body.querySelector('api-summary').api = amf;
    window.addEventListener('api-navigation-selection-changed', (e) => {
      console.log(e.detail.selected);
      console.log(e.detail.type);
    });
    </script>
  </body>
</html>

Styling using CSS Shadow Parts

<html>
  <head>
    <script type="module">
      import '@api-components/api-summary/api-summary.js';
    </script>
    <style type="text/css">
      api-summary::part(api-title) {
        font-size: 24px;
      }
    </style>
  </head>
  <body>
    <api-summary exportparts="api-title"></api-summary>
    <script>
    const amf = await getAmfModel();
    document.body.querySelector('api-summary').api = amf;
    window.addEventListener('api-navigation-selection-changed', (e) => {
      console.log(e.detail.selected);
      console.log(e.detail.type);
    });
    </script>
  </body>
</html>

For a complete list of parts, check out this doc.

In a LitElement template

import { LitElement, html } from 'lit-element';
import '@api-components/api-summary/api-summary.js';

class SampleElement extends LitElement {
  render() {
    return html`
    <api-summary .api="${this._amfModel}" @api-navigation-selection-changed="${this._navHandler}"></api-summary>
    `;
  }

  _navHandler(e) {
    console.log(e.detail.selected);
    console.log(e.detail.type);
  }
}
customElements.define('sample-element', SampleElement);

In a Polymer 3 element

import {PolymerElement, html} from '@polymer/polymer';
import '@api-components/api-summary/api-summary.js';

class SampleElement extends PolymerElement {
  static get template() {
    return html`
    <api-summary api="[[amfModel]]" on-api-navigation-selection-changed="_navHandler"></api-summary>
    `;
  }

  _navHandler(e) {
    console.log(e.detail.selected);
    console.log(e.detail.type);
  }
}
customElements.define('sample-element', SampleElement);

Development

git clone https://github.com/advanced-rest-client/api-summary
cd api-summary
npm install

Running the demo locally

npm start

Running the tests

npm test
api-componentssummary
@advanced-rest-client/arc-marked@advanced-rest-client/markdown-styles@api-components/amf-helper-mixin@sfdocs-internal/api-method-documentation@api-components/http-method-label@api-components/raml-awaredompurifylit-elementlit-html
@infinitebrahmanuniverse/nolb-_sf@everything-registry/sub-chunk-826@sfdocs-internal/api-documentation
1.2.4

11 months ago

1.0.4-desc-fix-alpha

2 years ago

1.2.3

2 years ago

1.2.2

2 years ago

1.2.1

2 years ago

1.1.1

2 years ago

1.1.0

2 years ago

1.1.1-alpha4

2 years ago

1.0.8-alpha

2 years ago

1.0.9

2 years ago

1.0.8

2 years ago

1.0.7

2 years ago

1.0.2-alpha1

2 years ago

1.0.0-alpha1

2 years ago

1.0.0-alpha

2 years ago

1.0.6

2 years ago

1.0.5

2 years ago

1.0.4

3 years ago

1.0.3

3 years ago

1.0.2

3 years ago

1.0.1

3 years ago

1.0.0

3 years ago