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]>

Author: jluxenberg

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
 

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",

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'

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'

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'

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'

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'

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'

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'

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'