@telus-uds/theme-koodo 7.18.1 → 7.19.0

package/build/android/spacingScale.json

@@ -33,7 +33,7 @@
         "space": 11
       },
       "tokens": {
-        "size": 120
+        "size": 96
       }
     },
     {

package/build/android/theme.json

@@ -6713,7 +6713,10 @@
             "moveRight",
             "moveUp",
             "play",
-            "subtract"
+            "subtract",
+            "menu",
+            "cart",
+            "profile"
           ]
         },
         "compact": {
@@ -6752,6 +6755,30 @@
         }
       },
       "rules": [
+        {
+          "if": {
+            "action": "menu"
+          },
+          "tokens": {
+            "icon": "PaletteIconHamburger"
+          }
+        },
+        {
+          "if": {
+            "action": "cart"
+          },
+          "tokens": {
+            "icon": "PaletteIconCart"
+          }
+        },
+        {
+          "if": {
+            "action": "profile"
+          },
+          "tokens": {
+            "icon": "PaletteIconUser"
+          }
+        },
         {
           "if": {
             "action": "add"
@@ -7851,147 +7878,75 @@
           "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, false],
           "type": "state"
+        },
+        "style": {
+          "type": "variant",
+          "values": ["default", "lightest", "light"]
         }
       },
       "rules": [
         {
           "if": {
-            "current": true
+            "style": "default"
           },
           "tokens": {
-            "groupBackgroundColor": {
+            "containerBackgroundColor": {
               "red": 0,
               "green": 0,
               "blue": 0,
-              "alpha": 1
-            },
-            "groupBorderColor": {
-              "red": 0,
-              "green": 0,
-              "blue": 0,
-              "alpha": 1
-            },
-            "groupColor": {
-              "red": 1,
-              "green": 1,
-              "blue": 1,
-              "alpha": 1
-            },
-            "itemBackgroundColor": {
-              "red": 0,
-              "green": 0,
-              "blue": 0,
-              "alpha": 1
-            },
-            "itemColor": {
-              "red": 1,
-              "green": 1,
-              "blue": 1,
-              "alpha": 1
+              "alpha": 0
             }
           }
         },
         {
           "if": {
-            "current": true,
-            "pressed": true
+            "style": "lightest"
           },
           "tokens": {
-            "itemBackgroundColor": {
-              "red": 0.7098,
-              "green": 0.70588,
-              "blue": 0.70588,
-              "alpha": 1
-            },
-            "itemColor": {
-              "red": 0.34902,
-              "green": 0.34902,
-              "blue": 0.34902,
+            "containerBackgroundColor": {
+              "red": 1,
+              "green": 1,
+              "blue": 1,
               "alpha": 1
             }
           }
         },
         {
           "if": {
-            "isChild": true
-          },
-          "tokens": {
-            "itemBorderBottomWidth": 1,
-            "itemBorderLeftColor": {
-              "red": 0,
-              "green": 0,
-              "blue": 0,
-              "alpha": 1
-            },
-            "itemBorderLeftWidth": 4,
-            "itemBorderTopWidth": 1
-          }
-        },
-        {
-          "if": {
-            "isChild": true,
-            "pressed": true
+            "style": "light"
           },
           "tokens": {
-            "itemBorderBottomWidth": 1,
-            "itemBorderLeftColor": {
-              "red": 0.34902,
-              "green": 0.34902,
-              "blue": 0.34902,
-              "alpha": 1
-            },
-            "itemBorderTopWidth": 1,
-            "itemColor": {
-              "red": 0.34902,
-              "green": 0.34902,
-              "blue": 0.34902,
+            "containerBackgroundColor": {
+              "red": 0.93725,
+              "green": 0.93725,
+              "blue": 0.93725,
               "alpha": 1
             }
           }
         },
         {
           "if": {
-            "expanded": true
+            "pressed": true
           },
           "tokens": {
             "groupBackgroundColor": {
               "red": 0,
               "green": 0,
               "blue": 0,
-              "alpha": 0
+              "alpha": 0.2
             },
-            "groupBorderColor": {
+            "groupBorderLeftColor": {
               "red": 0,
               "green": 0,
               "blue": 0,
-              "alpha": 0
-            },
-            "groupColor": {
-              "red": 1,
-              "green": 1,
-              "blue": 1,
               "alpha": 1
             },
-            "groupIcon": "PaletteIconChevronUp",
-            "itemColor": {
-              "red": 0.34902,
-              "green": 0.34902,
-              "blue": 0.34902,
-              "alpha": 1
-            }
-          }
-        },
-        {
-          "if": {
-            "current": true,
-            "isChild": true
-          },
-          "tokens": {
+            "groupBorderLeftWidth": 4,
             "itemBackgroundColor": {
               "red": 0,
               "green": 0,
               "blue": 0,
-              "alpha": 1
+              "alpha": 0.2
             },
             "itemBorderLeftColor": {
               "red": 0,
@@ -7999,77 +7954,113 @@
               "blue": 0,
               "alpha": 1
             },
-            "itemColor": {
-              "red": 1,
-              "green": 1,
-              "blue": 1,
-              "alpha": 1
-            }
+            "itemBorderLeftWidth": 4
           }
         },
         {
           "if": {
-            "pressed": true
+            "current": true
           },
           "tokens": {
-            "groupBackgroundColor": {
-              "red": 0.25098,
-              "green": 0.25098,
-              "blue": 0.25098,
+            "groupBorderLeftColor": {
+              "red": 1,
+              "green": 0,
+              "blue": 0.46275,
               "alpha": 1
             },
-            "groupColor": {
-              "red": 0.4,
-              "green": 0.4,
-              "blue": 0.4,
+            "groupBorderLeftWidth": 4,
+            "groupFontName": "StagSans",
+            "groupFontWeight": 600,
+            "itemBorderLeftColor": {
+              "red": 1,
+              "green": 0,
+              "blue": 0.46275,
               "alpha": 1
             },
-            "itemBackgroundColor": {
-              "red": 0.25098,
-              "green": 0.25098,
-              "blue": 0.25098,
+            "itemBorderLeftWidth": 4,
+            "itemFontName": "StagSans",
+            "itemFontWeight": 600
+          }
+        },
+        {
+          "if": {
+            "expanded": true
+          },
+          "tokens": {
+            "groupBorderLeftColor": {
+              "red": 1,
+              "green": 0,
+              "blue": 0.46275,
               "alpha": 1
             },
+            "groupBorderLeftWidth": 4,
+            "groupFontName": "StagSans",
+            "groupFontWeight": 600,
+            "groupIcon": "PaletteIconChevronUp",
             "itemBorderLeftColor": {
-              "red": 0.25098,
-              "green": 0.25098,
-              "blue": 0.25098,
+              "red": 1,
+              "green": 0,
+              "blue": 0.46275,
               "alpha": 1
             },
-            "itemColor": {
-              "red": 0.4,
-              "green": 0.4,
-              "blue": 0.4,
-              "alpha": 1
-            }
+            "itemBorderLeftWidth": 4,
+            "itemFontName": "StagSans",
+            "itemFontWeight": 600
           }
         }
       ],
       "tokens": {
+        "containerBackgroundColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
         "groupBackgroundColor": {
           "red": 0,
           "green": 0,
           "blue": 0,
           "alpha": 0
         },
-        "groupBorderColor": {
+        "groupBorderBottomColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
+        "groupBorderBottomWidth": 0,
+        "groupBorderLeftColor": {
           "red": 0,
           "green": 0,
           "blue": 0,
           "alpha": 0
         },
+        "groupBorderLeftWidth": 4,
         "groupBorderRadius": 0,
-        "groupBorderWidth": 1,
+        "groupBorderRightColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
+        "groupBorderRightWidth": 0,
+        "groupBorderTopColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
+        "groupBorderTopWidth": 0,
         "groupColor": {
-          "red": 0.4,
-          "green": 0.4,
-          "blue": 0.4,
+          "red": 0,
+          "green": 0,
+          "blue": 0,
           "alpha": 1
         },
         "groupFontName": "StagSans",
         "groupFontSize": 16,
         "groupFontWeight": 400,
-        "groupHeight": 32,
+        "groupHeight": 40,
         "groupIcon": "PaletteIconChevronDown",
         "groupPaddingBottom": 12,
         "groupPaddingLeft": 16,
@@ -8087,14 +8078,14 @@
           "blue": 0,
           "alpha": 0
         },
-        "itemBorderBottomWidth": 1,
+        "itemBorderBottomWidth": 0,
         "itemBorderLeftColor": {
           "red": 0,
           "green": 0,
           "blue": 0,
           "alpha": 0
         },
-        "itemBorderLeftWidth": 1,
+        "itemBorderLeftWidth": 4,
         "itemBorderRadius": 0,
         "itemBorderRightColor": {
           "red": 0,
@@ -8102,26 +8093,26 @@
           "blue": 0,
           "alpha": 0
         },
-        "itemBorderRightWidth": 1,
+        "itemBorderRightWidth": 0,
         "itemBorderTopColor": {
           "red": 0,
           "green": 0,
           "blue": 0,
           "alpha": 0
         },
-        "itemBorderTopWidth": 1,
+        "itemBorderTopWidth": 0,
         "itemBorderWidth": 0,
         "itemColor": {
-          "red": 0.4,
-          "green": 0.4,
-          "blue": 0.4,
+          "red": 0,
+          "green": 0,
+          "blue": 0,
           "alpha": 1
         },
         "itemDisplay": false,
         "itemFontName": "StagSans",
         "itemFontSize": 16,
         "itemFontWeight": 400,
-        "itemHeight": 32,
+        "itemHeight": 40,
         "itemOutline": 0,
         "itemPaddingBottom": 8,
         "itemPaddingLeft": 16,
@@ -13249,6 +13240,8 @@
         },
         "cellBorderTopWidth": 0,
         "cellBorderWidth": 0,
+        "cellBottomLeftBorderRadius": 0,
+        "cellBottomRightBorderRadius": 0,
         "cellBoxShadowColor": {
           "red": 0.93725,
           "green": 0.93725,
@@ -13273,6 +13266,8 @@
             "alpha": 0.1
           }
         },
+        "cellTopLeftBorderRadius": 0,
+        "cellTopRightBorderRadius": 0,
         "display": null,
         "fontColor": {
           "red": 0,
@@ -15897,7 +15892,7 @@
             "space": 11
           },
           "tokens": {
-            "size": 120
+            "size": 96
           }
         },
         {
@@ -16049,7 +16044,7 @@
     }
   },
   "metadata": {
-    "themeTokensVersion": "4.15.1",
+    "themeTokensVersion": "4.16.0",
     "name": "theme-koodo"
   }
 }

package/build/ios/IconButton.json

@@ -11,7 +11,10 @@
         "moveRight",
         "moveUp",
         "play",
-        "subtract"
+        "subtract",
+        "menu",
+        "cart",
+        "profile"
       ]
     },
     "compact": {
@@ -50,6 +53,30 @@
     }
   },
   "rules": [
+    {
+      "if": {
+        "action": "menu"
+      },
+      "tokens": {
+        "icon": "PaletteIconHamburger"
+      }
+    },
+    {
+      "if": {
+        "action": "cart"
+      },
+      "tokens": {
+        "icon": "PaletteIconCart"
+      }
+    },
+    {
+      "if": {
+        "action": "profile"
+      },
+      "tokens": {
+        "icon": "PaletteIconUser"
+      }
+    },
     {
       "if": {
         "action": "add"