@atlaskit/user-picker 10.12.5 → 10.12.7

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/user-picker
 
+## 10.12.7
+
+### Patch Changes
+
+- [#58511](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/58511) [`25cdcae132b5`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/25cdcae132b5) - Fix for user picker correctly rendering noOptionsMessage when provided a react node
+
+## 10.12.6
+
+### Patch Changes
+
+- [#57137](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/57137) [`9b9900944973`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/9b9900944973) - Remove legacy theming logic from @atlaskit/date, @atlaskit/mention, @atlaskit/task-decision and @atlaskit/user-picker.
+
 ## 10.12.5
 
 ### Patch Changes

package/dist/cjs/analytics.js

@@ -12,7 +12,7 @@ var _utils = require("./components/utils");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var packageName = "@atlaskit/user-picker";
-var packageVersion = "10.12.5";
+var packageVersion = "10.12.7";
 var UUID_REGEXP_TEAMS_GROUPS = /^[a-fA-F0-9]{8}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{12}$/;
 var UUID_REGEXP_OLD_AAID = /^[a-fA-F0-9]{1,8}:[a-fA-F0-9]{8}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{12}$/;
 var UUID_REGEXP_NEW_AAID = /^[a-fA-F0-9]{24,24}$/;

package/dist/cjs/components/BaseUserPicker.js

@@ -542,7 +542,9 @@ var BaseUserPickerWithoutAnalytics = exports.BaseUserPickerWithoutAnalytics = /*
         subtle: subtle,
         blurInputOnSelect: !isMulti,
         closeMenuOnSelect: !isMulti,
-        noOptionsMessage: showError ? loadOptionsErrorMessage : noOptionsMessage,
+        noOptionsMessage: showError ? loadOptionsErrorMessage : typeof noOptionsMessage === 'function' ? noOptionsMessage : function () {
+          return noOptionsMessage;
+        },
         footer: footer,
         openMenuOnFocus: true,
         isDisabled: isDisabled,

package/dist/cjs/components/PopupControl.js

@@ -11,38 +11,30 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _react = _interopRequireDefault(require("react"));
-var _components = require("@atlaskit/theme/components");
-var _constants = require("@atlaskit/theme/constants");
 var _select = require("@atlaskit/select");
 var _react2 = require("@emotion/react");
 var _colors = require("@atlaskit/theme/colors");
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } } /** @jsx jsx */
-var spacing = (0, _constants.gridSize)();
+var spacing = 8;
 var fontSize = 12;
 var innerHeight = spacing * 2; // 16px
 var lineHeight = innerHeight / fontSize;
 var controlWrapper = (0, _react2.css)({
   display: 'flex',
   flexDirection: 'column',
-  padding: "0px ".concat(spacing, "px ").concat(spacing, "px")
-});
-var getColor = (0, _components.themed)({
-  light: "var(--ds-text-subtlest, ".concat(_colors.N200, ")"),
-  dark: "var(--ds-text-subtlest, ".concat(_colors.DN90, ")")
+  padding: "0px ".concat("var(--ds-space-100, 8px)", " ", "var(--ds-space-100, 8px)")
 });
 var getLabelStyle = function getLabelStyle() {
-  var right = 0;
-  var bottom = spacing / 2;
-  var left = 0;
-  var top = spacing * 2.5;
-  var color = getColor();
   return (0, _react2.css)({
-    color: color,
+    color: "var(--ds-text-subtlest, ".concat(_colors.N200, ")"),
     fontSize: "".concat(fontSize, "px"),
     fontWeight: 600,
     lineHeight: "".concat(lineHeight),
-    padding: "".concat(top, "px ").concat(right, "px ").concat(bottom, "px ").concat(left, "px")
+    paddingBottom: "var(--ds-space-050, 4px)",
+    paddingLeft: "var(--ds-space-0, 0px)",
+    paddingRight: "var(--ds-space-0, 0px)",
+    paddingTop: "var(--ds-space-250, 20px)"
   });
 };
 var PopupControl = exports.PopupControl = /*#__PURE__*/function (_React$PureComponent) {

package/dist/es2019/analytics.js

@@ -2,7 +2,7 @@ import { createAndFireEvent } from '@atlaskit/analytics-next';
 import { v4 as uuidv4 } from 'uuid';
 import { isCustom, isExternalUser } from './components/utils';
 const packageName = "@atlaskit/user-picker";
-const packageVersion = "10.12.5";
+const packageVersion = "10.12.7";
 const UUID_REGEXP_TEAMS_GROUPS = /^[a-fA-F0-9]{8}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{12}$/;
 const UUID_REGEXP_OLD_AAID = /^[a-fA-F0-9]{1,8}:[a-fA-F0-9]{8}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{12}$/;
 const UUID_REGEXP_NEW_AAID = /^[a-fA-F0-9]{24,24}$/;

package/dist/es2019/components/BaseUserPicker.js

@@ -515,7 +515,7 @@ export class BaseUserPickerWithoutAnalytics extends React.Component {
       subtle: subtle,
       blurInputOnSelect: !isMulti,
       closeMenuOnSelect: !isMulti,
-      noOptionsMessage: showError ? loadOptionsErrorMessage : noOptionsMessage,
+      noOptionsMessage: showError ? loadOptionsErrorMessage : typeof noOptionsMessage === 'function' ? noOptionsMessage : () => noOptionsMessage,
       footer: footer,
       openMenuOnFocus: true,
       isDisabled: isDisabled,

package/dist/es2019/components/PopupControl.js

@@ -1,37 +1,27 @@
 /** @jsx jsx */
 import React from 'react';
-import { themed } from '@atlaskit/theme/components';
-import { gridSize } from '@atlaskit/theme/constants';
 import { components } from '@atlaskit/select';
 import { css, jsx } from '@emotion/react';
-import { N200, DN90 } from '@atlaskit/theme/colors';
-const spacing = gridSize();
+import { N200 } from '@atlaskit/theme/colors';
+const spacing = 8;
 const fontSize = 12;
 const innerHeight = spacing * 2; // 16px
 const lineHeight = innerHeight / fontSize;
 const controlWrapper = css({
   display: 'flex',
   flexDirection: 'column',
-  padding: `0px ${spacing}px ${spacing}px`
+  padding: `0px ${"var(--ds-space-100, 8px)"} ${"var(--ds-space-100, 8px)"}`
 });
-const getColor = themed({
-  light: `var(--ds-text-subtlest, ${N200})`,
-  dark: `var(--ds-text-subtlest, ${DN90})`
+const getLabelStyle = () => css({
+  color: `var(--ds-text-subtlest, ${N200})`,
+  fontSize: `${fontSize}px`,
+  fontWeight: 600,
+  lineHeight: `${lineHeight}`,
+  paddingBottom: "var(--ds-space-050, 4px)",
+  paddingLeft: "var(--ds-space-0, 0px)",
+  paddingRight: "var(--ds-space-0, 0px)",
+  paddingTop: "var(--ds-space-250, 20px)"
 });
-const getLabelStyle = () => {
-  const right = 0;
-  const bottom = spacing / 2;
-  const left = 0;
-  const top = spacing * 2.5;
-  const color = getColor();
-  return css({
-    color,
-    fontSize: `${fontSize}px`,
-    fontWeight: 600,
-    lineHeight: `${lineHeight}`,
-    padding: `${top}px ${right}px ${bottom}px ${left}px`
-  });
-};
 export class PopupControl extends React.PureComponent {
   render() {
     const {

package/dist/esm/analytics.js

@@ -5,7 +5,7 @@ import { createAndFireEvent } from '@atlaskit/analytics-next';
 import { v4 as uuidv4 } from 'uuid';
 import { isCustom, isExternalUser } from './components/utils';
 var packageName = "@atlaskit/user-picker";
-var packageVersion = "10.12.5";
+var packageVersion = "10.12.7";
 var UUID_REGEXP_TEAMS_GROUPS = /^[a-fA-F0-9]{8}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{12}$/;
 var UUID_REGEXP_OLD_AAID = /^[a-fA-F0-9]{1,8}:[a-fA-F0-9]{8}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{12}$/;
 var UUID_REGEXP_NEW_AAID = /^[a-fA-F0-9]{24,24}$/;

package/dist/esm/components/BaseUserPicker.js

@@ -535,7 +535,9 @@ export var BaseUserPickerWithoutAnalytics = /*#__PURE__*/function (_React$Compon
         subtle: subtle,
         blurInputOnSelect: !isMulti,
         closeMenuOnSelect: !isMulti,
-        noOptionsMessage: showError ? loadOptionsErrorMessage : noOptionsMessage,
+        noOptionsMessage: showError ? loadOptionsErrorMessage : typeof noOptionsMessage === 'function' ? noOptionsMessage : function () {
+          return noOptionsMessage;
+        },
         footer: footer,
         openMenuOnFocus: true,
         isDisabled: isDisabled,

package/dist/esm/components/PopupControl.js

@@ -7,36 +7,28 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 /** @jsx jsx */
 import React from 'react';
-import { themed } from '@atlaskit/theme/components';
-import { gridSize } from '@atlaskit/theme/constants';
 import { components } from '@atlaskit/select';
 import { css, jsx } from '@emotion/react';
-import { N200, DN90 } from '@atlaskit/theme/colors';
-var spacing = gridSize();
+import { N200 } from '@atlaskit/theme/colors';
+var spacing = 8;
 var fontSize = 12;
 var innerHeight = spacing * 2; // 16px
 var lineHeight = innerHeight / fontSize;
 var controlWrapper = css({
   display: 'flex',
   flexDirection: 'column',
-  padding: "0px ".concat(spacing, "px ").concat(spacing, "px")
-});
-var getColor = themed({
-  light: "var(--ds-text-subtlest, ".concat(N200, ")"),
-  dark: "var(--ds-text-subtlest, ".concat(DN90, ")")
+  padding: "0px ".concat("var(--ds-space-100, 8px)", " ", "var(--ds-space-100, 8px)")
 });
 var getLabelStyle = function getLabelStyle() {
-  var right = 0;
-  var bottom = spacing / 2;
-  var left = 0;
-  var top = spacing * 2.5;
-  var color = getColor();
   return css({
-    color: color,
+    color: "var(--ds-text-subtlest, ".concat(N200, ")"),
     fontSize: "".concat(fontSize, "px"),
     fontWeight: 600,
     lineHeight: "".concat(lineHeight),
-    padding: "".concat(top, "px ").concat(right, "px ").concat(bottom, "px ").concat(left, "px")
+    paddingBottom: "var(--ds-space-050, 4px)",
+    paddingLeft: "var(--ds-space-0, 0px)",
+    paddingRight: "var(--ds-space-0, 0px)",
+    paddingTop: "var(--ds-space-250, 20px)"
   });
 };
 export var PopupControl = /*#__PURE__*/function (_React$PureComponent) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/user-picker",
-  "version": "10.12.5",
+  "version": "10.12.7",
   "description": "Fabric component for display a dropdown to select a user from",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"