@entur/tokens 3.14.0 → 3.15.1-beta.0

package/dist/componentColors.d.ts

@@ -690,6 +690,14 @@ export declare const componentColors: {
                         text: string;
                     };
                 };
+                spinner: {
+                    contrast: {
+                        fill: string;
+                    };
+                    standard: {
+                        fill: string;
+                    };
+                };
                 skeleton: {
                     contrast: {
                         fill: string;
@@ -2081,6 +2089,14 @@ export declare const componentColors: {
                         text: string;
                     };
                 };
+                spinner: {
+                    contrast: {
+                        fill: string;
+                    };
+                    standard: {
+                        fill: string;
+                    };
+                };
                 skeleton: {
                     contrast: {
                         fill: string;

package/dist/legacy-tokens.d.ts

@@ -107,38 +107,70 @@ export declare const colors: {
     };
 };
 export declare const space: {
+    /** 0px */
     none: number;
+    /** 16px (1rem) */
     default: number;
+    /** 4px (0.25rem) */
     extraSmall2: number;
+    /** 8px (0.5rem) */
     extraSmall: number;
+    /** 12px (0.75rem) */
     small: number;
+    /** 16px (1rem) */
     medium: number;
+    /** 24px (1.5rem) */
     large: number;
+    /** 32px (2rem) */
     extraLarge: number;
+    /** 40px (2.5rem) */
     extraLarge2: number;
+    /** 48px (3rem) */
     extraLarge3: number;
+    /** 56px (3.5rem) */
     extraLarge4: number;
+    /** 64px (4rem) */
     extraLarge5: number;
+    /** 72px (4.5rem) */
     extraLarge6: number;
+    /** 80px (5rem) */
     extraLarge7: number;
+    /** 88px (5.5rem) */
     extraLarge8: number;
+    /** 96px (6rem) */
     extraLarge9: number;
     rem: {
+        /**  0rem (0px) */
         none: number;
+        /** 1rem (16px) */
         default: number;
+        /** 0.25rem (4px) */
         extraSmall2: number;
+        /** 0.5rem (8px)  */
         extraSmall: number;
+        /** 0.75rem (12px) */
         small: number;
+        /** 1rem (16px) */
         medium: number;
+        /** 1.5rem (24px) */
         large: number;
+        /** 2rem (32px) */
         extraLarge: number;
+        /** 2.5rem (40px) */
         extraLarge2: number;
+        /** 3rem (48px) */
         extraLarge3: number;
+        /** 3.5rem (56px) */
         extraLarge4: number;
+        /** 4rem (64px) */
         extraLarge5: number;
+        /**  4.5rem (72px) */
         extraLarge6: number;
+        /** 5rem (80px) */
         extraLarge7: number;
+        /**  5.5rem (88px) */
         extraLarge8: number;
+        /**  6rem (96px) */
         extraLarge9: number;
     };
 };
@@ -147,50 +179,90 @@ export declare const fontWeights: {
     heading: string;
 };
 export declare const fontSizes: {
+    /** 10px (0.625rem) */
     extraSmall: number;
+    /** 12px (0.75rem) */
     small: number;
+    /** 14px (0.875rem) */
     medium: number;
+    /** 16px (1rem) */
     large: number;
+    /** 20 px (1.25rem) */
     extraLarge: number;
+    /** 24 px (1.5rem) */
     extraLarge2: number;
+    /** 28 px (1.75rem) */
     extraLarge3: number;
+    /** 32 px (2rem) */
     extraLarge4: number;
+    /** 40 px (2.5rem) */
     extraLarge5: number;
     rem: {
+        /** 0.625rem (10px) */
         extraSmall: number;
+        /** 0.75rem (12px) */
         small: number;
+        /** 0.875rem (14px) */
         medium: number;
+        /** 1rem (16px) */
         large: number;
+        /** 1.25rem (20px) */
         extraLarge: number;
+        /** 1.5rem (24px) */
         extraLarge2: number;
+        /** 1.75rem (28px) */
         extraLarge3: number;
+        /** 2rem (32px) */
         extraLarge4: number;
+        /** 2.5rem (40px) */
         extraLarge5: number;
     };
 };
 export declare const lineHeights: {
+    /** 14px (0.875rem) */
     extraSmall: number;
+    /** 16px (1rem) */
     small: number;
+    /** 20px (1.25rem) */
     medium: number;
+    /** 22px (1.375rem) */
     large: number;
+    /** 24px (1.5rem) */
     extraLarge: number;
+    /** 28px (1.75rem) */
     extraLarge2: number;
+    /** 30px (1.875rem) */
     extraLarge3: number;
+    /** 36px (2.25rem) */
     extraLarge4: number;
+    /** 42px (2.625rem) */
     extraLarge5: number;
+    /** 48px (3rem) */
     extraLarge6: number;
+    /** 60px (3.75rem) */
     extraLarge7: number;
     rem: {
+        /** 0.875rem (14px) */
         extraSmall: number;
+        /** 1rem (16px) */
         small: number;
+        /** 1.25rem (20px) */
         medium: number;
+        /** 1.375rem (22px) */
         large: number;
+        /** 1.5rem (24px) */
         extraLarge: number;
+        /** 1.75rem (28px) */
         extraLarge2: number;
+        /** 1.875rem (30px) */
         extraLarge3: number;
+        /** 2.25rem (36px) */
         extraLarge4: number;
+        /** 2.625rem (42px) */
         extraLarge5: number;
+        /** 3rem (48px) */
         extraLarge6: number;
+        /** 3.75rem (60px) */
         extraLarge7: number;
     };
 };
@@ -203,26 +275,42 @@ export declare const breakpoints: {
     };
 };
 export declare const borderWidths: {
+    /** 2px (0.125rem) */
     default: number;
+    /** 1px (0.0625rem) */
     small: number;
+    /** 2px (0.125rem) */
     medium: number;
+    /** 4px (0.25rem) */
     large: number;
     rem: {
+        /** 0.125rem (2px) */
         default: number;
+        /** 0.0625rem (1px) */
         small: number;
+        /** 0.125rem (2px) */
         medium: number;
+        /** 0.25rem (4px) */
         large: number;
     };
 };
 export declare const borderRadiuses: {
+    /** 1 px (0.0625rem) */
     default: number;
+    /** 1 px (0.0625rem) */
     small: number;
+    /** 4 px (0.25rem) */
     medium: number;
+    /** 8 px (0.5rem) */
     large: number;
     rem: {
+        /** 0.0625rem (1px) */
         default: number;
+        /** 0.0625rem (1px) */
         small: number;
+        /** 0.25rem (4px) */
         medium: number;
+        /** 0.5rem (8px) */
         large: number;
     };
 };
@@ -246,8 +334,11 @@ export declare const zIndexes: {
     toast: number;
 };
 export declare const timings: {
+    /** 0.1s */
     fast: string;
+    /** 0.2s */
     medium: string;
+    /** 0.5s */
     slow: string;
 };
 export declare const outlines: {
@@ -255,8 +346,10 @@ export declare const outlines: {
     focusContrast: string;
 };
 export declare const outlineOffsets: {
+    /** 2px (0.125rem) */
     focus: number;
     rem: {
+        /** 0.125rem (2px) */
         focus: number;
     };
 };

package/dist/tokens.cjs.development.js

@@ -1346,6 +1346,14 @@ var componentColors = {
             "text": "#181c56"
           }
         },
+        "spinner": {
+          "contrast": {
+            "fill": "#ffffff"
+          },
+          "standard": {
+            "fill": "#181c56"
+          }
+        },
         "skeleton": {
           "contrast": {
             "fill": "#292b6a",
@@ -2737,6 +2745,14 @@ var componentColors = {
             "text": "#e5e5e9"
           }
         },
+        "spinner": {
+          "contrast": {
+            "fill": "#e5e5e9"
+          },
+          "standard": {
+            "fill": "#e5e5e9"
+          }
+        },
         "skeleton": {
           "contrast": {
             "fill": "#2d2e3e",
@@ -3573,38 +3589,70 @@ var blue20Rgb = /*#__PURE__*/hexRgb(colors.blues.blue20, {
 // Dimensions
 var spaceScale = [0, 4, 8, 12, 16, 24, 32, 40, 48, 56, 64, 72, 80, 88, 96];
 var space = {
+  /** 0px */
   none: spaceScale[0],
+  /** 16px (1rem) */
   "default": spaceScale[4],
+  /** 4px (0.25rem) */
   extraSmall2: spaceScale[1],
+  /** 8px (0.5rem) */
   extraSmall: spaceScale[2],
+  /** 12px (0.75rem) */
   small: spaceScale[3],
+  /** 16px (1rem) */
   medium: spaceScale[4],
+  /** 24px (1.5rem) */
   large: spaceScale[5],
+  /** 32px (2rem) */
   extraLarge: spaceScale[6],
+  /** 40px (2.5rem) */
   extraLarge2: spaceScale[7],
+  /** 48px (3rem) */
   extraLarge3: spaceScale[8],
+  /** 56px (3.5rem) */
   extraLarge4: spaceScale[9],
+  /** 64px (4rem) */
   extraLarge5: spaceScale[10],
+  /** 72px (4.5rem) */
   extraLarge6: spaceScale[11],
+  /** 80px (5rem) */
   extraLarge7: spaceScale[12],
+  /** 88px (5.5rem) */
   extraLarge8: spaceScale[13],
+  /** 96px (6rem) */
   extraLarge9: spaceScale[14],
   rem: {
+    /**  0rem (0px) */
     none: /*#__PURE__*/pxToRem(spaceScale[0]),
+    /** 1rem (16px) */
     "default": /*#__PURE__*/pxToRem(spaceScale[4]),
+    /** 0.25rem (4px) */
     extraSmall2: /*#__PURE__*/pxToRem(spaceScale[1]),
+    /** 0.5rem (8px)  */
     extraSmall: /*#__PURE__*/pxToRem(spaceScale[2]),
+    /** 0.75rem (12px) */
     small: /*#__PURE__*/pxToRem(spaceScale[3]),
+    /** 1rem (16px) */
     medium: /*#__PURE__*/pxToRem(spaceScale[4]),
+    /** 1.5rem (24px) */
     large: /*#__PURE__*/pxToRem(spaceScale[5]),
+    /** 2rem (32px) */
     extraLarge: /*#__PURE__*/pxToRem(spaceScale[6]),
+    /** 2.5rem (40px) */
     extraLarge2: /*#__PURE__*/pxToRem(spaceScale[7]),
+    /** 3rem (48px) */
     extraLarge3: /*#__PURE__*/pxToRem(spaceScale[8]),
+    /** 3.5rem (56px) */
     extraLarge4: /*#__PURE__*/pxToRem(spaceScale[9]),
+    /** 4rem (64px) */
     extraLarge5: /*#__PURE__*/pxToRem(spaceScale[10]),
+    /**  4.5rem (72px) */
     extraLarge6: /*#__PURE__*/pxToRem(spaceScale[11]),
+    /** 5rem (80px) */
     extraLarge7: /*#__PURE__*/pxToRem(spaceScale[12]),
+    /**  5.5rem (88px) */
     extraLarge8: /*#__PURE__*/pxToRem(spaceScale[13]),
+    /**  6rem (96px) */
     extraLarge9: /*#__PURE__*/pxToRem(spaceScale[14])
   }
 };
@@ -3615,51 +3663,91 @@ var fontWeights = {
 };
 var fontSizeScale = [10, 12, 14, 16, 20, 24, 28, 32, 40];
 var fontSizes = {
+  /** 10px (0.625rem) */
   extraSmall: fontSizeScale[0],
+  /** 12px (0.75rem) */
   small: fontSizeScale[1],
+  /** 14px (0.875rem) */
   medium: fontSizeScale[2],
+  /** 16px (1rem) */
   large: fontSizeScale[3],
+  /** 20 px (1.25rem) */
   extraLarge: fontSizeScale[4],
+  /** 24 px (1.5rem) */
   extraLarge2: fontSizeScale[5],
+  /** 28 px (1.75rem) */
   extraLarge3: fontSizeScale[6],
+  /** 32 px (2rem) */
   extraLarge4: fontSizeScale[7],
+  /** 40 px (2.5rem) */
   extraLarge5: fontSizeScale[8],
   rem: {
+    /** 0.625rem (10px) */
     extraSmall: /*#__PURE__*/pxToRem(fontSizeScale[0]),
+    /** 0.75rem (12px) */
     small: /*#__PURE__*/pxToRem(fontSizeScale[1]),
+    /** 0.875rem (14px) */
     medium: /*#__PURE__*/pxToRem(fontSizeScale[2]),
+    /** 1rem (16px) */
     large: /*#__PURE__*/pxToRem(fontSizeScale[3]),
+    /** 1.25rem (20px) */
     extraLarge: /*#__PURE__*/pxToRem(fontSizeScale[4]),
+    /** 1.5rem (24px) */
     extraLarge2: /*#__PURE__*/pxToRem(fontSizeScale[5]),
+    /** 1.75rem (28px) */
     extraLarge3: /*#__PURE__*/pxToRem(fontSizeScale[6]),
+    /** 2rem (32px) */
     extraLarge4: /*#__PURE__*/pxToRem(fontSizeScale[7]),
+    /** 2.5rem (40px) */
     extraLarge5: /*#__PURE__*/pxToRem(fontSizeScale[8])
   }
 };
 var lineHeightScale = [14, 16, 20, 22, 24, 28, 30, 36, 42, 48, 60];
 var lineHeights = {
+  /** 14px (0.875rem) */
   extraSmall: lineHeightScale[0],
+  /** 16px (1rem) */
   small: lineHeightScale[1],
+  /** 20px (1.25rem) */
   medium: lineHeightScale[2],
+  /** 22px (1.375rem) */
   large: lineHeightScale[3],
+  /** 24px (1.5rem) */
   extraLarge: lineHeightScale[4],
+  /** 28px (1.75rem) */
   extraLarge2: lineHeightScale[5],
+  /** 30px (1.875rem) */
   extraLarge3: lineHeightScale[6],
+  /** 36px (2.25rem) */
   extraLarge4: lineHeightScale[7],
+  /** 42px (2.625rem) */
   extraLarge5: lineHeightScale[8],
+  /** 48px (3rem) */
   extraLarge6: lineHeightScale[9],
+  /** 60px (3.75rem) */
   extraLarge7: lineHeightScale[10],
   rem: {
+    /** 0.875rem (14px) */
     extraSmall: /*#__PURE__*/pxToRem(lineHeightScale[0]),
+    /** 1rem (16px) */
     small: /*#__PURE__*/pxToRem(lineHeightScale[1]),
+    /** 1.25rem (20px) */
     medium: /*#__PURE__*/pxToRem(lineHeightScale[2]),
+    /** 1.375rem (22px) */
     large: /*#__PURE__*/pxToRem(lineHeightScale[3]),
+    /** 1.5rem (24px) */
     extraLarge: /*#__PURE__*/pxToRem(lineHeightScale[4]),
+    /** 1.75rem (28px) */
     extraLarge2: /*#__PURE__*/pxToRem(lineHeightScale[5]),
+    /** 1.875rem (30px) */
     extraLarge3: /*#__PURE__*/pxToRem(lineHeightScale[6]),
+    /** 2.25rem (36px) */
     extraLarge4: /*#__PURE__*/pxToRem(lineHeightScale[7]),
+    /** 2.625rem (42px) */
     extraLarge5: /*#__PURE__*/pxToRem(lineHeightScale[8]),
+    /** 3rem (48px) */
     extraLarge6: /*#__PURE__*/pxToRem(lineHeightScale[9]),
+    /** 3.75rem (60px) */
     extraLarge7: /*#__PURE__*/pxToRem(lineHeightScale[10])
   }
 };
@@ -3675,27 +3763,43 @@ var breakpoints = {
 // Borders
 var borderWidthScale = [1, 2, 4];
 var borderWidths = {
+  /** 2px (0.125rem) */
   "default": borderWidthScale[1],
+  /** 1px (0.0625rem) */
   small: borderWidthScale[0],
+  /** 2px (0.125rem) */
   medium: borderWidthScale[1],
+  /** 4px (0.25rem) */
   large: borderWidthScale[2],
   rem: {
+    /** 0.125rem (2px) */
     "default": /*#__PURE__*/pxToRem(borderWidthScale[1]),
+    /** 0.0625rem (1px) */
     small: /*#__PURE__*/pxToRem(borderWidthScale[0]),
+    /** 0.125rem (2px) */
     medium: /*#__PURE__*/pxToRem(borderWidthScale[1]),
+    /** 0.25rem (4px) */
     large: /*#__PURE__*/pxToRem(borderWidthScale[2])
   }
 };
 var borderRadiusScale = [1, 4, 8];
 var borderRadiuses = {
+  /** 1 px (0.0625rem) */
   "default": borderRadiusScale[0],
+  /** 1 px (0.0625rem) */
   small: borderRadiusScale[0],
+  /** 4 px (0.25rem) */
   medium: borderRadiusScale[1],
+  /** 8 px (0.5rem) */
   large: borderRadiusScale[2],
   rem: {
+    /** 0.0625rem (1px) */
     "default": /*#__PURE__*/pxToRem(borderRadiusScale[0]),
+    /** 0.0625rem (1px) */
     small: /*#__PURE__*/pxToRem(borderRadiusScale[0]),
+    /** 0.25rem (4px) */
     medium: /*#__PURE__*/pxToRem(borderRadiusScale[1]),
+    /** 0.5rem (8px) */
     large: /*#__PURE__*/pxToRem(borderRadiusScale[2])
   }
 };
@@ -3722,8 +3826,11 @@ var zIndexes = {
 };
 var timingScale = ['0.1s', '0.2s', '0.5s'];
 var timings = {
+  /** 0.1s */
   fast: timingScale[0],
+  /** 0.2s */
   medium: timingScale[1],
+  /** 0.5s */
   slow: timingScale[2]
 };
 var outlines = {
@@ -3732,8 +3839,10 @@ var outlines = {
 };
 var outlineOffsetsConstants = [2];
 var outlineOffsets = {
+  /** 2px (0.125rem) */
   focus: outlineOffsetsConstants[0],
   rem: {
+    /** 0.125rem (2px) */
     focus: /*#__PURE__*/pxToRem(outlineOffsetsConstants[0])
   }
 };