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

package/lib/hooks/useProgressiveState/useProgressiveState.test.js

@@ -1,26 +1,16 @@
-import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
-var _excluded = ["count"];
 import React from 'react';
 import { render, screen } from '@testing-library/react';
 import { renderHook } from '@testing-library/react-hooks';
 import userEvent from '@testing-library/user-event';
 import useProgressiveState from './useProgressiveState';
 import { jsx as ___EmotionJSX } from "@emotion/react";
-var testId = 'test';
-var defaultProps = {
-  'data-testid': testId
-};
 var hookProps = {
   prop: 'count',
   initial: 0
 };
-
-/* eslint-disable react/prop-types */
 var TestComponent = function TestComponent(_ref) {
-  var count = _ref.count,
-    others = _objectWithoutProperties(_ref, _excluded);
+  var count = _ref.count;
   var _useProgressiveState = useProgressiveState(count, 0),
     _useProgressiveState2 = _slicedToArray(_useProgressiveState, 2),
     countVal = _useProgressiveState2[0],
@@ -28,18 +18,19 @@ var TestComponent = function TestComponent(_ref) {
   var handleClick = function handleClick() {
     return setCountVal(countVal + 1);
   };
-  return ___EmotionJSX("button", _extends({}, others, {
+  return ___EmotionJSX("button", {
+    type: "button",
     onClick: handleClick
-  }), countVal);
+  }, countVal);
 };
 var getComponent = function getComponent() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  return render(___EmotionJSX(TestComponent, _extends({}, props, defaultProps)));
+  return render(___EmotionJSX(TestComponent, props));
 };
 describe('State Utils', function () {
   it('should update the state when no prop is provided', function () {
     getComponent();
-    var component = screen.getByTestId(testId);
+    var component = screen.getByRole('button');
     expect(component).toHaveTextContent('0');
     userEvent.click(component);
     expect(component).toHaveTextContent('1');
@@ -50,7 +41,7 @@ describe('State Utils', function () {
     getComponent({
       count: 5
     });
-    var component = screen.getByTestId(testId);
+    var component = screen.getByRole('button');
     expect(component).toHaveTextContent('5');
     userEvent.click(component);
     expect(component).toHaveTextContent('5');

package/lib/hooks/usePropWarning/usePropWarning.js

@@ -2,14 +2,6 @@ import _Set from "@babel/runtime-corejs3/core-js-stable/set";
 import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
 import { useEffect } from 'react';
 var alreadyShown = new _Set();
-
-/**
- * Provides a development-only console warning for props that we don't want consumers to use
- * @param {Object} props - The whole props object
- * @param {String} propToWarn - Specify prop to warn not to use
- * @param {String} propToUse - Specify prop that should be used instead
- * @param {Boolean} [allowDuplicates] - If allow duplicate warning messages
- */
 var usePropWarning = function usePropWarning(props, propToWarn, propToUse, allowDuplicates) {
   useEffect(function () {
     if (!allowDuplicates && alreadyShown.has(propToWarn)) {

package/lib/hooks/usePropWarning/usePropWarning.test.js

@@ -4,7 +4,7 @@ describe('usePropWarning', function () {
   beforeEach(function () {
     process.env.NODE_ENV = 'development';
     global.console.warn = function () {
-      return jest.mock();
+      return jest.fn();
     }; // eslint-disable-line no-console
   });
 
@@ -13,8 +13,9 @@ describe('usePropWarning', function () {
     jest.clearAllMocks();
   });
   test('default', function () {
-    var props = {};
-    props.disabled = true;
+    var props = {
+      disabled: true
+    };
     var spy = jest.spyOn(console, 'warn');
     expect(spy).not.toHaveBeenCalled();
     renderHook(function () {
@@ -23,8 +24,9 @@ describe('usePropWarning', function () {
     expect(spy).toHaveBeenCalledTimes(1);
   });
   test('does not warn if prop does not exist', function () {
-    var props = {};
-    props.isDisabled = true;
+    var props = {
+      isDisabled: true
+    };
     var spy = jest.spyOn(console, 'warn');
     expect(spy).not.toHaveBeenCalled();
     renderHook(function () {
@@ -33,8 +35,9 @@ describe('usePropWarning', function () {
     expect(spy).not.toHaveBeenCalled();
   });
   test('showns duplicated messages if explicitly allowed', function () {
-    var props = {};
-    props.disabled = true;
+    var props = {
+      disabled: true
+    };
     var spy = jest.spyOn(console, 'warn');
     renderHook(function () {
       return usePropWarning(props, 'disabled', 'isDisabled', true);
@@ -46,8 +49,9 @@ describe('usePropWarning', function () {
   });
   test('does not warn if it is in production environment', function () {
     process.env.NODE_ENV = 'production';
-    var props = {};
-    props.disabled = true;
+    var props = {
+      disabled: true
+    };
     var spy = jest.spyOn(console, 'warn');
     expect(spy).not.toHaveBeenCalled();
     renderHook(function () {

package/lib/hooks/useSelectField/useSelectField.js

@@ -16,8 +16,10 @@ import React, { useCallback, useImperativeHandle, useLayoutEffect, useRef, useSt
 import { DismissButton, FocusScope, useOverlayPosition, useSelect } from 'react-aria';
 import { useSelectState } from 'react-stately';
 import { useResizeObserver } from '@react-aria/utils';
+// eslint-disable-next-line import/no-unresolved
+
 import { modes } from '../../components/Label/constants';
-import ListBox from '../../components/ListBox';
+import ListBox from '../../components/ListBox/ListBox';
 import PopoverContainer from '../../components/PopoverContainer';
 import ScrollBox from '../../components/ScrollBox';
 import { useColumnStyles, useDeprecationWarning, useField } from '..';
@@ -53,8 +55,7 @@ var useSelectField = function useSelectField(props, ref) {
   // We use falsy booleans as defaults, but React Aria has this as true by default so we need to
   // negate this.
   var shouldFlip = !isNotFlippable;
-  var selectProps = _objectSpread({
-    children: children,
+  var selectProps = _objectSpread(_objectSpread({
     defaultSelectedKey: defaultSelectedKey,
     defaultText: defaultText,
     disabledKeys: disabledKeys,
@@ -76,13 +77,14 @@ var useSelectField = function useSelectField(props, ref) {
     disallowEmptySelection: disallowEmptySelection,
     // must match React Aria API
     shouldFlip: shouldFlip
-  }, controlProps);
+  }, controlProps), {}, {
+    children: children
+  });
   // Create state based on the incoming props
   var state = useSelectState(selectProps);
   var popoverRef = useRef();
-  var triggerRef = useRef();
   var listBoxRef = useRef();
-
+  var triggerRef = useRef();
   /* istanbul ignore next */
   useImperativeHandle(ref, function () {
     return triggerRef.current;
@@ -109,7 +111,7 @@ var useSelectField = function useSelectField(props, ref) {
       placeholder: props.labelMode === modes.FLOAT ? '' : placeholder,
       labelProps: _objectSpread(_objectSpread({}, props.labelProps), labelProps),
       containerProps: _objectSpread({
-        isFloatLabelActive: state.selectedItem
+        isFloatLabelActive: !!state.selectedItem
       }, props.containerProps)
     })),
     fieldContainerProps = _useField.fieldContainerProps,
@@ -141,7 +143,7 @@ var useSelectField = function useSelectField(props, ref) {
   }, [state.isOpen, updatePosition]);
 
   // Measure the width of the input to inform the width of the listbox (below).
-  var _useState = useState(null),
+  var _useState = useState(0),
     _useState2 = _slicedToArray(_useState, 2),
     buttonWidth = _useState2[0],
     setButtonWidth = _useState2[1];
@@ -150,7 +152,7 @@ var useSelectField = function useSelectField(props, ref) {
     if (triggerRef.current) {
       setButtonWidth(triggerRef.current.offsetWidth);
     }
-  }, [triggerRef, setButtonWidth, state.isOpen]);
+  }, [triggerRef, setButtonWidth]);
   useResizeObserver({
     ref: triggerRef,
     onResize: onResize

package/lib/utils/designUtils/figmaLinks.js

@@ -29,8 +29,10 @@ export var FIGMA_LINKS = {
     "default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=0-1&t=8Wwd3tIBh3GEjCJB-0'
   },
   buttonBar: {
-    "default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=3660%3A20551&mode=dev',
-    rightAligned: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=3660%3A20657&mode=dev'
+    "default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A753&mode=dev',
+    rightAligned: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A770&mode=dev',
+    secondary: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A778&mode=dev',
+    secondaryRightAligned: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A788&mode=dev'
   },
   calendar: {
     "default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=6373%3A25490&t=BoHXzVpQq9Lf7MaU-1'

package/package.json

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