@availity/feedback 6.2.4 → 6.2.8

package/CHANGELOG.md

@@ -3,6 +3,50 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [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)
+
+
+### Bug Fixes
+
+* **feedback:** added keyDown for tabbing out to close dropdown ([afa0ce8](https://github.com/Availity/availity-react/commit/afa0ce8d6c4116a1c6ede611025bf2c794129d8b))
+* **feedback:** removed console log ([df6b146](https://github.com/Availity/availity-react/commit/df6b146ae66560777d797c0399dbf9b2db189e47))
+
+
+
+
+
 ## [6.2.4](https://github.com/Availity/availity-react/compare/@availity/feedback@6.2.3...@availity/feedback@6.2.4) (2021-11-30)
 
 **Note:** Version bump only for package @availity/feedback

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@availity/feedback",
-  "version": "6.2.4",
+  "version": "6.2.8",
   "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": "3b4020556e3a49e3622af9310a3dced59e33baf2"
+  "gitHead": "2228d274e32b89c096d6e22e6b6d84fa7e2ac6ff"
 }

package/src/FeedbackDropdown.js

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

package/src/FeedbackForm.js

@@ -40,6 +40,7 @@ const FeedbackForm = ({
   showSupport,
   setSupportIsActive,
   autoFocusFeedbackButton,
+  modal,
   ...formProps
 }) => {
   const [active, setActive] = useState(null);
@@ -151,7 +152,9 @@ const FeedbackForm = ({
               options={faceOptions}
               name="smileField"
               onChange={(option) => setActive(option)}
+              onClose={onClose}
               autoFocusFeedbackButton={autoFocusFeedbackButton}
+              modal={modal}
             />
           </FormGroup>
 
@@ -206,12 +209,32 @@ const FeedbackForm = ({
           ) : null}
 
           {onClose ? (
-            <Button onClick={onClose} color="secondary" onKeyDown={({ keyCode }) => keyCode === 13 && onClose()}>
+            <Button
+              onClick={onClose}
+              color="secondary"
+              onKeyDown={({keyCode, shiftKey}) => {
+                if (keyCode === 13) {
+                  onClose();
+                }
+                if (keyCode === 9 && !active && !shiftKey && !modal) {
+                  onClose();
+                }
+              }}
+            >
               Close
             </Button>
           ) : null}
 
-          <Button type="submit" color="primary" disabled={!active}>
+          <Button
+            onKeyDown={({keyCode, shiftKey}) => {
+              if (keyCode === 9 && !shiftKey && !modal) {
+                onClose();
+              }
+            }}
+            type="submit"
+            color="primary"
+            disabled={!active}
+          >
             Send Feedback
           </Button>
         </ModalFooter>
@@ -248,6 +271,7 @@ FeedbackForm.propTypes = {
   showSupport: PropTypes.bool,
   setSupportIsActive: PropTypes.func,
   autoFocusFeedbackButton: PropTypes.bool,
+  modal: PropTypes.bool
 };
 
 FeedbackForm.defaultProps = {
@@ -256,6 +280,7 @@ FeedbackForm.defaultProps = {
   additionalComments: false,
   analytics: avLogMessagesApi,
   showSupport: false,
+  modal: true
 };
 
 export default FeedbackForm;

package/src/SmileField.js

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