@transferwise/components 0.0.0-experimental-756c861 → 0.0.0-experimental-2ce5185

package/README.md

@@ -44,7 +44,7 @@ export default function Hello() {
 
 This package exposes [type declarations](https://www.typescriptlang.org/docs/handbook/2/type-declarations.html) for all components.
 
-Note: types for some of components are not 100% accurate (some of them will be just [`any`](https://www.typescriptlang.org/docs/handbook/2/everyday-types.html#any)), this is due to fact that many of components written on JavaScript and types generated by [react-to-typescript-definitions](https://www.npmjs.com/package/react-to-typescript-definitions) based of components `PropTypes` and unfortunatly the library doesn't resolve all `PropTypes` features and use cases (e.g custom validators, `PropTypes.objectOf`, [requireIf](https://www.npmjs.com/package/react-required-if), etc). But bear with us as eventually it would be fully on TypeScript.
+Note: types for some of components are not 100% accurate (some of them will be just [`any`](https://www.typescriptlang.org/docs/handbook/2/everyday-types.html#any)), this is due to fact that many of components written on JavaScript and types generated by [react-to-typescript-definitions](https://www.npmjs.com/package/react-to-typescript-definitions) based of components `PropTypes` and unfortunatly the library doesn't resolve all `PropTypes` features and use cases (e.g custom validators, `PropTypes.objectOf`, etc). But bear with us as eventually it would be fully on TypeScript.
 
 Please follow [rules for JS components](https://github.com/transferwise/neptune-web/blob/main/packages/components/CONTRIBUTING.md#js-component-rules) in order to generate accurate types for them.
 

package/build/index.js

@@ -21,7 +21,6 @@ var reactPopper = require('react-popper');
 var art = require('@wise/art');
 var clamp$2 = require('lodash.clamp');
 var debounce = require('lodash.debounce');
-var requiredIf = require('react-required-if');
 var web = require('@react-spring/web');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -51,7 +50,6 @@ var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
 var mergeProps__default = /*#__PURE__*/_interopDefault(mergeProps);
 var clamp__default = /*#__PURE__*/_interopDefault(clamp$2);
 var debounce__default = /*#__PURE__*/_interopDefault(debounce);
-var requiredIf__default = /*#__PURE__*/_interopDefault(requiredIf);
 
 exports.Typography = void 0;
 (function (Typography) {
@@ -1501,7 +1499,7 @@ const Button = /*#__PURE__*/React.forwardRef(({
   });
 });
 
-const Card$2 = /*#__PURE__*/React.forwardRef(({
+const Card$1 = /*#__PURE__*/React.forwardRef(({
   className,
   children = null,
   id,
@@ -1534,7 +1532,7 @@ const Card$2 = /*#__PURE__*/React.forwardRef(({
     }), children]
   });
 });
-Card$2.displayName = 'Card';
+Card$1.displayName = 'Card';
 
 function Display({
   as: Heading = 'h1',
@@ -1913,7 +1911,7 @@ const PromoCard = /*#__PURE__*/React.forwardRef(({
   React.useEffect(() => {
     setChecked(defaultChecked ?? isChecked ?? false);
   }, [defaultChecked, isChecked]);
-  return /*#__PURE__*/jsxRuntime.jsxs(Card$2, {
+  return /*#__PURE__*/jsxRuntime.jsxs(Card$1, {
     ...commonProps,
     ...checkedProps,
     ...props,
@@ -2210,20 +2208,19 @@ const isVisible = (container, el) => {
   return elemLeft >= cScrollOffset && elemRight <= cScrollOffset + cWidth;
 };
 
-const Card = /*#__PURE__*/React.forwardRef((props, reference) => {
-  const {
-    'aria-label': ariaLabel,
-    as: Element,
-    isExpanded,
-    title,
-    details,
-    children,
-    onClick,
-    icon,
-    id,
-    className,
-    ...rest
-  } = props;
+const Card = /*#__PURE__*/React.forwardRef(function Card({
+  'aria-label': ariaLabel,
+  as: Element = 'div',
+  isExpanded,
+  title,
+  details,
+  children,
+  onClick,
+  icon,
+  id,
+  className,
+  'data-testid': dataTestId
+}, reference) {
   const isOpen = !!(isExpanded && children);
   return /*#__PURE__*/jsxRuntime.jsxs(Element, {
     ref: reference,
@@ -2233,7 +2230,7 @@ const Card = /*#__PURE__*/React.forwardRef((props, reference) => {
       'np-card--has-icon': !!icon
     }),
     id: id,
-    "data-testid": rest['data-testid'],
+    "data-testid": dataTestId,
     children: [/*#__PURE__*/jsxRuntime.jsx(Option$2, {
       "aria-label": ariaLabel,
       as: children ? 'button' : 'div',
@@ -2245,7 +2242,7 @@ const Card = /*#__PURE__*/React.forwardRef((props, reference) => {
       button: children && /*#__PURE__*/jsxRuntime.jsx(Chevron, {
         orientation: isOpen ? exports.Position.TOP : exports.Position.BOTTOM
       }),
-      onClick: () => children && onClick(!isExpanded)
+      onClick: children ? () => onClick?.(!isExpanded) : undefined
     }), /*#__PURE__*/jsxRuntime.jsx("div", {
       className: classNames__default.default('np-card__divider', {
         'np-card__divider--expanded': isOpen
@@ -2258,31 +2255,6 @@ const Card = /*#__PURE__*/React.forwardRef((props, reference) => {
     })]
   });
 });
-const hasChildren = ({
-  children
-}) => children;
-Card.propTypes = {
-  'aria-label': PropTypes__default.default.string,
-  as: PropTypes__default.default.string,
-  isExpanded: requiredIf__default.default(PropTypes__default.default.bool, hasChildren),
-  title: PropTypes__default.default.node.isRequired,
-  details: PropTypes__default.default.node.isRequired,
-  onClick: requiredIf__default.default(PropTypes__default.default.func, hasChildren),
-  icon: PropTypes__default.default.node,
-  children: PropTypes__default.default.node,
-  id: PropTypes__default.default.string,
-  className: PropTypes__default.default.string,
-  'data-testid': PropTypes__default.default.string
-};
-Card.defaultProps = {
-  'aria-label': undefined,
-  as: 'div',
-  children: null,
-  id: null,
-  className: null,
-  'data-testid': null
-};
-var Card$1 = Card;
 
 const CheckboxButton = /*#__PURE__*/React.forwardRef(({
   checked,
@@ -14695,11 +14667,11 @@ exports.Alert = Alert;
 exports.Avatar = Avatar;
 exports.AvatarWrapper = AvatarWrapper;
 exports.Badge = Badge;
-exports.BaseCard = Card$2;
+exports.BaseCard = Card$1;
 exports.Body = Body;
 exports.BottomSheet = BottomSheet$1;
 exports.Button = Button;
-exports.Card = Card$1;
+exports.Card = Card;
 exports.Carousel = Carousel;
 exports.Checkbox = Checkbox;
 exports.CheckboxButton = CheckboxButton;