text: import React, { useState, useRef } from "react";
  import { storiesOf } from "@storybook/react";
  import useSelect from "@rooks/use-select";
  import README from "@rooks/use-select/README.md";
  
  storiesOf("useSelect", module)
    .addParameters({
      readme: {
        sidebar: README
      }
    })
    .add("basic example", () => <UseSelectDemo />);
  
  const list = [
    {
      heading: "Tab 1",
      content: "Tab 1 Content"
    },
    {
      heading: "Tab 2",
      content: "Tab 2 Content"
    }
  ];
  
  function UseSelectDemo() {
    const { index, setIndex, item } = useSelect(list, 0);
    return (
      <div>
        {list.map((listItem, listItemIndex) => (
          <button
            key={listItemIndex}
            style={{
              background: index === listItemIndex ? "dodgerblue" : "inherit"
            }}
            onClick={() => setIndex(listItemIndex)}
          >
            {listItem.heading}
          </button>
        ))}
        <p>{item.content}</p>
      </div>
    );
  }
  