Skip to content
This repository was archived by the owner on Nov 28, 2022. It is now read-only.

Commit 4ce4faf

Browse files
uppal101uppal101
committed
Attempt to style select input and shipdate input
1 parent 6fb63d6 commit 4ce4faf

File tree

12 files changed

+1029
-373
lines changed

12 files changed

+1029
-373
lines changed

‎packages/api-explorer-ui/.babelrc

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
11
{
2-
"presets": ["es2015", "react"]
2+
"presets": ["es2015", "react"],
3+
"plugins": ["transform-object-rest-spread"]
34
}

‎packages/api-explorer-ui/lib/create-docs.js

Lines changed: 1 addition & 103 deletions
Original file line numberDiff line numberDiff line change
@@ -29,109 +29,7 @@ module.exports = (oas, apiSetting) => {
2929
category: { apiSetting },
3030
api: { method },
3131
swagger: { path },
32-
body: `
33-
[block:textarea]
34-
{
35-
"text": "# This is text area"
36-
}
37-
[/block]
38-
[block:html]
39-
{
40-
"html": "<p>This is an html</p>"
41-
42-
}
43-
[/block]
44-
[block:api-header]
45-
{
46-
"title": "This is cool header",
47-
"sidebar": true
48-
}
49-
[/block]
50-
51-
[block:callout]
52-
{
53-
"type": "info",
54-
"title": "Callout"
55-
}
56-
[/block]
57-
58-
[block:image]
59-
{
60-
"images": [
61-
{
62-
"image": [
63-
"https://files.readme.io/924824e-fullsizeoutput_314.jpeg",
64-
"fullsizeoutput_314.jpeg",
65-
640,
66-
1136,
67-
"#c8b396"
68-
]
69-
}
70-
]
71-
}
72-
[/block]
73-
74-
[block:image]
75-
{
76-
"images": [
77-
{
78-
"image": [
79-
"https://files.readme.io/dce21f0-IMG_0418.JPG",
80-
"IMG_0418.JPG",
81-
640,
82-
1136,
83-
"#9e918d"
84-
],
85-
"caption": "*doggo*"
86-
}
87-
]
88-
}
89-
[/block]
90-
91-
[block:code]
92-
{
93-
"codes": [
94-
{
95-
"code": "whjdwhjwejhkwhjk",
96-
"language": "text",
97-
"status": 400,
98-
"name": " "
99-
},
100-
{
101-
"code": "var a = 1;",
102-
"language": "javascript"
103-
}
104-
]
105-
}
106-
[/block]
107-
108-
[block:parameters]
109-
{
110-
"data": {
111-
"0-0": "*arbitrary*",
112-
"0-1": "info",
113-
"0-2": "test",
114-
"h-0": "test",
115-
"h-1": "1",
116-
"h-2": "2"
117-
},
118-
"cols": 3,
119-
"rows": 1
120-
}
121-
[/block]
122-
123-
[block:embed]
124-
{
125-
"html": "<iframe class=\\"embedly-embed\\" src=\\"//cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.youtube.com%2Fembed%2FjYjDqzZ4gjY%3Ffeature%3Doembed&url=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DjYjDqzZ4gjY&image=https%3A%2F%2Fi.ytimg.com%2Fvi%2FjYjDqzZ4gjY%2Fhqdefault.jpg&key=f2aa6fc3595946d0afc3d76cbbd25dc3&type=text%2Fhtml&schema=youtube\\" width=\\"640\\" height=\\"480\\" scrolling=\\"no\\" frameborder=\\"0\\" allowfullscreen></iframe>",
126-
"url": "https://www.youtube.com/watch?v=jYjDqzZ4gjY",
127-
"title": "White kids Watch me whip school Chorus - chorus white kids singing Watch me whip",
128-
"favicon": "https://s.ytimg.com/yts/img/ringo/img/favicon-vfl8qSV2F.ico",
129-
"image": "https://i.ytimg.com/vi/jYjDqzZ4gjY/hqdefault.jpg",
130-
"sidebar": true
131-
}
132-
[/block]
133-
134-
`,
32+
body: '',
13533
});
13634
}
13735
});

‎packages/api-explorer-ui/package-lock.json

Lines changed: 40 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎packages/api-explorer-ui/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,7 @@
4141
"devDependencies": {
4242
"babel-jest": "^20.0.3",
4343
"babel-loader": "^7.1.1",
44+
"babel-plugin-transform-object-rest-spread": "^6.26.0",
4445
"babel-preset-es2015": "^6.24.1",
4546
"babel-preset-react": "^6.24.1",
4647
"babelify": "^7.3.0",

‎packages/api-explorer-ui/src/Params.jsx

Lines changed: 29 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,18 @@ const PropTypes = require('prop-types');
33
const Form = require('react-jsonschema-form').default;
44
const UpDownWidget = require('react-jsonschema-form/lib/components/widgets/UpDownWidget').default;
55
const TextWidget = require('react-jsonschema-form/lib/components/widgets/TextWidget').default;
6-
6+
const SelectWidget = require('react-jsonschema-form/lib/components/widgets/SelectWidget').default;
7+
const DateTimeWidget = require('react-jsonschema-form/lib/components/widgets/DateTimeWidget')
8+
.default;
9+
// const BaseInput = require('react-jsonschema-form/lib/components/widgets/BaseInput').default;
10+
const rangeSpec = require('react-jsonschema-form/lib/utils').rangeSpec;
711
const TitleField = require('./form-components/TitleField');
812
const ObjectField = require('./form-components/ObjectField');
13+
const FieldTemplate = require('./form-components/FieldTemplate');
14+
const ArrayField = require('./form-components/FieldTemplate');
15+
const BaseInput = require('./form-components/BaseInput');
16+
const SelectInput = require('./form-components/SelectInput');
17+
const CustomDateTime = require('./form-components/DateTimeWidget');
918

1019
const Oas = require('./lib/Oas');
1120

@@ -55,6 +64,12 @@ const parametersToJsonSchema = require('./lib/parameters-to-json-schema');
5564
// );
5665
// }
5766

67+
const CustomTextWidget = props => <BaseInput {...props} />;
68+
69+
const CustomUpDownWidget = props => (
70+
<BaseInput type="number" {...props} {...rangeSpec(props.schema)} />
71+
);
72+
5873
function Params({ oas, operation, formData, onChange }) {
5974
const jsonSchema = parametersToJsonSchema(operation, oas);
6075

@@ -69,20 +84,24 @@ function Params({ oas, operation, formData, onChange }) {
6984
<h3>{schema.label}</h3>
7085
<div className="param-header-border" />
7186
</div>
87+
<div className="param-item-info" />
7288
<Form
7389
id={`form-${operation.operationId}`}
7490
schema={schema.schema}
75-
widgets={{ int64: UpDownWidget, int32: UpDownWidget, uuid: TextWidget }}
91+
widgets={{
92+
int64: CustomUpDownWidget,
93+
int32: CustomUpDownWidget,
94+
TextWidget: CustomTextWidget,
95+
}}
7696
// eslint-disable-next-line no-console
7797
onSubmit={form => console.log('submit', form.formData)}
7898
formData={formData[schema.type]}
7999
onChange={form => {
80100
// return onChange({ [schema.type]: { $set: form.formData } })
81-
return onChange({ [schema.type]: form.formData })
101+
return onChange({ [schema.type]: form.formData });
82102
}}
83-
// FieldTemplate={CustomFieldTemplate}
84-
fields={{ObjectField, TitleField}}
85-
className="param-table"
103+
FieldTemplate={FieldTemplate}
104+
fields={{ ObjectField, TitleField }}
86105
>
87106
<button type="submit" style={{ display: 'none' }} />
88107
</Form>
@@ -101,4 +120,8 @@ Params.propTypes = {
101120
onChange: PropTypes.func.isRequired,
102121
};
103122

123+
CustomUpDownWidget.propTypes = {
124+
schema: PropTypes.shape({}).isRequired,
125+
};
126+
104127
module.exports = Params;

0 commit comments

Comments
 (0)