diff --git a/src/lib/index.js b/src/lib/index.js
index a405193eb8..37c752b326 100644
--- a/src/lib/index.js
+++ b/src/lib/index.js
@@ -5,12 +5,19 @@ export * as childrenUtils from './childrenUtils'
 
 export {
   useKeyOnly,
+  getKeyOnly,
   useKeyOrValueAndKey,
+  getKeyOrValueAndKey,
   useValueAndKey,
+  getValueAndKey,
   useMultipleProp,
+  getMultipleProp,
   useTextAlignProp,
+  getTextAlignProp,
   useVerticalAlignProp,
+  getVerticalAlignProp,
   useWidthProp,
+  getWidthProp,
 } from './classNameBuilders'
 
 export * as customPropTypes from './customPropTypes'
diff --git a/src/modules/Accordion/Accordion.js b/src/modules/Accordion/Accordion.js
index ab6bdd220c..14707993ca 100644
--- a/src/modules/Accordion/Accordion.js
+++ b/src/modules/Accordion/Accordion.js
@@ -2,7 +2,7 @@ import cx from 'clsx'
 import PropTypes from 'prop-types'
 import * as React from 'react'
 
-import { getUnhandledProps, useKeyOnly } from '../../lib'
+import { getUnhandledProps, getKeyOnly } from '../../lib'
 import AccordionAccordion from './AccordionAccordion'
 import AccordionContent from './AccordionContent'
 import AccordionPanel from './AccordionPanel'
@@ -16,9 +16,9 @@ const Accordion = React.forwardRef(function (props, ref) {
 
   const classes = cx(
     'ui',
-    useKeyOnly(fluid, 'fluid'),
-    useKeyOnly(inverted, 'inverted'),
-    useKeyOnly(styled, 'styled'),
+    getKeyOnly(fluid, 'fluid'),
+    getKeyOnly(inverted, 'inverted'),
+    getKeyOnly(styled, 'styled'),
     className,
   )
   const rest = getUnhandledProps(Accordion, props)
diff --git a/src/modules/Accordion/AccordionContent.js b/src/modules/Accordion/AccordionContent.js
index 9ab53498f6..cd45c642df 100644
--- a/src/modules/Accordion/AccordionContent.js
+++ b/src/modules/Accordion/AccordionContent.js
@@ -8,7 +8,7 @@ import {
   customPropTypes,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
+  getKeyOnly,
 } from '../../lib'
 
 /**
@@ -17,7 +17,7 @@ import {
 const AccordionContent = React.forwardRef(function (props, ref) {
   const { active, children, className, content } = props
 
-  const classes = cx('content', useKeyOnly(active, 'active'), className)
+  const classes = cx('content', getKeyOnly(active, 'active'), className)
   const rest = getUnhandledProps(AccordionContent, props)
   const ElementType = getComponentType(props)
 
diff --git a/src/modules/Accordion/AccordionTitle.js b/src/modules/Accordion/AccordionTitle.js
index 34405b861e..3088f94cee 100644
--- a/src/modules/Accordion/AccordionTitle.js
+++ b/src/modules/Accordion/AccordionTitle.js
@@ -9,7 +9,7 @@ import {
   customPropTypes,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
+  getKeyOnly,
   useEventCallback,
 } from '../../lib'
 import Icon from '../../elements/Icon'
@@ -20,7 +20,7 @@ import Icon from '../../elements/Icon'
 const AccordionTitle = React.forwardRef(function (props, ref) {
   const { active, children, className, content, icon } = props
 
-  const classes = cx(useKeyOnly(active, 'active'), 'title', className)
+  const classes = cx(getKeyOnly(active, 'active'), 'title', className)
   const rest = getUnhandledProps(AccordionTitle, props)
   const ElementType = getComponentType(props)
   const iconValue = _.isNil(icon) ? 'dropdown' : icon
diff --git a/src/modules/Checkbox/Checkbox.js b/src/modules/Checkbox/Checkbox.js
index d183f01feb..a6e62d09e1 100644
--- a/src/modules/Checkbox/Checkbox.js
+++ b/src/modules/Checkbox/Checkbox.js
@@ -11,7 +11,7 @@ import {
   htmlInputAttrs,
   makeDebugger,
   partitionHTMLProps,
-  useKeyOnly,
+  getKeyOnly,
   useAutoControlledValue,
   useMergedRefs,
   useIsomorphicLayoutEffect,
@@ -179,16 +179,16 @@ const Checkbox = React.forwardRef(function (props, ref) {
 
   const classes = cx(
     'ui',
-    useKeyOnly(checked, 'checked'),
-    useKeyOnly(disabled, 'disabled'),
-    useKeyOnly(indeterminate, 'indeterminate'),
+    getKeyOnly(checked, 'checked'),
+    getKeyOnly(disabled, 'disabled'),
+    getKeyOnly(indeterminate, 'indeterminate'),
     // auto apply fitted class to compact white space when there is no label
     // https://semantic-ui.com/modules/checkbox.html#fitted
-    useKeyOnly(_.isNil(label), 'fitted'),
-    useKeyOnly(radio, 'radio'),
-    useKeyOnly(readOnly, 'read-only'),
-    useKeyOnly(slider, 'slider'),
-    useKeyOnly(toggle, 'toggle'),
+    getKeyOnly(_.isNil(label), 'fitted'),
+    getKeyOnly(radio, 'radio'),
+    getKeyOnly(readOnly, 'read-only'),
+    getKeyOnly(slider, 'slider'),
+    getKeyOnly(toggle, 'toggle'),
     'checkbox',
     className,
   )
diff --git a/src/modules/Dimmer/DimmerDimmable.js b/src/modules/Dimmer/DimmerDimmable.js
index c5640daa94..154694a68b 100644
--- a/src/modules/Dimmer/DimmerDimmable.js
+++ b/src/modules/Dimmer/DimmerDimmable.js
@@ -7,7 +7,7 @@ import {
   customPropTypes,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
+  getKeyOnly,
 } from '../../lib'
 
 /**
@@ -17,8 +17,8 @@ const DimmerDimmable = React.forwardRef(function (props, ref) {
   const { blurring, className, children, content, dimmed } = props
 
   const classes = cx(
-    useKeyOnly(blurring, 'blurring'),
-    useKeyOnly(dimmed, 'dimmed'),
+    getKeyOnly(blurring, 'blurring'),
+    getKeyOnly(dimmed, 'dimmed'),
     'dimmable',
     className,
   )
diff --git a/src/modules/Dimmer/DimmerInner.js b/src/modules/Dimmer/DimmerInner.js
index 636a0370d6..a59bb9711b 100644
--- a/src/modules/Dimmer/DimmerInner.js
+++ b/src/modules/Dimmer/DimmerInner.js
@@ -9,8 +9,8 @@ import {
   doesNodeContainClick,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
-  useVerticalAlignProp,
+  getKeyOnly,
+  getVerticalAlignProp,
   useIsomorphicLayoutEffect,
   useMergedRefs,
 } from '../../lib'
@@ -58,12 +58,12 @@ const DimmerInner = React.forwardRef(function (props, ref) {
 
   const classes = cx(
     'ui',
-    useKeyOnly(active, 'active transition visible'),
-    useKeyOnly(disabled, 'disabled'),
-    useKeyOnly(inverted, 'inverted'),
-    useKeyOnly(page, 'page'),
-    useKeyOnly(simple, 'simple'),
-    useVerticalAlignProp(verticalAlign),
+    getKeyOnly(active, 'active transition visible'),
+    getKeyOnly(disabled, 'disabled'),
+    getKeyOnly(inverted, 'inverted'),
+    getKeyOnly(page, 'page'),
+    getKeyOnly(simple, 'simple'),
+    getVerticalAlignProp(verticalAlign),
     'dimmer',
     className,
   )
diff --git a/src/modules/Dropdown/Dropdown.js b/src/modules/Dropdown/Dropdown.js
index d77720b102..3e21959d9b 100644
--- a/src/modules/Dropdown/Dropdown.js
+++ b/src/modules/Dropdown/Dropdown.js
@@ -16,8 +16,8 @@ import {
   makeDebugger,
   objectDiff,
   setRef,
-  useKeyOnly,
-  useKeyOrValueAndKey,
+  getKeyOnly,
+  getKeyOrValueAndKey,
 } from '../../lib'
 import Icon from '../../elements/Icon'
 import Label from '../../elements/Label'
@@ -1051,7 +1051,7 @@ class DropdownInner extends Component {
     // single menu child
     if (!childrenUtils.isNil(children)) {
       const menuChild = Children.only(children)
-      const className = cx(direction, useKeyOnly(open, 'visible'), menuChild.props.className)
+      const className = cx(direction, getKeyOnly(open, 'visible'), menuChild.props.className)
 
       return cloneElement(menuChild, { className, ...ariaOptions })
     }
@@ -1096,31 +1096,31 @@ class DropdownInner extends Component {
     // Classes
     const classes = cx(
       'ui',
-      useKeyOnly(open, 'active visible'),
-      useKeyOnly(disabled, 'disabled'),
-      useKeyOnly(error, 'error'),
-      useKeyOnly(loading, 'loading'),
-
-      useKeyOnly(basic, 'basic'),
-      useKeyOnly(button, 'button'),
-      useKeyOnly(compact, 'compact'),
-      useKeyOnly(fluid, 'fluid'),
-      useKeyOnly(floating, 'floating'),
-      useKeyOnly(inline, 'inline'),
+      getKeyOnly(open, 'active visible'),
+      getKeyOnly(disabled, 'disabled'),
+      getKeyOnly(error, 'error'),
+      getKeyOnly(loading, 'loading'),
+
+      getKeyOnly(basic, 'basic'),
+      getKeyOnly(button, 'button'),
+      getKeyOnly(compact, 'compact'),
+      getKeyOnly(fluid, 'fluid'),
+      getKeyOnly(floating, 'floating'),
+      getKeyOnly(inline, 'inline'),
       // TODO: consider augmentation to render Dropdowns as Button/Menu, solves icon/link item issues
       // https://github.com/Semantic-Org/Semantic-UI-React/issues/401#issuecomment-240487229
       // TODO: the icon class is only required when a dropdown is a button
-      // useKeyOnly(icon, 'icon'),
-      useKeyOnly(labeled, 'labeled'),
-      useKeyOnly(item, 'item'),
-      useKeyOnly(multiple, 'multiple'),
-      useKeyOnly(search, 'search'),
-      useKeyOnly(selection, 'selection'),
-      useKeyOnly(simple, 'simple'),
-      useKeyOnly(scrolling, 'scrolling'),
-      useKeyOnly(upward, 'upward'),
-
-      useKeyOrValueAndKey(pointing, 'pointing'),
+      // getKeyOnly(icon, 'icon'),
+      getKeyOnly(labeled, 'labeled'),
+      getKeyOnly(item, 'item'),
+      getKeyOnly(multiple, 'multiple'),
+      getKeyOnly(search, 'search'),
+      getKeyOnly(selection, 'selection'),
+      getKeyOnly(simple, 'simple'),
+      getKeyOnly(scrolling, 'scrolling'),
+      getKeyOnly(upward, 'upward'),
+
+      getKeyOrValueAndKey(pointing, 'pointing'),
       'dropdown',
       className,
     )
diff --git a/src/modules/Dropdown/DropdownItem.js b/src/modules/Dropdown/DropdownItem.js
index a2e85e900f..7302d41a8f 100644
--- a/src/modules/Dropdown/DropdownItem.js
+++ b/src/modules/Dropdown/DropdownItem.js
@@ -10,7 +10,7 @@ import {
   customPropTypes,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
+  getKeyOnly,
 } from '../../lib'
 import Flag from '../../elements/Flag'
 import Icon from '../../elements/Icon'
@@ -41,9 +41,9 @@ const DropdownItem = React.forwardRef(function (props, ref) {
   }
 
   const classes = cx(
-    useKeyOnly(active, 'active'),
-    useKeyOnly(disabled, 'disabled'),
-    useKeyOnly(selected, 'selected'),
+    getKeyOnly(active, 'active'),
+    getKeyOnly(disabled, 'disabled'),
+    getKeyOnly(selected, 'selected'),
     'item',
     className,
   )
diff --git a/src/modules/Dropdown/DropdownMenu.js b/src/modules/Dropdown/DropdownMenu.js
index d894a24d75..94397da778 100644
--- a/src/modules/Dropdown/DropdownMenu.js
+++ b/src/modules/Dropdown/DropdownMenu.js
@@ -7,7 +7,7 @@ import {
   customPropTypes,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
+  getKeyOnly,
 } from '../../lib'
 
 /**
@@ -18,8 +18,8 @@ const DropdownMenu = React.forwardRef(function (props, ref) {
 
   const classes = cx(
     direction,
-    useKeyOnly(open, 'visible'),
-    useKeyOnly(scrolling, 'scrolling'),
+    getKeyOnly(open, 'visible'),
+    getKeyOnly(scrolling, 'scrolling'),
     'menu transition',
     className,
   )
diff --git a/src/modules/Embed/Embed.js b/src/modules/Embed/Embed.js
index 2854feebc9..d3f7f3fe30 100644
--- a/src/modules/Embed/Embed.js
+++ b/src/modules/Embed/Embed.js
@@ -9,7 +9,7 @@ import {
   customPropTypes,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
+  getKeyOnly,
   useAutoControlledValue,
 } from '../../lib'
 import Icon from '../../elements/Icon'
@@ -107,7 +107,7 @@ const Embed = React.forwardRef(function (props, ref) {
     )
   }
 
-  const classes = cx('ui', aspectRatio, useKeyOnly(active, 'active'), 'embed', className)
+  const classes = cx('ui', aspectRatio, getKeyOnly(active, 'active'), 'embed', className)
   const rest = getUnhandledProps(Embed, props)
   const ElementType = getComponentType(props)
 
diff --git a/src/modules/Modal/Modal.js b/src/modules/Modal/Modal.js
index eb89025712..da7c847ee4 100644
--- a/src/modules/Modal/Modal.js
+++ b/src/modules/Modal/Modal.js
@@ -13,7 +13,7 @@ import {
   getUnhandledProps,
   isBrowser,
   makeDebugger,
-  useKeyOnly,
+  getKeyOnly,
   useAutoControlledValue,
   useMergedRefs,
 } from '../../lib'
@@ -179,9 +179,9 @@ const Modal = React.forwardRef(function (props, ref) {
     const classes = cx(
       'ui',
       size,
-      useKeyOnly(basic, 'basic'),
-      useKeyOnly(legacy, 'legacy'),
-      useKeyOnly(scrolling, 'scrolling'),
+      getKeyOnly(basic, 'basic'),
+      getKeyOnly(legacy, 'legacy'),
+      getKeyOnly(scrolling, 'scrolling'),
       'modal transition visible active',
       className,
     )
diff --git a/src/modules/Modal/ModalContent.js b/src/modules/Modal/ModalContent.js
index b8f50b8140..841a4dae4a 100644
--- a/src/modules/Modal/ModalContent.js
+++ b/src/modules/Modal/ModalContent.js
@@ -8,7 +8,7 @@ import {
   customPropTypes,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
+  getKeyOnly,
 } from '../../lib'
 
 /**
@@ -19,8 +19,8 @@ const ModalContent = React.forwardRef(function (props, ref) {
 
   const classes = cx(
     className,
-    useKeyOnly(image, 'image'),
-    useKeyOnly(scrolling, 'scrolling'),
+    getKeyOnly(image, 'image'),
+    getKeyOnly(scrolling, 'scrolling'),
     'content',
   )
   const rest = getUnhandledProps(ModalContent, props)
diff --git a/src/modules/Modal/ModalDimmer.js b/src/modules/Modal/ModalDimmer.js
index aa8473316c..63ac2c2f2b 100644
--- a/src/modules/Modal/ModalDimmer.js
+++ b/src/modules/Modal/ModalDimmer.js
@@ -9,7 +9,7 @@ import {
   getComponentType,
   getUnhandledProps,
   useClassNamesOnNode,
-  useKeyOnly,
+  getKeyOnly,
   useMergedRefs,
 } from '../../lib'
 
@@ -22,15 +22,15 @@ const ModalDimmer = React.forwardRef(function (props, ref) {
 
   const classes = cx(
     'ui',
-    useKeyOnly(inverted, 'inverted'),
-    useKeyOnly(!centered, 'top aligned'),
+    getKeyOnly(inverted, 'inverted'),
+    getKeyOnly(!centered, 'top aligned'),
     'page modals dimmer transition visible active',
     className,
   )
   const bodyClasses = cx(
     'dimmable dimmed',
-    useKeyOnly(blurring, 'blurring'),
-    useKeyOnly(scrolling, 'scrolling'),
+    getKeyOnly(blurring, 'blurring'),
+    getKeyOnly(scrolling, 'scrolling'),
   )
 
   const rest = getUnhandledProps(ModalDimmer, props)
diff --git a/src/modules/Popup/Popup.js b/src/modules/Popup/Popup.js
index 591748acdd..5b24f7a8e7 100644
--- a/src/modules/Popup/Popup.js
+++ b/src/modules/Popup/Popup.js
@@ -14,8 +14,8 @@ import {
   makeDebugger,
   SUI,
   useIsomorphicLayoutEffect,
-  useKeyOnly,
-  useKeyOrValueAndKey,
+  getKeyOnly,
+  getKeyOrValueAndKey,
   useMergedRefs,
   usePrevious,
 } from '../../lib'
@@ -193,10 +193,10 @@ const Popup = React.forwardRef(function (props, ref) {
       'ui',
       placementMapping[popperPlacement],
       size,
-      useKeyOrValueAndKey(wide, 'wide'),
-      useKeyOnly(basic, 'basic'),
-      useKeyOnly(flowing, 'flowing'),
-      useKeyOnly(inverted, 'inverted'),
+      getKeyOrValueAndKey(wide, 'wide'),
+      getKeyOnly(basic, 'basic'),
+      getKeyOnly(flowing, 'flowing'),
+      getKeyOnly(inverted, 'inverted'),
       'popup transition visible',
       className,
     )
diff --git a/src/modules/Progress/Progress.js b/src/modules/Progress/Progress.js
index 9eae360699..a07b31dcfe 100644
--- a/src/modules/Progress/Progress.js
+++ b/src/modules/Progress/Progress.js
@@ -10,8 +10,8 @@ import {
   getComponentType,
   getUnhandledProps,
   SUI,
-  useKeyOnly,
-  useValueAndKey,
+  getKeyOnly,
+  getValueAndKey,
 } from '../../lib'
 
 /**
@@ -129,14 +129,14 @@ const Progress = React.forwardRef(function (props, ref) {
     'ui',
     color,
     size,
-    useKeyOnly(active || indicating, 'active'),
-    useKeyOnly(disabled, 'disabled'),
-    useKeyOnly(error, 'error'),
-    useKeyOnly(indicating, 'indicating'),
-    useKeyOnly(inverted, 'inverted'),
-    useKeyOnly(success || isAutoSuccess, 'success'),
-    useKeyOnly(warning, 'warning'),
-    useValueAndKey(attached, 'attached'),
+    getKeyOnly(active || indicating, 'active'),
+    getKeyOnly(disabled, 'disabled'),
+    getKeyOnly(error, 'error'),
+    getKeyOnly(indicating, 'indicating'),
+    getKeyOnly(inverted, 'inverted'),
+    getKeyOnly(success || isAutoSuccess, 'success'),
+    getKeyOnly(warning, 'warning'),
+    getValueAndKey(attached, 'attached'),
     'progress',
     className,
   )
diff --git a/src/modules/Rating/Rating.js b/src/modules/Rating/Rating.js
index 0f1274dbea..60c3a4fa8a 100644
--- a/src/modules/Rating/Rating.js
+++ b/src/modules/Rating/Rating.js
@@ -7,7 +7,7 @@ import {
   getComponentType,
   getUnhandledProps,
   SUI,
-  useKeyOnly,
+  getKeyOnly,
   useAutoControlledValue,
 } from '../../lib'
 import RatingIcon from './RatingIcon'
@@ -30,8 +30,8 @@ const Rating = React.forwardRef(function (props, ref) {
     'ui',
     icon,
     size,
-    useKeyOnly(disabled, 'disabled'),
-    useKeyOnly(isSelecting && !disabled && selectedIndex >= 0, 'selected'),
+    getKeyOnly(disabled, 'disabled'),
+    getKeyOnly(isSelecting && !disabled && selectedIndex >= 0, 'selected'),
     'rating',
     className,
   )
diff --git a/src/modules/Rating/RatingIcon.js b/src/modules/Rating/RatingIcon.js
index e21cb050fa..b0d8ebb0da 100644
--- a/src/modules/Rating/RatingIcon.js
+++ b/src/modules/Rating/RatingIcon.js
@@ -4,7 +4,7 @@ import _ from 'lodash'
 import PropTypes from 'prop-types'
 import * as React from 'react'
 
-import { getComponentType, getUnhandledProps, useKeyOnly } from '../../lib'
+import { getComponentType, getUnhandledProps, getKeyOnly } from '../../lib'
 
 /**
  * An internal icon sub-component for Rating component
@@ -13,8 +13,8 @@ const RatingIcon = React.forwardRef(function (props, ref) {
   const { active, className, selected } = props
 
   const classes = cx(
-    useKeyOnly(active, 'active'),
-    useKeyOnly(selected, 'selected'),
+    getKeyOnly(active, 'active'),
+    getKeyOnly(selected, 'selected'),
     'icon',
     className,
   )
diff --git a/src/modules/Search/Search.js b/src/modules/Search/Search.js
index 5e5e0ed5b8..fe66cda9ff 100644
--- a/src/modules/Search/Search.js
+++ b/src/modules/Search/Search.js
@@ -17,8 +17,8 @@ import {
   objectDiff,
   partitionHTMLProps,
   SUI,
-  useKeyOnly,
-  useValueAndKey,
+  getKeyOnly,
+  getValueAndKey,
 } from '../../lib'
 import Input from '../../elements/Input'
 import SearchCategory from './SearchCategory'
@@ -509,11 +509,11 @@ class SearchInner extends Component {
       open && 'active visible',
       size,
       searchClasses,
-      useKeyOnly(category, 'category'),
-      useKeyOnly(focus, 'focus'),
-      useKeyOnly(fluid, 'fluid'),
-      useKeyOnly(loading, 'loading'),
-      useValueAndKey(aligned, 'aligned'),
+      getKeyOnly(category, 'category'),
+      getKeyOnly(focus, 'focus'),
+      getKeyOnly(fluid, 'fluid'),
+      getKeyOnly(loading, 'loading'),
+      getValueAndKey(aligned, 'aligned'),
       'search',
       className,
     )
diff --git a/src/modules/Search/SearchCategory.js b/src/modules/Search/SearchCategory.js
index 6f31c3c6b6..8c45963254 100644
--- a/src/modules/Search/SearchCategory.js
+++ b/src/modules/Search/SearchCategory.js
@@ -7,7 +7,7 @@ import {
   customPropTypes,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
+  getKeyOnly,
 } from '../../lib'
 import SearchCategoryLayout from './SearchCategoryLayout'
 
@@ -21,7 +21,7 @@ const SearchCategory = React.forwardRef(function (props, ref) {
     renderer = ({ name }) => name,
   } = props
 
-  const classes = cx(useKeyOnly(active, 'active'), 'category', className)
+  const classes = cx(getKeyOnly(active, 'active'), 'category', className)
   const rest = getUnhandledProps(SearchCategory, props)
   const ElementType = getComponentType(props)
 
diff --git a/src/modules/Search/SearchResult.js b/src/modules/Search/SearchResult.js
index fe486c6535..4aa39833f4 100644
--- a/src/modules/Search/SearchResult.js
+++ b/src/modules/Search/SearchResult.js
@@ -8,7 +8,7 @@ import {
   customPropTypes,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
+  getKeyOnly,
 } from '../../lib'
 
 // Note: You technically only need the 'content' wrapper when there's an
@@ -38,7 +38,7 @@ const SearchResult = React.forwardRef(function (props, ref) {
     _.invoke(props, 'onClick', e, props)
   }
 
-  const classes = cx(useKeyOnly(active, 'active'), 'result', className)
+  const classes = cx(getKeyOnly(active, 'active'), 'result', className)
   const rest = getUnhandledProps(SearchResult, props)
   const ElementType = getComponentType(props)
 
diff --git a/src/modules/Sidebar/Sidebar.js b/src/modules/Sidebar/Sidebar.js
index 0489850b56..27f659fa04 100644
--- a/src/modules/Sidebar/Sidebar.js
+++ b/src/modules/Sidebar/Sidebar.js
@@ -11,7 +11,7 @@ import {
   getUnhandledProps,
   getComponentType,
   isRefObject,
-  useKeyOnly,
+  getKeyOnly,
   useIsomorphicLayoutEffect,
   useEventCallback,
   useForceUpdate,
@@ -110,8 +110,8 @@ const Sidebar = React.forwardRef((props, ref) => {
     animation,
     direction,
     width,
-    useKeyOnly(animationTick > 0, 'animating'),
-    useKeyOnly(visible, 'visible'),
+    getKeyOnly(animationTick > 0, 'animating'),
+    getKeyOnly(visible, 'visible'),
     'sidebar',
     className,
   )
diff --git a/src/modules/Sidebar/SidebarPusher.js b/src/modules/Sidebar/SidebarPusher.js
index 7519c0b8ec..1d30869e14 100644
--- a/src/modules/Sidebar/SidebarPusher.js
+++ b/src/modules/Sidebar/SidebarPusher.js
@@ -7,7 +7,7 @@ import {
   customPropTypes,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
+  getKeyOnly,
 } from '../../lib'
 
 /**
@@ -16,7 +16,7 @@ import {
 const SidebarPusher = React.forwardRef(function (props, ref) {
   const { className, dimmed, children, content } = props
 
-  const classes = cx('pusher', useKeyOnly(dimmed, 'dimmed'), className)
+  const classes = cx('pusher', getKeyOnly(dimmed, 'dimmed'), className)
   const rest = getUnhandledProps(SidebarPusher, props)
   const ElementType = getComponentType(props)
 
diff --git a/src/modules/Tab/TabPane.js b/src/modules/Tab/TabPane.js
index c74c55be7d..cb77f84966 100644
--- a/src/modules/Tab/TabPane.js
+++ b/src/modules/Tab/TabPane.js
@@ -8,7 +8,7 @@ import {
   customPropTypes,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
+  getKeyOnly,
 } from '../../lib'
 import Segment from '../../elements/Segment/Segment'
 
@@ -18,7 +18,7 @@ import Segment from '../../elements/Segment/Segment'
 const TabPane = React.forwardRef(function (props, ref) {
   const { active = true, children, className, content, loading } = props
 
-  const classes = cx(useKeyOnly(active, 'active'), useKeyOnly(loading, 'loading'), 'tab', className)
+  const classes = cx(getKeyOnly(active, 'active'), getKeyOnly(loading, 'loading'), 'tab', className)
   const rest = getUnhandledProps(TabPane, props)
   const ElementType = getComponentType(props, { defaultAs: Segment })
 
diff --git a/src/modules/Transition/Transition.js b/src/modules/Transition/Transition.js
index 3ad3c88018..fb20ab780c 100644
--- a/src/modules/Transition/Transition.js
+++ b/src/modules/Transition/Transition.js
@@ -3,7 +3,7 @@ import _ from 'lodash'
 import PropTypes from 'prop-types'
 import * as React from 'react'
 
-import { makeDebugger, normalizeTransitionDuration, SUI, useKeyOnly } from '../../lib'
+import { makeDebugger, normalizeTransitionDuration, SUI, getKeyOnly } from '../../lib'
 import TransitionGroup from './TransitionGroup'
 import {
   computeStatuses,
@@ -125,16 +125,16 @@ export default class Transition extends React.Component {
       return cx(
         animation,
         childClasses,
-        useKeyOnly(animating, 'animating'),
-        useKeyOnly(status === TRANSITION_STATUS_ENTERING, 'in'),
-        useKeyOnly(status === TRANSITION_STATUS_EXITING, 'out'),
-        useKeyOnly(status === TRANSITION_STATUS_EXITED, 'hidden'),
-        useKeyOnly(status !== TRANSITION_STATUS_EXITED, 'visible'),
+        getKeyOnly(animating, 'animating'),
+        getKeyOnly(status === TRANSITION_STATUS_ENTERING, 'in'),
+        getKeyOnly(status === TRANSITION_STATUS_EXITING, 'out'),
+        getKeyOnly(status === TRANSITION_STATUS_EXITED, 'hidden'),
+        getKeyOnly(status !== TRANSITION_STATUS_EXITED, 'visible'),
         'transition',
       )
     }
 
-    return cx(animation, childClasses, useKeyOnly(animating, 'animating transition'))
+    return cx(animation, childClasses, getKeyOnly(animating, 'animating transition'))
   }
 
   computeStyle = () => {