Swagger 2.0 elements

Swagger 2.0 documents have their own elements for the overview, the hosts, the security definitions and the operations. <apg-api-reference> picks them by itself. <apg-nav>, <apg-schema>, <apg-try-it>, <apg-auth>, <apg-servers> and <apg-code-samples> work with both kinds of document (OpenAPI elements), and the schemas of a Swagger 2.0 document are called definitions.

<apg-swagger-overview>

Title, version, description, contact, license and external documentation of a Swagger 2.0 API.

Loaded on its own with import "@mykulyak/apigenie-docs/components/apg-swagger-overview";.

Attributes

Attribute Property Type Default Description
heading-level headingLevel number 1 Level of the title heading (1–6).

And spec-url, spec, api and theme, like every element that shows a document: Where the document comes from.

CSS parts

Part Description
overview The container.
title The API title (h1 unless heading-level says otherwise).
version Version badges.
info Contact, license and terms line.
link Links in the info line.

Forwarded from the elements inside it:

<apg-swagger-hosts>

Where a Swagger 2.0 API is served: host, basePath and schemes, the resulting base URLs, and the media types the API consumes and produces. With with-picker, also the server choice Try it out sends requests to (an embedded <apg-servers>).

Loaded on its own with import "@mykulyak/apigenie-docs/components/apg-swagger-hosts";.

Attributes

Attribute Property Type Default Description
with-picker withPicker boolean false Also show the server choice of Try it out.

And spec-url, spec, api and theme, like every element that shows a document: Where the document comes from.

CSS parts

Part Description
hosts The container.
label Field labels.
url Base URLs.

Forwarded from the elements inside it:

<apg-swagger-security>

The security definitions of a Swagger 2.0 document: type, where API keys go, OAuth 2.0 flow, URLs and scopes, and the requirements that apply to every operation. Credentials are entered in <apg-auth>.

Loaded on its own with import "@mykulyak/apigenie-docs/components/apg-swagger-security";.

Attributes

Only spec-url, spec, api and theme, like every element that shows a document: Where the document comes from.

CSS parts

Part Description
security The container.
scheme One security definition.
scheme-name Its name.
table Scope tables.

Forwarded from the elements inside it:

<apg-swagger-operation>

Documentation of one operation of a Swagger 2.0 document: the media types it consumes and produces, path, query, header and form parameters, the body parameter, responses with their headers, examples and schemas, and security, with an optional embedded Try it out.

Loaded on its own with import "@mykulyak/apigenie-docs/components/apg-swagger-operation";.

Attributes

Attribute Property Type Default Description
operation-id operationId string The operation, by operationId.
method method string The operation by method and path (alternative to operation-id).
path path string The path of the operation, with method.
pointer pointer string The operation by JSON pointer.
try-it tryIt "inline" | "open" | "none" "inline" inline: a button shows Try it out; open: shown from the start; none: hidden.
heading-level headingLevel number 2 Level of the path heading.
lazy lazy boolean false Render only the header until the operation comes near the viewport (used for long pages; the full content is always rendered on the server).

And spec-url, spec, api and theme, like every element that shows a document: Where the document comes from.

Methods

Method Description
reveal() Renders the full content of a lazy operation.

Events

Event Description
apg-navigate A tag link was followed; cancelable.

Slots

Slot Description
before Content shown after the header.
after Content shown at the end.

CSS parts

Part Description
operation The container.
header The header with method, path and summary.
path The path.
summary The summary line.
section Sections (parameters, body, responses).
section-title Section headings.
table Tables.
parameter-name Parameter names.
type Type labels of parameters and headers.
required Required markers.
select The media type choice of a response.
tab Example and schema tabs; the selected one also has tab-active.
tab-active The selected tab.
badge Badges (deprecated).
tag-link Links to tag pages.
media-types The consumes and produces line.
response One response.
response-status Its status code.
try-it-button The button that shows Try it out.

Forwarded from the elements inside it:

Was this helpful?