@availity/feedback 6.2.5 → 6.2.9

package/CHANGELOG.md

@@ -3,6 +3,49 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 6.2.9 (2021-12-09)
+
+
+### Bug Fixes
+
+* **feedback:** added submit on enter func and tests ([d642923](https://github.com/Availity/availity-react/commit/d642923eb0ca80ee5faff17e0f830c3e1e2181c7))
+
+
+
+
+
+## [6.2.8](https://github.com/Availity/availity-react/compare/@availity/feedback@6.2.7...@availity/feedback@6.2.8) (2021-12-03)
+
+**Note:** Version bump only for package @availity/feedback
+
+
+
+
+
+## 6.2.7 (2021-12-03)
+
+
+### Bug Fixes
+
+* **feedback:** modal no longer closes when tabbed ([7ce4f53](https://github.com/Availity/availity-react/commit/7ce4f53f7e86ba2aeee79db606338bca251c89ff))
+
+
+
+
+
+## [6.2.6](https://github.com/Availity/availity-react/compare/@availity/feedback@6.2.5...@availity/feedback@6.2.6) (2021-12-02)
+
+
+### Bug Fixes
+
+* **feedback:** added destructering for event ([a8110d7](https://github.com/Availity/availity-react/commit/a8110d7c2d118d4e14fb142f6002790b635593c9))
+* **feedback:** fix typo ([9adfd42](https://github.com/Availity/availity-react/commit/9adfd42264eb64d57c976b6118e794a9be36a605))
+* **feedback:** fixed shift tab closing dropdown issue ([06aad38](https://github.com/Availity/availity-react/commit/06aad384f87e8e3a75fc469f30a0795cfee242ce))
+
+
+
+
+
 ## [6.2.5](https://github.com/Availity/availity-react/compare/@availity/feedback@6.2.4...@availity/feedback@6.2.5) (2021-12-01)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@availity/feedback",
-  "version": "6.2.5",
+  "version": "6.2.9",
   "author": "Evan Sharp <evan.sharp@availity.com>",
   "description": "Availity feedback with smiley faces react component.",
   "main": "index.js",
@@ -25,7 +25,7 @@
     "@availity/hooks": "^3.1.0",
     "@availity/icon": "^0.10.0",
     "@availity/native-form": "^4.0.5",
-    "@availity/select": "^2.2.1",
+    "@availity/select": "^2.3.0",
     "prop-types": "^15.7.2"
   },
   "devDependencies": {
@@ -47,5 +47,5 @@
     "reactstrap": "^8.0.0 || ^7.0.0 || ^6.0.0",
     "yup": "^0.27.0"
   },
-  "gitHead": "7b5ca991164f070868efc05e4cef007b16e0c7ca"
+  "gitHead": "0d093c128cce5680f568ab9d88e684edd6675355"
 }

package/src/FeedbackDropdown.js

@@ -42,6 +42,7 @@ const FeedbackDropdown = ({
       onClose={toggle}
       showSupport={showSupport}
       setSupportIsActive={setSupportIsActive}
+      modal={modal}
       {...formProps}
     />
   );

package/src/FeedbackForm.js

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, useRef } from 'react';
 import PropTypes from 'prop-types';
 import { Button, ModalBody, ModalHeader, ModalFooter, FormGroup } from 'reactstrap';
 import { avLogMessagesApi, avRegionsApi } from '@availity/api-axios';
@@ -40,11 +40,12 @@ const FeedbackForm = ({
   showSupport,
   setSupportIsActive,
   autoFocusFeedbackButton,
+  modal,
   ...formProps
 }) => {
   const [active, setActive] = useState(null);
   const [sent, setSent] = useState(null);
-
+  const ref = useRef();
   const sendFeedback = async ({ smileField, ...values }) => {
     const response = await avRegionsApi.getCurrentRegion();
 
@@ -110,10 +111,11 @@ const FeedbackForm = ({
         {prompt || `Tell us what you think about ${name}`}
       </ModalHeader>
       <Form
+        innerRef={ref}
         aria-label="Feedback Form"
         aria-describedby="feedback-form-header"
         role="form"
-        onKeyDown={({ keyCode }) => keyCode === 27 && onClose()}
+        onKeyDown={({ key }) => key === 'Escape' && onClose()}
         data-testid="feedback-form"
         initialValues={{
           'face-options': undefined,
@@ -153,6 +155,7 @@ const FeedbackForm = ({
               onChange={(option) => setActive(option)}
               onClose={onClose}
               autoFocusFeedbackButton={autoFocusFeedbackButton}
+              modal={modal}
             />
           </FormGroup>
 
@@ -199,7 +202,7 @@ const FeedbackForm = ({
                 onClick={() => setSupportIsActive(true)}
                 color="link"
                 type="button"
-                onKeyDown={({ keyCode }) => keyCode === 13 && setSupportIsActive(true)}
+                onKeyDown={({ key }) => key === 'Enter' && setSupportIsActive(true)}
               >
                 Open a support ticket
               </Button>
@@ -208,13 +211,14 @@ const FeedbackForm = ({
 
           {onClose ? (
             <Button
+              type="button"
               onClick={onClose}
               color="secondary"
-              onKeyDown={({ keyCode }) => {
-                if (keyCode === 13) {
+              onKeyDown={({ key, shiftKey }) => {
+                if (key === 'Enter') {
                   onClose();
                 }
-                if (keyCode === 9 && !active) {
+                if (key === 'Tab' && !active && !shiftKey && !modal) {
                   onClose();
                 }
               }}
@@ -224,8 +228,11 @@ const FeedbackForm = ({
           ) : null}
 
           <Button
-            onKeyDown={({ keyCode }) => {
-              if (keyCode === 9) {
+            onKeyDown={({ key, shiftKey }) => {
+              if (key === 'Enter') {
+                ref.current.submitForm();
+              }
+              if (key === 'Tab' && !shiftKey && !modal) {
                 onClose();
               }
             }}
@@ -269,6 +276,7 @@ FeedbackForm.propTypes = {
   showSupport: PropTypes.bool,
   setSupportIsActive: PropTypes.func,
   autoFocusFeedbackButton: PropTypes.bool,
+  modal: PropTypes.bool,
 };
 
 FeedbackForm.defaultProps = {
@@ -277,6 +285,7 @@ FeedbackForm.defaultProps = {
   additionalComments: false,
   analytics: avLogMessagesApi,
   showSupport: false,
+  modal: true,
 };
 
 export default FeedbackForm;

package/src/SmileField.js

@@ -5,7 +5,7 @@ import FeedbackButton from './FeedbackButton';
 
 const btnStyles = { flex: 1, margin: '0 2% 0 2%' };
 
-const SmileField = ({ name, options, onChange, autoFocusFeedbackButton, onClose }) => {
+const SmileField = ({ name, options, onChange, autoFocusFeedbackButton, onClose, modal }) => {
   const [{ value }] = useField(name);
   const { setFieldValue } = useFormikContext();
 
@@ -13,7 +13,7 @@ const SmileField = ({ name, options, onChange, autoFocusFeedbackButton, onClose
     <FeedbackButton
       autoFocus={i === 0 && autoFocusFeedbackButton}
       onKeyDown={(e) => {
-        if (e.shiftKey && e.keyCode === 9 && i === 0) {
+        if (e.shiftKey && e.keyCode === 9 && i === 0 && !modal) {
           onClose();
         }
         if (e.keyCode === 13) {
@@ -52,6 +52,7 @@ SmileField.propTypes = {
   ),
   onChange: PropTypes.func,
   autoFocusFeedbackButton: PropTypes.bool,
+  modal: PropTypes.bool
 };
 
 SmileField.defaultProps = {