@trackunit/ui-design-tokens 0.0.107 → 0.0.109

package/index.cjs.js

@@ -694,14 +694,23 @@ const elevation = {
 /**
  * A collection of all the tokens related to screen size in the theme.
  */
+const themeScreenSizeAsNumber = {
+    xs: 0,
+    sm: 480,
+    md: 768,
+    lg: 1024,
+    xl: 1200,
+    "2xl": 1600,
+    "3xl": 1900,
+};
 const themeScreenSize = {
-    xs: "0px",
-    sm: "480px",
-    md: "768px",
-    lg: "1024px",
-    xl: "1200px",
-    "2xl": "1600px",
-    "3xl": "1900px",
+    xs: `${themeScreenSizeAsNumber.xs}px`,
+    sm: `${themeScreenSizeAsNumber.sm}px`,
+    md: `${themeScreenSizeAsNumber.md}px`,
+    lg: `${themeScreenSizeAsNumber.lg}px`,
+    xl: `${themeScreenSizeAsNumber.xl}px`,
+    "2xl": `${themeScreenSizeAsNumber["2xl"]}px`,
+    "3xl": `${themeScreenSizeAsNumber["3xl"]}px`,
 };
 
 /**
@@ -867,6 +876,7 @@ exports.themeFontSize = themeFontSize;
 exports.themeFontWeight = themeFontWeight;
 exports.themeLineHeight = themeLineHeight;
 exports.themeScreenSize = themeScreenSize;
+exports.themeScreenSizeAsNumber = themeScreenSizeAsNumber;
 exports.themeSpacing = themeSpacing;
 exports.themeZIndex = themeZIndex;
 exports.themedPalette = themedPalette;

package/index.esm.js

@@ -690,14 +690,23 @@ const elevation = {
 /**
  * A collection of all the tokens related to screen size in the theme.
  */
+const themeScreenSizeAsNumber = {
+    xs: 0,
+    sm: 480,
+    md: 768,
+    lg: 1024,
+    xl: 1200,
+    "2xl": 1600,
+    "3xl": 1900,
+};
 const themeScreenSize = {
-    xs: "0px",
-    sm: "480px",
-    md: "768px",
-    lg: "1024px",
-    xl: "1200px",
-    "2xl": "1600px",
-    "3xl": "1900px",
+    xs: `${themeScreenSizeAsNumber.xs}px`,
+    sm: `${themeScreenSizeAsNumber.sm}px`,
+    md: `${themeScreenSizeAsNumber.md}px`,
+    lg: `${themeScreenSizeAsNumber.lg}px`,
+    xl: `${themeScreenSizeAsNumber.xl}px`,
+    "2xl": `${themeScreenSizeAsNumber["2xl"]}px`,
+    "3xl": `${themeScreenSizeAsNumber["3xl"]}px`,
 };
 
 /**
@@ -838,4 +847,4 @@ const zIndex = {
     toast: themeZIndex.toast,
 };
 
-export { DEFAULT_CHART_COLORS, activityPalette, color, criticalityPalette, customerDataSourcePalette, customerTypePalette, elevation, fontFamily, fontSize, fontWeight, generalPalette, getReorderedChartColors, groupedPalettes, intentPalette, rentalStatusPalette, sitesPalette, size, tailwindPalette, themeBorderRadius, themeBoxShadow, themeColors, themeFontSize, themeFontWeight, themeLineHeight, themeScreenSize, themeSpacing, themeZIndex, themedPalette, trackunitPalette, utilizationPalette, zIndex };
+export { DEFAULT_CHART_COLORS, activityPalette, color, criticalityPalette, customerDataSourcePalette, customerTypePalette, elevation, fontFamily, fontSize, fontWeight, generalPalette, getReorderedChartColors, groupedPalettes, intentPalette, rentalStatusPalette, sitesPalette, size, tailwindPalette, themeBorderRadius, themeBoxShadow, themeColors, themeFontSize, themeFontWeight, themeLineHeight, themeScreenSize, themeScreenSizeAsNumber, themeSpacing, themeZIndex, themedPalette, trackunitPalette, utilizationPalette, zIndex };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/ui-design-tokens",
-  "version": "0.0.107",
+  "version": "0.0.109",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {

package/src/tokens/screenSize.d.ts

@@ -1,6 +1,15 @@
 /**
  * A collection of all the tokens related to screen size in the theme.
  */
+export declare const themeScreenSizeAsNumber: {
+    readonly xs: 0;
+    readonly sm: 480;
+    readonly md: 768;
+    readonly lg: 1024;
+    readonly xl: 1200;
+    readonly "2xl": 1600;
+    readonly "3xl": 1900;
+};
 export declare const themeScreenSize: {
     readonly xs: "0px";
     readonly sm: "480px";