@transferwise/components 0.0.0-experimental-1bc70dc → 0.0.0-experimental-cbe4279

package/build/styles/neptune-css/less/utilities.css

@@ -0,0 +1,145 @@
+.d-inline-block {
+  display: inline-block;
+}
+.d-inline {
+  display: inline;
+}
+.clearfix::before,
+.clearfix::after {
+  content: " ";
+  display: table;
+}
+.clearfix::after {
+  clear: both;
+}
+.center-block {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+}
+.pull-right,
+.pull-xs-right {
+  float: right !important;
+}
+[dir="rtl"] .pull-right,
+[dir="rtl"] .pull-xs-right {
+  float: left !important;
+}
+.pull-left,
+.pull-xs-left {
+  float: left !important;
+}
+[dir="rtl"] .pull-left,
+[dir="rtl"] .pull-xs-left {
+  float: right !important;
+}
+.pull-xs-none {
+  float: none !important;
+}
+@media (min-width: 576px) {
+  .pull-sm-left {
+    float: left !important;
+  }
+  [dir="rtl"] .pull-sm-left {
+    float: right !important;
+  }
+  .pull-sm-right {
+    float: right !important;
+  }
+  [dir="rtl"] .pull-sm-right {
+    float: left !important;
+  }
+  .pull-sm-none {
+    float: none !important;
+  }
+}
+@media (min-width: 768px) {
+  .pull-md-left {
+    float: left !important;
+  }
+  [dir="rtl"] .pull-md-left {
+    float: right !important;
+  }
+  .pull-md-right {
+    float: right !important;
+  }
+  [dir="rtl"] .pull-md-right {
+    float: left !important;
+  }
+  .pull-md-none {
+    float: none !important;
+  }
+}
+@media (min-width: 992px) {
+  .pull-lg-left {
+    float: left !important;
+  }
+  [dir="rtl"] .pull-lg-left {
+    float: right !important;
+  }
+  .pull-lg-right {
+    float: right !important;
+  }
+  [dir="rtl"] .pull-lg-right {
+    float: left !important;
+  }
+  .pull-lg-none {
+    float: none !important;
+  }
+}
+@media (min-width: 1200px) {
+  .pull-xl-left {
+    float: left !important;
+  }
+  [dir="rtl"] .pull-xl-left {
+    float: right !important;
+  }
+  .pull-xl-right {
+    float: right !important;
+  }
+  [dir="rtl"] .pull-xl-right {
+    float: left !important;
+  }
+  .pull-xl-none {
+    float: none !important;
+  }
+}
+.pull-left-single-direction {
+  float: left !important;
+}
+.pull-right-single-direction {
+  float: right !important;
+}
+.hide {
+  display: none !important;
+}
+.show {
+  display: block !important;
+}
+.invisible {
+  visibility: hidden;
+}
+.text-hide {
+  color: transparent;
+  text-shadow: none;
+  background-color: transparent;
+  border: 0;
+}
+.hidden {
+  display: none !important;
+}
+.affix {
+  position: fixed;
+}
+.rotate90 {
+  transform: rotate(90deg);
+}
+.rotate180 {
+  transform: rotate(180deg);
+}
+.rotate270 {
+  transform: rotate(270deg);
+}
+.rotate-90 {
+  transform: rotate(-90deg);
+}

package/build/styles/neptune-css/less/wells.css

@@ -0,0 +1,74 @@
+.well,
+.well-xs {
+  min-height: 24px;
+  min-height: var(--size-24);
+  margin-bottom: 24px;
+  margin-bottom: var(--size-24);
+  border-radius: 10px;
+  border-radius: var(--radius-small);
+  border: solid 1px rgba(0,0,0,0.10196);
+  border: solid 1px var(--color-border-neutral);
+  padding: 24px;
+  padding: var(--size-24);
+  box-shadow: none;
+}
+@media only screen and (min-width: 576px) {
+  .well-sm {
+    min-height: 24px;
+    min-height: var(--size-24);
+    margin-bottom: 24px;
+    margin-bottom: var(--size-24);
+    border-radius: 10px;
+    border-radius: var(--radius-small);
+    border: solid 1px rgba(0,0,0,0.10196);
+    border: solid 1px var(--color-border-neutral);
+    padding: 24px;
+    padding: var(--size-24);
+    box-shadow: none;
+  }
+}
+@media only screen and (min-width: 768px) {
+  .well-md {
+    min-height: 24px;
+    min-height: var(--size-24);
+    margin-bottom: 24px;
+    margin-bottom: var(--size-24);
+    border-radius: 10px;
+    border-radius: var(--radius-small);
+    border: solid 1px rgba(0,0,0,0.10196);
+    border: solid 1px var(--color-border-neutral);
+    padding: 24px;
+    padding: var(--size-24);
+    box-shadow: none;
+  }
+}
+@media only screen and (min-width: 992px) {
+  .well-lg {
+    min-height: 24px;
+    min-height: var(--size-24);
+    margin-bottom: 24px;
+    margin-bottom: var(--size-24);
+    border-radius: 10px;
+    border-radius: var(--radius-small);
+    border: solid 1px rgba(0,0,0,0.10196);
+    border: solid 1px var(--color-border-neutral);
+    padding: 24px;
+    padding: var(--size-24);
+    box-shadow: none;
+  }
+}
+@media only screen and (min-width: 1200px) {
+  .well-xl {
+    min-height: 24px;
+    min-height: var(--size-24);
+    margin-bottom: 24px;
+    margin-bottom: var(--size-24);
+    border-radius: 10px;
+    border-radius: var(--radius-small);
+    border: solid 1px rgba(0,0,0,0.10196);
+    border: solid 1px var(--color-border-neutral);
+    padding: 24px;
+    padding: var(--size-24);
+    box-shadow: none;
+  }
+}

package/build/styles/neptune-css/props/custom-media.css

@@ -0,0 +1,11 @@
+@custom-media --screen-xs (min-width: 480px);
+@custom-media --screen-xs-max (max-width: 575px); /* --screen-sm - 1 */
+@custom-media --screen-sm (min-width: 576px);
+@custom-media --screen-sm-max (max-width: 767px); /* --screen-md - 1 */
+@custom-media --screen-md (min-width: 768px);
+@custom-media --screen-md-max (max-width: 991px); /* --screen-lg - 1 */
+@custom-media --screen-lg (min-width: 992px);
+@custom-media --screen-lg-max (max-width: 1199px); /* --screen-xl - 1 */
+@custom-media --screen-xl (min-width: 1200px);
+
+@custom-media --screen-400-zoom (max-width: 320px); /* ~400% zoom viewport */

package/build/styles/neptune-css/props/legacy-custom-props.css

@@ -0,0 +1,69 @@
+/*
+  DEPRECATED
+  Use neptune-tokens.css instead.
+  If the token you want isn't available there, raise an issue in @transferwise/neptune-tokens.
+*/
+:root {
+  --border-radius: var(--radius-small);
+  --spacer: 8px;
+  --space-4: 4px;
+  --space-8: 8px;
+  --space-12: 12px;
+  --space-16: 16px;
+  --space-24: 24px;
+  --space-32: 32px;
+  --space-40: 40px;
+  --space-48: 48px;
+  --space-56: 56px;
+  --space-64: 64px;
+  --color-text-link-hover: #00a4df;
+  --color-text-link-active: #008ec0;
+  --brand-white: #fff;
+  --link-color: #00b9ff;
+  --brand-pale-blue: #dbf0fd;
+  --brand-navy-minus-20: #253655;
+  --brand-navy-minus-10: #2e4369;
+  --brand-navy: #37517e;
+  --brand-blue-minus-20: #111824;
+  --brand-blue-minus-10: #192439;
+  --brand-blue: #223049;
+  --brand-light-blue-minus-10: #00a4df;
+  --brand-light-blue: #00b9ff;
+  --brand-grey-plus-10: #6f8691;
+  --brand-smoke-minus-10: #a8aaac;
+  --brand-smoke: #d3d5d8;
+  --brand-smoke-plus-10: #e2e6e8;
+  --brand-smoke-plus-20: #f2f5f7;
+  --brand-green-minus-10: #28b862;
+  --brand-green: #2ed06e;
+  --gray-base: #f2f5f7;
+  --gray-darker: #384347;
+  --gray-light: #829ca9;
+  --brand-primary: #37517e;
+  --body-bg: #fff;
+  --text-bold-color: #2e4369;
+  --font-size-xx-large: 2.8rem; /* 42px */
+  /* stylelint-disable-next-line number-max-precision */
+  --font-size-x-large: 1.8666666667rem; /* 28px */
+  /* stylelint-disable-next-line number-max-precision */
+  --font-size-large: 1.4666666667rem; /* 22px */
+  --font-size-medium: 1.2rem; /* 18px */
+  --font-size: 0.9375rem; /* 15px */
+  /* stylelint-disable-next-line number-max-precision */
+  --font-size-small: 0.9333333333rem; /* 14px */
+  --font-size-x-small: 0.8rem; /* 12px */
+  --line-height: 1.6; /* 24/15 */
+}
+
+@media (--screen-md) {
+  :root {
+    --font-size-xx-large: 2.625rem; /* 42px */
+    --font-size-x-large: 1.75rem; /* 28px */
+    --font-size-large: 1.375rem; /* 22px */
+    --font-size-medium: 1.125rem; /* 18px */
+    --font-size: 1rem; /* 16px */
+    --font-size-small: 0.875rem; /* 14px */
+    --font-size-x-small: 0.75rem; /* 12px */
+    --line-height: 1.5; /* 24/16px */
+  }
+}

package/build/styles/neptune-css/props/neptune-tokens.css

@@ -0,0 +1,11 @@
+@import "@transferwise/neptune-tokens/tokens.css";
+
+/* DEPRECATED, use neptune-tokens instead: https://transferwise.github.io/neptune-web/styles/tokens/Colors */
+:root {
+  --color-primary: #37517e;
+  --color-secondary: #5d7079;
+  --color-accent: #00b9ff;
+  --color-positive: #2ed06e;
+  --color-negative: #f53636;
+  --color-warning: #ffa600;
+}

package/build/types/alert/Alert.d.ts

@@ -8,8 +8,6 @@ export type AlertAction = {
     target?: string;
     text: React.ReactNode;
     onClick?: () => void;
-    /** Controls the rendered element: `'link'` (default) renders a Link, `'button'` renders a Button. When `'button'` is used with `href`, renders an anchor styled as a button. */
-    as?: 'button' | 'link';
 };
 /** @deprecated Use `"top" | "bottom"` instead. */
 type AlertTypeDeprecated = `${Sentiment.SUCCESS | Sentiment.INFO | Sentiment.ERROR}`;

package/build/types/alert/Alert.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../src/alert/Alert.tsx"],"names":[],"mappings":"AAIA,OAAO,EAEL,SAAS,EACT,IAAI,EACJ,MAAM,EAGP,MAAM,WAAW,CAAC;AAUnB;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,gLAAgL;IAChL,EAAE,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;CACxB,CAAC;AAEF,kDAAkD;AAClD,KAAK,mBAAmB,GAAG,GAAG,SAAS,CAAC,OAAO,GAAG,SAAS,CAAC,IAAI,GAAG,SAAS,CAAC,KAAK,EAAE,CAAC;AACrF,KAAK,iBAAiB,GAAG,GACrB,SAAS,CAAC,QAAQ,GAClB,SAAS,CAAC,OAAO,GACjB,SAAS,CAAC,OAAO,GACjB,SAAS,CAAC,QAAQ,GAElB,SAAS,CAAC,OAAO,GACjB,MAAM,CAAC,OAAO,EAAE,CAAC;AAErB;;GAEG;AACH,MAAM,MAAM,SAAS,GAAG,iBAAiB,GAAG,mBAAmB,CAAC;AAEhE;;GAEG;AACH,oBAAY,kBAAkB;IAC5B,QAAQ,YAAY;IACpB,GAAG,cAAc;IACjB,SAAS,aAAa;IACtB,WAAW,cAAc;IACzB,MAAM,gBAAgB;IACtB,YAAY,eAAe;CAC5B;AAED;;GAEG;AACH,MAAM,WAAW,UAAU;IACzB,yIAAyI;IACzI,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wGAAwG;IACxG,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB;;;SAGK;IACL,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,oCAAoC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kGAAkG;IAClG,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,4FAA4F;IAC5F,SAAS,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACvD;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,8CAA8C;IAC9C,KAAK,CAAC,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAChC,oHAAoH;IACpH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,2CAA2C;IAC3C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,2FAA2F;IAC3F,IAAI,CAAC,EAAE,GAAG,IAAI,EAAE,CAAC;CAClB;AAeD;;GAEG;AACH,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAC5B,MAAM,EACN,SAAS,EACT,IAAI,EACJ,eAAe,EACf,SAAS,EACT,OAAO,EACP,KAAK,EACL,IAAgB,EAChB,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,WAAW,GACZ,EAAE,UAAU,+BAyJZ"}
+{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../src/alert/Alert.tsx"],"names":[],"mappings":"AAIA,OAAO,EAEL,SAAS,EACT,IAAI,EACJ,MAAM,EAGP,MAAM,WAAW,CAAC;AAUnB;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,kDAAkD;AAClD,KAAK,mBAAmB,GAAG,GAAG,SAAS,CAAC,OAAO,GAAG,SAAS,CAAC,IAAI,GAAG,SAAS,CAAC,KAAK,EAAE,CAAC;AACrF,KAAK,iBAAiB,GAAG,GACrB,SAAS,CAAC,QAAQ,GAClB,SAAS,CAAC,OAAO,GACjB,SAAS,CAAC,OAAO,GACjB,SAAS,CAAC,QAAQ,GAElB,SAAS,CAAC,OAAO,GACjB,MAAM,CAAC,OAAO,EAAE,CAAC;AAErB;;GAEG;AACH,MAAM,MAAM,SAAS,GAAG,iBAAiB,GAAG,mBAAmB,CAAC;AAEhE;;GAEG;AACH,oBAAY,kBAAkB;IAC5B,QAAQ,YAAY;IACpB,GAAG,cAAc;IACjB,SAAS,aAAa;IACtB,WAAW,cAAc;IACzB,MAAM,gBAAgB;IACtB,YAAY,eAAe;CAC5B;AAED;;GAEG;AACH,MAAM,WAAW,UAAU;IACzB,yIAAyI;IACzI,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wGAAwG;IACxG,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB;;;SAGK;IACL,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,oCAAoC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kGAAkG;IAClG,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,4FAA4F;IAC5F,SAAS,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACvD;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,8CAA8C;IAC9C,KAAK,CAAC,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAChC,oHAAoH;IACpH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,2CAA2C;IAC3C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,2FAA2F;IAC3F,IAAI,CAAC,EAAE,GAAG,IAAI,EAAE,CAAC;CAClB;AAeD;;GAEG;AACH,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAC5B,MAAM,EACN,SAAS,EACT,IAAI,EACJ,eAAe,EACf,SAAS,EACT,OAAO,EACP,KAAK,EACL,IAAgB,EAChB,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,WAAW,GACZ,EAAE,UAAU,+BAsJZ"}

package/build/types/criticalBanner/CriticalCommsBanner.d.ts

@@ -6,7 +6,6 @@ export type CriticalCommsBannerProps = {
     action?: {
         label: string;
         href?: string;
-        target?: HTMLAnchorElement['target'];
         onClick?: () => void;
     };
     sentiment?: CriticalCommsBannerSentiment;

package/build/types/criticalBanner/CriticalCommsBanner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CriticalCommsBanner.d.ts","sourceRoot":"","sources":["../../../src/criticalBanner/CriticalCommsBanner.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAItC,MAAM,MAAM,4BAA4B,GACpC,GAAG,SAAS,CAAC,OAAO,EAAE,GACtB,GAAG,SAAS,CAAC,QAAQ,EAAE,GACvB,GAAG,SAAS,CAAC,OAAO,EAAE,CAAC;AAE3B,MAAM,MAAM,wBAAwB,GAAG;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE;QACP,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,MAAM,CAAC,EAAE,iBAAiB,CAAC,QAAQ,CAAC,CAAC;QACrC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;KACtB,CAAC;IACF,SAAS,CAAC,EAAE,4BAA4B,CAAC;IACzC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AA4BF,iBAAS,mBAAmB,CAAC,EAC3B,KAAK,EACL,QAAQ,EACR,MAAM,EACN,SAA8B,EAC9B,SAAS,GACV,EAAE,wBAAwB,+BAyB1B;AAED,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"CriticalCommsBanner.d.ts","sourceRoot":"","sources":["../../../src/criticalBanner/CriticalCommsBanner.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAItC,MAAM,MAAM,4BAA4B,GACpC,GAAG,SAAS,CAAC,OAAO,EAAE,GACtB,GAAG,SAAS,CAAC,QAAQ,EAAE,GACvB,GAAG,SAAS,CAAC,OAAO,EAAE,CAAC;AAE3B,MAAM,MAAM,wBAAwB,GAAG;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE;QACP,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;KACtB,CAAC;IACF,SAAS,CAAC,EAAE,4BAA4B,CAAC;IACzC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AA4BF,iBAAS,mBAAmB,CAAC,EAC3B,KAAK,EACL,QAAQ,EACR,MAAM,EACN,SAA8B,EAC9B,SAAS,GACV,EAAE,wBAAwB,+BAiB1B;AAED,eAAe,mBAAmB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@transferwise/components",
-  "version": "0.0.0-experimental-1bc70dc",
+  "version": "0.0.0-experimental-cbe4279",
   "description": "Neptune React components",
   "license": "Apache-2.0",
   "repository": {
@@ -86,14 +86,12 @@
     "storybook": "^10.3.0-alpha.4",
     "storybook-addon-tag-badges": "^3.0.6",
     "storybook-addon-test-codegen": "^3.0.1",
-    "@transferwise/neptune-css": "14.26.3",
+    "@transferwise/less-config": "3.1.2",
     "@wise/components-theming": "1.10.1",
-    "@wise/wds-configs": "0.0.0",
-    "@transferwise/less-config": "3.1.2"
+    "@wise/wds-configs": "0.0.0"
   },
   "peerDependencies": {
     "@transferwise/icons": "^3 || ^4",
-    "@transferwise/neptune-css": "^14.26",
     "@wise/art": "^2.26",
     "@wise/components-theming": "^1.9.1",
     "framer-motion": "^12.23.26",
@@ -119,7 +117,8 @@
     "merge-props": "^6.0.0",
     "react-popper": "^2.3.0",
     "react-transition-group": "^4.4.5",
-    "virtua": "^0.48.5"
+    "virtua": "^0.48.5",
+    "@transferwise/neptune-tokens": "^8.16.0"
   },
   "publishConfig": {
     "access": "public",
@@ -139,6 +138,10 @@
     "build:copy-files": "cpx 'src/**/!(db)/*.{json,svg}' build",
     "build:copy-css": "cpx 'src/main.css' build/ & cpx 'src/**/*.css' build/styles/",
     "build:copy-lang": "cpx 'src/i18n/*.json' build/i18n && cpx 'src/i18n/index.js' build/i18n",
+    "build:neptune-css": "npm-run-all build:neptune-css:*",
+    "build:neptune-css:compile": "gulp compileLess --src='src/neptune-css/less' --dest=src && cpx 'src/neptune.css' build/",
+    "build:neptune-css:copy-vars": "gulp copyPropsAndVars --src='src/neptune-css/variables' --dest='build/neptune-css/less' && gulp copyPropsAndVars --src='src/neptune-css/props' --dest='build/neptune-css/props'",
+    "build:neptune-css:copy-brand-assets": "cpx 'src/neptune-css/img/**' build/neptune-css/img && cpx 'src/neptune-css/fonts/*' build/neptune-css/fonts",
     "docs": "pnpm build",
     "test": "TZ=UTC jest",
     "test:watch": "TZ=UTC jest --watch",

package/src/accordion/Accordion.less

@@ -1,6 +1,6 @@
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/variables/neptune-tokens.less";
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/less/mixins/_logical-properties.less";
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/less/core/_typography.less";
+@import (reference) "./../neptune-css/variables/neptune-tokens.less";
+@import (reference) "./../neptune-css/less/mixins/_logical-properties.less";
+@import (reference) "./../neptune-css/less/core/_typography.less";
 
 .np-accordion-item {
   display: block;

package/src/actionButton/ActionButton.less

@@ -1,4 +1,4 @@
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/less/ring.less";
+@import (reference) "./../neptune-css/less/ring.less";
 
 .np-action-btn {
   display: inline-flex;

package/src/alert/Alert.tsx

@@ -28,8 +28,6 @@ export type AlertAction = {
   target?: string;
   text: React.ReactNode;
   onClick?: () => void;
-  /** Controls the rendered element: `'link'` (default) renders a Link, `'button'` renders a Button. When `'button'` is used with `href`, renders an anchor styled as a button. */
-  as?: 'button' | 'link';
 };
 
 /** @deprecated Use `"top" | "bottom"` instead. */
@@ -233,7 +231,7 @@ export default function Alert({
               </Body>
             </div>
             {action &&
-              ('href' in action && action.as !== 'button' ? (
+              ('href' in action ? (
                 <Link
                   href={action.href}
                   aria-label={action['aria-label']}
@@ -248,9 +246,6 @@ export default function Alert({
               ) : (
                 <Button
                   v2
-                  as={action.href ? 'a' : 'button'}
-                  href={action.href}
-                  target={action.target}
                   size="sm"
                   sentiment="default"
                   aria-label={action['aria-label']}

package/src/avatar/Avatar.less

@@ -1,6 +1,6 @@
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/variables/neptune-tokens.less";
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/less/mixins/_logical-properties.less";
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/less/core/_typography.less";
+@import (reference) "./../neptune-css/variables/neptune-tokens.less";
+@import (reference) "./../neptune-css/less/mixins/_logical-properties.less";
+@import (reference) "./../neptune-css/less/core/_typography.less";
 
 @avatar-diameter-72: 72px;
 @avatar-diameter-56: 56px;

package/src/badge/Badge.less

@@ -1,4 +1,4 @@
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/less/mixins/_logical-properties.less";
+@import (reference) "./../neptune-css/less/mixins/_logical-properties.less";
 
 @badge-size-sm: 16px;
 @badge-size-lg: 24px;

package/src/button/LegacyButton.less

@@ -1,4 +1,4 @@
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/less/mixins/_logical-properties.less";
+@import (reference) "./../neptune-css/less/mixins/_logical-properties.less";
 
 .np-btn {
   position: relative;

package/src/card/Card.less

@@ -1,6 +1,6 @@
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/less/mixins/_logical-properties.less";
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/less/mixins/_theming.less";
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/less/ring.less";
+@import (reference) "./../neptune-css/less/mixins/_logical-properties.less";
+@import (reference) "./../neptune-css/less/mixins/_theming.less";
+@import (reference) "./../neptune-css/less/ring.less";
 
 .np-card {
   overflow: hidden;

package/src/checkboxButton/CheckboxButton.less

@@ -1,5 +1,5 @@
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/variables/neptune-tokens.less";
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/less/mixins/_logical-properties.less";
+@import (reference) "./../neptune-css/variables/neptune-tokens.less";
+@import (reference) "./../neptune-css/less/mixins/_logical-properties.less";
 
 .np-checkbox-button {
   input[type="checkbox"] {

package/src/chips/Chip.less

@@ -1,6 +1,6 @@
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/variables/neptune-tokens.less";
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/less/mixins/_logical-properties.less";
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/less/ring.less";
+@import (reference) "./../neptune-css/variables/neptune-tokens.less";
+@import (reference) "./../neptune-css/less/mixins/_logical-properties.less";
+@import (reference) "./../neptune-css/less/ring.less";
 
 .np-chip {
   background-color: transparent;

package/src/common/Option/Option.less

@@ -1,5 +1,5 @@
-@import (reference) "../../../node_modules/@transferwise/neptune-css/src/less/mixins/_logical-properties.less";
-@import (reference) "../../../node_modules/@transferwise/neptune-css/src/less/ring.less";
+@import (reference) "../../neptune-css/less/mixins/_logical-properties.less";
+@import (reference) "../../neptune-css/less/ring.less";
 
 .np-option {
   &:has(:focus-visible) {

package/src/common/bottomSheet/BottomSheet.less

@@ -1,4 +1,4 @@
-@import (reference) "../../../node_modules/@transferwise/neptune-css/src/less/mixins/_theming.less";
+@import (reference) "../../neptune-css/less/mixins/_theming.less";
 
 .np-bottom-sheet {
   border-radius: 10px 10px 0 0;

package/src/common/closeButton/CloseButton.less

@@ -1,4 +1,4 @@
-@import (reference) "../../../node_modules/@transferwise/neptune-css/src/less/ring.less";
+@import (reference) "../../neptune-css/less/ring.less";
 
 .np-close-button {
   transition: color 0.15s ease-in-out;

package/src/common/panel/Panel.less

@@ -1,4 +1,4 @@
-@import (reference) "../../../node_modules/@transferwise/neptune-css/src/less/mixins/_theming.less";
+@import (reference) "../../neptune-css/less/mixins/_theming.less";
 
 .np-panel {
   &__content {

package/src/criticalBanner/CriticalCommsBanner.less

@@ -34,19 +34,6 @@
     --Button-background: var(--color-background-screen);
     --Button-background-hover: var(--color-sentiment-interactive-primary-hover);
     --Button-background-active: var(--color-sentiment-interactive-primary-active);
-
-    // Override legacy neptune CSS selector `.np-theme-personal .alert-negative a`
-    &[class] {
-      color: var(--Button-color);
-
-      &:hover {
-        color: var(--Button-color-hover);
-      }
-
-      &:active {
-        color: var(--Button-color-active);
-      }
-    }
   }
 
   .alert-warning .wds-Button {

package/src/criticalBanner/CriticalCommsBanner.test.story.tsx

@@ -68,18 +68,3 @@ export const Zoom: Story = {
   },
   ...withVariantConfig(['400%']),
 };
-
-export const WithoutAction: Story = {
-  render: (args) => (
-    <>
-      <CriticalCommsBanner {...args} sentiment="negative" />
-      <CriticalCommsBanner {...args} sentiment="warning" />
-      <CriticalCommsBanner {...args} sentiment="neutral" />
-    </>
-  ),
-  args: {
-    subtitle: 'Add money within the next 30 days',
-    className: 'm-b-1',
-  },
-  ...withVariantConfig(['default']),
-};

package/src/criticalBanner/CriticalCommsBanner.test.tsx

@@ -19,36 +19,10 @@ describe('CriticalCommsBanner', () => {
     expect(screen.getByTestId('alert')).toHaveClass('alert-negative');
   });
 
-  it('renders the action as a link with correct href', () => {
+  it('renders the action', () => {
     render(<CriticalCommsBanner {...defaultProps} />);
 
-    const action = screen.getByText('Take action');
-    expect(action.closest('a')).toHaveAttribute('href', 'https://wise.com');
-  });
-
-  it('renders the action as a button when only onClick is provided', () => {
-    const onClick = jest.fn();
-    render(<CriticalCommsBanner title="Test title" action={{ label: 'Take action', onClick }} />);
-
-    expect(screen.getByText('Take action').closest('button')).toBeInTheDocument();
-  });
-
-  it('passes target to the action link', () => {
-    render(
-      <CriticalCommsBanner
-        {...defaultProps}
-        action={{ label: 'Take action', href: 'https://wise.com', target: '_blank' }}
-      />,
-    );
-
-    expect(screen.getByText('Take action').closest('a')).toHaveAttribute('target', '_blank');
-  });
-
-  it('does not render the action when action is undefined', () => {
-    render(<CriticalCommsBanner title="Test title" />);
-
-    expect(screen.queryByRole('link')).not.toBeInTheDocument();
-    expect(screen.queryByRole('button')).not.toBeInTheDocument();
+    expect(screen.getByText('Take action')).toBeInTheDocument();
   });
 
   describe('sentiment variants', () => {

package/src/criticalBanner/CriticalCommsBanner.tsx

@@ -18,7 +18,6 @@ export type CriticalCommsBannerProps = {
   action?: {
     label: string;
     href?: string;
-    target?: HTMLAnchorElement['target'];
     onClick?: () => void;
   };
   sentiment?: CriticalCommsBannerSentiment;
@@ -67,15 +66,7 @@ function CriticalCommsBanner({
       <Alert
         title={title}
         message={subtitle}
-        action={
-          action && {
-            onClick: action.onClick,
-            href: action.href,
-            target: action.target,
-            text: action.label,
-            as: 'button',
-          }
-        }
+        action={{ onClick: action?.onClick, target: action?.href, text: action?.label }}
         className={className}
         type={sentiment}
         icon={iconBySentiment[sentiment]}

package/src/dateLookup/DateLookup.less

@@ -1,4 +1,4 @@
-@import (reference) "../../node_modules/@transferwise/neptune-css/src/variables/neptune-tokens.less";
+@import (reference) "./../neptune-css/variables/neptune-tokens.less";
 
 .tw-date-lookup-menu {
   width: 400px;

package/src/dateLookup/dateTrigger/DateTrigger.less

@@ -1,5 +1,5 @@
-@import (reference) "../../../node_modules/@transferwise/neptune-css/src/variables/neptune-tokens.less";
-@import (reference) "../../../node_modules/@transferwise/neptune-css/src/less/mixins/_logical-properties.less";
+@import (reference) "../../neptune-css/variables/neptune-tokens.less";
+@import (reference) "../../neptune-css/less/mixins/_logical-properties.less";
 
 .np-date-trigger {
   overflow: hidden;