Commit 7f6791be authored by Sandro Lutz's avatar Sandro Lutz Committed by scmoritz
Browse files

Update documentation of components and models

parent 6368fbc0
import m from 'mithril';
import { Checkbox } from 'polythene-mithril';
/**
* Generic Checkbox component
*
* Attributes:
*
* - `label` text label; no default value
* - `name` element name
* - `className` *optional*
* - `defaultChecked` *optional* static value; default `false`
* - `checked` *optional* managed state; default `false`
* - `disabled` *optional* set `true` to disable the checkbox
* - `onChange` *optional*
*
* Examples:
*
* m(CheckboxComponent, { name: 'terms', label: 'Accept terms' })
*
* @return {CheckboxComponent} generic checkbox as mithril component.
*/
export default class CheckboxComponent {
constructor() {
this.defaultProps = {};
......
import m from 'mithril';
/**
* Generic Dropdown component
*
* Attributes:
*
* - `data` array containing objects like `{ id: 1, name: 'Value 1' }`
* - `onchange` *optional*
*
* Examples:
*
* m(DropdownComponent, {
* data: [
* { id: 1, name: 'Value 1' },
* { id: 2, name: 'Value 2' },
* ],
* onchange: event => {
* // some event handling
* },
* })
*
* @return {DropdownComponent} generic dropdown input as mithril component.
*/
export default class DropdownComponent {
constructor() {
this.selectedId = 0;
......
......@@ -4,6 +4,25 @@ import { RadioGroup } from 'polythene-mithril';
// RadioGroupCSS.addStyle('', {})
/**
* Generic RadioGroup component
*
* Attributes:
*
* - `buttons` list of radio button options
* - `name` field name
* - `className` *optional*
* - `onChange` *optional*
*
* Examples:
*
* m(RadioGroupComponent, {
* buttons: ['Option 1', 'Option 2'],
* name: 'optionName',
* })
*
* @return {RadioGroupComponent} generic checkbox as mithril component.
*/
export default class RadioGroupComponent {
constructor() {
this.defaultProps = {
......
......@@ -13,6 +13,31 @@ TabsCSS.addStyle('.themed-tabs', {
color_dark_tab_indicator: '#c51162',
});
/**
* Generic Tab component
*
* Attributes:
*
* - `tabs` list of button options
* - `className` defaulting to `themed-tabs`
* - `activeSelected` if true, the active tab is selected.
* - `onChange` *optional*
*
* Examples:
*
* m(TabComponent, {
* tabs: [
* { label: 'Tab 1', url: { href: '/tab1', onupdate: m.route.link, index: 0 } },
* { label: 'Tab 2', url: { href: '/tab2', onupdate: m.route.link, index: 1 } },
* ],
* className: 'themed-tabs',
* activeSelected: true,
* element: 'tab',
* selectedTab: this._selectedTabIndex,
* })
*
* @return {TabComponent} generic tabs as mithril component.
*/
export default class TabComponent {
constructor() {
this.defaultProps = {
......
......@@ -4,6 +4,34 @@ import { TextFieldCSS } from 'polythene-css';
TextFieldCSS.addStyle('.my-TextField', {});
/**
* Generic TextField component
*
* Attributes:
*
* - `label` text label; default `Unnamed TextField`
* - `name` element name
* - `className` defaulting to `my-TextField`
* - `disabled` *optional* set `true` to disable the checkbox
* - `floatingLabel` *optional* defaulting to `false`
* - `multiLine` *optional* default `false`
* - `help` *optional* help text to be shown below the input field
* - `onChange` *optional*
* - *optional* all HTML input field options available.
*
* Examples:
*
* m(TextField, {
label: 'Enter search...',
onChange: state => {
this.search = state.value;
},
},
'',
)
*
* @return {TextFieldComponent} generic text field as mithril component.
*/
export default class TextFieldComponent {
constructor() {
this.defaultProps = {
......
......@@ -22,6 +22,11 @@ function tabToUrl() {
};
}
/**
* Navigation model to store the current state of the main navigation.
*
* @return {Navigation} Navigation state model
*/
export default class Navigation {
constructor() {
checkLogin();
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment