# Sketch of uischema
## Requirements
* Must be able to pass custom props to components through the uischema
* Must be able to pass the schema and context along to nested uses of ScrudComponent so that they may render themselves
* Must be able to specify the ordering of elements for render.
## Example
```javascript=
[
{
"property_name": "foo",
"component": "TextField",
"component_props": {
"label": "Foo",
"required": true
}
}
]
```
## Next step
* Discuss
* Specify using json-schema
# current ssr-form-gen
```javascript=
{
"foo": { /* component settings */}
}
```
# current vue-form-json-schema
```javascript=
[
{
"component": "Form",
"fieldOptions": {
"props": {
"context": {
"schema": "http://schema.org/",
"openteams": "http://api.openteams.com/json-ld/common/",
"openteams-partner": "http://api.openteams.com/json-ld/PartnerProgramApplication/",
"@id": "http://api.openteams.com/json-ld/PartnerProgramApplication",
"first_name": "schema:givenName",
"last_name": "schema:familyName",
"email": "schema:email",
"phone_number": "schema:telephone",
"country": "schema:country",
"company_legal_name": "schema:legalName",
"company_address": "schema:location",
"company_website": "openteams:companyWebsite",
"linkedin_url": "openteams:linkedinURL",
"github_url": "openteams:githubURL",
"top_skills": {
"@id": "schema:skills",
"@container": "@list",
"openteams:contents": {
"@type": "openteams:SkillEntry"
}
},
"services": {
"@id": "openteams-partner:services",
"@container": "@list",
"openteams:contents": "openteams:Service"
},
"average_hourly_rate": {
"@id": "schema:PriceSpecification",
"amount": "schema:price",
"currency": "schema:priceCurrency"
},
"operational_painpoints": {
"@id": "openteams:painPoints",
"@container": "@list",
"openteams:contents": "openteams:operational_painpoint"
},
"partnership_objectives": {
"@id": "openteams:partnershipObjectives",
"@container": "@list"
},
"found_through": {
"@id": "openteams:foundThrough",
"@container": "@list"
}
},
"url": "https://backend.staging.openteams.com/api/partner-profiles/",
"requestType": "post"
}
},
"children": [
{
"component": "FormFirstName",
"fieldOptions": {
"props": {
"label": "first_name"
}
},
"children": []
},
{
"component": "FormLastName",
"fieldOptions": {
"props": {
"label": "last_name"
}
},
"children": []
},
{
"component": "FormEmail",
"fieldOptions": {
"props": {
"label": "email"
}
},
"children": []
},
{
"component": "FormPhoneNumber",
"fieldOptions": {
"props": {
"label": "phone_number"
}
},
"children": []
},
{
"component": "FormCountry",
"fieldOptions": {
"props": {
"label": "country"
}
},
"children": []
},
{
"component": "FormCompanyName",
"fieldOptions": {
"props": {
"label": "company_legal_name"
}
},
"children": []
},
{
"component": "FormCompanyAddress",
"fieldOptions": {
"props": {
"label": "company_address"
}
},
"children": []
},
{
"component": "FormCompanyURL",
"fieldOptions": {
"props": {
"label": "company_website"
}
},
"children": []
},
{
"component": "FormLinkedInURL",
"fieldOptions": {
"props": {
"label": "linkedin_url"
}
},
"children": []
},
{
"component": "FormGitHubURL",
"fieldOptions": {
"props": {
"label": "github_url"
}
},
"children": []
},
{
"component": "FormCompanySkills",
"fieldOptions": {
"props": {
"label": "top_skills"
}
},
"children": []
},
{
"component": "FormServiceSelect",
"fieldOptions": {
"props": {
"label": "services"
}
},
"children": []
},
{
"component": "FormHourlyRate",
"fieldOptions": {
"props": {
"label": "average_hourly_rate"
}
},
"children": []
},
{
"component": "FormPainPoints",
"fieldOptions": {
"props": {
"label": "operational_painpoints"
}
},
"children": []
},
{
"component": "FormTextField",
"fieldOptions": {
"props": {
"label": "partnership_objectives"
}
},
"children": []
},
{
"component": "FormFeedback",
"fieldOptions": {
"props": {
"label": "found_through"
}
},
"children": []
}
]
}
]
```
Google Drive
Gist
Clipboard
Sign in with Wallet
