@wise/art 0.0.0-experimental-80f4f8e → 0.0.0-experimental-eebd076

package/dist/rive/index.js

@@ -0,0 +1,53 @@
+'use strict';
+
+var reactWebgl2 = require('@rive-app/react-webgl2');
+var clsx = require('clsx');
+var react = require('react');
+var common = require('../common-H4L6Hbbh.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var clsx__default = /*#__PURE__*/_interopDefault(clsx);
+
+const Rive = ({
+  src,
+  animationNames
+}) => {
+  const {
+    RiveComponent
+  } = reactWebgl2.useRive({
+    src,
+    animations: animationNames,
+    autoplay: true
+  });
+  return /*#__PURE__*/jsxRuntime.jsx(RiveComponent, {});
+};
+const RiveIllustrationExperimental = ({
+  name,
+  size: sizeProp = common.Sizes.MEDIUM,
+  className
+}) => {
+  const [size, setSize] = react.useState(sizeProp);
+  react.useEffect(() => {
+    const isMobile = (typeof window !== "undefined" && window?.matchMedia('(max-width: 575px)')?.matches) ?? false;
+    if (isMobile) {
+      setSize(common.Sizes.SMALL);
+    }
+  }, []);
+  return /*#__PURE__*/jsxRuntime.jsx("div", {
+    className: clsx__default.default(`wds-illustration-rive wds-illustration-rive-${name} wds-illustration-rive-${size}`, className),
+    children: (() => {
+      if (name === 'document-scan') {
+        return /*#__PURE__*/jsxRuntime.jsx(Rive, {
+          src: "https://wise.com/web-art/assets/illustrations3d/rive/doc-scan.riv",
+          animationNames: ["Scan Line Appearing", "Scan Line Moving"]
+        });
+      }
+      return null;
+    })()
+  });
+};
+
+exports.RiveIllustrationExperimental = RiveIllustrationExperimental;
+//# sourceMappingURL=index.js.map

package/dist/rive/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../src/rive/RiveIllustration.tsx"],"sourcesContent":["import { useRive } from \"@rive-app/react-webgl2\";\nimport clsx from \"clsx\";\nimport { useEffect, useState } from \"react\";\n\nimport { Sizes } from \"../common\";\nimport type { Illustration3DProps } from \"../illustrations3d\";\n\nexport interface RiveProps {\n  src: string;\n  animationNames?: string | string[];\n}\n\nconst Rive = ({ src, animationNames }: RiveProps) => {\n  const { RiveComponent } = useRive({\n    src,\n    animations: animationNames,\n    autoplay: true,\n  });\n\n  return (<RiveComponent />);\n};\n\nexport type Props = {\n  name: 'document-scan';\n  size?: Illustration3DProps[\"size\"];\n  className?: Illustration3DProps[\"className\"];\n};\n\nconst RiveIllustrationExperimental = ({ name, size: sizeProp = Sizes.MEDIUM, className }: Props) => {\n  const [size, setSize] = useState<Props['size']>(sizeProp);\n  useEffect(() => {\n    const isMobile: boolean =\n      (typeof window !== \"undefined\" && window?.matchMedia('(max-width: 575px)')?.matches) ?? false;\n    if (isMobile) {\n      setSize(Sizes.SMALL);\n    }\n  }, []);\n  return (\n    <div className={clsx('wds-illustration-rive', `wds-illustration-rive-${name}`, `wds-illustration-rive-${size}`, className)}>\n      {(() => {\n        if (name === 'document-scan') {\n          return (\n            <Rive\n              src=\"https://wise.com/web-art/assets/illustrations3d/rive/doc-scan.riv\"\n              animationNames={[\"Scan Line Appearing\", \"Scan Line Moving\"]}\n            />);\n        }\n        return null;\n      })()}\n    </div>\n  );\n};\n\nexport default RiveIllustrationExperimental;\n"],"names":["Rive","src","animationNames","RiveComponent","useRive","animations","autoplay","_jsx","RiveIllustrationExperimental","name","size","sizeProp","Sizes","MEDIUM","className","setSize","useState","useEffect","isMobile","window","matchMedia","matches","SMALL","clsx","children"],"mappings":";;;;;;;;;;;;AAYA,MAAMA,IAAI,GAAGA,CAAC;EAAEC,GAAG;AAAEC,EAAAA;AAAc,CAAa,KAAI;EAClD,MAAM;AAAEC,IAAAA;GAAe,GAAGC,mBAAO,CAAC;IAChCH,GAAG;AACHI,IAAAA,UAAU,EAAEH,cAAc;AAC1BI,IAAAA,QAAQ,EAAE;AACX,GAAA,CAAC;AAEF,EAAA,oBAAQC,cAAA,CAACJ,aAAa,EAAA,EAAA,CAAG;AAC3B,CAAC;AAQD,MAAMK,4BAA4B,GAAGA,CAAC;EAAEC,IAAI;AAAEC,EAAAA,IAAI,EAAEC,QAAQ,GAAGC,YAAK,CAACC,MAAM;AAAEC,EAAAA;AAAS,CAAS,KAAI;EACjG,MAAM,CAACJ,IAAI,EAAEK,OAAO,CAAC,GAAGC,cAAQ,CAAgBL,QAAQ,CAAC;AACzDM,EAAAA,eAAS,CAAC,MAAK;AACb,IAAA,MAAMC,QAAQ,GACZ,CAAC,OAAOC,MAAM,KAAK,WAAW,IAAIA,MAAM,EAAEC,UAAU,CAAC,oBAAoB,CAAC,EAAEC,OAAO,KAAK,KAAK;AAC/F,IAAA,IAAIH,QAAQ,EAAE;AACZH,MAAAA,OAAO,CAACH,YAAK,CAACU,KAAK,CAAC;AACtB,IAAA;EACF,CAAC,EAAE,EAAE,CAAC;AACN,EAAA,oBACEf,cAAA,CAAA,KAAA,EAAA;IAAKO,SAAS,EAAES,qBAAI,CAAA,CAAA,4CAAA,EAAmDd,IAAI,0BAA6BC,IAAI,CAAA,CAAA,EAAII,SAAS,CAAE;IAAAU,QAAA,EACxH,CAAC,MAAK;MACL,IAAIf,IAAI,KAAK,eAAe,EAAE;QAC5B,oBACEF,cAAA,CAACP,IAAI,EAAA;AACHC,UAAAA,GAAG,EAAC,mEAAmE;AACvEC,UAAAA,cAAc,EAAE,CAAC,qBAAqB,EAAE,kBAAkB;AAAE,SAAA,CAC5D;AACN,MAAA;AACA,MAAA,OAAO,IAAI;AACb,IAAA,CAAC;AAAG,GACD,CAAC;AAEV;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wise/art",
-  "version": "0.0.0-experimental-80f4f8e",
+  "version": "0.0.0-experimental-eebd076",
   "license": "MIT",
   "description": "React library for art elements in UI",
   "homepage": "https://github.com/transferwise/web-art#readme",
@@ -76,7 +76,7 @@
     "storybook": "^10.2.10",
     "typescript": "^5.9.3",
     "vite": "^7.3.1",
-    "wise-atoms": "git+https://github.com/transferwise/wise-atoms.git#a501525e676238f14ca8de862e56ba47cadc131b",
+    "wise-atoms": "git+https://github.com/transferwise/wise-atoms.git#7794401a6d26f748ea5d48e12f6dde0cd9c435ba",
     "@storybook/addon-docs": "^10.2.10",
     "@changesets/cli": "^2.29.8",
     "@changesets/changelog-github": "0.5.2"
@@ -107,7 +107,7 @@
     "generate-flags-metadata": "node ./scripts/generate-flags-metadata.mjs && eslint 'src/flags/metadata.ts' --fix",
     "bundle": "rm -rf dist && rollup --config --sourcemap && pnpm build-styles",
     "cleanup": "rm -rf temp",
-    "build": "NODE_ENV=web-art-prod pnpm load-i10s && pnpm load-3d-i10s && pnpm convert-i10s-png-to-webp && pnpm generate-i10s-metadata && pnpm load-flags && pnpm generate-flags-metadata",
+    "build": "NODE_ENV=web-art-prod pnpm load-i10s && pnpm load-3d-i10s && pnpm convert-i10s-png-to-webp && pnpm generate-i10s-metadata && pnpm load-flags && pnpm generate-flags-metadata && pnpm bundle && pnpm cleanup",
     "start": "storybook dev -p 3001",
     "dev": "NODE_ENV=web-art-dev pnpm start",
     "test": "jest",