mirror of
https://github.com/Redocly/redoc.git
synced 2024-11-25 18:13:44 +03:00
Add RequestSamples component
This commit is contained in:
parent
5fd757076c
commit
30fee46cfb
|
@ -18,8 +18,8 @@
|
|||
</div>
|
||||
<div class="method-samples">
|
||||
<div *ngIf="data.bodyParam">
|
||||
<header> Body sample </header>
|
||||
<schema-sample pointer="{{data.bodyParam._pointer}}/schema"> </schema-sample>
|
||||
<request-samples [pointer]="pointer" [bodySchemaPtr]="data.bodyParam._pointer">
|
||||
</request-samples>
|
||||
</div>
|
||||
<div>
|
||||
<responses-samples pointer="{{pointer}}/responses"> </responses-samples>
|
||||
|
|
|
@ -6,12 +6,13 @@ import ParamsList from '../ParamsList/params-list';
|
|||
import ResponsesList from '../ResponsesList/responses-list';
|
||||
import ResponsesSamples from '../ResponsesSamples/responses-samples';
|
||||
import SchemaSample from '../SchemaSample/schema-sample';
|
||||
import RequestSamples from '../RequestSamples/request-samples';
|
||||
|
||||
@RedocComponent({
|
||||
selector: 'method',
|
||||
templateUrl: './lib/components/Method/method.html',
|
||||
styleUrls: ['./lib/components/Method/method.css'],
|
||||
directives: [ParamsList, ResponsesList, ResponsesSamples, SchemaSample],
|
||||
directives: [ParamsList, ResponsesList, ResponsesSamples, SchemaSample, RequestSamples],
|
||||
inputs: ['tag']
|
||||
})
|
||||
export default class Method extends BaseComponent {
|
||||
|
|
10
lib/components/RequestSamples/request-samples.html
Normal file
10
lib/components/RequestSamples/request-samples.html
Normal file
|
@ -0,0 +1,10 @@
|
|||
<header *ngIf="data.bodySchemaPtr || data.samples.length"> Request samples </header>
|
||||
<schema-sample *ngIf="!data.samples.length" [pointer]="data.bodySchemaPtr"> </schema-sample>
|
||||
<tabs *ngIf="data.samples.length">
|
||||
<tab tabTitle="json">
|
||||
<schema-sample [pointer]="data.bodySchemaPtr"> </schema-sample>
|
||||
</tab>
|
||||
<tab *ngFor="#sample of data.samples" [tabTitle]="sample.lang">
|
||||
<pre innerHtml="{{sample.source | prism:sample.lang}}"></pre>
|
||||
</tab>
|
||||
</tabs>
|
27
lib/components/RequestSamples/request-samples.js
Normal file
27
lib/components/RequestSamples/request-samples.js
Normal file
|
@ -0,0 +1,27 @@
|
|||
'use strict';
|
||||
|
||||
import {RedocComponent, BaseComponent} from '../base';
|
||||
import JsonPointer from '../../utils/JsonPointer';
|
||||
import {Tabs, Tab} from '../../common/components/Tabs/tabs';
|
||||
import SchemaSample from '../SchemaSample/schema-sample';
|
||||
import {PrismPipe} from '../../utils/pipes';
|
||||
|
||||
@RedocComponent({
|
||||
selector: 'request-samples',
|
||||
templateUrl: './lib/components/RequestSamples/request-samples.html',
|
||||
styleUrls: ['./lib/components/RequestSamples/request-samples.css'],
|
||||
directives: [SchemaSample, Tabs, Tab],
|
||||
inputs: ['bodySchemaPtr'],
|
||||
pipes: [PrismPipe]
|
||||
})
|
||||
export default class RequestSamples extends BaseComponent {
|
||||
constructor(schemaMgr) {
|
||||
super(schemaMgr);
|
||||
}
|
||||
|
||||
prepareModel() {
|
||||
this.data = {};
|
||||
this.data.bodySchemaPtr = JsonPointer.join(this.bodySchemaPtr, 'schema');
|
||||
this.data.samples = this.componentSchema['x-code-samples'] || [];
|
||||
}
|
||||
}
|
31
lib/components/RequestSamples/request-samples.scss
Normal file
31
lib/components/RequestSamples/request-samples.scss
Normal file
|
@ -0,0 +1,31 @@
|
|||
@import '../../common/styles/variables';
|
||||
|
||||
header {
|
||||
font-size: 16px;
|
||||
margin: 5px 0;
|
||||
color: $sample-panel-headers-color;
|
||||
text-transform: uppercase;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
:host > tabs > ul li {
|
||||
font-size: 13px;
|
||||
margin: 2px 0;
|
||||
padding: 2px 10px;
|
||||
color: #8A9094;
|
||||
line-height: 1.25;
|
||||
color: $sample-panel-headers-color;
|
||||
|
||||
&.active {
|
||||
background-color: white;
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
|
||||
:host tabs ul {
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
pre {
|
||||
overflow-x: auto;
|
||||
}
|
Loading…
Reference in New Issue
Block a user