@nice-digital/nds-core 1.2.11 → 1.3.0

package/lib/utils.js

@@ -1,7 +1,7 @@
 "use strict";
 
 exports.__esModule = true;
-exports["default"] = exports.camelCase = exports.nextUniqueId = exports.slugify = exports.debounce = exports.throttle = exports.trim = void 0;
+exports.trim = exports.throttle = exports.slugify = exports.nextUniqueId = exports["default"] = exports.debounce = exports.camelCase = void 0;
 
 /**
  * @module Utils

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@nice-digital/nds-core",
-	"version": "1.2.11",
+	"version": "1.3.0",
 	"description": "Core code for the NICE Design System",
 	"author": "Ian Routledge <ian.routledge@nice.org.uk>",
 	"contributors": [
@@ -35,7 +35,7 @@
 	"dependencies": {
 		"@nice-digital/icons": "^2.2.7",
 		"prop-types": "^15.7.2",
-		"sass-mq": "^5.0.0"
+		"sass-mq": "^6.0.0"
 	},
 	"peerDependencies": {
 		"react": "^16 || ^17",
@@ -44,5 +44,5 @@
 	"devDependencies": {
 		"@babel/cli": "^7.5.0"
 	},
-	"gitHead": "6507bf955411adbcfdd4ddabe739125dd18dfd16"
+	"gitHead": "0ab9f6e7e5ca7d38e2e6de672772d12d5feb2465"
 }

package/scss/helpers/_helpers-utils.scss

@@ -6,8 +6,10 @@
 /// @param {Number} $num The number whose units you wish to strip.
 /// @since 0.2.0
 /// @link https://davidtheclark.github.io/scut/strip-unit.html
+@use "sass:math";
+
 @function nds-strip-unit($num) {
-  @return $num / ($num * 0 + 1);
+  @return math.div($num, $num * 0 + 1);
 }
 
 /// Convert pixel-values to em-values.
@@ -25,7 +27,7 @@
   $em-vals: ();
 
   @each $val in $pixels {
-    $val-in-ems: (nds-strip-unit($val) / $divisor) * 1em;
+    $val-in-ems: math.div(nds-strip-unit($val), $divisor) * 1em;
     $em-vals: append($em-vals, $val-in-ems);
   }
 
@@ -46,7 +48,7 @@
 @function rem($pixels, $base: $nds-base-font-size) {
   $rem-vals: ();
   @each $val in $pixels {
-    $val-in-rems: nds-strip-unit($val) / $base * 1rem;
+    $val-in-rems: math.div(nds-strip-unit($val), $base) * 1rem;
     $rem-vals: append($rem-vals, $val-in-rems);
   }
 

package/scss/settings/_settings-colours-semantic.scss

@@ -187,36 +187,36 @@ $nds-colour-beta: #bd5826;
 $nds-colour-live: #578137;
 
 /// Error text and border colour
-/// @since 0.2.0
-$nds-colour-error: #ae0e1e;
+/// @since 1.7.0
+$nds-colour-error: #b50f23;
 
 /// Error background colour
-/// @since 0.2.0
-$nds-colour-error-background: #eac3c3;
+/// @since 1.7.0
+$nds-colour-error-background: #f9eced;
 
 /// Caution text and border colour
-/// @since 0.2.0
-$nds-colour-caution: #835f24;
+/// @since 1.7.0
+$nds-colour-caution: #dc8a07;
 
 /// Caution background colour
-/// @since 0.2.0
-$nds-colour-caution-background: #ffdfa4;
+/// @since 1.7.0
+$nds-colour-caution-background: #fbf7f1;
 
 /// Info text and border colour
-/// @since 0.2.0
-$nds-colour-info: #497b94;
+/// @since 1.7.0
+$nds-colour-info: #3479d0;
 
 /// Info background colour
-/// @since 0.2.0
-$nds-colour-info-background: #e6faff;
+/// @since 1.7.0
+$nds-colour-info-background: #eff4fc;
 
 /// Success text and border colour
-/// @since 0.2.0
-$nds-colour-success: #3b8458;
+/// @since 1.7.0
+$nds-colour-success: #68c103;
 
 /// Success background colour
-/// @since 0.2.0
-$nds-colour-success-background: #eff7eb;
+/// @since 1.7.0
+$nds-colour-success-background: #f3faeb;
 
 /// <mark> tag highlighter colour
 /// @since 1.2.4

package/scss/settings/_settings-layout.scss

@@ -9,3 +9,7 @@ $nds-container-max-width: 1170;
 /// The gutter for the default container
 /// @since 1.0.0
 $nds-container-gutter: $nds-spacing-medium;
+
+/// The maximum content width to ensure good readability
+/// @since 1.7.0
+$nds-readable-width: 66ch;

package/scss/settings/_settings-modular-scale.scss

@@ -1,3 +1,5 @@
+@use "sass:math";
+
 /// Modular scale values
 /// @link http://www.modularscale.com/
 /// @prop {Number} golden [1.618034]
@@ -19,22 +21,22 @@
 /// @since 0.1.0
 $nds-scales: (
   golden: 1.618034,
-  double-octave: 4 / 1,
-  major-twelfth: 3 / 1,
-  major-eleventh: 8 / 3,
-  major-tenth: 5 / 2,
-  octave: 2 / 1,
-  major-seventh: 15 / 8,
-  minor-seventh: 16 / 9,
-  major-sixth: 5 / 3,
-  minor-sixth: 8 / 5,
-  fifth: 3 / 2,
-  augmented-fourth: sqrt(2) / 1,
-  fourth: 4 / 3,
-  major-third: 5 / 4,
-  minor-third: 6 / 5,
-  major-second: 9 / 8,
-  minor-second: 16 / 15
+  double-octave: 4,
+  major-twelfth: 3,
+  major-eleventh: math.div(8, 3),
+  major-tenth: math.div(5, 2),
+  octave: 2,
+  major-seventh: math.div(1, 8),
+  minor-seventh: math.div(1, 9),
+  major-sixth: math.div(5, 3),
+  minor-sixth: math.div(8, 5),
+  fifth: math.div(3, 2),
+  augmented-fourth: math.sqrt(2),
+  fourth: math.div(4, 3),
+  major-third: math.div(5, 4),
+  minor-third: math.div(6, 5),
+  major-second: math.div(9, 8),
+  minor-second: 1
 );
 
 /// Gets a module scale ratio with the given name. Looks

package/scss/typography/_typography-headings.scss

@@ -8,8 +8,11 @@
 @mixin nds-h1 {
   @include nds-font(h1);
   clear: both;
-  font-weight: 900;
+  font-weight: 700;
+  // Letter spacing and text shadow to mimic 900 weight, see https://github.com/nice-digital/nice-design-system/issues/240
+  letter-spacing: 0.5px;
   max-width: 66ch;
+  text-shadow: 1.5px 0 0 currentColor;
 }
 
 /// Secondary heading. Used for h2 tag but can be used directly

package/scss/vendor/_vendor-math.scss

@@ -1,3 +1,5 @@
+@use "sass:math";
+
 @function power ($x, $n) {
     $ret: 1;
 
@@ -7,7 +9,7 @@
         }
     } @else {
         @for $i from $n to 0 {
-            $ret: $ret / $x;
+            $ret: math.div($ret, $x);
         }
     }
 
@@ -32,7 +34,7 @@
     $ret: 0;
 
     @for $n from 0 to 25 {
-        $ret: $ret + power(-1, $n) * power($x, 2 * $n + 1) / factorial(2 * $n + 1);
+        $ret: $ret + math.div(power(-1, $n) * power($x, 2 * $n + 1), factorial(2 * $n + 1));
     }
 
     @return $ret;
@@ -42,7 +44,7 @@
     $ret: 0;
 
     @for $n from 0 to 25 {
-        $ret: $ret + power(-1, $n) * power($x, 2 * $n) / factorial(2 * $n);
+        $ret: $ret + math.div(power(-1, $n) * power($x, 2 * $n), factorial(2 * $n));
     }
 
     @return $ret;
@@ -52,7 +54,7 @@
     $ret: 0;
 
     @for $n from 0 to 25 {
-        $ret: $ret + power($x, $n) / factorial($n);
+        $ret: $ret + math.div(power($x, $n), factorial($n));
     }
 
     @return $ret;
@@ -64,7 +66,7 @@
     $dx: .001;
 
     @while $n <= $x {
-        $ret: $ret + $dx / $n;
+        $ret: $ret + math.div($dx, $n);
 
         $n: $n + $dx;
     }