@transferwise/components 40.7.0 → 40.8.2-beta-2d42507700.0

package/build/styles/uploadInput/uploadButton/UploadButton.css

@@ -1 +1 @@
-.np-upload-button{width:100%;text-decoration:none!important;border:0!important;letter-spacing:normal!important;padding:12px 16px;padding:var(--size-12,12px) var(--size-16,16px)}.np-upload-button.np-upload-accent{color:#00a2dd;color:var(--color-interactive-accent,#00a2dd)}label.np-upload-button:not(.disabled):active,label.np-upload-button:not(.disabled):focus,label.np-upload-button:not(.disabled):hover{background-color:rgba(134,167,189,.10196078431372549);background-color:var(--color-background-neutral,rgba(134,167,189,.10196078431372549))}.np-upload-button .np-upload-icon{display:flex;align-items:center}.np-upload-button .np-upload-description{font-weight:400;white-space:normal}.np-upload-button-container.droppable{border:0}.np-upload-button-container .droppable-card-content{display:flex}.np-upload-button-container input[type=file]{opacity:0;z-index:-1;position:absolute}.np-upload-button-container input[type=file]:focus+label{background-color:rgba(134,167,189,.10196078431372549);background-color:var(--color-background-neutral,rgba(134,167,189,.10196078431372549))}
+.np-upload-button{border:0!important;letter-spacing:normal!important;padding:12px 16px;padding:var(--size-12,12px) var(--size-16,16px);text-decoration:none!important;width:100%}.np-upload-button.np-upload-accent{color:#00a2dd;color:var(--color-interactive-accent,#00a2dd)}label.np-upload-button:not(.disabled):active,label.np-upload-button:not(.disabled):focus,label.np-upload-button:not(.disabled):hover{background-color:#86a7bd1a;background-color:var(--color-background-neutral,#86a7bd1a)}.np-upload-button .np-upload-icon{align-items:center;display:flex}.np-upload-button .np-upload-description{font-weight:400;white-space:normal}.np-upload-button-container.droppable{border:0}.np-upload-button-container .droppable-card-content{display:flex}.np-upload-button-container input[type=file]{opacity:0;position:absolute;z-index:-1}.np-upload-button-container input[type=file]:focus+label{background-color:#86a7bd1a;background-color:var(--color-background-neutral,#86a7bd1a)}

package/build/styles/uploadInput/uploadItem/UploadItem.css

@@ -1 +1 @@
-.np-upload-item:not(:last-child):after{display:block;position:relative;border-bottom:1px solid rgba(0,0,0,.10196078431372549);border-bottom:1px solid var(--color-border-neutral,rgba(0,0,0,.10196078431372549));content:" ";margin:0 16px;margin:0 var(--size-16,16px)}.np-upload-item__link a{flex:1;text-decoration:none;outline:none;font-weight:500;font-weight:var(--font-weight-regular,500)}.np-upload-item__link a:active,.np-upload-item__link a:focus,.np-upload-item__link a:hover{text-decoration:none}.np-upload-item__link a:active,.np-upload-item__link a:active~.np-upload-item__remove-button,.np-upload-item__link a:focus,.np-upload-item__link a:focus~.np-upload-item__remove-button,.np-upload-item__link a:hover,.np-upload-item__link a:hover~.np-upload-item__remove-button{background-color:rgba(134,167,189,.10196078431372549);background-color:var(--color-background-neutral,rgba(134,167,189,.10196078431372549))}.np-upload-item__body{display:flex;align-items:center;justify-content:space-between}.np-upload-item__remove-button{flex-shrink:0;align-self:stretch;padding:12px 16px;padding:var(--size-12,12px) var(--size-16,16px);color:#c9cbce;color:var(--color-interactive-secondary,#c9cbce);background:transparent}.np-upload-item__remove-button:focus,.np-upload-item__remove-button:hover{color:#d03238!important;color:var(--color-interactive-negative-hover,#d03238)!important}
+.np-upload-item:not(:last-child):after{border-bottom:1px solid #0000001a;border-bottom:1px solid var(--color-border-neutral,#0000001a);content:" ";display:block;margin:0 16px;margin:0 var(--size-16,16px);position:relative}.np-upload-item__link a{flex:1;font-weight:500;font-weight:var(--font-weight-regular,500);outline:none;text-decoration:none}.np-upload-item__link a:active,.np-upload-item__link a:focus,.np-upload-item__link a:hover{background-color:#86a7bd1a;background-color:var(--color-background-neutral,#86a7bd1a);text-decoration:none}.np-upload-item__link a:active~.np-upload-item__remove-button,.np-upload-item__link a:focus~.np-upload-item__remove-button,.np-upload-item__link a:hover~.np-upload-item__remove-button{background-color:#86a7bd1a;background-color:var(--color-background-neutral,#86a7bd1a)}.np-upload-item__body{align-items:center;display:flex;justify-content:space-between}.np-upload-item__remove-button{align-self:stretch;background:transparent;color:#c9cbce;color:var(--color-interactive-secondary,#c9cbce);flex-shrink:0;padding:12px 16px;padding:var(--size-12,12px) var(--size-16,16px)}.np-upload-item__remove-button:focus,.np-upload-item__remove-button:hover{color:#d03238!important;color:var(--color-interactive-negative-hover,#d03238)!important}

package/build/types/actionButton/ActionButton.d.ts

@@ -1,4 +1,10 @@
 import { ButtonHTMLAttributes, MouseEvent } from 'react';
+export declare type ActionButtonProps = {
+    className?: string;
+    disabled?: boolean;
+    text: string;
+    onClick: (event: MouseEvent<HTMLButtonElement>) => void;
+} & ButtonHTMLAttributes<HTMLButtonElement>;
 declare const ActionButton: import("react").ForwardRefExoticComponent<{
     className?: string | undefined;
     disabled?: boolean | undefined;

package/build/types/common/commonProps.d.ts

@@ -15,6 +15,3 @@ export declare type LinkProps = {
     target?: '_blank' | '_self' | '_parent' | '_top';
 };
 export declare type Heading = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
-export declare type OnClickHandler = {
-    onClick: (event: Event) => void;
-};

package/build/types/common/historyNavigator/historyNavigator.d.ts

@@ -1,9 +1,9 @@
 export default HistoryNavigator;
 declare class HistoryNavigator {
-    constructor(history?: any[], historyLimit?: any);
+    constructor(history?: any[], historyLimit?: null);
     history: any[];
     currIndex: number;
-    historyLimit: any;
+    historyLimit: number | null;
     reset: (newHistory?: string[], historyLimit?: number) => void;
     add: (element: any) => void;
     redo: () => any;

package/build/types/common/hooks/useConditionalListener/useConditionalListener.d.ts

@@ -1 +1 @@
-export function useConditionalListener({ attachListener, callback, eventType, parent }: any): void;
+export function useConditionalListener({ attachListener, callback, eventType, parent }: bool): void;

package/build/types/dateLookup/tableLink/TableLink.d.ts

@@ -3,6 +3,7 @@ declare class TableLink extends PureComponent<any, any, any> {
     constructor(props: any);
     constructor(props: any, context: any);
     onClick: (event: any) => void;
+    render(): JSX.Element;
 }
 declare namespace TableLink {
     namespace propTypes {

package/build/types/dateLookup/yearCalendar/YearCalendar.d.ts

@@ -5,6 +5,7 @@ declare class YearCalendar extends PureComponent<any, any, any> {
     onYearSelect: (year: any) => void;
     selectPreviousYears: () => void;
     selectNextYears: () => void;
+    render(): JSX.Element;
 }
 declare namespace YearCalendar {
     namespace propTypes {

package/build/types/header/Header.d.ts

@@ -1,16 +1,16 @@
 /// <reference types="react" />
-import { AriaLabelProperty, OnClickHandler, CommonProps, Heading, LinkProps } from '../common';
+import { ActionButtonProps } from '../actionButton/ActionButton';
+import { AriaLabelProperty, CommonProps, Heading, LinkProps } from '../common';
 declare type ActionProps = AriaLabelProperty & {
     text: string;
 };
-declare type ButtonActionProps = ActionProps & OnClickHandler;
 declare type LinkActionProps = ActionProps & LinkProps;
 export declare type HeaderProps = CommonProps & {
     /**
      * When the `href` property is provided to the `action`, we will render a `Link` instead of a `Button`.
      *
      */
-    action?: ButtonActionProps | LinkActionProps;
+    action?: ActionButtonProps | LinkActionProps;
     /**
      * Override the heading element rendered for the title, useful to specify the semantics of your header.
      *

package/build/types/index.d.ts

@@ -53,6 +53,8 @@ export { default as OverlayHeader } from './overlayHeader';
 export { default as PhoneNumberInput } from './phoneNumberInput';
 export { default as Popover } from './popover';
 export { default as ProcessIndicator } from './processIndicator';
+export { default as ProgressBar } from './progressBar';
+export { default as Progress } from './progress';
 export { default as Provider, DirectionProvider } from './provider';
 export { default as Radio } from './radio';
 export { default as RadioGroup } from './radioGroup';

package/build/types/modal/Modal.story.d.ts

@@ -8,7 +8,7 @@ declare const _default: {
         onClose: () => void;
         open: boolean;
         scroll?: "content" | "viewport" | undefined;
-        position?: "center" | "top" | undefined;
+        position?: "top" | "center" | undefined;
     }) => JSX.Element;
     title: string;
 };

package/build/types/progress/Progress.d.ts

@@ -0,0 +1,11 @@
+import { ReactElement } from 'react';
+declare type ProgressProps = {
+    className?: string;
+    id: string;
+    progress: {
+        value: number;
+        max: number;
+    };
+};
+declare const Progress: ({ className, id, progress }: ProgressProps) => ReactElement | null;
+export default Progress;

package/build/types/progress/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Progress';

package/build/types/progressBar/ProgressBar.d.ts

@@ -0,0 +1,14 @@
+import { ReactElement } from 'react';
+declare type ProgressBarProps = {
+    className?: string;
+    description?: string;
+    id: string;
+    title: string;
+    progress: {
+        value: number;
+        max: number;
+    };
+    textEnd: string;
+};
+declare const ProgressBar: ({ className, description, id, title, progress, textEnd, }: ProgressBarProps) => ReactElement | null;
+export default ProgressBar;

package/build/types/progressBar/index.d.ts

@@ -0,0 +1 @@
+export { default } from './ProgressBar';

package/build/types/tooltip/Tooltip.story.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: {
     component: ({ position, children, label, className, }: {
-        position?: "left" | "right" | "bottom" | "top" | undefined;
+        position?: "top" | "bottom" | "left" | "right" | undefined;
         label: import("react").ReactNode;
     } & {
         children?: import("react").ReactNode;

package/build/types/typeahead/typeaheadInput/TypeaheadInput.d.ts

@@ -1,8 +1,14 @@
 declare class TypeaheadInput extends Component<any, any, any> {
     constructor();
+    state: {
+        inputWidth: number;
+    };
+    componentDidMount(): void;
+    componentDidUpdate(previousProps: any): void;
     recalculateWidth: () => void;
     renderInput: () => JSX.Element;
     inputRef: HTMLInputElement | null | undefined;
+    render(): JSX.Element;
     sizerRef: HTMLDivElement | null | undefined;
 }
 declare namespace TypeaheadInput {

package/build/types/upload/steps/uploadImageStep/uploadImageStep.d.ts

@@ -4,6 +4,7 @@ declare class UploadImageStep extends PureComponent<any, any, any> {
     uploadInputRef: import("react").RefObject<any>;
     onManualUpload: () => void;
     getImage: () => any;
+    render(): JSX.Element;
 }
 declare namespace UploadImageStep {
     namespace propTypes {

package/build/types/utilities/deprecatedProperty/deprecatedProperty.d.ts

@@ -2,6 +2,6 @@ export default deprecated;
 declare function deprecated(validator: any, { component, message, newProp: newProperty, expiryDate }: {
     component: any;
     message?: string | undefined;
-    newProp?: any;
-    expiryDate?: any;
+    newProp?: null | undefined;
+    expiryDate?: null | undefined;
 }): (props: any, propertyName: any, ...rest: any[]) => any;

package/build/types/withDisplayFormat/WithDisplayFormat.d.ts

@@ -8,6 +8,13 @@ declare class WithDisplayFormat extends Component<any, any, any> {
         pastedLength: number;
     } | null;
     constructor(props: any);
+    state: {
+        value: any;
+        historyNavigator: HistoryNavigator;
+        prevDisplayPattern: any;
+        triggerType: null;
+        triggerEvent: null;
+    };
     getUserAction: (unformattedValue: any) => any;
     resetEvent: () => void;
     detectUndoRedo: (event: any) => "Redo" | "Undo" | null;
@@ -20,6 +27,7 @@ declare class WithDisplayFormat extends Component<any, any, any> {
     handleOnFocus: (event: any) => void;
     handleDelete: (unformattedValue: any, action: any) => string;
     handleCursorPositioning: (action: any) => void;
+    render(): any;
 }
 declare namespace WithDisplayFormat {
     namespace propTypes {
@@ -78,4 +86,5 @@ declare namespace WithDisplayFormat {
     }
 }
 import { Component } from "react";
+import { HistoryNavigator } from "../common";
 import PropTypes from "prop-types";