@trackunit/ui-design-tokens 0.0.50 → 0.0.52

package/index.js

@@ -1,5 +1,6 @@
 const DEFAULT_CHART_COLORS = ["#2580C7", "#36A2DA", "#3FBCEA", "#06708D", "#01B7A9", "#A2DEDA", "#F9E9A0", "#FDD008", "#FBB385", "#FF7373", "#E6BCF3", "#9D96F5", "#8378EA", "#96BFFF", "#979A9A", "#0065E5", "#FF5A5A", "#00A658", "#5AC8fA", "#5E5CE6", "#2066FF", "#FF9500"];
-const getReorderedChartColors = () => [// re-ordered to make the first ones more visually different
+const getReorderedChartColors = () => [
+// re-ordered to make the first ones more visually different
 DEFAULT_CHART_COLORS[0], DEFAULT_CHART_COLORS[4], DEFAULT_CHART_COLORS[7], DEFAULT_CHART_COLORS[9], DEFAULT_CHART_COLORS[12], DEFAULT_CHART_COLORS[5], DEFAULT_CHART_COLORS[6], DEFAULT_CHART_COLORS[8], DEFAULT_CHART_COLORS[10], DEFAULT_CHART_COLORS[1], DEFAULT_CHART_COLORS[11], DEFAULT_CHART_COLORS[3], DEFAULT_CHART_COLORS[2], DEFAULT_CHART_COLORS[13]];
 
 /**
@@ -21,16 +22,13 @@ function componentToHex(c) {
   if (c === null || c === undefined) {
     return "00";
   }
-
   const hex = c.toString(16);
   return hex.length === 1 ? "0" + hex : hex;
 }
-
 function rgbToHex(r, g, b) {
   if (isNaN(r) || isNaN(g) || isNaN(b)) {
     return "#000000";
   }
-
   return "#" + componentToHex(r) + componentToHex(g) + componentToHex(b);
 }
 /**
@@ -42,11 +40,8 @@ function rgbToHex(r, g, b) {
  * @param variable A color from the `colors` object of the Theme
  * @returns HEX color
  */
-
-
 const getHEX = variable => {
   var _a, _b;
-
   const regex = /rgb\(var\((.*?)\) \/ var\(--tw-bg-opacity\)\)/g;
   const root = document.documentElement;
   const match = regex.exec(variable);
@@ -330,7 +325,6 @@ const tailwindPalette = {
  * The general color palette
  * Should be available in most if not all colored components
  */
-
 const generalPalette = {
   PRIMARY: tailwindPalette.blue,
   SECONDARY: tailwindPalette.slate,
@@ -347,7 +341,6 @@ const generalPalette = {
  * The intent color palette
  * Should be available for most colored components such as "Button", "Alert", "Indicator", "Badge"
  */
-
 const intentPalette = {
   INFO: tailwindPalette.blue,
   SUCCESS: tailwindPalette.green,
@@ -358,7 +351,6 @@ const intentPalette = {
  * The Criticality color palette
  * Should be available in any component that could be used to display the criticality of an asset or event
  */
-
 const criticalityPalette = {
   GOOD: tailwindPalette.emerald,
   LOW: tailwindPalette.amber,
@@ -368,7 +360,6 @@ const criticalityPalette = {
  * The Activity color palette
  * Should be available in any component that could be used to display the Activity state of an asset
  */
-
 const activityPalette = {
   WORKING: tailwindPalette.blue,
   IDLE: tailwindPalette.orange,
@@ -385,7 +376,6 @@ const activityPalette = {
  * The Rental status color palette
  * Should be available in any component that could be used to display the rental status of an asset
  */
-
 const rentalStatusPalette = {
   ON_RENT: {
     100: "223 244 254",
@@ -419,7 +409,6 @@ const rentalStatusPalette = {
 /**
  * Grouped Theme Colors
  */
-
 const groupedPalettes = {
   // General
   GENERAL: generalPalette,
@@ -435,7 +424,6 @@ const groupedPalettes = {
 /**
  * The full theme color palette (flattened)
  */
-
 const trackunitPalette = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, generalPalette), intentPalette), criticalityPalette), activityPalette), rentalStatusPalette);
 
 /**
@@ -445,7 +433,6 @@ const trackunitPalette = Object.assign(Object.assign(Object.assign(Object.assign
  * An object of all the Trackunit Theme colors and their available variants.
  * These colors does not include the default tailwind colors.
  */
-
 const themeColors = {
   PRIMARY: {
     name: "primary",
@@ -558,42 +545,33 @@ const themeColors = {
 };
 
 const outputOptions = ["HEX", "CSS"];
-
 function color(ColorKey, arg2, arg3) {
   var _a, _b;
-
   const colorName = themeColors[ColorKey].name;
-  const colorVariants = themeColors[ColorKey].variants; // defaultVariant or 600 or the "middel" value available.
-
+  const colorVariants = themeColors[ColorKey].variants;
+  // defaultVariant or 600 or the "middel" value available.
   const defaultVariant = (_b = (_a = themeColors[ColorKey].defaultVariant) !== null && _a !== void 0 ? _a : colorVariants[600] && 600) !== null && _b !== void 0 ? _b : Object.keys(colorVariants)[Math.floor(Object.keys(colorVariants).length / 2)];
   let variant = defaultVariant;
   let output = "CSS";
-
   if (isOutputOption(arg2)) {
     output = arg2;
   } else {
     if (isOutputOption(arg3)) {
       output = arg3;
     }
-
     if (isValidVariant(colorVariants, arg2)) {
       variant = arg2;
     }
   }
-
   if (output === "CSS") {
     return colorVariableToCss(`--color-${colorName}-${String(variant)}`);
   }
-
   if (output === "HEX") {
     return getHEX(`--color-${colorName}-${String(variant)}`);
   }
-
   return colorName;
 }
-
 const isOutputOption = something => typeof something === "string" && outputOptions.includes(something);
-
 const isValidVariant = (availableVariants, something) => Boolean(availableVariants[something]);
 
 /**
@@ -612,25 +590,18 @@ const elevation = {
 const size = {
   /** --spacing-0: 0px; */
   none: "var(--spacing-0)",
-
   /** --spacing-1: 0.25rem; */
   tiny: "var(--spacing-1)",
-
   /** --spacing-2: 0.5rem; */
   mini: "var(--spacing-2)",
-
   /** --spacing-3: 0.75rem; */
   small: "var(--spacing-3)",
-
   /** --spacing-4: 1rem; */
   medium: "var(--spacing-4)",
-
   /** --spacing-6: 1.5rem; */
   large: "var(--spacing-6)",
-
   /** --spacing-8: 2rem; */
   giant: "var(--spacing-8)",
-
   /** --spacing-10: 2.5rem; */
   enormous: "var(--spacing-10)"
 };
@@ -645,12 +616,10 @@ const fontSize = {
   subtitle: "var(--font-size-base)",
   body: "var(--font-size-sm)",
   small: "var(--font-size-xs)" // 12px
-
 };
 /**
  * Primary font weights.
  */
-
 const fontWeight = {
   normal: 400,
   bold: 600

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@trackunit/ui-design-tokens",
-  "version": "0.0.50",
+  "version": "0.0.52",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "module": "./index.js",
   "main": "./index.js",
   "type": "module",
-  "types": "./index.d.ts"
+  "types": "./src/index.d.ts"
 }