@wise/art 2.10.0-beta.1 → 2.10.0-beta.2

package/dist/Illustration.css

@@ -1,27 +1 @@
-/* Prevent image overflow viewport or container element */
-img.wds-illustration {
-  max-width: 100%;
-}
-
-.wds-illustration-padding {
-  padding: 24px;
-}
-
-.wds-illustration-3d {
-  display: inline-flex;
-}
-
-.wds-illustration-3d-small {
-  width: 200px;
-  height: 200px;
-}
-
-.wds-illustration-3d-medium {
-  width: 300px;
-  height: 300px;
-}
-
-.wds-illustration-3d-large {
-  width: 500px;
-  height: 500px;
-}
+img.wds-illustration{max-width:100%}.wds-illustration-padding{padding:24px}.wds-illustration-3d{display:inline-flex}.wds-illustration-3d-small{width:200px;height:200px}.wds-illustration-3d-medium{width:300px;height:300px}.wds-illustration-3d-large{width:500px;height:500px}@font-face {font-display:block;font-family:"Wise-Icons";src:url("./Wise-Icons.woff2?6296a04a5edc84a33915e969155da9cc") format("woff2")}.wds-icon::before{font-family:Wise-Icons!important;font-style:normal;font-weight:normal!important;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.wds-icon.wds-icon-alert-circle-fill::before{content:"\f101"}.wds-icon.wds-icon-alert-circle::before{content:"\f102"}.wds-icon.wds-icon-alert::before{content:"\f103"}.wds-icon.wds-icon-arrow-down::before{content:"\f104"}.wds-icon.wds-icon-arrow-left::before{content:"\f105"}.wds-icon.wds-icon-arrow-right::before{content:"\f106"}.wds-icon.wds-icon-arrow-up::before{content:"\f107"}.wds-icon.wds-icon-auto-convert::before{content:"\f108"}.wds-icon.wds-icon-bank-transfer::before{content:"\f109"}.wds-icon.wds-icon-bank::before{content:"\f10a"}.wds-icon.wds-icon-bar-chart::before{content:"\f10b"}.wds-icon.wds-icon-barcode::before{content:"\f10c"}.wds-icon.wds-icon-batch::before{content:"\f10d"}.wds-icon.wds-icon-beach::before{content:"\f10e"}.wds-icon.wds-icon-bill-split::before{content:"\f10f"}.wds-icon.wds-icon-bills::before{content:"\f110"}.wds-icon.wds-icon-bin::before{content:"\f111"}.wds-icon.wds-icon-book::before{content:"\f112"}.wds-icon.wds-icon-boxes::before{content:"\f113"}.wds-icon.wds-icon-briefcase::before{content:"\f114"}.wds-icon.wds-icon-building::before{content:"\f115"}.wds-icon.wds-icon-bulb::before{content:"\f116"}.wds-icon.wds-icon-calendar-check::before{content:"\f117"}.wds-icon.wds-icon-calendar::before{content:"\f118"}.wds-icon.wds-icon-camera::before{content:"\f119"}.wds-icon.wds-icon-car::before{content:"\f11a"}.wds-icon.wds-icon-card-cvc::before{content:"\f11b"}.wds-icon.wds-icon-card-detail::before{content:"\f11c"}.wds-icon.wds-icon-card-wise::before{content:"\f11d"}.wds-icon.wds-icon-card::before{content:"\f11e"}.wds-icon.wds-icon-cash-app::before{content:"\f11f"}.wds-icon.wds-icon-cash-register::before{content:"\f120"}.wds-icon.wds-icon-charity::before{content:"\f121"}.wds-icon.wds-icon-check-circle-fill::before{content:"\f122"}.wds-icon.wds-icon-check-circle::before{content:"\f123"}.wds-icon.wds-icon-check::before{content:"\f124"}.wds-icon.wds-icon-chevron-down::before{content:"\f125"}.wds-icon.wds-icon-chevron-left::before{content:"\f126"}.wds-icon.wds-icon-chevron-right::before{content:"\f127"}.wds-icon.wds-icon-chevron-up::before{content:"\f128"}.wds-icon.wds-icon-chip::before{content:"\f129"}.wds-icon.wds-icon-click-to-pay::before{content:"\f12a"}.wds-icon.wds-icon-clock-borderless::before{content:"\f12b"}.wds-icon.wds-icon-clock-fill::before{content:"\f12c"}.wds-icon.wds-icon-clock::before{content:"\f12d"}.wds-icon.wds-icon-cog::before{content:"\f12e"}.wds-icon.wds-icon-coins::before{content:"\f12f"}.wds-icon.wds-icon-collapse::before{content:"\f130"}.wds-icon.wds-icon-confetti::before{content:"\f131"}.wds-icon.wds-icon-contactless::before{content:"\f132"}.wds-icon.wds-icon-convert::before{content:"\f133"}.wds-icon.wds-icon-cross-circle-fill::before{content:"\f134"}.wds-icon.wds-icon-cross-circle::before{content:"\f135"}.wds-icon.wds-icon-cross::before{content:"\f136"}.wds-icon.wds-icon-crystal-ball::before{content:"\f137"}.wds-icon.wds-icon-defrost::before{content:"\f138"}.wds-icon.wds-icon-delivery::before{content:"\f139"}.wds-icon.wds-icon-dial::before{content:"\f13a"}.wds-icon.wds-icon-direct-debits::before{content:"\f13b"}.wds-icon.wds-icon-disco-ball::before{content:"\f13c"}.wds-icon.wds-icon-document::before{content:"\f13d"}.wds-icon.wds-icon-documents::before{content:"\f13e"}.wds-icon.wds-icon-download::before{content:"\f13f"}.wds-icon.wds-icon-eating-out::before{content:"\f140"}.wds-icon.wds-icon-edit::before{content:"\f141"}.wds-icon.wds-icon-email-and-mobile::before{content:"\f142"}.wds-icon.wds-icon-email::before{content:"\f143"}.wds-icon.wds-icon-entertainment::before{content:"\f144"}.wds-icon.wds-icon-expand::before{content:"\f145"}.wds-icon.wds-icon-eye-shut::before{content:"\f146"}.wds-icon.wds-icon-eye::before{content:"\f147"}.wds-icon.wds-icon-face-id::before{content:"\f148"}.wds-icon.wds-icon-facebook::before{content:"\f149"}.wds-icon.wds-icon-fast-flag::before{content:"\f14a"}.wds-icon.wds-icon-fingerprint::before{content:"\f14b"}.wds-icon.wds-icon-fpx::before{content:"\f14c"}.wds-icon.wds-icon-freeze::before{content:"\f14d"}.wds-icon.wds-icon-gambling::before{content:"\f14e"}.wds-icon.wds-icon-general-fill::before{content:"\f14f"}.wds-icon.wds-icon-general-filled::before{content:"\f150"}.wds-icon.wds-icon-general::before{content:"\f151"}.wds-icon.wds-icon-gift-box::before{content:"\f152"}.wds-icon.wds-icon-globe::before{content:"\f153"}.wds-icon.wds-icon-graduation-cap::before{content:"\f154"}.wds-icon.wds-icon-graph::before{content:"\f155"}.wds-icon.wds-icon-groceries::before{content:"\f156"}.wds-icon.wds-icon-handshake::before{content:"\f157"}.wds-icon.wds-icon-happy-emoji::before{content:"\f158"}.wds-icon.wds-icon-headset::before{content:"\f159"}.wds-icon.wds-icon-heart::before{content:"\f15a"}.wds-icon.wds-icon-house::before{content:"\f15b"}.wds-icon.wds-icon-id::before{content:"\f15c"}.wds-icon.wds-icon-ideal::before{content:"\f15d"}.wds-icon.wds-icon-image::before{content:"\f15e"}.wds-icon.wds-icon-info-circle-fill::before{content:"\f15f"}.wds-icon.wds-icon-info-circle::before{content:"\f160"}.wds-icon.wds-icon-info::before{content:"\f161"}.wds-icon.wds-icon-insert-card::before{content:"\f162"}.wds-icon.wds-icon-instagram::before{content:"\f163"}.wds-icon.wds-icon-insurance::before{content:"\f164"}.wds-icon.wds-icon-interac::before{content:"\f165"}.wds-icon.wds-icon-jar::before{content:"\f166"}.wds-icon.wds-icon-keep::before{content:"\f167"}.wds-icon.wds-icon-klarna::before{content:"\f168"}.wds-icon.wds-icon-laptop::before{content:"\f169"}.wds-icon.wds-icon-leaf::before{content:"\f16a"}.wds-icon.wds-icon-lightning-bolt::before{content:"\f16b"}.wds-icon.wds-icon-limit::before{content:"\f16c"}.wds-icon.wds-icon-link::before{content:"\f16d"}.wds-icon.wds-icon-linkedin::before{content:"\f16e"}.wds-icon.wds-icon-list::before{content:"\f16f"}.wds-icon.wds-icon-location-marker::before{content:"\f170"}.wds-icon.wds-icon-log-in::before{content:"\f171"}.wds-icon.wds-icon-log-out::before{content:"\f172"}.wds-icon.wds-icon-mass-payout::before{content:"\f173"}.wds-icon.wds-icon-menu::before{content:"\f174"}.wds-icon.wds-icon-messenger::before{content:"\f175"}.wds-icon.wds-icon-minus-circle-fill::before{content:"\f176"}.wds-icon.wds-icon-minus-circle::before{content:"\f177"}.wds-icon.wds-icon-minus::before{content:"\f178"}.wds-icon.wds-icon-mobile-lock::before{content:"\f179"}.wds-icon.wds-icon-mobile::before{content:"\f17a"}.wds-icon.wds-icon-money-bag::before{content:"\f17b"}.wds-icon.wds-icon-money::before{content:"\f17c"}.wds-icon.wds-icon-more::before{content:"\f17d"}.wds-icon.wds-icon-multi-currency::before{content:"\f17e"}.wds-icon.wds-icon-navigate-away::before{content:"\f17f"}.wds-icon.wds-icon-nearby::before{content:"\f180"}.wds-icon.wds-icon-new::before{content:"\f181"}.wds-icon.wds-icon-notification-active::before{content:"\f182"}.wds-icon.wds-icon-notification::before{content:"\f183"}.wds-icon.wds-icon-padlock-unlocked::before{content:"\f184"}.wds-icon.wds-icon-padlock::before{content:"\f185"}.wds-icon.wds-icon-paperclip::before{content:"\f186"}.wds-icon.wds-icon-passport::before{content:"\f187"}.wds-icon.wds-icon-pause::before{content:"\f188"}.wds-icon.wds-icon-pay-in::before{content:"\f189"}.wds-icon.wds-icon-payments::before{content:"\f18a"}.wds-icon.wds-icon-paypal::before{content:"\f18b"}.wds-icon.wds-icon-people::before{content:"\f18c"}.wds-icon.wds-icon-percentage-circle::before{content:"\f18d"}.wds-icon.wds-icon-person::before{content:"\f18e"}.wds-icon.wds-icon-personal-care::before{content:"\f18f"}.wds-icon.wds-icon-pets::before{content:"\f190"}.wds-icon.wds-icon-phone::before{content:"\f191"}.wds-icon.wds-icon-pie-chart::before{content:"\f192"}.wds-icon.wds-icon-piggy-bank::before{content:"\f193"}.wds-icon.wds-icon-pix::before{content:"\f194"}.wds-icon.wds-icon-plane::before{content:"\f195"}.wds-icon.wds-icon-play::before{content:"\f196"}.wds-icon.wds-icon-plus-circle::before{content:"\f197"}.wds-icon.wds-icon-plus::before{content:"\f198"}.wds-icon.wds-icon-qr-code::before{content:"\f199"}.wds-icon.wds-icon-question-mark-circle::before{content:"\f19a"}.wds-icon.wds-icon-question-mark::before{content:"\f19b"}.wds-icon.wds-icon-rain::before{content:"\f19c"}.wds-icon.wds-icon-rainbow::before{content:"\f19d"}.wds-icon.wds-icon-receipt::before{content:"\f19e"}.wds-icon.wds-icon-receive::before{content:"\f19f"}.wds-icon.wds-icon-refund-receive::before{content:"\f1a0"}.wds-icon.wds-icon-refund-sent::before{content:"\f1a1"}.wds-icon.wds-icon-reload::before{content:"\f1a2"}.wds-icon.wds-icon-request-receive::before{content:"\f1a3"}.wds-icon.wds-icon-request-send::before{content:"\f1a4"}.wds-icon.wds-icon-rewards::before{content:"\f1a5"}.wds-icon.wds-icon-sad-emoji::before{content:"\f1a6"}.wds-icon.wds-icon-scan-qr-code::before{content:"\f1a7"}.wds-icon.wds-icon-search::before{content:"\f1a8"}.wds-icon.wds-icon-send::before{content:"\f1a9"}.wds-icon.wds-icon-share-android::before{content:"\f1aa"}.wds-icon.wds-icon-share-ios::before{content:"\f1ab"}.wds-icon.wds-icon-shield::before{content:"\f1ac"}.wds-icon.wds-icon-shopping-bag::before{content:"\f1ad"}.wds-icon.wds-icon-slider::before{content:"\f1ae"}.wds-icon.wds-icon-sofort::before{content:"\f1af"}.wds-icon.wds-icon-software-and-hosting::before{content:"\f1b0"}.wds-icon.wds-icon-speech-bubble-message::before{content:"\f1b1"}.wds-icon.wds-icon-speech-bubble-pending::before{content:"\f1b2"}.wds-icon.wds-icon-speech-bubble::before{content:"\f1b3"}.wds-icon.wds-icon-speech-bubbles::before{content:"\f1b4"}.wds-icon.wds-icon-spend-dirham::before{content:"\f1b5"}.wds-icon.wds-icon-spend-dollar::before{content:"\f1b6"}.wds-icon.wds-icon-spend-euro::before{content:"\f1b7"}.wds-icon.wds-icon-spend-forint::before{content:"\f1b8"}.wds-icon.wds-icon-spend-franc::before{content:"\f1b9"}.wds-icon.wds-icon-spend-hryvnia::before{content:"\f1ba"}.wds-icon.wds-icon-spend-koruna::before{content:"\f1bb"}.wds-icon.wds-icon-spend-krone::before{content:"\f1bc"}.wds-icon.wds-icon-spend-kuna::before{content:"\f1bd"}.wds-icon.wds-icon-spend-leu-lei::before{content:"\f1be"}.wds-icon.wds-icon-spend-lev::before{content:"\f1bf"}.wds-icon.wds-icon-spend-lira::before{content:"\f1c0"}.wds-icon.wds-icon-spend-pound::before{content:"\f1c1"}.wds-icon.wds-icon-spend-real::before{content:"\f1c2"}.wds-icon.wds-icon-spend-ringgit::before{content:"\f1c3"}.wds-icon.wds-icon-spend-rupee::before{content:"\f1c4"}.wds-icon.wds-icon-spend-rupiah::before{content:"\f1c5"}.wds-icon.wds-icon-spend-yen::before{content:"\f1c6"}.wds-icon.wds-icon-spend-zloty::before{content:"\f1c7"}.wds-icon.wds-icon-split-money::before{content:"\f1c8"}.wds-icon.wds-icon-star-fill::before{content:"\f1c9"}.wds-icon.wds-icon-star::before{content:"\f1ca"}.wds-icon.wds-icon-stationery::before{content:"\f1cb"}.wds-icon.wds-icon-stop::before{content:"\f1cc"}.wds-icon.wds-icon-suitcase::before{content:"\f1cd"}.wds-icon.wds-icon-sunglasses::before{content:"\f1ce"}.wds-icon.wds-icon-switch::before{content:"\f1cf"}.wds-icon.wds-icon-takeaway::before{content:"\f1d0"}.wds-icon.wds-icon-target::before{content:"\f1d1"}.wds-icon.wds-icon-taxi::before{content:"\f1d2"}.wds-icon.wds-icon-team::before{content:"\f1d3"}.wds-icon.wds-icon-theme::before{content:"\f1d4"}.wds-icon.wds-icon-transfer::before{content:"\f1d5"}.wds-icon.wds-icon-transport::before{content:"\f1d6"}.wds-icon.wds-icon-trustly::before{content:"\f1d7"}.wds-icon.wds-icon-twitter::before{content:"\f1d8"}.wds-icon.wds-icon-upload::before{content:"\f1d9"}.wds-icon.wds-icon-upward-graph::before{content:"\f1da"}.wds-icon.wds-icon-venmo::before{content:"\f1db"}.wds-icon.wds-icon-wallet::before{content:"\f1dc"}.wds-icon.wds-icon-warning::before{content:"\f1dd"}.wds-icon.wds-icon-whatsapp::before{content:"\f1de"}.wds-icon.wds-icon-withdrawal::before{content:"\f1df"}.wds-icon{display:block;font-size:16px}.wds-icon-size-24{font-size:24px}.wds-icon::before{content:"\f14a"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wise/art",
-  "version": "2.10.0-beta.1",
+  "version": "2.10.0-beta.2",
   "license": "MIT",
   "description": "React library for art elements in UI",
   "homepage": "https://github.com/transferwise/web-art#readme",
@@ -31,15 +31,16 @@
     "convert-flags-svg-to-png": "node ./scripts/convert-flags-svg-to-png.mjs",
     "convert-i10s-png-to-webp": "rm -rf s3-bucket/illustrations/ && copyfiles --f node_modules/wise-atoms/illustrations/**/*.png s3-bucket/illustrations && node ./scripts/convert-png-to-webp.mjs",
     "generate-i10s-metadata": "node ./scripts/generate-i10s-metadata.mjs && eslint 'src/illustrations/metadata.ts' --fix",
-    "generate-iconsfont": "fantasticon",
-    "bundle": "rm -rf dist && rollup --config --sourcemap && cpx src/illustrations/Illustration.css dist/",
+    "bundle": "rm -rf dist && rollup --config --sourcemap && yarn build-styles",
     "cleanup": "rm -rf temp",
     "build": "yarn load-i10s && yarn load-3d-i10s && yarn convert-i10s-png-to-webp && yarn generate-i10s-metadata && yarn load-flags && yarn bundle && yarn generate-iconsfont && yarn cleanup",
     "start": "storybook dev -p 3001",
     "dev": "yarn start",
     "test": "jest",
     "lint-fix": "eslint 'src/**/*.{js,ts,tsx}' 'scripts/*.{mjs,js,ts,tsx}' --fix",
-    "build-docs": "storybook build -o docs && touch ./docs/.nojekyll"
+    "build-docs": "storybook build -o docs && touch ./docs/.nojekyll",
+    "build-styles": "postcss src/index.css -o dist/Illustration.css && copyfiles -u 3 src/icons/font/Wise-Icons.woff2 dist/",
+    "generate-iconsfont": "mkdir -p ./src/icons/font && fantasticon"
   },
   "dependencies": {
     "@babel/runtime": "^7.22.15",
@@ -51,7 +52,6 @@
   },
   "devDependencies": {
     "@twbs/fantasticon": "^2.7.2",
-    "@transferwise/icons": "^3.13.0",
     "@babel/core": "^7.22.15",
     "@babel/plugin-transform-runtime": "^7.22.15",
     "@babel/preset-env": "^7.22.15",
@@ -76,6 +76,10 @@
     "@types/react": "^18.2.21",
     "@types/react-dom": "^18.2.7",
     "babel-plugin-optimize-clsx": "^2.6.2",
+    "postcss": "^8.4.33",
+    "postcss-cli": "^11.0.0",
+    "postcss-import": "^16.0.0",
+    "@csstools/postcss-minify": "^1.1.0",
     "copyfiles": "^2.4.1",
     "cpx": "^1.5.0",
     "eslint": "^8.48.0",

package/src/index.css

@@ -0,0 +1,3 @@
+@import './illustrations/Illustration.css';
+@import './icons/font/Wise-Icons.css';
+@import './icons/Icon.css';