@operational/utils - npm Package Compare versions

Comparing version 0.1.0-12 to 0.1.0-13

lib/color.d.ts

@@ -1,7 +0,6 @@
-declare const hexOrColor: (color: string) => (fallback: string) => string;
-declare const readableTextColor: (background: string) => (workingColors: string[]) => string;
-declare const darken: (color: string) => (percentage: number) => string;
-declare const lighten: (color: string) => (percentage: number) => string;
-declare const setBrightness: (color: string, targetBrightness: number) => string;
-declare const transparentize: (color: string) => (percentage: number) => string;
-export { hexOrColor, readableTextColor, darken, lighten, transparentize, setBrightness };
+export declare const readableTextColor: (backgroundColor: string, workingColors: string[]) => string;
+export declare const darken: (color: string, percentage: number) => string;
+export declare const lighten: (color: string, percentage: number) => string;
+export declare const getBrightness: (color: string) => number;
+export declare const setBrightness: (color: string, targetBrightness: number) => string;
+export declare const transparentize: (color: string) => (percentage: number) => string;

lib/color.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 var colorCalculator = require("tinycolor2");
-var hexOrColor = function (color) {
-    /*
-        Allow for named colors from the theme, AND hex codes.
-        Test for #f00b4r, or just #foo. If it doesn't match,
-        check for a named color in the theme.
-  
-        Usage: hexOrColor("MY COLOR LOL")("#foob47") where the
-        first argument is a string that could possibly be a hex code.
-        If it IS a hex code, use it. If not, use the hex code in the
-        returned function.
-      */
-    var hexRegEx = /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i;
-    var isColorACodeOrHex = hexRegEx.test(color);
-    return function (fallback) { return (isColorACodeOrHex ? color : fallback); };
-};
-exports.hexOrColor = hexOrColor;
 var getBrightestColor = function (colors) {
@@ -28,4 +12,4 @@ return colors.reduce(function (acc, curr) {
 };
-var readableTextColor = function (background) { return function (workingColors) {
-    var backgroundHsl = colorCalculator(background).toHsl();
+exports.readableTextColor = function (backgroundColor, workingColors) {
+    var backgroundHsl = colorCalculator(backgroundColor).toHsl();
     var workingColorHsls = workingColors.map(function (color) { return colorCalculator(color).toHsl(); });
@@ -36,25 +20,24 @@ // For reasonably saturated colors on the bright side, still pick the lightest color.
     }
-    return colorCalculator.mostReadable(background, workingColors).toHexString();
-}; };
-exports.readableTextColor = readableTextColor;
-var darken = function (color) { return function (percentage) {
+    return colorCalculator.mostReadable(backgroundColor, workingColors).toHexString();
+};
+exports.darken = function (color, percentage) {
     return colorCalculator(color)
         .darken(percentage)
         .toString();
-}; };
-exports.darken = darken;
-var lighten = function (color) { return function (percentage) {
+};
+exports.lighten = function (color, percentage) {
     return colorCalculator(color)
         .lighten(percentage)
         .toString();
-}; };
-exports.lighten = lighten;
-// @todo -> Flush out edge cases. Currently, this method only works well for regular common accent colors such as blue or green.
-var setBrightness = function (color, targetBrightness) {
+};
+exports.getBrightness = function (color) {
     var c = colorCalculator(color);
+    return c.getBrightness();
+};
+exports.setBrightness = function (color, targetBrightness) {
+    var c = colorCalculator(color);
     var brightness = c.getBrightness();
     return c.brighten(targetBrightness / brightness * 100 - 100).toString();
 };
-exports.setBrightness = setBrightness;
-var transparentize = function (color) { return function (percentage) {
+exports.transparentize = function (color) { return function (percentage) {
     return (function (_a) {
@@ -65,3 +48,2 @@ var r = _a.r, g = _a.g, b = _a.b;
 }; };
-exports.transparentize = transparentize;
 //# sourceMappingURL=color.js.map

lib/index.d.ts

@@ -1,5 +0,4 @@
-import { fadeIn, resetTransform, spin, baseStylesheet, injectStylesheet } from "./styles";
-import { hexOrColor, readableTextColor, darken, lighten, transparentize, setBrightness } from "./color";
-import { handleWithD3Element } from "./d3";
-import { wrapTheme } from "./theme";
-export { baseStylesheet, darken, fadeIn, handleWithD3Element, hexOrColor, injectStylesheet, lighten, readableTextColor, resetTransform, setBrightness, spin, transparentize, wrapTheme };
+export { fadeIn, resetTransform, spin, baseStylesheet, injectStylesheet } from "./styles";
+export { readableTextColor, darken, lighten, transparentize, setBrightness, getBrightness } from "./color";
+export { handleWithD3Element } from "./d3";
+export { wrapTheme } from "./theme";

lib/index.js

@@ -10,3 +10,2 @@ "use strict";
 var color_1 = require("./color");
-exports.hexOrColor = color_1.hexOrColor;
 exports.readableTextColor = color_1.readableTextColor;
@@ -17,2 +16,3 @@ exports.darken = color_1.darken;
 exports.setBrightness = color_1.setBrightness;
+exports.getBrightness = color_1.getBrightness;
 var d3_1 = require("./d3");
@@ -19,0 +19,0 @@ exports.handleWithD3Element = d3_1.handleWithD3Element;

lib/styles.js

@@ -10,3 +10,3 @@ "use strict";
     var styleEl = document.createElement("style");
-    styleEl.innerText = cssString;
+    styleEl.innerHTML = cssString;
     document.head.appendChild(styleEl);
@@ -13,0 +13,0 @@ };

lib/theme.d.ts

@@ -1,2 +0,1 @@
-declare const wrapTheme: (theme: any) => (Comp: any) => any;
-export { wrapTheme };
+export declare const wrapTheme: (theme: any) => (Comp: any) => any;

lib/theme.js

@@ -15,7 +15,6 @@ "use strict";
 // Contiamo theme is always available. Props are passed along unaltered.
-var wrapTheme = function (theme) { return function (Comp) {
+exports.wrapTheme = function (theme) { return function (Comp) {
     return function (props) { return (React.createElement(glamorous_1.ThemeProvider, { theme: theme },
         React.createElement(Comp, __assign({}, props)))); };
 }; };
-exports.wrapTheme = wrapTheme;
 //# sourceMappingURL=theme.js.map

package.json

 {
   "name": "@operational/utils",
-  "version": "0.1.0-12",
+  "version": "0.1.0-13",
   "description": "A collection of utilities used within the Contiamo UI suite",
@@ -25,3 +25,3 @@ "main": "./lib/index.js",
   "dependencies": {
-    "@operational/theme": "^0.1.0-12",
+    "@operational/theme": "^0.1.0-13",
     "glamor": "^2.20.40",
@@ -28,0 +28,0 @@ "glamorous": "^4.9.7",

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

Worsened metrics

Total package byte prevSize

13886

decreased by-9.92%

Lines of code

157

decreased by-11.8%

Dependency changes

• Updated@operational/theme@^0.1.0-13