@guardian/src-foundations - npm Package Compare versions

Comparing version 0.10.0 to 0.11.0

accessibility/index.js

@@ -169,3 +169,3 @@ 'use strict';
   ctaSecondaryHover: "#ACC9F7",
-  radioChecked: brand.main,
+  radioChecked: brand.bright,
   checkboxChecked: brand.bright,
@@ -215,3 +215,3 @@ mono: {
   radio: neutral[60],
-  radioHover: brand.main,
+  radioHover: brand.bright,
   textInput: neutral[60],
@@ -223,4 +223,4 @@ checkbox: neutral[60],
     error: error.bright,
-    radio: neutral[100],
-    radioHover: brand.faded
+    radio: brand.faded,
+    radioHover: neutral[100]
   },
@@ -227,0 +227,0 @@ readerRevenue: {

foundations.esm.js

@@ -190,3 +190,3 @@ // e.g. for sport:
   ctaSecondaryHover: "#ACC9F7",
-  radioChecked: brand.main,
+  radioChecked: brand.bright,
   checkboxChecked: brand.bright,
@@ -236,3 +236,3 @@ mono: {
   radio: neutral[60],
-  radioHover: brand.main,
+  radioHover: brand.bright,
   textInput: neutral[60],
@@ -244,4 +244,4 @@ checkbox: neutral[60],
     error: error.bright,
-    radio: neutral[100],
-    radioHover: brand.faded
+    radio: brand.faded,
+    radioHover: neutral[100]
   },
@@ -248,0 +248,0 @@ readerRevenue: {

foundations.js

@@ -194,3 +194,3 @@ 'use strict';
   ctaSecondaryHover: "#ACC9F7",
-  radioChecked: brand.main,
+  radioChecked: brand.bright,
   checkboxChecked: brand.bright,
@@ -240,3 +240,3 @@ mono: {
   radio: neutral[60],
-  radioHover: brand.main,
+  radioHover: brand.bright,
   textInput: neutral[60],
@@ -248,4 +248,4 @@ checkbox: neutral[60],
     error: error.bright,
-    radio: neutral[100],
-    radioHover: brand.faded
+    radio: brand.faded,
+    radioHover: neutral[100]
   },
@@ -252,0 +252,0 @@ readerRevenue: {

package.json

 {
 	"name": "@guardian/src-foundations",
-	"version": "0.10.0",
+	"version": "0.11.0",
 	"main": "foundations.js",
@@ -5,0 +5,0 @@ "module": "foundations.esm.js",

src/palette.ts

@@ -117,3 +117,3 @@ import { colors } from "./theme"
 	ctaSecondaryHover: "#ACC9F7",
-	radioChecked: brand.main,
+	radioChecked: brand.bright,
 	checkboxChecked: brand.bright,
@@ -163,3 +163,3 @@ mono: {
 	radio: neutral[60],
-	radioHover: brand.main,
+	radioHover: brand.bright,
 	textInput: neutral[60],
@@ -171,4 +171,4 @@ checkbox: neutral[60],
 		error: error.bright,
-		radio: neutral[100],
-		radioHover: brand.faded,
+		radio: brand.faded,
+		radioHover: neutral[100],
 	},
@@ -175,0 +175,0 @@ readerRevenue: {

src/themes/index.ts

@@ -5,1 +5,37 @@ export * from "./button"
 export * from "./text-input"
+
+import {
+	buttonLight,
+	buttonBrand,
+	buttonBrandYellow,
+	buttonReaderRevenue,
+	buttonReaderRevenueYellow,
+} from "./button"
+import { inlineErrorLight, inlineErrorBrand } from "./inline-error"
+import { radioLight, radioBrand } from "./radio"
+import { textInputLight } from "./text-input"
+
+export const light = {
+	...buttonLight,
+	...inlineErrorLight,
+	...radioLight,
+	...textInputLight,
+}
+
+export const brand = {
+	...buttonBrand,
+	...inlineErrorBrand,
+	...radioBrand,
+}
+
+export const brandYellow = {
+	...buttonBrandYellow,
+}
+
+export const readerRevenue = {
+	...buttonReaderRevenue,
+}
+
+export const readerRevenueYellow = {
+	...buttonReaderRevenueYellow,
+}

src/themes/radio.ts

@@ -37,4 +37,4 @@ import { palette } from "../index"
 	radio: {
-		borderHover: palette.border.radioHover,
-		border: palette.border.radio,
+		borderHover: palette.border.brand.radioHover,
+		border: palette.border.brand.radio,
 		backgroundChecked: palette.background.brand.radioChecked,
@@ -41,0 +41,0 @@ text: palette.text.brand.primary,

themes/index.d.ts

@@ -5,1 +5,21 @@ export * from "./button";
 export * from "./text-input";
+export declare const light: {
+    textInput: import("./text-input").TextInputTheme;
+    inlineError: import("./inline-error").InlineErrorTheme;
+    radio: import("./radio").RadioTheme;
+    button: import("./button").ButtonTheme;
+};
+export declare const brand: {
+    radio: import("./radio").RadioTheme;
+    inlineError: import("./inline-error").InlineErrorTheme;
+    button: import("./button").ButtonTheme;
+};
+export declare const brandYellow: {
+    button: import("./button").ButtonTheme;
+};
+export declare const readerRevenue: {
+    button: import("./button").ButtonTheme;
+};
+export declare const readerRevenueYellow: {
+    button: import("./button").ButtonTheme;
+};

themes/index.js

@@ -5,2 +5,51 @@ 'use strict';
 
+function _defineProperty(obj, key, value) {
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value: value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
+  }
+
+  return obj;
+}
+
+function ownKeys(object, enumerableOnly) {
+  var keys = Object.keys(object);
+
+  if (Object.getOwnPropertySymbols) {
+    var symbols = Object.getOwnPropertySymbols(object);
+    if (enumerableOnly) symbols = symbols.filter(function (sym) {
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+    });
+    keys.push.apply(keys, symbols);
+  }
+
+  return keys;
+}
+
+function _objectSpread2(target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i] != null ? arguments[i] : {};
+
+    if (i % 2) {
+      ownKeys(source, true).forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    } else if (Object.getOwnPropertyDescriptors) {
+      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+      ownKeys(source).forEach(function (key) {
+        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+      });
+    }
+  }
+
+  return target;
+}
+
 // e.g. for sport:
@@ -170,3 +219,3 @@ // const [dark, main, bright, pastel, faded] = colors.blue
   ctaSecondaryHover: "#ACC9F7",
-  radioChecked: brand.main,
+  radioChecked: brand.bright,
   checkboxChecked: brand.bright,
@@ -216,3 +265,3 @@ mono: {
   radio: neutral[60],
-  radioHover: brand.main,
+  radioHover: brand.bright,
   textInput: neutral[60],
@@ -224,4 +273,4 @@ checkbox: neutral[60],
     error: error.bright,
-    radio: neutral[100],
-    radioHover: brand.faded
+    radio: brand.faded,
+    radioHover: neutral[100]
   },
@@ -329,51 +378,2 @@ readerRevenue: {
 
-function _defineProperty(obj, key, value) {
-  if (key in obj) {
-    Object.defineProperty(obj, key, {
-      value: value,
-      enumerable: true,
-      configurable: true,
-      writable: true
-    });
-  } else {
-    obj[key] = value;
-  }
-
-  return obj;
-}
-
-function ownKeys(object, enumerableOnly) {
-  var keys = Object.keys(object);
-
-  if (Object.getOwnPropertySymbols) {
-    var symbols = Object.getOwnPropertySymbols(object);
-    if (enumerableOnly) symbols = symbols.filter(function (sym) {
-      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-    });
-    keys.push.apply(keys, symbols);
-  }
-
-  return keys;
-}
-
-function _objectSpread2(target) {
-  for (var i = 1; i < arguments.length; i++) {
-    var source = arguments[i] != null ? arguments[i] : {};
-
-    if (i % 2) {
-      ownKeys(source, true).forEach(function (key) {
-        _defineProperty(target, key, source[key]);
-      });
-    } else if (Object.getOwnPropertyDescriptors) {
-      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-    } else {
-      ownKeys(source).forEach(function (key) {
-        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-      });
-    }
-  }
-
-  return target;
-}
-
 var radioLight = _objectSpread2({
@@ -391,4 +391,4 @@ radio: {
   radio: {
-    borderHover: palette.border.radioHover,
-    border: palette.border.radio,
+    borderHover: palette.border.brand.radioHover,
+    border: palette.border.brand.radio,
     backgroundChecked: palette.background.brand.radioChecked,
@@ -409,2 +409,10 @@ text: palette.text.brand.primary,
 
+var light = _objectSpread2({}, buttonLight, {}, inlineErrorLight, {}, radioLight, {}, textInputLight);
+var brand$1 = _objectSpread2({}, buttonBrand, {}, inlineErrorBrand, {}, radioBrand);
+var brandYellow$1 = _objectSpread2({}, buttonBrandYellow);
+var readerRevenue = _objectSpread2({}, buttonReaderRevenue);
+var readerRevenueYellow = _objectSpread2({}, buttonReaderRevenueYellow);
+
+exports.brand = brand$1;
+exports.brandYellow = brandYellow$1;
 exports.button = button;
@@ -418,4 +426,7 @@ exports.buttonBrand = buttonBrand;
 exports.inlineErrorLight = inlineErrorLight;
+exports.light = light;
 exports.radioBrand = radioBrand;
 exports.radioLight = radioLight;
+exports.readerRevenue = readerRevenue;
+exports.readerRevenueYellow = readerRevenueYellow;
 exports.textInputLight = textInputLight;

No alert changes

Improved metrics

Total package byte prevSize

78705

increased by2.51%

Lines of code

2890

increased by2.12%

No dependency changes