@wise/art 2.7.0-beta.1 → 2.7.0
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/dist/Illustration.css +0 -19
- package/dist/common.d.ts +0 -5
- package/dist/common.d.ts.map +1 -1
- package/dist/index.d.ts +0 -3
- package/dist/index.d.ts.map +1 -1
- package/dist/index.esm.js +158 -4
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +155 -15
- package/dist/index.js.map +1 -1
- package/package.json +5 -11
- package/src/common.ts +0 -6
- package/src/illustrations/Illustration.css +0 -19
- package/src/index.ts +0 -5
- package/dist/CheckMark-365a1dc6.js +0 -39
- package/dist/CheckMark-365a1dc6.js.map +0 -1
- package/dist/CheckMark-5b996187.esm.js +0 -37
- package/dist/CheckMark-5b996187.esm.js.map +0 -1
- package/dist/Confetti-b6bfa95b.js +0 -36
- package/dist/Confetti-b6bfa95b.js.map +0 -1
- package/dist/Confetti-c865d663.esm.js +0 -34
- package/dist/Confetti-c865d663.esm.js.map +0 -1
- package/dist/Flower-1987844c.esm.js +0 -27
- package/dist/Flower-1987844c.esm.js.map +0 -1
- package/dist/Flower-385aa337.js +0 -29
- package/dist/Flower-385aa337.js.map +0 -1
- package/dist/Globe-b5acfedf.js +0 -45
- package/dist/Globe-b5acfedf.js.map +0 -1
- package/dist/Globe-df8b4bbd.esm.js +0 -43
- package/dist/Globe-df8b4bbd.esm.js.map +0 -1
- package/dist/Graph-bc618890.js +0 -33
- package/dist/Graph-bc618890.js.map +0 -1
- package/dist/Graph-e48b9d55.esm.js +0 -31
- package/dist/Graph-e48b9d55.esm.js.map +0 -1
- package/dist/Jars-b371f7ec.esm.js +0 -50
- package/dist/Jars-b371f7ec.esm.js.map +0 -1
- package/dist/Jars-b80056b7.js +0 -52
- package/dist/Jars-b80056b7.js.map +0 -1
- package/dist/Lock-0d8008b7.esm.js +0 -41
- package/dist/Lock-0d8008b7.esm.js.map +0 -1
- package/dist/Lock-841864c6.js +0 -43
- package/dist/Lock-841864c6.js.map +0 -1
- package/dist/MagnifyingGlass-7b6dda3b.esm.js +0 -30
- package/dist/MagnifyingGlass-7b6dda3b.esm.js.map +0 -1
- package/dist/MagnifyingGlass-de98441e.js +0 -32
- package/dist/MagnifyingGlass-de98441e.js.map +0 -1
- package/dist/Marble-5a115e95.esm.js +0 -42
- package/dist/Marble-5a115e95.esm.js.map +0 -1
- package/dist/Marble-c42785f3.js +0 -44
- package/dist/Marble-c42785f3.js.map +0 -1
- package/dist/MarbleCard-1792cf0c.esm.js +0 -45
- package/dist/MarbleCard-1792cf0c.esm.js.map +0 -1
- package/dist/MarbleCard-50b56966.js +0 -47
- package/dist/MarbleCard-50b56966.js.map +0 -1
- package/dist/MultiCurrency-4735dbb2.esm.js +0 -61
- package/dist/MultiCurrency-4735dbb2.esm.js.map +0 -1
- package/dist/MultiCurrency-fcf4b9a2.js +0 -63
- package/dist/MultiCurrency-fcf4b9a2.js.map +0 -1
- package/dist/Plane-1e15b49c.esm.js +0 -37
- package/dist/Plane-1e15b49c.esm.js.map +0 -1
- package/dist/Plane-91b11234.js +0 -39
- package/dist/Plane-91b11234.js.map +0 -1
- package/dist/Scene-3830de67.esm.js +0 -48
- package/dist/Scene-3830de67.esm.js.map +0 -1
- package/dist/Scene-fa187d3a.js +0 -50
- package/dist/Scene-fa187d3a.js.map +0 -1
- package/dist/illustrations3d/Illustration3d.d.ts +0 -11
- package/dist/illustrations3d/Illustration3d.d.ts.map +0 -1
- package/dist/illustrations3d/Scene.d.ts +0 -9
- package/dist/illustrations3d/Scene.d.ts.map +0 -1
- package/dist/illustrations3d/index.d.ts +0 -5
- package/dist/illustrations3d/index.d.ts.map +0 -1
- package/dist/illustrations3d/models/CheckMark.d.ts +0 -4
- package/dist/illustrations3d/models/CheckMark.d.ts.map +0 -1
- package/dist/illustrations3d/models/Confetti.d.ts +0 -4
- package/dist/illustrations3d/models/Confetti.d.ts.map +0 -1
- package/dist/illustrations3d/models/Flower.d.ts +0 -4
- package/dist/illustrations3d/models/Flower.d.ts.map +0 -1
- package/dist/illustrations3d/models/Globe.d.ts +0 -4
- package/dist/illustrations3d/models/Globe.d.ts.map +0 -1
- package/dist/illustrations3d/models/Graph.d.ts +0 -4
- package/dist/illustrations3d/models/Graph.d.ts.map +0 -1
- package/dist/illustrations3d/models/Jars.d.ts +0 -4
- package/dist/illustrations3d/models/Jars.d.ts.map +0 -1
- package/dist/illustrations3d/models/Lock.d.ts +0 -4
- package/dist/illustrations3d/models/Lock.d.ts.map +0 -1
- package/dist/illustrations3d/models/MagnifyingGlass.d.ts +0 -4
- package/dist/illustrations3d/models/MagnifyingGlass.d.ts.map +0 -1
- package/dist/illustrations3d/models/Marble.d.ts +0 -4
- package/dist/illustrations3d/models/Marble.d.ts.map +0 -1
- package/dist/illustrations3d/models/MarbleCard.d.ts +0 -4
- package/dist/illustrations3d/models/MarbleCard.d.ts.map +0 -1
- package/dist/illustrations3d/models/MultiCurrency.d.ts +0 -4
- package/dist/illustrations3d/models/MultiCurrency.d.ts.map +0 -1
- package/dist/illustrations3d/models/Plane.d.ts +0 -4
- package/dist/illustrations3d/models/Plane.d.ts.map +0 -1
- package/dist/illustrations3d/utils.d.ts +0 -9
- package/dist/illustrations3d/utils.d.ts.map +0 -1
- package/dist/index-36ff762e.js +0 -332
- package/dist/index-36ff762e.js.map +0 -1
- package/dist/index-76341731.esm.js +0 -325
- package/dist/index-76341731.esm.js.map +0 -1
- package/src/illustrations3d/Illustration3d.stories.tsx +0 -89
- package/src/illustrations3d/Illustration3d.tsx +0 -133
- package/src/illustrations3d/Scene.tsx +0 -54
- package/src/illustrations3d/index.ts +0 -6
- package/src/illustrations3d/models/CheckMark.tsx +0 -30
- package/src/illustrations3d/models/Confetti.tsx +0 -29
- package/src/illustrations3d/models/Flower.tsx +0 -24
- package/src/illustrations3d/models/Globe.tsx +0 -41
- package/src/illustrations3d/models/Graph.tsx +0 -26
- package/src/illustrations3d/models/Jars.tsx +0 -47
- package/src/illustrations3d/models/Lock.tsx +0 -38
- package/src/illustrations3d/models/MagnifyingGlass.tsx +0 -30
- package/src/illustrations3d/models/Marble.tsx +0 -47
- package/src/illustrations3d/models/MarbleCard.tsx +0 -50
- package/src/illustrations3d/models/MultiCurrency.tsx +0 -58
- package/src/illustrations3d/models/Plane.tsx +0 -33
- package/src/illustrations3d/utils.ts +0 -68
package/dist/Illustration.css
CHANGED
|
@@ -6,22 +6,3 @@ img.wds-illustration {
|
|
|
6
6
|
.wds-illustration-padding {
|
|
7
7
|
padding: 24px;
|
|
8
8
|
}
|
|
9
|
-
|
|
10
|
-
.wds-illustration-3d {
|
|
11
|
-
display: inline-flex;
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
.wds-illustration-3d-small {
|
|
15
|
-
width: 200px;
|
|
16
|
-
height: 200px;
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
.wds-illustration-3d-medium {
|
|
20
|
-
width: 300px;
|
|
21
|
-
height: 300px;
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
.wds-illustration-3d-large {
|
|
25
|
-
width: 500px;
|
|
26
|
-
height: 500px;
|
|
27
|
-
}
|
package/dist/common.d.ts
CHANGED
|
@@ -3,11 +3,6 @@ export declare enum Sizes {
|
|
|
3
3
|
MEDIUM = "medium",
|
|
4
4
|
LARGE = "large"
|
|
5
5
|
}
|
|
6
|
-
export declare const ImageSizes: {
|
|
7
|
-
small: number;
|
|
8
|
-
medium: number;
|
|
9
|
-
large: number;
|
|
10
|
-
};
|
|
11
6
|
export type LargeSize = 'large';
|
|
12
7
|
export type MediumSize = 'medium';
|
|
13
8
|
export type SmallSize = 'small';
|
package/dist/common.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../src/common.ts"],"names":[],"mappings":"AAAA,oBAAY,KAAK;IACf,KAAK,UAAU;IACf,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB;AAED,
|
|
1
|
+
{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../src/common.ts"],"names":[],"mappings":"AAAA,oBAAY,KAAK;IACf,KAAK,UAAU;IACf,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB;AAED,MAAM,MAAM,SAAS,GAAG,OAAO,CAAC;AAChC,MAAM,MAAM,UAAU,GAAG,QAAQ,CAAC;AAClC,MAAM,MAAM,SAAS,GAAG,OAAO,CAAC;AAEhC,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC"}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,10 +1,7 @@
|
|
|
1
1
|
export { Flag } from './flags';
|
|
2
2
|
export { default as Illustration } from './illustrations';
|
|
3
|
-
export { default as Illustration3d } from './illustrations3d';
|
|
4
3
|
export { Assets } from './illustrations';
|
|
5
4
|
export { Sizes } from './common';
|
|
6
5
|
export type { FlagProps } from './flags';
|
|
7
6
|
export type { IllustrationNames, IllustrationProps } from './illustrations';
|
|
8
|
-
export type { Illustration3dNames, Illustration3dProps } from './illustrations3d';
|
|
9
|
-
export { is3dIllustrationSupported } from './illustrations3d';
|
|
10
7
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAEjC,YAAY,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACzC,YAAY,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC"}
|
package/dist/index.esm.js
CHANGED
|
@@ -1,5 +1,159 @@
|
|
|
1
|
-
|
|
2
|
-
import 'react';
|
|
3
|
-
import '
|
|
4
|
-
|
|
1
|
+
import { useState, useEffect, forwardRef } from 'react';
|
|
2
|
+
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
3
|
+
import { clsx } from 'clsx';
|
|
4
|
+
|
|
5
|
+
const unknownFlagName = 'wise';
|
|
6
|
+
const Flag = ({
|
|
7
|
+
code,
|
|
8
|
+
intrinsicSize = 64
|
|
9
|
+
}) => {
|
|
10
|
+
const [fallback, setFallback] = useState(null);
|
|
11
|
+
useEffect(() => {
|
|
12
|
+
setFallback(null);
|
|
13
|
+
}, [code]);
|
|
14
|
+
const detailed = intrinsicSize >= 150;
|
|
15
|
+
const name = fallback !== 'unknown' ? `${code.toLowerCase()}${fallback == null && detailed ? '-detailed' : ''}` : unknownFlagName;
|
|
16
|
+
return /*#__PURE__*/jsx("img", {
|
|
17
|
+
src: `https://wise.com/web-art/assets/flags/${name}.svg`,
|
|
18
|
+
alt: "",
|
|
19
|
+
width: intrinsicSize,
|
|
20
|
+
height: intrinsicSize,
|
|
21
|
+
onError: () => {
|
|
22
|
+
setFallback(prev => prev == null && detailed ? 'simple' : 'unknown');
|
|
23
|
+
}
|
|
24
|
+
});
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
var Sizes;
|
|
28
|
+
(function (Sizes) {
|
|
29
|
+
Sizes["SMALL"] = "small";
|
|
30
|
+
Sizes["MEDIUM"] = "medium";
|
|
31
|
+
Sizes["LARGE"] = "large";
|
|
32
|
+
})(Sizes || (Sizes = {}));
|
|
33
|
+
|
|
34
|
+
const imageSizes = {
|
|
35
|
+
[Sizes.SMALL]: 200,
|
|
36
|
+
[Sizes.MEDIUM]: 300,
|
|
37
|
+
[Sizes.LARGE]: 500
|
|
38
|
+
};
|
|
39
|
+
const Illustration = /*#__PURE__*/forwardRef(({
|
|
40
|
+
id,
|
|
41
|
+
name,
|
|
42
|
+
alt,
|
|
43
|
+
loading = 'eager',
|
|
44
|
+
className,
|
|
45
|
+
size = Sizes.MEDIUM,
|
|
46
|
+
disablePadding = false
|
|
47
|
+
}, ref) => {
|
|
48
|
+
const {
|
|
49
|
+
SMALL,
|
|
50
|
+
MEDIUM
|
|
51
|
+
} = Sizes;
|
|
52
|
+
return name ? /*#__PURE__*/jsxs("picture", {
|
|
53
|
+
children: [size === Sizes.LARGE || size === Sizes.MEDIUM ? /*#__PURE__*/jsxs(Fragment, {
|
|
54
|
+
children: [/*#__PURE__*/jsx("source", {
|
|
55
|
+
width: imageSizes[SMALL],
|
|
56
|
+
height: imageSizes[SMALL],
|
|
57
|
+
media: "(max-width: 575px)",
|
|
58
|
+
srcSet: `${defineSrc(name, SMALL, '1x')}, ${defineSrc(name, SMALL, '2x')} 2x`
|
|
59
|
+
}), size !== Sizes.MEDIUM ? /*#__PURE__*/jsx("source", {
|
|
60
|
+
width: imageSizes[MEDIUM],
|
|
61
|
+
height: imageSizes[MEDIUM],
|
|
62
|
+
media: "(max-width: 992px)",
|
|
63
|
+
srcSet: `${defineSrc(name, MEDIUM, '1x')}, ${defineSrc(name, MEDIUM, '2x')} 2x`
|
|
64
|
+
}) : null]
|
|
65
|
+
}) : null, /*#__PURE__*/jsx("img", {
|
|
66
|
+
id: id,
|
|
67
|
+
ref: ref,
|
|
68
|
+
alt: alt ?? name.replace('-', ' '),
|
|
69
|
+
"data-testid": `wds-${name}-illustration`,
|
|
70
|
+
className: clsx(`wds-illustration wds-illustration-${name}`, className, !disablePadding && 'wds-illustration-padding'),
|
|
71
|
+
loading: loading,
|
|
72
|
+
src: defineSrc(name, size, '1x'),
|
|
73
|
+
srcSet: `${defineSrc(name, size, '2x')} 2x`,
|
|
74
|
+
width: imageSizes[size],
|
|
75
|
+
height: imageSizes[size]
|
|
76
|
+
})]
|
|
77
|
+
}) : null;
|
|
78
|
+
});
|
|
79
|
+
function defineSrc(illustration, size, descriptor) {
|
|
80
|
+
return `https://wise.com/web-art/assets/illustrations/${illustration}-${size}@${descriptor}.webp`;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
/*
|
|
84
|
+
*
|
|
85
|
+
* DON'T MODIFY THIS FILE IT'S AUTO GENERATED
|
|
86
|
+
* See: `scripts/generate-i10s-metadata.mjs`
|
|
87
|
+
*
|
|
88
|
+
*/
|
|
89
|
+
var Assets;
|
|
90
|
+
(function (Assets) {
|
|
91
|
+
Assets["BELL"] = "bell";
|
|
92
|
+
Assets["BRIEFCASE"] = "briefcase";
|
|
93
|
+
Assets["BUSINESS_CARD"] = "business-card";
|
|
94
|
+
Assets["CALENDAR"] = "calendar";
|
|
95
|
+
Assets["CHECK_MARK"] = "check-mark";
|
|
96
|
+
Assets["CLOSED_WINDOW"] = "closed-window";
|
|
97
|
+
Assets["COIN_PILE_DOWN"] = "coin-pile-down";
|
|
98
|
+
Assets["COIN_PILE_UP"] = "coin-pile-up";
|
|
99
|
+
Assets["CONFETTI"] = "confetti";
|
|
100
|
+
Assets["CONSTRUCTION_FENCE"] = "construction-fence";
|
|
101
|
+
Assets["CONVERT"] = "convert";
|
|
102
|
+
Assets["COOKIE"] = "cookie";
|
|
103
|
+
Assets["DIGITAL_CARD_2"] = "digital-card-2";
|
|
104
|
+
Assets["DIGITAL_CARD"] = "digital-card";
|
|
105
|
+
Assets["DOCUMENTS"] = "documents";
|
|
106
|
+
Assets["DOOR"] = "door";
|
|
107
|
+
Assets["ECO_CARD"] = "eco-card";
|
|
108
|
+
Assets["ELECTRIC_PLUG"] = "electric-plug";
|
|
109
|
+
Assets["EMAIL_SUCCESS"] = "email-success";
|
|
110
|
+
Assets["EMAIL"] = "email";
|
|
111
|
+
Assets["EXCLAMATION_MARK"] = "exclamation-mark";
|
|
112
|
+
Assets["FLAG"] = "flag";
|
|
113
|
+
Assets["FLOWER"] = "flower";
|
|
114
|
+
Assets["GEAR"] = "gear";
|
|
115
|
+
Assets["GLOBE"] = "globe";
|
|
116
|
+
Assets["GRAPH"] = "graph";
|
|
117
|
+
Assets["HEART_2"] = "heart-2";
|
|
118
|
+
Assets["HEART_3"] = "heart-3";
|
|
119
|
+
Assets["HEART_4"] = "heart-4";
|
|
120
|
+
Assets["HEART_5"] = "heart-5";
|
|
121
|
+
Assets["HEART"] = "heart";
|
|
122
|
+
Assets["HOUSE"] = "house";
|
|
123
|
+
Assets["ID_CARD"] = "id-card";
|
|
124
|
+
Assets["INFINITE"] = "infinite";
|
|
125
|
+
Assets["INVITE_LETTER"] = "invite-letter";
|
|
126
|
+
Assets["JARS"] = "jars";
|
|
127
|
+
Assets["KEY"] = "key";
|
|
128
|
+
Assets["LIGHT_BULB"] = "light-bulb";
|
|
129
|
+
Assets["LOCK"] = "lock";
|
|
130
|
+
Assets["MAGNIFYING_GLASS"] = "magnifying-glass";
|
|
131
|
+
Assets["MAP"] = "map";
|
|
132
|
+
Assets["MARBLE_CARD_BUSINESS"] = "marble-card-business";
|
|
133
|
+
Assets["MARBLE_CARD"] = "marble-card";
|
|
134
|
+
Assets["MARBLE"] = "marble";
|
|
135
|
+
Assets["MEGAPHONE"] = "megaphone";
|
|
136
|
+
Assets["MULTI_CURRENCY"] = "multi-currency";
|
|
137
|
+
Assets["ONE_INVITE_LETTER_OPENED"] = "one-invite-letter-opened";
|
|
138
|
+
Assets["PALM_TREE"] = "palm-tree";
|
|
139
|
+
Assets["PERCENTAGE"] = "percentage";
|
|
140
|
+
Assets["PERSONAL_CARD"] = "personal-card";
|
|
141
|
+
Assets["PHONES"] = "phones";
|
|
142
|
+
Assets["PIE_CHART"] = "pie-chart";
|
|
143
|
+
Assets["PLANE_2"] = "plane-2";
|
|
144
|
+
Assets["PLANE"] = "plane";
|
|
145
|
+
Assets["PUZZLE_PIECES"] = "puzzle-pieces";
|
|
146
|
+
Assets["QUESTION_MARK"] = "question-mark";
|
|
147
|
+
Assets["RECEIVE"] = "receive";
|
|
148
|
+
Assets["REMINDER_LETTER"] = "reminder-letter";
|
|
149
|
+
Assets["SAND_TIMER"] = "sand-timer";
|
|
150
|
+
Assets["SHOPPING_BAG"] = "shopping-bag";
|
|
151
|
+
Assets["SKIP_AUTHENTICATION"] = "skip-authentication";
|
|
152
|
+
Assets["SPEECH_BUBBLE"] = "speech-bubble";
|
|
153
|
+
Assets["TOOL"] = "tool";
|
|
154
|
+
Assets["TWO_INVITE_LETTERS_OPENED"] = "two-invite-letters-opened";
|
|
155
|
+
Assets["WALLET"] = "wallet";
|
|
156
|
+
})(Assets || (Assets = {}));
|
|
157
|
+
|
|
158
|
+
export { Assets, Flag, Illustration, Sizes };
|
|
5
159
|
//# sourceMappingURL=index.esm.js.map
|
package/dist/index.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.esm.js","sources":["../src/flags/Flag.tsx","../src/common.ts","../src/illustrations/Illustration.tsx","../src/illustrations/metadata.ts"],"sourcesContent":[null,null,null,null],"names":["unknownFlagName","Flag","code","intrinsicSize","useEffect","setFallback","name","fallback","toLowerCase","detailed","_jsx","src","height","onError","Sizes","imageSizes","SMALL","MEDIUM","Illustration","forwardRef","id","alt","loading","className","size","disablePadding","ref","_jsxs","children","LARGE","_Fragment","width","media","srcSet","defineSrc","descriptor","Assets"],"mappings":"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"}
|
package/dist/index.js
CHANGED
|
@@ -1,22 +1,162 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
4
|
-
require('react');
|
|
5
|
-
require('
|
|
6
|
-
require('clsx');
|
|
3
|
+
var react = require('react');
|
|
4
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
5
|
+
var clsx = require('clsx');
|
|
7
6
|
|
|
7
|
+
const unknownFlagName = 'wise';
|
|
8
|
+
const Flag = ({
|
|
9
|
+
code,
|
|
10
|
+
intrinsicSize = 64
|
|
11
|
+
}) => {
|
|
12
|
+
const [fallback, setFallback] = react.useState(null);
|
|
13
|
+
react.useEffect(() => {
|
|
14
|
+
setFallback(null);
|
|
15
|
+
}, [code]);
|
|
16
|
+
const detailed = intrinsicSize >= 150;
|
|
17
|
+
const name = fallback !== 'unknown' ? `${code.toLowerCase()}${fallback == null && detailed ? '-detailed' : ''}` : unknownFlagName;
|
|
18
|
+
return /*#__PURE__*/jsxRuntime.jsx("img", {
|
|
19
|
+
src: `https://wise.com/web-art/assets/flags/${name}.svg`,
|
|
20
|
+
alt: "",
|
|
21
|
+
width: intrinsicSize,
|
|
22
|
+
height: intrinsicSize,
|
|
23
|
+
onError: () => {
|
|
24
|
+
setFallback(prev => prev == null && detailed ? 'simple' : 'unknown');
|
|
25
|
+
}
|
|
26
|
+
});
|
|
27
|
+
};
|
|
8
28
|
|
|
29
|
+
exports.Sizes = void 0;
|
|
30
|
+
(function (Sizes) {
|
|
31
|
+
Sizes["SMALL"] = "small";
|
|
32
|
+
Sizes["MEDIUM"] = "medium";
|
|
33
|
+
Sizes["LARGE"] = "large";
|
|
34
|
+
})(exports.Sizes || (exports.Sizes = {}));
|
|
9
35
|
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
36
|
+
const imageSizes = {
|
|
37
|
+
[exports.Sizes.SMALL]: 200,
|
|
38
|
+
[exports.Sizes.MEDIUM]: 300,
|
|
39
|
+
[exports.Sizes.LARGE]: 500
|
|
40
|
+
};
|
|
41
|
+
const Illustration = /*#__PURE__*/react.forwardRef(({
|
|
42
|
+
id,
|
|
43
|
+
name,
|
|
44
|
+
alt,
|
|
45
|
+
loading = 'eager',
|
|
46
|
+
className,
|
|
47
|
+
size = exports.Sizes.MEDIUM,
|
|
48
|
+
disablePadding = false
|
|
49
|
+
}, ref) => {
|
|
50
|
+
const {
|
|
51
|
+
SMALL,
|
|
52
|
+
MEDIUM
|
|
53
|
+
} = exports.Sizes;
|
|
54
|
+
return name ? /*#__PURE__*/jsxRuntime.jsxs("picture", {
|
|
55
|
+
children: [size === exports.Sizes.LARGE || size === exports.Sizes.MEDIUM ? /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
56
|
+
children: [/*#__PURE__*/jsxRuntime.jsx("source", {
|
|
57
|
+
width: imageSizes[SMALL],
|
|
58
|
+
height: imageSizes[SMALL],
|
|
59
|
+
media: "(max-width: 575px)",
|
|
60
|
+
srcSet: `${defineSrc(name, SMALL, '1x')}, ${defineSrc(name, SMALL, '2x')} 2x`
|
|
61
|
+
}), size !== exports.Sizes.MEDIUM ? /*#__PURE__*/jsxRuntime.jsx("source", {
|
|
62
|
+
width: imageSizes[MEDIUM],
|
|
63
|
+
height: imageSizes[MEDIUM],
|
|
64
|
+
media: "(max-width: 992px)",
|
|
65
|
+
srcSet: `${defineSrc(name, MEDIUM, '1x')}, ${defineSrc(name, MEDIUM, '2x')} 2x`
|
|
66
|
+
}) : null]
|
|
67
|
+
}) : null, /*#__PURE__*/jsxRuntime.jsx("img", {
|
|
68
|
+
id: id,
|
|
69
|
+
ref: ref,
|
|
70
|
+
alt: alt ?? name.replace('-', ' '),
|
|
71
|
+
"data-testid": `wds-${name}-illustration`,
|
|
72
|
+
className: clsx.clsx(`wds-illustration wds-illustration-${name}`, className, !disablePadding && 'wds-illustration-padding'),
|
|
73
|
+
loading: loading,
|
|
74
|
+
src: defineSrc(name, size, '1x'),
|
|
75
|
+
srcSet: `${defineSrc(name, size, '2x')} 2x`,
|
|
76
|
+
width: imageSizes[size],
|
|
77
|
+
height: imageSizes[size]
|
|
78
|
+
})]
|
|
79
|
+
}) : null;
|
|
13
80
|
});
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
81
|
+
function defineSrc(illustration, size, descriptor) {
|
|
82
|
+
return `https://wise.com/web-art/assets/illustrations/${illustration}-${size}@${descriptor}.webp`;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
/*
|
|
86
|
+
*
|
|
87
|
+
* DON'T MODIFY THIS FILE IT'S AUTO GENERATED
|
|
88
|
+
* See: `scripts/generate-i10s-metadata.mjs`
|
|
89
|
+
*
|
|
90
|
+
*/
|
|
91
|
+
exports.Assets = void 0;
|
|
92
|
+
(function (Assets) {
|
|
93
|
+
Assets["BELL"] = "bell";
|
|
94
|
+
Assets["BRIEFCASE"] = "briefcase";
|
|
95
|
+
Assets["BUSINESS_CARD"] = "business-card";
|
|
96
|
+
Assets["CALENDAR"] = "calendar";
|
|
97
|
+
Assets["CHECK_MARK"] = "check-mark";
|
|
98
|
+
Assets["CLOSED_WINDOW"] = "closed-window";
|
|
99
|
+
Assets["COIN_PILE_DOWN"] = "coin-pile-down";
|
|
100
|
+
Assets["COIN_PILE_UP"] = "coin-pile-up";
|
|
101
|
+
Assets["CONFETTI"] = "confetti";
|
|
102
|
+
Assets["CONSTRUCTION_FENCE"] = "construction-fence";
|
|
103
|
+
Assets["CONVERT"] = "convert";
|
|
104
|
+
Assets["COOKIE"] = "cookie";
|
|
105
|
+
Assets["DIGITAL_CARD_2"] = "digital-card-2";
|
|
106
|
+
Assets["DIGITAL_CARD"] = "digital-card";
|
|
107
|
+
Assets["DOCUMENTS"] = "documents";
|
|
108
|
+
Assets["DOOR"] = "door";
|
|
109
|
+
Assets["ECO_CARD"] = "eco-card";
|
|
110
|
+
Assets["ELECTRIC_PLUG"] = "electric-plug";
|
|
111
|
+
Assets["EMAIL_SUCCESS"] = "email-success";
|
|
112
|
+
Assets["EMAIL"] = "email";
|
|
113
|
+
Assets["EXCLAMATION_MARK"] = "exclamation-mark";
|
|
114
|
+
Assets["FLAG"] = "flag";
|
|
115
|
+
Assets["FLOWER"] = "flower";
|
|
116
|
+
Assets["GEAR"] = "gear";
|
|
117
|
+
Assets["GLOBE"] = "globe";
|
|
118
|
+
Assets["GRAPH"] = "graph";
|
|
119
|
+
Assets["HEART_2"] = "heart-2";
|
|
120
|
+
Assets["HEART_3"] = "heart-3";
|
|
121
|
+
Assets["HEART_4"] = "heart-4";
|
|
122
|
+
Assets["HEART_5"] = "heart-5";
|
|
123
|
+
Assets["HEART"] = "heart";
|
|
124
|
+
Assets["HOUSE"] = "house";
|
|
125
|
+
Assets["ID_CARD"] = "id-card";
|
|
126
|
+
Assets["INFINITE"] = "infinite";
|
|
127
|
+
Assets["INVITE_LETTER"] = "invite-letter";
|
|
128
|
+
Assets["JARS"] = "jars";
|
|
129
|
+
Assets["KEY"] = "key";
|
|
130
|
+
Assets["LIGHT_BULB"] = "light-bulb";
|
|
131
|
+
Assets["LOCK"] = "lock";
|
|
132
|
+
Assets["MAGNIFYING_GLASS"] = "magnifying-glass";
|
|
133
|
+
Assets["MAP"] = "map";
|
|
134
|
+
Assets["MARBLE_CARD_BUSINESS"] = "marble-card-business";
|
|
135
|
+
Assets["MARBLE_CARD"] = "marble-card";
|
|
136
|
+
Assets["MARBLE"] = "marble";
|
|
137
|
+
Assets["MEGAPHONE"] = "megaphone";
|
|
138
|
+
Assets["MULTI_CURRENCY"] = "multi-currency";
|
|
139
|
+
Assets["ONE_INVITE_LETTER_OPENED"] = "one-invite-letter-opened";
|
|
140
|
+
Assets["PALM_TREE"] = "palm-tree";
|
|
141
|
+
Assets["PERCENTAGE"] = "percentage";
|
|
142
|
+
Assets["PERSONAL_CARD"] = "personal-card";
|
|
143
|
+
Assets["PHONES"] = "phones";
|
|
144
|
+
Assets["PIE_CHART"] = "pie-chart";
|
|
145
|
+
Assets["PLANE_2"] = "plane-2";
|
|
146
|
+
Assets["PLANE"] = "plane";
|
|
147
|
+
Assets["PUZZLE_PIECES"] = "puzzle-pieces";
|
|
148
|
+
Assets["QUESTION_MARK"] = "question-mark";
|
|
149
|
+
Assets["RECEIVE"] = "receive";
|
|
150
|
+
Assets["REMINDER_LETTER"] = "reminder-letter";
|
|
151
|
+
Assets["SAND_TIMER"] = "sand-timer";
|
|
152
|
+
Assets["SHOPPING_BAG"] = "shopping-bag";
|
|
153
|
+
Assets["SKIP_AUTHENTICATION"] = "skip-authentication";
|
|
154
|
+
Assets["SPEECH_BUBBLE"] = "speech-bubble";
|
|
155
|
+
Assets["TOOL"] = "tool";
|
|
156
|
+
Assets["TWO_INVITE_LETTERS_OPENED"] = "two-invite-letters-opened";
|
|
157
|
+
Assets["WALLET"] = "wallet";
|
|
158
|
+
})(exports.Assets || (exports.Assets = {}));
|
|
159
|
+
|
|
160
|
+
exports.Flag = Flag;
|
|
161
|
+
exports.Illustration = Illustration;
|
|
22
162
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../src/flags/Flag.tsx","../src/common.ts","../src/illustrations/Illustration.tsx","../src/illustrations/metadata.ts"],"sourcesContent":[null,null,null,null],"names":["unknownFlagName","Flag","code","intrinsicSize","useEffect","setFallback","name","fallback","toLowerCase","detailed","_jsx","src","height","onError","Sizes","imageSizes","SMALL","MEDIUM","Illustration","forwardRef","id","alt","loading","className","size","disablePadding","ref","_jsxs","children","LARGE","_Fragment","width","media","srcSet","defineSrc","descriptor","Assets"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wise/art",
|
|
3
|
-
"version": "2.7.0
|
|
3
|
+
"version": "2.7.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "React library for art elements in UI",
|
|
6
6
|
"homepage": "https://github.com/transferwise/web-art#readme",
|
|
@@ -22,7 +22,6 @@
|
|
|
22
22
|
],
|
|
23
23
|
"scripts": {
|
|
24
24
|
"setup": "yarn && yarn build",
|
|
25
|
-
"load-3d-i10s": "node ./scripts/load-3d-i10s.mjs",
|
|
26
25
|
"load-i10s": "copyfiles -u 3 node_modules/wise-atoms/illustrations/**/*.png temp",
|
|
27
26
|
"load-flags": "yarn load-country-flags && yarn load-currency-flags && yarn transform-flags && yarn convert-flags-svg-to-png",
|
|
28
27
|
"load-country-flags": "copyfiles -u 3 node_modules/wise-atoms/flags/*.svg s3-bucket/flags && node ./scripts/generate-country-flags.mjs",
|
|
@@ -33,19 +32,16 @@
|
|
|
33
32
|
"generate-i10s-metadata": "node ./scripts/generate-i10s-metadata.mjs && eslint 'src/illustrations/metadata.ts' --fix",
|
|
34
33
|
"bundle": "rm -rf dist && rollup --config --sourcemap && cpx src/illustrations/Illustration.css dist/",
|
|
35
34
|
"cleanup": "rm -rf temp",
|
|
36
|
-
"build": "yarn load-i10s && yarn
|
|
35
|
+
"build": "yarn load-i10s && yarn convert-i10s-png-to-webp && yarn generate-i10s-metadata && yarn load-flags && yarn bundle && yarn cleanup",
|
|
37
36
|
"start": "storybook dev -p 3001",
|
|
38
37
|
"dev": "yarn start",
|
|
39
|
-
"test": "
|
|
38
|
+
"test": "release-to-github-with-changelog-pre-release-checks",
|
|
40
39
|
"lint-fix": "eslint 'src/**/*.{js,ts,tsx}' 'scripts/*.{mjs,js,ts,tsx}' --fix",
|
|
41
40
|
"build-docs": "storybook build -o docs && touch ./docs/.nojekyll"
|
|
42
41
|
},
|
|
43
42
|
"dependencies": {
|
|
44
43
|
"@babel/runtime": "^7.22.15",
|
|
45
|
-
"clsx": "^2.0.0"
|
|
46
|
-
"three": "^0.154.0",
|
|
47
|
-
"@react-three/fiber": "^8.13.5",
|
|
48
|
-
"@react-three/drei": "^9.78.2"
|
|
44
|
+
"clsx": "^2.0.0"
|
|
49
45
|
},
|
|
50
46
|
"devDependencies": {
|
|
51
47
|
"@babel/core": "^7.22.15",
|
|
@@ -68,7 +64,6 @@
|
|
|
68
64
|
"@types/jsdom": "^21.1.2",
|
|
69
65
|
"@types/react": "^18.2.21",
|
|
70
66
|
"@types/react-dom": "^18.2.7",
|
|
71
|
-
"@types/three": "^0.154.0",
|
|
72
67
|
"babel-plugin-optimize-clsx": "^2.6.2",
|
|
73
68
|
"copyfiles": "^2.4.1",
|
|
74
69
|
"cpx": "^1.5.0",
|
|
@@ -76,7 +71,6 @@
|
|
|
76
71
|
"glob": "^8.1.0",
|
|
77
72
|
"imagemin": "^8.0.1",
|
|
78
73
|
"imagemin-webp": "^7.0.0",
|
|
79
|
-
"gltf-pipeline": "^4.1.0",
|
|
80
74
|
"jest": "^28.1.3",
|
|
81
75
|
"jest-environment-jsdom": "^28.1.3",
|
|
82
76
|
"jsdom": "~21.1.2",
|
|
@@ -89,7 +83,7 @@
|
|
|
89
83
|
"ts-node": "10.9.1",
|
|
90
84
|
"typescript": "^4.9.5",
|
|
91
85
|
"vite": "^4.4.9",
|
|
92
|
-
"wise-atoms": "git+ssh://git@github.com:transferwise/wise-atoms.git#
|
|
86
|
+
"wise-atoms": "git+ssh://git@github.com:transferwise/wise-atoms.git#bb7a63aa66453af9c77e754586381ac5b996a176"
|
|
93
87
|
},
|
|
94
88
|
"peerDependencies": {
|
|
95
89
|
"react": ">=17",
|
package/src/common.ts
CHANGED
|
@@ -4,12 +4,6 @@ export enum Sizes {
|
|
|
4
4
|
LARGE = 'large',
|
|
5
5
|
}
|
|
6
6
|
|
|
7
|
-
export const ImageSizes = {
|
|
8
|
-
[Sizes.SMALL]: 200,
|
|
9
|
-
[Sizes.MEDIUM]: 300,
|
|
10
|
-
[Sizes.LARGE]: 500,
|
|
11
|
-
};
|
|
12
|
-
|
|
13
7
|
export type LargeSize = 'large';
|
|
14
8
|
export type MediumSize = 'medium';
|
|
15
9
|
export type SmallSize = 'small';
|
|
@@ -6,22 +6,3 @@ img.wds-illustration {
|
|
|
6
6
|
.wds-illustration-padding {
|
|
7
7
|
padding: 24px;
|
|
8
8
|
}
|
|
9
|
-
|
|
10
|
-
.wds-illustration-3d {
|
|
11
|
-
display: inline-flex;
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
.wds-illustration-3d-small {
|
|
15
|
-
width: 200px;
|
|
16
|
-
height: 200px;
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
.wds-illustration-3d-medium {
|
|
20
|
-
width: 300px;
|
|
21
|
-
height: 300px;
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
.wds-illustration-3d-large {
|
|
25
|
-
width: 500px;
|
|
26
|
-
height: 500px;
|
|
27
|
-
}
|
package/src/index.ts
CHANGED
|
@@ -1,12 +1,7 @@
|
|
|
1
1
|
export { Flag } from './flags';
|
|
2
2
|
export { default as Illustration } from './illustrations';
|
|
3
|
-
export { default as Illustration3d } from './illustrations3d';
|
|
4
|
-
|
|
5
3
|
export { Assets } from './illustrations';
|
|
6
4
|
export { Sizes } from './common';
|
|
7
5
|
|
|
8
6
|
export type { FlagProps } from './flags';
|
|
9
7
|
export type { IllustrationNames, IllustrationProps } from './illustrations';
|
|
10
|
-
export type { Illustration3dNames, Illustration3dProps } from './illustrations3d';
|
|
11
|
-
|
|
12
|
-
export { is3dIllustrationSupported } from './illustrations3d';
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var drei = require('@react-three/drei');
|
|
4
|
-
var fiber = require('@react-three/fiber');
|
|
5
|
-
var react = require('react');
|
|
6
|
-
var three = require('three');
|
|
7
|
-
var index = require('./index-36ff762e.js');
|
|
8
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
9
|
-
require('clsx');
|
|
10
|
-
|
|
11
|
-
const CheckMark = () => {
|
|
12
|
-
const modelRef = react.useRef();
|
|
13
|
-
const model = drei.useGLTF(index.defineSrc('check-mark.gltf'));
|
|
14
|
-
const {
|
|
15
|
-
animations,
|
|
16
|
-
scene
|
|
17
|
-
} = model;
|
|
18
|
-
const lights = fiber.useLoader(three.ObjectLoader, index.defineSrc('check-mark-light.json'));
|
|
19
|
-
const {
|
|
20
|
-
mixer,
|
|
21
|
-
clips
|
|
22
|
-
} = drei.useAnimations(animations, modelRef);
|
|
23
|
-
fiber.useFrame(() => {
|
|
24
|
-
model.materials['Standard'].map.offset.x += -0.0025;
|
|
25
|
-
mixer.clipAction(clips[0]).play().setLoop(three.LoopOnce, 1);
|
|
26
|
-
});
|
|
27
|
-
return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
28
|
-
children: [/*#__PURE__*/jsxRuntime.jsx("primitive", {
|
|
29
|
-
ref: modelRef,
|
|
30
|
-
scale: 1.4,
|
|
31
|
-
object: scene
|
|
32
|
-
}), /*#__PURE__*/jsxRuntime.jsx("primitive", {
|
|
33
|
-
object: lights
|
|
34
|
-
})]
|
|
35
|
-
});
|
|
36
|
-
};
|
|
37
|
-
|
|
38
|
-
exports.default = CheckMark;
|
|
39
|
-
//# sourceMappingURL=CheckMark-365a1dc6.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CheckMark-365a1dc6.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
import { useGLTF, useAnimations } from '@react-three/drei';
|
|
2
|
-
import { useLoader, useFrame } from '@react-three/fiber';
|
|
3
|
-
import { useRef } from 'react';
|
|
4
|
-
import { ObjectLoader, LoopOnce } from 'three';
|
|
5
|
-
import { d as defineSrc } from './index-76341731.esm.js';
|
|
6
|
-
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
|
|
7
|
-
import 'clsx';
|
|
8
|
-
|
|
9
|
-
const CheckMark = () => {
|
|
10
|
-
const modelRef = useRef();
|
|
11
|
-
const model = useGLTF(defineSrc('check-mark.gltf'));
|
|
12
|
-
const {
|
|
13
|
-
animations,
|
|
14
|
-
scene
|
|
15
|
-
} = model;
|
|
16
|
-
const lights = useLoader(ObjectLoader, defineSrc('check-mark-light.json'));
|
|
17
|
-
const {
|
|
18
|
-
mixer,
|
|
19
|
-
clips
|
|
20
|
-
} = useAnimations(animations, modelRef);
|
|
21
|
-
useFrame(() => {
|
|
22
|
-
model.materials['Standard'].map.offset.x += -0.0025;
|
|
23
|
-
mixer.clipAction(clips[0]).play().setLoop(LoopOnce, 1);
|
|
24
|
-
});
|
|
25
|
-
return /*#__PURE__*/jsxs(Fragment, {
|
|
26
|
-
children: [/*#__PURE__*/jsx("primitive", {
|
|
27
|
-
ref: modelRef,
|
|
28
|
-
scale: 1.4,
|
|
29
|
-
object: scene
|
|
30
|
-
}), /*#__PURE__*/jsx("primitive", {
|
|
31
|
-
object: lights
|
|
32
|
-
})]
|
|
33
|
-
});
|
|
34
|
-
};
|
|
35
|
-
|
|
36
|
-
export { CheckMark as default };
|
|
37
|
-
//# sourceMappingURL=CheckMark-5b996187.esm.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CheckMark-5b996187.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|