@atlaskit/contextual-survey 6.0.10 → 6.0.12

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/contextual-survey
 
+## 6.0.12
+
+### Patch Changes
+
+- Updated dependencies
+
+## 6.0.11
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 6.0.10
 
 ### Patch Changes

package/dist/cjs/new-survey/SurveyForm.js

@@ -15,12 +15,13 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _reactTransitionGroup = require("react-transition-group");
 var _new = _interopRequireDefault(require("@atlaskit/button/new"));
-var _checkbox = require("@atlaskit/checkbox");
 var _form = _interopRequireWildcard(require("@atlaskit/form"));
 var _heading = _interopRequireDefault(require("@atlaskit/heading"));
+var _motion = require("@atlaskit/motion");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _compiled = require("@atlaskit/primitives/compiled");
-var _textarea = _interopRequireDefault(require("@atlaskit/textarea"));
 var _FeedbackScoreButtons = _interopRequireDefault(require("./FeedbackScoreButtons"));
+var _SurveyFormExpandedFeedback = require("./SurveyFormExpandedFeedback");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var transitionBaseStyles = null;
 var styles = {
@@ -72,6 +73,14 @@ var _default = exports.default = function _default(_ref) {
     hasAutoFilledCanContactRef.current = true;
     setCanContactDefault(true);
   }, []);
+  var resizingHeightProps = (0, _motion.useResizingHeight)({
+    duration: function duration() {
+      return TRANSITION_DURATION;
+    },
+    timingFunction: function timingFunction() {
+      return 'ease-in-out';
+    }
+  });
   return /*#__PURE__*/React.createElement("section", {
     "aria-labelledby": "contextualSurveyQuestion"
   }, /*#__PURE__*/React.createElement(_compiled.Stack, {
@@ -104,7 +113,14 @@ var _default = exports.default = function _default(_ref) {
           onScoreSelect();
         }
       }));
-    }), /*#__PURE__*/React.createElement(_reactTransitionGroup.Transition, {
+    }), (0, _platformFeatureFlags.fg)('platform_contextual_survey_use_atlaskit_motion') ? /*#__PURE__*/React.createElement("div", (0, _extends2.default)({}, resizingHeightProps, {
+      className: (0, _runtime.ax)(["_1reo15vq _18m915vq"])
+    }), expanded ? /*#__PURE__*/React.createElement(_SurveyFormExpandedFeedback.SurveyFormExpandedFeedback, {
+      canContactDefault: canContactDefault,
+      onFeedbackChange: onFeedbackChange,
+      submitting: submitting,
+      textLabel: textLabel
+    }) : null) : /*#__PURE__*/React.createElement(_reactTransitionGroup.Transition, {
       in: expanded,
       timeout: TRANSITION_DURATION,
       mountOnEnter: true
@@ -116,29 +132,11 @@ var _default = exports.default = function _default(_ref) {
         },
         ref: expandedAreaRef,
         className: (0, _runtime.ax)(["_1reo15vq _18m915vq"])
-      }, /*#__PURE__*/React.createElement(_form.Field, {
-        name: "writtenFeedback",
-        defaultValue: "",
-        isDisabled: submitting,
-        label: textLabel
-      }, function (_ref4) {
-        var fieldProps = _ref4.fieldProps;
-        return /*#__PURE__*/React.createElement(_textarea.default, (0, _extends2.default)({}, fieldProps, {
-          "aria-label": textLabel,
-          onChange: function onChange(event) {
-            fieldProps.onChange(event);
-            onFeedbackChange();
-          }
-        }));
-      }), /*#__PURE__*/React.createElement(_form.CheckboxField, {
-        name: "canContact",
-        isDisabled: submitting,
-        defaultIsChecked: canContactDefault
-      }, function (_ref5) {
-        var fieldProps = _ref5.fieldProps;
-        return /*#__PURE__*/React.createElement(_checkbox.Checkbox, (0, _extends2.default)({}, fieldProps, {
-          label: "Atlassian can contact me about this feedback"
-        }));
+      }, /*#__PURE__*/React.createElement(_SurveyFormExpandedFeedback.SurveyFormExpandedFeedback, {
+        canContactDefault: canContactDefault,
+        onFeedbackChange: onFeedbackChange,
+        submitting: submitting,
+        textLabel: textLabel
       }));
     }), /*#__PURE__*/React.createElement(_compiled.Box, {
       xcss: styles.buttonContainer

package/dist/cjs/new-survey/SurveyFormExpandedFeedback.js

@@ -0,0 +1,42 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SurveyFormExpandedFeedback = SurveyFormExpandedFeedback;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireDefault(require("react"));
+var _checkbox = _interopRequireDefault(require("@atlaskit/checkbox"));
+var _form = require("@atlaskit/form");
+var _textarea = _interopRequireDefault(require("@atlaskit/textarea"));
+function SurveyFormExpandedFeedback(_ref) {
+  var canContactDefault = _ref.canContactDefault,
+    onFeedbackChange = _ref.onFeedbackChange,
+    submitting = _ref.submitting,
+    textLabel = _ref.textLabel;
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_form.Field, {
+    name: "writtenFeedback",
+    defaultValue: "",
+    isDisabled: submitting,
+    label: textLabel
+  }, function (_ref2) {
+    var fieldProps = _ref2.fieldProps;
+    return /*#__PURE__*/_react.default.createElement(_textarea.default, (0, _extends2.default)({}, fieldProps, {
+      "aria-label": textLabel,
+      onChange: function onChange(event) {
+        fieldProps.onChange(event);
+        onFeedbackChange();
+      }
+    }));
+  }), /*#__PURE__*/_react.default.createElement(_form.CheckboxField, {
+    name: "canContact",
+    isDisabled: submitting,
+    defaultIsChecked: canContactDefault
+  }, function (_ref3) {
+    var fieldProps = _ref3.fieldProps;
+    return /*#__PURE__*/_react.default.createElement(_checkbox.default, (0, _extends2.default)({}, fieldProps, {
+      label: "Atlassian can contact me about this feedback"
+    }));
+  }));
+}

package/dist/es2019/new-survey/SurveyForm.js

@@ -6,12 +6,13 @@ import { ax, ix } from "@compiled/react/runtime";
 import { useCallback, useRef, useState } from 'react';
 import { Transition } from 'react-transition-group';
 import Button from '@atlaskit/button/new';
-import { Checkbox } from '@atlaskit/checkbox';
-import Form, { CheckboxField, Field } from '@atlaskit/form';
+import Form, { Field } from '@atlaskit/form';
 import Heading from '@atlaskit/heading';
+import { useResizingHeight } from '@atlaskit/motion';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { Box, Stack, Text } from '@atlaskit/primitives/compiled';
-import Textarea from '@atlaskit/textarea';
 import FeedbackScoreButtons from './FeedbackScoreButtons';
+import { SurveyFormExpandedFeedback } from './SurveyFormExpandedFeedback';
 const transitionBaseStyles = null;
 const styles = {
   buttonContainer: "_19pk1ejb",
@@ -57,6 +58,10 @@ export default (({
     hasAutoFilledCanContactRef.current = true;
     setCanContactDefault(true);
   }, []);
+  const resizingHeightProps = useResizingHeight({
+    duration: () => TRANSITION_DURATION,
+    timingFunction: () => 'ease-in-out'
+  });
   return /*#__PURE__*/React.createElement("section", {
     "aria-labelledby": "contextualSurveyQuestion"
   }, /*#__PURE__*/React.createElement(Stack, {
@@ -88,7 +93,14 @@ export default (({
       fieldProps.onChange(score);
       onScoreSelect();
     }
-  }))), /*#__PURE__*/React.createElement(Transition, {
+  }))), fg('platform_contextual_survey_use_atlaskit_motion') ? /*#__PURE__*/React.createElement("div", _extends({}, resizingHeightProps, {
+    className: ax(["_1reo15vq _18m915vq"])
+  }), expanded ? /*#__PURE__*/React.createElement(SurveyFormExpandedFeedback, {
+    canContactDefault: canContactDefault,
+    onFeedbackChange: onFeedbackChange,
+    submitting: submitting,
+    textLabel: textLabel
+  }) : null) : /*#__PURE__*/React.createElement(Transition, {
     in: expanded,
     timeout: TRANSITION_DURATION,
     mountOnEnter: true
@@ -99,28 +111,12 @@ export default (({
     },
     ref: expandedAreaRef,
     className: ax(["_1reo15vq _18m915vq"])
-  }, /*#__PURE__*/React.createElement(Field, {
-    name: "writtenFeedback",
-    defaultValue: "",
-    isDisabled: submitting,
-    label: textLabel
-  }, ({
-    fieldProps
-  }) => /*#__PURE__*/React.createElement(Textarea, _extends({}, fieldProps, {
-    "aria-label": textLabel,
-    onChange: event => {
-      fieldProps.onChange(event);
-      onFeedbackChange();
-    }
-  }))), /*#__PURE__*/React.createElement(CheckboxField, {
-    name: "canContact",
-    isDisabled: submitting,
-    defaultIsChecked: canContactDefault
-  }, ({
-    fieldProps
-  }) => /*#__PURE__*/React.createElement(Checkbox, _extends({}, fieldProps, {
-    label: "Atlassian can contact me about this feedback"
-  }))))), /*#__PURE__*/React.createElement(Box, {
+  }, /*#__PURE__*/React.createElement(SurveyFormExpandedFeedback, {
+    canContactDefault: canContactDefault,
+    onFeedbackChange: onFeedbackChange,
+    submitting: submitting,
+    textLabel: textLabel
+  }))), /*#__PURE__*/React.createElement(Box, {
     xcss: styles.buttonContainer
   }, /*#__PURE__*/React.createElement(Button, {
     isDisabled: !expanded,

package/dist/es2019/new-survey/SurveyFormExpandedFeedback.js

@@ -0,0 +1,34 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import Checkbox from '@atlaskit/checkbox';
+import { CheckboxField, Field } from '@atlaskit/form';
+import Textarea from '@atlaskit/textarea';
+export function SurveyFormExpandedFeedback({
+  canContactDefault,
+  onFeedbackChange,
+  submitting,
+  textLabel
+}) {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Field, {
+    name: "writtenFeedback",
+    defaultValue: "",
+    isDisabled: submitting,
+    label: textLabel
+  }, ({
+    fieldProps
+  }) => /*#__PURE__*/React.createElement(Textarea, _extends({}, fieldProps, {
+    "aria-label": textLabel,
+    onChange: event => {
+      fieldProps.onChange(event);
+      onFeedbackChange();
+    }
+  }))), /*#__PURE__*/React.createElement(CheckboxField, {
+    name: "canContact",
+    isDisabled: submitting,
+    defaultIsChecked: canContactDefault
+  }, ({
+    fieldProps
+  }) => /*#__PURE__*/React.createElement(Checkbox, _extends({}, fieldProps, {
+    label: "Atlassian can contact me about this feedback"
+  }))));
+}

package/dist/esm/new-survey/SurveyForm.js

@@ -7,12 +7,13 @@ import { ax, ix } from "@compiled/react/runtime";
 import { useCallback, useRef, useState } from 'react';
 import { Transition } from 'react-transition-group';
 import Button from '@atlaskit/button/new';
-import { Checkbox } from '@atlaskit/checkbox';
-import Form, { CheckboxField, Field } from '@atlaskit/form';
+import Form, { Field } from '@atlaskit/form';
 import Heading from '@atlaskit/heading';
+import { useResizingHeight } from '@atlaskit/motion';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { Box, Stack, Text } from '@atlaskit/primitives/compiled';
-import Textarea from '@atlaskit/textarea';
 import FeedbackScoreButtons from './FeedbackScoreButtons';
+import { SurveyFormExpandedFeedback } from './SurveyFormExpandedFeedback';
 var transitionBaseStyles = null;
 var styles = {
   buttonContainer: "_19pk1ejb",
@@ -63,6 +64,14 @@ export default (function (_ref) {
     hasAutoFilledCanContactRef.current = true;
     setCanContactDefault(true);
   }, []);
+  var resizingHeightProps = useResizingHeight({
+    duration: function duration() {
+      return TRANSITION_DURATION;
+    },
+    timingFunction: function timingFunction() {
+      return 'ease-in-out';
+    }
+  });
   return /*#__PURE__*/React.createElement("section", {
     "aria-labelledby": "contextualSurveyQuestion"
   }, /*#__PURE__*/React.createElement(Stack, {
@@ -95,7 +104,14 @@ export default (function (_ref) {
           onScoreSelect();
         }
       }));
-    }), /*#__PURE__*/React.createElement(Transition, {
+    }), fg('platform_contextual_survey_use_atlaskit_motion') ? /*#__PURE__*/React.createElement("div", _extends({}, resizingHeightProps, {
+      className: ax(["_1reo15vq _18m915vq"])
+    }), expanded ? /*#__PURE__*/React.createElement(SurveyFormExpandedFeedback, {
+      canContactDefault: canContactDefault,
+      onFeedbackChange: onFeedbackChange,
+      submitting: submitting,
+      textLabel: textLabel
+    }) : null) : /*#__PURE__*/React.createElement(Transition, {
       in: expanded,
       timeout: TRANSITION_DURATION,
       mountOnEnter: true
@@ -107,29 +123,11 @@ export default (function (_ref) {
         },
         ref: expandedAreaRef,
         className: ax(["_1reo15vq _18m915vq"])
-      }, /*#__PURE__*/React.createElement(Field, {
-        name: "writtenFeedback",
-        defaultValue: "",
-        isDisabled: submitting,
-        label: textLabel
-      }, function (_ref4) {
-        var fieldProps = _ref4.fieldProps;
-        return /*#__PURE__*/React.createElement(Textarea, _extends({}, fieldProps, {
-          "aria-label": textLabel,
-          onChange: function onChange(event) {
-            fieldProps.onChange(event);
-            onFeedbackChange();
-          }
-        }));
-      }), /*#__PURE__*/React.createElement(CheckboxField, {
-        name: "canContact",
-        isDisabled: submitting,
-        defaultIsChecked: canContactDefault
-      }, function (_ref5) {
-        var fieldProps = _ref5.fieldProps;
-        return /*#__PURE__*/React.createElement(Checkbox, _extends({}, fieldProps, {
-          label: "Atlassian can contact me about this feedback"
-        }));
+      }, /*#__PURE__*/React.createElement(SurveyFormExpandedFeedback, {
+        canContactDefault: canContactDefault,
+        onFeedbackChange: onFeedbackChange,
+        submitting: submitting,
+        textLabel: textLabel
       }));
     }), /*#__PURE__*/React.createElement(Box, {
       xcss: styles.buttonContainer

package/dist/esm/new-survey/SurveyFormExpandedFeedback.js

@@ -0,0 +1,35 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import Checkbox from '@atlaskit/checkbox';
+import { CheckboxField, Field } from '@atlaskit/form';
+import Textarea from '@atlaskit/textarea';
+export function SurveyFormExpandedFeedback(_ref) {
+  var canContactDefault = _ref.canContactDefault,
+    onFeedbackChange = _ref.onFeedbackChange,
+    submitting = _ref.submitting,
+    textLabel = _ref.textLabel;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Field, {
+    name: "writtenFeedback",
+    defaultValue: "",
+    isDisabled: submitting,
+    label: textLabel
+  }, function (_ref2) {
+    var fieldProps = _ref2.fieldProps;
+    return /*#__PURE__*/React.createElement(Textarea, _extends({}, fieldProps, {
+      "aria-label": textLabel,
+      onChange: function onChange(event) {
+        fieldProps.onChange(event);
+        onFeedbackChange();
+      }
+    }));
+  }), /*#__PURE__*/React.createElement(CheckboxField, {
+    name: "canContact",
+    isDisabled: submitting,
+    defaultIsChecked: canContactDefault
+  }, function (_ref3) {
+    var fieldProps = _ref3.fieldProps;
+    return /*#__PURE__*/React.createElement(Checkbox, _extends({}, fieldProps, {
+      label: "Atlassian can contact me about this feedback"
+    }));
+  }));
+}

package/dist/types/new-survey/SurveyFormExpandedFeedback.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export type SurveyFormExpandedFeedbackProps = {
+    canContactDefault: boolean;
+    onFeedbackChange: () => void;
+    submitting: boolean;
+    textLabel: string;
+};
+export declare function SurveyFormExpandedFeedback({ canContactDefault, onFeedbackChange, submitting, textLabel, }: SurveyFormExpandedFeedbackProps): React.JSX.Element;

package/dist/types-ts4.5/new-survey/SurveyFormExpandedFeedback.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export type SurveyFormExpandedFeedbackProps = {
+    canContactDefault: boolean;
+    onFeedbackChange: () => void;
+    submitting: boolean;
+    textLabel: string;
+};
+export declare function SurveyFormExpandedFeedback({ canContactDefault, onFeedbackChange, submitting, textLabel, }: SurveyFormExpandedFeedbackProps): React.JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/contextual-survey",
-	"version": "6.0.10",
+	"version": "6.0.12",
 	"description": "A React component used to ask the user for feedback",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -39,12 +39,12 @@
 		"@atlaskit/icon": "^34.0.0",
 		"@atlaskit/image": "^3.0.0",
 		"@atlaskit/link": "^3.4.0",
-		"@atlaskit/motion": "^5.5.0",
+		"@atlaskit/motion": "^5.6.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
-		"@atlaskit/primitives": "^18.1.0",
+		"@atlaskit/primitives": "^19.0.0",
 		"@atlaskit/textarea": "^8.2.0",
 		"@atlaskit/theme": "^23.0.0",
-		"@atlaskit/tokens": "^11.4.0",
+		"@atlaskit/tokens": "^13.0.0",
 		"@atlaskit/tooltip": "^21.1.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^0.20.0",