209 lines
5.2 KiB
JSON
209 lines
5.2 KiB
JSON
{
|
|
"_lib": "./dist/index.js",
|
|
"button" : {
|
|
"importPath": "button",
|
|
"name": "Button",
|
|
"description": "an html <button />",
|
|
"props": {
|
|
"contentText": { "type": "string", "default": "Button" },
|
|
"contentComponent": "component",
|
|
"className": {"type": "string", "default": "default"},
|
|
"disabled": "bool",
|
|
"onClick": "event"
|
|
},
|
|
"tags": ["button"]
|
|
},
|
|
"login" : {
|
|
"importPath": "Login",
|
|
"name": "Login Control",
|
|
"desciption": "A control that accepts username, password an also handles password resets",
|
|
"props" : {
|
|
"logo": "asset",
|
|
"loginRedirect": "string",
|
|
"usernameLabel": {"type":"string", "default": "Username"},
|
|
"passwordLabel": {"type":"string", "default": "Password"},
|
|
"loginButtonLabel": {"type":"string", "default": "Login"},
|
|
"buttonClass": "string"
|
|
},
|
|
"tags": ["login", "credentials", "password", "logon"]
|
|
},
|
|
"form" : {
|
|
"importPath": "Form",
|
|
"name": "Form",
|
|
"desciption": "A form - allgned fields with labels",
|
|
"props" : {
|
|
"containerClass": "string",
|
|
"formControls": {
|
|
"type":"array",
|
|
"elementDefinition": {
|
|
"label": "string",
|
|
"control":"component"
|
|
}
|
|
}
|
|
},
|
|
"tags": ["form"]
|
|
},
|
|
"textbox" : {
|
|
"importPath": "Textbox",
|
|
"name": "Textbox",
|
|
"desciption": "An input type=text or password",
|
|
"props" : {
|
|
"value": "string",
|
|
"hideValue": "boolean",
|
|
"className": {"type": "string", "default": "default"}
|
|
},
|
|
"tags": ["form"]
|
|
},
|
|
"stackpanel": {
|
|
"importPath": "StackPanel",
|
|
"name": "StackPanel",
|
|
"desciption": "Layout elements in a stack, either horizontally or vertically",
|
|
"props" : {
|
|
"direction": {
|
|
"type": "options",
|
|
"options": ["horizontal", "vertical"],
|
|
"default":"horizontal"
|
|
},
|
|
"children": {
|
|
"type":"array",
|
|
"elementDefinition": {
|
|
"control":"component"
|
|
}
|
|
},
|
|
"width": {"type":"string","default":"auto"},
|
|
"height": {"type":"string","default":"auto"},
|
|
"containerClass":"string",
|
|
"itemContainerClass":"string"
|
|
},
|
|
"tags": ["div", "container", "layout", "panel"]
|
|
},
|
|
"grid": {
|
|
"importPath": "Grid",
|
|
"name": "Grid",
|
|
"desciption": "CSS Grid layout ",
|
|
"props" : {
|
|
"gridTemplateRows": "string",
|
|
"gridTemplateColumns": "string",
|
|
"children": {
|
|
"type":"array",
|
|
"elementDefinition": {
|
|
"control":"component",
|
|
"gridColumn":"string",
|
|
"gridRow":"string",
|
|
"gridColumnStart":"string",
|
|
"gridColumnEnd":"string",
|
|
"gridRowStart":"string",
|
|
"gridRowEnd":"string"
|
|
}
|
|
},
|
|
"width": {"type":"string","default":"auto"},
|
|
"height": {"type":"string","default":"auto"},
|
|
"containerClass":"string",
|
|
"itemContainerClass":"string"
|
|
},
|
|
"tags": ["div", "container", "layout", "panel", "grid"]
|
|
},
|
|
"text": {
|
|
"importPath": "Text",
|
|
"name": "Text",
|
|
"desciption": "stylable block of text",
|
|
"props" : {
|
|
"value": "string",
|
|
"containerClass": "string",
|
|
"font": "string",
|
|
"color": "string",
|
|
"textAlign": {
|
|
"type": "options",
|
|
"default":"inline",
|
|
"options": [
|
|
"left", "center", "right"
|
|
]
|
|
},
|
|
"verticalAlign": {
|
|
"type": "options",
|
|
"default":"inline",
|
|
"options": [
|
|
"top", "middle", "bottom"
|
|
]
|
|
},
|
|
"display": {
|
|
"type": "options",
|
|
"default":"inline",
|
|
"options": [
|
|
"inline", "block", "inline-block"
|
|
]
|
|
}
|
|
},
|
|
"tags": ["div", "container"]
|
|
},
|
|
"panel": {
|
|
"importPath": "Panel",
|
|
"name": "Panel",
|
|
"desciption": "A stylable div with a component inside",
|
|
"props" : {
|
|
"text": "string",
|
|
"component": "component",
|
|
"containerClass": "string",
|
|
"background": "string",
|
|
"border": "string",
|
|
"borderRadius":"string",
|
|
"font": "string",
|
|
"color": "string",
|
|
"padding": "string",
|
|
"display": {
|
|
"type": "options",
|
|
"default":"inline",
|
|
"options": [
|
|
"inline", "block", "inline-block"
|
|
]
|
|
}
|
|
},
|
|
"tags": ["div", "container"]
|
|
},
|
|
"nav": {
|
|
"importPath": "Nav",
|
|
"name": "Nav",
|
|
"desciption": "A nav - a side bar of buttons that control the currently active component",
|
|
"props" : {
|
|
"navBarBackground": {"type" :"string", "default":"silver"},
|
|
"navBarBorder": "string",
|
|
"navBarColor": {"type" :"string", "default":"black"},
|
|
"selectedItemBackground": {"type" :"string", "default":"white"},
|
|
"selectedItemColor": {"type" :"string", "default":"black"},
|
|
"selectedItemBorder": "string",
|
|
"itemHoverBackground": {"type" :"string", "default":"gainsboro"},
|
|
"itemHoverColor": {"type" :"string", "default":"black"},
|
|
"items": {
|
|
"type": "array",
|
|
"elementDefinition" : {
|
|
"title": "string",
|
|
"component": "component"
|
|
}
|
|
}
|
|
|
|
},
|
|
"tags": ["nav", "navigation", "sidebar"]
|
|
},
|
|
"table": {
|
|
"importPath": "Table",
|
|
"name": "Table",
|
|
"desciption": "An HTML table",
|
|
"props" : {
|
|
"data": "state",
|
|
"columns": {
|
|
"type": "array",
|
|
"elementDefinition" : {
|
|
"title": "string",
|
|
"value": "string"
|
|
}
|
|
},
|
|
"onRowClick":"event",
|
|
"tableClass": {"type":"string", "default":"table-default"},
|
|
"theadClass": {"type":"string", "default":"thead-default"},
|
|
"tbodyClass": {"type":"string", "default":"tbody-default"},
|
|
"trClass": {"type":"string", "default":"tr-default"},
|
|
"thClass": {"type":"string", "default":"th-default"}
|
|
},
|
|
"tags": ["table"]
|
|
}
|
|
} |