From a7e8c695de1333ea2b84f2d21fdeb7d6c31f27be Mon Sep 17 00:00:00 2001
From: Dominik Dosoudil <eziotegg@gmail.com>
Date: Fri, 22 Nov 2024 09:16:38 +0100
Subject: [PATCH] chore: rename classNameBuilder functions in "views" and
 remove classNameBuilder aliases with "use" prefix (#4505)

* chore: replace deprecated classNameBuilder functions (replace prefix 'use' with 'get') in views/Advertisement

* chore: replace deprecated classNameBuilder functions (replace prefix 'use' with 'get') in views/Card

* chore: replace deprecated classNameBuilder functions (replace prefix 'use' with 'get') in views/Comment

* chore: replace deprecated classNameBuilder functions (replace prefix 'use' with 'get') in views/Feed

* chore: replace deprecated classNameBuilder functions (replace prefix 'use' with 'get') in views/Item

* chore: replace deprecated classNameBuilder functions (replace prefix 'use' with 'get') in views/Statistic

* chore: remove deprecaetd unused classNameBuilders
---
 src/lib/classNameBuilders.js             | 35 ------------------------
 src/lib/index.js                         |  7 -----
 src/views/Advertisement/Advertisement.js |  6 ++--
 src/views/Card/Card.js                   | 10 +++----
 src/views/Card/CardContent.js            |  6 ++--
 src/views/Card/CardDescription.js        |  4 +--
 src/views/Card/CardGroup.js              | 16 +++++------
 src/views/Card/CardHeader.js             |  4 +--
 src/views/Card/CardMeta.js               |  4 +--
 src/views/Comment/Comment.js             |  4 +--
 src/views/Comment/CommentAction.js       |  4 +--
 src/views/Comment/CommentGroup.js        |  8 +++---
 src/views/Feed/FeedExtra.js              |  6 ++--
 src/views/Item/ItemContent.js            |  4 +--
 src/views/Item/ItemGroup.js              | 12 ++++----
 src/views/Statistic/Statistic.js         | 10 +++----
 src/views/Statistic/StatisticGroup.js    | 10 +++----
 src/views/Statistic/StatisticValue.js    |  4 +--
 18 files changed, 56 insertions(+), 98 deletions(-)

diff --git a/src/lib/classNameBuilders.js b/src/lib/classNameBuilders.js
index 09834376d0..8bde9b3790 100644
--- a/src/lib/classNameBuilders.js
+++ b/src/lib/classNameBuilders.js
@@ -21,11 +21,6 @@ import { numberToWord } from './numberToWord'
  */
 export const getKeyOnly = (val, key) => val && key
 
-/**
- * @deprecated
- */
-export const useKeyOnly = getKeyOnly
-
 /**
  * Props that require both a key and value to create a className.
  * @param {*} val A props value
@@ -37,11 +32,6 @@ export const useKeyOnly = getKeyOnly
  */
 export const getValueAndKey = (val, key) => val && val !== true && `${val} ${key}`
 
-/**
- * @deprecated
- */
-export const useValueAndKey = getValueAndKey
-
 /**
  * Props whose key will be used in className, or value and key.
  * @param {*} val A props value
@@ -57,11 +47,6 @@ export const useValueAndKey = getValueAndKey
  */
 export const getKeyOrValueAndKey = (val, key) => val && (val === true ? key : `${val} ${key}`)
 
-/**
- * @deprecated
- */
-export const useKeyOrValueAndKey = getKeyOrValueAndKey
-
 //
 // Prop to className exceptions
 //
@@ -89,11 +74,6 @@ export const getMultipleProp = (val, key) => {
     .join(' ')
 }
 
-/**
- * @deprecated
- */
-export const useMultipleProp = getMultipleProp
-
 /**
  * The "textAlign" prop follows the useValueAndKey except when the value is "justified'.
  * In this case, only the class "justified" is used, ignoring the "aligned" class.
@@ -110,11 +90,6 @@ export const useMultipleProp = getMultipleProp
 export const getTextAlignProp = (val) =>
   val === 'justified' ? 'justified' : getValueAndKey(val, 'aligned')
 
-/**
- * @deprecated
- */
-export const useTextAlignProp = getTextAlignProp
-
 /**
  * The "verticalAlign" prop follows the useValueAndKey.
  *
@@ -126,11 +101,6 @@ export const useTextAlignProp = getTextAlignProp
  */
 export const getVerticalAlignProp = (val) => getValueAndKey(val, 'aligned')
 
-/**
- * @deprecated
- */
-export const useVerticalAlignProp = getVerticalAlignProp
-
 /**
  * Create "X", "X wide" and "equal width" classNames.
  * "X" is a numberToWord value and "wide" is configurable.
@@ -162,8 +132,3 @@ export const getWidthProp = (val, widthClass = '', canEqual = false) => {
   }
   return numberToWord(val)
 }
-
-/**
- * @deprecated
- */
-export const useWidthProp = getWidthProp
diff --git a/src/lib/index.js b/src/lib/index.js
index 37c752b326..137a5c47c8 100644
--- a/src/lib/index.js
+++ b/src/lib/index.js
@@ -4,19 +4,12 @@ export ModernAutoControlledComponent from './ModernAutoControlledComponent'
 export * as childrenUtils from './childrenUtils'
 
 export {
-  useKeyOnly,
   getKeyOnly,
-  useKeyOrValueAndKey,
   getKeyOrValueAndKey,
-  useValueAndKey,
   getValueAndKey,
-  useMultipleProp,
   getMultipleProp,
-  useTextAlignProp,
   getTextAlignProp,
-  useVerticalAlignProp,
   getVerticalAlignProp,
-  useWidthProp,
   getWidthProp,
 } from './classNameBuilders'
 
diff --git a/src/views/Advertisement/Advertisement.js b/src/views/Advertisement/Advertisement.js
index c018e09a41..e0f6225005 100644
--- a/src/views/Advertisement/Advertisement.js
+++ b/src/views/Advertisement/Advertisement.js
@@ -7,7 +7,7 @@ import {
   customPropTypes,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
+  getKeyOnly,
 } from '../../lib'
 
 /**
@@ -19,8 +19,8 @@ const Advertisement = React.forwardRef(function (props, ref) {
   const classes = cx(
     'ui',
     unit,
-    useKeyOnly(centered, 'centered'),
-    useKeyOnly(test, 'test'),
+    getKeyOnly(centered, 'centered'),
+    getKeyOnly(test, 'test'),
     'ad',
     className,
   )
diff --git a/src/views/Card/Card.js b/src/views/Card/Card.js
index aa6c54a202..fab8800a06 100644
--- a/src/views/Card/Card.js
+++ b/src/views/Card/Card.js
@@ -9,7 +9,7 @@ import {
   getComponentType,
   getUnhandledProps,
   SUI,
-  useKeyOnly,
+  getKeyOnly,
   useEventCallback,
 } from '../../lib'
 import Image from '../../elements/Image'
@@ -44,10 +44,10 @@ const Card = React.forwardRef(function (props, ref) {
   const classes = cx(
     'ui',
     color,
-    useKeyOnly(centered, 'centered'),
-    useKeyOnly(fluid, 'fluid'),
-    useKeyOnly(link, 'link'),
-    useKeyOnly(raised, 'raised'),
+    getKeyOnly(centered, 'centered'),
+    getKeyOnly(fluid, 'fluid'),
+    getKeyOnly(link, 'link'),
+    getKeyOnly(raised, 'raised'),
     'card',
     className,
   )
diff --git a/src/views/Card/CardContent.js b/src/views/Card/CardContent.js
index 4c52f453c2..ab1b7ff691 100644
--- a/src/views/Card/CardContent.js
+++ b/src/views/Card/CardContent.js
@@ -10,8 +10,8 @@ import {
   getComponentType,
   getUnhandledProps,
   SUI,
-  useKeyOnly,
-  useTextAlignProp,
+  getKeyOnly,
+  getTextAlignProp,
 } from '../../lib'
 import CardDescription from './CardDescription'
 import CardHeader from './CardHeader'
@@ -23,7 +23,7 @@ import CardMeta from './CardMeta'
 const CardContent = React.forwardRef(function (props, ref) {
   const { children, className, content, description, extra, header, meta, textAlign } = props
 
-  const classes = cx(useKeyOnly(extra, 'extra'), useTextAlignProp(textAlign), 'content', className)
+  const classes = cx(getKeyOnly(extra, 'extra'), getTextAlignProp(textAlign), 'content', className)
   const rest = getUnhandledProps(CardContent, props)
   const ElementType = getComponentType(props)
 
diff --git a/src/views/Card/CardDescription.js b/src/views/Card/CardDescription.js
index 3a93a180b4..5911ac9a44 100644
--- a/src/views/Card/CardDescription.js
+++ b/src/views/Card/CardDescription.js
@@ -9,7 +9,7 @@ import {
   getComponentType,
   getUnhandledProps,
   SUI,
-  useTextAlignProp,
+  getTextAlignProp,
 } from '../../lib'
 
 /**
@@ -17,7 +17,7 @@ import {
  */
 const CardDescription = React.forwardRef(function (props, ref) {
   const { children, className, content, textAlign } = props
-  const classes = cx(useTextAlignProp(textAlign), 'description', className)
+  const classes = cx(getTextAlignProp(textAlign), 'description', className)
   const rest = getUnhandledProps(CardDescription, props)
   const ElementType = getComponentType(props)
 
diff --git a/src/views/Card/CardGroup.js b/src/views/Card/CardGroup.js
index 54e8983513..b657a73525 100644
--- a/src/views/Card/CardGroup.js
+++ b/src/views/Card/CardGroup.js
@@ -9,9 +9,9 @@ import {
   getComponentType,
   getUnhandledProps,
   SUI,
-  useKeyOnly,
-  useTextAlignProp,
-  useWidthProp,
+  getKeyOnly,
+  getTextAlignProp,
+  getWidthProp,
 } from '../../lib'
 import Card from './Card'
 
@@ -33,11 +33,11 @@ const CardGroup = React.forwardRef(function (props, ref) {
 
   const classes = cx(
     'ui',
-    useKeyOnly(centered, 'centered'),
-    useKeyOnly(doubling, 'doubling'),
-    useKeyOnly(stackable, 'stackable'),
-    useTextAlignProp(textAlign),
-    useWidthProp(itemsPerRow),
+    getKeyOnly(centered, 'centered'),
+    getKeyOnly(doubling, 'doubling'),
+    getKeyOnly(stackable, 'stackable'),
+    getTextAlignProp(textAlign),
+    getWidthProp(itemsPerRow),
     'cards',
     className,
   )
diff --git a/src/views/Card/CardHeader.js b/src/views/Card/CardHeader.js
index 2cb948b7c7..f0e315355e 100644
--- a/src/views/Card/CardHeader.js
+++ b/src/views/Card/CardHeader.js
@@ -9,7 +9,7 @@ import {
   getComponentType,
   getUnhandledProps,
   SUI,
-  useTextAlignProp,
+  getTextAlignProp,
 } from '../../lib'
 
 /**
@@ -17,7 +17,7 @@ import {
  */
 const CardHeader = React.forwardRef(function (props, ref) {
   const { children, className, content, textAlign } = props
-  const classes = cx(useTextAlignProp(textAlign), 'header', className)
+  const classes = cx(getTextAlignProp(textAlign), 'header', className)
   const rest = getUnhandledProps(CardHeader, props)
   const ElementType = getComponentType(props)
 
diff --git a/src/views/Card/CardMeta.js b/src/views/Card/CardMeta.js
index 8e3f2b4d7b..23553f3469 100644
--- a/src/views/Card/CardMeta.js
+++ b/src/views/Card/CardMeta.js
@@ -9,7 +9,7 @@ import {
   getComponentType,
   getUnhandledProps,
   SUI,
-  useTextAlignProp,
+  getTextAlignProp,
 } from '../../lib'
 
 /**
@@ -17,7 +17,7 @@ import {
  */
 const CardMeta = React.forwardRef(function (props, ref) {
   const { children, className, content, textAlign } = props
-  const classes = cx(useTextAlignProp(textAlign), 'meta', className)
+  const classes = cx(getTextAlignProp(textAlign), 'meta', className)
   const rest = getUnhandledProps(CardMeta, props)
   const ElementType = getComponentType(props)
 
diff --git a/src/views/Comment/Comment.js b/src/views/Comment/Comment.js
index fc44689df4..5622459463 100644
--- a/src/views/Comment/Comment.js
+++ b/src/views/Comment/Comment.js
@@ -7,7 +7,7 @@ import {
   customPropTypes,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
+  getKeyOnly,
 } from '../../lib'
 import CommentAction from './CommentAction'
 import CommentActions from './CommentActions'
@@ -24,7 +24,7 @@ import CommentText from './CommentText'
 const Comment = React.forwardRef(function (props, ref) {
   const { className, children, collapsed, content } = props
 
-  const classes = cx(useKeyOnly(collapsed, 'collapsed'), 'comment', className)
+  const classes = cx(getKeyOnly(collapsed, 'collapsed'), 'comment', className)
   const rest = getUnhandledProps(Comment, props)
   const ElementType = getComponentType(props)
 
diff --git a/src/views/Comment/CommentAction.js b/src/views/Comment/CommentAction.js
index ee67edb41b..adfd9430d0 100644
--- a/src/views/Comment/CommentAction.js
+++ b/src/views/Comment/CommentAction.js
@@ -7,7 +7,7 @@ import {
   customPropTypes,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
+  getKeyOnly,
 } from '../../lib'
 
 /**
@@ -16,7 +16,7 @@ import {
 const CommentAction = React.forwardRef(function (props, ref) {
   const { active, className, children, content } = props
 
-  const classes = cx(useKeyOnly(active, 'active'), className)
+  const classes = cx(getKeyOnly(active, 'active'), className)
   const rest = getUnhandledProps(CommentAction, props)
   const ElementType = getComponentType(props, { defaultAs: 'a' })
 
diff --git a/src/views/Comment/CommentGroup.js b/src/views/Comment/CommentGroup.js
index 0e8c4e2a7b..dc7e33f48b 100644
--- a/src/views/Comment/CommentGroup.js
+++ b/src/views/Comment/CommentGroup.js
@@ -9,7 +9,7 @@ import {
   getComponentType,
   getUnhandledProps,
   SUI,
-  useKeyOnly,
+  getKeyOnly,
 } from '../../lib'
 
 /**
@@ -21,9 +21,9 @@ const CommentGroup = React.forwardRef(function (props, ref) {
   const classes = cx(
     'ui',
     size,
-    useKeyOnly(collapsed, 'collapsed'),
-    useKeyOnly(minimal, 'minimal'),
-    useKeyOnly(threaded, 'threaded'),
+    getKeyOnly(collapsed, 'collapsed'),
+    getKeyOnly(minimal, 'minimal'),
+    getKeyOnly(threaded, 'threaded'),
     'comments',
     className,
   )
diff --git a/src/views/Feed/FeedExtra.js b/src/views/Feed/FeedExtra.js
index 6ea83d660c..aee147be34 100644
--- a/src/views/Feed/FeedExtra.js
+++ b/src/views/Feed/FeedExtra.js
@@ -9,7 +9,7 @@ import {
   customPropTypes,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
+  getKeyOnly,
 } from '../../lib'
 
 /**
@@ -19,8 +19,8 @@ const FeedExtra = React.forwardRef(function (props, ref) {
   const { children, className, content, images, text } = props
 
   const classes = cx(
-    useKeyOnly(images, 'images'),
-    useKeyOnly(content || text, 'text'),
+    getKeyOnly(images, 'images'),
+    getKeyOnly(content || text, 'text'),
     'extra',
     className,
   )
diff --git a/src/views/Item/ItemContent.js b/src/views/Item/ItemContent.js
index 75d4963727..a858c17d52 100644
--- a/src/views/Item/ItemContent.js
+++ b/src/views/Item/ItemContent.js
@@ -8,7 +8,7 @@ import {
   getComponentType,
   getUnhandledProps,
   SUI,
-  useVerticalAlignProp,
+  getVerticalAlignProp,
 } from '../../lib'
 import ItemHeader from './ItemHeader'
 import ItemDescription from './ItemDescription'
@@ -21,7 +21,7 @@ import ItemMeta from './ItemMeta'
 const ItemContent = React.forwardRef(function (props, ref) {
   const { children, className, content, description, extra, header, meta, verticalAlign } = props
 
-  const classes = cx(useVerticalAlignProp(verticalAlign), 'content', className)
+  const classes = cx(getVerticalAlignProp(verticalAlign), 'content', className)
   const rest = getUnhandledProps(ItemContent, props)
   const ElementType = getComponentType(props)
 
diff --git a/src/views/Item/ItemGroup.js b/src/views/Item/ItemGroup.js
index dc0a28c164..cf33a2ed91 100644
--- a/src/views/Item/ItemGroup.js
+++ b/src/views/Item/ItemGroup.js
@@ -8,8 +8,8 @@ import {
   customPropTypes,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
-  useKeyOrValueAndKey,
+  getKeyOnly,
+  getKeyOrValueAndKey,
 } from '../../lib'
 import Item from './Item'
 
@@ -21,10 +21,10 @@ const ItemGroup = React.forwardRef(function (props, ref) {
 
   const classes = cx(
     'ui',
-    useKeyOnly(divided, 'divided'),
-    useKeyOnly(link, 'link'),
-    useKeyOnly(unstackable, 'unstackable'),
-    useKeyOrValueAndKey(relaxed, 'relaxed'),
+    getKeyOnly(divided, 'divided'),
+    getKeyOnly(link, 'link'),
+    getKeyOnly(unstackable, 'unstackable'),
+    getKeyOrValueAndKey(relaxed, 'relaxed'),
     'items',
     className,
   )
diff --git a/src/views/Statistic/Statistic.js b/src/views/Statistic/Statistic.js
index 698904ec2e..d962f30874 100644
--- a/src/views/Statistic/Statistic.js
+++ b/src/views/Statistic/Statistic.js
@@ -10,8 +10,8 @@ import {
   getComponentType,
   getUnhandledProps,
   SUI,
-  useKeyOnly,
-  useValueAndKey,
+  getKeyOnly,
+  getValueAndKey,
 } from '../../lib'
 import StatisticGroup from './StatisticGroup'
 import StatisticLabel from './StatisticLabel'
@@ -39,9 +39,9 @@ const Statistic = React.forwardRef(function (props, ref) {
     'ui',
     color,
     size,
-    useValueAndKey(floated, 'floated'),
-    useKeyOnly(horizontal, 'horizontal'),
-    useKeyOnly(inverted, 'inverted'),
+    getValueAndKey(floated, 'floated'),
+    getKeyOnly(horizontal, 'horizontal'),
+    getKeyOnly(inverted, 'inverted'),
     'statistic',
     className,
   )
diff --git a/src/views/Statistic/StatisticGroup.js b/src/views/Statistic/StatisticGroup.js
index eea559981e..b4945c19c1 100644
--- a/src/views/Statistic/StatisticGroup.js
+++ b/src/views/Statistic/StatisticGroup.js
@@ -9,8 +9,8 @@ import {
   getComponentType,
   getUnhandledProps,
   SUI,
-  useKeyOnly,
-  useWidthProp,
+  getKeyOnly,
+  getWidthProp,
 } from '../../lib'
 import Statistic from './Statistic'
 
@@ -24,9 +24,9 @@ const StatisticGroup = React.forwardRef(function (props, ref) {
     'ui',
     color,
     size,
-    useKeyOnly(horizontal, 'horizontal'),
-    useKeyOnly(inverted, 'inverted'),
-    useWidthProp(widths),
+    getKeyOnly(horizontal, 'horizontal'),
+    getKeyOnly(inverted, 'inverted'),
+    getWidthProp(widths),
     'statistics',
     className,
   )
diff --git a/src/views/Statistic/StatisticValue.js b/src/views/Statistic/StatisticValue.js
index 7654c5a503..f18bced601 100644
--- a/src/views/Statistic/StatisticValue.js
+++ b/src/views/Statistic/StatisticValue.js
@@ -8,7 +8,7 @@ import {
   customPropTypes,
   getComponentType,
   getUnhandledProps,
-  useKeyOnly,
+  getKeyOnly,
 } from '../../lib'
 
 /**
@@ -17,7 +17,7 @@ import {
 const StatisticValue = React.forwardRef(function (props, ref) {
   const { children, className, content, text } = props
 
-  const classes = cx(useKeyOnly(text, 'text'), 'value', className)
+  const classes = cx(getKeyOnly(text, 'text'), 'value', className)
   const rest = getUnhandledProps(StatisticValue, props)
   const ElementType = getComponentType(props)