Replace usage of defaultProps

Replace usage of defaultProps. This is deprecated and will be removed in future React versions (see facebook/react#16210)
gkielwasser · Jul 13, 2024 · 442ab84 · 442ab84
1 parent 511292d
commit 442ab84
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 16 deletions.
diff --git a/src/html.jsx b/src/html.jsx
@@ -89,6 +89,7 @@ const usedProps = Object.keys(defaultProps)
 class HTMLEllipsis extends React.Component {
   constructor (props) {
     super(props)
+    this.props = { ...defaultProps, ...props }
     this.state = {
       html: props.unsafeHTML,
       clamped: false
@@ -240,6 +241,4 @@ class HTMLEllipsis extends React.Component {
   }
 }
 
-HTMLEllipsis.defaultProps = defaultProps
-
 export default HTMLEllipsis
diff --git a/src/index.jsx b/src/index.jsx
@@ -32,6 +32,7 @@ const usedProps = Object.keys(defaultProps)
 class LinesEllipsis extends React.Component {
   constructor (props) {
     super(props)
+    this.props = { ...defaultProps, ...props }
     this.state = {
       text: props.text,
       clamped: false
@@ -185,6 +186,4 @@ class LinesEllipsis extends React.Component {
   }
 }
 
-LinesEllipsis.defaultProps = defaultProps
-
 export default LinesEllipsis
diff --git a/src/loose.jsx b/src/loose.jsx
@@ -1,7 +1,14 @@
 import React from 'react'
 
-function LinesEllipsisLoose (props) {
-  const { component: Component, text, lineHeight, maxLine, style, overflowFallback, ...rest } = props
+function LinesEllipsisLoose ({
+  component: Component = 'div',
+  text,
+  lineHeight,
+  maxLine = 1,
+  style = {},
+  overflowFallback = true,
+  ...rest
+}) {
   const maxLineNumber = +maxLine || 1
   let usedStyle = {
     ...style,
@@ -28,11 +35,4 @@ function LinesEllipsisLoose (props) {
   )
 }
 
-LinesEllipsisLoose.defaultProps = {
-  component: 'div',
-  maxLine: 1,
-  style: {},
-  overflowFallback: true
-}
-
 export default LinesEllipsisLoose
diff --git a/src/responsiveHOC.jsx b/src/responsiveHOC.jsx
@@ -2,11 +2,16 @@ import React from 'react'
 import debounce from 'lodash/debounce'
 const isBrowser = typeof window !== 'undefined'
 
+const defaultProps = {
+  innerRef: () => {}
+}
+
 export default function responsiveHOC (wait = 150, debounceOptions) {
   return Component => {
     class Responsive extends React.Component {
       constructor (props) {
         super(props)
+        this.props = { ...defaultProps, ...props }
         this.state = {
           winWidth: isBrowser ? window.innerWidth : 0
         }
@@ -35,9 +40,7 @@ export default function responsiveHOC (wait = 150, debounceOptions) {
     }
 
     Responsive.displayName = `Responsive(${Component.displayName || Component.name})`
-    Responsive.defaultProps = {
-      innerRef () {}
-    }
+
     return Responsive
   }
 }