@atlaskit/react-select 2.4.9 → 2.4.10

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,13 @@
1
1
  # @atlaskit/react-select
2
2
 
3
+ ## 2.4.10
4
+
5
+ ### Patch Changes
6
+
7
+ - [#157159](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/157159)
8
+ [`8da004db78761`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8da004db78761) -
9
+ Migrate menuPortal inline styles to compiled styles
10
+
3
11
  ## 2.4.9
4
12
 
5
13
  ### Patch Changes
@@ -1,9 +1,13 @@
1
1
 
2
- ._2rkoglpi{border-radius:var(--ds-border-radius,4px)}._154i1osq{top:100%}
2
+ ._2rkoglpi{border-radius:var(--ds-border-radius,4px)}._154i1nmo{top:var(--menu-top)}
3
+ ._154i1osq{top:100%}
3
4
  ._16qsd0yg{box-shadow:var(--ds-shadow-overlay,0 0 0 1px rgba(0,0,0,.1),0 4px 11px rgba(0,0,0,.1))}
4
5
  ._18m91wug{overflow-y:auto}
5
6
  ._19pku2gc{margin-top:var(--ds-space-100,8px)}
6
7
  ._1bsb1osq{width:100%}
8
+ ._1bsb1qxj{width:var(--menu-width)}
9
+ ._1ltva1vk{left:var(--menu-left)}
10
+ ._1pbydx66{z-index:9999}
7
11
  ._1pbykb7n{z-index:1}
8
12
  ._1q51u2gc{padding-block-start:var(--ds-space-100,8px)}
9
13
  ._85i5u2gc{padding-block-end:var(--ds-space-100,8px)}
@@ -11,6 +15,7 @@
11
15
  ._94n51osq{bottom:100%}
12
16
  ._bfhk1bhr{background-color:var(--ds-surface-overlay,#fff)}
13
17
  ._bozgutpp{padding-inline-start:var(--ds-space-150,9pt)}
18
+ ._kqswcp1v{position:var(--menu-position)}
14
19
  ._kqswh2mm{position:relative}
15
20
  ._kqswstnw{position:absolute}
16
21
  ._otyru2gc{margin-bottom:var(--ds-space-100,8px)}
@@ -397,6 +397,9 @@ var LoadingMessage = exports.LoadingMessage = function LoadingMessage(_ref4) {
397
397
  var menuPortalCSS = exports.menuPortalCSS = function menuPortalCSS() {
398
398
  return {};
399
399
  };
400
+ var menuPortalStyles = {
401
+ root: "_1pbydx66 _1ltva1vk _kqswcp1v _154i1nmo _1bsb1qxj"
402
+ };
400
403
  // eslint-disable-next-line @repo/internal/react/require-jsdoc
401
404
  var MenuPortal = exports.MenuPortal = function MenuPortal(props) {
402
405
  var appendTo = props.appendTo,
@@ -474,15 +477,14 @@ var MenuPortal = exports.MenuPortal = function MenuPortal(props) {
474
477
  // same wrapper element whether fixed or portalled
475
478
  var menuWrapper = /*#__PURE__*/React.createElement("div", (0, _extends2.default)({
476
479
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/ui-styling-standard/local-cx-xcss, @compiled/local-cx-xcss
477
- className: (0, _react2.cx)(className, xcss, '-MenuPortal'),
480
+ className: (0, _runtime.ax)([menuPortalStyles.root, (0, _react2.cx)(className, xcss, '-MenuPortal')]),
478
481
  ref: setMenuPortalElement,
479
482
  style: _objectSpread({
480
483
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
481
- zIndex: 9999,
482
- left: computedPosition.rect.left,
483
- position: menuPosition,
484
- top: computedPosition.offset,
485
- width: computedPosition.rect.width
484
+ '--menu-left': "".concat(computedPosition.rect.left, "px"),
485
+ '--menu-position': menuPosition,
486
+ '--menu-top': "".concat(computedPosition.offset, "px"),
487
+ '--menu-width': "".concat(computedPosition.rect.width, "px")
486
488
  }, css)
487
489
  }, innerProps), children);
488
490
  return /*#__PURE__*/React.createElement(PortalPlacementContext.Provider, {
@@ -1,9 +1,13 @@
1
1
 
2
- ._2rkoglpi{border-radius:var(--ds-border-radius,4px)}._154i1osq{top:100%}
2
+ ._2rkoglpi{border-radius:var(--ds-border-radius,4px)}._154i1nmo{top:var(--menu-top)}
3
+ ._154i1osq{top:100%}
3
4
  ._16qsd0yg{box-shadow:var(--ds-shadow-overlay,0 0 0 1px rgba(0,0,0,.1),0 4px 11px rgba(0,0,0,.1))}
4
5
  ._18m91wug{overflow-y:auto}
5
6
  ._19pku2gc{margin-top:var(--ds-space-100,8px)}
6
7
  ._1bsb1osq{width:100%}
8
+ ._1bsb1qxj{width:var(--menu-width)}
9
+ ._1ltva1vk{left:var(--menu-left)}
10
+ ._1pbydx66{z-index:9999}
7
11
  ._1pbykb7n{z-index:1}
8
12
  ._1q51u2gc{padding-block-start:var(--ds-space-100,8px)}
9
13
  ._85i5u2gc{padding-block-end:var(--ds-space-100,8px)}
@@ -11,6 +15,7 @@
11
15
  ._94n51osq{bottom:100%}
12
16
  ._bfhk1bhr{background-color:var(--ds-surface-overlay,#fff)}
13
17
  ._bozgutpp{padding-inline-start:var(--ds-space-150,9pt)}
18
+ ._kqswcp1v{position:var(--menu-position)}
14
19
  ._kqswh2mm{position:relative}
15
20
  ._kqswstnw{position:absolute}
16
21
  ._otyru2gc{margin-bottom:var(--ds-space-100,8px)}
@@ -386,6 +386,9 @@ export const LoadingMessage = ({
386
386
  // ==============================
387
387
 
388
388
  export const menuPortalCSS = () => ({});
389
+ const menuPortalStyles = {
390
+ root: "_1pbydx66 _1ltva1vk _kqswcp1v _154i1nmo _1bsb1qxj"
391
+ };
389
392
  // eslint-disable-next-line @repo/internal/react/require-jsdoc
390
393
  export const MenuPortal = props => {
391
394
  const {
@@ -459,15 +462,14 @@ export const MenuPortal = props => {
459
462
  // same wrapper element whether fixed or portalled
460
463
  const menuWrapper = /*#__PURE__*/React.createElement("div", _extends({
461
464
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/ui-styling-standard/local-cx-xcss, @compiled/local-cx-xcss
462
- className: cx(className, xcss, '-MenuPortal'),
465
+ className: ax([menuPortalStyles.root, cx(className, xcss, '-MenuPortal')]),
463
466
  ref: setMenuPortalElement,
464
467
  style: {
465
468
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
466
- zIndex: 9999,
467
- left: computedPosition.rect.left,
468
- position: menuPosition,
469
- top: computedPosition.offset,
470
- width: computedPosition.rect.width,
469
+ '--menu-left': `${computedPosition.rect.left}px`,
470
+ '--menu-position': menuPosition,
471
+ '--menu-top': `${computedPosition.offset}px`,
472
+ '--menu-width': `${computedPosition.rect.width}px`,
471
473
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
472
474
  ...css
473
475
  }
@@ -1,9 +1,13 @@
1
1
 
2
- ._2rkoglpi{border-radius:var(--ds-border-radius,4px)}._154i1osq{top:100%}
2
+ ._2rkoglpi{border-radius:var(--ds-border-radius,4px)}._154i1nmo{top:var(--menu-top)}
3
+ ._154i1osq{top:100%}
3
4
  ._16qsd0yg{box-shadow:var(--ds-shadow-overlay,0 0 0 1px rgba(0,0,0,.1),0 4px 11px rgba(0,0,0,.1))}
4
5
  ._18m91wug{overflow-y:auto}
5
6
  ._19pku2gc{margin-top:var(--ds-space-100,8px)}
6
7
  ._1bsb1osq{width:100%}
8
+ ._1bsb1qxj{width:var(--menu-width)}
9
+ ._1ltva1vk{left:var(--menu-left)}
10
+ ._1pbydx66{z-index:9999}
7
11
  ._1pbykb7n{z-index:1}
8
12
  ._1q51u2gc{padding-block-start:var(--ds-space-100,8px)}
9
13
  ._85i5u2gc{padding-block-end:var(--ds-space-100,8px)}
@@ -11,6 +15,7 @@
11
15
  ._94n51osq{bottom:100%}
12
16
  ._bfhk1bhr{background-color:var(--ds-surface-overlay,#fff)}
13
17
  ._bozgutpp{padding-inline-start:var(--ds-space-150,9pt)}
18
+ ._kqswcp1v{position:var(--menu-position)}
14
19
  ._kqswh2mm{position:relative}
15
20
  ._kqswstnw{position:absolute}
16
21
  ._otyru2gc{margin-bottom:var(--ds-space-100,8px)}
@@ -391,6 +391,9 @@ export var LoadingMessage = function LoadingMessage(_ref4) {
391
391
  export var menuPortalCSS = function menuPortalCSS() {
392
392
  return {};
393
393
  };
394
+ var menuPortalStyles = {
395
+ root: "_1pbydx66 _1ltva1vk _kqswcp1v _154i1nmo _1bsb1qxj"
396
+ };
394
397
  // eslint-disable-next-line @repo/internal/react/require-jsdoc
395
398
  export var MenuPortal = function MenuPortal(props) {
396
399
  var appendTo = props.appendTo,
@@ -468,15 +471,14 @@ export var MenuPortal = function MenuPortal(props) {
468
471
  // same wrapper element whether fixed or portalled
469
472
  var menuWrapper = /*#__PURE__*/React.createElement("div", _extends({
470
473
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/ui-styling-standard/local-cx-xcss, @compiled/local-cx-xcss
471
- className: cx(className, xcss, '-MenuPortal'),
474
+ className: ax([menuPortalStyles.root, cx(className, xcss, '-MenuPortal')]),
472
475
  ref: setMenuPortalElement,
473
476
  style: _objectSpread({
474
477
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
475
- zIndex: 9999,
476
- left: computedPosition.rect.left,
477
- position: menuPosition,
478
- top: computedPosition.offset,
479
- width: computedPosition.rect.width
478
+ '--menu-left': "".concat(computedPosition.rect.left, "px"),
479
+ '--menu-position': menuPosition,
480
+ '--menu-top': "".concat(computedPosition.offset, "px"),
481
+ '--menu-width': "".concat(computedPosition.rect.width, "px")
480
482
  }, css)
481
483
  }, innerProps), children);
482
484
  return /*#__PURE__*/React.createElement(PortalPlacementContext.Provider, {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/react-select",
3
- "version": "2.4.9",
3
+ "version": "2.4.10",
4
4
  "description": "A forked version of react-select to only be used in atlaskit/select",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",