Add undefined to optional properties, React to Regenerate (DefinitelyTyped#54352)

* Add undefined to optional properties, React to Regenerate

In preparation for exactOptionalPropertyTypes in Typescript 4.4, add undefined to all optional properties. #no-publishing-comment

This PR covers widely used packages, those with more then 100,000 packages per month, from react-slider -- regenerate

microsoft/dtslint#335

* Fix errors in react

* Missed fix to react-table

* add missed parens to conditional type

Author: sandersn

types/react-slider/index.d.ts

@@ -15,23 +15,23 @@ interface HTMLPropsWithRefCallback<T> extends HTMLProps<T> {
 
 export interface ReactSliderProps<T extends number | ReadonlyArray<number> = number> {
     // Disallow children
-    children?: never;
+    children?: never | undefined;
 
     /**
      * `aria-label` for screen-readers to apply to the thumb(s).
      *
      * Use an array for more than one thumb.
      * The length of the array must match the number of thumbs in the `value` array.
      */
-    ariaLabel?: T extends number ? string : ReadonlyArray<string>;
+    ariaLabel?: T extends number ? string : ReadonlyArray<string> | undefined;
 
     /**
      * aria-labelledby for screen-readers to apply to the thumbs.
      * Used when slider rendered with separate label.
      * Use an array for more than one thumb.
      * The length of the array must match the number of thumbs in the value array.
      */
-    ariaLabelledby?: T extends number ? string : ReadonlyArray<string>;
+    ariaLabelledby?: T extends number ? string : ReadonlyArray<string> | undefined;
 
     /**
      * `aria-valuetext` for screen-readers.
@@ -46,14 +46,14 @@ export interface ReactSliderProps<T extends number | ReadonlyArray<number> = num
      * - `state.value` - the current value state
      * - `state.valueNow` - the value of the thumb (i.e. aria-valuenow)
      */
-    ariaValuetext?: string | ((value: { index: number; value: T; valueNow: number }) => string);
+    ariaValuetext?: string | ((value: { index: number; value: T; valueNow: number }) => string) | undefined;
 
     /**
      * The css class set on the slider node.
      *
      * @default "slider"
      */
-    className?: string;
+    className?: string | undefined;
 
     /**
      * Determines the initial position(s) of the thumb(s) and the number of thumbs.
@@ -67,28 +67,28 @@ export interface ReactSliderProps<T extends number | ReadonlyArray<number> = num
      *
      * @default 0
      */
-    defaultValue?: this["value"] extends T ? never : T;
+    defaultValue?: (this["value"] extends T ? never : T) | undefined;
 
     /**
      * If `true` the thumbs can't be moved.
      *
      * @default false
      */
-    disabled?: boolean;
+    disabled?: boolean | undefined;
 
     /**
      * Inverts the slider.
      *
      * @default false
      */
-    invert?: boolean;
+    invert?: boolean | undefined;
 
     /**
      * The CSS class set on the marks.
      *
      * @default "mark"
      */
-    markClassName?: string;
+    markClassName?: string | undefined;
 
     /**
      * Shows passed marks on the track, if `true` it shows all the marks;
@@ -98,67 +98,67 @@ export interface ReactSliderProps<T extends number | ReadonlyArray<number> = num
      *
      * @default []
      */
-    marks?: boolean | number | ReadonlyArray<number>;
+    marks?: boolean | number | ReadonlyArray<number> | undefined;
 
     /**
      * The maximum value of the slider.
      *
      * @default 100
      */
-    max?: number;
+    max?: number | undefined;
 
     /**
      * The minimum value of the slider.
      *
      * @default 0
      */
-    min?: number;
+    min?: number | undefined;
 
     /**
      * The minimal distance between any pair of thumbs.
      * Must be positive, but `0` means they can sit on top of each other.
      *
      * @default 0
      */
-    minDistance?: number;
+    minDistance?: number | undefined;
 
     /**
      * Callback called only after moving a thumb has ended. The callback
      * will only be called if the action resulted in a change.
      *
      * - `value` - the result value, or values if the slider has multiple thumbs and the thumb index
      */
-    onAfterChange?: (value: T, index: number) => void;
+    onAfterChange?: ((value: T, index: number) => void) | undefined;
 
     /**
      * Callback called before starting to move a thumb. The callback will
      * only be called if the action will result in a change.
      *
      * - `value` - the initial value, or values if the slider has multiple thumbs and the thumb index
      */
-    onBeforeChange?: (value: T, index: number) => void;
+    onBeforeChange?: ((value: T, index: number) => void) | undefined;
 
     /**
      * Callback called on every value change.
      *
      * - `value` - the new value, or values if the slider has multiple thumbs and the thumb index
      */
-    onChange?: (value: T, index: number) => void;
+    onChange?: ((value: T, index: number) => void) | undefined;
 
     /**
      * Callback called when the the slider is clicked (thumb or tracks).
      *
      * - `value` - the value at the clicked position
      */
-    onSliderClick?: (value: number) => void;
+    onSliderClick?: ((value: number) => void) | undefined;
 
     /**
      * Determines whether the slider moves horizontally (from left to right)
      * or vertically (from top to bottom).
      *
      * @default "horizontal"
      */
-    orientation?: "horizontal" | "vertical";
+    orientation?: "horizontal" | "vertical" | undefined;
 
     /**
      * The result of the function is the value to be added or subtracted
@@ -168,15 +168,15 @@ export interface ReactSliderProps<T extends number | ReadonlyArray<number> = num
      *
      * @default step => step * 10
      */
-    pageFn?: (step: number) => number;
+    pageFn?: ((step: number) => number) | undefined;
 
     /**
      * If `true` the active thumb will push other thumbs within the constraints
      * of `min`, `max`, `step` and `minDistance`.
      *
      * @default false
      */
-    pearling?: boolean;
+    pearling?: boolean | undefined;
 
     /**
      * Provide a custom render function for the mark node.
@@ -188,7 +188,7 @@ export interface ReactSliderProps<T extends number | ReadonlyArray<number> = num
      *
      * @default props => <div {...props} />
      */
-    renderMark?: (props: HTMLPropsWithRefCallback<HTMLSpanElement>) => JSX.Element | null;
+    renderMark?: ((props: HTMLPropsWithRefCallback<HTMLSpanElement>) => JSX.Element | null) | undefined;
 
     /**
      * Provide a custom render function for dynamic thumb content.
@@ -203,10 +203,10 @@ export interface ReactSliderProps<T extends number | ReadonlyArray<number> = num
      *
      * @default props => <div {...props} />
      */
-    renderThumb?: (
+    renderThumb?: ((
         props: HTMLPropsWithRefCallback<HTMLDivElement>,
         state: { index: number; value: T; valueNow: number },
-    ) => JSX.Element | null;
+    ) => JSX.Element | null) | undefined;
 
     /**
      * Provide a custom render function for the track node.
@@ -220,17 +220,17 @@ export interface ReactSliderProps<T extends number | ReadonlyArray<number> = num
      *
      * @default props => <div {...props} />
      */
-    renderTrack?: (
+    renderTrack?: ((
         props: HTMLPropsWithRefCallback<HTMLDivElement>,
         state: { index: number; value: T },
-    ) => JSX.Element | null;
+    ) => JSX.Element | null) | undefined;
 
     /**
      * Disables thumb move when clicking the slider track
      *
      * @default false
      */
-    snapDragDisabled?: boolean;
+    snapDragDisabled?: boolean | undefined;
 
     /**
      * Value to be added or subtracted on each step the slider makes.
@@ -239,13 +239,13 @@ export interface ReactSliderProps<T extends number | ReadonlyArray<number> = num
      *
      * @default 1
      */
-    step?: number;
+    step?: number | undefined;
 
     /**
      * The css class set on the thumb that is currently being moved.
      * @default "active"
      */
-    thumbActiveClassName?: string;
+    thumbActiveClassName?: string | undefined;
 
     /**
      * The css class set on each thumb node.
@@ -254,7 +254,7 @@ export interface ReactSliderProps<T extends number | ReadonlyArray<number> = num
      * `${thumbClassName}-${i}`, e.g. `thumb-0`, `thumb-1`, ...
      * @default "thumb"
      */
-    thumbClassName?: string;
+    thumbClassName?: string | undefined;
 
     /**
      * The css class set on the tracks between the thumbs.
@@ -263,19 +263,19 @@ export interface ReactSliderProps<T extends number | ReadonlyArray<number> = num
      * `${trackClassName}-${i}`, e.g. `track-0`, `track-1`, ...
      * @default "track"
      */
-    trackClassName?: string;
+    trackClassName?: string | undefined;
 
     /**
      * Like `defaultValue` but for
      * [controlled components](http://facebook.github.io/react/docs/forms.html#controlled-components).
      */
-    value?: T;
+    value?: T | undefined;
 
     /**
      * If `true` tracks between the thumbs will be rendered.
      * @default true
      */
-    withTracks?: boolean;
+    withTracks?: boolean | undefined;
 }
 
 declare class ReactSlider<T extends number | ReadonlyArray<number> = number> extends Component<ReactSliderProps<T>> {

types/react-sticky/index.d.ts

@@ -23,17 +23,17 @@ export interface StickyChildArgs {
 
 export interface StickyProps {
     children: (args: StickyChildArgs) => React.ReactElement;
-    relative?: boolean;
-    isActive?: boolean;
-    className?: string;
+    relative?: boolean | undefined;
+    isActive?: boolean | undefined;
+    className?: string | undefined;
     style?: any;
-    stickyClassName?: string;
+    stickyClassName?: string | undefined;
     stickyStyle?: any;
-    topOffset?: number;
-    bottomOffset?: number;
+    topOffset?: number | undefined;
+    bottomOffset?: number | undefined;
     onStickyStateChange?(isSticky: boolean): void;
-    disableCompensation?: boolean;
-    disableHardwareAcceleration?: boolean;
+    disableCompensation?: boolean | undefined;
+    disableHardwareAcceleration?: boolean | undefined;
 }
 
 export const Sticky: React.ComponentClass<StickyProps>;

types/react-stripe-elements/index.d.ts

@@ -24,18 +24,18 @@ export namespace ReactStripeElements {
     type ElementsOptions = stripe.elements.ElementsOptions;
     // From https://stripe.com/docs/stripe-js/reference#element-types
     type TokenType = 'card' | 'cardNumber' | 'cardExpiry' | 'cardCvc' | 'paymentRequestButton' | 'iban' | 'idealBank';
-    type TokenOptions = stripe.TokenOptions & { type?: TokenType };
+    type TokenOptions = stripe.TokenOptions & { type?: TokenType | undefined };
     type TokenResponse = stripe.TokenResponse;
     type SourceResponse = stripe.SourceResponse;
     type SourceOptions = stripe.SourceOptions;
     type HTMLStripeElement = stripe.elements.Element;
 
     interface StripeProviderOptions {
-        stripeAccount?: string;
+        stripeAccount?: string | undefined;
     }
     type StripeProviderProps =
-        | { apiKey: string; stripe?: never } & StripeProviderOptions
-        | { apiKey?: never; stripe: stripe.Stripe | null } & StripeProviderOptions;
+        | { apiKey: string; stripe?: never | undefined } & StripeProviderOptions
+        | { apiKey?: never | undefined; stripe: stripe.Stripe | null } & StripeProviderOptions;
 
     interface StripeOverrideProps {
         /*
@@ -69,7 +69,7 @@ export namespace ReactStripeElements {
     }
 
     interface InjectOptions {
-        withRef?: boolean;
+        withRef?: boolean | undefined;
     }
 
     interface InjectedStripeProps {
@@ -78,9 +78,9 @@ export namespace ReactStripeElements {
     }
 
     interface ElementProps extends ElementsOptions {
-        id?: string;
+        id?: string | undefined;
 
-        className?: string;
+        className?: string | undefined;
 
         elementRef?(ref: any): void;
 

types/react-swipeable-views-utils/index.d.ts

@@ -12,15 +12,15 @@ import { OnChangeIndexCallback, OnSwitchingCallback, OnTransitionEndCallback } f
 export interface WithAutoPlay {
     index: number;
     onChangeIndex: OnChangeIndexCallback;
-    onSwitching?: OnSwitchingCallback;
+    onSwitching?: OnSwitchingCallback | undefined;
 }
 export interface WithAutoPlayProps {
-    autoplay?: boolean;
-    direction?: 'incremental' | 'decremental';
+    autoplay?: boolean | undefined;
+    direction?: 'incremental' | 'decremental' | undefined;
     index: number;
-    interval?: number;
+    interval?: number | undefined;
     onChangeIndex: OnChangeIndexCallback;
-    slideCount?: number;
+    slideCount?: number | undefined;
 }
 
 export interface WithVirtualize {
@@ -31,11 +31,11 @@ export interface WithVirtualize {
 export interface WithVirtualizeProps {
     index: number;
     onChangeIndex: OnChangeIndexCallback;
-    onTransitionEnd?: OnTransitionEndCallback;
-    overscanSlideAfter?: number;
-    overscanSlideBefore?: number;
-    slideCount?: number;
-    children?: React.ReactNode;
+    onTransitionEnd?: OnTransitionEndCallback | undefined;
+    overscanSlideAfter?: number | undefined;
+    overscanSlideBefore?: number | undefined;
+    slideCount?: number | undefined;
+    children?: React.ReactNode | undefined;
     slideRenderer: SlideRendererCallback;
 }
 export interface SlideRenderProps {
@@ -48,10 +48,10 @@ export interface WithBindKeyboard {
     onChangeIndex: OnChangeIndexCallback;
 }
 export interface WithBindKeyboardProps {
-    axis?: "x" | "x-reverse" | "y" | "y-reverse";
+    axis?: "x" | "x-reverse" | "y" | "y-reverse" | undefined;
     index: number;
     onChangeIndex: OnChangeIndexCallback;
-    slidecount?: number;
+    slidecount?: number | undefined;
 }
 
 export const autoPlay: PropInjector<WithAutoPlay, WithAutoPlayProps>;