chore: update Ref dependency to latest version (#4023)

* chore(MountNode|Sidebar): update Ref dependency to latest version The @stardust-ui/{react-component-event-listener, react-component-ref} components have been moved to @fluentui/{react-component-event-listener, react-component-ref}. Change dependency so that the new packages are used, and upgrade to their latest versions. One wrinkle: `toRefObject()` was removed from `react-component-ref` (see microsoft/fluent-ui-react#2287). I've rewritten the code that depended on this function. * fix import * Update package.json * fix yarn.lock Co-authored-by: Oleksandr Fediashov <[email protected]>
Semantic-Org · Aug 17, 2020 · bf87dd2 · bf87dd2
1 parent 4dba2f1
commit bf87dd2
Show file tree

Hide file tree

Showing 22 changed files with 44 additions and 46 deletions.
diff --git a/index.d.ts b/index.d.ts
@@ -1,6 +1,6 @@
 // Third party
 
-export { Ref, RefProps } from '@stardust-ui/react-component-ref'
+export { Ref, RefProps } from '@fluentui/react-component-ref'
 
 // Addons
 

diff --git a/package.json b/package.json
@@ -68,9 +68,9 @@
  "homepage": "https://github.com/Semantic-Org/Semantic-UI-React#readme",
  "dependencies": {
  "@babel/runtime": "^7.10.5",
+ "@fluentui/react-component-event-listener": "~0.51.0",
+ "@fluentui/react-component-ref": "~0.51.0",
  "@semantic-ui-react/event-stack": "^3.1.0",
- "@stardust-ui/react-component-event-listener": "~0.38.0",
- "@stardust-ui/react-component-ref": "~0.38.0",
  "clsx": "^1.1.1",
  "keyboard-key": "^1.1.0",
  "lodash": "^4.17.19",

diff --git a/src/addons/Portal/Portal.js b/src/addons/Portal/Portal.js
@@ -1,5 +1,5 @@
 import EventStack from '@semantic-ui-react/event-stack'
-import { handleRef, Ref } from '@stardust-ui/react-component-ref'
+import { handleRef, Ref } from '@fluentui/react-component-ref'
 import keyboardKey from 'keyboard-key'
 import _ from 'lodash'
 import PropTypes from 'prop-types'

diff --git a/src/addons/Portal/PortalInner.js b/src/addons/Portal/PortalInner.js
@@ -1,4 +1,4 @@
-import { handleRef, Ref } from '@stardust-ui/react-component-ref'
+import { handleRef, Ref } from '@fluentui/react-component-ref'
 import _ from 'lodash'
 import PropTypes from 'prop-types'
 import React, { Component } from 'react'

diff --git a/src/addons/TextArea/TextArea.js b/src/addons/TextArea/TextArea.js
@@ -1,4 +1,4 @@
-import { Ref } from '@stardust-ui/react-component-ref'
+import { Ref } from '@fluentui/react-component-ref'
 import _ from 'lodash'
 import PropTypes from 'prop-types'
 import React, { Component, createRef } from 'react'

diff --git a/src/behaviors/Visibility/Visibility.js b/src/behaviors/Visibility/Visibility.js
@@ -1,4 +1,4 @@
-import { Ref } from '@stardust-ui/react-component-ref'
+import { Ref } from '@fluentui/react-component-ref'
 import _ from 'lodash'
 import PropTypes from 'prop-types'
 import React, { Component, createRef } from 'react'

diff --git a/src/elements/Button/Button.js b/src/elements/Button/Button.js
@@ -1,4 +1,4 @@
-import { Ref } from '@stardust-ui/react-component-ref'
+import { Ref } from '@fluentui/react-component-ref'
 import cx from 'clsx'
 import _ from 'lodash'
 import PropTypes from 'prop-types'

diff --git a/src/elements/Input/Input.js b/src/elements/Input/Input.js
@@ -1,4 +1,4 @@
-import { handleRef } from '@stardust-ui/react-component-ref'
+import { handleRef } from '@fluentui/react-component-ref'
 import cx from 'clsx'
 import _ from 'lodash'
 import PropTypes from 'prop-types'

diff --git a/src/index.js b/src/index.js
@@ -1,5 +1,5 @@
 // Third party
-export { Ref } from '@stardust-ui/react-component-ref'
+export { Ref } from '@fluentui/react-component-ref'
 
 // Addons
 export Confirm from './addons/Confirm'

diff --git a/src/lib/hooks/useClassNamesOnNode.js b/src/lib/hooks/useClassNamesOnNode.js
@@ -1,5 +1,5 @@
+import { isRefObject } from '@fluentui/react-component-ref'
 import React from 'react'
-import { isRefObject } from '@stardust-ui/react-component-ref'
 
 import useIsomorphicLayoutEffect from './useIsomorphicLayoutEffect'
 

diff --git a/src/modules/Checkbox/Checkbox.js b/src/modules/Checkbox/Checkbox.js
@@ -1,4 +1,4 @@
-import { Ref } from '@stardust-ui/react-component-ref'
+import { Ref } from '@fluentui/react-component-ref'
 import cx from 'clsx'
 import _ from 'lodash'
 import PropTypes from 'prop-types'

diff --git a/src/modules/Dimmer/DimmerInner.js b/src/modules/Dimmer/DimmerInner.js
@@ -1,4 +1,4 @@
-import { Ref } from '@stardust-ui/react-component-ref'
+import { Ref } from '@fluentui/react-component-ref'
 import cx from 'clsx'
 import _ from 'lodash'
 import PropTypes from 'prop-types'

diff --git a/src/modules/Dropdown/Dropdown.js b/src/modules/Dropdown/Dropdown.js
@@ -1,5 +1,5 @@
 import EventStack from '@semantic-ui-react/event-stack'
-import { Ref } from '@stardust-ui/react-component-ref'
+import { Ref } from '@fluentui/react-component-ref'
 import cx from 'clsx'
 import keyboardKey from 'keyboard-key'
 import _ from 'lodash'

diff --git a/src/modules/Modal/Modal.js b/src/modules/Modal/Modal.js
@@ -1,4 +1,4 @@
-import { Ref } from '@stardust-ui/react-component-ref'
+import { Ref } from '@fluentui/react-component-ref'
 import cx from 'clsx'
 import _ from 'lodash'
 import PropTypes from 'prop-types'

diff --git a/src/modules/Modal/ModalDimmer.js b/src/modules/Modal/ModalDimmer.js
@@ -1,4 +1,4 @@
-import { Ref } from '@stardust-ui/react-component-ref'
+import { Ref } from '@fluentui/react-component-ref'
 import cx from 'clsx'
 import PropTypes from 'prop-types'
 import React from 'react'

diff --git a/src/modules/Popup/Popup.js b/src/modules/Popup/Popup.js
@@ -1,5 +1,5 @@
 import EventStack from '@semantic-ui-react/event-stack'
-import { Ref } from '@stardust-ui/react-component-ref'
+import { Ref } from '@fluentui/react-component-ref'
 import cx from 'clsx'
 import _ from 'lodash'
 import PropTypes from 'prop-types'

diff --git a/src/modules/Popup/lib/createReferenceProxy.js b/src/modules/Popup/lib/createReferenceProxy.js
@@ -1,4 +1,4 @@
-import { isRefObject, toRefObject } from '@stardust-ui/react-component-ref'
+import { isRefObject, toRefObject } from '@fluentui/react-component-ref'
 import _ from 'lodash'
 
 class ReferenceProxy {

diff --git a/src/modules/Sidebar/Sidebar.js b/src/modules/Sidebar/Sidebar.js
@@ -1,5 +1,5 @@
-import { EventListener, documentRef } from '@stardust-ui/react-component-event-listener'
-import { isRefObject, toRefObject, Ref } from '@stardust-ui/react-component-ref'
+import { EventListener, documentRef } from '@fluentui/react-component-event-listener'
+import { Ref, isRefObject } from '@fluentui/react-component-ref'
 import cx from 'clsx'
 import _ from 'lodash'
 import PropTypes from 'prop-types'
@@ -106,14 +106,14 @@ class Sidebar extends Component {
  )
  const rest = getUnhandledProps(Sidebar, this.props)
  const ElementType = getElementType(Sidebar, this.props)
- const targetRef = isRefObject(target) ? target : toRefObject(target)
+ const targetProp = isRefObject(target) ? { targetRef: target } : { target }
 
  return (
  <Ref innerRef={this.ref}>
  <ElementType {...rest} className={classes}>
  {childrenUtils.isNil(children) ? content : children}
  {visible && (
- <EventListener listener={this.handleDocumentClick} targetRef={targetRef} type='click' />
+ <EventListener listener={this.handleDocumentClick} type='click' {...targetProp} />
  )}
  </ElementType>
  </Ref>

diff --git a/src/modules/Sticky/Sticky.js b/src/modules/Sticky/Sticky.js
@@ -1,4 +1,4 @@
-import { isRefObject } from '@stardust-ui/react-component-ref'
+import { isRefObject } from '@fluentui/react-component-ref'
 import cx from 'clsx'
 import _ from 'lodash'
 import PropTypes from 'prop-types'

diff --git a/test/specs/modules/Sidebar/Sidebar-test.js b/test/specs/modules/Sidebar/Sidebar-test.js
@@ -137,7 +137,7 @@ describe('Sidebar', () => {
  const wrapper = shallow(<Sidebar target={target} visible />)
  const listener = wrapper.find('EventListener')
 
- listener.should.have.prop('targetRef').that.eql({ current: target })
+ listener.should.have.prop('target').that.eql(target)
  })
  })
 })
diff --git a/test/utils/nestedShallow.js b/test/utils/nestedShallow.js
@@ -1,4 +1,4 @@
-import { Ref } from '@stardust-ui/react-component-ref'
+import { Ref } from '@fluentui/react-component-ref'
 import enzyme from 'enzyme'
 import _ from 'lodash'
 

diff --git a/yarn.lock b/yarn.lock
@@ -969,10 +969,10 @@
  core-js-pure "^3.0.0"
  regenerator-runtime "^0.13.4"
 
-"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.10.2", "@babel/runtime@^7.10.5", "@babel/runtime@^7.4.5", "@babel/runtime@^7.8.4":
- version "7.10.5"
- resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.10.5.tgz#303d8bd440ecd5a491eae6117fd3367698674c5c"
- integrity sha512-otddXKhdNn7d0ptoFRHtMLa8LqDxLYwTjB4nYgM1yy5N6gU/MUf8zqyyLltCH3yAVitBzmwK4us+DD0l/MauAg==
+"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.10.2", "@babel/runtime@^7.10.4", "@babel/runtime@^7.10.5", "@babel/runtime@^7.4.5", "@babel/runtime@^7.8.4":
+ version "7.11.2"
+ resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.11.2.tgz#f549c13c754cc40b87644b9fa9f09a6a95fe0736"
+ integrity sha512-TeWkU52so0mPtDcaCTxNBI/IHiz0pZgr8VEFqXFtZWpYD08ZB6FaSwVAS8MKRQAP3bYKiVjwysOJgMFY28o6Tw==
  dependencies:
  regenerator-runtime "^0.13.4"
 
@@ -1049,6 +1049,21 @@
  lodash "^4.17.19"
  to-fast-properties "^2.0.0"
 
+"@fluentui/react-component-event-listener@~0.51.0":
+ version "0.51.0"
+ resolved "https://registry.yarnpkg.com/@fluentui/react-component-event-listener/-/react-component-event-listener-0.51.0.tgz#29701f875a37870e168b99b0198d3518866a7f84"
+ integrity sha512-YzvtrqSOQIr19V5hLQ71Zt2HnBpHsPbgE6YNRI0fYkld1YbZWggiPSpk6nhmjB5U30h3EqwZzvsuQTvHbuP2Iw==
+ dependencies:
+ "@babel/runtime" "^7.10.4"
+
+"@fluentui/react-component-ref@~0.51.0":
+ version "0.51.0"
+ resolved "https://registry.yarnpkg.com/@fluentui/react-component-ref/-/react-component-ref-0.51.0.tgz#e27e50e36a7d96586bc814c16bd84f9da53b3029"
+ integrity sha512-eYTiZCGmcsU1RuKeHepd8i6XksnroSF5b2lqHJaQO9x+Ec62d7+M2i9FW/nhe2Mpb5f96inL0Oz3zzVMrSwJdw==
+ dependencies:
+ "@babel/runtime" "^7.10.4"
+ react-is "^16.6.3"
+
 "@istanbuljs/load-nyc-config@^1.0.0":
  version "1.1.0"
  resolved "https://registry.yarnpkg.com/@istanbuljs/load-nyc-config/-/load-nyc-config-1.1.0.tgz#fd3db1d59ecf7cf121e80650bb86712f9b55eced"
@@ -1176,23 +1191,6 @@
  dependencies:
  semver "7.3.2"
 
-"@stardust-ui/react-component-event-listener@~0.38.0":
- version "0.38.0"
- resolved "https://registry.yarnpkg.com/@stardust-ui/react-component-event-listener/-/react-component-event-listener-0.38.0.tgz#1787faded94b40ad41226e6289baf13e701c6e7f"
- integrity sha512-sIP/e0dyOrrlb8K7KWumfMxj/gAifswTBC4o68Aa+C/GA73ccRp/6W1VlHvF/dlOR4KLsA+5SKnhjH36xzPsWg==
- dependencies:
- "@babel/runtime" "^7.1.2"
- prop-types "^15.7.2"
-
-"@stardust-ui/react-component-ref@~0.38.0":
- version "0.38.0"
- resolved "https://registry.yarnpkg.com/@stardust-ui/react-component-ref/-/react-component-ref-0.38.0.tgz#52d555f2d5edd213c923c93a106f7de940e427ef"
- integrity sha512-xjs6WnvJVueSIXMWw0C3oWIgAPpcD03qw43oGOjUXqFktvpNkB73JoKIhS4sCrtQxBdct75qqr4ZL6JiyPcESw==
- dependencies:
- "@babel/runtime" "^7.1.2"
- prop-types "^15.7.2"
- react-is "^16.6.3"
-
 "@textlint/ast-node-types@^4.0.3":
  version "4.2.1"
  resolved "https://registry.yarnpkg.com/@textlint/ast-node-types/-/ast-node-types-4.2.1.tgz#978fa10e23468114462fc08ef29f96980c12a8ef"