@transferwise/components 45.4.0 → 45.5.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@transferwise/components",
-  "version": "45.4.0",
+  "version": "45.5.1",
   "description": "Neptune React components",
   "license": "Apache-2.0",
   "main": "./build/umd/polyfill/main.js",
@@ -12,17 +12,13 @@
   ],
   "files": [
     "build",
-    "scripts",
-    "upgrades"
+    "scripts"
   ],
   "repository": {
     "type": "git",
     "fullname": "transferwise/neptune",
     "url": "git+https://github.com/transferwise/neptune-web.git"
   },
-  "bin": {
-    "neptune-upgrade-util": "scripts/neptune-upgrader.js"
-  },
   "devDependencies": {
     "@formatjs/cli": "^4.8.3",
     "@rollup/plugin-babel": "^5.2.2",
@@ -53,8 +49,9 @@
     "@transferwise/icons": "^3.2.3",
     "@transferwise/neptune-tokens": "^8.5.0",
     "@types/jest": "^26.0.20",
-    "@types/jscodeshift": "^0.11.0",
     "@types/node": "^14.14.31",
+    "@types/react": "^17.0.59",
+    "@types/react-dom": "^17.0.20",
     "@types/react-transition-group": "4.4.5",
     "@types/testing-library__jest-dom": "^5.14.5",
     "@wise/art": "^2.0.1",
@@ -72,12 +69,12 @@
     "rollup-plugin-uglify": "^6.0.4",
     "storybook": "^7.0.6",
     "@transferwise/less-config": "3.0.6",
-    "@transferwise/neptune-css": "14.3.49",
+    "@transferwise/neptune-css": "14.3.50",
     "@wise/components-theming": "0.7.5"
   },
   "peerDependencies": {
     "@transferwise/icons": "^3.2.3",
-    "@transferwise/neptune-css": "^14.3.49",
+    "@transferwise/neptune-css": "^14.3.50",
     "@wise/art": "^2",
     "@wise/components-theming": "0.5 - 0.7",
     "currency-flags": "^4.0.2",
@@ -101,12 +98,10 @@
     "@react-spring/web": "~9.6.1",
     "@transferwise/formatting": "^2.1.0",
     "@transferwise/neptune-validation": "^3.0.12",
+    "@types/lodash.throttle": "^4.1.7",
     "classnames": "^2.2.6",
     "commonmark": "0.29.1",
     "core-js": "^3.8.0",
-    "inquirer": "^8.1.1",
-    "inquirer-file-tree-selection-prompt": "^1.0.7",
-    "jscodeshift": "^0.11.0",
     "lodash.clamp": "^4.0.3",
     "lodash.debounce": "^4.0.8",
     "lodash.difference": "^4.5.0",

package/scripts/generate-type-declarations.js

@@ -18,8 +18,6 @@ const jsFiles = [
   { filename: 'Radio', folder: 'radio' },
   { filename: 'Select', folder: 'select' },
   { filename: 'MoneyInput', folder: 'moneyInput' },
-  { filename: 'Stepper', folder: 'stepper' },
-  { filename: 'FlowNavigation', folder: 'flowNavigation' },
   { filename: 'Popover', folder: 'popover' },
   { filename: 'Money', folder: 'money' },
   { filename: 'RadioOption', folder: 'radioOption' },

package/build/es/no-polyfill/common/flowHeader/index.js

@@ -1 +0,0 @@
-export{default}from"./FlowHeader";

package/build/es/no-polyfill/common/hooks/useClientWidth/index.js

@@ -1 +0,0 @@
-export{useClientWidth as default}from"./useClientWidth";

package/build/es/no-polyfill/flowNavigation/index.js

@@ -1 +0,0 @@
-export{default}from"./FlowNavigation";

package/build/es/no-polyfill/stepper/index.js

@@ -1 +0,0 @@
-import Stepper from"./Stepper";export default Stepper;

package/build/es/polyfill/common/flowHeader/index.js

@@ -1 +0,0 @@
-export{default}from"./FlowHeader";

package/build/es/polyfill/common/hooks/useClientWidth/index.js

@@ -1 +0,0 @@
-export{useClientWidth as default}from"./useClientWidth";

package/build/es/polyfill/flowNavigation/index.js

@@ -1 +0,0 @@
-export{default}from"./FlowNavigation";

package/build/es/polyfill/stepper/index.js

@@ -1 +0,0 @@
-import Stepper from"./Stepper";export default Stepper;

package/build/types/common/flowHeader/index.d.ts

@@ -1 +0,0 @@
-export { default } from "./FlowHeader";

package/build/types/common/hooks/useClientWidth/index.d.ts

@@ -1 +0,0 @@
-export { useClientWidth as default } from "./useClientWidth";

package/build/types/flowNavigation/index.d.ts

@@ -1 +0,0 @@
-export { default } from "./FlowNavigation";

package/build/types/stepper/index.d.ts

@@ -1,2 +0,0 @@
-export default Stepper;
-import Stepper from "./Stepper";

package/scripts/neptune-upgrader.js

@@ -1,114 +0,0 @@
-#!/usr/bin/env node
-/* eslint-disable no-console */
-
-const { exec } = require('child_process');
-const path = require('path');
-
-const inquirer = require('inquirer');
-const inquirerFileTreeSelection = require('inquirer-file-tree-selection-prompt');
-
-inquirer.registerPrompt('file-tree-selection', inquirerFileTreeSelection);
-
-const IGNORE_PATTERN = '**/node_modules/*';
-const EXTENSIONS = {
-  JS: 'js & jsx',
-  TSX: 'tsx',
-  BOTH: 'js,jsx & tsx',
-};
-
-const fetchSettings = () => {
-  const questions = [
-    {
-      name: 'transform',
-      type: 'file-tree-selection',
-      root: path.join(__dirname, '../upgrades'),
-      message: '✨ Which upgrade would you like to run?',
-    },
-    {
-      type: 'list',
-      name: 'extension',
-      message: '✨ What file extensions should I look at?',
-      choices: Object.values(EXTENSIONS),
-    },
-    {
-      name: 'files',
-      type: 'file-tree-selection',
-      onlyShowDir: true,
-      root: process.cwd(),
-      message: '✨ And what directory would you like to transform?',
-    },
-  ];
-  return inquirer.prompt(questions);
-};
-
-const fetchOptions = () => {
-  const questions = [
-    {
-      name: 'dry',
-      type: 'confirm',
-      message: '✨ Dry run? (no changes are made to files)',
-    },
-    {
-      name: 'verbose',
-      type: 'confirm',
-      message: '✨ Extra logging?',
-      default: false,
-    },
-  ];
-  return inquirer.prompt(questions);
-};
-
-const okToProceed = () => {
-  const questions = [
-    {
-      name: 'confirm',
-      type: 'confirm',
-      message: 'Does everything look ok?',
-    },
-  ];
-  return inquirer.prompt(questions);
-};
-
-const run = async () => {
-  const { transform, extension, files } = await fetchSettings();
-  const { dry, verbose } = await fetchOptions();
-
-  console.log(`✨ Please review the following:`);
-  console.log(`✨ Upgrade script: ${transform}`);
-  console.log(`✨ File extension(s): ${extension}`);
-  console.log(`✨ Directory: ${files}`);
-  console.log(`✨ Dry run: ${dry}`);
-
-  const { confirm } = await okToProceed();
-
-  const options = `${dry ? '-d' : ''} ${verbose ? '-v=2' : ''}`;
-
-  const handleOutput = (error, stdout, stderr) => {
-    if (error) {
-      console.log(stderr);
-      return;
-    }
-    console.log(stdout);
-  };
-
-  const codeshiftPath = path.join(__dirname, '../node_modules/.bin/jscodeshift');
-
-  const coreCommand = `${codeshiftPath} ${files} -t=${transform} ${options}`;
-
-  if (confirm) {
-    console.log('🚀 Running codemod, please wait a few seconds...');
-    if (extension === EXTENSIONS.BOTH || extension === EXTENSIONS.JS) {
-      exec(`${coreCommand} --extensions=js,jsx --ignore-pattern='${IGNORE_PATTERN}'`, handleOutput);
-    }
-    if (extension === EXTENSIONS.BOTH || extension === EXTENSIONS.TSX) {
-      exec(
-        `${coreCommand} --parser=tsx --extensions=tsx --ignore-pattern='${IGNORE_PATTERN}'`,
-        handleOutput,
-      );
-    }
-  } else {
-    console.log('👋 Exiting');
-  }
-};
-
-run();

package/upgrades/2021-02-v34-35.js

@@ -1,193 +0,0 @@
-import { log } from './utils';
-
-const TYPE_REPLACEMENTS = {
-  primary: 'Button.Type.ACCENT',
-  secondary: 'Button.Type.ACCENT',
-  link: 'Button.Type.ACCENT',
-  danger: 'Button.Type.NEGATIVE',
-  pay: 'Button.Type.POSITIVE',
-};
-
-const PRIORITY_ADDITIONS = {
-  secondary: 'Button.Priority.SECONDARY',
-  link: 'Button.Priority.TERTIARY',
-  danger: 'Button.Priority.SECONDARY',
-};
-
-const transform = (file, api, options) => {
-  const printOptions = options.printOptions || {
-    quote: 'single',
-    trailingComma: true,
-  };
-
-  const j = api.jscodeshift;
-  const root = j(file.source);
-
-  log('All aboard the transformation train 🚂', 2);
-  log(
-    'Upgrading instances of Button from @transferwise/components. Please refer to components/upgrades/2021-02-v34-35.js for details.',
-    1,
-  );
-  log(`Using the ${options.parser} parser.`, 2);
-
-  const literalType = options.parser === 'tsx' ? 'StringLiteral' : 'Literal';
-
-  // First, ensure they are importing Button from our package
-  const buttonImports = root
-    .find(j.ImportDeclaration, {
-      source: {
-        type: literalType,
-        value: '@transferwise/components',
-      },
-    })
-    .find(j.Identifier, {
-      name: 'Button',
-    });
-
-  if (buttonImports.size() === 0) {
-    return null;
-  }
-
-  log('Found import of Button from @transferwise/components, continuing 🛤', 1);
-
-  const buttons = root.findJSXElements('Button');
-
-  log('Adding priorities for literal types', 2);
-
-  // Add in priorities for literal types such as <Button type="secondary"/> => <Button type="secondary" priority={Button.Priority.SECONDARY} />
-  buttons
-    .find(j.JSXAttribute, {
-      name: {
-        type: 'JSXIdentifier',
-        name: 'type',
-      },
-      value: {
-        type: 'Literal',
-      },
-    })
-    .replaceWith((nodePath) => {
-      const priority = PRIORITY_ADDITIONS[nodePath.value.value.value]; // 😅
-
-      if (!priority) {
-        return nodePath.value;
-      }
-
-      return [
-        nodePath.value,
-        j.jsxAttribute(
-          j.jsxIdentifier('priority'),
-          j.jsxExpressionContainer(j.identifier(priority)),
-        ),
-      ];
-    });
-
-  log('Adding priorities for expressive types', 2);
-
-  // Add in priorities for expressive types such as <Button type={Button.Type.SECONDARY}/> => <Button type={Button.Type.SECONDARY} priority={Button.Priority.SECONDARY} />
-  buttons
-    .find(j.JSXAttribute, {
-      name: {
-        type: 'JSXIdentifier',
-        name: 'type',
-      },
-      value: {
-        type: 'JSXExpressionContainer',
-        expression: {
-          type: 'MemberExpression',
-          object: {
-            type: 'MemberExpression',
-            object: {
-              name: 'Button',
-              type: 'Identifier',
-            },
-            property: {
-              name: 'Type',
-              type: 'Identifier',
-            },
-          },
-        },
-      },
-    })
-    .replaceWith((nodePath) => {
-      const type = nodePath.value.value.expression.property.name;
-
-      const priority = PRIORITY_ADDITIONS[type.toLowerCase()];
-
-      if (!priority) {
-        return nodePath.value;
-      }
-
-      return [
-        nodePath.value,
-        j.jsxAttribute(
-          j.jsxIdentifier('priority'),
-          j.jsxExpressionContainer(j.identifier(priority)),
-        ),
-      ];
-    });
-
-  log('Replacing deprecated literal types', 2);
-
-  // Replace literal types such as <Button type="primary"/> => <Button type={Button.Type.ACCENT} />
-  buttons
-    .find(j.JSXAttribute, {
-      name: {
-        type: 'JSXIdentifier',
-        name: 'type',
-      },
-      value: {
-        type: 'Literal',
-      },
-    })
-    .find(j.Literal)
-    .replaceWith((nodePath) => {
-      const type = TYPE_REPLACEMENTS[nodePath.value.value];
-
-      if (!type) {
-        return nodePath.value;
-      }
-
-      return j.jsxExpressionContainer(j.identifier(type));
-    });
-
-  log('Replacing deprecated expressive types', 2);
-
-  // Replace expressive types such as <Button type={Button.Type.PRIMARY}/> => <Button type={Button.Type.ACCENT} />
-  buttons
-    .find(j.JSXAttribute, {
-      name: {
-        type: 'JSXIdentifier',
-        name: 'type',
-      },
-      value: {
-        type: 'JSXExpressionContainer',
-      },
-    })
-    .find(j.MemberExpression, {
-      object: {
-        type: 'MemberExpression',
-        object: {
-          name: 'Button',
-          type: 'Identifier',
-        },
-        property: {
-          name: 'Type',
-          type: 'Identifier',
-        },
-      },
-    })
-    .replaceWith((node) => {
-      const type = node.value.property.name.toLowerCase();
-
-      if (!TYPE_REPLACEMENTS[type]) {
-        return node.value;
-      }
-      return j.jsxIdentifier(TYPE_REPLACEMENTS[type]);
-    });
-
-  log('Transformation complete, printing to source.', 1);
-
-  return root.toSource(printOptions);
-};
-
-export default transform;