@pingux/astro 2.33.0-alpha.10 → 2.33.0-alpha.12

package/lib/components/TableCaption/TableCaption.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
 var _excluded = ["children"];
-import React from 'react';
+import React, { forwardRef } from 'react';
 import Box from '../Box';
 
 /**
@@ -13,12 +13,13 @@ import Box from '../Box';
  *
  */
 import { jsx as ___EmotionJSX } from "@emotion/react";
-var TableCaption = function TableCaption(props) {
+var TableCaption = /*#__PURE__*/forwardRef(function (props, ref) {
   var children = props.children,
     others = _objectWithoutProperties(props, _excluded);
   return ___EmotionJSX(Box, _extends({
+    ref: ref,
     variant: "table.caption",
     as: "caption"
   }, others), children);
-};
+});
 export default TableCaption;

package/lib/components/TableCaption/TableCaption.test.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import { Table, TableCaption } from '../../index';
+import { universalComponentTests } from '../../utils/testUtils/universalComponentTest';
+
+// Needs to be added to each components test file
+import { jsx as ___EmotionJSX } from "@emotion/react";
+universalComponentTests({
+  renderComponent: function renderComponent(props) {
+    return ___EmotionJSX(Table, null, ___EmotionJSX(TableCaption, props));
+  }
+});

package/lib/components/TableCell/TableCell.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
 var _excluded = ["children", "isHeading"];
-import React from 'react';
+import React, { forwardRef } from 'react';
 import Box from '../Box';
 
 /**
@@ -13,13 +13,14 @@ import Box from '../Box';
  *
  */
 import { jsx as ___EmotionJSX } from "@emotion/react";
-var TableCell = function TableCell(props) {
+var TableCell = /*#__PURE__*/forwardRef(function (props, ref) {
   var children = props.children,
     isHeading = props.isHeading,
     others = _objectWithoutProperties(props, _excluded);
   return ___EmotionJSX(Box, _extends({
+    ref: ref,
     variant: isHeading ? 'table.head' : 'table.data',
     as: isHeading ? 'th' : 'td'
   }, others), children);
-};
+});
 export default TableCell;

package/lib/components/TableCell/TableCell.test.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import React from 'react';
 import { render, screen } from '@testing-library/react';
-import axeTest from '../../utils/testUtils/testAxe';
+import { universalComponentTests } from '../../utils/testUtils/universalComponentTest';
 import Table from '../Table';
 import TableBody from '../TableBody';
 import TableRow from '../TableRow';
@@ -16,8 +16,12 @@ var getComponent = function getComponent() {
   return render(___EmotionJSX(Table, null, ___EmotionJSX(TableBody, null, ___EmotionJSX(TableRow, null, ___EmotionJSX(TableCell, _extends({}, props, defaultProps), "Here is text.")))));
 };
 
-// Need to be added to each test file to test accessibility using axe.
-axeTest(getComponent);
+// Needs to be added to each components test file
+universalComponentTests({
+  renderComponent: function renderComponent(props) {
+    return ___EmotionJSX(Table, null, ___EmotionJSX(TableBody, null, ___EmotionJSX(TableRow, null, ___EmotionJSX(TableCell, props, "Here is text."))));
+  }
+});
 test('isHeading = true', function () {
   var props = {
     isHeading: true

package/lib/components/TableHead/TableHead.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
 var _excluded = ["children"];
-import React from 'react';
+import React, { forwardRef } from 'react';
 import Box from '../Box';
 
 /**
@@ -13,11 +13,12 @@ import Box from '../Box';
  *
  */
 import { jsx as ___EmotionJSX } from "@emotion/react";
-var TableHead = function TableHead(props) {
+var TableHead = /*#__PURE__*/forwardRef(function (props, ref) {
   var children = props.children,
     others = _objectWithoutProperties(props, _excluded);
   return ___EmotionJSX(Box, _extends({
+    ref: ref,
     as: "thead"
   }, others), children);
-};
+});
 export default TableHead;

package/lib/components/TableHead/TableHead.test.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import { Table, TableHead } from '../../index';
+import { universalComponentTests } from '../../utils/testUtils/universalComponentTest';
+
+// Needs to be added to each components test file
+import { jsx as ___EmotionJSX } from "@emotion/react";
+universalComponentTests({
+  renderComponent: function renderComponent(props) {
+    return ___EmotionJSX(Table, null, ___EmotionJSX(TableHead, props));
+  }
+});

package/lib/components/TableRow/TableRow.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
 var _excluded = ["children"];
-import React from 'react';
+import React, { forwardRef } from 'react';
 import Box from '../Box';
 
 /**
@@ -13,12 +13,13 @@ import Box from '../Box';
  *
  */
 import { jsx as ___EmotionJSX } from "@emotion/react";
-var TableRow = function TableRow(props) {
+var TableRow = /*#__PURE__*/forwardRef(function (props, ref) {
   var children = props.children,
     others = _objectWithoutProperties(props, _excluded);
   return ___EmotionJSX(Box, _extends({
+    ref: ref,
     variant: "table.row",
     as: "tr"
   }, others), children);
-};
+});
 export default TableRow;

package/lib/components/TableRow/TableRow.test.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import { Table, TableBody, TableRow } from '../../index';
+import { universalComponentTests } from '../../utils/testUtils/universalComponentTest';
+
+// Needs to be added to each components test file
+import { jsx as ___EmotionJSX } from "@emotion/react";
+universalComponentTests({
+  renderComponent: function renderComponent(props) {
+    return ___EmotionJSX(Table, null, ___EmotionJSX(TableBody, null, ___EmotionJSX(TableRow, props)));
+  }
+});

package/lib/components/Tabs/Tabs.test.js

@@ -21,8 +21,8 @@ import React from 'react';
 import createCache from '@emotion/cache';
 import { CacheProvider } from '@emotion/react';
 import userEvent from '@testing-library/user-event';
-import axeTest from '../../utils/testUtils/testAxe';
 import { fireEvent, render, screen } from '../../utils/testUtils/testWrapper';
+import { universalComponentTests } from '../../utils/testUtils/universalComponentTest';
 import Tab from '../Tab';
 import Tabs from './Tabs';
 
@@ -133,8 +133,15 @@ afterEach(function () {
   jest.restoreAllMocks();
 });
 
-// Need to be added to each test file to test accessibility using axe.
-axeTest(getComponent);
+// Needs to be added to each components test file
+universalComponentTests({
+  renderComponent: function renderComponent(props) {
+    return ___EmotionJSX(Tabs, props, ___EmotionJSX(Tab, {
+      key: "key",
+      title: "title"
+    }, "Content"));
+  }
+});
 test('default tabs', function () {
   getComponent();
   var tabList = screen.getByRole('tablist');

package/lib/components/Text/Text.test.js

@@ -12,9 +12,9 @@ function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React from 'react';
 import { ThemeProvider } from 'theme-ui';
-import axeTest from '../../utils/testUtils/testAxe';
 import testTheme from '../../utils/testUtils/testTheme';
 import { render, screen } from '../../utils/testUtils/testWrapper';
+import { universalComponentTests } from '../../utils/testUtils/universalComponentTest';
 import Text from '.';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var testId = 'test-text';
@@ -29,8 +29,12 @@ var getComponent = function getComponent() {
   }, ___EmotionJSX(Text, _extends({}, defaultProps, props), children)));
 };
 
-// Need to be added to each test file to test accessibility using axe.
-axeTest(getComponent);
+// Needs to be added to each components test file
+universalComponentTests({
+  renderComponent: function renderComponent(props) {
+    return ___EmotionJSX(Text, props, "text");
+  }
+});
 test('default text', function () {
   getComponent();
   var text = screen.getByTestId(testId);

package/lib/components/TextArea/TextArea.test.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import React from 'react';
 import { render, screen } from '@testing-library/react';
-import axeTest from '../../utils/testUtils/testAxe';
+import { universalComponentTests } from '../../utils/testUtils/universalComponentTest';
 import TextArea from '.';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var testId = 'textAreaField';
@@ -13,8 +13,13 @@ var getComponent = function getComponent() {
   return render(___EmotionJSX(TextArea, _extends({}, defaultProps, props)));
 };
 
-// Need to be added to each test file to test accessibility using axe.
-axeTest(getComponent, {
+// Needs to be added to each components test file
+universalComponentTests({
+  renderComponent: function renderComponent(props) {
+    return ___EmotionJSX(TextArea, _extends({
+      label: "label"
+    }, props));
+  },
   // TextArea with label provided by TextAreaField
   rules: {
     'label': {

package/lib/components/TextAreaField/TextAreaField.test.js

@@ -6,8 +6,8 @@ import React from 'react';
 import { fireEvent } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import statuses from '../../utils/devUtils/constants/statuses';
-import axeTest from '../../utils/testUtils/testAxe';
 import { render, screen } from '../../utils/testUtils/testWrapper';
+import { universalComponentTests } from '../../utils/testUtils/universalComponentTest';
 import TextAreaField from '.';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var testId = 'test-textAreaField';
@@ -21,8 +21,12 @@ var getComponent = function getComponent() {
 };
 var mockfunction = jest.fn();
 
-// Need to be added to each test file to test accessibility using axe.
-axeTest(getComponent);
+// Needs to be added to each components test file
+universalComponentTests({
+  renderComponent: function renderComponent(props) {
+    return ___EmotionJSX(TextAreaField, _extends({}, defaultProps, props));
+  }
+});
 test('disabled prop disables input', function () {
   getComponent({
     isDisabled: true

package/lib/components/TextField/TextField.test.js

@@ -6,7 +6,7 @@ import React from 'react';
 import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import statuses from '../../utils/devUtils/constants/statuses';
-import axeTest from '../../utils/testUtils/testAxe';
+import { universalComponentTests } from '../../utils/testUtils/universalComponentTest';
 import TextField from '.';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var testId = 'test-text-field';
@@ -20,8 +20,12 @@ var getComponent = function getComponent() {
   return render(___EmotionJSX(TextField, _extends({}, defaultProps, props)));
 };
 
-// Need to be added to each test file to test accessibility using axe.
-axeTest(getComponent);
+// Needs to be added to each components test file
+universalComponentTests({
+  renderComponent: function renderComponent(props) {
+    return ___EmotionJSX(TextField, _extends({}, defaultProps, props));
+  }
+});
 test('default text field', function () {
   getComponent();
   var field = screen.getByTestId(testId);

package/lib/components/TimeZonePicker/TimeZonePicker.test.js

@@ -3,6 +3,7 @@ import React from 'react';
 import userEvent from '@testing-library/user-event';
 import { OverlayProvider, TimeZonePicker } from '../../index';
 import { render, screen } from '../../utils/testUtils/testWrapper';
+import { universalComponentTests } from '../../utils/testUtils/universalComponentTest';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var testTimeZoneJuba = 'Africa/Juba';
 var testTimeZoneApia = 'Pacific/Apia';
@@ -73,4 +74,11 @@ test('shows custom empty search state text when no items are found', function ()
   var input = screen.queryByRole('combobox');
   userEvent.type(input, 'awdasrf213');
   expect(screen.getByText(testEmptyText)).toBeInTheDocument();
+});
+
+// Needs to be added to each components test file
+universalComponentTests({
+  renderComponent: function renderComponent(props) {
+    return ___EmotionJSX(TimeZonePicker, _extends({}, defaultProps, props));
+  }
 });

package/lib/components/TooltipTrigger/TooltipTrigger.test.js

@@ -14,16 +14,20 @@ import React from 'react';
 import userEvent from '@testing-library/user-event';
 import { Button, Tooltip, TooltipTrigger } from '../../index';
 import theme from '../../styles/theme';
-import axeTest from '../../utils/testUtils/testAxe';
 import { fireEvent, render, screen, waitFor } from '../../utils/testUtils/testWrapper';
+import { universalComponentTests } from '../../utils/testUtils/universalComponentTest';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var getComponent = function getComponent() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   return render(___EmotionJSX(TooltipTrigger, props, ___EmotionJSX(Button, props.buttonProps, "Mock Button"), ___EmotionJSX(Tooltip, null, "Tooltip Content")));
 };
 
-// Need to be added to each test file to test accessibility using axe.
-axeTest(getComponent);
+// Needs to be added to each components test file
+universalComponentTests({
+  renderComponent: function renderComponent(props) {
+    return ___EmotionJSX(TooltipTrigger, props, ___EmotionJSX(Button, null, "Mock Button"), ___EmotionJSX(Tooltip, null, "Tooltip Content"));
+  }
+});
 test('tooltip doesnt show by default and is rendered when trigger is hovered', function () {
   getComponent();
   var button = screen.getByRole('button');

package/lib/utils/testUtils/universalComponentTest.js

@@ -33,20 +33,22 @@ var ComponentWithRef = function ComponentWithRef(_ref) {
 };
 export var universalComponentTests = /*#__PURE__*/function () {
   var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(_ref2) {
-    var renderComponent, props, _ref2$rules, rules;
+    var renderComponent, _ref2$rules, rules;
     return _regeneratorRuntime().wrap(function _callee2$(_context2) {
       while (1) switch (_context2.prev = _context2.next) {
         case 0:
-          renderComponent = _ref2.renderComponent, props = _ref2.props, _ref2$rules = _ref2.rules, rules = _ref2$rules === void 0 ? {} : _ref2$rules;
+          renderComponent = _ref2.renderComponent, _ref2$rules = _ref2.rules, rules = _ref2$rules === void 0 ? {} : _ref2$rules;
           test('should have no accessibility violations', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
             var _render, container, results;
             return _regeneratorRuntime().wrap(function _callee$(_context) {
               while (1) switch (_context.prev = _context.next) {
                 case 0:
                   jest.useRealTimers();
-                  _render = render(renderComponent(props)), container = _render.container;
+                  _render = render(renderComponent()), container = _render.container;
                   _context.next = 4;
-                  return axe(container, rules);
+                  return axe(container, {
+                    rules: rules
+                  });
                 case 4:
                   results = _context.sent;
                   expect(results).toHaveNoViolations();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pingux/astro",
-  "version": "2.33.0-alpha.10",
+  "version": "2.33.0-alpha.12",
   "description": "React component library for Ping Identity's design system",
   "repository": {
     "type": "git",