{ "_lib": "./dist/index.js", "_templates": { "indexDatatable": { "description": "Datatable based on an Index", "component": "Datatable" }, "recordForm": { "description": "Form for saving a record", "component": "Form" } }, "Body1": { "name": "Body1", "description": "Sets the font properties as Roboto Body 1", "props": { "text": "string" }, "tags": [] }, "Body2": { "name": "Body2", "description": "Sets the font properties as Roboto Body 2", "props": { "text": "string" }, "tags": [] }, "Select": { "name": "Select", "description": "A material design select (aka Dropdown, aka Combobox)", "props": { "onSelect": "event", "value": "string", "width": "string", "variant": { "type": "options", "options": [ "filled", "outlined" ] }, "disabled": "bool", "required": "bool", "label": "string", "helperText": "string", "persistent": "bool" } }, "List": { "name": "List", "description": "A Material Design List Component.", "props": { "onSelect": "event", "singleSelection": "bool", "variant": { "type": "options", "options": ["one-line", "two-line"], "default": "one-line" }, "inputElement": { "type": "options", "options": ["None", "Radiobutton", "Checkbox"], "default": "None" } } }, "ListItem": { "name": "ListItem", "description": "Use as item in a 'List' or 'Select' component", "props": { "value": "string", "text": "string", "secondaryText": "string", "leadingIcon": "string", "trailingIcon": "string", "disabled": "bool", "dividerAfter": "bool" } }, "Button": { "name": "Button", "children": false, "description": "A Material Design button with different variations. It renders as an anchor if href is passed to it.", "props": { "onClick": "event", "variant": { "type": "options", "options": ["text", "raised", "unelevated", "outlined"], "default": "text" }, "colour": { "type": "options", "options": ["primary", "secondary"], "default": "primary" }, "size": { "type": "options", "options": ["small", "medium", "large"], "default": "medium" }, "href": "string", "icon": "string", "trailingIcon": "bool", "fullwidth": "bool", "text": "string", "disabled": "bool" }, "tags": [] }, "Caption": { "name": "Caption", "description": "Sets the font properties as Roboto Caption", "props": { "text": "string" }, "tags": [] }, "BasicCard": { "name": "BasicCard", "description": "This is a basic card", "props": { "heading": "string", "subheading": "string", "content": "string", "imageUrl": "string", "button1Text": "string", "button2Text": "string", "cardClick": "event", "button1Click": "event", "button2Click": "event" } }, "Card": { "name": "Card", "description": "A Material Card container. Accepts CardHeader, CardBody and CardFooter as possible children", "props": { "width": {"type": "string", "default": "350px"}, "height": "string", "variant": { "type": "options", "options": ["standard", "outlined"], "default": "outlined" } } }, "CardBody": { "name": "CardBody", "description": "A Material CardBody component. Contains the main content of a Material Card component", "props": { "onClick": "event" } }, "CardImage": { "name": "CardImage", "description": "An image component for the Material Card component", "props": { "displayHorizontal": "bool", "url": "string", "title": "string", "subtitle": "string" } }, "CardHeader": { "name": "CardHeader", "description": "Displays a icon, title and subtitle above main body of the Material Card component", "props": { "title": "string", "subtitle": "string", "icon": "string" } }, "CardFooter": { "name": "CardFooter", "description": "Displays buttons / icon buttons as actions for the Material Card component", "props": { "padding": "string" } }, "Checkbox": { "name": "Checkbox", "description": "A Material Design checkbox. Supports aligning label before or after checkbox.", "props": { "onClick": "event", "id": "string", "label": "string", "disabled": "bool", "alignEnd": "bool", "indeterminate": "bool", "checked": "bool" }, "tags": [] }, "Checkboxgroup": { "name": "Checkboxgroup", "description": "A group of material design checkboxes. Supports row and column orientation.", "props": { "onChange": "event", "label":"string", "orientation": { "type": "options", "options": ["row", "column"], "default": "row" }, "disabled": "bool", "alignEnd": "bool" } }, "Datatable": { "name": "Datatable", "description": "A Material Design component to represent tabular data.", "props": { "onLoad":"event" }, "tags": [] }, "DatatableHead": { "name": "DatatableHead", "description": "Material Design .", "props": {} }, "DatatableCell": { "name": "DatatableCell", "description": "Material Design .", "props": {} }, "DatatableBody": { "name": "DatatableBody", "description": "Material Design .", "props": {} }, "DatatableRow": { "name": "DatatableRow", "description": "Material Design .", "props": {} }, "DatePicker": { "name": "DatePicker", "description": "Material Design DatePicker", "props": { "date": "string", "label": "string", "onSelect": "event" }, "tags": [] }, "H1": { "name": "H1", "description": "Sets the font properties as Roboto Headline1", "props": { "text": "string" }, "tags": [] }, "H2": { "name": "H2", "description": "Sets the font properties as Roboto Headline2", "props": { "text": "string" }, "tags": [] }, "H3": { "name": "H3", "description": "Sets the font properties as Roboto Headline3", "props": { "text": "string" }, "tags": [] }, "H4": { "name": "H4", "description": "Sets the font properties as Roboto Headline4", "props": { "text": "string" }, "tags": [] }, "H5": { "name": "H5", "description": "Sets the font properties as Roboto Headline5", "props": { "text": "string" }, "tags": [] }, "H6": { "name": "H6", "description": "Sets the font properties as Roboto Headline6", "props": { "text": "string" }, "tags": [] }, "IconButton": { "name": "IconButton", "description": "An icon button component", "props": { "onClick": "event", "disabled": "bool", "href": "string", "icon": "string", "size": { "type":"options", "options": ["small", "medium", "large"], "default": "medium" } }, "tags": [] }, "Label": { "name": "Label", "description": "A simple label component that displays its text in the standard Roboto Material Design font", "props": { "text": "string", "bold": "bool" }, "tags": [] }, "Menu": { "name": "Menu", "description": "A Material Design menu component. Anchor to other components to create a pop-out menu.", "props": { "onSelect": "event", "width": "string", "open": "bool", "useFixedPosition": "bool", "absolutePositionX": "number", "absolutePositionY": "number" } }, "Overline": { "name": "Overline", "description": "Sets the font properties as Roboto Overline", "props": { "text": "string" }, "tags": [] }, "Radiobutton": { "name": "Radiobutton", "description": "A Material Design radiobutton. Supports aligning label before or after radiobutton.", "props": { "onClick": "event", "id": "string", "label": "string", "name": "string", "disabled": "bool", "alignEnd": "bool" }, "tags": [] }, "Radiobuttongroup": { "name": "Radiobuttongroup", "description": "A Material Design Radiobutton group. Supports row and column orientation.", "props": { "onChange": "event", "label": "string", "name": "string", "orientation": { "type": "options", "options": ["row", "column"], "default": "row" }, "fullwidth": "bool", "alignEnd": "bool", "disabled": "bool" } }, "Sub1": { "name": "Sub1", "description": "Sets the font properties as Roboto Subtitle1", "props": { "text": "string" }, "tags": [] }, "Sub2": { "name": "Sub2", "description": "Sets the font properties as Roboto Subtitle2", "props": { "text": "string" }, "tags": [] }, "Textfield": { "name": "Textfield", "description": "A Material Design textfield with multiple variants. Can also be converted to a text area / multine text field.", "props": { "onChange": "event", "value": "string", "label": "string", "variant": { "type": "options", "options": ["standard", "outlined", "filled"], "default": "standard" }, "disabled": "bool", "fullwidth": "bool", "colour": { "type": "options", "options": ["primary", "secondary"], "default": "primary" }, "size":{ "type": "options", "options": ["small", "medium", "large"], "default": "medium" }, "type": { "type": "options", "options": ["text", "password"], "default": "text" }, "required": "bool", "minLength": "number", "maxLength": "number", "helperText": "string", "placeholder": "string", "icon": "string", "trailingIcon": "bool", "textarea": "bool", "persistent": "bool" }, "tags": [] }, "Switch": { "name": "Switch", "description": "A material design switch component", "props": { "alignEnd": "bool", "disabled": "bool", "checked": "bool", "label": "string", "id": "string" }, "tags": [] }, "Slider": { "name": "Slider", "description": "A material design slider component", "props": { "variant": { "type": "options", "options": ["continuous", "discrete"], "default": "continuous" }, "showTicks": "bool", "min": "number", "max": "number", "value": "number", "step": "number", "label": "string", "disabled": "bool" }, "tags": [] } }