@atlaskit/contextual-survey 4.0.2 → 5.0.0

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @atlaskit/contextual-survey
 
+## 5.0.0
+
+### Major Changes
+
+- [#168857](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/168857)
+  [`4375440aeaf60`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/4375440aeaf60) -
+  [ux] This change removes constants exports since compiled constants are not meant to be imported.
+  Instead this change has the position values in-file instead.
+
+  This is a breaking change because we are removing an entry point.
+
+  Package consumers will need to remove "@atlaskit/contextual-survey/constants" as a dependency.
+
 ## 4.0.2
 
 ### Patch Changes

package/afm-cc/tsconfig.json

@@ -4,7 +4,7 @@
         "declaration": true,
         "target": "es5",
         "composite": true,
-        "outDir": "../dist",
+        "outDir": "../../../../../confluence/tsDist/@atlaskit__contextual-survey",
         "rootDir": "../"
     },
     "include": [

package/dist/cjs/components/SurveyContainer.compiled.css

@@ -2,7 +2,7 @@
 ._2rko1sit{border-radius:var(--ds-border-radius,3px)}._154ipxbi{top:var(--ds-space-200,1pc)}
 ._16qs1dt4{box-shadow:var(--_qzf6oc)}
 ._19bv1ejb{padding-left:var(--ds-space-300,24px)}
-._1bsb1sw3{width:var(--_18gm6wc)}
+._1bsb1vif{width:440px}
 ._1xi2pxbi{right:var(--ds-space-200,1pc)}
 ._bfhk13b4{background-color:var(--_1f6rtr1)}
 ._ca0q1ejb{padding-top:var(--ds-space-300,24px)}

package/dist/cjs/components/SurveyContainer.js

@@ -13,7 +13,6 @@ var _runtime = require("@compiled/react/runtime");
 var _new = require("@atlaskit/button/new");
 var _closeCross = _interopRequireDefault(require("@atlaskit/icon/core/migration/close--cross"));
 var _colors = require("@atlaskit/theme/colors");
-var _constants = require("../constants");
 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 containerStyles = null;
 var buttonWrapperStyles = null;
@@ -21,11 +20,10 @@ var _default = exports.default = function _default(_ref) {
   var children = _ref.children,
     onDismiss = _ref.onDismiss;
   return /*#__PURE__*/React.createElement("div", {
-    className: (0, _runtime.ax)(["_2rko1sit _bfhk13b4 _ca0q1ejb _u5f31ejb _n3td1ejb _19bv1ejb _16qs1dt4 _1bsb1sw3"]),
+    className: (0, _runtime.ax)(["_2rko1sit _bfhk13b4 _ca0q1ejb _u5f31ejb _n3td1ejb _19bv1ejb _16qs1dt4 _1bsb1vif"]),
     style: {
       "--_1f6rtr1": (0, _runtime.ix)("var(--ds-surface-overlay, ".concat(_colors.N0, ")")),
-      "--_qzf6oc": (0, _runtime.ix)("var(--ds-shadow-overlay, ".concat("0 20px 32px -8px ".concat(_colors.N50A, ", 0 0 1px ").concat(_colors.N60A), ")")),
-      "--_18gm6wc": (0, _runtime.ix)("".concat(_constants.surveyInnerWidth, "px"))
+      "--_qzf6oc": (0, _runtime.ix)("var(--ds-shadow-overlay, ".concat("0 20px 32px -8px ".concat(_colors.N50A, ", 0 0 1px ").concat(_colors.N60A), ")"))
     }
   }, /*#__PURE__*/React.createElement("div", {
     className: (0, _runtime.ax)(["_kqswstnw _154ipxbi _1xi2pxbi"])

package/dist/cjs/components/SurveyMarshal.compiled.css

@@ -1,4 +1,4 @@
-._1xi28err{right:var(--_1hx5ohh)}
-._94n58err{bottom:var(--_1hx5ohh)}
+._1xi2oahv{right:var(--ds-space-600,3pc)}
+._94n5oahv{bottom:var(--ds-space-600,3pc)}
 ._k8m01rjc{transition-property:transform,opacity}
 ._kqsw1n9t{position:fixed}

package/dist/cjs/components/SurveyMarshal.js

@@ -11,11 +11,14 @@ var React = _interopRequireWildcard(require("react"));
 var _runtime = require("@compiled/react/runtime");
 var _reactTransitionGroup = require("react-transition-group");
 var _constants = require("@atlaskit/theme/constants");
-var _constants2 = require("../constants");
 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); }
+// 8px is the base unit in pixels
+var surveyOffset = "var(--ds-space-600, 48px)";
 var animationDuration = 300;
 var offscreen = {
-  translateX: "".concat(_constants2.surveyInnerWidth + _constants2.surveyOffset, "px"),
+  // Hard-coded because there is no large enough space token and this component is not responsive.
+  translateX: "488px",
+  //survey container width + survey offset
   opacity: '0'
 };
 var getAnimationProps = function getAnimationProps(state) {
@@ -49,14 +52,13 @@ function SurveyMarshal(props) {
       translateX = _getAnimationProps.translateX,
       opacity = _getAnimationProps.opacity;
     return /*#__PURE__*/React.createElement("div", {
-      className: (0, _runtime.ax)(["_kqsw1n9t _1xi28err _94n58err _k8m01rjc"]),
       style: {
         opacity: opacity,
         transition: "all ".concat(animationDuration, "ms ease-in-out"),
         zIndex: _constants.layers.flag(),
-        transform: "translateX(".concat(translateX, ")"),
-        "--_1hx5ohh": (0, _runtime.ix)("".concat(_constants2.surveyOffset, "px"))
-      }
+        transform: "translateX(".concat(translateX, ")")
+      },
+      className: (0, _runtime.ax)(["_kqsw1n9t _1xi2oahv _94n5oahv _k8m01rjc"])
     }, children());
   });
 }

package/dist/es2019/components/SurveyContainer.js

@@ -5,7 +5,6 @@ import { ax, ix } from "@compiled/react/runtime";
 import { IconButton as Button } from '@atlaskit/button/new';
 import CrossIcon from '@atlaskit/icon/core/migration/close--cross';
 import { N0, N50A, N60A } from '@atlaskit/theme/colors';
-import { surveyInnerWidth } from '../constants';
 const containerStyles = null;
 const buttonWrapperStyles = null;
 export default (({

package/dist/es2019/components/SurveyMarshal.compiled.css

@@ -1,4 +1,4 @@
-._1xi2ckbl{right:3pc}
-._94n5ckbl{bottom:3pc}
+._1xi2oahv{right:var(--ds-space-600,3pc)}
+._94n5oahv{bottom:var(--ds-space-600,3pc)}
 ._k8m01rjc{transition-property:transform,opacity}
 ._kqsw1n9t{position:fixed}

package/dist/es2019/components/SurveyMarshal.js

@@ -4,10 +4,13 @@ import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
 import { Transition } from 'react-transition-group';
 import { layers } from '@atlaskit/theme/constants';
-import { surveyInnerWidth, surveyOffset } from '../constants';
+// 8px is the base unit in pixels
+const surveyOffset = "var(--ds-space-600, 48px)";
 const animationDuration = 300;
 const offscreen = {
-  translateX: `${surveyInnerWidth + surveyOffset}px`,
+  // Hard-coded because there is no large enough space token and this component is not responsive.
+  translateX: "488px",
+  //survey container width + survey offset
   opacity: '0'
 };
 const getAnimationProps = state => {
@@ -50,7 +53,7 @@ export default function SurveyMarshal(props) {
         zIndex: layers.flag(),
         transform: `translateX(${translateX})`
       },
-      className: ax(["_kqsw1n9t _1xi2ckbl _94n5ckbl _k8m01rjc"])
+      className: ax(["_kqsw1n9t _1xi2oahv _94n5oahv _k8m01rjc"])
     }, children());
   });
 }

package/dist/esm/components/SurveyContainer.compiled.css

@@ -2,7 +2,7 @@
 ._2rko1sit{border-radius:var(--ds-border-radius,3px)}._154ipxbi{top:var(--ds-space-200,1pc)}
 ._16qs1dt4{box-shadow:var(--_qzf6oc)}
 ._19bv1ejb{padding-left:var(--ds-space-300,24px)}
-._1bsb1sw3{width:var(--_18gm6wc)}
+._1bsb1vif{width:440px}
 ._1xi2pxbi{right:var(--ds-space-200,1pc)}
 ._bfhk13b4{background-color:var(--_1f6rtr1)}
 ._ca0q1ejb{padding-top:var(--ds-space-300,24px)}

package/dist/esm/components/SurveyContainer.js

@@ -5,18 +5,16 @@ import { ax, ix } from "@compiled/react/runtime";
 import { IconButton as Button } from '@atlaskit/button/new';
 import CrossIcon from '@atlaskit/icon/core/migration/close--cross';
 import { N0, N50A, N60A } from '@atlaskit/theme/colors';
-import { surveyInnerWidth } from '../constants';
 var containerStyles = null;
 var buttonWrapperStyles = null;
 export default (function (_ref) {
   var children = _ref.children,
     onDismiss = _ref.onDismiss;
   return /*#__PURE__*/React.createElement("div", {
-    className: ax(["_2rko1sit _bfhk13b4 _ca0q1ejb _u5f31ejb _n3td1ejb _19bv1ejb _16qs1dt4 _1bsb1sw3"]),
+    className: ax(["_2rko1sit _bfhk13b4 _ca0q1ejb _u5f31ejb _n3td1ejb _19bv1ejb _16qs1dt4 _1bsb1vif"]),
     style: {
       "--_1f6rtr1": ix("var(--ds-surface-overlay, ".concat(N0, ")")),
-      "--_qzf6oc": ix("var(--ds-shadow-overlay, ".concat("0 20px 32px -8px ".concat(N50A, ", 0 0 1px ").concat(N60A), ")")),
-      "--_18gm6wc": ix("".concat(surveyInnerWidth, "px"))
+      "--_qzf6oc": ix("var(--ds-shadow-overlay, ".concat("0 20px 32px -8px ".concat(N50A, ", 0 0 1px ").concat(N60A), ")"))
     }
   }, /*#__PURE__*/React.createElement("div", {
     className: ax(["_kqswstnw _154ipxbi _1xi2pxbi"])

package/dist/esm/components/SurveyMarshal.compiled.css

@@ -1,4 +1,4 @@
-._1xi28err{right:var(--_1hx5ohh)}
-._94n58err{bottom:var(--_1hx5ohh)}
+._1xi2oahv{right:var(--ds-space-600,3pc)}
+._94n5oahv{bottom:var(--ds-space-600,3pc)}
 ._k8m01rjc{transition-property:transform,opacity}
 ._kqsw1n9t{position:fixed}

package/dist/esm/components/SurveyMarshal.js

@@ -4,10 +4,13 @@ import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
 import { Transition } from 'react-transition-group';
 import { layers } from '@atlaskit/theme/constants';
-import { surveyInnerWidth, surveyOffset } from '../constants';
+// 8px is the base unit in pixels
+var surveyOffset = "var(--ds-space-600, 48px)";
 var animationDuration = 300;
 var offscreen = {
-  translateX: "".concat(surveyInnerWidth + surveyOffset, "px"),
+  // Hard-coded because there is no large enough space token and this component is not responsive.
+  translateX: "488px",
+  //survey container width + survey offset
   opacity: '0'
 };
 var getAnimationProps = function getAnimationProps(state) {
@@ -41,14 +44,13 @@ export default function SurveyMarshal(props) {
       translateX = _getAnimationProps.translateX,
       opacity = _getAnimationProps.opacity;
     return /*#__PURE__*/React.createElement("div", {
-      className: ax(["_kqsw1n9t _1xi28err _94n58err _k8m01rjc"]),
       style: {
         opacity: opacity,
         transition: "all ".concat(animationDuration, "ms ease-in-out"),
         zIndex: layers.flag(),
-        transform: "translateX(".concat(translateX, ")"),
-        "--_1hx5ohh": ix("".concat(surveyOffset, "px"))
-      }
+        transform: "translateX(".concat(translateX, ")")
+      },
+      className: ax(["_kqsw1n9t _1xi2oahv _94n5oahv _k8m01rjc"])
     }, children());
   });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/contextual-survey",
-	"version": "4.0.2",
+	"version": "5.0.0",
 	"description": "A React component used to ask the user for feedback",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -26,7 +26,6 @@
 	"atlaskit:src": "src/index.ts",
 	"af:exports": {
 		".": "./src/index.ts",
-		"./constants": "./src/constants.ts",
 		"./types": "./src/types.ts"
 	},
 	"atlassian": {
@@ -47,8 +46,8 @@
 		"@atlaskit/primitives": "^14.8.0",
 		"@atlaskit/textarea": "^8.0.0",
 		"@atlaskit/theme": "^18.0.0",
-		"@atlaskit/tokens": "^5.0.0",
-		"@atlaskit/tooltip": "^20.2.0",
+		"@atlaskit/tokens": "^5.1.0",
+		"@atlaskit/tooltip": "^20.3.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^0.18.3",
 		"@emotion/react": "^11.7.1",

package/constants/package.json

@@ -1,17 +0,0 @@
-{
-  "name": "@atlaskit/contextual-survey/constants",
-  "main": "../dist/cjs/constants.js",
-  "module": "../dist/esm/constants.js",
-  "module:es2019": "../dist/es2019/constants.js",
-  "sideEffects": [
-    "*.compiled.css"
-  ],
-  "types": "../dist/types/constants.d.ts",
-  "typesVersions": {
-    ">=4.5 <5.4": {
-      "*": [
-        "../dist/types-ts4.5/constants.d.ts"
-      ]
-    }
-  }
-}

package/dist/cjs/constants.js

@@ -1,9 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.surveyOffset = exports.surveyInnerWidth = void 0;
-var _constants = require("@atlaskit/theme/constants");
-var surveyInnerWidth = exports.surveyInnerWidth = (0, _constants.gridSize)() * 55; // 440
-var surveyOffset = exports.surveyOffset = (0, _constants.gridSize)() * 6; // 48

package/dist/es2019/constants.js

@@ -1,3 +0,0 @@
-import { gridSize } from '@atlaskit/theme/constants';
-export const surveyInnerWidth = gridSize() * 55; // 440
-export const surveyOffset = gridSize() * 6; // 48

package/dist/esm/constants.js

@@ -1,3 +0,0 @@
-import { gridSize } from '@atlaskit/theme/constants';
-export var surveyInnerWidth = gridSize() * 55; // 440
-export var surveyOffset = gridSize() * 6; // 48

package/dist/types/constants.d.ts

@@ -1,2 +0,0 @@
-export declare const surveyInnerWidth: number;
-export declare const surveyOffset: number;

package/dist/types-ts4.5/constants.d.ts

@@ -1,2 +0,0 @@
-export declare const surveyInnerWidth: number;
-export declare const surveyOffset: number;