import * as React from 'react';
import { boolean } from '@storybook/addon-knobs';
import { State, Store } from '@sambego/storybook-state';
import Link from '../../link/Link';
import MenuItem from '../MenuItem';
import MenuLinkItem from '../MenuLinkItem';
import MenuSectionHeader from '../MenuSectionHeader';
import MenuSeparator from '../MenuSeparator';
import SelectMenuLinkItem from '../SelectMenuLinkItem';
import SubmenuItem from '../SubmenuItem';
import Menu from '../Menu';
import notes from './Menu.stories.md';
export var basic = function basic() {
  return /*#__PURE__*/React.createElement(Menu, null, /*#__PURE__*/React.createElement(MenuItem, null, "View Profile"), /*#__PURE__*/React.createElement(MenuItem, {
    showRadar: true
  }, "Help"), /*#__PURE__*/React.createElement(MenuSeparator, null), /*#__PURE__*/React.createElement(MenuSectionHeader, null, "Menu Section"), /*#__PURE__*/React.createElement(MenuLinkItem, null, /*#__PURE__*/React.createElement(Link, {
    href: "/#"
  }, "Awesome Link")));
};
export var withSubmenu = function withSubmenu() {
  return /*#__PURE__*/React.createElement("div", {
    style: {
      maxWidth: '220px'
    }
  }, /*#__PURE__*/React.createElement(Menu, null, /*#__PURE__*/React.createElement(MenuItem, null, "View Profile"), /*#__PURE__*/React.createElement(SubmenuItem, null, "Submenu", /*#__PURE__*/React.createElement(Menu, null, /*#__PURE__*/React.createElement(MenuItem, null, "View Profile"), /*#__PURE__*/React.createElement(MenuItem, null, "Help"))), /*#__PURE__*/React.createElement(MenuItem, null, "Help")));
};
export var withSubmenuFlip = function withSubmenuFlip() {
  return /*#__PURE__*/React.createElement("div", {
    style: {
      maxWidth: '220px'
    }
  }, /*#__PURE__*/React.createElement(Menu, null, /*#__PURE__*/React.createElement(MenuItem, null, "View Profile"), /*#__PURE__*/React.createElement(SubmenuItem, null, "Submenu", /*#__PURE__*/React.createElement(Menu, null, /*#__PURE__*/React.createElement(MenuItem, null, "View Profile"), /*#__PURE__*/React.createElement(MenuItem, null, "Help"), /*#__PURE__*/React.createElement(MenuItem, null, "Help"))), /*#__PURE__*/React.createElement(MenuItem, null, "Help")));
};
export var withSelectMenu = function withSelectMenu() {
  return /*#__PURE__*/React.createElement(Menu, null, /*#__PURE__*/React.createElement(SelectMenuLinkItem, {
    isSelected: boolean('isSelected', true)
  }, /*#__PURE__*/React.createElement(Link, {
    href: "http://opensource.box.com/box-ui-elements/storybook"
  }, "View Profile")), /*#__PURE__*/React.createElement(SelectMenuLinkItem, null, /*#__PURE__*/React.createElement(Link, {
    href: "http://opensource.box.com/box-ui-elements/storybook"
  }, "Awesome Link")));
};
export var withChildOnResize = function withChildOnResize() {
  var componentStore = new Store({
    isLargeMenu: false
  });

  var setVisibility = function setVisibility() {
    if (window.innerWidth < 700 && !componentStore.get('isLargeMenu')) {
      componentStore.set({
        isLargeMenu: true
      });
    }
  };

  window.addEventListener('resize', setVisibility);
  return /*#__PURE__*/React.createElement(State, {
    store: componentStore
  }, function (state) {
    return /*#__PURE__*/React.createElement(Menu, null, /*#__PURE__*/React.createElement(MenuItem, null, "View Profile"), /*#__PURE__*/React.createElement(MenuItem, null, "Help"), state.isLargeMenu && /*#__PURE__*/React.createElement(MenuItem, null, "Visible on Resize"), /*#__PURE__*/React.createElement(MenuItem, null, "Last Item"));
  });
};
export default {
  title: 'Components|Menu',
  component: Menu,
  parameters: {
    notes: notes
  }
};
//# sourceMappingURL=Menu.stories.js.map