@wise/art 2.7.0-beta.3 → 2.8.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/README.md +47 -0
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -76,6 +76,53 @@ in Angular HTML template file
|
|
|
76
76
|
</wise-illustration>
|
|
77
77
|
```
|
|
78
78
|
|
|
79
|
+
## 3D Illustrations
|
|
80
|
+
|
|
81
|
+
3D illustrations work via `Illustration3D` React component. The component uses [three.js](https://threejs.org) framework to preview 3D models.
|
|
82
|
+
|
|
83
|
+
### Usage
|
|
84
|
+
|
|
85
|
+
```js
|
|
86
|
+
import { Illustration3D, Assets, Sizes } from '@wise/art';
|
|
87
|
+
|
|
88
|
+
<Illustration3D name={Assets.LOCK} size={Sizes.LARGE} />
|
|
89
|
+
```
|
|
90
|
+
|
|
91
|
+
Note: this API requires React 18.
|
|
92
|
+
|
|
93
|
+
Note: if your tests fail because of `matchMedia` and `ResizeObserver` being undefined you need add polyfills or mocks for Jest's jsdom env.
|
|
94
|
+
|
|
95
|
+
<details>
|
|
96
|
+
<summary>Mocks</summary>
|
|
97
|
+
|
|
98
|
+
```js
|
|
99
|
+
// in jest.setup.js
|
|
100
|
+
|
|
101
|
+
// mock matchMedia because it's not implemented in jsdoc lib
|
|
102
|
+
// https://jestjs.io/docs/manual-mocks#mocking-methods-which-are-not-implemented-in-jsdom
|
|
103
|
+
Object.defineProperty(window, 'matchMedia', {
|
|
104
|
+
writable: true,
|
|
105
|
+
value: jest.fn().mockImplementation((query) => ({
|
|
106
|
+
matches: false,
|
|
107
|
+
media: query,
|
|
108
|
+
onchange: null,
|
|
109
|
+
addEventListener: jest.fn(),
|
|
110
|
+
removeEventListener: jest.fn(),
|
|
111
|
+
dispatchEvent: jest.fn(),
|
|
112
|
+
})),
|
|
113
|
+
});
|
|
114
|
+
|
|
115
|
+
// mock ResizeObserver because it's not implemented in jsdoc lib
|
|
116
|
+
// https://github.com/jsdom/jsdom/issues/3368
|
|
117
|
+
window.ResizeObserver = class ResizeObserver {
|
|
118
|
+
observe = jest.fn();
|
|
119
|
+
unobserve = jest.fn();
|
|
120
|
+
disconnect = jest.fn();
|
|
121
|
+
};
|
|
122
|
+
```
|
|
123
|
+
|
|
124
|
+
</details>
|
|
125
|
+
|
|
79
126
|
## Flags
|
|
80
127
|
|
|
81
128
|
Flags generated from [wise-atoms SVGs](https://github.com/transferwise/wise-atoms/tree/main/flags) are accessible by either of these:
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wise/art",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.8.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",
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
"build": "yarn load-i10s && yarn load-3d-i10s && yarn convert-i10s-png-to-webp && yarn generate-i10s-metadata && yarn load-flags && yarn bundle && yarn cleanup",
|
|
37
37
|
"start": "storybook dev -p 3001",
|
|
38
38
|
"dev": "yarn start",
|
|
39
|
-
"test": "
|
|
39
|
+
"test": "release-to-github-with-changelog-pre-release-checks",
|
|
40
40
|
"lint-fix": "eslint 'src/**/*.{js,ts,tsx}' 'scripts/*.{mjs,js,ts,tsx}' --fix",
|
|
41
41
|
"build-docs": "storybook build -o docs && touch ./docs/.nojekyll"
|
|
42
42
|
},
|