@trackunit/ui-design-tokens 0.0.56 → 0.0.58

package/index.js

@@ -426,6 +426,21 @@ const rentalStatusPalette = {
     IN_REPAIR: { 100: "255 233 233", 600: "255 90 90" },
     OTHER_RENTAL_STATUS: { 100: "238 239 239", 600: "151 154 154" },
 };
+/**
+ * Colors of the different site types.
+ *
+ * The generator has an issue with underscores in variant names, which is why they are not used below.
+ */
+const sitesPalette = {
+    SITE: {
+        AREA: tailwindPalette.blue["600"],
+        CLASSIC_POI: tailwindPalette.neutral["500"],
+        CLASSIC_ZONE: tailwindPalette.neutral["500"],
+        DEPOT: tailwindPalette.violet["600"],
+        WORK_PLACE: tailwindPalette.emerald["500"],
+        CONSTRUCTION_SITE: tailwindPalette.amber["500"],
+    },
+};
 /**
  * Grouped Theme Colors
  */
@@ -442,11 +457,13 @@ const groupedPalettes = {
     UTILIZATION: utilizationPalette,
     // Rental
     RENTAL: rentalStatusPalette,
+    // Sites
+    SITES: sitesPalette,
 };
 /**
  * The full theme color palette (flattened)
  */
-const trackunitPalette = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, generalPalette), intentPalette), criticalityPalette), activityPalette), utilizationPalette), rentalStatusPalette);
+const trackunitPalette = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, generalPalette), intentPalette), criticalityPalette), activityPalette), utilizationPalette), rentalStatusPalette), sitesPalette);
 
 /**
  * A collection of all the tokens related to the named colors in the default theme.
@@ -485,6 +502,7 @@ const themeColors = {
     PICKUP_READY: { name: "pickup_ready", variants: trackunitPalette.PICKUP_READY },
     RETURNED: { name: "returned", variants: trackunitPalette.RETURNED },
     TRANSFER: { name: "transfer", variants: trackunitPalette.TRANSFER },
+    SITE: { name: "site", variants: trackunitPalette.SITE },
 };
 
 const outputOptions = ["HEX", "CSS"];
@@ -507,11 +525,12 @@ function color(ColorKey, arg2, arg3) {
             variant = arg2;
         }
     }
+    const variableName = `--color-${colorName}-${String(variant)}`.replace(/[^a-zA-Z0-9]/g, "-");
     if (output === "CSS") {
-        return colorVariableToCss(`--color-${colorName}-${String(variant)}`);
+        return colorVariableToCss(variableName);
     }
-    if (output === "HEX") {
-        return getHEX(`--color-${colorName}-${String(variant)}`);
+    else if (output === "HEX") {
+        return getHEX(variableName);
     }
     return colorName;
 }
@@ -587,4 +606,4 @@ const tokens = {
     fontFamily: `'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif`,
 };
 
-export { DEFAULT_CHART_COLORS, activityPalette, color, criticalityPalette, elevation, fontSize, fontWeight, generalPalette, getReorderedChartColors, groupedPalettes, intentPalette, rentalStatusPalette, tailwindPalette, themeColors, tokens, trackunitPalette, utilizationPalette };
+export { DEFAULT_CHART_COLORS, activityPalette, color, criticalityPalette, elevation, fontSize, fontWeight, generalPalette, getReorderedChartColors, groupedPalettes, intentPalette, rentalStatusPalette, sitesPalette, tailwindPalette, themeColors, tokens, trackunitPalette, utilizationPalette };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/ui-design-tokens",
-  "version": "0.0.56",
+  "version": "0.0.58",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "module": "./index.js",

package/src/tokens/colors/trackunitPalette.d.ts

@@ -302,6 +302,23 @@ export declare const rentalStatusPalette: {
  */
 export type RentalStatusColorKeys = keyof typeof rentalStatusPalette;
 export type RentalStatusColors = `${Lowercase<RentalStatusColorKeys>}`;
+/**
+ * Colors of the different site types.
+ *
+ * The generator has an issue with underscores in variant names, which is why they are not used below.
+ */
+export declare const sitesPalette: {
+    readonly SITE: {
+        readonly AREA: "37 99 235";
+        readonly CLASSIC_POI: "115 115 115";
+        readonly CLASSIC_ZONE: "115 115 115";
+        readonly DEPOT: "124 58 237";
+        readonly WORK_PLACE: "16 185 129";
+        readonly CONSTRUCTION_SITE: "245 158 11";
+    };
+};
+export type SitesColorKeys = keyof typeof sitesPalette;
+export type SitesColors = `${Lowercase<SitesColorKeys>}`;
 /**
  * Grouped Theme Colors
  */
@@ -550,11 +567,29 @@ export declare const groupedPalettes: {
             readonly 600: "151 154 154";
         };
     };
+    readonly SITES: {
+        readonly SITE: {
+            readonly AREA: "37 99 235";
+            readonly CLASSIC_POI: "115 115 115";
+            readonly CLASSIC_ZONE: "115 115 115";
+            readonly DEPOT: "124 58 237";
+            readonly WORK_PLACE: "16 185 129";
+            readonly CONSTRUCTION_SITE: "245 158 11";
+        };
+    };
 };
 /**
  * The full theme color palette (flattened)
  */
 export declare const trackunitPalette: {
+    readonly SITE: {
+        readonly AREA: "37 99 235";
+        readonly CLASSIC_POI: "115 115 115";
+        readonly CLASSIC_ZONE: "115 115 115";
+        readonly DEPOT: "124 58 237";
+        readonly WORK_PLACE: "16 185 129";
+        readonly CONSTRUCTION_SITE: "245 158 11";
+    };
     readonly ON_RENT: {
         readonly 100: "223 244 254";
         readonly 600: "90 200 250";