API Reference

Complete API documentation for components, utilities, and framework core

Components

Form Components

Display Components

Navigation Components

Layout Components

Utility Components

Reference/API/List

List

Flexible list component for navigation menus, item lists, and content organization

🔧 Props

Property	Type	Default	Description
items*	Array	-	Array of list items (strings or objects)
itemTemplate	Function	undefined	Custom render function for each item
onItemClick	Function	undefined	Click handler: (item, index) => void
variant	string	'default'	'default', 'navigation', 'bordered', 'compact'
dividers	boolean	false	Show dividers between items
class	string	-	Additional CSS classes

💻 Examples

Simple List

javascript•Simple List

return List({
  items: ['Item 1', 'Item 2', 'Item 3']
})

▶️ Live Preview

Item 1
Item 2
Item 3

💡 Click "Edit Code" to modify the example

🔄 Click "Apply Changes" to see your modifications

↩️ Click "Reset" to restore original code

Navigation List with Click Handler

javascript•Navigation List with Click Handler

return NavigationList({
  items: [
    { icon: 'oj-ux-ico-home', label: 'Home', path: '/' },
    { icon: 'oj-ux-ico-tree-view', label: 'Overview', path: '/overview' }
  ],
  onItemClick: (item) => navigateTo(item.path)
})

▶️ Live Preview

💡 Click "Edit Code" to modify the example

🔄 Click "Apply Changes" to see your modifications

↩️ Click "Reset" to restore original code

💡 Usage Tips

🔗 Related

Explore vwf

Discover what vwf can do