optimizely-oui/dist/js/components/Navigation/navigation.story.js

Optimizely's Component Library.

"use strict";

var _react = _interopRequireDefault(require("react"));

var _react2 = require("@storybook/react");

var _addonKnobs = require("@storybook/addon-knobs");

var _navigation = require("./navigation");

var _brandLogo = _interopRequireDefault(require("@optimizely/design-tokens/dist/brand-assets/brand-logo.svg"));

var _brandLogoWhite = _interopRequireDefault(require("@optimizely/design-tokens/dist/brand-assets/brand-logo-white.svg"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

var themeOptions = {
  light: "light",
  dark: "dark"
};
var stories = (0, _react2.storiesOf)("Navigation|Navigation", module);
stories.addDecorator(_addonKnobs.withKnobs).addDecorator(function (story) {
  return _react["default"].createElement("div", {
    id: "root-preview"
  }, story());
});
stories.add("Navigation states", function () {
  var theme = (0, _addonKnobs.select)("theme", themeOptions, "dark");
  var logoUrl = theme === "dark" ? _brandLogoWhite["default"] : _brandLogo["default"];
  return _react["default"].createElement(_navigation.Navigation, {
    logoUrl: logoUrl,
    helpUrl: "/",
    theme: theme,
    title: (0, _addonKnobs.text)("title", "Optimizely")
  });
});