@atlaskit/user-picker 9.3.3 → 9.3.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @atlaskit/user-picker
2
2
 
3
+ ## 9.3.4
4
+
5
+ ### Patch Changes
6
+
7
+ - [`dbff164b600`](https://bitbucket.org/atlassian/atlassian-frontend/commits/dbff164b600) - [ux] Fix for appearance=compact not being applied correctly to user pickers
8
+
3
9
  ## 9.3.3
4
10
 
5
11
  ### Patch Changes
@@ -125,7 +125,7 @@ var UserPickerWithoutAnalytics = /*#__PURE__*/function (_React$Component) {
125
125
  }, /*#__PURE__*/_react.default.createElement(_BaseUserPicker.BaseUserPickerWithoutAnalytics, (0, _extends2.default)({}, this.props, {
126
126
  width: width,
127
127
  SelectComponent: SelectComponent,
128
- styles: (0, _styles.getStyles)(width, isMulti, this.props.styles),
128
+ styles: (0, _styles.getStyles)(width, isMulti, this.props.appearance === 'compact', this.props.styles),
129
129
  components: (0, _components.getComponents)(isMulti, anchor),
130
130
  pickerProps: pickerProps
131
131
  })))));
@@ -39,7 +39,7 @@ var INDICATOR_WIDTH = 39;
39
39
  exports.INDICATOR_WIDTH = INDICATOR_WIDTH;
40
40
  var TOTAL_PADDING_TAG_TO_CONTAINER = 10;
41
41
  var TAG_MARGIN_WIDTH = 4;
42
- var getStyles = (0, _memoizeOne.default)(function (width, isMulti, overrideStyles) {
42
+ var getStyles = (0, _memoizeOne.default)(function (width, isMulti, isCompact, overrideStyles) {
43
43
  var styles = {
44
44
  menu: function menu(css, state) {
45
45
  return _objectSpread(_objectSpread({}, css), {}, {
@@ -48,7 +48,6 @@ var getStyles = (0, _memoizeOne.default)(function (width, isMulti, overrideStyle
48
48
  });
49
49
  },
50
50
  control: function control(css, state) {
51
- var isCompact = state.selectProps.appearance === 'compact';
52
51
  var isMulti = state.selectProps.isMulti;
53
52
  return _objectSpread(_objectSpread({}, css), {}, {
54
53
  width: width,
@@ -96,7 +95,6 @@ var getStyles = (0, _memoizeOne.default)(function (width, isMulti, overrideStyle
96
95
  paddingBottom = _ref2.paddingBottom,
97
96
  position = _ref2.position,
98
97
  css = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
99
- var isCompact = state.selectProps.appearance === 'compact';
100
98
  var isMulti = state.selectProps.isMulti;
101
99
  return _objectSpread(_objectSpread({}, css), {}, {
102
100
  paddingTop: isCompact ? 0 : TOTAL_PADDING_TAG_TO_CONTAINER - TAG_MARGIN_WIDTH,
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/user-picker",
3
- "version": "9.3.3",
3
+ "version": "9.3.4",
4
4
  "sideEffects": false
5
5
  }
@@ -66,7 +66,7 @@ export class UserPickerWithoutAnalytics extends React.Component {
66
66
  }, /*#__PURE__*/React.createElement(BaseUserPickerWithoutAnalytics, _extends({}, this.props, {
67
67
  width: width,
68
68
  SelectComponent: SelectComponent,
69
- styles: getStyles(width, isMulti, this.props.styles),
69
+ styles: getStyles(width, isMulti, this.props.appearance === 'compact', this.props.styles),
70
70
  components: getComponents(isMulti, anchor),
71
71
  pickerProps: pickerProps
72
72
  })))));
@@ -9,14 +9,13 @@ export const AVATAR_PADDING = 6;
9
9
  export const INDICATOR_WIDTH = 39;
10
10
  const TOTAL_PADDING_TAG_TO_CONTAINER = 10;
11
11
  const TAG_MARGIN_WIDTH = 4;
12
- export const getStyles = memoizeOne((width, isMulti, overrideStyles) => {
12
+ export const getStyles = memoizeOne((width, isMulti, isCompact, overrideStyles) => {
13
13
  let styles = {
14
14
  menu: (css, state) => ({ ...css,
15
15
  width,
16
16
  minWidth: state.selectProps.menuMinWidth
17
17
  }),
18
18
  control: (css, state) => {
19
- const isCompact = state.selectProps.appearance === 'compact';
20
19
  const isMulti = state.selectProps.isMulti;
21
20
  return { ...css,
22
21
  width,
@@ -62,7 +61,6 @@ export const getStyles = memoizeOne((width, isMulti, overrideStyles) => {
62
61
  position,
63
62
  ...css
64
63
  }, state) => {
65
- const isCompact = state.selectProps.appearance === 'compact';
66
64
  const isMulti = state.selectProps.isMulti;
67
65
  return { ...css,
68
66
  paddingTop: isCompact ? 0 : TOTAL_PADDING_TAG_TO_CONTAINER - TAG_MARGIN_WIDTH,
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/user-picker",
3
- "version": "9.3.3",
3
+ "version": "9.3.4",
4
4
  "sideEffects": false
5
5
  }
@@ -89,7 +89,7 @@ export var UserPickerWithoutAnalytics = /*#__PURE__*/function (_React$Component)
89
89
  }, /*#__PURE__*/React.createElement(BaseUserPickerWithoutAnalytics, _extends({}, this.props, {
90
90
  width: width,
91
91
  SelectComponent: SelectComponent,
92
- styles: getStyles(width, isMulti, this.props.styles),
92
+ styles: getStyles(width, isMulti, this.props.appearance === 'compact', this.props.styles),
93
93
  components: getComponents(isMulti, anchor),
94
94
  pickerProps: pickerProps
95
95
  })))));
@@ -19,7 +19,7 @@ export var AVATAR_PADDING = 6;
19
19
  export var INDICATOR_WIDTH = 39;
20
20
  var TOTAL_PADDING_TAG_TO_CONTAINER = 10;
21
21
  var TAG_MARGIN_WIDTH = 4;
22
- export var getStyles = memoizeOne(function (width, isMulti, overrideStyles) {
22
+ export var getStyles = memoizeOne(function (width, isMulti, isCompact, overrideStyles) {
23
23
  var styles = {
24
24
  menu: function menu(css, state) {
25
25
  return _objectSpread(_objectSpread({}, css), {}, {
@@ -28,7 +28,6 @@ export var getStyles = memoizeOne(function (width, isMulti, overrideStyles) {
28
28
  });
29
29
  },
30
30
  control: function control(css, state) {
31
- var isCompact = state.selectProps.appearance === 'compact';
32
31
  var isMulti = state.selectProps.isMulti;
33
32
  return _objectSpread(_objectSpread({}, css), {}, {
34
33
  width: width,
@@ -78,7 +77,6 @@ export var getStyles = memoizeOne(function (width, isMulti, overrideStyles) {
78
77
  position = _ref2.position,
79
78
  css = _objectWithoutProperties(_ref2, _excluded2);
80
79
 
81
- var isCompact = state.selectProps.appearance === 'compact';
82
80
  var isMulti = state.selectProps.isMulti;
83
81
  return _objectSpread(_objectSpread({}, css), {}, {
84
82
  paddingTop: isCompact ? 0 : TOTAL_PADDING_TAG_TO_CONTAINER - TAG_MARGIN_WIDTH,
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/user-picker",
3
- "version": "9.3.3",
3
+ "version": "9.3.4",
4
4
  "sideEffects": false
5
5
  }
@@ -1,7 +1,7 @@
1
1
  export declare const BORDER_PADDING = 6;
2
2
  export declare const AVATAR_PADDING = 6;
3
3
  export declare const INDICATOR_WIDTH = 39;
4
- export declare const getStyles: import("memoize-one").MemoizedFn<(width: string | number, isMulti?: boolean | undefined, overrideStyles?: Partial<import("react-select").Styles<import("@atlaskit/select").OptionType, false, import("@atlaskit/select").GroupType<import("@atlaskit/select").OptionType>>> | undefined) => Partial<import("react-select").Styles<import("@atlaskit/select").OptionType, false, import("@atlaskit/select").GroupType<import("@atlaskit/select").OptionType>>> | {
4
+ export declare const getStyles: import("memoize-one").MemoizedFn<(width: string | number, isMulti?: boolean | undefined, isCompact?: boolean | undefined, overrideStyles?: Partial<import("react-select").Styles<import("@atlaskit/select").OptionType, false, import("@atlaskit/select").GroupType<import("@atlaskit/select").OptionType>>> | undefined) => Partial<import("react-select").Styles<import("@atlaskit/select").OptionType, false, import("@atlaskit/select").GroupType<import("@atlaskit/select").OptionType>>> | {
5
5
  menu: (css: any, state: any) => any;
6
6
  control: (css: any, state: any) => any;
7
7
  clearIndicator: ({ paddingTop, paddingBottom, paddingLeft, paddingRight, ...css }: any) => any;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/user-picker",
3
- "version": "9.3.3",
3
+ "version": "9.3.4",
4
4
  "description": "Fabric component for display a dropdown to select a user from",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"