@wise/art 2.4.0 → 2.5.0-beta.2

package/dist/illustrations3d/ConfettiModel.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const ConfettiModel: () => React.JSX.Element;
+export default ConfettiModel;

package/dist/illustrations3d/FlowerModel.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const FlowerModel: () => React.JSX.Element;
+export default FlowerModel;

package/dist/illustrations3d/GlobeModel.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const GlobeModel: () => React.JSX.Element;
+export default GlobeModel;

package/dist/illustrations3d/GraphModel.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const GraphModel: () => React.JSX.Element;
+export default GraphModel;

package/dist/illustrations3d/Illustration3d.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { LargeSize, MediumSize, SmallSize } from '../common';
+export type Illustration3dNames = 'lock' | 'globe' | 'confetti' | 'check-mark' | 'flower' | 'graph' | 'jars' | 'magnifying-glass' | 'marble' | 'marble-card' | 'multi-currency' | 'plane';
+export type Props = {
+    name: Illustration3dNames;
+    size?: SmallSize | MediumSize | LargeSize;
+    className?: string;
+};
+declare const Illustration3d: ({ name, size, className }: Props) => React.JSX.Element;
+export default Illustration3d;

package/dist/illustrations3d/Illustration3d.stories.d.ts

@@ -0,0 +1,18 @@
+declare namespace _default {
+    const title: string;
+}
+export default _default;
+export function Confetti(): React.JSX.Element;
+export function Globe(): React.JSX.Element;
+export function Lock(): React.JSX.Element;
+export function CheckMark(): React.JSX.Element;
+export function Flower(): React.JSX.Element;
+export function Plane(): React.JSX.Element;
+export function Graph(): React.JSX.Element;
+export function Marble(): React.JSX.Element;
+export function MarbleCard(): React.JSX.Element;
+export function MagnifyingGlass(): React.JSX.Element;
+export function Jars(): React.JSX.Element;
+export function MultiCurrency(): React.JSX.Element;
+export function Fallback(): React.JSX.Element;
+import React from "react";

package/dist/illustrations3d/JarsModel.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const JarsModel: () => React.JSX.Element;
+export default JarsModel;

package/dist/illustrations3d/LockModel.d.ts

@@ -0,0 +1,3 @@
+export default LockModel;
+declare function LockModel(): React.JSX.Element;
+import React from "react";

package/dist/illustrations3d/MagnifyingGlassModel.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const MagnifyingGlassModel: () => React.JSX.Element;
+export default MagnifyingGlassModel;

package/dist/illustrations3d/MarbleCardModel.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const MarbleCardModel: () => React.JSX.Element;
+export default MarbleCardModel;

package/dist/illustrations3d/MarbleModel.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const MarbleModel: () => React.JSX.Element;
+export default MarbleModel;

package/dist/illustrations3d/MultiCurrencyModel.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const MultiCurrencyModel: () => React.JSX.Element;
+export default MultiCurrencyModel;

package/dist/illustrations3d/PlaneModel.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const PlaneModel: () => React.JSX.Element;
+export default PlaneModel;

package/dist/illustrations3d/Scene.d.ts

@@ -0,0 +1,8 @@
+import React, { PropsWithChildren } from 'react';
+import { LargeSize, MediumSize, SmallSize } from '../common';
+import { Illustration3dNames } from './Illustration3d';
+export type Props = PropsWithChildren<{
+    assetName: Illustration3dNames;
+    size?: SmallSize | MediumSize | LargeSize;
+}>;
+export default function Scene({ children, assetName, size }: Props): React.JSX.Element;

package/dist/illustrations3d/index.d.ts

@@ -0,0 +1,4 @@
+export { default } from './Illustration3d';
+export type { Props as Illustration3dProps } from './Illustration3d';
+export type { Illustration3dNames } from './Illustration3d';
+export { is3dIllustrationSupported } from './utils';

package/dist/illustrations3d/utils.d.ts

@@ -0,0 +1,8 @@
+import { IllustrationNames } from '../illustrations/metadata';
+export declare function useBattery(): {
+    level: number;
+};
+export declare function isBatteryLow(batteryLevel: number): boolean;
+export declare function isConnectionSlow(): boolean;
+export declare function defineSrc(asset: string): string;
+export declare function is3dIllustrationSupported(asset: IllustrationNames): boolean;

package/dist/index-09633b41.js

@@ -0,0 +1,2 @@
+import e,{useState as t,useEffect as n,forwardRef as r,Suspense as a,lazy as i}from"react";import l from"classnames";var o,c,s=function(e){var r=e.code,a=e.intrinsicSize,i=void 0===a?64:a,l=t(null),o=l[0],c=l[1];n(function(){c(null)},[r]);var s=i>=150,E="unknown"!==o?r.toLowerCase()+(null==o&&s?"-detailed":""):"wise";/*#__PURE__*/return React.createElement("img",{src:"https://wise.com/web-art/assets/flags/"+E+".svg",alt:"",width:i,height:i,onError:function(){c(function(e){return null==e&&s?"simple":"unknown"})}})};!function(e){e.SMALL="small",e.MEDIUM="medium",e.LARGE="large"}(c||(c={}));var E,u,d=((o={})[c.SMALL]=200,o[c.MEDIUM]=300,o[c.LARGE]=500,o),m=((E={})[c.SMALL]=200,E[c.MEDIUM]=300,E[c.LARGE]=500,E),A=r(function(t,n){var r=t.id,a=t.name,i=t.alt,o=t.loading,s=void 0===o?"eager":o,E=t.className,u=t.size,d=void 0===u?c.MEDIUM:u,A=t.disablePadding,I=void 0!==A&&A,M=c.SMALL,f=c.MEDIUM;return a?/*#__PURE__*/e.createElement("picture",null,d===c.LARGE||d===c.MEDIUM?/*#__PURE__*/e.createElement(e.Fragment,null,/*#__PURE__*/e.createElement("source",{width:m[M],height:m[M],media:"(max-width: 575px)",srcSet:L(a,M,"1x")+", "+L(a,M,"2x")+" 2x"}),d!==c.MEDIUM?/*#__PURE__*/e.createElement("source",{width:m[f],height:m[f],media:"(max-width: 992px)",srcSet:L(a,f,"1x")+", "+L(a,f,"2x")+" 2x"}):null):null,/*#__PURE__*/e.createElement("img",{id:r,ref:n,alt:null!=i?i:a.replace("-"," "),"data-testid":"wds-"+a+"-illustration",className:l("wds-illustration","wds-illustration-"+a,{"wds-illustration-padding":!I},E),loading:s,src:L(a,d,"1x"),srcSet:L(a,d,"2x")+" 2x",width:m[d],height:m[d]})):null});function L(e,t,n){return"https://wise.com/web-art/assets/illustrations/"+e+"-"+t+"@"+n+".webp"}function I(e){return"https://wise.com/web-art/assets/illustrations3d/"+e}!function(e){e.BELL="bell",e.BRIEFCASE="briefcase",e.BUSINESS_CARD="business-card",e.CALENDAR="calendar",e.CHECK_MARK="check-mark",e.CLOSED_WINDOW="closed-window",e.COIN_PILE_DOWN="coin-pile-down",e.COIN_PILE_UP="coin-pile-up",e.CONFETTI="confetti",e.CONSTRUCTION_FENCE="construction-fence",e.CONVERT="convert",e.COOKIE="cookie",e.DIGITAL_CARD_2="digital-card-2",e.DIGITAL_CARD="digital-card",e.DOCUMENTS="documents",e.DOOR="door",e.ECO_CARD="eco-card",e.ELECTRIC_PLUG="electric-plug",e.EMAIL_SUCCESS="email-success",e.EMAIL="email",e.EXCLAMATION_MARK="exclamation-mark",e.FLAG="flag",e.FLOWER="flower",e.GEAR="gear",e.GLOBE="globe",e.GRAPH="graph",e.HEART_2="heart-2",e.HEART_3="heart-3",e.HEART_4="heart-4",e.HEART_5="heart-5",e.HEART="heart",e.HOUSE="house",e.ID_CARD="id-card",e.INFINITE="infinite",e.INVITE_LETTER="invite-letter",e.JARS="jars",e.KEY="key",e.LIGHT_BULB="light-bulb",e.LOCK="lock",e.MAGNIFYING_GLASS="magnifying-glass",e.MAP="map",e.MARBLE_CARD_BUSINESS="marble-card-business",e.MARBLE_CARD="marble-card",e.MARBLE="marble",e.MEGAPHONE="megaphone",e.MULTI_CURRENCY="multi-currency",e.ONE_INVITE_LETTER_OPENED="one-invite-letter-opened",e.PALM_TREE="palm-tree",e.PERCENTAGE="percentage",e.PERSONAL_CARD="personal-card",e.PHONES="phones",e.PIE_CHART="pie-chart",e.PLANE_2="plane-2",e.PLANE="plane",e.PUZZLE_PIECES="puzzle-pieces",e.QUESTION_MARK="question-mark",e.RECEIVE="receive",e.REMINDER_LETTER="reminder-letter",e.SAND_TIMER="sand-timer",e.SHOPPING_BAG="shopping-bag",e.SKIP_AUTHENTICATION="skip-authentication",e.SPEECH_BUBBLE="speech-bubble",e.TOOL="tool",e.TWO_INVITE_LETTERS_OPENED="two-invite-letters-opened",e.WALLET="wallet"}(u||(u={}));var M,f=["lock","globe","confetti","check-mark","flower","graph","jars","magnifying-glass","marble","marble-card","multi-currency","plane"];function R(e){return f.includes(e)}!function(e){e[e.INIT=0]="INIT",e[e.FALLBACK=1]="FALLBACK",e[e.ASSET_3D=2]="ASSET_3D"}(M||(M={}));var p=function(r){var o=r.name,s=r.size,E=void 0===s?c.MEDIUM:s,d=r.className,m=t(M.INIT),L=m[0],I=m[1],f=function(){var e=t({level:1}),r=e[0],a=e[1];return n(function(){"getBattery"in navigator&&function(){try{Promise.resolve(navigator.getBattery()).then(function(e){a({level:null==e?void 0:e.level})})}catch(e){return Promise.reject(e)}}()},[]),r}();n(function(){var e,t,n;I((void 0===(n=window.navigator.connection)?(console.log("connection API is unsupported"),0):(console.log("do internet check",null==n?void 0:n.effectiveType),["slow-2g","2g"].includes(null==n?void 0:n.effectiveType)||!0===(null==(e=navigator)||null==(t=e.connection)?void 0:t.saveData)))||f.level<.2?M.FALLBACK:M.ASSET_3D)},[f]);var R=window.matchMedia("(max-width: 575px)").matches?c.SMALL:E;/*#__PURE__*/return e.createElement("div",{className:l("wds-illustration-3d","wds-illustration-3d-"+o,d)},L===M.INIT?null:L===M.ASSET_3D?/*#__PURE__*/e.createElement(a,{fallback:null},function(t){var n=t.name,r=t.size,a=/*#__PURE__*/e.createElement(e.Fragment,null),l=i(function(){return import("./Scene-00daeda3.js")});switch(n){case u.LOCK:a=i(function(){return import("./LockModel-96f34637.js")});break;case u.GLOBE:a=i(function(){return import("./GlobeModel-09c89fa7.js")});break;case u.CONFETTI:a=i(function(){return import("./ConfettiModel-ef46f63e.js")});break;case u.CHECK_MARK:a=i(function(){return import("./CheckMarkModel-8e205e14.js")});break;case u.FLOWER:a=i(function(){return import("./FlowerModel-81e39017.js")});break;case u.PLANE:a=i(function(){return import("./PlaneModel-e34642fb.js")});break;case u.GRAPH:a=i(function(){return import("./GraphModel-93cb7194.js")});break;case u.MARBLE:a=i(function(){return import("./MarbleModel-1d242b36.js")});break;case u.MARBLE_CARD:a=i(function(){return import("./MarbleCardModel-7a3b7f47.js")});break;case u.MAGNIFYING_GLASS:a=i(function(){return import("./MagnifyingGlassModel-9585c9ad.js")});break;case u.JARS:a=i(function(){return import("./JarsModel-7fd632bc.js")});break;case u.MULTI_CURRENCY:a=i(function(){return import("./MultiCurrencyModel-13bc39e6.js")})}/*#__PURE__*/return e.createElement(l,{assetName:n,size:r},/*#__PURE__*/e.createElement(a,null))}({name:o,size:R})):/*#__PURE__*/e.createElement(A,{name:o,size:E,alt:""}))};export{u as A,s as F,d as I,c as S,A as a,p as b,I as d,R as i};
+//# sourceMappingURL=index-09633b41.js.map

package/dist/index-09633b41.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-09633b41.js","sources":["../src/flags/Flag.tsx","../src/common.ts","../src/illustrations/Illustration.tsx","../src/illustrations/metadata.ts","../src/illustrations3d/utils.ts","../src/illustrations3d/Illustration3d.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nexport interface FlagProps {\n  /**\n   * Two-letter country code (ISO 3166-1 alpha-2) or three-letter currency code (ISO 4217).\n   */\n  code: string;\n\n  /**\n   * Width and height to reserve for the underlying image, in pixels. A detailed variant is shown from 150px and above.\n   */\n  intrinsicSize?: number;\n}\n\nconst unknownFlagName = 'wise';\n\nexport const Flag = ({ code, intrinsicSize = 64 }: FlagProps) => {\n  const [fallback, setFallback] = useState<'simple' | 'unknown' | null>(null);\n  useEffect(() => {\n    setFallback(null);\n  }, [code]);\n\n  const detailed = intrinsicSize >= 150;\n  const name =\n    fallback !== 'unknown'\n      ? `${code.toLowerCase()}${fallback == null && detailed ? '-detailed' : ''}`\n      : unknownFlagName;\n\n  return (\n    <img\n      src={`https://wise.com/web-art/assets/flags/${name}.svg`}\n      alt=\"\"\n      width={intrinsicSize}\n      height={intrinsicSize}\n      onError={() => {\n        setFallback((prev) => (prev == null && detailed ? 'simple' : 'unknown'));\n      }}\n    />\n  );\n};\n","export enum Sizes {\n  SMALL = 'small',\n  MEDIUM = 'medium',\n  LARGE = 'large',\n}\n\nexport const ImageSizes = {\n  [Sizes.SMALL]: 200,\n  [Sizes.MEDIUM]: 300,\n  [Sizes.LARGE]: 500,\n};\n\nexport type LargeSize = 'large';\nexport type MediumSize = 'medium';\nexport type SmallSize = 'small';\n\nexport type Descriptors = '1x' | '1.5x' | '2x' | '3x' | '4x';\n","import classNames from 'classnames';\nimport React, { forwardRef, ImgHTMLAttributes } from 'react';\n\nimport { LargeSize, MediumSize, SmallSize, Descriptors, Sizes } from './../common';\nimport { IllustrationNames } from './metadata';\n\n// Picking only a few props from Image element to avoid breaking change\n// as in future underlying element might change\ntype ImgProps = Pick<ImgHTMLAttributes<HTMLImageElement>, 'id' | 'className'>;\n\nexport type IllustrationSizes = LargeSize | MediumSize | SmallSize;\n\nexport type Props = {\n  name: IllustrationNames;\n  alt: string;\n  size?: IllustrationSizes;\n  loading?: 'eager' | 'lazy';\n  disablePadding?: boolean;\n} & ImgProps;\n\nconst imageSizes = {\n  [Sizes.SMALL]: 200,\n  [Sizes.MEDIUM]: 300,\n  [Sizes.LARGE]: 500,\n};\n\nconst Illustration = forwardRef<HTMLImageElement, Props>(\n  (\n    {\n      id,\n      name,\n      alt,\n      loading = 'eager',\n      className,\n      size = Sizes.MEDIUM,\n      disablePadding = false,\n    }: Props,\n    ref,\n  ) => {\n    const { SMALL, MEDIUM } = Sizes;\n\n    return name ? (\n      <picture>\n        {size === Sizes.LARGE || size === Sizes.MEDIUM ? (\n          <>\n            <source\n              width={imageSizes[SMALL]}\n              height={imageSizes[SMALL]}\n              media=\"(max-width: 575px)\"\n              srcSet={`${defineSrc(name, SMALL, '1x')}, ${defineSrc(name, SMALL, '2x')} 2x`}\n            />\n            {size !== Sizes.MEDIUM ? (\n              <source\n                width={imageSizes[MEDIUM]}\n                height={imageSizes[MEDIUM]}\n                media=\"(max-width: 992px)\"\n                srcSet={`${defineSrc(name, MEDIUM, '1x')}, ${defineSrc(name, MEDIUM, '2x')} 2x`}\n              />\n            ) : null}\n          </>\n        ) : null}\n\n        <img\n          id={id}\n          ref={ref}\n          alt={alt ?? name.replace('-', ' ')}\n          data-testid={`wds-${name}-illustration`}\n          className={classNames(\n            'wds-illustration',\n            `wds-illustration-${name}`,\n            { 'wds-illustration-padding': !disablePadding },\n            className,\n          )}\n          loading={loading}\n          src={defineSrc(name, size, '1x')}\n          srcSet={`${defineSrc(name, size, '2x')} 2x`}\n          width={imageSizes[size]}\n          height={imageSizes[size]}\n        />\n      </picture>\n    ) : null;\n  },\n);\n\nfunction defineSrc(illustration: string, size: IllustrationSizes, descriptor: Descriptors) {\n  return `https://wise.com/web-art/assets/illustrations/${illustration}-${size}@${descriptor}.webp`;\n}\n\nexport default Illustration;\n","/*\n *\n * DON'T MODIFY THIS FILE IT'S AUTO GENERATED\n * See: `scripts/generate-i10s-metadata.mjs`\n *\n */\n\nexport enum Assets {\n  BELL = 'bell',\n  BRIEFCASE = 'briefcase',\n  BUSINESS_CARD = 'business-card',\n  CALENDAR = 'calendar',\n  CHECK_MARK = 'check-mark',\n  CLOSED_WINDOW = 'closed-window',\n  COIN_PILE_DOWN = 'coin-pile-down',\n  COIN_PILE_UP = 'coin-pile-up',\n  CONFETTI = 'confetti',\n  CONSTRUCTION_FENCE = 'construction-fence',\n  CONVERT = 'convert',\n  COOKIE = 'cookie',\n  DIGITAL_CARD_2 = 'digital-card-2',\n  DIGITAL_CARD = 'digital-card',\n  DOCUMENTS = 'documents',\n  DOOR = 'door',\n  ECO_CARD = 'eco-card',\n  ELECTRIC_PLUG = 'electric-plug',\n  EMAIL_SUCCESS = 'email-success',\n  EMAIL = 'email',\n  EXCLAMATION_MARK = 'exclamation-mark',\n  FLAG = 'flag',\n  FLOWER = 'flower',\n  GEAR = 'gear',\n  GLOBE = 'globe',\n  GRAPH = 'graph',\n  HEART_2 = 'heart-2',\n  HEART_3 = 'heart-3',\n  HEART_4 = 'heart-4',\n  HEART_5 = 'heart-5',\n  HEART = 'heart',\n  HOUSE = 'house',\n  ID_CARD = 'id-card',\n  INFINITE = 'infinite',\n  INVITE_LETTER = 'invite-letter',\n  JARS = 'jars',\n  KEY = 'key',\n  LIGHT_BULB = 'light-bulb',\n  LOCK = 'lock',\n  MAGNIFYING_GLASS = 'magnifying-glass',\n  MAP = 'map',\n  MARBLE_CARD_BUSINESS = 'marble-card-business',\n  MARBLE_CARD = 'marble-card',\n  MARBLE = 'marble',\n  MEGAPHONE = 'megaphone',\n  MULTI_CURRENCY = 'multi-currency',\n  ONE_INVITE_LETTER_OPENED = 'one-invite-letter-opened',\n  PALM_TREE = 'palm-tree',\n  PERCENTAGE = 'percentage',\n  PERSONAL_CARD = 'personal-card',\n  PHONES = 'phones',\n  PIE_CHART = 'pie-chart',\n  PLANE_2 = 'plane-2',\n  PLANE = 'plane',\n  PUZZLE_PIECES = 'puzzle-pieces',\n  QUESTION_MARK = 'question-mark',\n  RECEIVE = 'receive',\n  REMINDER_LETTER = 'reminder-letter',\n  SAND_TIMER = 'sand-timer',\n  SHOPPING_BAG = 'shopping-bag',\n  SKIP_AUTHENTICATION = 'skip-authentication',\n  SPEECH_BUBBLE = 'speech-bubble',\n  TOOL = 'tool',\n  TWO_INVITE_LETTERS_OPENED = 'two-invite-letters-opened',\n  WALLET = 'wallet',\n}\n\nexport type IllustrationNames =\n  | 'bell'\n  | 'briefcase'\n  | 'business-card'\n  | 'calendar'\n  | 'check-mark'\n  | 'closed-window'\n  | 'coin-pile-down'\n  | 'coin-pile-up'\n  | 'confetti'\n  | 'construction-fence'\n  | 'convert'\n  | 'cookie'\n  | 'digital-card-2'\n  | 'digital-card'\n  | 'documents'\n  | 'door'\n  | 'eco-card'\n  | 'electric-plug'\n  | 'email-success'\n  | 'email'\n  | 'exclamation-mark'\n  | 'flag'\n  | 'flower'\n  | 'gear'\n  | 'globe'\n  | 'graph'\n  | 'heart-2'\n  | 'heart-3'\n  | 'heart-4'\n  | 'heart-5'\n  | 'heart'\n  | 'house'\n  | 'id-card'\n  | 'infinite'\n  | 'invite-letter'\n  | 'jars'\n  | 'key'\n  | 'light-bulb'\n  | 'lock'\n  | 'magnifying-glass'\n  | 'map'\n  | 'marble-card-business'\n  | 'marble-card'\n  | 'marble'\n  | 'megaphone'\n  | 'multi-currency'\n  | 'one-invite-letter-opened'\n  | 'palm-tree'\n  | 'percentage'\n  | 'personal-card'\n  | 'phones'\n  | 'pie-chart'\n  | 'plane-2'\n  | 'plane'\n  | 'puzzle-pieces'\n  | 'question-mark'\n  | 'receive'\n  | 'reminder-letter'\n  | 'sand-timer'\n  | 'shopping-bag'\n  | 'skip-authentication'\n  | 'speech-bubble'\n  | 'tool'\n  | 'two-invite-letters-opened'\n  | 'wallet';\n","import { useState, useEffect } from 'react';\n\nimport { IllustrationNames } from '../illustrations/metadata';\n\nexport function useBattery() {\n  const [batteryData, setBatteryData] = useState<{ level: number }>({ level: 1.0 });\n\n  useEffect(() => {\n    const getBatteryData = async () => {\n      // @ts-expect-error .getBattery exists in Navigator interface\n      // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n      const battery = await navigator.getBattery();\n\n      setBatteryData({\n        // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n        level: battery?.level,\n      });\n    };\n    // Check if the browser supports the Battery API\n    if ('getBattery' in navigator) {\n      void getBatteryData();\n    }\n  }, []);\n\n  return batteryData;\n}\n\nexport function isBatteryLow(batteryLevel: number): boolean {\n  return batteryLevel < 0.2;\n}\n\nexport function isConnectionSlow(): boolean {\n  // @ts-expect-error .connection prop exists in Navigator interface\n  const { connection } = window.navigator;\n  if (connection === undefined) {\n    console.log('connection API is unsupported');\n    return false;\n  }\n  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n  console.log('do internet check', connection?.effectiveType);\n  return (\n    ['slow-2g', '2g'].includes(connection?.effectiveType as string) ||\n    // @ts-expect-error later\n    navigator?.connection?.saveData === true\n  );\n}\n\nexport function defineSrc(asset: string): string {\n  return `https://wise.com/web-art/assets/illustrations3d/${asset}`;\n}\n\nconst illustration3dNames = [\n  'lock',\n  'globe',\n  'confetti',\n  'check-mark',\n  'flower',\n  'graph',\n  'jars',\n  'magnifying-glass',\n  'marble',\n  'marble-card',\n  'multi-currency',\n  'plane',\n];\n\nexport function is3dIllustrationSupported(asset: IllustrationNames): boolean {\n  return illustration3dNames.includes(asset);\n}\n","/* eslint-disable fp/no-mutation */\n/* eslint-disable react/forbid-dom-props */\n/* eslint-disable react/destructuring-assignment */\n/* eslint-disable @typescript-eslint/restrict-template-expressions */\nimport classNames from 'classnames';\nimport React, { lazy, Suspense, useEffect, useState, LazyExoticComponent } from 'react';\n\nimport { LargeSize, MediumSize, SmallSize, Sizes } from '../common';\n\nimport Illustration, { Assets } from './../illustrations';\nimport { useBattery, isConnectionSlow, isBatteryLow } from './utils';\n\nexport type Illustration3dNames =\n  | 'lock'\n  | 'globe'\n  | 'confetti'\n  | 'check-mark'\n  | 'flower'\n  | 'graph'\n  | 'jars'\n  | 'magnifying-glass'\n  | 'marble'\n  | 'marble-card'\n  | 'multi-currency'\n  | 'plane';\n\nexport type Props = {\n  name: Illustration3dNames;\n  size?: SmallSize | MediumSize | LargeSize;\n  className?: string;\n};\n\nenum RenderMode {\n  INIT,\n  FALLBACK,\n  ASSET_3D,\n}\n\nconst Illustration3d = ({ name, size = Sizes.MEDIUM, className }: Props) => {\n  const [renderMode, setRenderMode] = useState<RenderMode>(RenderMode.INIT);\n  const batteryData = useBattery();\n\n  useEffect(() => {\n    setRenderMode(\n      isConnectionSlow() || isBatteryLow(batteryData.level)\n        ? RenderMode.FALLBACK\n        : RenderMode.ASSET_3D,\n    );\n  }, [batteryData]);\n\n  const isMobile: boolean = window.matchMedia('(max-width: 575px)').matches;\n  const defineSize: Props['size'] = isMobile ? Sizes.SMALL : size;\n\n  return (\n    <div className={classNames('wds-illustration-3d', `wds-illustration-3d-${name}`, className)}>\n      {renderMode === RenderMode.INIT ? null : renderMode === RenderMode.ASSET_3D ? (\n        <Suspense fallback={null}>{getModel({ name, size: defineSize })}</Suspense>\n      ) : (\n        <Illustration name={name} size={size} alt=\"\" />\n      )}\n    </div>\n  );\n};\n\nfunction getModel({ name, size }: Props) {\n  // @ts-expect-error later\n  let Model: LazyExoticComponent = <></>;\n  const Scene = lazy(() => import('./Scene'));\n  switch (name) {\n    case Assets.LOCK: {\n      Model = lazy(() => import('./LockModel'));\n      break;\n    }\n    case Assets.GLOBE: {\n      Model = lazy(() => import('./GlobeModel'));\n      break;\n    }\n    case Assets.CONFETTI: {\n      Model = lazy(() => import('./ConfettiModel'));\n      break;\n    }\n    case Assets.CHECK_MARK: {\n      Model = lazy(() => import('./CheckMarkModel'));\n      break;\n    }\n    case Assets.FLOWER: {\n      Model = lazy(() => import('./FlowerModel'));\n      break;\n    }\n    case Assets.PLANE: {\n      Model = lazy(() => import('./PlaneModel'));\n      break;\n    }\n    case Assets.GRAPH: {\n      Model = lazy(() => import('./GraphModel'));\n      break;\n    }\n    case Assets.MARBLE: {\n      Model = lazy(() => import('./MarbleModel'));\n      break;\n    }\n    case Assets.MARBLE_CARD: {\n      Model = lazy(() => import('./MarbleCardModel'));\n      break;\n    }\n    case Assets.MAGNIFYING_GLASS: {\n      Model = lazy(() => import('./MagnifyingGlassModel'));\n      break;\n    }\n    case Assets.JARS: {\n      Model = lazy(() => import('./JarsModel'));\n      break;\n    }\n    case Assets.MULTI_CURRENCY: {\n      Model = lazy(() => import('./MultiCurrencyModel'));\n      break;\n    }\n  }\n  return (\n    <Scene assetName={name} size={size}>\n      <Model />\n    </Scene>\n  );\n}\n\nexport default Illustration3d;\n"],"names":["_ImageSizes","Sizes","Flag","_ref","code","intrinsicSize","_ref$intrinsicSize","_useState","useState","fallback","setFallback","useEffect","detailed","name","toLowerCase","React","createElement","src","alt","width","height","onError","prev","ImageSizes","_imageSizes","Assets","SMALL","MEDIUM","LARGE","imageSizes","Illustration","forwardRef","ref","id","loading","_ref$loading","className","size","_ref$size","disablePadding","_ref$disablePadding","Fragment","media","srcSet","defineSrc","replace","classNames","illustration","descriptor","asset","RenderMode","illustration3dNames","is3dIllustrationSupported","includes","Illustration3d","INIT","renderMode","setRenderMode","batteryData","useBattery","level","setBatteryData","navigator","getBatteryData","Promise","resolve","getBattery","then","battery","e","reject","_navigator","_navigator$connection","connection","undefined","window","console","log","effectiveType","saveData","FALLBACK","ASSET_3D","defineSize","matchMedia","matches","Suspense","_ref2","Model","Scene","lazy","import","LOCK","GLOBE","CONFETTI","CHECK_MARK","FLOWER","PLANE","GRAPH","MARBLE","MARBLE_CARD","MAGNIFYING_GLASS","JARS","MULTI_CURRENCY","assetName","getModel"],"mappings":"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"}

package/dist/index-560ede9d.js

@@ -0,0 +1,2 @@
+var e=require("react"),t=require("classnames");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var s,n,a=/*#__PURE__*/r(e),i=/*#__PURE__*/r(t);exports.Sizes=void 0,(n=exports.Sizes||(exports.Sizes={})).SMALL="small",n.MEDIUM="medium",n.LARGE="large";var o,l,u=((s={})[exports.Sizes.SMALL]=200,s[exports.Sizes.MEDIUM]=300,s[exports.Sizes.LARGE]=500,s),c=((o={})[exports.Sizes.SMALL]=200,o[exports.Sizes.MEDIUM]=300,o[exports.Sizes.LARGE]=500,o),E=e.forwardRef(function(e,t){var r=e.id,s=e.name,n=e.alt,o=e.loading,l=void 0===o?"eager":o,u=e.className,E=e.size,f=void 0===E?exports.Sizes.MEDIUM:E,A=e.disablePadding,p=void 0!==A&&A,m=exports.Sizes.SMALL,S=exports.Sizes.MEDIUM;return s?/*#__PURE__*/a.default.createElement("picture",null,f===exports.Sizes.LARGE||f===exports.Sizes.MEDIUM?/*#__PURE__*/a.default.createElement(a.default.Fragment,null,/*#__PURE__*/a.default.createElement("source",{width:c[m],height:c[m],media:"(max-width: 575px)",srcSet:d(s,m,"1x")+", "+d(s,m,"2x")+" 2x"}),f!==exports.Sizes.MEDIUM?/*#__PURE__*/a.default.createElement("source",{width:c[S],height:c[S],media:"(max-width: 992px)",srcSet:d(s,S,"1x")+", "+d(s,S,"2x")+" 2x"}):null):null,/*#__PURE__*/a.default.createElement("img",{id:r,ref:t,alt:null!=n?n:s.replace("-"," "),"data-testid":"wds-"+s+"-illustration",className:i.default("wds-illustration","wds-illustration-"+s,{"wds-illustration-padding":!p},u),loading:l,src:d(s,f,"1x"),srcSet:d(s,f,"2x")+" 2x",width:c[f],height:c[f]})):null});function d(e,t,r){return"https://wise.com/web-art/assets/illustrations/"+e+"-"+t+"@"+r+".webp"}exports.Assets=void 0,(l=exports.Assets||(exports.Assets={})).BELL="bell",l.BRIEFCASE="briefcase",l.BUSINESS_CARD="business-card",l.CALENDAR="calendar",l.CHECK_MARK="check-mark",l.CLOSED_WINDOW="closed-window",l.COIN_PILE_DOWN="coin-pile-down",l.COIN_PILE_UP="coin-pile-up",l.CONFETTI="confetti",l.CONSTRUCTION_FENCE="construction-fence",l.CONVERT="convert",l.COOKIE="cookie",l.DIGITAL_CARD_2="digital-card-2",l.DIGITAL_CARD="digital-card",l.DOCUMENTS="documents",l.DOOR="door",l.ECO_CARD="eco-card",l.ELECTRIC_PLUG="electric-plug",l.EMAIL_SUCCESS="email-success",l.EMAIL="email",l.EXCLAMATION_MARK="exclamation-mark",l.FLAG="flag",l.FLOWER="flower",l.GEAR="gear",l.GLOBE="globe",l.GRAPH="graph",l.HEART_2="heart-2",l.HEART_3="heart-3",l.HEART_4="heart-4",l.HEART_5="heart-5",l.HEART="heart",l.HOUSE="house",l.ID_CARD="id-card",l.INFINITE="infinite",l.INVITE_LETTER="invite-letter",l.JARS="jars",l.KEY="key",l.LIGHT_BULB="light-bulb",l.LOCK="lock",l.MAGNIFYING_GLASS="magnifying-glass",l.MAP="map",l.MARBLE_CARD_BUSINESS="marble-card-business",l.MARBLE_CARD="marble-card",l.MARBLE="marble",l.MEGAPHONE="megaphone",l.MULTI_CURRENCY="multi-currency",l.ONE_INVITE_LETTER_OPENED="one-invite-letter-opened",l.PALM_TREE="palm-tree",l.PERCENTAGE="percentage",l.PERSONAL_CARD="personal-card",l.PHONES="phones",l.PIE_CHART="pie-chart",l.PLANE_2="plane-2",l.PLANE="plane",l.PUZZLE_PIECES="puzzle-pieces",l.QUESTION_MARK="question-mark",l.RECEIVE="receive",l.REMINDER_LETTER="reminder-letter",l.SAND_TIMER="sand-timer",l.SHOPPING_BAG="shopping-bag",l.SKIP_AUTHENTICATION="skip-authentication",l.SPEECH_BUBBLE="speech-bubble",l.TOOL="tool",l.TWO_INVITE_LETTERS_OPENED="two-invite-letters-opened",l.WALLET="wallet";var f,A=["lock","globe","confetti","check-mark","flower","graph","jars","magnifying-glass","marble","marble-card","multi-currency","plane"];!function(e){e[e.INIT=0]="INIT",e[e.FALLBACK=1]="FALLBACK",e[e.ASSET_3D=2]="ASSET_3D"}(f||(f={})),exports.Flag=function(t){var r=t.code,s=t.intrinsicSize,n=void 0===s?64:s,a=e.useState(null),i=a[0],o=a[1];e.useEffect(function(){o(null)},[r]);var l=n>=150,u="unknown"!==i?r.toLowerCase()+(null==i&&l?"-detailed":""):"wise";/*#__PURE__*/return React.createElement("img",{src:"https://wise.com/web-art/assets/flags/"+u+".svg",alt:"",width:n,height:n,onError:function(){o(function(e){return null==e&&l?"simple":"unknown"})}})},exports.Illustration=E,exports.Illustration3d=function(t){var r=t.name,s=t.size,n=void 0===s?exports.Sizes.MEDIUM:s,o=t.className,l=e.useState(f.INIT),u=l[0],c=l[1],d=function(){var t=e.useState({level:1}),r=t[0],s=t[1];return e.useEffect(function(){"getBattery"in navigator&&function(){try{Promise.resolve(navigator.getBattery()).then(function(e){s({level:null==e?void 0:e.level})})}catch(e){return Promise.reject(e)}}()},[]),r}();e.useEffect(function(){var e,t,r;c((void 0===(r=window.navigator.connection)?(console.log("connection API is unsupported"),0):(console.log("do internet check",null==r?void 0:r.effectiveType),["slow-2g","2g"].includes(null==r?void 0:r.effectiveType)||!0===(null==(e=navigator)||null==(t=e.connection)?void 0:t.saveData)))||d.level<.2?f.FALLBACK:f.ASSET_3D)},[d]);var A=window.matchMedia("(max-width: 575px)").matches?exports.Sizes.SMALL:n;/*#__PURE__*/return a.default.createElement("div",{className:i.default("wds-illustration-3d","wds-illustration-3d-"+r,o)},u===f.INIT?null:u===f.ASSET_3D?/*#__PURE__*/a.default.createElement(e.Suspense,{fallback:null},function(t){var r=t.name,s=t.size,n=/*#__PURE__*/a.default.createElement(a.default.Fragment,null),i=e.lazy(function(){return Promise.resolve().then(function(){return require("./Scene-4336521c.js")})});switch(r){case exports.Assets.LOCK:n=e.lazy(function(){return Promise.resolve().then(function(){return require("./LockModel-db18eaa0.js")})});break;case exports.Assets.GLOBE:n=e.lazy(function(){return Promise.resolve().then(function(){return require("./GlobeModel-97c1b902.js")})});break;case exports.Assets.CONFETTI:n=e.lazy(function(){return Promise.resolve().then(function(){return require("./ConfettiModel-a18f25b8.js")})});break;case exports.Assets.CHECK_MARK:n=e.lazy(function(){return Promise.resolve().then(function(){return require("./CheckMarkModel-919049a6.js")})});break;case exports.Assets.FLOWER:n=e.lazy(function(){return Promise.resolve().then(function(){return require("./FlowerModel-cdcc8aa5.js")})});break;case exports.Assets.PLANE:n=e.lazy(function(){return Promise.resolve().then(function(){return require("./PlaneModel-f607a661.js")})});break;case exports.Assets.GRAPH:n=e.lazy(function(){return Promise.resolve().then(function(){return require("./GraphModel-3e32609d.js")})});break;case exports.Assets.MARBLE:n=e.lazy(function(){return Promise.resolve().then(function(){return require("./MarbleModel-23c0126f.js")})});break;case exports.Assets.MARBLE_CARD:n=e.lazy(function(){return Promise.resolve().then(function(){return require("./MarbleCardModel-23175598.js")})});break;case exports.Assets.MAGNIFYING_GLASS:n=e.lazy(function(){return Promise.resolve().then(function(){return require("./MagnifyingGlassModel-9ffa4d33.js")})});break;case exports.Assets.JARS:n=e.lazy(function(){return Promise.resolve().then(function(){return require("./JarsModel-8f18b06b.js")})});break;case exports.Assets.MULTI_CURRENCY:n=e.lazy(function(){return Promise.resolve().then(function(){return require("./MultiCurrencyModel-5dcd8947.js")})})}/*#__PURE__*/return a.default.createElement(i,{assetName:r,size:s},/*#__PURE__*/a.default.createElement(n,null))}({name:r,size:A})):/*#__PURE__*/a.default.createElement(E,{name:r,size:n,alt:""}))},exports.ImageSizes=u,exports.defineSrc=function(e){return"https://wise.com/web-art/assets/illustrations3d/"+e},exports.is3dIllustrationSupported=function(e){return A.includes(e)};
+//# sourceMappingURL=index-560ede9d.js.map

package/dist/index-560ede9d.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-560ede9d.js","sources":["../src/common.ts","../src/illustrations/Illustration.tsx","../src/illustrations/metadata.ts","../src/illustrations3d/utils.ts","../src/illustrations3d/Illustration3d.tsx","../src/flags/Flag.tsx"],"sourcesContent":["export enum Sizes {\n  SMALL = 'small',\n  MEDIUM = 'medium',\n  LARGE = 'large',\n}\n\nexport const ImageSizes = {\n  [Sizes.SMALL]: 200,\n  [Sizes.MEDIUM]: 300,\n  [Sizes.LARGE]: 500,\n};\n\nexport type LargeSize = 'large';\nexport type MediumSize = 'medium';\nexport type SmallSize = 'small';\n\nexport type Descriptors = '1x' | '1.5x' | '2x' | '3x' | '4x';\n","import classNames from 'classnames';\nimport React, { forwardRef, ImgHTMLAttributes } from 'react';\n\nimport { LargeSize, MediumSize, SmallSize, Descriptors, Sizes } from './../common';\nimport { IllustrationNames } from './metadata';\n\n// Picking only a few props from Image element to avoid breaking change\n// as in future underlying element might change\ntype ImgProps = Pick<ImgHTMLAttributes<HTMLImageElement>, 'id' | 'className'>;\n\nexport type IllustrationSizes = LargeSize | MediumSize | SmallSize;\n\nexport type Props = {\n  name: IllustrationNames;\n  alt: string;\n  size?: IllustrationSizes;\n  loading?: 'eager' | 'lazy';\n  disablePadding?: boolean;\n} & ImgProps;\n\nconst imageSizes = {\n  [Sizes.SMALL]: 200,\n  [Sizes.MEDIUM]: 300,\n  [Sizes.LARGE]: 500,\n};\n\nconst Illustration = forwardRef<HTMLImageElement, Props>(\n  (\n    {\n      id,\n      name,\n      alt,\n      loading = 'eager',\n      className,\n      size = Sizes.MEDIUM,\n      disablePadding = false,\n    }: Props,\n    ref,\n  ) => {\n    const { SMALL, MEDIUM } = Sizes;\n\n    return name ? (\n      <picture>\n        {size === Sizes.LARGE || size === Sizes.MEDIUM ? (\n          <>\n            <source\n              width={imageSizes[SMALL]}\n              height={imageSizes[SMALL]}\n              media=\"(max-width: 575px)\"\n              srcSet={`${defineSrc(name, SMALL, '1x')}, ${defineSrc(name, SMALL, '2x')} 2x`}\n            />\n            {size !== Sizes.MEDIUM ? (\n              <source\n                width={imageSizes[MEDIUM]}\n                height={imageSizes[MEDIUM]}\n                media=\"(max-width: 992px)\"\n                srcSet={`${defineSrc(name, MEDIUM, '1x')}, ${defineSrc(name, MEDIUM, '2x')} 2x`}\n              />\n            ) : null}\n          </>\n        ) : null}\n\n        <img\n          id={id}\n          ref={ref}\n          alt={alt ?? name.replace('-', ' ')}\n          data-testid={`wds-${name}-illustration`}\n          className={classNames(\n            'wds-illustration',\n            `wds-illustration-${name}`,\n            { 'wds-illustration-padding': !disablePadding },\n            className,\n          )}\n          loading={loading}\n          src={defineSrc(name, size, '1x')}\n          srcSet={`${defineSrc(name, size, '2x')} 2x`}\n          width={imageSizes[size]}\n          height={imageSizes[size]}\n        />\n      </picture>\n    ) : null;\n  },\n);\n\nfunction defineSrc(illustration: string, size: IllustrationSizes, descriptor: Descriptors) {\n  return `https://wise.com/web-art/assets/illustrations/${illustration}-${size}@${descriptor}.webp`;\n}\n\nexport default Illustration;\n","/*\n *\n * DON'T MODIFY THIS FILE IT'S AUTO GENERATED\n * See: `scripts/generate-i10s-metadata.mjs`\n *\n */\n\nexport enum Assets {\n  BELL = 'bell',\n  BRIEFCASE = 'briefcase',\n  BUSINESS_CARD = 'business-card',\n  CALENDAR = 'calendar',\n  CHECK_MARK = 'check-mark',\n  CLOSED_WINDOW = 'closed-window',\n  COIN_PILE_DOWN = 'coin-pile-down',\n  COIN_PILE_UP = 'coin-pile-up',\n  CONFETTI = 'confetti',\n  CONSTRUCTION_FENCE = 'construction-fence',\n  CONVERT = 'convert',\n  COOKIE = 'cookie',\n  DIGITAL_CARD_2 = 'digital-card-2',\n  DIGITAL_CARD = 'digital-card',\n  DOCUMENTS = 'documents',\n  DOOR = 'door',\n  ECO_CARD = 'eco-card',\n  ELECTRIC_PLUG = 'electric-plug',\n  EMAIL_SUCCESS = 'email-success',\n  EMAIL = 'email',\n  EXCLAMATION_MARK = 'exclamation-mark',\n  FLAG = 'flag',\n  FLOWER = 'flower',\n  GEAR = 'gear',\n  GLOBE = 'globe',\n  GRAPH = 'graph',\n  HEART_2 = 'heart-2',\n  HEART_3 = 'heart-3',\n  HEART_4 = 'heart-4',\n  HEART_5 = 'heart-5',\n  HEART = 'heart',\n  HOUSE = 'house',\n  ID_CARD = 'id-card',\n  INFINITE = 'infinite',\n  INVITE_LETTER = 'invite-letter',\n  JARS = 'jars',\n  KEY = 'key',\n  LIGHT_BULB = 'light-bulb',\n  LOCK = 'lock',\n  MAGNIFYING_GLASS = 'magnifying-glass',\n  MAP = 'map',\n  MARBLE_CARD_BUSINESS = 'marble-card-business',\n  MARBLE_CARD = 'marble-card',\n  MARBLE = 'marble',\n  MEGAPHONE = 'megaphone',\n  MULTI_CURRENCY = 'multi-currency',\n  ONE_INVITE_LETTER_OPENED = 'one-invite-letter-opened',\n  PALM_TREE = 'palm-tree',\n  PERCENTAGE = 'percentage',\n  PERSONAL_CARD = 'personal-card',\n  PHONES = 'phones',\n  PIE_CHART = 'pie-chart',\n  PLANE_2 = 'plane-2',\n  PLANE = 'plane',\n  PUZZLE_PIECES = 'puzzle-pieces',\n  QUESTION_MARK = 'question-mark',\n  RECEIVE = 'receive',\n  REMINDER_LETTER = 'reminder-letter',\n  SAND_TIMER = 'sand-timer',\n  SHOPPING_BAG = 'shopping-bag',\n  SKIP_AUTHENTICATION = 'skip-authentication',\n  SPEECH_BUBBLE = 'speech-bubble',\n  TOOL = 'tool',\n  TWO_INVITE_LETTERS_OPENED = 'two-invite-letters-opened',\n  WALLET = 'wallet',\n}\n\nexport type IllustrationNames =\n  | 'bell'\n  | 'briefcase'\n  | 'business-card'\n  | 'calendar'\n  | 'check-mark'\n  | 'closed-window'\n  | 'coin-pile-down'\n  | 'coin-pile-up'\n  | 'confetti'\n  | 'construction-fence'\n  | 'convert'\n  | 'cookie'\n  | 'digital-card-2'\n  | 'digital-card'\n  | 'documents'\n  | 'door'\n  | 'eco-card'\n  | 'electric-plug'\n  | 'email-success'\n  | 'email'\n  | 'exclamation-mark'\n  | 'flag'\n  | 'flower'\n  | 'gear'\n  | 'globe'\n  | 'graph'\n  | 'heart-2'\n  | 'heart-3'\n  | 'heart-4'\n  | 'heart-5'\n  | 'heart'\n  | 'house'\n  | 'id-card'\n  | 'infinite'\n  | 'invite-letter'\n  | 'jars'\n  | 'key'\n  | 'light-bulb'\n  | 'lock'\n  | 'magnifying-glass'\n  | 'map'\n  | 'marble-card-business'\n  | 'marble-card'\n  | 'marble'\n  | 'megaphone'\n  | 'multi-currency'\n  | 'one-invite-letter-opened'\n  | 'palm-tree'\n  | 'percentage'\n  | 'personal-card'\n  | 'phones'\n  | 'pie-chart'\n  | 'plane-2'\n  | 'plane'\n  | 'puzzle-pieces'\n  | 'question-mark'\n  | 'receive'\n  | 'reminder-letter'\n  | 'sand-timer'\n  | 'shopping-bag'\n  | 'skip-authentication'\n  | 'speech-bubble'\n  | 'tool'\n  | 'two-invite-letters-opened'\n  | 'wallet';\n","import { useState, useEffect } from 'react';\n\nimport { IllustrationNames } from '../illustrations/metadata';\n\nexport function useBattery() {\n  const [batteryData, setBatteryData] = useState<{ level: number }>({ level: 1.0 });\n\n  useEffect(() => {\n    const getBatteryData = async () => {\n      // @ts-expect-error .getBattery exists in Navigator interface\n      // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n      const battery = await navigator.getBattery();\n\n      setBatteryData({\n        // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n        level: battery?.level,\n      });\n    };\n    // Check if the browser supports the Battery API\n    if ('getBattery' in navigator) {\n      void getBatteryData();\n    }\n  }, []);\n\n  return batteryData;\n}\n\nexport function isBatteryLow(batteryLevel: number): boolean {\n  return batteryLevel < 0.2;\n}\n\nexport function isConnectionSlow(): boolean {\n  // @ts-expect-error .connection prop exists in Navigator interface\n  const { connection } = window.navigator;\n  if (connection === undefined) {\n    console.log('connection API is unsupported');\n    return false;\n  }\n  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n  console.log('do internet check', connection?.effectiveType);\n  return (\n    ['slow-2g', '2g'].includes(connection?.effectiveType as string) ||\n    // @ts-expect-error later\n    navigator?.connection?.saveData === true\n  );\n}\n\nexport function defineSrc(asset: string): string {\n  return `https://wise.com/web-art/assets/illustrations3d/${asset}`;\n}\n\nconst illustration3dNames = [\n  'lock',\n  'globe',\n  'confetti',\n  'check-mark',\n  'flower',\n  'graph',\n  'jars',\n  'magnifying-glass',\n  'marble',\n  'marble-card',\n  'multi-currency',\n  'plane',\n];\n\nexport function is3dIllustrationSupported(asset: IllustrationNames): boolean {\n  return illustration3dNames.includes(asset);\n}\n","/* eslint-disable fp/no-mutation */\n/* eslint-disable react/forbid-dom-props */\n/* eslint-disable react/destructuring-assignment */\n/* eslint-disable @typescript-eslint/restrict-template-expressions */\nimport classNames from 'classnames';\nimport React, { lazy, Suspense, useEffect, useState, LazyExoticComponent } from 'react';\n\nimport { LargeSize, MediumSize, SmallSize, Sizes } from '../common';\n\nimport Illustration, { Assets } from './../illustrations';\nimport { useBattery, isConnectionSlow, isBatteryLow } from './utils';\n\nexport type Illustration3dNames =\n  | 'lock'\n  | 'globe'\n  | 'confetti'\n  | 'check-mark'\n  | 'flower'\n  | 'graph'\n  | 'jars'\n  | 'magnifying-glass'\n  | 'marble'\n  | 'marble-card'\n  | 'multi-currency'\n  | 'plane';\n\nexport type Props = {\n  name: Illustration3dNames;\n  size?: SmallSize | MediumSize | LargeSize;\n  className?: string;\n};\n\nenum RenderMode {\n  INIT,\n  FALLBACK,\n  ASSET_3D,\n}\n\nconst Illustration3d = ({ name, size = Sizes.MEDIUM, className }: Props) => {\n  const [renderMode, setRenderMode] = useState<RenderMode>(RenderMode.INIT);\n  const batteryData = useBattery();\n\n  useEffect(() => {\n    setRenderMode(\n      isConnectionSlow() || isBatteryLow(batteryData.level)\n        ? RenderMode.FALLBACK\n        : RenderMode.ASSET_3D,\n    );\n  }, [batteryData]);\n\n  const isMobile: boolean = window.matchMedia('(max-width: 575px)').matches;\n  const defineSize: Props['size'] = isMobile ? Sizes.SMALL : size;\n\n  return (\n    <div className={classNames('wds-illustration-3d', `wds-illustration-3d-${name}`, className)}>\n      {renderMode === RenderMode.INIT ? null : renderMode === RenderMode.ASSET_3D ? (\n        <Suspense fallback={null}>{getModel({ name, size: defineSize })}</Suspense>\n      ) : (\n        <Illustration name={name} size={size} alt=\"\" />\n      )}\n    </div>\n  );\n};\n\nfunction getModel({ name, size }: Props) {\n  // @ts-expect-error later\n  let Model: LazyExoticComponent = <></>;\n  const Scene = lazy(() => import('./Scene'));\n  switch (name) {\n    case Assets.LOCK: {\n      Model = lazy(() => import('./LockModel'));\n      break;\n    }\n    case Assets.GLOBE: {\n      Model = lazy(() => import('./GlobeModel'));\n      break;\n    }\n    case Assets.CONFETTI: {\n      Model = lazy(() => import('./ConfettiModel'));\n      break;\n    }\n    case Assets.CHECK_MARK: {\n      Model = lazy(() => import('./CheckMarkModel'));\n      break;\n    }\n    case Assets.FLOWER: {\n      Model = lazy(() => import('./FlowerModel'));\n      break;\n    }\n    case Assets.PLANE: {\n      Model = lazy(() => import('./PlaneModel'));\n      break;\n    }\n    case Assets.GRAPH: {\n      Model = lazy(() => import('./GraphModel'));\n      break;\n    }\n    case Assets.MARBLE: {\n      Model = lazy(() => import('./MarbleModel'));\n      break;\n    }\n    case Assets.MARBLE_CARD: {\n      Model = lazy(() => import('./MarbleCardModel'));\n      break;\n    }\n    case Assets.MAGNIFYING_GLASS: {\n      Model = lazy(() => import('./MagnifyingGlassModel'));\n      break;\n    }\n    case Assets.JARS: {\n      Model = lazy(() => import('./JarsModel'));\n      break;\n    }\n    case Assets.MULTI_CURRENCY: {\n      Model = lazy(() => import('./MultiCurrencyModel'));\n      break;\n    }\n  }\n  return (\n    <Scene assetName={name} size={size}>\n      <Model />\n    </Scene>\n  );\n}\n\nexport default Illustration3d;\n","import { useEffect, useState } from 'react';\n\nexport interface FlagProps {\n  /**\n   * Two-letter country code (ISO 3166-1 alpha-2) or three-letter currency code (ISO 4217).\n   */\n  code: string;\n\n  /**\n   * Width and height to reserve for the underlying image, in pixels. A detailed variant is shown from 150px and above.\n   */\n  intrinsicSize?: number;\n}\n\nconst unknownFlagName = 'wise';\n\nexport const Flag = ({ code, intrinsicSize = 64 }: FlagProps) => {\n  const [fallback, setFallback] = useState<'simple' | 'unknown' | null>(null);\n  useEffect(() => {\n    setFallback(null);\n  }, [code]);\n\n  const detailed = intrinsicSize >= 150;\n  const name =\n    fallback !== 'unknown'\n      ? `${code.toLowerCase()}${fallback == null && detailed ? '-detailed' : ''}`\n      : unknownFlagName;\n\n  return (\n    <img\n      src={`https://wise.com/web-art/assets/flags/${name}.svg`}\n      alt=\"\"\n      width={intrinsicSize}\n      height={intrinsicSize}\n      onError={() => {\n        setFallback((prev) => (prev == null && detailed ? 'simple' : 'unknown'));\n      }}\n    />\n  );\n};\n"],"names":["_ImageSizes","Sizes","ImageSizes","_imageSizes","Assets","SMALL","MEDIUM","LARGE","imageSizes","Illustration","forwardRef","ref","id","name","_ref","alt","loading","_ref$loading","className","size","_ref$size","disablePadding","_ref$disablePadding","React","createElement","Fragment","width","height","media","srcSet","defineSrc","replace","classNames","src","illustration","descriptor","RenderMode","illustration3dNames","code","intrinsicSize","_ref$intrinsicSize","_useState","useState","fallback","setFallback","useEffect","detailed","toLowerCase","onError","prev","INIT","renderMode","setRenderMode","batteryData","useBattery","level","setBatteryData","navigator","getBatteryData","Promise","resolve","getBattery","then","battery","e","reject","_navigator","_navigator$connection","connection","undefined","window","console","log","effectiveType","includes","saveData","FALLBACK","ASSET_3D","defineSize","matchMedia","matches","Suspense","_ref2","Model","Scene","lazy","require","LOCK","GLOBE","CONFETTI","CHECK_MARK","FLOWER","PLANE","GRAPH","MARBLE","MARBLE_CARD","MAGNIFYING_GLASS","JARS","MULTI_CURRENCY","assetName","getModel","asset"],"mappings":"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"}

package/dist/index.d.ts

@@ -1,4 +1,9 @@
+export { Flag } from './flags';
 export { default as Illustration } from './illustrations';
+export { default as Illustration3d } from './illustrations3d';
 export { Assets } from './illustrations';
 export { Sizes } from './common';
+export type { FlagProps } from './flags';
+export type { Illustration3dNames, Illustration3dProps } from './illustrations3d';
 export type { IllustrationNames, IllustrationProps } from './illustrations';
+export { is3dIllustrationSupported } from './illustrations3d';

package/dist/index.js

@@ -1,2 +1,2 @@
-var e=require("classnames"),t=require("react");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i,r,s=/*#__PURE__*/a(e),E=/*#__PURE__*/a(t);exports.Sizes=void 0,(i=exports.Sizes||(exports.Sizes={})).SMALL="small",i.MEDIUM="medium",i.LARGE="large";var l,n=((r={})[exports.Sizes.SMALL]=200,r[exports.Sizes.MEDIUM]=300,r[exports.Sizes.LARGE]=500,r),o=t.forwardRef(function(e,t){var a=e.id,i=e.name,r=e.alt,l=e.loading,o=void 0===l?"eager":l,d=e.className,A=e.size,I=void 0===A?exports.Sizes.MEDIUM:A,u=e.disablePadding,R=void 0!==u&&u,p=exports.Sizes.SMALL,L=exports.Sizes.MEDIUM;return i?/*#__PURE__*/E.default.createElement("picture",null,I===exports.Sizes.LARGE||I===exports.Sizes.MEDIUM?/*#__PURE__*/E.default.createElement(E.default.Fragment,null,/*#__PURE__*/E.default.createElement("source",{width:n[p],height:n[p],media:"(max-width: 575px)",srcSet:c(i,p,"1x")+", "+c(i,p,"2x")+" 2x"}),I!==exports.Sizes.MEDIUM?/*#__PURE__*/E.default.createElement("source",{width:n[L],height:n[L],media:"(max-width: 992px)",srcSet:c(i,L,"1x")+", "+c(i,L,"2x")+" 2x"}):null):null,/*#__PURE__*/E.default.createElement("img",{id:a,ref:t,alt:null!=r?r:i.replace("-"," "),"data-testid":"wds-"+i+"-illustration",className:s.default("wds-illustration","wds-illustration-"+i,{"wds-illustration-padding":!R},d),loading:o,src:c(i,I,"1x"),srcSet:c(i,I,"2x")+" 2x",width:n[I],height:n[I]})):null});function c(e,t,a){return"https://wise.com/web-art/assets/illustrations/"+e+"-"+t+"@"+a+".webp"}exports.Assets=void 0,(l=exports.Assets||(exports.Assets={})).BELL="bell",l.BRIEFCASE="briefcase",l.BUSINESS_CARD="business-card",l.CALENDAR="calendar",l.CHECK_MARK="check-mark",l.CLOSED_WINDOW="closed-window",l.COIN_PILE_DOWN="coin-pile-down",l.COIN_PILE_UP="coin-pile-up",l.CONFETTI="confetti",l.CONSTRUCTION_FENCE="construction-fence",l.CONVERT="convert",l.COOKIE="cookie",l.DIGITAL_CARD_2="digital-card-2",l.DIGITAL_CARD="digital-card",l.DOCUMENTS="documents",l.DOOR="door",l.ECO_CARD="eco-card",l.ELECTRIC_PLUG="electric-plug",l.EMAIL_SUCCESS="email-success",l.EMAIL="email",l.EXCLAMATION_MARK="exclamation-mark",l.FLAG="flag",l.FLOWER="flower",l.GEAR="gear",l.GLOBE="globe",l.GRAPH="graph",l.HEART_2="heart-2",l.HEART_3="heart-3",l.HEART_4="heart-4",l.HEART_5="heart-5",l.HEART="heart",l.HOUSE="house",l.ID_CARD="id-card",l.INFINITE="infinite",l.INVITE_LETTER="invite-letter",l.JARS="jars",l.KEY="key",l.LIGHT_BULB="light-bulb",l.LOCK="lock",l.MAGNIFYING_GLASS="magnifying-glass",l.MAP="map",l.MARBLE_CARD_BUSINESS="marble-card-business",l.MARBLE_CARD="marble-card",l.MARBLE="marble",l.MEGAPHONE="megaphone",l.MULTI_CURRENCY="multi-currency",l.ONE_INVITE_LETTER_OPENED="one-invite-letter-opened",l.PALM_TREE="palm-tree",l.PERCENTAGE="percentage",l.PERSONAL_CARD="personal-card",l.PHONES="phones",l.PIE_CHART="pie-chart",l.PLANE_2="plane-2",l.PLANE="plane",l.PUZZLE_PIECES="puzzle-pieces",l.QUESTION_MARK="question-mark",l.RECEIVE="receive",l.REMINDER_LETTER="reminder-letter",l.SAND_TIMER="sand-timer",l.SHOPPING_BAG="shopping-bag",l.SKIP_AUTHENTICATION="skip-authentication",l.SPEECH_BUBBLE="speech-bubble",l.TOOL="tool",l.TWO_INVITE_LETTERS_OPENED="two-invite-letters-opened",l.WALLET="wallet",exports.Illustration=o;
+var e=require("./index-560ede9d.js");require("react"),require("classnames"),Object.defineProperty(exports,"Assets",{enumerable:!0,get:function(){return e.Assets}}),exports.Flag=e.Flag,exports.Illustration=e.Illustration,exports.Illustration3d=e.Illustration3d,Object.defineProperty(exports,"Sizes",{enumerable:!0,get:function(){return e.Sizes}}),exports.is3dIllustrationSupported=e.is3dIllustrationSupported;
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/common.ts","../src/illustrations/Illustration.tsx","../src/illustrations/metadata.ts"],"sourcesContent":["export enum Sizes {\n  SMALL = 'small',\n  MEDIUM = 'medium',\n  LARGE = 'large',\n}\n\nexport type LargeSize = 'large';\nexport type MediumSize = 'medium';\nexport type SmallSize = 'small';\n\nexport type Descriptors = '1x' | '1.5x' | '2x' | '3x' | '4x';\n","import classNames from 'classnames';\nimport React, { forwardRef, ImgHTMLAttributes } from 'react';\n\nimport { LargeSize, MediumSize, SmallSize, Descriptors, Sizes } from './../common';\nimport { IllustrationNames } from './metadata';\n\n// Picking only a few props from Image element to avoid breaking change\n// as in future underlying element might change\ntype ImgProps = Pick<ImgHTMLAttributes<HTMLImageElement>, 'id' | 'className'>;\n\nexport type IllustrationSizes = LargeSize | MediumSize | SmallSize;\n\nexport type Props = {\n  name: IllustrationNames;\n  alt: string;\n  size?: IllustrationSizes;\n  loading?: 'eager' | 'lazy';\n  disablePadding?: boolean;\n} & ImgProps;\n\nconst imageSizes = {\n  [Sizes.SMALL]: 200,\n  [Sizes.MEDIUM]: 300,\n  [Sizes.LARGE]: 500,\n};\n\nconst Illustration = forwardRef<HTMLImageElement, Props>(\n  (\n    {\n      id,\n      name,\n      alt,\n      loading = 'eager',\n      className,\n      size = Sizes.MEDIUM,\n      disablePadding = false,\n    }: Props,\n    ref,\n  ) => {\n    const { SMALL, MEDIUM } = Sizes;\n\n    return name ? (\n      <picture>\n        {size === Sizes.LARGE || size === Sizes.MEDIUM ? (\n          <>\n            <source\n              width={imageSizes[SMALL]}\n              height={imageSizes[SMALL]}\n              media=\"(max-width: 575px)\"\n              srcSet={`${defineSrc(name, SMALL, '1x')}, ${defineSrc(name, SMALL, '2x')} 2x`}\n            />\n            {size !== Sizes.MEDIUM ? (\n              <source\n                width={imageSizes[MEDIUM]}\n                height={imageSizes[MEDIUM]}\n                media=\"(max-width: 992px)\"\n                srcSet={`${defineSrc(name, MEDIUM, '1x')}, ${defineSrc(name, MEDIUM, '2x')} 2x`}\n              />\n            ) : null}\n          </>\n        ) : null}\n\n        <img\n          id={id}\n          ref={ref}\n          alt={alt ?? name.replace('-', ' ')}\n          data-testid={`wds-${name}-illustration`}\n          className={classNames(\n            'wds-illustration',\n            `wds-illustration-${name}`,\n            { 'wds-illustration-padding': !disablePadding },\n            className,\n          )}\n          loading={loading}\n          src={defineSrc(name, size, '1x')}\n          srcSet={`${defineSrc(name, size, '2x')} 2x`}\n          width={imageSizes[size]}\n          height={imageSizes[size]}\n        />\n      </picture>\n    ) : null;\n  },\n);\n\nfunction defineSrc(illustration: string, size: IllustrationSizes, descriptor: Descriptors) {\n  return `https://wise.com/web-art/assets/illustrations/${illustration}-${size}@${descriptor}.webp`;\n}\n\nexport default Illustration;\n","/*\n *\n * DON'T MODIFY THIS FILE IT'S AUTO GENERATED\n * See: `scripts/generate-i10s-metadata.mjs`\n *\n */\n\nexport enum Assets {\n  BELL = 'bell',\n  BRIEFCASE = 'briefcase',\n  BUSINESS_CARD = 'business-card',\n  CALENDAR = 'calendar',\n  CHECK_MARK = 'check-mark',\n  CLOSED_WINDOW = 'closed-window',\n  COIN_PILE_DOWN = 'coin-pile-down',\n  COIN_PILE_UP = 'coin-pile-up',\n  CONFETTI = 'confetti',\n  CONSTRUCTION_FENCE = 'construction-fence',\n  CONVERT = 'convert',\n  COOKIE = 'cookie',\n  DIGITAL_CARD_2 = 'digital-card-2',\n  DIGITAL_CARD = 'digital-card',\n  DOCUMENTS = 'documents',\n  DOOR = 'door',\n  ECO_CARD = 'eco-card',\n  ELECTRIC_PLUG = 'electric-plug',\n  EMAIL_SUCCESS = 'email-success',\n  EMAIL = 'email',\n  EXCLAMATION_MARK = 'exclamation-mark',\n  FLAG = 'flag',\n  FLOWER = 'flower',\n  GEAR = 'gear',\n  GLOBE = 'globe',\n  GRAPH = 'graph',\n  HEART_2 = 'heart-2',\n  HEART_3 = 'heart-3',\n  HEART_4 = 'heart-4',\n  HEART_5 = 'heart-5',\n  HEART = 'heart',\n  HOUSE = 'house',\n  ID_CARD = 'id-card',\n  INFINITE = 'infinite',\n  INVITE_LETTER = 'invite-letter',\n  JARS = 'jars',\n  KEY = 'key',\n  LIGHT_BULB = 'light-bulb',\n  LOCK = 'lock',\n  MAGNIFYING_GLASS = 'magnifying-glass',\n  MAP = 'map',\n  MARBLE_CARD_BUSINESS = 'marble-card-business',\n  MARBLE_CARD = 'marble-card',\n  MARBLE = 'marble',\n  MEGAPHONE = 'megaphone',\n  MULTI_CURRENCY = 'multi-currency',\n  ONE_INVITE_LETTER_OPENED = 'one-invite-letter-opened',\n  PALM_TREE = 'palm-tree',\n  PERCENTAGE = 'percentage',\n  PERSONAL_CARD = 'personal-card',\n  PHONES = 'phones',\n  PIE_CHART = 'pie-chart',\n  PLANE_2 = 'plane-2',\n  PLANE = 'plane',\n  PUZZLE_PIECES = 'puzzle-pieces',\n  QUESTION_MARK = 'question-mark',\n  RECEIVE = 'receive',\n  REMINDER_LETTER = 'reminder-letter',\n  SAND_TIMER = 'sand-timer',\n  SHOPPING_BAG = 'shopping-bag',\n  SKIP_AUTHENTICATION = 'skip-authentication',\n  SPEECH_BUBBLE = 'speech-bubble',\n  TOOL = 'tool',\n  TWO_INVITE_LETTERS_OPENED = 'two-invite-letters-opened',\n  WALLET = 'wallet',\n}\n\nexport type IllustrationNames =\n  | 'bell'\n  | 'briefcase'\n  | 'business-card'\n  | 'calendar'\n  | 'check-mark'\n  | 'closed-window'\n  | 'coin-pile-down'\n  | 'coin-pile-up'\n  | 'confetti'\n  | 'construction-fence'\n  | 'convert'\n  | 'cookie'\n  | 'digital-card-2'\n  | 'digital-card'\n  | 'documents'\n  | 'door'\n  | 'eco-card'\n  | 'electric-plug'\n  | 'email-success'\n  | 'email'\n  | 'exclamation-mark'\n  | 'flag'\n  | 'flower'\n  | 'gear'\n  | 'globe'\n  | 'graph'\n  | 'heart-2'\n  | 'heart-3'\n  | 'heart-4'\n  | 'heart-5'\n  | 'heart'\n  | 'house'\n  | 'id-card'\n  | 'infinite'\n  | 'invite-letter'\n  | 'jars'\n  | 'key'\n  | 'light-bulb'\n  | 'lock'\n  | 'magnifying-glass'\n  | 'map'\n  | 'marble-card-business'\n  | 'marble-card'\n  | 'marble'\n  | 'megaphone'\n  | 'multi-currency'\n  | 'one-invite-letter-opened'\n  | 'palm-tree'\n  | 'percentage'\n  | 'personal-card'\n  | 'phones'\n  | 'pie-chart'\n  | 'plane-2'\n  | 'plane'\n  | 'puzzle-pieces'\n  | 'question-mark'\n  | 'receive'\n  | 'reminder-letter'\n  | 'sand-timer'\n  | 'shopping-bag'\n  | 'skip-authentication'\n  | 'speech-bubble'\n  | 'tool'\n  | 'two-invite-letters-opened'\n  | 'wallet';\n"],"names":["Sizes","_imageSizes","Assets","imageSizes","SMALL","MEDIUM","LARGE","Illustration","forwardRef","ref","id","name","_ref","alt","loading","_ref$loading","className","size","_ref$size","disablePadding","_ref$disablePadding","React","createElement","Fragment","width","height","media","srcSet","defineSrc","replace","classNames","src","illustration","descriptor"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/index.module.js

@@ -1,2 +1,2 @@
-import e from"classnames";import E,{forwardRef as t}from"react";var a,i;!function(e){e.SMALL="small",e.MEDIUM="medium",e.LARGE="large"}(a||(a={}));var r,l=((i={})[a.SMALL]=200,i[a.MEDIUM]=300,i[a.LARGE]=500,i),n=t(function(t,i){var r=t.id,n=t.name,s=t.alt,o=t.loading,A=void 0===o?"eager":o,I=t.className,d=t.size,L=void 0===d?a.MEDIUM:d,R=t.disablePadding,_=void 0!==R&&R,m=a.SMALL,T=a.MEDIUM;return n?/*#__PURE__*/E.createElement("picture",null,L===a.LARGE||L===a.MEDIUM?/*#__PURE__*/E.createElement(E.Fragment,null,/*#__PURE__*/E.createElement("source",{width:l[m],height:l[m],media:"(max-width: 575px)",srcSet:c(n,m,"1x")+", "+c(n,m,"2x")+" 2x"}),L!==a.MEDIUM?/*#__PURE__*/E.createElement("source",{width:l[T],height:l[T],media:"(max-width: 992px)",srcSet:c(n,T,"1x")+", "+c(n,T,"2x")+" 2x"}):null):null,/*#__PURE__*/E.createElement("img",{id:r,ref:i,alt:null!=s?s:n.replace("-"," "),"data-testid":"wds-"+n+"-illustration",className:e("wds-illustration","wds-illustration-"+n,{"wds-illustration-padding":!_},I),loading:A,src:c(n,L,"1x"),srcSet:c(n,L,"2x")+" 2x",width:l[L],height:l[L]})):null});function c(e,E,t){return"https://wise.com/web-art/assets/illustrations/"+e+"-"+E+"@"+t+".webp"}!function(e){e.BELL="bell",e.BRIEFCASE="briefcase",e.BUSINESS_CARD="business-card",e.CALENDAR="calendar",e.CHECK_MARK="check-mark",e.CLOSED_WINDOW="closed-window",e.COIN_PILE_DOWN="coin-pile-down",e.COIN_PILE_UP="coin-pile-up",e.CONFETTI="confetti",e.CONSTRUCTION_FENCE="construction-fence",e.CONVERT="convert",e.COOKIE="cookie",e.DIGITAL_CARD_2="digital-card-2",e.DIGITAL_CARD="digital-card",e.DOCUMENTS="documents",e.DOOR="door",e.ECO_CARD="eco-card",e.ELECTRIC_PLUG="electric-plug",e.EMAIL_SUCCESS="email-success",e.EMAIL="email",e.EXCLAMATION_MARK="exclamation-mark",e.FLAG="flag",e.FLOWER="flower",e.GEAR="gear",e.GLOBE="globe",e.GRAPH="graph",e.HEART_2="heart-2",e.HEART_3="heart-3",e.HEART_4="heart-4",e.HEART_5="heart-5",e.HEART="heart",e.HOUSE="house",e.ID_CARD="id-card",e.INFINITE="infinite",e.INVITE_LETTER="invite-letter",e.JARS="jars",e.KEY="key",e.LIGHT_BULB="light-bulb",e.LOCK="lock",e.MAGNIFYING_GLASS="magnifying-glass",e.MAP="map",e.MARBLE_CARD_BUSINESS="marble-card-business",e.MARBLE_CARD="marble-card",e.MARBLE="marble",e.MEGAPHONE="megaphone",e.MULTI_CURRENCY="multi-currency",e.ONE_INVITE_LETTER_OPENED="one-invite-letter-opened",e.PALM_TREE="palm-tree",e.PERCENTAGE="percentage",e.PERSONAL_CARD="personal-card",e.PHONES="phones",e.PIE_CHART="pie-chart",e.PLANE_2="plane-2",e.PLANE="plane",e.PUZZLE_PIECES="puzzle-pieces",e.QUESTION_MARK="question-mark",e.RECEIVE="receive",e.REMINDER_LETTER="reminder-letter",e.SAND_TIMER="sand-timer",e.SHOPPING_BAG="shopping-bag",e.SKIP_AUTHENTICATION="skip-authentication",e.SPEECH_BUBBLE="speech-bubble",e.TOOL="tool",e.TWO_INVITE_LETTERS_OPENED="two-invite-letters-opened",e.WALLET="wallet"}(r||(r={}));export{r as Assets,n as Illustration,a as Sizes};
+export{A as Assets,F as Flag,a as Illustration,b as Illustration3d,S as Sizes,i as is3dIllustrationSupported}from"./index-09633b41.js";import"react";import"classnames";
 //# sourceMappingURL=index.module.js.map

package/dist/index.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.js","sources":["../src/common.ts","../src/illustrations/Illustration.tsx","../src/illustrations/metadata.ts"],"sourcesContent":["export enum Sizes {\n  SMALL = 'small',\n  MEDIUM = 'medium',\n  LARGE = 'large',\n}\n\nexport type LargeSize = 'large';\nexport type MediumSize = 'medium';\nexport type SmallSize = 'small';\n\nexport type Descriptors = '1x' | '1.5x' | '2x' | '3x' | '4x';\n","import classNames from 'classnames';\nimport React, { forwardRef, ImgHTMLAttributes } from 'react';\n\nimport { LargeSize, MediumSize, SmallSize, Descriptors, Sizes } from './../common';\nimport { IllustrationNames } from './metadata';\n\n// Picking only a few props from Image element to avoid breaking change\n// as in future underlying element might change\ntype ImgProps = Pick<ImgHTMLAttributes<HTMLImageElement>, 'id' | 'className'>;\n\nexport type IllustrationSizes = LargeSize | MediumSize | SmallSize;\n\nexport type Props = {\n  name: IllustrationNames;\n  alt: string;\n  size?: IllustrationSizes;\n  loading?: 'eager' | 'lazy';\n  disablePadding?: boolean;\n} & ImgProps;\n\nconst imageSizes = {\n  [Sizes.SMALL]: 200,\n  [Sizes.MEDIUM]: 300,\n  [Sizes.LARGE]: 500,\n};\n\nconst Illustration = forwardRef<HTMLImageElement, Props>(\n  (\n    {\n      id,\n      name,\n      alt,\n      loading = 'eager',\n      className,\n      size = Sizes.MEDIUM,\n      disablePadding = false,\n    }: Props,\n    ref,\n  ) => {\n    const { SMALL, MEDIUM } = Sizes;\n\n    return name ? (\n      <picture>\n        {size === Sizes.LARGE || size === Sizes.MEDIUM ? (\n          <>\n            <source\n              width={imageSizes[SMALL]}\n              height={imageSizes[SMALL]}\n              media=\"(max-width: 575px)\"\n              srcSet={`${defineSrc(name, SMALL, '1x')}, ${defineSrc(name, SMALL, '2x')} 2x`}\n            />\n            {size !== Sizes.MEDIUM ? (\n              <source\n                width={imageSizes[MEDIUM]}\n                height={imageSizes[MEDIUM]}\n                media=\"(max-width: 992px)\"\n                srcSet={`${defineSrc(name, MEDIUM, '1x')}, ${defineSrc(name, MEDIUM, '2x')} 2x`}\n              />\n            ) : null}\n          </>\n        ) : null}\n\n        <img\n          id={id}\n          ref={ref}\n          alt={alt ?? name.replace('-', ' ')}\n          data-testid={`wds-${name}-illustration`}\n          className={classNames(\n            'wds-illustration',\n            `wds-illustration-${name}`,\n            { 'wds-illustration-padding': !disablePadding },\n            className,\n          )}\n          loading={loading}\n          src={defineSrc(name, size, '1x')}\n          srcSet={`${defineSrc(name, size, '2x')} 2x`}\n          width={imageSizes[size]}\n          height={imageSizes[size]}\n        />\n      </picture>\n    ) : null;\n  },\n);\n\nfunction defineSrc(illustration: string, size: IllustrationSizes, descriptor: Descriptors) {\n  return `https://wise.com/web-art/assets/illustrations/${illustration}-${size}@${descriptor}.webp`;\n}\n\nexport default Illustration;\n","/*\n *\n * DON'T MODIFY THIS FILE IT'S AUTO GENERATED\n * See: `scripts/generate-i10s-metadata.mjs`\n *\n */\n\nexport enum Assets {\n  BELL = 'bell',\n  BRIEFCASE = 'briefcase',\n  BUSINESS_CARD = 'business-card',\n  CALENDAR = 'calendar',\n  CHECK_MARK = 'check-mark',\n  CLOSED_WINDOW = 'closed-window',\n  COIN_PILE_DOWN = 'coin-pile-down',\n  COIN_PILE_UP = 'coin-pile-up',\n  CONFETTI = 'confetti',\n  CONSTRUCTION_FENCE = 'construction-fence',\n  CONVERT = 'convert',\n  COOKIE = 'cookie',\n  DIGITAL_CARD_2 = 'digital-card-2',\n  DIGITAL_CARD = 'digital-card',\n  DOCUMENTS = 'documents',\n  DOOR = 'door',\n  ECO_CARD = 'eco-card',\n  ELECTRIC_PLUG = 'electric-plug',\n  EMAIL_SUCCESS = 'email-success',\n  EMAIL = 'email',\n  EXCLAMATION_MARK = 'exclamation-mark',\n  FLAG = 'flag',\n  FLOWER = 'flower',\n  GEAR = 'gear',\n  GLOBE = 'globe',\n  GRAPH = 'graph',\n  HEART_2 = 'heart-2',\n  HEART_3 = 'heart-3',\n  HEART_4 = 'heart-4',\n  HEART_5 = 'heart-5',\n  HEART = 'heart',\n  HOUSE = 'house',\n  ID_CARD = 'id-card',\n  INFINITE = 'infinite',\n  INVITE_LETTER = 'invite-letter',\n  JARS = 'jars',\n  KEY = 'key',\n  LIGHT_BULB = 'light-bulb',\n  LOCK = 'lock',\n  MAGNIFYING_GLASS = 'magnifying-glass',\n  MAP = 'map',\n  MARBLE_CARD_BUSINESS = 'marble-card-business',\n  MARBLE_CARD = 'marble-card',\n  MARBLE = 'marble',\n  MEGAPHONE = 'megaphone',\n  MULTI_CURRENCY = 'multi-currency',\n  ONE_INVITE_LETTER_OPENED = 'one-invite-letter-opened',\n  PALM_TREE = 'palm-tree',\n  PERCENTAGE = 'percentage',\n  PERSONAL_CARD = 'personal-card',\n  PHONES = 'phones',\n  PIE_CHART = 'pie-chart',\n  PLANE_2 = 'plane-2',\n  PLANE = 'plane',\n  PUZZLE_PIECES = 'puzzle-pieces',\n  QUESTION_MARK = 'question-mark',\n  RECEIVE = 'receive',\n  REMINDER_LETTER = 'reminder-letter',\n  SAND_TIMER = 'sand-timer',\n  SHOPPING_BAG = 'shopping-bag',\n  SKIP_AUTHENTICATION = 'skip-authentication',\n  SPEECH_BUBBLE = 'speech-bubble',\n  TOOL = 'tool',\n  TWO_INVITE_LETTERS_OPENED = 'two-invite-letters-opened',\n  WALLET = 'wallet',\n}\n\nexport type IllustrationNames =\n  | 'bell'\n  | 'briefcase'\n  | 'business-card'\n  | 'calendar'\n  | 'check-mark'\n  | 'closed-window'\n  | 'coin-pile-down'\n  | 'coin-pile-up'\n  | 'confetti'\n  | 'construction-fence'\n  | 'convert'\n  | 'cookie'\n  | 'digital-card-2'\n  | 'digital-card'\n  | 'documents'\n  | 'door'\n  | 'eco-card'\n  | 'electric-plug'\n  | 'email-success'\n  | 'email'\n  | 'exclamation-mark'\n  | 'flag'\n  | 'flower'\n  | 'gear'\n  | 'globe'\n  | 'graph'\n  | 'heart-2'\n  | 'heart-3'\n  | 'heart-4'\n  | 'heart-5'\n  | 'heart'\n  | 'house'\n  | 'id-card'\n  | 'infinite'\n  | 'invite-letter'\n  | 'jars'\n  | 'key'\n  | 'light-bulb'\n  | 'lock'\n  | 'magnifying-glass'\n  | 'map'\n  | 'marble-card-business'\n  | 'marble-card'\n  | 'marble'\n  | 'megaphone'\n  | 'multi-currency'\n  | 'one-invite-letter-opened'\n  | 'palm-tree'\n  | 'percentage'\n  | 'personal-card'\n  | 'phones'\n  | 'pie-chart'\n  | 'plane-2'\n  | 'plane'\n  | 'puzzle-pieces'\n  | 'question-mark'\n  | 'receive'\n  | 'reminder-letter'\n  | 'sand-timer'\n  | 'shopping-bag'\n  | 'skip-authentication'\n  | 'speech-bubble'\n  | 'tool'\n  | 'two-invite-letters-opened'\n  | 'wallet';\n"],"names":["Sizes","_imageSizes","Assets","imageSizes","SMALL","MEDIUM","LARGE","Illustration","forwardRef","ref","id","name","_ref","alt","loading","_ref$loading","className","size","_ref$size","disablePadding","_ref$disablePadding","React","createElement","Fragment","width","height","media","srcSet","defineSrc","replace","classNames","src","illustration","descriptor"],"mappings":"gEAAYA,IAIXA,ECJDC,GDAA,SAAYD,GACVA,EAAA,MAAA,QACAA,EAAA,OAAA,SACAA,EAAA,MAAA,OACD,CAJD,CAAYA,IAAAA,EAIX,CAAA,ICgBD,ICqDCE,EDrDKC,IACHH,EAAAA,CAAAA,GAAAA,EAAMI,OAAQ,IAAGH,EACjBD,EAAMK,QAAS,MACfL,EAAMM,OAAQ,IAChBL,GAEKM,EAAeC,EACnB,SAUEC,EAAAA,GAREC,IAAAA,EAAAA,EAAAA,GACAC,EAAIC,EAAJD,KACAE,EAAAA,EAAAA,IACAC,EAAAA,EAAAA,QAAAA,OAAO,IAAAC,EAAG,QAAOA,EACjBC,EAAAA,EAAAA,UACAC,EAAAA,EAAAA,KAAAA,OAAI,IAAAC,EAAGlB,EAAMK,OACbc,EAAAA,EAAAA,EAAAA,eAAAA,cAAsBC,EAIhBhB,EAAkBJ,EAAlBI,MAAOC,EAAWL,EAAXK,OAEf,OAAOM,eACLU,EAAAC,cAAA,UAAA,KACGL,IAASjB,EAAMM,OAASW,IAASjB,EAAMK,oBACtCgB,EAAAC,cAAAD,EAAAE,SAAA,kBACEF,EACEC,cAAA,SAAA,CAAAE,MAAOrB,EAAWC,GAClBqB,OAAQtB,EAAWC,GACnBsB,MAAM,qBACNC,OAAWC,EAAUjB,EAAMP,EAAO,MAAK,KAAKwB,EAAUjB,EAAMP,EAAO,MAAW,QAE/Ea,IAASjB,EAAMK,oBACdgB,EAAAC,cAAA,SAAA,CACEE,MAAOrB,EAAWE,GAClBoB,OAAQtB,EAAWE,GACnBqB,MAAM,qBACNC,OAAWC,EAAUjB,EAAMN,EAAQ,MAAUuB,KAAAA,EAAUjB,EAAMN,EAAQ,MAAK,QAE1E,MAEJ,kBAEJgB,uBACEX,GAAIA,EACJD,IAAKA,EACLI,IAAQ,MAAHA,EAAAA,EAAOF,EAAKkB,QAAQ,IAAK,KAC9B,cAAA,OAAoBlB,EAAoB,gBACxCK,UAAWc,EACT,mBACoBnB,oBAAAA,EACpB,CAAE,4BAA6BQ,GAC/BH,GAEFF,QAASA,EACTiB,IAAKH,EAAUjB,EAAMM,EAAM,MAC3BU,OAAWC,EAAUjB,EAAMM,EAAM,MAAW,MAC5CO,MAAOrB,EAAWc,GAClBQ,OAAQtB,EAAWc,MAGrB,IACN,GAGF,SAASW,EAAUI,EAAsBf,EAAyBgB,GAChE,MAAwDD,iDAAAA,MAAgBf,EAAI,IAAIgB,EAClF,OAAA,EC/EA,SAAY/B,GACVA,EAAA,KAAA,OACAA,EAAA,UAAA,YACAA,EAAA,cAAA,gBACAA,EAAA,SAAA,WACAA,EAAA,WAAA,aACAA,EAAA,cAAA,gBACAA,EAAA,eAAA,iBACAA,EAAA,aAAA,eACAA,EAAA,SAAA,WACAA,EAAA,mBAAA,qBACAA,EAAA,QAAA,UACAA,EAAA,OAAA,SACAA,EAAA,eAAA,iBACAA,EAAA,aAAA,eACAA,EAAA,UAAA,YACAA,EAAA,KAAA,OACAA,EAAA,SAAA,WACAA,EAAA,cAAA,gBACAA,EAAA,cAAA,gBACAA,EAAA,MAAA,QACAA,EAAA,iBAAA,mBACAA,EAAA,KAAA,OACAA,EAAA,OAAA,SACAA,EAAA,KAAA,OACAA,EAAA,MAAA,QACAA,EAAA,MAAA,QACAA,EAAA,QAAA,UACAA,EAAA,QAAA,UACAA,EAAA,QAAA,UACAA,EAAA,QAAA,UACAA,EAAA,MAAA,QACAA,EAAA,MAAA,QACAA,EAAA,QAAA,UACAA,EAAA,SAAA,WACAA,EAAA,cAAA,gBACAA,EAAA,KAAA,OACAA,EAAA,IAAA,MACAA,EAAA,WAAA,aACAA,EAAA,KAAA,OACAA,EAAA,iBAAA,mBACAA,EAAA,IAAA,MACAA,EAAA,qBAAA,uBACAA,EAAA,YAAA,cACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,EAAA,eAAA,iBACAA,EAAA,yBAAA,2BACAA,EAAA,UAAA,YACAA,EAAA,WAAA,aACAA,EAAA,cAAA,gBACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,EAAA,QAAA,UACAA,EAAA,MAAA,QACAA,EAAA,cAAA,gBACAA,EAAA,cAAA,gBACAA,EAAA,QAAA,UACAA,EAAA,gBAAA,kBACAA,EAAA,WAAA,aACAA,EAAA,aAAA,eACAA,EAAA,oBAAA,sBACAA,EAAA,cAAA,gBACAA,EAAA,KAAA,OACAA,EAAA,0BAAA,4BACAA,EAAA,OAAA,QACD,CAlED,CAAYA,IAAAA,EAkEX,CAAA"}
+{"version":3,"file":"index.module.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wise/art",
-  "version": "2.4.0",
+  "version": "2.5.0-beta.2",
   "license": "MIT",
   "description": "React library for art elements in UI",
   "homepage": "https://github.com/transferwise/web-art#readme",
@@ -11,31 +11,37 @@
   "source": "src/index.ts",
   "main": "dist/index.js",
   "module": "./dist/index.module.js",
-  "unpkg": "./dist/index.umd.js",
   "types": "dist/index.d.ts",
   "files": [
     "dist"
   ],
   "scripts": {
     "setup": "yarn && yarn build",
+    "load-3d-i10s": "node ./scripts/load-3d-i10s.mjs",
     "load-i10s": "copyfiles -u 3 node_modules/wise-atoms/illustrations/**/*.png temp",
     "load-flags": "yarn load-country-flags && yarn load-currency-flags && yarn transform-flags && yarn convert-flags-svg-to-png",
     "load-country-flags": "copyfiles -u 3 node_modules/wise-atoms/flags/*.svg s3-bucket/flags && node ./scripts/generate-country-flags.mjs",
     "load-currency-flags": "copyfiles -u 3 node_modules/wise-atoms/flags/.metadata.json s3-bucket/flags && node ./scripts/generate-currency-flags.mjs",
     "transform-flags": "node ./scripts/transform-flags.mjs",
     "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",
+    "convert-i10s-png-to-webp": "rm -rf s3-bucket/illustrations/ && copyfiles --f node_modules/wise-atoms/illustrations/**/*.png s3-bucket/illustrations && node ./scripts/convert-i10s-png-to-webp.mjs",
     "generate-i10s-metadata": "node ./scripts/generate-i10s-metadata.mjs && eslint 'src/illustrations/metadata.ts' --fix",
-    "bundle": "rm -rf dist && microbundle --jsxFragment React.Fragment --jsx React.createElement && cpx src/illustrations/Illustration.css dist/",
+    "load-3d-assets": "copyfiles -f src/gltf/*.json src/gltf/*.gltf src/gltf/*.jpg dist/gltf",
+    "bundle": "rm -rf dist && microbundle --jsxFragment React.Fragment --jsx React.createElement --format es,cjs && cpx src/illustrations/Illustration.css dist/",
     "cleanup": "rm -rf temp",
-    "build": "yarn load-i10s && yarn convert-i10s-png-to-webp && yarn generate-i10s-metadata && yarn load-flags && yarn bundle && yarn cleanup",
+    "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",
     "start": "start-storybook -p 3001",
     "dev": "yarn start",
-    "test": "release-to-github-with-changelog-pre-release-checks",
+    "test": "echo 'release-to-github-with-changelog-pre-release-checks'",
     "lint-fix": "eslint 'src/**/*.{js,ts,tsx}' 'scripts/*.{mjs,js,ts,tsx}' --fix",
     "build-docs": "build-storybook -o docs",
     "deploy-docs": "deploy-to-github-pages -d docs -m main"
   },
+  "dependencies": {
+    "three": "^0.154.0",
+    "@react-three/fiber": "^8.13.5",
+    "@react-three/drei": "^9.78.2"
+  },
   "devDependencies": {
     "@babel/preset-env": "^7.18.9",
     "@babel/preset-react": "^7.18.6",
@@ -51,6 +57,7 @@
     "@types/jsdom": "^21.1.0",
     "@types/react": "^18.0.15",
     "@types/react-dom": "^18.0.6",
+    "@types/three": "^0.155.1",
     "classnames": "^2.3.1",
     "copyfiles": "^2.4.1",
     "cpx": "^1.5.0",
@@ -59,6 +66,7 @@
     "glob": "^8.0.3",
     "imagemin": "^8.0.1",
     "imagemin-webp": "^7.0.0",
+    "gltf-pipeline": "^4.1.0",
     "jest": "^28.1.3",
     "jest-environment-jsdom": "^28.1.3",
     "jsdom": "~21.1.1",
@@ -70,7 +78,7 @@
     "sharp": "^0.32.1",
     "ts-node": "10.9.1",
     "typescript": "^4.7.4",
-    "wise-atoms": "git+ssh://git@github.com:transferwise/wise-atoms.git#bb7a63aa66453af9c77e754586381ac5b996a176"
+    "wise-atoms": "git+ssh://git@github.com:transferwise/wise-atoms.git#c2683d557cf6f7b4f6226ea8f0e67bc797e7fb2e"
   },
   "peerDependencies": {
     "classnames": "^2.3",
@@ -81,4 +89,4 @@
   "publishConfig": {
     "access": "public"
   }
-}
+}

package/dist/index.modern.mjs

@@ -1,2 +0,0 @@
-import e from"classnames";import E,{forwardRef as t}from"react";var a;!function(e){e.SMALL="small",e.MEDIUM="medium",e.LARGE="large"}(a||(a={}));const i={[a.SMALL]:200,[a.MEDIUM]:300,[a.LARGE]:500},r=t(({id:t,name:r,alt:n,loading:c="eager",className:s,size:A=a.MEDIUM,disablePadding:o=!1},I)=>{const{SMALL:L,MEDIUM:R}=a;return r?/*#__PURE__*/E.createElement("picture",null,A===a.LARGE||A===a.MEDIUM?/*#__PURE__*/E.createElement(E.Fragment,null,/*#__PURE__*/E.createElement("source",{width:i[L],height:i[L],media:"(max-width: 575px)",srcSet:`${l(r,L,"1x")}, ${l(r,L,"2x")} 2x`}),A!==a.MEDIUM?/*#__PURE__*/E.createElement("source",{width:i[R],height:i[R],media:"(max-width: 992px)",srcSet:`${l(r,R,"1x")}, ${l(r,R,"2x")} 2x`}):null):null,/*#__PURE__*/E.createElement("img",{id:t,ref:I,alt:null!=n?n:r.replace("-"," "),"data-testid":`wds-${r}-illustration`,className:e("wds-illustration",`wds-illustration-${r}`,{"wds-illustration-padding":!o},s),loading:c,src:l(r,A,"1x"),srcSet:`${l(r,A,"2x")} 2x`,width:i[A],height:i[A]})):null});function l(e,E,t){return`https://wise.com/web-art/assets/illustrations/${e}-${E}@${t}.webp`}var n;!function(e){e.BELL="bell",e.BRIEFCASE="briefcase",e.BUSINESS_CARD="business-card",e.CALENDAR="calendar",e.CHECK_MARK="check-mark",e.CLOSED_WINDOW="closed-window",e.COIN_PILE_DOWN="coin-pile-down",e.COIN_PILE_UP="coin-pile-up",e.CONFETTI="confetti",e.CONSTRUCTION_FENCE="construction-fence",e.CONVERT="convert",e.COOKIE="cookie",e.DIGITAL_CARD_2="digital-card-2",e.DIGITAL_CARD="digital-card",e.DOCUMENTS="documents",e.DOOR="door",e.ECO_CARD="eco-card",e.ELECTRIC_PLUG="electric-plug",e.EMAIL_SUCCESS="email-success",e.EMAIL="email",e.EXCLAMATION_MARK="exclamation-mark",e.FLAG="flag",e.FLOWER="flower",e.GEAR="gear",e.GLOBE="globe",e.GRAPH="graph",e.HEART_2="heart-2",e.HEART_3="heart-3",e.HEART_4="heart-4",e.HEART_5="heart-5",e.HEART="heart",e.HOUSE="house",e.ID_CARD="id-card",e.INFINITE="infinite",e.INVITE_LETTER="invite-letter",e.JARS="jars",e.KEY="key",e.LIGHT_BULB="light-bulb",e.LOCK="lock",e.MAGNIFYING_GLASS="magnifying-glass",e.MAP="map",e.MARBLE_CARD_BUSINESS="marble-card-business",e.MARBLE_CARD="marble-card",e.MARBLE="marble",e.MEGAPHONE="megaphone",e.MULTI_CURRENCY="multi-currency",e.ONE_INVITE_LETTER_OPENED="one-invite-letter-opened",e.PALM_TREE="palm-tree",e.PERCENTAGE="percentage",e.PERSONAL_CARD="personal-card",e.PHONES="phones",e.PIE_CHART="pie-chart",e.PLANE_2="plane-2",e.PLANE="plane",e.PUZZLE_PIECES="puzzle-pieces",e.QUESTION_MARK="question-mark",e.RECEIVE="receive",e.REMINDER_LETTER="reminder-letter",e.SAND_TIMER="sand-timer",e.SHOPPING_BAG="shopping-bag",e.SKIP_AUTHENTICATION="skip-authentication",e.SPEECH_BUBBLE="speech-bubble",e.TOOL="tool",e.TWO_INVITE_LETTERS_OPENED="two-invite-letters-opened",e.WALLET="wallet"}(n||(n={}));export{n as Assets,r as Illustration,a as Sizes};
-//# sourceMappingURL=index.modern.mjs.map

package/dist/index.modern.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.modern.mjs","sources":["../src/common.ts","../src/illustrations/Illustration.tsx","../src/illustrations/metadata.ts"],"sourcesContent":["export enum Sizes {\n  SMALL = 'small',\n  MEDIUM = 'medium',\n  LARGE = 'large',\n}\n\nexport type LargeSize = 'large';\nexport type MediumSize = 'medium';\nexport type SmallSize = 'small';\n\nexport type Descriptors = '1x' | '1.5x' | '2x' | '3x' | '4x';\n","import classNames from 'classnames';\nimport React, { forwardRef, ImgHTMLAttributes } from 'react';\n\nimport { LargeSize, MediumSize, SmallSize, Descriptors, Sizes } from './../common';\nimport { IllustrationNames } from './metadata';\n\n// Picking only a few props from Image element to avoid breaking change\n// as in future underlying element might change\ntype ImgProps = Pick<ImgHTMLAttributes<HTMLImageElement>, 'id' | 'className'>;\n\nexport type IllustrationSizes = LargeSize | MediumSize | SmallSize;\n\nexport type Props = {\n  name: IllustrationNames;\n  alt: string;\n  size?: IllustrationSizes;\n  loading?: 'eager' | 'lazy';\n  disablePadding?: boolean;\n} & ImgProps;\n\nconst imageSizes = {\n  [Sizes.SMALL]: 200,\n  [Sizes.MEDIUM]: 300,\n  [Sizes.LARGE]: 500,\n};\n\nconst Illustration = forwardRef<HTMLImageElement, Props>(\n  (\n    {\n      id,\n      name,\n      alt,\n      loading = 'eager',\n      className,\n      size = Sizes.MEDIUM,\n      disablePadding = false,\n    }: Props,\n    ref,\n  ) => {\n    const { SMALL, MEDIUM } = Sizes;\n\n    return name ? (\n      <picture>\n        {size === Sizes.LARGE || size === Sizes.MEDIUM ? (\n          <>\n            <source\n              width={imageSizes[SMALL]}\n              height={imageSizes[SMALL]}\n              media=\"(max-width: 575px)\"\n              srcSet={`${defineSrc(name, SMALL, '1x')}, ${defineSrc(name, SMALL, '2x')} 2x`}\n            />\n            {size !== Sizes.MEDIUM ? (\n              <source\n                width={imageSizes[MEDIUM]}\n                height={imageSizes[MEDIUM]}\n                media=\"(max-width: 992px)\"\n                srcSet={`${defineSrc(name, MEDIUM, '1x')}, ${defineSrc(name, MEDIUM, '2x')} 2x`}\n              />\n            ) : null}\n          </>\n        ) : null}\n\n        <img\n          id={id}\n          ref={ref}\n          alt={alt ?? name.replace('-', ' ')}\n          data-testid={`wds-${name}-illustration`}\n          className={classNames(\n            'wds-illustration',\n            `wds-illustration-${name}`,\n            { 'wds-illustration-padding': !disablePadding },\n            className,\n          )}\n          loading={loading}\n          src={defineSrc(name, size, '1x')}\n          srcSet={`${defineSrc(name, size, '2x')} 2x`}\n          width={imageSizes[size]}\n          height={imageSizes[size]}\n        />\n      </picture>\n    ) : null;\n  },\n);\n\nfunction defineSrc(illustration: string, size: IllustrationSizes, descriptor: Descriptors) {\n  return `https://wise.com/web-art/assets/illustrations/${illustration}-${size}@${descriptor}.webp`;\n}\n\nexport default Illustration;\n","/*\n *\n * DON'T MODIFY THIS FILE IT'S AUTO GENERATED\n * See: `scripts/generate-i10s-metadata.mjs`\n *\n */\n\nexport enum Assets {\n  BELL = 'bell',\n  BRIEFCASE = 'briefcase',\n  BUSINESS_CARD = 'business-card',\n  CALENDAR = 'calendar',\n  CHECK_MARK = 'check-mark',\n  CLOSED_WINDOW = 'closed-window',\n  COIN_PILE_DOWN = 'coin-pile-down',\n  COIN_PILE_UP = 'coin-pile-up',\n  CONFETTI = 'confetti',\n  CONSTRUCTION_FENCE = 'construction-fence',\n  CONVERT = 'convert',\n  COOKIE = 'cookie',\n  DIGITAL_CARD_2 = 'digital-card-2',\n  DIGITAL_CARD = 'digital-card',\n  DOCUMENTS = 'documents',\n  DOOR = 'door',\n  ECO_CARD = 'eco-card',\n  ELECTRIC_PLUG = 'electric-plug',\n  EMAIL_SUCCESS = 'email-success',\n  EMAIL = 'email',\n  EXCLAMATION_MARK = 'exclamation-mark',\n  FLAG = 'flag',\n  FLOWER = 'flower',\n  GEAR = 'gear',\n  GLOBE = 'globe',\n  GRAPH = 'graph',\n  HEART_2 = 'heart-2',\n  HEART_3 = 'heart-3',\n  HEART_4 = 'heart-4',\n  HEART_5 = 'heart-5',\n  HEART = 'heart',\n  HOUSE = 'house',\n  ID_CARD = 'id-card',\n  INFINITE = 'infinite',\n  INVITE_LETTER = 'invite-letter',\n  JARS = 'jars',\n  KEY = 'key',\n  LIGHT_BULB = 'light-bulb',\n  LOCK = 'lock',\n  MAGNIFYING_GLASS = 'magnifying-glass',\n  MAP = 'map',\n  MARBLE_CARD_BUSINESS = 'marble-card-business',\n  MARBLE_CARD = 'marble-card',\n  MARBLE = 'marble',\n  MEGAPHONE = 'megaphone',\n  MULTI_CURRENCY = 'multi-currency',\n  ONE_INVITE_LETTER_OPENED = 'one-invite-letter-opened',\n  PALM_TREE = 'palm-tree',\n  PERCENTAGE = 'percentage',\n  PERSONAL_CARD = 'personal-card',\n  PHONES = 'phones',\n  PIE_CHART = 'pie-chart',\n  PLANE_2 = 'plane-2',\n  PLANE = 'plane',\n  PUZZLE_PIECES = 'puzzle-pieces',\n  QUESTION_MARK = 'question-mark',\n  RECEIVE = 'receive',\n  REMINDER_LETTER = 'reminder-letter',\n  SAND_TIMER = 'sand-timer',\n  SHOPPING_BAG = 'shopping-bag',\n  SKIP_AUTHENTICATION = 'skip-authentication',\n  SPEECH_BUBBLE = 'speech-bubble',\n  TOOL = 'tool',\n  TWO_INVITE_LETTERS_OPENED = 'two-invite-letters-opened',\n  WALLET = 'wallet',\n}\n\nexport type IllustrationNames =\n  | 'bell'\n  | 'briefcase'\n  | 'business-card'\n  | 'calendar'\n  | 'check-mark'\n  | 'closed-window'\n  | 'coin-pile-down'\n  | 'coin-pile-up'\n  | 'confetti'\n  | 'construction-fence'\n  | 'convert'\n  | 'cookie'\n  | 'digital-card-2'\n  | 'digital-card'\n  | 'documents'\n  | 'door'\n  | 'eco-card'\n  | 'electric-plug'\n  | 'email-success'\n  | 'email'\n  | 'exclamation-mark'\n  | 'flag'\n  | 'flower'\n  | 'gear'\n  | 'globe'\n  | 'graph'\n  | 'heart-2'\n  | 'heart-3'\n  | 'heart-4'\n  | 'heart-5'\n  | 'heart'\n  | 'house'\n  | 'id-card'\n  | 'infinite'\n  | 'invite-letter'\n  | 'jars'\n  | 'key'\n  | 'light-bulb'\n  | 'lock'\n  | 'magnifying-glass'\n  | 'map'\n  | 'marble-card-business'\n  | 'marble-card'\n  | 'marble'\n  | 'megaphone'\n  | 'multi-currency'\n  | 'one-invite-letter-opened'\n  | 'palm-tree'\n  | 'percentage'\n  | 'personal-card'\n  | 'phones'\n  | 'pie-chart'\n  | 'plane-2'\n  | 'plane'\n  | 'puzzle-pieces'\n  | 'question-mark'\n  | 'receive'\n  | 'reminder-letter'\n  | 'sand-timer'\n  | 'shopping-bag'\n  | 'skip-authentication'\n  | 'speech-bubble'\n  | 'tool'\n  | 'two-invite-letters-opened'\n  | 'wallet';\n"],"names":["Sizes","imageSizes","SMALL","MEDIUM","LARGE","Illustration","forwardRef","id","name","alt","loading","className","size","disablePadding","ref","React","createElement","Fragment","width","height","media","srcSet","defineSrc","replace","classNames","src","illustration","descriptor","Assets"],"mappings":"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"}

package/dist/index.umd.js

@@ -1,2 +0,0 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("classnames"),require("react")):"function"==typeof define&&define.amd?define(["exports","classnames","react"],t):t((e||self).art={},e.classnames,e.react)}(this,function(e,t,i){function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l,E,s=/*#__PURE__*/a(t),r=/*#__PURE__*/a(i);e.Sizes=void 0,(l=e.Sizes||(e.Sizes={})).SMALL="small",l.MEDIUM="medium",l.LARGE="large";var n,d=((E={})[e.Sizes.SMALL]=200,E[e.Sizes.MEDIUM]=300,E[e.Sizes.LARGE]=500,E),o=i.forwardRef(function(t,i){var a=t.id,l=t.name,E=t.alt,n=t.loading,o=void 0===n?"eager":n,A=t.className,u=t.size,I=void 0===u?e.Sizes.MEDIUM:u,R=t.disablePadding,L=void 0!==R&&R,S=e.Sizes.SMALL,_=e.Sizes.MEDIUM;return l?/*#__PURE__*/r.default.createElement("picture",null,I===e.Sizes.LARGE||I===e.Sizes.MEDIUM?/*#__PURE__*/r.default.createElement(r.default.Fragment,null,/*#__PURE__*/r.default.createElement("source",{width:d[S],height:d[S],media:"(max-width: 575px)",srcSet:c(l,S,"1x")+", "+c(l,S,"2x")+" 2x"}),I!==e.Sizes.MEDIUM?/*#__PURE__*/r.default.createElement("source",{width:d[_],height:d[_],media:"(max-width: 992px)",srcSet:c(l,_,"1x")+", "+c(l,_,"2x")+" 2x"}):null):null,/*#__PURE__*/r.default.createElement("img",{id:a,ref:i,alt:null!=E?E:l.replace("-"," "),"data-testid":"wds-"+l+"-illustration",className:s.default("wds-illustration","wds-illustration-"+l,{"wds-illustration-padding":!L},A),loading:o,src:c(l,I,"1x"),srcSet:c(l,I,"2x")+" 2x",width:d[I],height:d[I]})):null});function c(e,t,i){return"https://wise.com/web-art/assets/illustrations/"+e+"-"+t+"@"+i+".webp"}e.Assets=void 0,(n=e.Assets||(e.Assets={})).BELL="bell",n.BRIEFCASE="briefcase",n.BUSINESS_CARD="business-card",n.CALENDAR="calendar",n.CHECK_MARK="check-mark",n.CLOSED_WINDOW="closed-window",n.COIN_PILE_DOWN="coin-pile-down",n.COIN_PILE_UP="coin-pile-up",n.CONFETTI="confetti",n.CONSTRUCTION_FENCE="construction-fence",n.CONVERT="convert",n.COOKIE="cookie",n.DIGITAL_CARD_2="digital-card-2",n.DIGITAL_CARD="digital-card",n.DOCUMENTS="documents",n.DOOR="door",n.ECO_CARD="eco-card",n.ELECTRIC_PLUG="electric-plug",n.EMAIL_SUCCESS="email-success",n.EMAIL="email",n.EXCLAMATION_MARK="exclamation-mark",n.FLAG="flag",n.FLOWER="flower",n.GEAR="gear",n.GLOBE="globe",n.GRAPH="graph",n.HEART_2="heart-2",n.HEART_3="heart-3",n.HEART_4="heart-4",n.HEART_5="heart-5",n.HEART="heart",n.HOUSE="house",n.ID_CARD="id-card",n.INFINITE="infinite",n.INVITE_LETTER="invite-letter",n.JARS="jars",n.KEY="key",n.LIGHT_BULB="light-bulb",n.LOCK="lock",n.MAGNIFYING_GLASS="magnifying-glass",n.MAP="map",n.MARBLE_CARD_BUSINESS="marble-card-business",n.MARBLE_CARD="marble-card",n.MARBLE="marble",n.MEGAPHONE="megaphone",n.MULTI_CURRENCY="multi-currency",n.ONE_INVITE_LETTER_OPENED="one-invite-letter-opened",n.PALM_TREE="palm-tree",n.PERCENTAGE="percentage",n.PERSONAL_CARD="personal-card",n.PHONES="phones",n.PIE_CHART="pie-chart",n.PLANE_2="plane-2",n.PLANE="plane",n.PUZZLE_PIECES="puzzle-pieces",n.QUESTION_MARK="question-mark",n.RECEIVE="receive",n.REMINDER_LETTER="reminder-letter",n.SAND_TIMER="sand-timer",n.SHOPPING_BAG="shopping-bag",n.SKIP_AUTHENTICATION="skip-authentication",n.SPEECH_BUBBLE="speech-bubble",n.TOOL="tool",n.TWO_INVITE_LETTERS_OPENED="two-invite-letters-opened",n.WALLET="wallet",e.Illustration=o});
-//# sourceMappingURL=index.umd.js.map

package/dist/index.umd.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.umd.js","sources":["../src/common.ts","../src/illustrations/Illustration.tsx","../src/illustrations/metadata.ts"],"sourcesContent":["export enum Sizes {\n  SMALL = 'small',\n  MEDIUM = 'medium',\n  LARGE = 'large',\n}\n\nexport type LargeSize = 'large';\nexport type MediumSize = 'medium';\nexport type SmallSize = 'small';\n\nexport type Descriptors = '1x' | '1.5x' | '2x' | '3x' | '4x';\n","import classNames from 'classnames';\nimport React, { forwardRef, ImgHTMLAttributes } from 'react';\n\nimport { LargeSize, MediumSize, SmallSize, Descriptors, Sizes } from './../common';\nimport { IllustrationNames } from './metadata';\n\n// Picking only a few props from Image element to avoid breaking change\n// as in future underlying element might change\ntype ImgProps = Pick<ImgHTMLAttributes<HTMLImageElement>, 'id' | 'className'>;\n\nexport type IllustrationSizes = LargeSize | MediumSize | SmallSize;\n\nexport type Props = {\n  name: IllustrationNames;\n  alt: string;\n  size?: IllustrationSizes;\n  loading?: 'eager' | 'lazy';\n  disablePadding?: boolean;\n} & ImgProps;\n\nconst imageSizes = {\n  [Sizes.SMALL]: 200,\n  [Sizes.MEDIUM]: 300,\n  [Sizes.LARGE]: 500,\n};\n\nconst Illustration = forwardRef<HTMLImageElement, Props>(\n  (\n    {\n      id,\n      name,\n      alt,\n      loading = 'eager',\n      className,\n      size = Sizes.MEDIUM,\n      disablePadding = false,\n    }: Props,\n    ref,\n  ) => {\n    const { SMALL, MEDIUM } = Sizes;\n\n    return name ? (\n      <picture>\n        {size === Sizes.LARGE || size === Sizes.MEDIUM ? (\n          <>\n            <source\n              width={imageSizes[SMALL]}\n              height={imageSizes[SMALL]}\n              media=\"(max-width: 575px)\"\n              srcSet={`${defineSrc(name, SMALL, '1x')}, ${defineSrc(name, SMALL, '2x')} 2x`}\n            />\n            {size !== Sizes.MEDIUM ? (\n              <source\n                width={imageSizes[MEDIUM]}\n                height={imageSizes[MEDIUM]}\n                media=\"(max-width: 992px)\"\n                srcSet={`${defineSrc(name, MEDIUM, '1x')}, ${defineSrc(name, MEDIUM, '2x')} 2x`}\n              />\n            ) : null}\n          </>\n        ) : null}\n\n        <img\n          id={id}\n          ref={ref}\n          alt={alt ?? name.replace('-', ' ')}\n          data-testid={`wds-${name}-illustration`}\n          className={classNames(\n            'wds-illustration',\n            `wds-illustration-${name}`,\n            { 'wds-illustration-padding': !disablePadding },\n            className,\n          )}\n          loading={loading}\n          src={defineSrc(name, size, '1x')}\n          srcSet={`${defineSrc(name, size, '2x')} 2x`}\n          width={imageSizes[size]}\n          height={imageSizes[size]}\n        />\n      </picture>\n    ) : null;\n  },\n);\n\nfunction defineSrc(illustration: string, size: IllustrationSizes, descriptor: Descriptors) {\n  return `https://wise.com/web-art/assets/illustrations/${illustration}-${size}@${descriptor}.webp`;\n}\n\nexport default Illustration;\n","/*\n *\n * DON'T MODIFY THIS FILE IT'S AUTO GENERATED\n * See: `scripts/generate-i10s-metadata.mjs`\n *\n */\n\nexport enum Assets {\n  BELL = 'bell',\n  BRIEFCASE = 'briefcase',\n  BUSINESS_CARD = 'business-card',\n  CALENDAR = 'calendar',\n  CHECK_MARK = 'check-mark',\n  CLOSED_WINDOW = 'closed-window',\n  COIN_PILE_DOWN = 'coin-pile-down',\n  COIN_PILE_UP = 'coin-pile-up',\n  CONFETTI = 'confetti',\n  CONSTRUCTION_FENCE = 'construction-fence',\n  CONVERT = 'convert',\n  COOKIE = 'cookie',\n  DIGITAL_CARD_2 = 'digital-card-2',\n  DIGITAL_CARD = 'digital-card',\n  DOCUMENTS = 'documents',\n  DOOR = 'door',\n  ECO_CARD = 'eco-card',\n  ELECTRIC_PLUG = 'electric-plug',\n  EMAIL_SUCCESS = 'email-success',\n  EMAIL = 'email',\n  EXCLAMATION_MARK = 'exclamation-mark',\n  FLAG = 'flag',\n  FLOWER = 'flower',\n  GEAR = 'gear',\n  GLOBE = 'globe',\n  GRAPH = 'graph',\n  HEART_2 = 'heart-2',\n  HEART_3 = 'heart-3',\n  HEART_4 = 'heart-4',\n  HEART_5 = 'heart-5',\n  HEART = 'heart',\n  HOUSE = 'house',\n  ID_CARD = 'id-card',\n  INFINITE = 'infinite',\n  INVITE_LETTER = 'invite-letter',\n  JARS = 'jars',\n  KEY = 'key',\n  LIGHT_BULB = 'light-bulb',\n  LOCK = 'lock',\n  MAGNIFYING_GLASS = 'magnifying-glass',\n  MAP = 'map',\n  MARBLE_CARD_BUSINESS = 'marble-card-business',\n  MARBLE_CARD = 'marble-card',\n  MARBLE = 'marble',\n  MEGAPHONE = 'megaphone',\n  MULTI_CURRENCY = 'multi-currency',\n  ONE_INVITE_LETTER_OPENED = 'one-invite-letter-opened',\n  PALM_TREE = 'palm-tree',\n  PERCENTAGE = 'percentage',\n  PERSONAL_CARD = 'personal-card',\n  PHONES = 'phones',\n  PIE_CHART = 'pie-chart',\n  PLANE_2 = 'plane-2',\n  PLANE = 'plane',\n  PUZZLE_PIECES = 'puzzle-pieces',\n  QUESTION_MARK = 'question-mark',\n  RECEIVE = 'receive',\n  REMINDER_LETTER = 'reminder-letter',\n  SAND_TIMER = 'sand-timer',\n  SHOPPING_BAG = 'shopping-bag',\n  SKIP_AUTHENTICATION = 'skip-authentication',\n  SPEECH_BUBBLE = 'speech-bubble',\n  TOOL = 'tool',\n  TWO_INVITE_LETTERS_OPENED = 'two-invite-letters-opened',\n  WALLET = 'wallet',\n}\n\nexport type IllustrationNames =\n  | 'bell'\n  | 'briefcase'\n  | 'business-card'\n  | 'calendar'\n  | 'check-mark'\n  | 'closed-window'\n  | 'coin-pile-down'\n  | 'coin-pile-up'\n  | 'confetti'\n  | 'construction-fence'\n  | 'convert'\n  | 'cookie'\n  | 'digital-card-2'\n  | 'digital-card'\n  | 'documents'\n  | 'door'\n  | 'eco-card'\n  | 'electric-plug'\n  | 'email-success'\n  | 'email'\n  | 'exclamation-mark'\n  | 'flag'\n  | 'flower'\n  | 'gear'\n  | 'globe'\n  | 'graph'\n  | 'heart-2'\n  | 'heart-3'\n  | 'heart-4'\n  | 'heart-5'\n  | 'heart'\n  | 'house'\n  | 'id-card'\n  | 'infinite'\n  | 'invite-letter'\n  | 'jars'\n  | 'key'\n  | 'light-bulb'\n  | 'lock'\n  | 'magnifying-glass'\n  | 'map'\n  | 'marble-card-business'\n  | 'marble-card'\n  | 'marble'\n  | 'megaphone'\n  | 'multi-currency'\n  | 'one-invite-letter-opened'\n  | 'palm-tree'\n  | 'percentage'\n  | 'personal-card'\n  | 'phones'\n  | 'pie-chart'\n  | 'plane-2'\n  | 'plane'\n  | 'puzzle-pieces'\n  | 'question-mark'\n  | 'receive'\n  | 'reminder-letter'\n  | 'sand-timer'\n  | 'shopping-bag'\n  | 'skip-authentication'\n  | 'speech-bubble'\n  | 'tool'\n  | 'two-invite-letters-opened'\n  | 'wallet';\n"],"names":["Sizes","_imageSizes","Assets","imageSizes","SMALL","MEDIUM","LARGE","Illustration","forwardRef","ref","id","name","_ref","alt","loading","_ref$loading","className","size","_ref$size","disablePadding","_ref$disablePadding","React","createElement","Fragment","width","height","media","srcSet","defineSrc","replace","classNames","src","illustration","descriptor","exports"],"mappings":"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"}