@wise/art 0.0.3 → 0.0.5

package/README.md

@@ -1 +1,26 @@
-### `@wise/art`
+# `@wise/art` 
+
+
+### Usage in Angular Environment
+
+This package don't provide support for Angular.
+
+Consider use [`react2angular`](https://www.npmjs.com/package/react2angular) or alike wrappers:
+
+```js
+import { react2angular } from 'react2angular';
+import { Illustration } from '@wise/art';
+
+angular
+  .module('tw.someModule', [ ... ])
+  .component('twIllustration', react2angular(Illustration))
+```
+
+in Angular HTML template file
+```html
+<tw-illustration
+  id="'test-id'"
+  alt="'Image of briefcase'"
+  name="'briefcase'">
+</tw-illustration>
+```

package/dist/illustrations/Illustration.stories.d.ts

@@ -8,8 +8,8 @@ declare const _default: {
         size?: import("./Illustration").IllustrationSizes | undefined;
         loading?: "eager" | "lazy" | undefined;
     } & {
-        className?: string | undefined;
         id?: string | undefined;
+        className?: string | undefined;
     } & React.RefAttributes<HTMLImageElement>>;
     title: string;
 };

package/dist/index.d.ts

@@ -1,5 +1,4 @@
 export { default as Illustration } from './illustrations';
-export { default as Temp } from './Temp';
 export { Assets } from './illustrations';
 export { Sizes } from './common';
 export type { IllustrationNames, IllustrationProps } from './illustrations';

package/dist/index.js

@@ -1,2 +1,2 @@
-var e=require("classnames"),t=require("react");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var s,a=/*#__PURE__*/r(e),l=/*#__PURE__*/r(t);exports.Sizes=void 0,(s=exports.Sizes||(exports.Sizes={})).SMALL="small",s.MEDIUM="medium",s.LARGE="large",s.AUTO="auto";var i,E=t.forwardRef(function(e,t){var r=e.name,s=e.alt,i=e.loading,E=void 0===i?"lazy":i,o=e.size,c=void 0===o?exports.Sizes.AUTO:o,u=exports.Sizes.SMALL,d=exports.Sizes.MEDIUM,p=exports.Sizes.LARGE,A=c===exports.Sizes.AUTO;return r?/*#__PURE__*/l.default.createElement("picture",{id:e.id,className:a.default("wds-illustration","wds-illustration-"+r,e.className)},A?/*#__PURE__*/l.default.createElement(l.default.Fragment,null,/*#__PURE__*/l.default.createElement("source",{media:"(max-width: 575px)",srcSet:n(r,u,"1x")+", "+n(r,u,"2x")+" 2x"}),/*#__PURE__*/l.default.createElement("source",{media:"(max-width: 991px)",srcSet:n(r,d,"1x")+", "+n(r,d,"2x")+" 2x"})):null,/*#__PURE__*/l.default.createElement("img",{ref:t,alt:s,loading:E,src:n(r,A?p:c,"1x"),srcSet:n(r,A?p:c,"2x")+" 2x"})):null});function n(e,t,r){return"illustrations/assets/"+e+"-"+t+"@"+r+".webp"}exports.Assets=void 0,(i=exports.Assets||(exports.Assets={})).BELL="bell",i.BRIEFCASE="briefcase",i.CALENDAR="calendar",i.CHECK_MARK="check-mark",i.CLOSED_WINDOW="closed-window",i.COIN_PILE="coin-pile",i.CONFETTI="confetti",i.CONSTRUCTION_FENCE="construction-fence",i.CONVERT="convert",i.COOKIE="cookie",i.DOCUMENTS="documents",i.DOOR="door",i.ELECTRIC_PLUG="electric-plug",i.EMAIL="email",i.EXCLAMATION_MARK="exclamation-mark",i.FLAG="flag",i.FLOWER="flower",i.GEAR="gear",i.GLOBE="globe",i.GRAPH="graph",i.HEART="heart",i.HOUSE="house",i.ID_CARD="id-card",i.INFINITE="infinite",i.INVITE_LETTER="invite-letter",i.JARS="jars",i.KEY="key",i.LIGHT_BULB="light-bulb",i.LOCK="lock",i.MAGNIFYING_GLASS="magnifying-glass",i.MAP="map",i.MEGAPHONE="megaphone",i.MULTI_CURRENCY="multi-currency",i.ONE_INVITE_LETTER_OPENED="one-invite-letter-opened",i.PALM_TREE="palm-tree",i.PHONES="phones",i.PIE_CHART="pie-chart",i.PLANE="plane",i.PUZZLE_PIECES="puzzle-pieces",i.QUESTION_MARK="question-mark",i.RECEIVE="receive",i.REMINDER_LETTER="reminder-letter",i.SAND_TIMER="sand-timer",i.SHOPPING_BAG="shopping-bag",i.SKIP_AUTHENTICATION="skip-authentication",i.SPEECH_BUBBLE="speech-bubble",i.TOOL="tool",i.TWO_INVITE_LETTERS_OPENED="two-invite-letters-opened",i.WALLET="wallet",exports.Illustration=E,exports.Temp=function(){/*#__PURE__*/return l.default.createElement("img",{className:"wds-temp",src:"illustrations/assets/bell-large@1x.webp",alt:"test"})};
+var e=require("classnames"),t=require("react");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a,i=/*#__PURE__*/r(e),s=/*#__PURE__*/r(t);exports.Sizes=void 0,(a=exports.Sizes||(exports.Sizes={})).SMALL="small",a.MEDIUM="medium",a.LARGE="large",a.AUTO="auto";var E,l=t.forwardRef(function(e,t){var r=e.name,a=e.alt,E=e.loading,l=void 0===E?"lazy":E,n=e.size,c=void 0===n?exports.Sizes.AUTO:n,u=exports.Sizes.SMALL,A=exports.Sizes.MEDIUM,I=exports.Sizes.LARGE,d=c===exports.Sizes.AUTO;return r?/*#__PURE__*/s.default.createElement("picture",{id:e.id,className:i.default("wds-illustration","wds-illustration-"+r,e.className)},d?/*#__PURE__*/s.default.createElement(s.default.Fragment,null,/*#__PURE__*/s.default.createElement("source",{media:"(max-width: 575px)",srcSet:o(r,u,"1x")+", "+o(r,u,"2x")+" 2x"}),/*#__PURE__*/s.default.createElement("source",{media:"(max-width: 991px)",srcSet:o(r,A,"1x")+", "+o(r,A,"2x")+" 2x"})):null,/*#__PURE__*/s.default.createElement("img",{ref:t,alt:a,loading:l,src:o(r,d?I:c,"1x"),srcSet:o(r,d?I:c,"2x")+" 2x"})):null});function o(e,t,r){return"https://wise.com/web-art/assets/illustrations/"+e+"-"+t+"@"+r+".webp"}exports.Assets=void 0,(E=exports.Assets||(exports.Assets={})).BELL="bell",E.BRIEFCASE="briefcase",E.CALENDAR="calendar",E.CHECK_MARK="check-mark",E.CLOSED_WINDOW="closed-window",E.COIN_PILE="coin-pile",E.CONFETTI="confetti",E.CONSTRUCTION_FENCE="construction-fence",E.CONVERT="convert",E.COOKIE="cookie",E.DOCUMENTS="documents",E.DOOR="door",E.ELECTRIC_PLUG="electric-plug",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="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.MEGAPHONE="megaphone",E.MULTI_CURRENCY="multi-currency",E.ONE_INVITE_LETTER_OPENED="one-invite-letter-opened",E.PALM_TREE="palm-tree",E.PHONES="phones",E.PIE_CHART="pie-chart",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",exports.Illustration=l;
 //# 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","../src/Temp.tsx"],"sourcesContent":["export enum Sizes {\n  SMALL = 'small',\n  MEDIUM = 'medium',\n  LARGE = 'large',\n  AUTO = 'auto',\n}\n\nexport type LargeSize = 'large';\nexport type MediumSize = 'medium';\nexport type SmallSize = 'small';\nexport type AutoSize = 'auto';\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, AutoSize, 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 | AutoSize;\n\nexport type Props = {\n  name: IllustrationNames;\n  alt: string;\n  size?: IllustrationSizes;\n  loading?: 'eager' | 'lazy';\n} & ImgProps;\n\nconst Illustration = forwardRef<HTMLImageElement, Props>(\n  ({ id, name, alt, loading = 'lazy', className, size = Sizes.AUTO }: Props, ref) => {\n    const { SMALL, MEDIUM, LARGE } = Sizes;\n    const autoSize: boolean = size === Sizes.AUTO;\n    return name ? (\n      <picture\n        id={id}\n        className={classNames('wds-illustration', `wds-illustration-${name}`, className)}\n      >\n        {autoSize ? (\n          <>\n            {/* Mobile Screens */}\n            <source\n              media=\"(max-width: 575px)\"\n              srcSet={`${defineSrc(name, SMALL, '1x')}, ${defineSrc(name, SMALL, '2x')} 2x`}\n            />\n            {/* Tablets */}\n            <source\n              media=\"(max-width: 991px)\"\n              srcSet={`${defineSrc(name, MEDIUM, '1x')}, ${defineSrc(name, MEDIUM, '2x')} 2x`}\n            />\n          </>\n        ) : null}\n\n        <img\n          ref={ref}\n          alt={alt}\n          loading={loading}\n          src={defineSrc(name, autoSize ? LARGE : size, '1x')}\n          srcSet={`${defineSrc(name, autoSize ? LARGE : size, '2x')} 2x`}\n        />\n      </picture>\n    ) : null;\n  },\n);\n\nfunction defineSrc(illustration: string, size: IllustrationSizes, descriptor: Descriptors) {\n  return `illustrations/assets/${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  CALENDAR = 'calendar',\n  CHECK_MARK = 'check-mark',\n  CLOSED_WINDOW = 'closed-window',\n  COIN_PILE = 'coin-pile',\n  CONFETTI = 'confetti',\n  CONSTRUCTION_FENCE = 'construction-fence',\n  CONVERT = 'convert',\n  COOKIE = 'cookie',\n  DOCUMENTS = 'documents',\n  DOOR = 'door',\n  ELECTRIC_PLUG = 'electric-plug',\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 = '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  MEGAPHONE = 'megaphone',\n  MULTI_CURRENCY = 'multi-currency',\n  ONE_INVITE_LETTER_OPENED = 'one-invite-letter-opened',\n  PALM_TREE = 'palm-tree',\n  PHONES = 'phones',\n  PIE_CHART = 'pie-chart',\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  | 'calendar'\n  | 'check-mark'\n  | 'closed-window'\n  | 'coin-pile'\n  | 'confetti'\n  | 'construction-fence'\n  | 'convert'\n  | 'cookie'\n  | 'documents'\n  | 'door'\n  | 'electric-plug'\n  | 'email'\n  | 'exclamation-mark'\n  | 'flag'\n  | 'flower'\n  | 'gear'\n  | 'globe'\n  | 'graph'\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  | 'megaphone'\n  | 'multi-currency'\n  | 'one-invite-letter-opened'\n  | 'palm-tree'\n  | 'phones'\n  | 'pie-chart'\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 React from 'react';\n\nconst Temp = () => {\n  return <img className=\"wds-temp\" src=\"illustrations/assets/bell-large@1x.webp\" alt=\"test\" />;\n};\n\nexport default Temp;\n"],"names":["Sizes","Illustration","Assets","forwardRef","ref","name","alt","_ref$loading","_ref","loading","className","size","AUTO","_ref$size","SMALL","MEDIUM","LARGE","autoSize","React","createElement","id","classNames","Fragment","media","srcSet","defineSrc","src","illustration","descriptor"],"mappings":"2HAAYA,gEAAAA,EAAAA,QAAKA,QAALA,cAKX,CAAA,IAJC,MAAA,QACAA,EAAA,OAAA,SACAA,EAAA,MAAA,QACAA,EAAA,KAAA,OCeIC,ICZMC,EDYMD,EAAGE,EAAUA,WAC7B,SAA2EC,EAAAA,GAAO,IAA3EC,EAAAA,EAAAA,KAAMC,IAAAA,IAAGC,EAAAC,EAAEC,QAAAA,OAAO,IAAAF,EAAG,OAAQG,EAAWC,EAAAA,EAAAA,KAAAA,OAAOX,IAAAA,EAAAA,cAAMY,KAC1DC,IAAiCb,QAAAA,MAAzBc,MAAOC,EAAkBf,QAAKA,MAAvBe,OAAQC,EAAUhB,QAAKA,MAAfgB,MACTC,EAAYN,IAASX,QAAKA,MAACY,KACzC,OAAOP,eACLa,UACEC,cAAA,UAAA,CAAAC,GALDZ,EAAFY,GAMGV,UAAWW,EAAAA,QAAW,mBAAwChB,oBAAAA,EANhCK,EAAAA,YAQ7BO,eACCC,EAAA,QAAAC,cAAAD,EAAA,QAAAI,SAAA,kBAEEJ,EAAAA,QACEC,cAAA,SAAA,CAAAI,MAAM,qBACNC,OAAWC,EAAUpB,EAAMS,EAAO,MAAUW,KAAAA,EAAUpB,EAAMS,EAAO,2BAGrEI,EAAAA,QACEC,cAAA,SAAA,CAAAI,MAAM,qBACNC,OAAWC,EAAUpB,EAAMU,EAAQ,MAAUU,KAAAA,EAAUpB,EAAMU,EAAQ,MAAK,SAG5E,kBAEJG,EACE,QAAAC,cAAA,MAAA,CAAAf,IAAKA,EACLE,IAAKA,EACLG,QAASA,EACTiB,IAAKD,EAAUpB,EAAMY,EAAWD,EAAQL,EAAM,MAC9Ca,OAAWC,EAAUpB,EAAMY,EAAWD,EAAQL,EAAM,MAAW,SAGjE,IACN,GAGF,SAASc,EAAUE,EAAsBhB,EAAyBiB,GAChE,MAAA,wBAA+BD,EAAY,IAAIhB,EAAI,IAAIiB,EAAU,OACnE,CCAC1B,QAAAA,YAAAA,GAlDWA,EAAAA,QAAMA,SAANA,eAkDX,CAAA,IAjDC,KAAA,OACAA,EAAA,UAAA,YACAA,EAAA,SAAA,WACAA,EAAA,WAAA,aACAA,EAAA,cAAA,gBACAA,EAAA,UAAA,YACAA,EAAA,SAAA,WACAA,EAAA,mBAAA,qBACAA,EAAA,QAAA,UACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,EAAA,KAAA,OACAA,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,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,UAAA,YACAA,EAAA,eAAA,iBACAA,EAAA,yBAAA,2BACAA,EAAA,UAAA,YACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,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,6CCtDW,wBACX,OAAOgB,EAAK,QAAAC,cAAA,MAAA,CAAAT,UAAU,WAAWgB,IAAI,0CAA0CpB,IAAI,QACrF"}
+{"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  AUTO = 'auto',\n}\n\nexport type LargeSize = 'large';\nexport type MediumSize = 'medium';\nexport type SmallSize = 'small';\nexport type AutoSize = 'auto';\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, AutoSize, 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 | AutoSize;\n\nexport type Props = {\n  name: IllustrationNames;\n  alt: string;\n  size?: IllustrationSizes;\n  loading?: 'eager' | 'lazy';\n} & ImgProps;\n\nconst Illustration = forwardRef<HTMLImageElement, Props>(\n  ({ id, name, alt, loading = 'lazy', className, size = Sizes.AUTO }: Props, ref) => {\n    const { SMALL, MEDIUM, LARGE } = Sizes;\n    const autoSize: boolean = size === Sizes.AUTO;\n    return name ? (\n      <picture\n        id={id}\n        className={classNames('wds-illustration', `wds-illustration-${name}`, className)}\n      >\n        {autoSize ? (\n          <>\n            {/* Mobile Screens */}\n            <source\n              media=\"(max-width: 575px)\"\n              srcSet={`${defineSrc(name, SMALL, '1x')}, ${defineSrc(name, SMALL, '2x')} 2x`}\n            />\n            {/* Tablets */}\n            <source\n              media=\"(max-width: 991px)\"\n              srcSet={`${defineSrc(name, MEDIUM, '1x')}, ${defineSrc(name, MEDIUM, '2x')} 2x`}\n            />\n          </>\n        ) : null}\n\n        <img\n          ref={ref}\n          alt={alt}\n          loading={loading}\n          src={defineSrc(name, autoSize ? LARGE : size, '1x')}\n          srcSet={`${defineSrc(name, autoSize ? LARGE : size, '2x')} 2x`}\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  CALENDAR = 'calendar',\n  CHECK_MARK = 'check-mark',\n  CLOSED_WINDOW = 'closed-window',\n  COIN_PILE = 'coin-pile',\n  CONFETTI = 'confetti',\n  CONSTRUCTION_FENCE = 'construction-fence',\n  CONVERT = 'convert',\n  COOKIE = 'cookie',\n  DOCUMENTS = 'documents',\n  DOOR = 'door',\n  ELECTRIC_PLUG = 'electric-plug',\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 = '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  MEGAPHONE = 'megaphone',\n  MULTI_CURRENCY = 'multi-currency',\n  ONE_INVITE_LETTER_OPENED = 'one-invite-letter-opened',\n  PALM_TREE = 'palm-tree',\n  PHONES = 'phones',\n  PIE_CHART = 'pie-chart',\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  | 'calendar'\n  | 'check-mark'\n  | 'closed-window'\n  | 'coin-pile'\n  | 'confetti'\n  | 'construction-fence'\n  | 'convert'\n  | 'cookie'\n  | 'documents'\n  | 'door'\n  | 'electric-plug'\n  | 'email'\n  | 'exclamation-mark'\n  | 'flag'\n  | 'flower'\n  | 'gear'\n  | 'globe'\n  | 'graph'\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  | 'megaphone'\n  | 'multi-currency'\n  | 'one-invite-letter-opened'\n  | 'palm-tree'\n  | 'phones'\n  | 'pie-chart'\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","Illustration","Assets","forwardRef","ref","name","alt","_ref$loading","_ref","loading","className","size","AUTO","_ref$size","SMALL","MEDIUM","LARGE","autoSize","React","createElement","id","classNames","Fragment","media","srcSet","defineSrc","src","illustration","descriptor"],"mappings":"2HAAYA,gEAAAA,EAAAA,QAAKA,QAALA,cAKX,CAAA,IAJC,MAAA,QACAA,EAAA,OAAA,SACAA,EAAA,MAAA,QACAA,EAAA,KAAA,OCeIC,ICZMC,EDYMD,EAAGE,EAAUA,WAC7B,SAA2EC,EAAAA,GAAO,IAA3EC,EAAAA,EAAAA,KAAMC,IAAAA,IAAGC,EAAAC,EAAEC,QAAAA,OAAO,IAAAF,EAAG,OAAQG,EAAWC,EAAAA,EAAAA,KAAAA,OAAOX,IAAAA,EAAAA,cAAMY,KAC1DC,IAAiCb,QAAAA,MAAzBc,MAAOC,EAAkBf,QAAKA,MAAvBe,OAAQC,EAAUhB,QAAKA,MAAfgB,MACTC,EAAYN,IAASX,QAAKA,MAACY,KACzC,OAAOP,eACLa,UACEC,cAAA,UAAA,CAAAC,GALDZ,EAAFY,GAMGV,UAAWW,EAAAA,QAAW,mBAAwChB,oBAAAA,EANhCK,EAAAA,YAQ7BO,eACCC,EAAA,QAAAC,cAAAD,EAAA,QAAAI,SAAA,kBAEEJ,EAAAA,QACEC,cAAA,SAAA,CAAAI,MAAM,qBACNC,OAAWC,EAAUpB,EAAMS,EAAO,MAAUW,KAAAA,EAAUpB,EAAMS,EAAO,2BAGrEI,EAAAA,QACEC,cAAA,SAAA,CAAAI,MAAM,qBACNC,OAAWC,EAAUpB,EAAMU,EAAQ,MAAUU,KAAAA,EAAUpB,EAAMU,EAAQ,MAAK,SAG5E,kBAEJG,EACE,QAAAC,cAAA,MAAA,CAAAf,IAAKA,EACLE,IAAKA,EACLG,QAASA,EACTiB,IAAKD,EAAUpB,EAAMY,EAAWD,EAAQL,EAAM,MAC9Ca,OAAWC,EAAUpB,EAAMY,EAAWD,EAAQL,EAAM,MAAW,SAGjE,IACN,GAGF,SAASc,EAAUE,EAAsBhB,EAAyBiB,GAChE,MAAA,iDAAwDD,EAAY,IAAIhB,EAAI,IAAIiB,EAAU,OAC5F,CCAC1B,QAAAA,YAAAA,GAlDWA,EAAAA,QAAMA,SAANA,eAkDX,CAAA,IAjDC,KAAA,OACAA,EAAA,UAAA,YACAA,EAAA,SAAA,WACAA,EAAA,WAAA,aACAA,EAAA,cAAA,gBACAA,EAAA,UAAA,YACAA,EAAA,SAAA,WACAA,EAAA,mBAAA,qBACAA,EAAA,QAAA,UACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,EAAA,KAAA,OACAA,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,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,UAAA,YACAA,EAAA,eAAA,iBACAA,EAAA,yBAAA,2BACAA,EAAA,UAAA,YACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,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"}

package/dist/index.modern.mjs

@@ -1,2 +1,2 @@
-import e from"classnames";import t,{forwardRef as E}from"react";var a;!function(e){e.SMALL="small",e.MEDIUM="medium",e.LARGE="large",e.AUTO="auto"}(a||(a={}));const l=E(({id:E,name:l,alt:i,loading:n="lazy",className:s,size:c=a.AUTO},o)=>{const{SMALL:m,MEDIUM:I,LARGE:T}=a,A=c===a.AUTO;return l?/*#__PURE__*/t.createElement("picture",{id:E,className:e("wds-illustration",`wds-illustration-${l}`,s)},A?/*#__PURE__*/t.createElement(t.Fragment,null,/*#__PURE__*/t.createElement("source",{media:"(max-width: 575px)",srcSet:`${r(l,m,"1x")}, ${r(l,m,"2x")} 2x`}),/*#__PURE__*/t.createElement("source",{media:"(max-width: 991px)",srcSet:`${r(l,I,"1x")}, ${r(l,I,"2x")} 2x`})):null,/*#__PURE__*/t.createElement("img",{ref:o,alt:i,loading:n,src:r(l,A?T:c,"1x"),srcSet:`${r(l,A?T:c,"2x")} 2x`})):null});function r(e,t,E){return`illustrations/assets/${e}-${t}@${E}.webp`}var i;!function(e){e.BELL="bell",e.BRIEFCASE="briefcase",e.CALENDAR="calendar",e.CHECK_MARK="check-mark",e.CLOSED_WINDOW="closed-window",e.COIN_PILE="coin-pile",e.CONFETTI="confetti",e.CONSTRUCTION_FENCE="construction-fence",e.CONVERT="convert",e.COOKIE="cookie",e.DOCUMENTS="documents",e.DOOR="door",e.ELECTRIC_PLUG="electric-plug",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="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.MEGAPHONE="megaphone",e.MULTI_CURRENCY="multi-currency",e.ONE_INVITE_LETTER_OPENED="one-invite-letter-opened",e.PALM_TREE="palm-tree",e.PHONES="phones",e.PIE_CHART="pie-chart",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"}(i||(i={}));const n=()=>/*#__PURE__*/t.createElement("img",{className:"wds-temp",src:"illustrations/assets/bell-large@1x.webp",alt:"test"});export{i as Assets,l as Illustration,a as Sizes,n as Temp};
+import e from"classnames";import t,{forwardRef as E}from"react";var a;!function(e){e.SMALL="small",e.MEDIUM="medium",e.LARGE="large",e.AUTO="auto"}(a||(a={}));const i=E(({id:E,name:i,alt:l,loading:n="lazy",className:c,size:o=a.AUTO},s)=>{const{SMALL:m,MEDIUM:I,LARGE:T}=a,A=o===a.AUTO;return i?/*#__PURE__*/t.createElement("picture",{id:E,className:e("wds-illustration",`wds-illustration-${i}`,c)},A?/*#__PURE__*/t.createElement(t.Fragment,null,/*#__PURE__*/t.createElement("source",{media:"(max-width: 575px)",srcSet:`${r(i,m,"1x")}, ${r(i,m,"2x")} 2x`}),/*#__PURE__*/t.createElement("source",{media:"(max-width: 991px)",srcSet:`${r(i,I,"1x")}, ${r(i,I,"2x")} 2x`})):null,/*#__PURE__*/t.createElement("img",{ref:s,alt:l,loading:n,src:r(i,A?T:o,"1x"),srcSet:`${r(i,A?T:o,"2x")} 2x`})):null});function r(e,t,E){return`https://wise.com/web-art/assets/illustrations/${e}-${t}@${E}.webp`}var l;!function(e){e.BELL="bell",e.BRIEFCASE="briefcase",e.CALENDAR="calendar",e.CHECK_MARK="check-mark",e.CLOSED_WINDOW="closed-window",e.COIN_PILE="coin-pile",e.CONFETTI="confetti",e.CONSTRUCTION_FENCE="construction-fence",e.CONVERT="convert",e.COOKIE="cookie",e.DOCUMENTS="documents",e.DOOR="door",e.ELECTRIC_PLUG="electric-plug",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="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.MEGAPHONE="megaphone",e.MULTI_CURRENCY="multi-currency",e.ONE_INVITE_LETTER_OPENED="one-invite-letter-opened",e.PALM_TREE="palm-tree",e.PHONES="phones",e.PIE_CHART="pie-chart",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"}(l||(l={}));export{l as Assets,i as Illustration,a as Sizes};
 //# sourceMappingURL=index.modern.mjs.map

package/dist/index.modern.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.modern.mjs","sources":["../src/common.ts","../src/illustrations/Illustration.tsx","../src/illustrations/metadata.ts","../src/Temp.tsx"],"sourcesContent":["export enum Sizes {\n  SMALL = 'small',\n  MEDIUM = 'medium',\n  LARGE = 'large',\n  AUTO = 'auto',\n}\n\nexport type LargeSize = 'large';\nexport type MediumSize = 'medium';\nexport type SmallSize = 'small';\nexport type AutoSize = 'auto';\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, AutoSize, 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 | AutoSize;\n\nexport type Props = {\n  name: IllustrationNames;\n  alt: string;\n  size?: IllustrationSizes;\n  loading?: 'eager' | 'lazy';\n} & ImgProps;\n\nconst Illustration = forwardRef<HTMLImageElement, Props>(\n  ({ id, name, alt, loading = 'lazy', className, size = Sizes.AUTO }: Props, ref) => {\n    const { SMALL, MEDIUM, LARGE } = Sizes;\n    const autoSize: boolean = size === Sizes.AUTO;\n    return name ? (\n      <picture\n        id={id}\n        className={classNames('wds-illustration', `wds-illustration-${name}`, className)}\n      >\n        {autoSize ? (\n          <>\n            {/* Mobile Screens */}\n            <source\n              media=\"(max-width: 575px)\"\n              srcSet={`${defineSrc(name, SMALL, '1x')}, ${defineSrc(name, SMALL, '2x')} 2x`}\n            />\n            {/* Tablets */}\n            <source\n              media=\"(max-width: 991px)\"\n              srcSet={`${defineSrc(name, MEDIUM, '1x')}, ${defineSrc(name, MEDIUM, '2x')} 2x`}\n            />\n          </>\n        ) : null}\n\n        <img\n          ref={ref}\n          alt={alt}\n          loading={loading}\n          src={defineSrc(name, autoSize ? LARGE : size, '1x')}\n          srcSet={`${defineSrc(name, autoSize ? LARGE : size, '2x')} 2x`}\n        />\n      </picture>\n    ) : null;\n  },\n);\n\nfunction defineSrc(illustration: string, size: IllustrationSizes, descriptor: Descriptors) {\n  return `illustrations/assets/${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  CALENDAR = 'calendar',\n  CHECK_MARK = 'check-mark',\n  CLOSED_WINDOW = 'closed-window',\n  COIN_PILE = 'coin-pile',\n  CONFETTI = 'confetti',\n  CONSTRUCTION_FENCE = 'construction-fence',\n  CONVERT = 'convert',\n  COOKIE = 'cookie',\n  DOCUMENTS = 'documents',\n  DOOR = 'door',\n  ELECTRIC_PLUG = 'electric-plug',\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 = '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  MEGAPHONE = 'megaphone',\n  MULTI_CURRENCY = 'multi-currency',\n  ONE_INVITE_LETTER_OPENED = 'one-invite-letter-opened',\n  PALM_TREE = 'palm-tree',\n  PHONES = 'phones',\n  PIE_CHART = 'pie-chart',\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  | 'calendar'\n  | 'check-mark'\n  | 'closed-window'\n  | 'coin-pile'\n  | 'confetti'\n  | 'construction-fence'\n  | 'convert'\n  | 'cookie'\n  | 'documents'\n  | 'door'\n  | 'electric-plug'\n  | 'email'\n  | 'exclamation-mark'\n  | 'flag'\n  | 'flower'\n  | 'gear'\n  | 'globe'\n  | 'graph'\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  | 'megaphone'\n  | 'multi-currency'\n  | 'one-invite-letter-opened'\n  | 'palm-tree'\n  | 'phones'\n  | 'pie-chart'\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 React from 'react';\n\nconst Temp = () => {\n  return <img className=\"wds-temp\" src=\"illustrations/assets/bell-large@1x.webp\" alt=\"test\" />;\n};\n\nexport default Temp;\n"],"names":["Sizes","Illustration","forwardRef","id","name","alt","loading","className","size","AUTO","ref","SMALL","MEDIUM","LARGE","React","createElement","classNames","autoSize","Fragment","media","srcSet","defineSrc","src","illustration","descriptor","Assets","Temp"],"mappings":"gEAAYA,OAAZ,SAAYA,GACVA,EAAA,MAAA,QACAA,EAAA,OAAA,SACAA,EAAA,MAAA,QACAA,EAAA,KAAA,MACD,CALD,CAAYA,IAAAA,EAKX,CAAA,ICcKC,MAAYA,EAAGC,EACnB,EAAGC,KAAIC,OAAMC,MAAKC,QAAAA,EAAU,OAAQC,YAAWC,KAAAA,EAAOR,EAAMS,MAAeC,KACzE,MAAMC,MAAEA,EAAKC,OAAEA,EAAMC,MAAEA,GAAUb,IACPQ,IAASR,EAAMS,KACzC,OAAOL,eACLU,EAAAC,cAAA,UAAA,CACEZ,GAAIA,EACJI,UAAWS,EAAW,mBAAoB,oBAAoBZ,IAAQG,IAErEU,eACCH,EAEEC,cAAAD,EAAAI,SAAA,kBAAAJ,EAAAC,cAAA,SAAA,CACEI,MAAM,qBACNC,OAAQ,GAAGC,EAAUjB,EAAMO,EAAO,UAAUU,EAAUjB,EAAMO,EAAO,0BAGrEG,EACEC,cAAA,SAAA,CAAAI,MAAM,qBACNC,OAAQ,GAAGC,EAAUjB,EAAMQ,EAAQ,UAAUS,EAAUjB,EAAMQ,EAAQ,cAGvE,kBAEJE,EAAAC,cAAA,MAAA,CACEL,IAAKA,EACLL,IAAKA,EACLC,QAASA,EACTgB,IAAKD,EAAUjB,EAAMa,EAAWJ,EAAQL,EAAM,MAC9CY,OAAQ,GAAGC,EAAUjB,EAAMa,EAAWJ,EAAQL,EAAM,cAGtD,OAIR,SAAkBa,EAACE,EAAsBf,EAAyBgB,GAChE,8BAA+BD,KAAgBf,KAAQgB,QACzD,CClDYC,IAkDXA,GAlDD,SAAYA,GACVA,EAAA,KAAA,OACAA,EAAA,UAAA,YACAA,EAAA,SAAA,WACAA,EAAA,WAAA,aACAA,EAAA,cAAA,gBACAA,EAAA,UAAA,YACAA,EAAA,SAAA,WACAA,EAAA,mBAAA,qBACAA,EAAA,QAAA,UACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,EAAA,KAAA,OACAA,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,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,UAAA,YACAA,EAAA,eAAA,iBACAA,EAAA,yBAAA,2BACAA,EAAA,UAAA,YACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,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,CAlDD,CAAYA,IAAAA,EAkDX,CAAA,ICvDKC,MAAIA,EAAG,iBACJZ,EAAAC,cAAA,MAAA,CAAKR,UAAU,WAAWe,IAAI,0CAA0CjB,IAAI"}
+{"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  AUTO = 'auto',\n}\n\nexport type LargeSize = 'large';\nexport type MediumSize = 'medium';\nexport type SmallSize = 'small';\nexport type AutoSize = 'auto';\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, AutoSize, 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 | AutoSize;\n\nexport type Props = {\n  name: IllustrationNames;\n  alt: string;\n  size?: IllustrationSizes;\n  loading?: 'eager' | 'lazy';\n} & ImgProps;\n\nconst Illustration = forwardRef<HTMLImageElement, Props>(\n  ({ id, name, alt, loading = 'lazy', className, size = Sizes.AUTO }: Props, ref) => {\n    const { SMALL, MEDIUM, LARGE } = Sizes;\n    const autoSize: boolean = size === Sizes.AUTO;\n    return name ? (\n      <picture\n        id={id}\n        className={classNames('wds-illustration', `wds-illustration-${name}`, className)}\n      >\n        {autoSize ? (\n          <>\n            {/* Mobile Screens */}\n            <source\n              media=\"(max-width: 575px)\"\n              srcSet={`${defineSrc(name, SMALL, '1x')}, ${defineSrc(name, SMALL, '2x')} 2x`}\n            />\n            {/* Tablets */}\n            <source\n              media=\"(max-width: 991px)\"\n              srcSet={`${defineSrc(name, MEDIUM, '1x')}, ${defineSrc(name, MEDIUM, '2x')} 2x`}\n            />\n          </>\n        ) : null}\n\n        <img\n          ref={ref}\n          alt={alt}\n          loading={loading}\n          src={defineSrc(name, autoSize ? LARGE : size, '1x')}\n          srcSet={`${defineSrc(name, autoSize ? LARGE : size, '2x')} 2x`}\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  CALENDAR = 'calendar',\n  CHECK_MARK = 'check-mark',\n  CLOSED_WINDOW = 'closed-window',\n  COIN_PILE = 'coin-pile',\n  CONFETTI = 'confetti',\n  CONSTRUCTION_FENCE = 'construction-fence',\n  CONVERT = 'convert',\n  COOKIE = 'cookie',\n  DOCUMENTS = 'documents',\n  DOOR = 'door',\n  ELECTRIC_PLUG = 'electric-plug',\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 = '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  MEGAPHONE = 'megaphone',\n  MULTI_CURRENCY = 'multi-currency',\n  ONE_INVITE_LETTER_OPENED = 'one-invite-letter-opened',\n  PALM_TREE = 'palm-tree',\n  PHONES = 'phones',\n  PIE_CHART = 'pie-chart',\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  | 'calendar'\n  | 'check-mark'\n  | 'closed-window'\n  | 'coin-pile'\n  | 'confetti'\n  | 'construction-fence'\n  | 'convert'\n  | 'cookie'\n  | 'documents'\n  | 'door'\n  | 'electric-plug'\n  | 'email'\n  | 'exclamation-mark'\n  | 'flag'\n  | 'flower'\n  | 'gear'\n  | 'globe'\n  | 'graph'\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  | 'megaphone'\n  | 'multi-currency'\n  | 'one-invite-letter-opened'\n  | 'palm-tree'\n  | 'phones'\n  | 'pie-chart'\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","Illustration","forwardRef","id","name","alt","loading","className","size","AUTO","ref","SMALL","MEDIUM","LARGE","React","createElement","classNames","autoSize","Fragment","media","srcSet","defineSrc","src","illustration","descriptor","Assets"],"mappings":"gEAAYA,OAAZ,SAAYA,GACVA,EAAA,MAAA,QACAA,EAAA,OAAA,SACAA,EAAA,MAAA,QACAA,EAAA,KAAA,MACD,CALD,CAAYA,IAAAA,EAKX,CAAA,ICcKC,MAAYA,EAAGC,EACnB,EAAGC,KAAIC,OAAMC,MAAKC,QAAAA,EAAU,OAAQC,YAAWC,KAAAA,EAAOR,EAAMS,MAAeC,KACzE,MAAMC,MAAEA,EAAKC,OAAEA,EAAMC,MAAEA,GAAUb,IACPQ,IAASR,EAAMS,KACzC,OAAOL,eACLU,EAAAC,cAAA,UAAA,CACEZ,GAAIA,EACJI,UAAWS,EAAW,mBAAoB,oBAAoBZ,IAAQG,IAErEU,eACCH,EAEEC,cAAAD,EAAAI,SAAA,kBAAAJ,EAAAC,cAAA,SAAA,CACEI,MAAM,qBACNC,OAAQ,GAAGC,EAAUjB,EAAMO,EAAO,UAAUU,EAAUjB,EAAMO,EAAO,0BAGrEG,EACEC,cAAA,SAAA,CAAAI,MAAM,qBACNC,OAAQ,GAAGC,EAAUjB,EAAMQ,EAAQ,UAAUS,EAAUjB,EAAMQ,EAAQ,cAGvE,kBAEJE,EAAAC,cAAA,MAAA,CACEL,IAAKA,EACLL,IAAKA,EACLC,QAASA,EACTgB,IAAKD,EAAUjB,EAAMa,EAAWJ,EAAQL,EAAM,MAC9CY,OAAQ,GAAGC,EAAUjB,EAAMa,EAAWJ,EAAQL,EAAM,cAGtD,OAIR,SAAkBa,EAACE,EAAsBf,EAAyBgB,GAChE,uDAAwDD,KAAgBf,KAAQgB,QAClF,CClDYC,IAkDXA,GAlDD,SAAYA,GACVA,EAAA,KAAA,OACAA,EAAA,UAAA,YACAA,EAAA,SAAA,WACAA,EAAA,WAAA,aACAA,EAAA,cAAA,gBACAA,EAAA,UAAA,YACAA,EAAA,SAAA,WACAA,EAAA,mBAAA,qBACAA,EAAA,QAAA,UACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,EAAA,KAAA,OACAA,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,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,UAAA,YACAA,EAAA,eAAA,iBACAA,EAAA,yBAAA,2BACAA,EAAA,UAAA,YACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,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,CAlDD,CAAYA,IAAAA,EAkDX,CAAA"}

package/dist/index.module.js

@@ -1,2 +1,2 @@
-import e from"classnames";import t,{forwardRef as E}from"react";var a;!function(e){e.SMALL="small",e.MEDIUM="medium",e.LARGE="large",e.AUTO="auto"}(a||(a={}));var r,i=E(function(E,r){var i=E.name,n=E.alt,s=E.loading,c=void 0===s?"lazy":s,o=E.size,m=void 0===o?a.AUTO:o,I=a.SMALL,T=a.MEDIUM,A=a.LARGE,L=m===a.AUTO;return i?/*#__PURE__*/t.createElement("picture",{id:E.id,className:e("wds-illustration","wds-illustration-"+i,E.className)},L?/*#__PURE__*/t.createElement(t.Fragment,null,/*#__PURE__*/t.createElement("source",{media:"(max-width: 575px)",srcSet:l(i,I,"1x")+", "+l(i,I,"2x")+" 2x"}),/*#__PURE__*/t.createElement("source",{media:"(max-width: 991px)",srcSet:l(i,T,"1x")+", "+l(i,T,"2x")+" 2x"})):null,/*#__PURE__*/t.createElement("img",{ref:r,alt:n,loading:c,src:l(i,L?A:m,"1x"),srcSet:l(i,L?A:m,"2x")+" 2x"})):null});function l(e,t,E){return"illustrations/assets/"+e+"-"+t+"@"+E+".webp"}!function(e){e.BELL="bell",e.BRIEFCASE="briefcase",e.CALENDAR="calendar",e.CHECK_MARK="check-mark",e.CLOSED_WINDOW="closed-window",e.COIN_PILE="coin-pile",e.CONFETTI="confetti",e.CONSTRUCTION_FENCE="construction-fence",e.CONVERT="convert",e.COOKIE="cookie",e.DOCUMENTS="documents",e.DOOR="door",e.ELECTRIC_PLUG="electric-plug",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="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.MEGAPHONE="megaphone",e.MULTI_CURRENCY="multi-currency",e.ONE_INVITE_LETTER_OPENED="one-invite-letter-opened",e.PALM_TREE="palm-tree",e.PHONES="phones",e.PIE_CHART="pie-chart",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={}));var n=function(){/*#__PURE__*/return t.createElement("img",{className:"wds-temp",src:"illustrations/assets/bell-large@1x.webp",alt:"test"})};export{r as Assets,i as Illustration,a as Sizes,n as Temp};
+import e from"classnames";import t,{forwardRef as E}from"react";var a;!function(e){e.SMALL="small",e.MEDIUM="medium",e.LARGE="large",e.AUTO="auto"}(a||(a={}));var i,r=E(function(E,i){var r=E.name,n=E.alt,o=E.loading,c=void 0===o?"lazy":o,s=E.size,m=void 0===s?a.AUTO:s,I=a.SMALL,T=a.MEDIUM,A=a.LARGE,L=m===a.AUTO;return r?/*#__PURE__*/t.createElement("picture",{id:E.id,className:e("wds-illustration","wds-illustration-"+r,E.className)},L?/*#__PURE__*/t.createElement(t.Fragment,null,/*#__PURE__*/t.createElement("source",{media:"(max-width: 575px)",srcSet:l(r,I,"1x")+", "+l(r,I,"2x")+" 2x"}),/*#__PURE__*/t.createElement("source",{media:"(max-width: 991px)",srcSet:l(r,T,"1x")+", "+l(r,T,"2x")+" 2x"})):null,/*#__PURE__*/t.createElement("img",{ref:i,alt:n,loading:c,src:l(r,L?A:m,"1x"),srcSet:l(r,L?A:m,"2x")+" 2x"})):null});function l(e,t,E){return"https://wise.com/web-art/assets/illustrations/"+e+"-"+t+"@"+E+".webp"}!function(e){e.BELL="bell",e.BRIEFCASE="briefcase",e.CALENDAR="calendar",e.CHECK_MARK="check-mark",e.CLOSED_WINDOW="closed-window",e.COIN_PILE="coin-pile",e.CONFETTI="confetti",e.CONSTRUCTION_FENCE="construction-fence",e.CONVERT="convert",e.COOKIE="cookie",e.DOCUMENTS="documents",e.DOOR="door",e.ELECTRIC_PLUG="electric-plug",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="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.MEGAPHONE="megaphone",e.MULTI_CURRENCY="multi-currency",e.ONE_INVITE_LETTER_OPENED="one-invite-letter-opened",e.PALM_TREE="palm-tree",e.PHONES="phones",e.PIE_CHART="pie-chart",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"}(i||(i={}));export{i as Assets,r as Illustration,a as Sizes};
 //# 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","../src/Temp.tsx"],"sourcesContent":["export enum Sizes {\n  SMALL = 'small',\n  MEDIUM = 'medium',\n  LARGE = 'large',\n  AUTO = 'auto',\n}\n\nexport type LargeSize = 'large';\nexport type MediumSize = 'medium';\nexport type SmallSize = 'small';\nexport type AutoSize = 'auto';\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, AutoSize, 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 | AutoSize;\n\nexport type Props = {\n  name: IllustrationNames;\n  alt: string;\n  size?: IllustrationSizes;\n  loading?: 'eager' | 'lazy';\n} & ImgProps;\n\nconst Illustration = forwardRef<HTMLImageElement, Props>(\n  ({ id, name, alt, loading = 'lazy', className, size = Sizes.AUTO }: Props, ref) => {\n    const { SMALL, MEDIUM, LARGE } = Sizes;\n    const autoSize: boolean = size === Sizes.AUTO;\n    return name ? (\n      <picture\n        id={id}\n        className={classNames('wds-illustration', `wds-illustration-${name}`, className)}\n      >\n        {autoSize ? (\n          <>\n            {/* Mobile Screens */}\n            <source\n              media=\"(max-width: 575px)\"\n              srcSet={`${defineSrc(name, SMALL, '1x')}, ${defineSrc(name, SMALL, '2x')} 2x`}\n            />\n            {/* Tablets */}\n            <source\n              media=\"(max-width: 991px)\"\n              srcSet={`${defineSrc(name, MEDIUM, '1x')}, ${defineSrc(name, MEDIUM, '2x')} 2x`}\n            />\n          </>\n        ) : null}\n\n        <img\n          ref={ref}\n          alt={alt}\n          loading={loading}\n          src={defineSrc(name, autoSize ? LARGE : size, '1x')}\n          srcSet={`${defineSrc(name, autoSize ? LARGE : size, '2x')} 2x`}\n        />\n      </picture>\n    ) : null;\n  },\n);\n\nfunction defineSrc(illustration: string, size: IllustrationSizes, descriptor: Descriptors) {\n  return `illustrations/assets/${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  CALENDAR = 'calendar',\n  CHECK_MARK = 'check-mark',\n  CLOSED_WINDOW = 'closed-window',\n  COIN_PILE = 'coin-pile',\n  CONFETTI = 'confetti',\n  CONSTRUCTION_FENCE = 'construction-fence',\n  CONVERT = 'convert',\n  COOKIE = 'cookie',\n  DOCUMENTS = 'documents',\n  DOOR = 'door',\n  ELECTRIC_PLUG = 'electric-plug',\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 = '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  MEGAPHONE = 'megaphone',\n  MULTI_CURRENCY = 'multi-currency',\n  ONE_INVITE_LETTER_OPENED = 'one-invite-letter-opened',\n  PALM_TREE = 'palm-tree',\n  PHONES = 'phones',\n  PIE_CHART = 'pie-chart',\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  | 'calendar'\n  | 'check-mark'\n  | 'closed-window'\n  | 'coin-pile'\n  | 'confetti'\n  | 'construction-fence'\n  | 'convert'\n  | 'cookie'\n  | 'documents'\n  | 'door'\n  | 'electric-plug'\n  | 'email'\n  | 'exclamation-mark'\n  | 'flag'\n  | 'flower'\n  | 'gear'\n  | 'globe'\n  | 'graph'\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  | 'megaphone'\n  | 'multi-currency'\n  | 'one-invite-letter-opened'\n  | 'palm-tree'\n  | 'phones'\n  | 'pie-chart'\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 React from 'react';\n\nconst Temp = () => {\n  return <img className=\"wds-temp\" src=\"illustrations/assets/bell-large@1x.webp\" alt=\"test\" />;\n};\n\nexport default Temp;\n"],"names":["Sizes","Illustration","Assets","forwardRef","ref","name","alt","_ref$loading","_ref","loading","className","size","AUTO","_ref$size","SMALL","MEDIUM","LARGE","autoSize","React","createElement","id","classNames","Fragment","media","srcSet","defineSrc","src","illustration","descriptor","Temp"],"mappings":"gEAAYA,OAAZ,SAAYA,GACVA,EAAA,MAAA,QACAA,EAAA,OAAA,SACAA,EAAA,MAAA,QACAA,EAAA,KAAA,MACD,CALD,CAAYA,IAAAA,EAKX,CAAA,ICcKC,ICsCLC,EDtCiBD,EAAGE,EACnB,SAA2EC,EAAAA,GAAO,IAA3EC,EAAAA,EAAAA,KAAMC,IAAAA,IAAGC,EAAAC,EAAEC,QAAAA,OAAO,IAAAF,EAAG,OAAQG,EAAWC,EAAAA,EAAAA,KAAAA,OAAOX,IAAAA,EAAAA,EAAMY,KAC1DC,IAAiCb,EAAzBc,MAAOC,EAAkBf,EAAlBe,OAAQC,EAAUhB,EAAVgB,MACTC,EAAYN,IAASX,EAAMY,KACzC,OAAOP,eACLa,EACEC,cAAA,UAAA,CAAAC,GALDZ,EAAFY,GAMGV,UAAWW,EAAW,mBAAwChB,oBAAAA,EANhCK,EAAAA,YAQ7BO,eACCC,EAAAC,cAAAD,EAAAI,SAAA,kBAEEJ,EACEC,cAAA,SAAA,CAAAI,MAAM,qBACNC,OAAWC,EAAUpB,EAAMS,EAAO,MAAUW,KAAAA,EAAUpB,EAAMS,EAAO,2BAGrEI,EACEC,cAAA,SAAA,CAAAI,MAAM,qBACNC,OAAWC,EAAUpB,EAAMU,EAAQ,MAAUU,KAAAA,EAAUpB,EAAMU,EAAQ,MAAK,SAG5E,kBAEJG,EACEC,cAAA,MAAA,CAAAf,IAAKA,EACLE,IAAKA,EACLG,QAASA,EACTiB,IAAKD,EAAUpB,EAAMY,EAAWD,EAAQL,EAAM,MAC9Ca,OAAWC,EAAUpB,EAAMY,EAAWD,EAAQL,EAAM,MAAW,SAGjE,IACN,GAGF,SAASc,EAAUE,EAAsBhB,EAAyBiB,GAChE,MAAA,wBAA+BD,EAAY,IAAIhB,EAAI,IAAIiB,EAAU,OACnE,EClDA,SAAY1B,GACVA,EAAA,KAAA,OACAA,EAAA,UAAA,YACAA,EAAA,SAAA,WACAA,EAAA,WAAA,aACAA,EAAA,cAAA,gBACAA,EAAA,UAAA,YACAA,EAAA,SAAA,WACAA,EAAA,mBAAA,qBACAA,EAAA,QAAA,UACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,EAAA,KAAA,OACAA,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,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,UAAA,YACAA,EAAA,eAAA,iBACAA,EAAA,yBAAA,2BACAA,EAAA,UAAA,YACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,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,CAlDD,CAAYA,IAAAA,EAkDX,CAAA,ICvDK2B,IAAAA,EAAO,wBACX,OAAOX,EAAKC,cAAA,MAAA,CAAAT,UAAU,WAAWgB,IAAI,0CAA0CpB,IAAI,QACrF"}
+{"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  AUTO = 'auto',\n}\n\nexport type LargeSize = 'large';\nexport type MediumSize = 'medium';\nexport type SmallSize = 'small';\nexport type AutoSize = 'auto';\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, AutoSize, 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 | AutoSize;\n\nexport type Props = {\n  name: IllustrationNames;\n  alt: string;\n  size?: IllustrationSizes;\n  loading?: 'eager' | 'lazy';\n} & ImgProps;\n\nconst Illustration = forwardRef<HTMLImageElement, Props>(\n  ({ id, name, alt, loading = 'lazy', className, size = Sizes.AUTO }: Props, ref) => {\n    const { SMALL, MEDIUM, LARGE } = Sizes;\n    const autoSize: boolean = size === Sizes.AUTO;\n    return name ? (\n      <picture\n        id={id}\n        className={classNames('wds-illustration', `wds-illustration-${name}`, className)}\n      >\n        {autoSize ? (\n          <>\n            {/* Mobile Screens */}\n            <source\n              media=\"(max-width: 575px)\"\n              srcSet={`${defineSrc(name, SMALL, '1x')}, ${defineSrc(name, SMALL, '2x')} 2x`}\n            />\n            {/* Tablets */}\n            <source\n              media=\"(max-width: 991px)\"\n              srcSet={`${defineSrc(name, MEDIUM, '1x')}, ${defineSrc(name, MEDIUM, '2x')} 2x`}\n            />\n          </>\n        ) : null}\n\n        <img\n          ref={ref}\n          alt={alt}\n          loading={loading}\n          src={defineSrc(name, autoSize ? LARGE : size, '1x')}\n          srcSet={`${defineSrc(name, autoSize ? LARGE : size, '2x')} 2x`}\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  CALENDAR = 'calendar',\n  CHECK_MARK = 'check-mark',\n  CLOSED_WINDOW = 'closed-window',\n  COIN_PILE = 'coin-pile',\n  CONFETTI = 'confetti',\n  CONSTRUCTION_FENCE = 'construction-fence',\n  CONVERT = 'convert',\n  COOKIE = 'cookie',\n  DOCUMENTS = 'documents',\n  DOOR = 'door',\n  ELECTRIC_PLUG = 'electric-plug',\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 = '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  MEGAPHONE = 'megaphone',\n  MULTI_CURRENCY = 'multi-currency',\n  ONE_INVITE_LETTER_OPENED = 'one-invite-letter-opened',\n  PALM_TREE = 'palm-tree',\n  PHONES = 'phones',\n  PIE_CHART = 'pie-chart',\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  | 'calendar'\n  | 'check-mark'\n  | 'closed-window'\n  | 'coin-pile'\n  | 'confetti'\n  | 'construction-fence'\n  | 'convert'\n  | 'cookie'\n  | 'documents'\n  | 'door'\n  | 'electric-plug'\n  | 'email'\n  | 'exclamation-mark'\n  | 'flag'\n  | 'flower'\n  | 'gear'\n  | 'globe'\n  | 'graph'\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  | 'megaphone'\n  | 'multi-currency'\n  | 'one-invite-letter-opened'\n  | 'palm-tree'\n  | 'phones'\n  | 'pie-chart'\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","Illustration","Assets","forwardRef","ref","name","alt","_ref$loading","_ref","loading","className","size","AUTO","_ref$size","SMALL","MEDIUM","LARGE","autoSize","React","createElement","id","classNames","Fragment","media","srcSet","defineSrc","src","illustration","descriptor"],"mappings":"gEAAYA,OAAZ,SAAYA,GACVA,EAAA,MAAA,QACAA,EAAA,OAAA,SACAA,EAAA,MAAA,QACAA,EAAA,KAAA,MACD,CALD,CAAYA,IAAAA,EAKX,CAAA,ICcKC,ICsCLC,EDtCiBD,EAAGE,EACnB,SAA2EC,EAAAA,GAAO,IAA3EC,EAAAA,EAAAA,KAAMC,IAAAA,IAAGC,EAAAC,EAAEC,QAAAA,OAAO,IAAAF,EAAG,OAAQG,EAAWC,EAAAA,EAAAA,KAAAA,OAAOX,IAAAA,EAAAA,EAAMY,KAC1DC,IAAiCb,EAAzBc,MAAOC,EAAkBf,EAAlBe,OAAQC,EAAUhB,EAAVgB,MACTC,EAAYN,IAASX,EAAMY,KACzC,OAAOP,eACLa,EACEC,cAAA,UAAA,CAAAC,GALDZ,EAAFY,GAMGV,UAAWW,EAAW,mBAAwChB,oBAAAA,EANhCK,EAAAA,YAQ7BO,eACCC,EAAAC,cAAAD,EAAAI,SAAA,kBAEEJ,EACEC,cAAA,SAAA,CAAAI,MAAM,qBACNC,OAAWC,EAAUpB,EAAMS,EAAO,MAAUW,KAAAA,EAAUpB,EAAMS,EAAO,2BAGrEI,EACEC,cAAA,SAAA,CAAAI,MAAM,qBACNC,OAAWC,EAAUpB,EAAMU,EAAQ,MAAUU,KAAAA,EAAUpB,EAAMU,EAAQ,MAAK,SAG5E,kBAEJG,EACEC,cAAA,MAAA,CAAAf,IAAKA,EACLE,IAAKA,EACLG,QAASA,EACTiB,IAAKD,EAAUpB,EAAMY,EAAWD,EAAQL,EAAM,MAC9Ca,OAAWC,EAAUpB,EAAMY,EAAWD,EAAQL,EAAM,MAAW,SAGjE,IACN,GAGF,SAASc,EAAUE,EAAsBhB,EAAyBiB,GAChE,MAAA,iDAAwDD,EAAY,IAAIhB,EAAI,IAAIiB,EAAU,OAC5F,EClDA,SAAY1B,GACVA,EAAA,KAAA,OACAA,EAAA,UAAA,YACAA,EAAA,SAAA,WACAA,EAAA,WAAA,aACAA,EAAA,cAAA,gBACAA,EAAA,UAAA,YACAA,EAAA,SAAA,WACAA,EAAA,mBAAA,qBACAA,EAAA,QAAA,UACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,EAAA,KAAA,OACAA,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,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,UAAA,YACAA,EAAA,eAAA,iBACAA,EAAA,yBAAA,2BACAA,EAAA,UAAA,YACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,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,CAlDD,CAAYA,IAAAA,EAkDX,CAAA"}

package/dist/index.umd.js

@@ -1,2 +1,2 @@
-!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,a){function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l,s=/*#__PURE__*/i(t),n=/*#__PURE__*/i(a);e.Sizes=void 0,(l=e.Sizes||(e.Sizes={})).SMALL="small",l.MEDIUM="medium",l.LARGE="large",l.AUTO="auto";var r,E=a.forwardRef(function(t,a){var i=t.name,l=t.alt,r=t.loading,E=void 0===r?"lazy":r,c=t.size,u=void 0===c?e.Sizes.AUTO:c,d=e.Sizes.SMALL,m=e.Sizes.MEDIUM,T=e.Sizes.LARGE,f=u===e.Sizes.AUTO;return i?/*#__PURE__*/n.default.createElement("picture",{id:t.id,className:s.default("wds-illustration","wds-illustration-"+i,t.className)},f?/*#__PURE__*/n.default.createElement(n.default.Fragment,null,/*#__PURE__*/n.default.createElement("source",{media:"(max-width: 575px)",srcSet:o(i,d,"1x")+", "+o(i,d,"2x")+" 2x"}),/*#__PURE__*/n.default.createElement("source",{media:"(max-width: 991px)",srcSet:o(i,m,"1x")+", "+o(i,m,"2x")+" 2x"})):null,/*#__PURE__*/n.default.createElement("img",{ref:a,alt:l,loading:E,src:o(i,f?T:u,"1x"),srcSet:o(i,f?T:u,"2x")+" 2x"})):null});function o(e,t,a){return"illustrations/assets/"+e+"-"+t+"@"+a+".webp"}e.Assets=void 0,(r=e.Assets||(e.Assets={})).BELL="bell",r.BRIEFCASE="briefcase",r.CALENDAR="calendar",r.CHECK_MARK="check-mark",r.CLOSED_WINDOW="closed-window",r.COIN_PILE="coin-pile",r.CONFETTI="confetti",r.CONSTRUCTION_FENCE="construction-fence",r.CONVERT="convert",r.COOKIE="cookie",r.DOCUMENTS="documents",r.DOOR="door",r.ELECTRIC_PLUG="electric-plug",r.EMAIL="email",r.EXCLAMATION_MARK="exclamation-mark",r.FLAG="flag",r.FLOWER="flower",r.GEAR="gear",r.GLOBE="globe",r.GRAPH="graph",r.HEART="heart",r.HOUSE="house",r.ID_CARD="id-card",r.INFINITE="infinite",r.INVITE_LETTER="invite-letter",r.JARS="jars",r.KEY="key",r.LIGHT_BULB="light-bulb",r.LOCK="lock",r.MAGNIFYING_GLASS="magnifying-glass",r.MAP="map",r.MEGAPHONE="megaphone",r.MULTI_CURRENCY="multi-currency",r.ONE_INVITE_LETTER_OPENED="one-invite-letter-opened",r.PALM_TREE="palm-tree",r.PHONES="phones",r.PIE_CHART="pie-chart",r.PLANE="plane",r.PUZZLE_PIECES="puzzle-pieces",r.QUESTION_MARK="question-mark",r.RECEIVE="receive",r.REMINDER_LETTER="reminder-letter",r.SAND_TIMER="sand-timer",r.SHOPPING_BAG="shopping-bag",r.SKIP_AUTHENTICATION="skip-authentication",r.SPEECH_BUBBLE="speech-bubble",r.TOOL="tool",r.TWO_INVITE_LETTERS_OPENED="two-invite-letters-opened",r.WALLET="wallet",e.Illustration=E,e.Temp=function(){/*#__PURE__*/return n.default.createElement("img",{className:"wds-temp",src:"illustrations/assets/bell-large@1x.webp",alt:"test"})}});
+!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,s=/*#__PURE__*/a(t),n=/*#__PURE__*/a(i);e.Sizes=void 0,(l=e.Sizes||(e.Sizes={})).SMALL="small",l.MEDIUM="medium",l.LARGE="large",l.AUTO="auto";var E,r=i.forwardRef(function(t,i){var a=t.name,l=t.alt,E=t.loading,r=void 0===E?"lazy":E,c=t.size,u=void 0===c?e.Sizes.AUTO:c,d=e.Sizes.SMALL,T=e.Sizes.MEDIUM,A=e.Sizes.LARGE,I=u===e.Sizes.AUTO;return a?/*#__PURE__*/n.default.createElement("picture",{id:t.id,className:s.default("wds-illustration","wds-illustration-"+a,t.className)},I?/*#__PURE__*/n.default.createElement(n.default.Fragment,null,/*#__PURE__*/n.default.createElement("source",{media:"(max-width: 575px)",srcSet:o(a,d,"1x")+", "+o(a,d,"2x")+" 2x"}),/*#__PURE__*/n.default.createElement("source",{media:"(max-width: 991px)",srcSet:o(a,T,"1x")+", "+o(a,T,"2x")+" 2x"})):null,/*#__PURE__*/n.default.createElement("img",{ref:i,alt:l,loading:r,src:o(a,I?A:u,"1x"),srcSet:o(a,I?A:u,"2x")+" 2x"})):null});function o(e,t,i){return"https://wise.com/web-art/assets/illustrations/"+e+"-"+t+"@"+i+".webp"}e.Assets=void 0,(E=e.Assets||(e.Assets={})).BELL="bell",E.BRIEFCASE="briefcase",E.CALENDAR="calendar",E.CHECK_MARK="check-mark",E.CLOSED_WINDOW="closed-window",E.COIN_PILE="coin-pile",E.CONFETTI="confetti",E.CONSTRUCTION_FENCE="construction-fence",E.CONVERT="convert",E.COOKIE="cookie",E.DOCUMENTS="documents",E.DOOR="door",E.ELECTRIC_PLUG="electric-plug",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="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.MEGAPHONE="megaphone",E.MULTI_CURRENCY="multi-currency",E.ONE_INVITE_LETTER_OPENED="one-invite-letter-opened",E.PALM_TREE="palm-tree",E.PHONES="phones",E.PIE_CHART="pie-chart",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",e.Illustration=r});
 //# sourceMappingURL=index.umd.js.map

package/dist/index.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.umd.js","sources":["../src/common.ts","../src/illustrations/Illustration.tsx","../src/illustrations/metadata.ts","../src/Temp.tsx"],"sourcesContent":["export enum Sizes {\n  SMALL = 'small',\n  MEDIUM = 'medium',\n  LARGE = 'large',\n  AUTO = 'auto',\n}\n\nexport type LargeSize = 'large';\nexport type MediumSize = 'medium';\nexport type SmallSize = 'small';\nexport type AutoSize = 'auto';\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, AutoSize, 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 | AutoSize;\n\nexport type Props = {\n  name: IllustrationNames;\n  alt: string;\n  size?: IllustrationSizes;\n  loading?: 'eager' | 'lazy';\n} & ImgProps;\n\nconst Illustration = forwardRef<HTMLImageElement, Props>(\n  ({ id, name, alt, loading = 'lazy', className, size = Sizes.AUTO }: Props, ref) => {\n    const { SMALL, MEDIUM, LARGE } = Sizes;\n    const autoSize: boolean = size === Sizes.AUTO;\n    return name ? (\n      <picture\n        id={id}\n        className={classNames('wds-illustration', `wds-illustration-${name}`, className)}\n      >\n        {autoSize ? (\n          <>\n            {/* Mobile Screens */}\n            <source\n              media=\"(max-width: 575px)\"\n              srcSet={`${defineSrc(name, SMALL, '1x')}, ${defineSrc(name, SMALL, '2x')} 2x`}\n            />\n            {/* Tablets */}\n            <source\n              media=\"(max-width: 991px)\"\n              srcSet={`${defineSrc(name, MEDIUM, '1x')}, ${defineSrc(name, MEDIUM, '2x')} 2x`}\n            />\n          </>\n        ) : null}\n\n        <img\n          ref={ref}\n          alt={alt}\n          loading={loading}\n          src={defineSrc(name, autoSize ? LARGE : size, '1x')}\n          srcSet={`${defineSrc(name, autoSize ? LARGE : size, '2x')} 2x`}\n        />\n      </picture>\n    ) : null;\n  },\n);\n\nfunction defineSrc(illustration: string, size: IllustrationSizes, descriptor: Descriptors) {\n  return `illustrations/assets/${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  CALENDAR = 'calendar',\n  CHECK_MARK = 'check-mark',\n  CLOSED_WINDOW = 'closed-window',\n  COIN_PILE = 'coin-pile',\n  CONFETTI = 'confetti',\n  CONSTRUCTION_FENCE = 'construction-fence',\n  CONVERT = 'convert',\n  COOKIE = 'cookie',\n  DOCUMENTS = 'documents',\n  DOOR = 'door',\n  ELECTRIC_PLUG = 'electric-plug',\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 = '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  MEGAPHONE = 'megaphone',\n  MULTI_CURRENCY = 'multi-currency',\n  ONE_INVITE_LETTER_OPENED = 'one-invite-letter-opened',\n  PALM_TREE = 'palm-tree',\n  PHONES = 'phones',\n  PIE_CHART = 'pie-chart',\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  | 'calendar'\n  | 'check-mark'\n  | 'closed-window'\n  | 'coin-pile'\n  | 'confetti'\n  | 'construction-fence'\n  | 'convert'\n  | 'cookie'\n  | 'documents'\n  | 'door'\n  | 'electric-plug'\n  | 'email'\n  | 'exclamation-mark'\n  | 'flag'\n  | 'flower'\n  | 'gear'\n  | 'globe'\n  | 'graph'\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  | 'megaphone'\n  | 'multi-currency'\n  | 'one-invite-letter-opened'\n  | 'palm-tree'\n  | 'phones'\n  | 'pie-chart'\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 React from 'react';\n\nconst Temp = () => {\n  return <img className=\"wds-temp\" src=\"illustrations/assets/bell-large@1x.webp\" alt=\"test\" />;\n};\n\nexport default Temp;\n"],"names":["Sizes","Illustration","Assets","forwardRef","ref","name","alt","_ref$loading","_ref","loading","className","size","AUTO","_ref$size","SMALL","MEDIUM","LARGE","autoSize","React","createElement","id","classNames","Fragment","media","srcSet","defineSrc","src","illustration","descriptor"],"mappings":"8XAAYA,0DAAAA,EAAAA,EAAKA,QAALA,QAKX,CAAA,IAJC,MAAA,QACAA,EAAA,OAAA,SACAA,EAAA,MAAA,QACAA,EAAA,KAAA,OCeIC,ICZMC,EDYMD,EAAGE,EAAUA,WAC7B,SAA2EC,EAAAA,GAAO,IAA3EC,EAAAA,EAAAA,KAAMC,IAAAA,IAAGC,EAAAC,EAAEC,QAAAA,OAAO,IAAAF,EAAG,OAAQG,EAAWC,EAAAA,EAAAA,KAAAA,OAAOX,IAAAA,EAAAA,QAAMY,KAC1DC,IAAiCb,EAAAA,MAAzBc,MAAOC,EAAkBf,EAAKA,MAAvBe,OAAQC,EAAUhB,EAAKA,MAAfgB,MACTC,EAAYN,IAASX,EAAKA,MAACY,KACzC,OAAOP,eACLa,UACEC,cAAA,UAAA,CAAAC,GALDZ,EAAFY,GAMGV,UAAWW,EAAAA,QAAW,mBAAwChB,oBAAAA,EANhCK,EAAAA,YAQ7BO,eACCC,EAAA,QAAAC,cAAAD,EAAA,QAAAI,SAAA,kBAEEJ,EAAAA,QACEC,cAAA,SAAA,CAAAI,MAAM,qBACNC,OAAWC,EAAUpB,EAAMS,EAAO,MAAUW,KAAAA,EAAUpB,EAAMS,EAAO,2BAGrEI,EAAAA,QACEC,cAAA,SAAA,CAAAI,MAAM,qBACNC,OAAWC,EAAUpB,EAAMU,EAAQ,MAAUU,KAAAA,EAAUpB,EAAMU,EAAQ,MAAK,SAG5E,kBAEJG,EACE,QAAAC,cAAA,MAAA,CAAAf,IAAKA,EACLE,IAAKA,EACLG,QAASA,EACTiB,IAAKD,EAAUpB,EAAMY,EAAWD,EAAQL,EAAM,MAC9Ca,OAAWC,EAAUpB,EAAMY,EAAWD,EAAQL,EAAM,MAAW,SAGjE,IACN,GAGF,SAASc,EAAUE,EAAsBhB,EAAyBiB,GAChE,MAAA,wBAA+BD,EAAY,IAAIhB,EAAI,IAAIiB,EAAU,OACnE,CCAC1B,EAAAA,YAAAA,GAlDWA,EAAAA,EAAMA,SAANA,SAkDX,CAAA,IAjDC,KAAA,OACAA,EAAA,UAAA,YACAA,EAAA,SAAA,WACAA,EAAA,WAAA,aACAA,EAAA,cAAA,gBACAA,EAAA,UAAA,YACAA,EAAA,SAAA,WACAA,EAAA,mBAAA,qBACAA,EAAA,QAAA,UACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,EAAA,KAAA,OACAA,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,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,UAAA,YACAA,EAAA,eAAA,iBACAA,EAAA,yBAAA,2BACAA,EAAA,UAAA,YACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,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,iCCtDW,wBACX,OAAOgB,EAAK,QAAAC,cAAA,MAAA,CAAAT,UAAU,WAAWgB,IAAI,0CAA0CpB,IAAI,QACrF"}
+{"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  AUTO = 'auto',\n}\n\nexport type LargeSize = 'large';\nexport type MediumSize = 'medium';\nexport type SmallSize = 'small';\nexport type AutoSize = 'auto';\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, AutoSize, 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 | AutoSize;\n\nexport type Props = {\n  name: IllustrationNames;\n  alt: string;\n  size?: IllustrationSizes;\n  loading?: 'eager' | 'lazy';\n} & ImgProps;\n\nconst Illustration = forwardRef<HTMLImageElement, Props>(\n  ({ id, name, alt, loading = 'lazy', className, size = Sizes.AUTO }: Props, ref) => {\n    const { SMALL, MEDIUM, LARGE } = Sizes;\n    const autoSize: boolean = size === Sizes.AUTO;\n    return name ? (\n      <picture\n        id={id}\n        className={classNames('wds-illustration', `wds-illustration-${name}`, className)}\n      >\n        {autoSize ? (\n          <>\n            {/* Mobile Screens */}\n            <source\n              media=\"(max-width: 575px)\"\n              srcSet={`${defineSrc(name, SMALL, '1x')}, ${defineSrc(name, SMALL, '2x')} 2x`}\n            />\n            {/* Tablets */}\n            <source\n              media=\"(max-width: 991px)\"\n              srcSet={`${defineSrc(name, MEDIUM, '1x')}, ${defineSrc(name, MEDIUM, '2x')} 2x`}\n            />\n          </>\n        ) : null}\n\n        <img\n          ref={ref}\n          alt={alt}\n          loading={loading}\n          src={defineSrc(name, autoSize ? LARGE : size, '1x')}\n          srcSet={`${defineSrc(name, autoSize ? LARGE : size, '2x')} 2x`}\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  CALENDAR = 'calendar',\n  CHECK_MARK = 'check-mark',\n  CLOSED_WINDOW = 'closed-window',\n  COIN_PILE = 'coin-pile',\n  CONFETTI = 'confetti',\n  CONSTRUCTION_FENCE = 'construction-fence',\n  CONVERT = 'convert',\n  COOKIE = 'cookie',\n  DOCUMENTS = 'documents',\n  DOOR = 'door',\n  ELECTRIC_PLUG = 'electric-plug',\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 = '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  MEGAPHONE = 'megaphone',\n  MULTI_CURRENCY = 'multi-currency',\n  ONE_INVITE_LETTER_OPENED = 'one-invite-letter-opened',\n  PALM_TREE = 'palm-tree',\n  PHONES = 'phones',\n  PIE_CHART = 'pie-chart',\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  | 'calendar'\n  | 'check-mark'\n  | 'closed-window'\n  | 'coin-pile'\n  | 'confetti'\n  | 'construction-fence'\n  | 'convert'\n  | 'cookie'\n  | 'documents'\n  | 'door'\n  | 'electric-plug'\n  | 'email'\n  | 'exclamation-mark'\n  | 'flag'\n  | 'flower'\n  | 'gear'\n  | 'globe'\n  | 'graph'\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  | 'megaphone'\n  | 'multi-currency'\n  | 'one-invite-letter-opened'\n  | 'palm-tree'\n  | 'phones'\n  | 'pie-chart'\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","Illustration","Assets","forwardRef","ref","name","alt","_ref$loading","_ref","loading","className","size","AUTO","_ref$size","SMALL","MEDIUM","LARGE","autoSize","React","createElement","id","classNames","Fragment","media","srcSet","defineSrc","src","illustration","descriptor"],"mappings":"8XAAYA,0DAAAA,EAAAA,EAAKA,QAALA,QAKX,CAAA,IAJC,MAAA,QACAA,EAAA,OAAA,SACAA,EAAA,MAAA,QACAA,EAAA,KAAA,OCeIC,ICZMC,EDYMD,EAAGE,EAAUA,WAC7B,SAA2EC,EAAAA,GAAO,IAA3EC,EAAAA,EAAAA,KAAMC,IAAAA,IAAGC,EAAAC,EAAEC,QAAAA,OAAO,IAAAF,EAAG,OAAQG,EAAWC,EAAAA,EAAAA,KAAAA,OAAOX,IAAAA,EAAAA,QAAMY,KAC1DC,IAAiCb,EAAAA,MAAzBc,MAAOC,EAAkBf,EAAKA,MAAvBe,OAAQC,EAAUhB,EAAKA,MAAfgB,MACTC,EAAYN,IAASX,EAAKA,MAACY,KACzC,OAAOP,eACLa,UACEC,cAAA,UAAA,CAAAC,GALDZ,EAAFY,GAMGV,UAAWW,EAAAA,QAAW,mBAAwChB,oBAAAA,EANhCK,EAAAA,YAQ7BO,eACCC,EAAA,QAAAC,cAAAD,EAAA,QAAAI,SAAA,kBAEEJ,EAAAA,QACEC,cAAA,SAAA,CAAAI,MAAM,qBACNC,OAAWC,EAAUpB,EAAMS,EAAO,MAAUW,KAAAA,EAAUpB,EAAMS,EAAO,2BAGrEI,EAAAA,QACEC,cAAA,SAAA,CAAAI,MAAM,qBACNC,OAAWC,EAAUpB,EAAMU,EAAQ,MAAUU,KAAAA,EAAUpB,EAAMU,EAAQ,MAAK,SAG5E,kBAEJG,EACE,QAAAC,cAAA,MAAA,CAAAf,IAAKA,EACLE,IAAKA,EACLG,QAASA,EACTiB,IAAKD,EAAUpB,EAAMY,EAAWD,EAAQL,EAAM,MAC9Ca,OAAWC,EAAUpB,EAAMY,EAAWD,EAAQL,EAAM,MAAW,SAGjE,IACN,GAGF,SAASc,EAAUE,EAAsBhB,EAAyBiB,GAChE,MAAA,iDAAwDD,EAAY,IAAIhB,EAAI,IAAIiB,EAAU,OAC5F,CCAC1B,EAAAA,YAAAA,GAlDWA,EAAAA,EAAMA,SAANA,SAkDX,CAAA,IAjDC,KAAA,OACAA,EAAA,UAAA,YACAA,EAAA,SAAA,WACAA,EAAA,WAAA,aACAA,EAAA,cAAA,gBACAA,EAAA,UAAA,YACAA,EAAA,SAAA,WACAA,EAAA,mBAAA,qBACAA,EAAA,QAAA,UACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,EAAA,KAAA,OACAA,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,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,UAAA,YACAA,EAAA,eAAA,iBACAA,EAAA,yBAAA,2BACAA,EAAA,UAAA,YACAA,EAAA,OAAA,SACAA,EAAA,UAAA,YACAA,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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wise/art",
-  "version": "0.0.3",
+  "version": "0.0.5",
   "license": "MIT",
   "description": "React library for art elements in UI",
   "homepage": "https://github.com/transferwise/web-art#readme",
@@ -19,14 +19,14 @@
   "scripts": {
     "setup": "yarn && yarn build",
     "load-i10s": "cpx 'node_modules/wise-atoms/illustrations/**/*.png' temp",
-    "convert-i10s-png-to-webp": "rm -rf src/illustrations/assets && node ./scripts/convert-png-to-webp.mjs",
+    "convert-i10s-png-to-webp": "rm -rf s3-bucket/illustrations/ && node ./scripts/convert-png-to-webp.mjs",
     "generate-i10s-metadata": "node ./scripts/generate-i10s-metadata.mjs && eslint 'src/illustrations/metadata.ts' --fix",
     "bundle": "rm -rf dist && microbundle --jsxFragment React.Fragment --jsx React.createElement && cpx src/illustrations/Illustration.css dist/",
-    "copy-i10s": "cpx 'src/illustrations/assets/*' dist/illustrations/assets",
     "cleanup": "rm -rf temp",
-    "build": "yarn load-i10s && yarn convert-i10s-png-to-webp && yarn generate-i10s-metadata && yarn bundle && yarn copy-i10s && yarn cleanup",
+    "build": "yarn load-i10s && yarn convert-i10s-png-to-webp && yarn generate-i10s-metadata && yarn bundle && yarn cleanup",
     "start": "start-storybook -p 3001",
     "dev": "yarn start",
+    "test": "release-to-github-with-changelog-pre-release-checks",
     "lint-fix": "eslint 'src/**/*.{js,ts,tsx}' 'scripts/*.{mjs,js,ts,tsx}' --fix"
   },
   "devDependencies": {

package/dist/Temp.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-declare const Temp: () => JSX.Element;
-export default Temp;