@leafygreen-ui/palette - npm Package Compare versions

Comparing version 3.3.2 to 3.4.0

CHANGELOG.md

 # @leafygreen-ui/palette
 
+## 3.4.0
+
+### Minor Changes
+
+- 9ff90d4b: Adding gray-dark-4 to palette
+
+### Patch Changes
+
+- 6a89bc29: Changing export method for palette and uiColors ts objects
+- fd2f6de0: Updates to TSDocs, PropTypes, and Storybook files
+- 96d1ff9c: Updates to propTypes, TSDocs, and Storybook controls
+
 ## 3.3.2
@@ -4,0 +16,0 @@

dist/esm/index.js

@@ -1,2 +0,2 @@
-var F=Object.freeze({__proto__:null,white:"#FFFFFF",black:"#061621",focus:"#019EE2",gray:{dark3:"#21313C",dark2:"#3D4F58",dark1:"#5D6C74",base:"#89979B",light1:"#B8C4C2",light2:"#E7EEEC",light3:"#F9FBFA"},green:{dark3:"#0B3B35",dark2:"#116149",dark1:"#09804C",base:"#13AA52",light2:"#C3E7CA",light3:"#E4F4E4"},blue:{dark3:"#0D324F",dark2:"#1A567E",base:"#007CAD",light1:"#9DD0E7",light2:"#C5E4F2",light3:"#E1F2F6"},yellow:{dark3:"#543E07",dark2:"#86681D",base:"#FFDD49",light2:"#FEF2C8",light3:"#FEF7E3"},red:{dark3:"#570B08",dark2:"#8F221B",dark1:"#B1371F",base:"#CF4A22",light2:"#F9D3C5",light3:"#FCEBE2"}}),a=Object.freeze({__proto__:null,white:"#FFFFFF",black:"#001E2B",gray:{dark3:"#1C2D38",dark2:"#3D4F58",dark1:"#5C6C75",base:"#889397",light1:"#C1C7C6",light2:"#E8EDEB",light3:"#F9FBFA"},green:{dark3:"#023430",dark2:"#00684A",dark1:"#00A35C",base:"#00ED64",light1:"#71F6BA",light2:"#C0FAE6",light3:"#E3FCF7"},purple:{dark3:"#2D0B59",dark2:"#5E0C9E",base:"#B45AF2",light2:"#F1D4FD",light3:"#F9EBFF"},blue:{dark3:"#0C2657",dark2:"#083C90",dark1:"#1254B7",base:"#016BF8",light1:"#0498EC",light2:"#C3E7FE",light3:"#E1F7FF"},yellow:{dark3:"#4C2100",dark2:"#944F01",base:"#FFC010",light2:"#FFEC9E",light3:"#FEF7DB"},red:{dark3:"#5B0000",dark2:"#970606",base:"#DB3030",light1:"#EF5752",light2:"#FFCDC7",light3:"#FFEAE5"}});export{a as palette,F as uiColors};
+var F={white:"#FFFFFF",black:"#001E2B",gray:{dark4:"#112733",dark3:"#1C2D38",dark2:"#3D4F58",dark1:"#5C6C75",base:"#889397",light1:"#C1C7C6",light2:"#E8EDEB",light3:"#F9FBFA"},green:{dark3:"#023430",dark2:"#00684A",dark1:"#00A35C",base:"#00ED64",light1:"#71F6BA",light2:"#C0FAE6",light3:"#E3FCF7"},purple:{dark3:"#2D0B59",dark2:"#5E0C9E",base:"#B45AF2",light2:"#F1D4FD",light3:"#F9EBFF"},blue:{dark3:"#0C2657",dark2:"#083C90",dark1:"#1254B7",base:"#016BF8",light1:"#0498EC",light2:"#C3E7FE",light3:"#E1F7FF"},yellow:{dark3:"#4C2100",dark2:"#944F01",base:"#FFC010",light2:"#FFEC9E",light3:"#FEF7DB"},red:{dark3:"#5B0000",dark2:"#970606",base:"#DB3030",light1:"#EF5752",light2:"#FFCDC7",light3:"#FFEAE5"}},a={white:"#FFFFFF",black:"#061621",focus:"#019EE2",gray:{dark3:"#21313C",dark2:"#3D4F58",dark1:"#5D6C74",base:"#89979B",light1:"#B8C4C2",light2:"#E7EEEC",light3:"#F9FBFA"},green:{dark3:"#0B3B35",dark2:"#116149",dark1:"#09804C",base:"#13AA52",light2:"#C3E7CA",light3:"#E4F4E4"},blue:{dark3:"#0D324F",dark2:"#1A567E",base:"#007CAD",light1:"#9DD0E7",light2:"#C5E4F2",light3:"#E1F2F6"},yellow:{dark3:"#543E07",dark2:"#86681D",base:"#FFDD49",light2:"#FEF2C8",light3:"#FEF7E3"},red:{dark3:"#570B08",dark2:"#8F221B",dark1:"#B1371F",base:"#CF4A22",light2:"#F9D3C5",light3:"#FCEBE2"}};export{F as palette,a as uiColors};
 //# sourceMappingURL=index.js.map

dist/index.d.ts

@@ -1,6 +0,11 @@
-import * as uiColors from './uiColors';
+/**
+ * JS objects and less files containing colors used in Leafygreen.
+ *
+ * @packageDocumentation
+ */
+import palette from './palette';
+import './palette.less';
+import uiColors from './uiColors';
 import './ui-colors.less';
-import * as palette from './palette';
-import './palette.less';
 export { uiColors, palette };
 //# sourceMappingURL=index.d.ts.map

dist/index.js

@@ -1,2 +0,2 @@
-!function(e,F){"object"==typeof exports&&"undefined"!=typeof module?F(exports):"function"==typeof define&&define.amd?define(["exports"],F):F((e="undefined"!=typeof globalThis?globalThis:e||self)["@leafygreen-ui/palette"]={})}(this,(function(e){"use strict";var F=Object.freeze({__proto__:null,white:"#FFFFFF",black:"#061621",focus:"#019EE2",gray:{dark3:"#21313C",dark2:"#3D4F58",dark1:"#5D6C74",base:"#89979B",light1:"#B8C4C2",light2:"#E7EEEC",light3:"#F9FBFA"},green:{dark3:"#0B3B35",dark2:"#116149",dark1:"#09804C",base:"#13AA52",light2:"#C3E7CA",light3:"#E4F4E4"},blue:{dark3:"#0D324F",dark2:"#1A567E",base:"#007CAD",light1:"#9DD0E7",light2:"#C5E4F2",light3:"#E1F2F6"},yellow:{dark3:"#543E07",dark2:"#86681D",base:"#FFDD49",light2:"#FEF2C8",light3:"#FEF7E3"},red:{dark3:"#570B08",dark2:"#8F221B",dark1:"#B1371F",base:"#CF4A22",light2:"#F9D3C5",light3:"#FCEBE2"}}),t=Object.freeze({__proto__:null,white:"#FFFFFF",black:"#001E2B",gray:{dark3:"#1C2D38",dark2:"#3D4F58",dark1:"#5C6C75",base:"#889397",light1:"#C1C7C6",light2:"#E8EDEB",light3:"#F9FBFA"},green:{dark3:"#023430",dark2:"#00684A",dark1:"#00A35C",base:"#00ED64",light1:"#71F6BA",light2:"#C0FAE6",light3:"#E3FCF7"},purple:{dark3:"#2D0B59",dark2:"#5E0C9E",base:"#B45AF2",light2:"#F1D4FD",light3:"#F9EBFF"},blue:{dark3:"#0C2657",dark2:"#083C90",dark1:"#1254B7",base:"#016BF8",light1:"#0498EC",light2:"#C3E7FE",light3:"#E1F7FF"},yellow:{dark3:"#4C2100",dark2:"#944F01",base:"#FFC010",light2:"#FFEC9E",light3:"#FEF7DB"},red:{dark3:"#5B0000",dark2:"#970606",base:"#DB3030",light1:"#EF5752",light2:"#FFCDC7",light3:"#FFEAE5"}});e.palette=t,e.uiColors=F,Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(F,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((F="undefined"!=typeof globalThis?globalThis:F||self)["@leafygreen-ui/palette"]={})}(this,(function(F){"use strict";var e={white:"#FFFFFF",black:"#001E2B",gray:{dark4:"#112733",dark3:"#1C2D38",dark2:"#3D4F58",dark1:"#5C6C75",base:"#889397",light1:"#C1C7C6",light2:"#E8EDEB",light3:"#F9FBFA"},green:{dark3:"#023430",dark2:"#00684A",dark1:"#00A35C",base:"#00ED64",light1:"#71F6BA",light2:"#C0FAE6",light3:"#E3FCF7"},purple:{dark3:"#2D0B59",dark2:"#5E0C9E",base:"#B45AF2",light2:"#F1D4FD",light3:"#F9EBFF"},blue:{dark3:"#0C2657",dark2:"#083C90",dark1:"#1254B7",base:"#016BF8",light1:"#0498EC",light2:"#C3E7FE",light3:"#E1F7FF"},yellow:{dark3:"#4C2100",dark2:"#944F01",base:"#FFC010",light2:"#FFEC9E",light3:"#FEF7DB"},red:{dark3:"#5B0000",dark2:"#970606",base:"#DB3030",light1:"#EF5752",light2:"#FFCDC7",light3:"#FFEAE5"}},a={white:"#FFFFFF",black:"#061621",focus:"#019EE2",gray:{dark3:"#21313C",dark2:"#3D4F58",dark1:"#5D6C74",base:"#89979B",light1:"#B8C4C2",light2:"#E7EEEC",light3:"#F9FBFA"},green:{dark3:"#0B3B35",dark2:"#116149",dark1:"#09804C",base:"#13AA52",light2:"#C3E7CA",light3:"#E4F4E4"},blue:{dark3:"#0D324F",dark2:"#1A567E",base:"#007CAD",light1:"#9DD0E7",light2:"#C5E4F2",light3:"#E1F2F6"},yellow:{dark3:"#543E07",dark2:"#86681D",base:"#FFDD49",light2:"#FEF2C8",light3:"#FEF7E3"},red:{dark3:"#570B08",dark2:"#8F221B",dark1:"#B1371F",base:"#CF4A22",light2:"#F9D3C5",light3:"#FCEBE2"}};F.palette=e,F.uiColors=a,Object.defineProperty(F,"__esModule",{value:!0})}));
 //# sourceMappingURL=index.js.map

dist/palette.d.ts

 export declare const white = "#FFFFFF";
 export declare const black = "#001E2B";
 export declare const gray: {
+    readonly dark4: "#112733";
     readonly dark3: "#1C2D38";
@@ -52,2 +53,65 @@ readonly dark2: "#3D4F58";
 };
+/**
+ *
+ * Palette exports the latest colors used in designs following the brand refresh.
+ *
+ * If you are still using `uiColors`, refer to the [upgrade guide](https://github.com/mongodb/leafygreen-ui/blob/main/packages/palette/UPGRADE.md) for additional information.
+ *
+ * @public
+ */
+declare const palette: {
+    white: string;
+    black: string;
+    gray: {
+        readonly dark4: "#112733";
+        readonly dark3: "#1C2D38";
+        readonly dark2: "#3D4F58";
+        readonly dark1: "#5C6C75";
+        readonly base: "#889397";
+        readonly light1: "#C1C7C6";
+        readonly light2: "#E8EDEB";
+        readonly light3: "#F9FBFA";
+    };
+    green: {
+        readonly dark3: "#023430";
+        readonly dark2: "#00684A";
+        readonly dark1: "#00A35C";
+        readonly base: "#00ED64";
+        readonly light1: "#71F6BA";
+        readonly light2: "#C0FAE6";
+        readonly light3: "#E3FCF7";
+    };
+    purple: {
+        readonly dark3: "#2D0B59";
+        readonly dark2: "#5E0C9E";
+        readonly base: "#B45AF2";
+        readonly light2: "#F1D4FD";
+        readonly light3: "#F9EBFF";
+    };
+    blue: {
+        readonly dark3: "#0C2657";
+        readonly dark2: "#083C90";
+        readonly dark1: "#1254B7";
+        readonly base: "#016BF8";
+        readonly light1: "#0498EC";
+        readonly light2: "#C3E7FE";
+        readonly light3: "#E1F7FF";
+    };
+    yellow: {
+        readonly dark3: "#4C2100";
+        readonly dark2: "#944F01";
+        readonly base: "#FFC010";
+        readonly light2: "#FFEC9E";
+        readonly light3: "#FEF7DB";
+    };
+    red: {
+        readonly dark3: "#5B0000";
+        readonly dark2: "#970606";
+        readonly base: "#DB3030";
+        readonly light1: "#EF5752";
+        readonly light2: "#FFCDC7";
+        readonly light3: "#FFEAE5";
+    };
+};
+export default palette;
 //# sourceMappingURL=palette.d.ts.map

dist/uiColors.d.ts

@@ -44,2 +44,57 @@ export declare const white = "#FFFFFF";
 };
+/**
+ *
+ * uiColors exports colors used before the brand refresh. For an export of the latest colors, use `palette` instead.
+ *
+ * Refer to the [upgrade guide](https://github.com/mongodb/leafygreen-ui/blob/main/packages/palette/UPGRADE.md) for additional information.
+ *
+ * @deprecated
+ * @public
+ */
+declare const uiColors: {
+    white: string;
+    black: string;
+    focus: string;
+    gray: {
+        readonly dark3: "#21313C";
+        readonly dark2: "#3D4F58";
+        readonly dark1: "#5D6C74";
+        readonly base: "#89979B";
+        readonly light1: "#B8C4C2";
+        readonly light2: "#E7EEEC";
+        readonly light3: "#F9FBFA";
+    };
+    green: {
+        readonly dark3: "#0B3B35";
+        readonly dark2: "#116149";
+        readonly dark1: "#09804C";
+        readonly base: "#13AA52";
+        readonly light2: "#C3E7CA";
+        readonly light3: "#E4F4E4";
+    };
+    blue: {
+        readonly dark3: "#0D324F";
+        readonly dark2: "#1A567E";
+        readonly base: "#007CAD";
+        readonly light1: "#9DD0E7";
+        readonly light2: "#C5E4F2";
+        readonly light3: "#E1F2F6";
+    };
+    yellow: {
+        readonly dark3: "#543E07";
+        readonly dark2: "#86681D";
+        readonly base: "#FFDD49";
+        readonly light2: "#FEF2C8";
+        readonly light3: "#FEF7E3";
+    };
+    red: {
+        readonly dark3: "#570B08";
+        readonly dark2: "#8F221B";
+        readonly dark1: "#B1371F";
+        readonly base: "#CF4A22";
+        readonly light2: "#F9D3C5";
+        readonly light3: "#FCEBE2";
+    };
+};
+export default uiColors;
 //# sourceMappingURL=uiColors.d.ts.map

package.json

 {
   "name": "@leafygreen-ui/palette",
-  "version": "3.3.2",
+  "version": "3.4.0",
   "description": "LeafyGreen UI Palettes",
@@ -25,3 +25,11 @@ "main": "./dist/index.js",
   },
-  "gitHead": "dd71a2d404218ccec2e657df9c0263dc1c15b9e0"
-}
+  "gitHead": "dd71a2d404218ccec2e657df9c0263dc1c15b9e0",
+  "homepage": "https://github.com/mongodb/leafygreen-ui/tree/main/packages/palette",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/mongodb/leafygreen-ui"
+  },
+  "bugs": {
+    "url": "https://jira.mongodb.org/projects/PD/summary"
+  }
+}

src/index.ts

@@ -1,7 +0,13 @@
-import * as uiColors from './uiColors';
-import './ui-colors.less';
+/**
+ * JS objects and less files containing colors used in Leafygreen.
+ *
+ * @packageDocumentation
+ */
 
-import * as palette from './palette';
+import palette from './palette';
 import './palette.less';
 
+import uiColors from './uiColors';
+import './ui-colors.less';
+
 export { uiColors, palette };

src/palette.spec.ts

 import { palette } from '.';
 
 interface HueRange {
+  dark4?: string;
   dark3: string;
@@ -14,3 +15,3 @@ dark2?: string;
 const requiredKeys = new Set(['dark3', 'dark2', 'base', 'light2', 'light3']);
-const optionalKeys = new Set(['dark1', 'light1']);
+const optionalKeys = new Set(['dark4', 'dark1', 'light1']);
 
@@ -17,0 +18,0 @@ const allColors: Array<string | HueRange> = Object.values(palette);

src/palette.ts

@@ -5,2 +5,3 @@ export const white = '#FFFFFF';
 export const gray = {
+  dark4: '#112733',
   dark3: '#1C2D38',
@@ -59,1 +60,22 @@ dark2: '#3D4F58',
 } as const;
+
+/**
+ *
+ * Palette exports the latest colors used in designs following the brand refresh.
+ *
+ * If you are still using `uiColors`, refer to the [upgrade guide](https://github.com/mongodb/leafygreen-ui/blob/main/packages/palette/UPGRADE.md) for additional information.
+ *
+ * @public
+ */
+const palette = {
+  white,
+  black,
+  gray,
+  green,
+  purple,
+  blue,
+  yellow,
+  red,
+};
+
+export default palette;

src/uiColors.ts

@@ -49,1 +49,23 @@ export const white = '#FFFFFF';
 } as const;
+
+/**
+ *
+ * uiColors exports colors used before the brand refresh. For an export of the latest colors, use `palette` instead.
+ *
+ * Refer to the [upgrade guide](https://github.com/mongodb/leafygreen-ui/blob/main/packages/palette/UPGRADE.md) for additional information.
+ *
+ * @deprecated
+ * @public
+ */
+const uiColors = {
+  white,
+  black,
+  focus,
+  gray,
+  green,
+  blue,
+  yellow,
+  red,
+};
+
+export default uiColors;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No bug tracker

Maintenance

Package does not have a linked bug tracker in package.json.

Found 1 instance in 1 package

No repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.

Found 1 instance in 1 package

No website

Quality

Package does not have a website.

Found 1 instance in 1 package

Improved metrics

Lines of code

508

increased by53.47%

Number of low maintenance alerts

1

decreased by-50%

Number of low quality alerts

0

decreased by-100%

Number of low supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

77500

decreased by-58.6%

No dependency changes