search

os-js / osjs-gui

OS.js GUI Module
https://manual.os-js.org/v3/
Other
18 stars 10 forks source link

Provide a non-nestable version of Tabs component #14

Open andersevenrud opened 5 years ago

andersevenrud commented 5 years ago

Currently the Tabs component is using hyperapp-nestable, which is great, but when you update a component property, it will not react to this unless you specify a key.

The downside to this is that it will force you to re-render the component.

To get around this, a slightly different version of the tabs component could be added:

app({
  selectedTab: -1,
  tabs: ['My Tab']
}, {
  setSelectedTab: selectedTab => ({selectedTab})
}, (state, actions) => {
  return h(Tabs, {
    selectedIndex: state.selectedTab,
    labels: state.tabs,
    onchange: (ev, index) => actions.setSelectedTab(index)
  }, [
    h(Box, {}, 'Tab contents'}
  ]);
}, $content);

This requires developer to wire up the tab switch event.