@telus-uds/theme-koodo 3.19.0 → 3.20.0

package/build/android/theme.json

@@ -2490,17 +2490,17 @@
           "alpha": 1
         },
         "borderColor": {
-          "red": 0.78824,
-          "green": 0.78431,
-          "blue": 0.78431,
+          "red": 0.00392,
+          "green": 0.41961,
+          "blue": 0.41569,
           "alpha": 1
         },
         "borderRadius": 32,
         "borderWidth": 1,
         "iconColor": {
-          "red": 0.00392,
-          "green": 0.41961,
-          "blue": 0.41569,
+          "red": 0,
+          "green": 0,
+          "blue": 0,
           "alpha": 1
         },
         "iconScale": 1,
@@ -3020,6 +3020,13 @@
         "shadow": null
       }
     },
+    "Image": {
+      "appearances": {},
+      "rules": [],
+      "tokens": {
+        "borderRadius": 4
+      }
+    },
     "InputLabel": {
       "appearances": {},
       "rules": [],
@@ -3337,7 +3344,11 @@
             "viewport": ["xs", "sm"]
           },
           "tokens": {
-            "height": "100%"
+            "height": "100%",
+            "paddingBottom": 24,
+            "paddingLeft": 24,
+            "paddingRight": 24,
+            "paddingTop": 24
           }
         },
         {
@@ -3376,7 +3387,19 @@
           "blue": 1,
           "alpha": 1
         },
+        "borderColor": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        },
         "borderRadius": 4,
+        "cancelButtonColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        },
         "closeIcon": "PaletteIconTimes",
         "closeIconColor": {
           "red": 0,
@@ -3390,12 +3413,22 @@
         "containerPaddingLeft": 0,
         "containerPaddingRight": 0,
         "containerPaddingTop": 0,
+        "gap": 16,
+        "headingColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        },
+        "headingPaddingRight": 24,
         "height": null,
+        "marginLeft": 24,
+        "marginRight": 24,
         "maxWidth": "100%",
-        "paddingBottom": 16,
-        "paddingLeft": 16,
-        "paddingRight": 16,
-        "paddingTop": 16,
+        "paddingBottom": 24,
+        "paddingLeft": 32,
+        "paddingRight": 32,
+        "paddingTop": 24,
         "shadow": {
           "inset": false,
           "offsetX": 0,
@@ -3408,7 +3441,8 @@
             "blue": 0,
             "alpha": 0
           }
-        }
+        },
+        "subHeadingMarginTop": 8
       }
     },
     "Notification": {
@@ -5706,6 +5740,81 @@
         "showStepTrackerLabel": true
       }
     },
+    "Table": {
+      "appearances": {
+        "spacing": {
+          "type": "variant",
+          "values": ["compact"]
+        }
+      },
+      "rules": [
+        {
+          "if": {
+            "spacing": "compact"
+          },
+          "tokens": {
+            "cellPaddingBottom": 8,
+            "cellPaddingTop": 8
+          }
+        }
+      ],
+      "tokens": {
+        "cellBackground": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        },
+        "cellBoxShadowColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        },
+        "cellHeadingBackground": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        },
+        "cellHeadingBoxShadowColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        },
+        "cellPaddingBottom": 16,
+        "cellPaddingLeft": 16,
+        "cellPaddingRight": 16,
+        "cellPaddingTop": 16,
+        "cellRowHeadingBackground": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        },
+        "cellStickyShadow": {
+          "inset": false,
+          "offsetX": 0,
+          "offsetY": 4,
+          "blur": 8,
+          "spread": 0,
+          "color": {
+            "red": 0,
+            "green": 0,
+            "blue": 0,
+            "alpha": 0.1
+          }
+        },
+        "cellSubheadingBackground": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        },
+        "tablePaddingBottom": 24
+      }
+    },
     "Tabs": {
       "appearances": {},
       "rules": [],
@@ -5718,7 +5827,7 @@
         },
         "borderBottomWidth": 0,
         "buttonClearance": 32,
-        "gutter": 16,
+        "gutter": null,
         "nextIcon": "PaletteIconChevronRight",
         "previousIcon": "PaletteIconChevronLeft",
         "space": 0
@@ -5726,6 +5835,15 @@
     },
     "TabsItem": {
       "appearances": {
+        "inverse": {
+          "type": "variant",
+          "values": [true]
+        },
+        "pressed": {
+          "description": "Applies while an interactive component is being physically pressed. Most visible on touchscreen taps; in React Native Web, this is visible on web mouse clicks only if the pressable is held down.",
+          "values": [true],
+          "type": "state"
+        },
         "selected": {
           "description": "Applies while an interactive component is being physically pressed. Most visible on touchscreen taps; in React Native Web, this is visible on web mouse clicks only if the pressable is held down.",
           "values": [true],
@@ -5739,53 +5857,123 @@
           },
           "tokens": {
             "backgroundColor": {
-              "red": 0.00392,
-              "green": 0.41961,
-              "blue": 0.41569,
-              "alpha": 1
-            },
-            "borderWidth": 0,
-            "color": {
               "red": 1,
               "green": 1,
               "blue": 1,
               "alpha": 1
             },
+            "color": {
+              "red": 0.00392,
+              "green": 0.41961,
+              "blue": 0.41569,
+              "alpha": 1
+            },
+            "highlightBarBorderWidth": 1,
+            "highlightBarHeight": 1,
             "highlightColor": {
               "red": 0.00392,
               "green": 0.41961,
               "blue": 0.41569,
               "alpha": 1
+            }
+          }
+        },
+        {
+          "if": {
+            "pressed": true
+          },
+          "tokens": {
+            "backgroundColor": {
+              "red": 0.78824,
+              "green": 0.78431,
+              "blue": 0.78431,
+              "alpha": 1
             },
-            "highlightTriangleSize": 8
+            "highlightBarBorderWidth": 0
+          }
+        },
+        {
+          "if": {
+            "inverse": true
+          },
+          "tokens": {
+            "backgroundColor": {
+              "red": 0,
+              "green": 0,
+              "blue": 0,
+              "alpha": 0
+            },
+            "color": {
+              "red": 0.89804,
+              "green": 0.96863,
+              "blue": 0.98431,
+              "alpha": 1
+            }
+          }
+        },
+        {
+          "if": {
+            "inverse": true,
+            "selected": true
+          },
+          "tokens": {
+            "color": {
+              "red": 0.78824,
+              "green": 0.78431,
+              "blue": 0.78431,
+              "alpha": 1
+            },
+            "highlightBarBorderWidth": 1,
+            "highlightBarHeight": 1,
+            "highlightColor": {
+              "red": 0.78824,
+              "green": 0.78431,
+              "blue": 0.78431,
+              "alpha": 1
+            }
+          }
+        },
+        {
+          "if": {
+            "inverse": true,
+            "pressed": true
+          },
+          "tokens": {
+            "color": {
+              "red": 0.78824,
+              "green": 0.78431,
+              "blue": 0.78431,
+              "alpha": 1
+            },
+            "highlightBarBorderWidth": 0
           }
         }
       ],
       "tokens": {
         "backgroundColor": {
-          "red": 0.93725,
-          "green": 0.93725,
-          "blue": 0.93725,
+          "red": 1,
+          "green": 1,
+          "blue": 1,
           "alpha": 1
         },
         "borderColor": {
-          "red": 0.78824,
-          "green": 0.78431,
-          "blue": 0.78431,
-          "alpha": 1
-        },
-        "borderRadius": 0,
-        "borderWidth": 1,
-        "color": {
           "red": 0,
           "green": 0,
           "blue": 0,
+          "alpha": 0
+        },
+        "borderRadius": 0,
+        "borderWidth": 0,
+        "color": {
+          "red": 0.4,
+          "green": 0.4,
+          "blue": 0.4,
           "alpha": 1
         },
         "fontName": "StagSans",
         "fontScaleCap": 64,
         "fontSize": 16,
-        "fontWeight": 700,
+        "fontWeight": 600,
         "highlightBarBorderRadius": 0,
         "highlightBarBorderWidth": 0,
         "highlightBarHeight": 0,
@@ -5797,10 +5985,10 @@
         },
         "highlightTriangleSize": 0,
         "letterSpacing": 0,
-        "lineHeight": 1.1,
+        "lineHeight": 1.5,
         "maxWidth": null,
-        "paddingHorizontal": 16,
-        "paddingVertical": 16,
+        "paddingHorizontal": 24,
+        "paddingVertical": 4,
         "space": 0,
         "textAlign": "center",
         "textTransform": "none"
@@ -6221,6 +6409,73 @@
         "timelineContainerDirection": "column"
       }
     },
+    "Toast": {
+      "appearances": {},
+      "rules": [],
+      "tokens": {
+        "animationBackgroundColorAfter": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        },
+        "animationBackgroundColorBefore": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        },
+        "animationColorAfter": {
+          "red": 0.00392,
+          "green": 0.41961,
+          "blue": 0.41569,
+          "alpha": 1
+        },
+        "animationColorBefore": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        },
+        "animationDivColorAfter": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        },
+        "animationDivColorBefore": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        },
+        "animationFillColorAfter": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        },
+        "animationFillColorBefore": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        },
+        "animationHeightAfter": 24,
+        "animationHeightBefore": 0,
+        "animationPaddingBottomAfter": 16,
+        "animationPaddingBottomBefore": 0,
+        "animationPaddingTopAfter": 16,
+        "animationPaddingTopBefore": 0,
+        "containerBackgroundColor": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        },
+        "containerGap": 12
+      }
+    },
     "ToggleSwitch": {
       "appearances": {
         "inactive": {
@@ -6799,6 +7054,20 @@
         "textTransform": "none"
       }
     },
+    "WaffleGrid": {
+      "appearances": {},
+      "rules": [],
+      "tokens": {
+        "itemBorderColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
+        "itemPadding": 16,
+        "rowBorderWidth": 1
+      }
+    },
     "spacingScale": {
       "appearances": {
         "space": {
@@ -6986,7 +7255,7 @@
     }
   },
   "metadata": {
-    "themeTokensVersion": "2.18.0",
+    "themeTokensVersion": "2.19.0",
     "name": "theme-koodo"
   }
 }