@transferwise/components 0.0.0-experimental-5a0aa47 → 0.0.0-experimental-0b80b83
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/i18n/ja.json +13 -13
- package/build/index.js +304 -147
- package/build/index.js.map +1 -1
- package/build/index.mjs +306 -149
- package/build/index.mjs.map +1 -1
- package/build/types/alert/Alert.d.ts +58 -47
- package/build/types/alert/Alert.d.ts.map +1 -1
- package/build/types/alert/index.d.ts +1 -2
- package/build/types/alert/index.d.ts.map +1 -1
- package/build/types/alert/withArrow/alertArrowPositions.d.ts +9 -0
- package/build/types/alert/withArrow/alertArrowPositions.d.ts.map +1 -0
- package/build/types/alert/withArrow/index.d.ts +3 -0
- package/build/types/alert/withArrow/index.d.ts.map +1 -0
- package/build/types/alert/withArrow/withArrow.d.ts +11 -0
- package/build/types/alert/withArrow/withArrow.d.ts.map +1 -0
- package/build/types/common/propsValues/sentiment.d.ts +1 -0
- package/build/types/common/propsValues/sentiment.d.ts.map +1 -1
- package/build/types/index.d.ts +1 -1
- package/build/types/index.d.ts.map +1 -1
- package/build/types/inlineAlert/InlineAlert.d.ts +4 -2
- package/build/types/inlineAlert/InlineAlert.d.ts.map +1 -1
- package/build/types/provider/Provider.d.ts +1 -1
- package/build/types/provider/Provider.d.ts.map +1 -1
- package/build/types/statusIcon/StatusIcon.d.ts +1 -1
- package/build/types/statusIcon/StatusIcon.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/alert/Alert.js +196 -0
- package/src/alert/{Alert.spec.tsx → Alert.spec.js} +40 -43
- package/src/alert/Alert.story.tsx +2 -1
- package/src/alert/index.js +1 -0
- package/src/alert/withArrow/alertArrowPositions.ts +9 -0
- package/src/alert/withArrow/index.js +2 -0
- package/src/alert/withArrow/withArrow.js +50 -0
- package/src/alert/withArrow/withArrow.spec.js +51 -0
- package/src/common/propsValues/sentiment.ts +10 -0
- package/src/i18n/ja.json +13 -13
- package/src/index.ts +1 -1
- package/src/inlineAlert/InlineAlert.spec.tsx +7 -0
- package/src/inlineAlert/InlineAlert.tsx +47 -19
- package/src/provider/Provider.tsx +2 -1
- package/src/statusIcon/StatusIcon.tsx +14 -14
- package/src/alert/Alert.tsx +0 -223
- package/src/alert/index.ts +0 -2
|
@@ -1,47 +1,58 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
export
|
|
4
|
-
|
|
5
|
-
href: string;
|
|
6
|
-
target?: string;
|
|
7
|
-
text: React.ReactNode;
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
type
|
|
11
|
-
|
|
12
|
-
export type
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
/**
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
|
|
3
|
+
export interface AlertAction {
|
|
4
|
+
"aria-label"?: string;
|
|
5
|
+
href: string;
|
|
6
|
+
target?: string;
|
|
7
|
+
text: React.ReactNode;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
export type AlertType = "negative" | "neutral" | "positive" | "warning" | "info" | "error" | "success";
|
|
11
|
+
|
|
12
|
+
export type AlertVariant = "desktop" | "mobile";
|
|
13
|
+
|
|
14
|
+
export interface AlertProps {
|
|
15
|
+
/**
|
|
16
|
+
* An optional call to action to sit under the main body of the alert. If your label is short, use aria-label to provide more context
|
|
17
|
+
*/
|
|
18
|
+
action?: AlertAction;
|
|
19
|
+
className?: string;
|
|
20
|
+
/**
|
|
21
|
+
* An optional icon. If not provided, we will default the icon to something appropriate for the type
|
|
22
|
+
*/
|
|
23
|
+
icon?: React.ReactElement<any>;
|
|
24
|
+
/**
|
|
25
|
+
* Title for the alert component
|
|
26
|
+
*/
|
|
27
|
+
title?: string;
|
|
28
|
+
/**
|
|
29
|
+
* The main body of the alert. Accepts plain text and bold words specified with **double stars
|
|
30
|
+
*/
|
|
31
|
+
message?: any;
|
|
32
|
+
/**
|
|
33
|
+
* The presence of the onDismiss handler will trigger the visibility of the close button
|
|
34
|
+
*/
|
|
35
|
+
onDismiss?: (...args: any[])=>any;
|
|
36
|
+
/**
|
|
37
|
+
* The type dictates which icon and colour will be used
|
|
38
|
+
*/
|
|
39
|
+
type?: AlertType;
|
|
40
|
+
variant?: AlertVariant;
|
|
41
|
+
/**
|
|
42
|
+
* @deprecated no arrow for `Alert` component anymore, consider to use [`InlineAlert`](https://transferwise.github.io/neptune-web/components/alerts/InlineAlert) component
|
|
43
|
+
*/
|
|
44
|
+
arrow?: any;
|
|
45
|
+
/**
|
|
46
|
+
* @deprecated use `message` property instead
|
|
47
|
+
*/
|
|
48
|
+
children?: any;
|
|
49
|
+
/**
|
|
50
|
+
* @deprecated use `onDismiss` instead
|
|
51
|
+
*/
|
|
52
|
+
dismissible?: any;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
declare const Alert: React.FC<AlertProps>;
|
|
56
|
+
|
|
57
|
+
export default Alert;
|
|
58
|
+
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../src/alert/Alert.
|
|
1
|
+
{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../src/alert/Alert.js"],"names":[],"mappings":";AA8BA,gEA2FC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/alert/index.
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/alert/index.js"],"names":[],"mappings":""}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alertArrowPositions.d.ts","sourceRoot":"","sources":["../../../../src/alert/withArrow/alertArrowPositions.ts"],"names":[],"mappings":"AACA,oBAAY,aAAa;IACvB,QAAQ,YAAY;IACpB,GAAG,cAAc;IACjB,SAAS,aAAa;IACtB,WAAW,cAAc;IACzB,MAAM,gBAAgB;IACtB,YAAY,eAAe;CAC5B"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/alert/withArrow/index.js"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export default withArrow;
|
|
2
|
+
declare function withArrow(Alert: any, arrow: any): {
|
|
3
|
+
(props: any): import("react").JSX.Element;
|
|
4
|
+
propTypes: {
|
|
5
|
+
className: any;
|
|
6
|
+
};
|
|
7
|
+
defaultProps: {
|
|
8
|
+
className: undefined;
|
|
9
|
+
};
|
|
10
|
+
};
|
|
11
|
+
//# sourceMappingURL=withArrow.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"withArrow.d.ts","sourceRoot":"","sources":["../../../../src/alert/withArrow/withArrow.js"],"names":[],"mappings":";AAKA;;;;;;;;EAkBC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sentiment.d.ts","sourceRoot":"","sources":["../../../../src/common/propsValues/sentiment.ts"],"names":[],"mappings":"AAAA,oBAAY,SAAS;IACnB,QAAQ,aAAa;IACrB,OAAO,YAAY;IACnB,QAAQ,aAAa;IACrB,OAAO,YAAY;IACnB,OAAO,YAAY;IAEnB;;OAEG;IACH,IAAI,SAAS;IACb;;OAEG;IACH,KAAK,UAAU;IACf;;OAEG;IACH,OAAO,YAAY;CACpB"}
|
|
1
|
+
{"version":3,"file":"sentiment.d.ts","sourceRoot":"","sources":["../../../../src/common/propsValues/sentiment.ts"],"names":[],"mappings":"AAAA,oBAAY,SAAS;IACnB,QAAQ,aAAa;IACrB,OAAO,YAAY;IACnB,QAAQ,aAAa;IACrB,OAAO,YAAY;IACnB,OAAO,YAAY;IAEnB;;OAEG;IACH,IAAI,SAAS;IACb;;OAEG;IACH,KAAK,UAAU;IACf;;OAEG;IACH,OAAO,YAAY;CACpB;AAED,MAAM,MAAM,eAAe,GACvB,UAAU,GACV,SAAS,GACT,UAAU,GACV,SAAS,GACT,SAAS,GACT,MAAM,GACN,OAAO,GACP,SAAS,CAAC"}
|
package/build/types/index.d.ts
CHANGED
|
@@ -4,7 +4,6 @@
|
|
|
4
4
|
export type { AccordionProps, AccordionItem } from './accordion';
|
|
5
5
|
export type { AvatarProps } from './avatar';
|
|
6
6
|
export type { ActionOptionProps } from './actionOption';
|
|
7
|
-
export type { AlertProps, AlertAction, AlertArrowPosition, AlertType } from './alert';
|
|
8
7
|
export type { BadgeProps } from './badge';
|
|
9
8
|
export type { CircularButtonProps } from './circularButton';
|
|
10
9
|
export type { DecisionProps } from './decision/Decision';
|
|
@@ -148,6 +147,7 @@ export { AvatarType } from './avatar';
|
|
|
148
147
|
export { InfoPresentation } from './info';
|
|
149
148
|
export { UploadStep } from './upload';
|
|
150
149
|
export { DecisionPresentation, DecisionType } from './decision';
|
|
150
|
+
export { AlertArrowPosition } from './alert/withArrow';
|
|
151
151
|
export { LogoType } from './logo';
|
|
152
152
|
export { FileType } from './common';
|
|
153
153
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,YAAY,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AACjE,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAC5C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACxD,YAAY,EAAE,UAAU,EAAE,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
2
|
import { Sentiment } from '../common';
|
|
3
|
+
import { SentimentString } from '../common/propsValues/sentiment';
|
|
3
4
|
export interface InlineAlertProps {
|
|
4
5
|
id?: string;
|
|
5
|
-
type?:
|
|
6
|
+
type?: Sentiment | SentimentString;
|
|
6
7
|
className?: string;
|
|
7
8
|
children: ReactNode;
|
|
8
9
|
}
|
|
9
|
-
|
|
10
|
+
declare const InlineAlert: ({ id, type, className, children }: InlineAlertProps) => import("react").JSX.Element;
|
|
11
|
+
export default InlineAlert;
|
|
10
12
|
//# sourceMappingURL=InlineAlert.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InlineAlert.d.ts","sourceRoot":"","sources":["../../../src/inlineAlert/InlineAlert.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"InlineAlert.d.ts","sourceRoot":"","sources":["../../../src/inlineAlert/InlineAlert.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlC,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtC,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAElE,MAAM,WAAW,gBAAgB;IAC/B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,SAAS,GAAG,eAAe,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAOD,QAAA,MAAM,WAAW,sCAA2D,gBAAgB,gCAmC3F,CAAC;AAEF,eAAe,WAAW,CAAC"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { ResolvedIntlConfig } from 'react-intl';
|
|
3
3
|
export interface ProviderProps {
|
|
4
|
-
i18n: Pick<ResolvedIntlConfig, 'locale' | 'messages'
|
|
4
|
+
i18n: Pick<ResolvedIntlConfig, 'locale' | 'messages'> & Partial<Pick<ResolvedIntlConfig, 'defaultRichTextElements'>>;
|
|
5
5
|
children?: React.ReactNode;
|
|
6
6
|
}
|
|
7
7
|
export default function Provider({ i18n, children }: ProviderProps): import("react").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Provider.d.ts","sourceRoot":"","sources":["../../../src/provider/Provider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAgB,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAQ9D,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,IAAI,CAAC,kBAAkB,EAAE,QAAQ,GAAG,UAAU,
|
|
1
|
+
{"version":3,"file":"Provider.d.ts","sourceRoot":"","sources":["../../../src/provider/Provider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAgB,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAQ9D,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,IAAI,CAAC,kBAAkB,EAAE,QAAQ,GAAG,UAAU,CAAC,GACnD,OAAO,CAAC,IAAI,CAAC,kBAAkB,EAAE,yBAAyB,CAAC,CAAC,CAAC;IAC/D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,aAAa,+BA8BjE"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { SizeSmall, SizeMedium, SizeLarge, Sentiment } from '../common';
|
|
3
3
|
export type StatusIconProps = {
|
|
4
|
-
sentiment:
|
|
4
|
+
sentiment: Sentiment;
|
|
5
5
|
size: SizeSmall | SizeMedium | SizeLarge;
|
|
6
6
|
};
|
|
7
7
|
declare const StatusIcon: ({ sentiment, size }: StatusIconProps) => import("react").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StatusIcon.d.ts","sourceRoot":"","sources":["../../../src/statusIcon/StatusIcon.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,
|
|
1
|
+
{"version":3,"file":"StatusIcon.d.ts","sourceRoot":"","sources":["../../../src/statusIcon/StatusIcon.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,EAAQ,MAAM,WAAW,CAAC;AAE9E,MAAM,MAAM,eAAe,GAAG;IAC5B,SAAS,EAAE,SAAS,CAAC;IACrB,IAAI,EAAE,SAAS,GAAG,UAAU,GAAG,SAAS,CAAC;CAC1C,CAAC;AAEF,QAAA,MAAM,UAAU,wBAA2D,eAAe,gCAuBzF,CAAC;AAEF,eAAe,UAAU,CAAC"}
|
package/package.json
CHANGED
|
@@ -0,0 +1,196 @@
|
|
|
1
|
+
import {
|
|
2
|
+
InfoCircle,
|
|
3
|
+
Warning as AlertTriangle,
|
|
4
|
+
CrossCircle,
|
|
5
|
+
CheckCircle,
|
|
6
|
+
Clock,
|
|
7
|
+
} from '@transferwise/icons';
|
|
8
|
+
import { useTheme } from '@wise/components-theming';
|
|
9
|
+
import classNames from 'classnames';
|
|
10
|
+
import PropTypes from 'prop-types';
|
|
11
|
+
import { useState, useRef } from 'react';
|
|
12
|
+
import requiredIf from 'react-required-if';
|
|
13
|
+
|
|
14
|
+
import Body from '../body/Body';
|
|
15
|
+
import { Sentiment, Size, Typography, Variant } from '../common';
|
|
16
|
+
import { CloseButton } from '../common/closeButton';
|
|
17
|
+
import Link from '../link';
|
|
18
|
+
import StatusIcon from '../statusIcon';
|
|
19
|
+
import Title from '../title/Title';
|
|
20
|
+
import { logActionRequiredIf, deprecated } from '../utilities';
|
|
21
|
+
|
|
22
|
+
import InlineMarkdown from './inlineMarkdown';
|
|
23
|
+
import withArrow from './withArrow';
|
|
24
|
+
|
|
25
|
+
const deprecatedTypeMap = {
|
|
26
|
+
[Sentiment.SUCCESS]: Sentiment.POSITIVE,
|
|
27
|
+
[Sentiment.INFO]: Sentiment.NEUTRAL,
|
|
28
|
+
[Sentiment.ERROR]: Sentiment.NEGATIVE,
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
const Alert = (props) => {
|
|
32
|
+
const { isModern } = useTheme();
|
|
33
|
+
|
|
34
|
+
const iconTypeMap = {
|
|
35
|
+
[Sentiment.POSITIVE]: CheckCircle,
|
|
36
|
+
[Sentiment.NEUTRAL]: InfoCircle,
|
|
37
|
+
[Sentiment.WARNING]: AlertTriangle,
|
|
38
|
+
[Sentiment.NEGATIVE]: CrossCircle,
|
|
39
|
+
[Sentiment.PENDING]: Clock,
|
|
40
|
+
};
|
|
41
|
+
|
|
42
|
+
const [shouldFire, setShouldFire] = useState(false);
|
|
43
|
+
const { arrow, action, children, className, icon, onDismiss, message, title, type, variant } =
|
|
44
|
+
props;
|
|
45
|
+
const closeButtonReference = useRef(null);
|
|
46
|
+
if (arrow) {
|
|
47
|
+
const AlertWithArrow = withArrow(Alert, arrow);
|
|
48
|
+
return <AlertWithArrow {...props} />;
|
|
49
|
+
}
|
|
50
|
+
logActionRequired(props);
|
|
51
|
+
const mappedType = deprecatedTypeMap[type] || type;
|
|
52
|
+
const Icon = iconTypeMap[mappedType];
|
|
53
|
+
|
|
54
|
+
function generateIcon() {
|
|
55
|
+
if (icon) {
|
|
56
|
+
return <div className="alert__icon">{icon}</div>;
|
|
57
|
+
}
|
|
58
|
+
if (isModern) {
|
|
59
|
+
return <StatusIcon size={Size.LARGE} sentiment={mappedType} />;
|
|
60
|
+
} else {
|
|
61
|
+
return <Icon size={24} />;
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
const handleTouchStart = () => setShouldFire(true);
|
|
66
|
+
const handleTouchMove = () => setShouldFire(false);
|
|
67
|
+
const handleTouchEnd = (event) => {
|
|
68
|
+
if (shouldFire && action) {
|
|
69
|
+
// Check if current event is triggered from closeButton
|
|
70
|
+
if (closeButtonReference?.current && !closeButtonReference.current.contains(event.target)) {
|
|
71
|
+
if (action?.target === '_blank') {
|
|
72
|
+
window.top.open(action.href);
|
|
73
|
+
} else {
|
|
74
|
+
window.top.location.assign(action.href);
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
setShouldFire(false);
|
|
79
|
+
};
|
|
80
|
+
return (
|
|
81
|
+
<div
|
|
82
|
+
className={classNames('alert d-flex', `alert-${mappedType}`, className)}
|
|
83
|
+
data-testid="alert"
|
|
84
|
+
onTouchStart={handleTouchStart}
|
|
85
|
+
onTouchEnd={handleTouchEnd}
|
|
86
|
+
onTouchMove={handleTouchMove}
|
|
87
|
+
>
|
|
88
|
+
<div
|
|
89
|
+
className={classNames('alert__content', 'd-flex', 'flex-grow-1', variant)}
|
|
90
|
+
data-testid={variant}
|
|
91
|
+
>
|
|
92
|
+
{generateIcon()}
|
|
93
|
+
<div className="alert__message">
|
|
94
|
+
<div role={Sentiment.NEGATIVE === mappedType ? 'alert' : 'status'}>
|
|
95
|
+
{title && (
|
|
96
|
+
<Title className="m-b-1" type={Typography.TITLE_BODY}>
|
|
97
|
+
{title}
|
|
98
|
+
</Title>
|
|
99
|
+
)}
|
|
100
|
+
<Body as="span" className="d-block" type={Typography.BODY_LARGE}>
|
|
101
|
+
{children || <InlineMarkdown>{message}</InlineMarkdown>}
|
|
102
|
+
</Body>
|
|
103
|
+
</div>
|
|
104
|
+
{action && (
|
|
105
|
+
<Link
|
|
106
|
+
href={action.href}
|
|
107
|
+
className="m-t-1"
|
|
108
|
+
aria-label={action['aria-label']}
|
|
109
|
+
target={action.target}
|
|
110
|
+
type={Typography.LINK_LARGE}
|
|
111
|
+
>
|
|
112
|
+
{action.text}
|
|
113
|
+
</Link>
|
|
114
|
+
)}
|
|
115
|
+
</div>
|
|
116
|
+
</div>
|
|
117
|
+
{onDismiss && (
|
|
118
|
+
<CloseButton ref={closeButtonReference} className="m-l-2" onClick={onDismiss} />
|
|
119
|
+
)}
|
|
120
|
+
</div>
|
|
121
|
+
);
|
|
122
|
+
};
|
|
123
|
+
|
|
124
|
+
const deprecatedTypeMapMessage = {
|
|
125
|
+
[Sentiment.SUCCESS]: 'Sentiment.POSITIVE',
|
|
126
|
+
[Sentiment.INFO]: 'Sentiment.NEUTRAL',
|
|
127
|
+
[Sentiment.ERROR]: 'Sentiment.NEGATIVE',
|
|
128
|
+
};
|
|
129
|
+
|
|
130
|
+
const deprecatedTypes = Object.keys(deprecatedTypeMap);
|
|
131
|
+
|
|
132
|
+
function logActionRequired({ size, type }) {
|
|
133
|
+
logActionRequiredIf(
|
|
134
|
+
'Alert no longer supports any possible variations in size. Please remove the `size` prop.',
|
|
135
|
+
!!size,
|
|
136
|
+
);
|
|
137
|
+
logActionRequiredIf(
|
|
138
|
+
`Alert has deprecated the ${type} value for the \`type\` prop. Please update to ${deprecatedTypeMapMessage[type]}.`,
|
|
139
|
+
deprecatedTypes.includes(type),
|
|
140
|
+
);
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
Alert.propTypes = {
|
|
144
|
+
/** An optional call to action to sit under the main body of the alert. If your label is short, use aria-label to provide more context */
|
|
145
|
+
action: PropTypes.shape({
|
|
146
|
+
'aria-label': PropTypes.string,
|
|
147
|
+
href: PropTypes.string.isRequired,
|
|
148
|
+
target: PropTypes.string,
|
|
149
|
+
text: PropTypes.node.isRequired,
|
|
150
|
+
}),
|
|
151
|
+
className: PropTypes.string,
|
|
152
|
+
/** An optional icon. If not provided, we will default the icon to something appropriate for the type */
|
|
153
|
+
icon: PropTypes.element,
|
|
154
|
+
/** Title for the alert component */
|
|
155
|
+
title: PropTypes.string,
|
|
156
|
+
/** The main body of the alert. Accepts plain text and bold words specified with **double stars*/
|
|
157
|
+
message: requiredIf(PropTypes.node, ({ children }) => !children),
|
|
158
|
+
/** The presence of the onDismiss handler will trigger the visibility of the close button */
|
|
159
|
+
onDismiss: PropTypes.func,
|
|
160
|
+
/** The type dictates which icon and colour will be used */
|
|
161
|
+
type: PropTypes.oneOf(['negative', 'neutral', 'positive', 'warning', 'info', 'error', 'success']),
|
|
162
|
+
variant: PropTypes.oneOf(['desktop', 'mobile']),
|
|
163
|
+
/** @deprecated no arrow for `Alert` component anymore, consider to use [`InlineAlert`](https://transferwise.github.io/neptune-web/components/alerts/InlineAlert) component */
|
|
164
|
+
arrow: deprecated(
|
|
165
|
+
PropTypes.oneOf(['up-left', 'up-center', 'up-right', 'down-left', 'down-center', 'down-right']),
|
|
166
|
+
{ component: 'Alert', expiryDate: new Date('03-01-2021') },
|
|
167
|
+
),
|
|
168
|
+
/** @deprecated use `message` property instead */
|
|
169
|
+
children: deprecated(
|
|
170
|
+
requiredIf(PropTypes.node, ({ message }) => !message),
|
|
171
|
+
{
|
|
172
|
+
component: 'Alert',
|
|
173
|
+
message:
|
|
174
|
+
'You should now use the `message` prop. Be aware `message` only accepts plain text or text with **bold** markdown.',
|
|
175
|
+
expiryDate: new Date('03-01-2021'),
|
|
176
|
+
},
|
|
177
|
+
),
|
|
178
|
+
/** @deprecated use `onDismiss` instead */
|
|
179
|
+
dismissible: deprecated(PropTypes.bool, {
|
|
180
|
+
component: 'Alert',
|
|
181
|
+
message: 'The Alert will now be considered dismissible if an `onDismiss` hander is present.',
|
|
182
|
+
expiryDate: new Date('03-01-2021'),
|
|
183
|
+
}),
|
|
184
|
+
};
|
|
185
|
+
|
|
186
|
+
Alert.defaultProps = {
|
|
187
|
+
action: undefined,
|
|
188
|
+
arrow: undefined,
|
|
189
|
+
className: undefined,
|
|
190
|
+
dismissible: undefined,
|
|
191
|
+
icon: undefined,
|
|
192
|
+
type: Sentiment.NEUTRAL,
|
|
193
|
+
variant: Variant.DESKTOP,
|
|
194
|
+
};
|
|
195
|
+
|
|
196
|
+
export default Alert;
|