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-markdown>:markdown
<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-servers>:servers,select,input
<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-markdown>:markdown
<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:
<apg-method-badge>:method<apg-markdown>:markdown<apg-schema>:schema,schema-row,property-name,toggle,ref-link,format-link,constraint<apg-code-block>:code-block,code,copy-button<apg-try-it>:try-it,label,input,textarea,button,button-primary,url,problems,cors<apg-servers>:servers<apg-auth>:auth,scheme,scheme-name,status<apg-code-samples>:code-samples