@primer/components 31.0.1 → 31.0.2-rc.1e80de40

package/lib/__tests__/SelectMenu.test.js

@@ -0,0 +1,155 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ = require("..");
+
+var _testing = require("../utils/testing");
+
+var _react2 = require("@testing-library/react");
+
+var _jestAxe = require("jest-axe");
+
+require("babel-polyfill");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+expect.extend(_jestAxe.toHaveNoViolations);
+
+const BasicSelectMenu = ({
+  onClick,
+  as,
+  align = 'left'
+}) => {
+  return /*#__PURE__*/_react.default.createElement(_.SelectMenu, {
+    as: as
+  }, /*#__PURE__*/_react.default.createElement(_.Button, {
+    as: "summary"
+  }, "Projects"), /*#__PURE__*/_react.default.createElement(_.SelectMenu.Modal, {
+    title: "Projects",
+    align: align
+  }, /*#__PURE__*/_react.default.createElement(_.SelectMenu.List, null, /*#__PURE__*/_react.default.createElement(_.SelectMenu.Item, {
+    selected: true,
+    href: "#"
+  }, "Primer Components bugs"), /*#__PURE__*/_react.default.createElement(_.SelectMenu.Item, {
+    onClick: onClick,
+    as: as,
+    "data-test": "menu-item",
+    href: "#"
+  }, "Primer Components roadmap"), /*#__PURE__*/_react.default.createElement(_.SelectMenu.Divider, null, "stuff"), /*#__PURE__*/_react.default.createElement(_.SelectMenu.Item, {
+    href: "#"
+  }, " Project 3"), /*#__PURE__*/_react.default.createElement(_.SelectMenu.Item, {
+    href: "#"
+  }, "Project 4"), /*#__PURE__*/_react.default.createElement(_.SelectMenu.Footer, null, "footer"))));
+};
+
+BasicSelectMenu.displayName = "BasicSelectMenu";
+
+const MenuWithTabs = ({
+  onClick
+}) => {
+  return /*#__PURE__*/_react.default.createElement(_.SelectMenu, {
+    initialTab: "Organization"
+  }, /*#__PURE__*/_react.default.createElement(_.Button, {
+    as: "summary"
+  }, "Projects"), /*#__PURE__*/_react.default.createElement(_.SelectMenu.Modal, {
+    title: "Projects"
+  }, /*#__PURE__*/_react.default.createElement(_.SelectMenu.Tabs, null, /*#__PURE__*/_react.default.createElement(_.SelectMenu.Tab, {
+    index: 0,
+    onClick: onClick,
+    "data-test": "repo-tab",
+    tabName: "Repository"
+  }), /*#__PURE__*/_react.default.createElement(_.SelectMenu.Tab, {
+    index: 1,
+    tabName: "Organization"
+  })), /*#__PURE__*/_react.default.createElement(_.SelectMenu.TabPanel, {
+    tabName: "Repository"
+  }, /*#__PURE__*/_react.default.createElement(_.SelectMenu.Item, {
+    href: "#"
+  }, "Primer Components bugs"), /*#__PURE__*/_react.default.createElement(_.SelectMenu.Item, {
+    href: "#"
+  }, "Primer Components roadmap"), /*#__PURE__*/_react.default.createElement(_.SelectMenu.Item, {
+    href: "#"
+  }, " Project 3"), /*#__PURE__*/_react.default.createElement(_.SelectMenu.Item, {
+    href: "#"
+  }, "Project 4")), /*#__PURE__*/_react.default.createElement(_.SelectMenu.TabPanel, {
+    tabName: "Organization"
+  }, /*#__PURE__*/_react.default.createElement(_.SelectMenu.Item, {
+    href: "#"
+  }, " Project 2")), /*#__PURE__*/_react.default.createElement(_.SelectMenu.Footer, null, "Showing 3 of 3")));
+};
+
+MenuWithTabs.displayName = "MenuWithTabs";
+describe('SelectMenu', () => {
+  (0, _testing.checkExports)('SelectMenu', {
+    default: _.SelectMenu
+  });
+
+  for (const Comp of [_.SelectMenu.List, _.SelectMenu.Divider, _.SelectMenu.Filter, _.SelectMenu.Item, _.SelectMenu.List, _.SelectMenu.Modal, _.SelectMenu.Tabs, _.SelectMenu.Tab, _.SelectMenu.TabPanel, _.SelectMenu.Header]) {
+    it('sets a valid displayName', () => {
+      expect(Comp.displayName).toMatch(_testing.COMPONENT_DISPLAY_NAME_REGEX);
+    });
+  }
+
+  it('should have no axe violations', async () => {
+    const {
+      container
+    } = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(BasicSelectMenu, null));
+    const results = await (0, _jestAxe.axe)(container);
+    expect(results).toHaveNoViolations();
+    (0, _react2.cleanup)();
+  });
+  it('does not allow the "as" prop on SelectMenu', () => {
+    const component = (0, _testing.mount)( /*#__PURE__*/_react.default.createElement(BasicSelectMenu, {
+      as: "span"
+    }));
+    expect(component.find('details').length).toEqual(1);
+  });
+  it('shows correct initial tab', () => {
+    const testInstance = (0, _testing.renderRoot)( /*#__PURE__*/_react.default.createElement(MenuWithTabs, null));
+    expect(testInstance.findByProps({
+      'aria-selected': true
+    }).props.children).toBe('Organization');
+  });
+  it('clicking on a tab opens the tab', () => {
+    const component = (0, _testing.mount)( /*#__PURE__*/_react.default.createElement(MenuWithTabs, null));
+    const tab = component.find("[data-test='repo-tab']").first();
+    tab.simulate('click');
+    expect(tab.getDOMNode().attributes.getNamedItem('aria-selected')).toBeTruthy();
+  });
+  it('selected items have aria-checked', () => {
+    const testInstance = (0, _testing.renderRoot)( /*#__PURE__*/_react.default.createElement(BasicSelectMenu, null));
+    expect(testInstance.findByProps({
+      'aria-checked': true
+    }).props.children[1]).toBe('Primer Components bugs');
+  });
+  it('clicking on a list item calls user provided onClick handler', () => {
+    const mockClick = jest.fn();
+    const component = (0, _testing.mount)( /*#__PURE__*/_react.default.createElement(BasicSelectMenu, {
+      onClick: mockClick
+    }));
+    const item = component.find("[data-test='menu-item']").first();
+    item.simulate('click');
+    expect(mockClick.mock.calls.length).toEqual(1);
+  });
+  it('clicking on a tab calls user provided onClick handler', () => {
+    const mockClick = jest.fn();
+    const component = (0, _testing.mount)( /*#__PURE__*/_react.default.createElement(MenuWithTabs, {
+      onClick: mockClick
+    }));
+    const item = component.find("[data-test='repo-tab']").first();
+    item.simulate('click');
+    expect(mockClick.mock.calls.length).toEqual(1);
+  });
+  it('clicking on an item closes the modal', () => {
+    const component = (0, _testing.mount)( /*#__PURE__*/_react.default.createElement(BasicSelectMenu, null));
+    const item = component.find("[data-test='menu-item']").first();
+    item.simulate('click');
+    expect(component.getDOMNode().attributes.getNamedItem('open')).toBeFalsy();
+  });
+  it('right-aligned modal has right: 0px', () => {
+    expect((0, _testing.render)( /*#__PURE__*/_react.default.createElement(BasicSelectMenu, {
+      align: "right"
+    }))).toMatchSnapshot();
+  });
+});

package/lib/__tests__/SelectPanel.test.d.ts

@@ -0,0 +1 @@
+import 'babel-polyfill';

package/lib/__tests__/SelectPanel.test.js

@@ -0,0 +1,80 @@
+"use strict";
+
+var _react = require("@testing-library/react");
+
+require("babel-polyfill");
+
+var _jestAxe = require("jest-axe");
+
+var _react2 = _interopRequireDefault(require("react"));
+
+var _theme = _interopRequireDefault(require("../theme"));
+
+var _SelectPanel = require("../SelectPanel");
+
+var _testing = require("../utils/testing");
+
+var _ = require("..");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+expect.extend(_jestAxe.toHaveNoViolations);
+const items = [{
+  text: 'Foo'
+}, {
+  text: 'Bar'
+}, {
+  text: 'Baz'
+}, {
+  text: 'Bon'
+}];
+
+function SimpleSelectPanel() {
+  const [selected, setSelected] = _react2.default.useState([]);
+
+  const [, setFilter] = _react2.default.useState('');
+
+  const [open, setOpen] = _react2.default.useState(false);
+
+  return /*#__PURE__*/_react2.default.createElement(_.ThemeProvider, {
+    theme: _theme.default
+  }, /*#__PURE__*/_react2.default.createElement(_.SSRProvider, null, /*#__PURE__*/_react2.default.createElement(_.BaseStyles, null, /*#__PURE__*/_react2.default.createElement(_SelectPanel.SelectPanel, {
+    items: items,
+    placeholder: "Select Items",
+    placeholderText: "Filter Items",
+    selected: selected,
+    onSelectedChange: setSelected,
+    onFilterChange: setFilter,
+    open: open,
+    onOpenChange: setOpen
+  }), /*#__PURE__*/_react2.default.createElement("div", {
+    id: "portal-root"
+  }))));
+}
+
+SimpleSelectPanel.displayName = "SimpleSelectPanel";
+describe('SelectPanel', () => {
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+  (0, _testing.behavesAsComponent)({
+    Component: _SelectPanel.SelectPanel,
+    options: {
+      skipAs: true,
+      skipSx: true
+    },
+    toRender: () => /*#__PURE__*/_react2.default.createElement(SimpleSelectPanel, null)
+  });
+  (0, _testing.checkExports)('SelectPanel', {
+    default: undefined,
+    SelectPanel: _SelectPanel.SelectPanel
+  });
+  it('should have no axe violations', async () => {
+    const {
+      container
+    } = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(SimpleSelectPanel, null));
+    const results = await (0, _jestAxe.axe)(container);
+    expect(results).toHaveNoViolations();
+    (0, _react.cleanup)();
+  });
+});

package/lib/__tests__/SideNav.test.d.ts

@@ -0,0 +1 @@
+import 'babel-polyfill';

package/lib/__tests__/SideNav.test.js

@@ -0,0 +1,71 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ = require("..");
+
+var _testing = require("../utils/testing");
+
+var _react2 = require("@testing-library/react");
+
+var _jestAxe = require("jest-axe");
+
+require("babel-polyfill");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+expect.extend(_jestAxe.toHaveNoViolations);
+describe('SideNav', () => {
+  (0, _testing.behavesAsComponent)({
+    Component: _.SideNav
+  });
+  (0, _testing.checkExports)('SideNav', {
+    default: _.SideNav
+  });
+  describe('SideNav.Link', () => {
+    (0, _testing.behavesAsComponent)({
+      Component: _.SideNav.Link
+    });
+  });
+  it('should have no axe violations', async () => {
+    const {
+      container
+    } = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_.SideNav, null, /*#__PURE__*/_react.default.createElement(_.SideNav.Link, {
+      href: "#"
+    }, "One"), /*#__PURE__*/_react.default.createElement(_.SideNav.Link, {
+      href: "#",
+      selected: true
+    }, "Two")));
+    const results = await (0, _jestAxe.axe)(container);
+    expect(results).toHaveNoViolations();
+    (0, _react2.cleanup)();
+  });
+  it('renders a <nav> and <a>', () => {
+    expect((0, _testing.render)( /*#__PURE__*/_react.default.createElement(_.SideNav, null)).type).toEqual('nav');
+    expect((0, _testing.render)( /*#__PURE__*/_react.default.createElement(_.SideNav.Link, null)).type).toEqual('a');
+  });
+  it('sets aria-label appropriately', () => {
+    expect((0, _testing.render)( /*#__PURE__*/_react.default.createElement(_.SideNav, {
+      "aria-label": "foo"
+    })).props['aria-label']).toEqual('foo');
+  });
+  it('sets aria-current on a selected link', () => {
+    const elem = /*#__PURE__*/_react.default.createElement(_.SideNav, null, /*#__PURE__*/_react.default.createElement(_.SideNav.Link, {
+      href: "#one"
+    }, "One"), /*#__PURE__*/_react.default.createElement(_.SideNav.Link, {
+      href: "#two",
+      selected: true
+    }, "Two"));
+
+    const wrapper = (0, _testing.mount)(elem);
+    expect(wrapper.find('[aria-current="page"]').text()).toEqual('Two');
+  });
+  it('sets different styles for SideNavs with the lightweight variant', () => {
+    const regular = (0, _testing.render)( /*#__PURE__*/_react.default.createElement(_.SideNav, null));
+    const lightweight = (0, _testing.render)( /*#__PURE__*/_react.default.createElement(_.SideNav, {
+      variant: "lightweight"
+    }));
+    expect(regular.props.className).toEqual(expect.stringContaining('variant-normal'));
+    expect(lightweight.props.className).toEqual(expect.stringContaining('variant-lightweight'));
+  });
+});

package/lib/__tests__/Spinner.test.d.ts

@@ -0,0 +1 @@
+import 'babel-polyfill';

package/lib/__tests__/Spinner.test.js

@@ -0,0 +1,53 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ = require("..");
+
+var _testing = require("../utils/testing");
+
+var _react2 = require("@testing-library/react");
+
+var _jestAxe = require("jest-axe");
+
+require("babel-polyfill");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+expect.extend(_jestAxe.toHaveNoViolations);
+describe('Spinner', () => {
+  afterEach(() => {
+    (0, _react2.cleanup)();
+  });
+  (0, _testing.behavesAsComponent)({
+    Component: _.Spinner
+  });
+  (0, _testing.checkExports)('Spinner', {
+    default: _.Spinner
+  });
+  it('should have no axe violations', async () => {
+    const {
+      container
+    } = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_.Spinner, null));
+    const results = await (0, _jestAxe.axe)(container);
+    expect(results).toHaveNoViolations();
+  });
+  it('should respect size arguments', () => {
+    const expectSize = (input, expectedSize) => {
+      const {
+        container
+      } = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_.Spinner, {
+        size: input
+      }));
+      const svg = container.querySelector('svg');
+      expect(svg.getAttribute('height')).toEqual(expectedSize);
+      expect(svg.getAttribute('width')).toEqual(expectedSize);
+    }; // default: medium
+
+
+    expectSize(undefined, '32px');
+    expectSize('small', '16px');
+    expectSize('medium', '32px');
+    expectSize('large', '64px');
+  });
+});

package/lib/__tests__/StateLabel.test.d.ts

@@ -0,0 +1 @@
+import 'babel-polyfill';

package/lib/__tests__/StateLabel.test.js

@@ -0,0 +1,71 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ = require("..");
+
+var _testing = require("../utils/testing");
+
+var _react2 = require("@testing-library/react");
+
+var _jestAxe = require("jest-axe");
+
+require("babel-polyfill");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+expect.extend(_jestAxe.toHaveNoViolations);
+describe('StateLabel', () => {
+  (0, _testing.behavesAsComponent)({
+    Component: _.StateLabel,
+    toRender: () => /*#__PURE__*/_react.default.createElement(_.StateLabel, {
+      status: "issueOpened"
+    }, "Open"),
+    options: {
+      // Rendering a StyledOcticon seems to break getComputedStyles, which
+      // the sx prop implementation test uses to make sure the prop is working correctly.
+      // Despite my best efforts, I cannot figure out why this is happening. So,
+      // unfortunately, we will simply skip this test.
+      skipSx: true
+    }
+  });
+  (0, _testing.checkExports)('StateLabel', {
+    default: _.StateLabel
+  });
+  it('should have no axe violations', async () => {
+    const {
+      container
+    } = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_.StateLabel, {
+      status: "issueOpened"
+    }));
+    const results = await (0, _jestAxe.axe)(container);
+    expect(results).toHaveNoViolations();
+    (0, _react2.cleanup)();
+  });
+  it('respects the status prop', () => {
+    expect((0, _testing.render)( /*#__PURE__*/_react.default.createElement(_.StateLabel, {
+      status: "issueOpened"
+    }))).toMatchSnapshot();
+    expect((0, _testing.render)( /*#__PURE__*/_react.default.createElement(_.StateLabel, {
+      status: "issueClosed"
+    }))).toMatchSnapshot();
+    expect((0, _testing.render)( /*#__PURE__*/_react.default.createElement(_.StateLabel, {
+      status: "pullMerged"
+    }))).toMatchSnapshot();
+  });
+  it('respects the variant prop', () => {
+    expect((0, _testing.render)( /*#__PURE__*/_react.default.createElement(_.StateLabel, {
+      variant: "small",
+      status: "issueOpened"
+    }))).toMatchSnapshot();
+    expect((0, _testing.render)( /*#__PURE__*/_react.default.createElement(_.StateLabel, {
+      variant: "normal",
+      status: "issueOpened"
+    }))).toMatchSnapshot();
+  });
+  it('renders children', () => {
+    expect((0, _testing.render)( /*#__PURE__*/_react.default.createElement(_.StateLabel, {
+      status: "issueOpened"
+    }, "hi"))).toMatchSnapshot();
+  });
+});

package/lib/__tests__/StyledOcticon.test.d.ts

@@ -0,0 +1 @@
+import 'babel-polyfill';

package/lib/__tests__/StyledOcticon.test.js

@@ -0,0 +1,40 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _octiconsReact = require("@primer/octicons-react");
+
+var _ = require("..");
+
+var _testing = require("../utils/testing");
+
+var _react2 = require("@testing-library/react");
+
+var _jestAxe = require("jest-axe");
+
+require("babel-polyfill");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+expect.extend(_jestAxe.toHaveNoViolations);
+describe('StyledOcticon', () => {
+  (0, _testing.behavesAsComponent)({
+    Component: _.StyledOcticon,
+    toRender: () => /*#__PURE__*/_react.default.createElement(_.StyledOcticon, {
+      icon: _octiconsReact.XIcon
+    })
+  });
+  (0, _testing.checkExports)('StyledOcticon', {
+    default: _.StyledOcticon
+  });
+  it('should have no axe violations', async () => {
+    const {
+      container
+    } = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_.StyledOcticon, {
+      icon: _octiconsReact.XIcon
+    }));
+    const results = await (0, _jestAxe.axe)(container);
+    expect(results).toHaveNoViolations();
+    (0, _react2.cleanup)();
+  });
+});

package/lib/__tests__/SubNav.test.d.ts

@@ -0,0 +1 @@
+import 'babel-polyfill';

package/lib/__tests__/SubNav.test.js

@@ -0,0 +1,62 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ = require("..");
+
+var _testing = require("../utils/testing");
+
+var _react2 = require("@testing-library/react");
+
+var _jestAxe = require("jest-axe");
+
+require("babel-polyfill");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+expect.extend(_jestAxe.toHaveNoViolations);
+describe('SubNav', () => {
+  (0, _testing.behavesAsComponent)({
+    Component: _.SubNav
+  });
+  (0, _testing.checkExports)('SubNav', {
+    default: _.SubNav
+  });
+  it('should have no axe violations', async () => {
+    const {
+      container
+    } = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_.SubNav, null));
+    const results = await (0, _jestAxe.axe)(container);
+    expect(results).toHaveNoViolations();
+    (0, _react2.cleanup)();
+  });
+  it('renders a <nav>', () => {
+    expect((0, _testing.render)( /*#__PURE__*/_react.default.createElement(_.SubNav, null)).type).toEqual('nav');
+  });
+  it('adds the SubNav class', () => {
+    expect((0, _testing.rendersClass)( /*#__PURE__*/_react.default.createElement(_.SubNav, null), 'SubNav')).toEqual(true);
+  });
+  it('sets aria-label to the "label" prop', () => {
+    expect((0, _testing.render)( /*#__PURE__*/_react.default.createElement(_.SubNav, {
+      label: "foo"
+    })).props['aria-label']).toEqual('foo');
+  });
+  it('wraps its children in an "SubNav-body" div', () => {
+    const children = /*#__PURE__*/_react.default.createElement("b", null, "yo");
+
+    const wrapper = (0, _testing.mount)( /*#__PURE__*/_react.default.createElement(_.SubNav, null, children));
+    const body = wrapper.find('.SubNav-body');
+    expect(body.exists()).toEqual(true);
+    expect(body.childAt(0).type()).toEqual('b');
+  });
+  it('respects the "actions" prop', () => {
+    const content = /*#__PURE__*/_react.default.createElement("h1", null, "hi!");
+
+    const wrapper = (0, _testing.mount)( /*#__PURE__*/_react.default.createElement(_.SubNav, {
+      actions: content
+    }));
+    const actions = wrapper.find('.SubNav-actions');
+    expect(actions.exists()).toEqual(true);
+    expect(actions.text()).toEqual('hi!');
+  });
+});

package/lib/__tests__/SubNavLink.test.d.ts

@@ -0,0 +1 @@
+import 'babel-polyfill';

package/lib/__tests__/SubNavLink.test.js

@@ -0,0 +1,49 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ = require("..");
+
+var _testing = require("../utils/testing");
+
+var _react2 = require("@testing-library/react");
+
+var _jestAxe = require("jest-axe");
+
+require("babel-polyfill");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+expect.extend(_jestAxe.toHaveNoViolations);
+describe('SubNav.Link', () => {
+  (0, _testing.behavesAsComponent)({
+    Component: _.SubNav.Link
+  });
+  it('renders an <a> by default', () => {
+    expect((0, _testing.render)( /*#__PURE__*/_react.default.createElement(_.SubNav.Link, null)).type).toEqual('a');
+  });
+  it('should have no axe violations', async () => {
+    const {
+      container
+    } = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_.SubNav.Link, null));
+    const results = await (0, _jestAxe.axe)(container);
+    expect(results).toHaveNoViolations();
+    (0, _react2.cleanup)();
+  });
+  it('respects the "selected" prop', () => {
+    expect((0, _testing.render)( /*#__PURE__*/_react.default.createElement(_.SubNav.Link, {
+      selected: true
+    }))).toMatchSnapshot();
+  });
+  it('adds activeClassName={SELECTED_CLASS} when it gets a "to" prop', () => {
+    const Link = ({
+      theme: _ignoredTheme,
+      ...props
+    }) => /*#__PURE__*/_react.default.createElement("div", props);
+
+    expect((0, _testing.render)( /*#__PURE__*/_react.default.createElement(_.SubNav.Link, {
+      as: Link,
+      to: "#"
+    }))).toMatchSnapshot();
+  });
+});

package/lib/__tests__/TabNav.test.d.ts

@@ -0,0 +1 @@
+import 'babel-polyfill';

package/lib/__tests__/TabNav.test.js

@@ -0,0 +1,49 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ = require("..");
+
+var _testing = require("../utils/testing");
+
+var _react2 = require("@testing-library/react");
+
+var _jestAxe = require("jest-axe");
+
+require("babel-polyfill");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+expect.extend(_jestAxe.toHaveNoViolations);
+describe('TabNav', () => {
+  (0, _testing.behavesAsComponent)({
+    Component: _.TabNav
+  });
+  (0, _testing.checkExports)('TabNav', {
+    default: _.TabNav
+  });
+  describe('TabNav.Link', () => {
+    (0, _testing.behavesAsComponent)({
+      Component: _.TabNav.Link
+    });
+  });
+  it('should have no axe violations', async () => {
+    const {
+      container
+    } = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_.TabNav, {
+      "aria-label": "main"
+    }));
+    const results = await (0, _jestAxe.axe)(container);
+    expect(results).toHaveNoViolations();
+    (0, _react2.cleanup)();
+  });
+  it('sets aria-label appropriately', () => {
+    const {
+      getByLabelText
+    } = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_.TabNav, {
+      "aria-label": "stuff"
+    }));
+    expect(getByLabelText('stuff')).toBeTruthy();
+    expect(getByLabelText('stuff').tagName).toEqual('NAV');
+  });
+});

package/lib/__tests__/Text.test.d.ts

@@ -0,0 +1 @@
+import 'babel-polyfill';