Skip to content

Commit

Permalink
fix: react 19 support
Browse files Browse the repository at this point in the history
  • Loading branch information
jquense committed Dec 31, 2024
1 parent 00b7905 commit 4a86d52
Show file tree
Hide file tree
Showing 5 changed files with 496 additions and 246 deletions.
1 change: 1 addition & 0 deletions .nvmrc
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
14
18 changes: 11 additions & 7 deletions packages/react-widgets/src/NumberInput.tsx
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import activeElement from 'dom-helpers/activeElement'
import canUseDOM from 'dom-helpers/canUseDOM'
import PropTypes from 'prop-types'
import React, { FocusEvent, SyntheticEvent } from 'react'
import { findDOMNode } from 'react-dom'
import React, { createRef, FocusEvent, SyntheticEvent } from 'react'
import Input from './Input'
import * as CustomPropTypes from './PropTypes'
import { Localizer } from './Localization'
import { mergeRefs } from '@restart/hooks/useMergedRefs'

let isSign = (val: string) => (val || '').trim() === '-'

Expand Down Expand Up @@ -88,6 +88,8 @@ class NumberPickerInput extends React.Component<

state: NumberPickerInputState = {}

input = createRef<HTMLInputElement>()

getSnapshotBeforeUpdate({
editing,
}: NumberPickerInputProps): NumberPickerInputSnapshot {
Expand Down Expand Up @@ -125,7 +127,7 @@ class NumberPickerInput extends React.Component<
__: NumberPickerInputState,
{ reselectText }: NumberPickerInputSnapshot,
) {
if (reselectText) (findDOMNode(this) as HTMLInputElement).select()
if (reselectText) this.input.current?.select()
}

// this intermediate state is for when one runs into
Expand Down Expand Up @@ -184,9 +186,10 @@ class NumberPickerInput extends React.Component<
}

isSelectingAllText() {
const node = canUseDOM && (findDOMNode(this) as HTMLInputElement)
const node = canUseDOM && this.input.current

return (
canUseDOM &&
!!node &&
activeElement() === node &&
node.selectionStart === 0 &&
node.selectionEnd === node.value.length
Expand All @@ -213,6 +216,7 @@ class NumberPickerInput extends React.Component<
localizer: _,
// eslint-disable-next-line no-unused-vars
editing: __,
parse: _a,
...props
} = this.props

Expand All @@ -221,12 +225,12 @@ class NumberPickerInput extends React.Component<
return (
<Input
{...props}
ref={innerRef}
ref={mergeRefs(innerRef, this.input)}
inputMode="numeric"
className="rw-widget-input"
onChange={this.handleChange}
onBlur={this.handleBlur}
aria-valuenow={(value as any) as number /*HACK*/}
aria-valuenow={value as any as number /*HACK*/}
aria-valuemin={isFinite(min!) ? min : undefined}
aria-valuemax={isFinite(max!) ? max : undefined}
disabled={disabled}
Expand Down
26 changes: 16 additions & 10 deletions packages/react-widgets/src/SlideDownTransition.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,8 @@ class SlideDownTransition extends React.Component<SlideDownTransitionProps> {
onEntered: PropTypes.func,
}

nodeRef = React.createRef<HTMLElement>()

getHeight(container: HTMLElement) {
let content = container.firstChild as HTMLElement
let margin =
Expand All @@ -54,16 +56,17 @@ class SlideDownTransition extends React.Component<SlideDownTransitionProps> {
return height
}

setContainerHeight = (elem: HTMLElement) => {
elem.style.height = this.getHeight(elem) + 'px'
setContainerHeight = () => {
this.nodeRef.current!.style.height =
this.getHeight(this.nodeRef.current!) + 'px'
}

clearContainerHeight = (elem: HTMLElement) => {
elem.style.height = ''
}

handleEntered = (elem: HTMLElement) => {
this.clearContainerHeight(elem)
handleEntered = () => {
this.clearContainerHeight(this.nodeRef.current!)

if (this.props.onEntered) this.props.onEntered()
}
Expand All @@ -72,18 +75,19 @@ class SlideDownTransition extends React.Component<SlideDownTransitionProps> {
if (this.props.onEntering) this.props.onEntering()
}

handleExit = (elem: HTMLElement) => {
this.setContainerHeight(elem)
handleExit = () => {
this.setContainerHeight()

if (this.props.onExit) this.props.onExit()
}
handleExited = (elem: HTMLElement) => {
this.clearContainerHeight(elem)
handleExited = () => {
this.clearContainerHeight(this.nodeRef.current!)

if (this.props.onExited) this.props.onExited()
}

handleTransitionEnd = (el: HTMLElement, done: () => void) => {
transitionEnd(el.firstChild as HTMLElement, done)
handleTransitionEnd = (done: () => void) => {
transitionEnd(this.nodeRef.current!.firstChild as HTMLElement, done)
}

render() {
Expand All @@ -94,6 +98,7 @@ class SlideDownTransition extends React.Component<SlideDownTransitionProps> {
{...props}
appear
in={this.props.in}
nodeRef={this.nodeRef}
onEnter={this.setContainerHeight}
onEntering={this.handleEntering}
onEntered={this.handleEntered}
Expand All @@ -105,6 +110,7 @@ class SlideDownTransition extends React.Component<SlideDownTransitionProps> {
{(status: TransitionStatus, innerProps: any) => (
<div
{...innerProps}
ref={this.nodeRef}
className={cn(
className,
dropUp && 'rw-dropup',
Expand Down
70 changes: 50 additions & 20 deletions www/yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -1814,14 +1814,21 @@
resolved "https://registry.yarnpkg.com/@polka/url/-/url-1.0.0-next.12.tgz#431ec342a7195622f86688bbda82e3166ce8cb28"
integrity sha512-6RglhutqrGFMO1MNUXp95RBuYIuc8wTnMAV5MUhLmjTOy78ncwOw7RgeQ/HeymkKXRhZd0s2DNrM1rL7unk3MQ==

"@restart/hooks@^0.3.22", "@restart/hooks@^0.3.26":
"@restart/hooks@^0.3.22":
version "0.3.26"
resolved "https://registry.yarnpkg.com/@restart/hooks/-/hooks-0.3.26.tgz#ade155a7b0b014ef1073391dda46972c3a14a129"
integrity sha512-7Hwk2ZMYm+JLWcb7R9qIXk1OoUg1Z+saKWqZXlrvFwT3w6UArVNWgxYOzf+PJoK9zZejp8okPAKTctthhXLt5g==
dependencies:
lodash "^4.17.20"
lodash-es "^4.17.20"

"@restart/hooks@^0.4.5":
version "0.4.16"
resolved "https://registry.yarnpkg.com/@restart/hooks/-/hooks-0.4.16.tgz#95ae8ac1cc7e2bd4fed5e39800ff85604c6d59fb"
integrity sha512-f7aCv7c+nU/3mF7NWLtVVr0Ra80RqsO89hO72r+Y/nvQr5+q0UFGkocElTH6MJApvReVh6JHUFYn2cw1WdHF3w==
dependencies:
dequal "^2.0.3"

"@sideway/address@^4.1.0":
version "4.1.0"
resolved "https://registry.yarnpkg.com/@sideway/address/-/address-4.1.0.tgz#0b301ada10ac4e0e3fa525c90615e0b61a72b78d"
Expand Down Expand Up @@ -1964,11 +1971,18 @@
resolved "https://registry.yarnpkg.com/@types/anymatch/-/anymatch-1.3.1.tgz#336badc1beecb9dacc38bea2cf32adf627a8421a"
integrity sha512-/+CRPXpBDpo2RK9C68N3b2cOvO0Cf5B9aPijHsoDQTHivnGSObdOF2BRQOYjojWTDy6nQvMjmqRXIxH55VjxxA==

"@types/classnames@^2.2.11", "@types/classnames@^2.2.9":
"@types/classnames@^2.2.9":
version "2.2.11"
resolved "https://registry.yarnpkg.com/@types/classnames/-/classnames-2.2.11.tgz#2521cc86f69d15c5b90664e4829d84566052c1cf"
integrity sha512-2koNhpWm3DgWRp5tpkiJ8JGc1xTn2q0l+jUNUE7oMKXUf5NpI9AIdC4kbjGNFBdHtcxBD18LAksoudAVhFKCjw==

"@types/classnames@^2.3.1":
version "2.3.4"
resolved "https://registry.yarnpkg.com/@types/classnames/-/classnames-2.3.4.tgz#1a1fdf5023ef216219f13e702543f9ce9b394560"
integrity sha512-dwmfrMMQb9ujX1uYGvB5ERDlOzBNywnZAZBtOe107/hORWP05ESgU4QyaanZMWYYfd2BzrG78y13/Bju8IQcMQ==
dependencies:
classnames "*"

"@types/common-tags@^1.8.0":
version "1.8.0"
resolved "https://registry.yarnpkg.com/@types/common-tags/-/common-tags-1.8.0.tgz#79d55e748d730b997be5b7fce4b74488d8b26a6b"
Expand Down Expand Up @@ -2121,12 +2135,10 @@
dependencies:
"@types/react" "*"

"@types/react-transition-group@^4.4.0":
version "4.4.0"
resolved "https://registry.yarnpkg.com/@types/react-transition-group/-/react-transition-group-4.4.0.tgz#882839db465df1320e4753e6e9f70ca7e9b4d46d"
integrity sha512-/QfLHGpu+2fQOqQaXh8MG9q03bFENooTb/it4jr5kKaZlDQfWvjqWZg48AwzPVMBHlRuTRAY7hRHCEOXz5kV6w==
dependencies:
"@types/react" "*"
"@types/react-transition-group@^4.4.4":
version "4.4.12"
resolved "https://registry.yarnpkg.com/@types/react-transition-group/-/react-transition-group-4.4.12.tgz#b5d76568485b02a307238270bfe96cb51ee2a044"
integrity sha512-8TV6R3h2j7a91c+1DXdJi3Syo69zzIZbz7Lg5tORM5LEJG7X/E6a1V3drRyBRZq7/utz7A+c4OgYLiLcYGHG6w==

"@types/react@*", "@types/react@>=16.9.11", "@types/react@^17.0.1":
version "17.0.1"
Expand Down Expand Up @@ -3442,6 +3454,11 @@ class-utils@^0.3.5:
isobject "^3.0.0"
static-extend "^0.1.1"

classnames@*, classnames@^2.3.1:
version "2.5.1"
resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.5.1.tgz#ba774c614be0f016da105c858e7159eae8e7687b"
integrity sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==

classnames@^2.2.5, classnames@^2.2.6:
version "2.2.6"
resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.2.6.tgz#43935bffdd291f326dad0a205309b38d00f650ce"
Expand Down Expand Up @@ -4306,6 +4323,11 @@ depd@~1.1.2:
resolved "https://registry.yarnpkg.com/depd/-/depd-1.1.2.tgz#9bcd52e14c097763e749b274c4346ed2e560b5a9"
integrity sha1-m81S4UwJd2PnSbJ0xDRu0uVgtak=

dequal@^2.0.3:
version "2.0.3"
resolved "https://registry.yarnpkg.com/dequal/-/dequal-2.0.3.tgz#2644214f1997d39ed0ee0ece72335490a7ac67be"
integrity sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==

des.js@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/des.js/-/des.js-1.0.1.tgz#5382142e1bdc53f85d86d53e5f4aa7deb91e0843"
Expand Down Expand Up @@ -4451,14 +4473,22 @@ dom-converter@^0.2:
dependencies:
utila "~0.4"

dom-helpers@^5.0.1, dom-helpers@^5.2.0:
dom-helpers@^5.0.1:
version "5.2.0"
resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-5.2.0.tgz#57fd054c5f8f34c52a3eeffdb7e7e93cd357d95b"
integrity sha512-Ru5o9+V8CpunKnz5LGgWXkmrH/20cGKwcHwS4m73zIvs54CN9epEmT/HLqFJW3kXpakAFkEdzgy1hzlJe3E4OQ==
dependencies:
"@babel/runtime" "^7.8.7"
csstype "^3.0.2"

dom-helpers@^5.2.1:
version "5.2.1"
resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-5.2.1.tgz#d9400536b2bf8225ad98fe052e029451ac40e902"
integrity sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==
dependencies:
"@babel/runtime" "^7.8.7"
csstype "^3.0.2"

dom-serializer@0:
version "0.2.2"
resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.2.2.tgz#1afb81f533717175d478655debc5e332d9f9bb51"
Expand Down Expand Up @@ -9367,27 +9397,27 @@ react-toggle@^4.1.2:
dependencies:
classnames "^2.2.5"

react-transition-group@^4.4.1:
version "4.4.1"
resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-4.4.1.tgz#63868f9325a38ea5ee9535d828327f85773345c9"
integrity sha512-Djqr7OQ2aPUiYurhPalTrVy9ddmFCCzwhqQmtN+J3+3DzLO209Fdr70QrN8Z3DsglWql6iY1lDWAfpFiBtuKGw==
react-transition-group@^4.4.2:
version "4.4.5"
resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-4.4.5.tgz#e53d4e3f3344da8521489fbef8f2581d42becdd1"
integrity sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==
dependencies:
"@babel/runtime" "^7.5.5"
dom-helpers "^5.0.1"
loose-envify "^1.4.0"
prop-types "^15.6.2"

"react-widgets@file:../packages/react-widgets":
version "5.6.0"
version "5.8.4"
dependencies:
"@restart/hooks" "^0.3.26"
"@types/classnames" "^2.2.11"
"@types/react-transition-group" "^4.4.0"
classnames "^2.2.6"
"@restart/hooks" "^0.4.5"
"@types/classnames" "^2.3.1"
"@types/react-transition-group" "^4.4.4"
classnames "^2.3.1"
date-arithmetic "^4.0.1"
dom-helpers "^5.2.0"
dom-helpers "^5.2.1"
prop-types-extra "^1.1.1"
react-transition-group "^4.4.1"
react-transition-group "^4.4.2"
tiny-warning "^1.0.3"
uncontrollable "^7.2.1"

Expand Down
Loading

0 comments on commit 4a86d52

Please sign in to comment.