var _excluded = ["data"];

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

import React from 'react';
import SkipNav from './SkipNav';
export default {
  title: 'Components/Skip Nav',
  component: SkipNav,
  args: {
    href: '#main'
  },
  parameters: {
    loki: {
      skip: true
    }
  }
};

var Template = function Template(_ref) {
  var data = _ref.data,
      args = _objectWithoutProperties(_ref, _excluded);

  return /*#__PURE__*/React.createElement(SkipNav, args);
};

export var DefaultSkipNav = Template.bind({});
export var SkipNavExample = Template.bind({});
SkipNavExample.decorators = [function (Story) {
  return /*#__PURE__*/React.createElement("div", null, Story(), /*#__PURE__*/React.createElement("nav", {
    className: "ds-u-padding--3"
  }, /*#__PURE__*/React.createElement("h1", {
    className: "ds-u-margin--0"
  }, "Navigation"), /*#__PURE__*/React.createElement("p", {
    className: "ds-u-margin--0"
  }, "Clicking on the Skip Nav will skip over this section."), /*#__PURE__*/React.createElement("ul", null, /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("a", {
    href: "#"
  }, "Navigation link 1")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("a", {
    href: "#"
  }, "Navigation link 2")))), /*#__PURE__*/React.createElement("main", {
    id: "main",
    className: "ds-u-padding--3 ds-u-fill--gray-lightest",
    tabIndex: "-1"
  }, /*#__PURE__*/React.createElement("h1", {
    className: "ds-u-margin--0"
  }, "Main content"), /*#__PURE__*/React.createElement("p", {
    className: "ds-u-margin--0"
  }, "Clicking on the Skip Nav will focus this element.")));
}];