@telus-uds/theme-public-mobile 2.10.0 → 2.12.0

package/build/android/theme.json

@@ -1859,10 +1859,19 @@
           "type": "variant",
           "values": ["none", "small", "large"]
         },
+        "interactive": {
+          "type": "variant",
+          "values": [true]
+        },
         "padding": {
           "type": "variant",
           "values": ["narrow", "intermediate", "compact", "custom"]
         },
+        "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, false],
+          "type": "state"
+        },
         "viewport": {
           "description": "The size label for the current screen viewport based on the current screen width",
           "values": ["xs", "sm", "md", "lg", "xl"],
@@ -2062,6 +2071,42 @@
             "paddingRight": 0,
             "paddingTop": 0
           }
+        },
+        {
+          "if": {
+            "interactive": true,
+            "pressed": false
+          },
+          "tokens": {
+            "borderColor": {
+              "red": 1,
+              "green": 1,
+              "blue": 1,
+              "alpha": 1
+            },
+            "borderWidth": 2
+          }
+        },
+        {
+          "if": {
+            "interactive": true,
+            "pressed": true
+          },
+          "tokens": {
+            "backgroundColor": {
+              "red": 0,
+              "green": 0,
+              "blue": 0,
+              "alpha": 0.2
+            },
+            "borderColor": {
+              "red": 0.80392,
+              "green": 0.81176,
+              "blue": 0.83529,
+              "alpha": 1
+            },
+            "borderWidth": 2
+          }
         }
       ],
       "tokens": {
@@ -2914,8 +2959,9 @@
             "size": "large"
           },
           "tokens": {
+            "blockLineHeight": 1.4,
             "fontSize": 20,
-            "iconSize": 24
+            "iconSize": 20
           }
         },
         {
@@ -2923,8 +2969,9 @@
             "size": "small"
           },
           "tokens": {
+            "blockLineHeight": 1.5,
             "fontSize": 16,
-            "iconSize": 20
+            "iconSize": 16
           }
         },
         {
@@ -2932,12 +2979,14 @@
             "size": "micro"
           },
           "tokens": {
+            "blockLineHeight": 1.4285714285714286,
             "fontSize": 14,
             "iconSize": 16
           }
         }
       ],
       "tokens": {
+        "blockLineHeight": 1.55555555,
         "color": {
           "red": 0.38824,
           "green": 0.42353,
@@ -2946,7 +2995,7 @@
         },
         "fontSize": 18,
         "iconDisplace": 0,
-        "iconSize": 24,
+        "iconSize": 16,
         "iconSpace": 1,
         "leftIcon": "PaletteIconChevronLeft",
         "outerBorderColor": {
@@ -2959,6 +3008,91 @@
         "textLine": "none"
       }
     },
+    "ColourToggle": {
+      "appearances": {
+        "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, false],
+          "type": "state"
+        },
+        "selected": {
+          "description": "Applies while an interactive component is the currently selected one in a set of states or components, for example a button in a `ButtonGroup`.",
+          "values": [true],
+          "type": "state"
+        }
+      },
+      "rules": [
+        {
+          "if": {
+            "pressed": true
+          },
+          "tokens": {
+            "bubbleBorderColor": {
+              "red": 0.16863,
+              "green": 0.19216,
+              "blue": 0.27059,
+              "alpha": 1
+            },
+            "bubbleBorderRadius": 45,
+            "bubbleBorderWidth": 1
+          }
+        },
+        {
+          "if": {
+            "selected": true
+          },
+          "tokens": {
+            "bubbleBorderColor": {
+              "red": 0.22353,
+              "green": 0.25098,
+              "blue": 0.33725,
+              "alpha": 1
+            },
+            "bubbleBorderRadius": 45,
+            "bubbleBorderWidth": 1
+          }
+        }
+      ],
+      "tokens": {
+        "borderColor": {
+          "red": 0.61176,
+          "green": 0.62353,
+          "blue": 0.66667,
+          "alpha": 1
+        },
+        "borderRadius": 45,
+        "borderWidth": 1,
+        "bubbleBorderColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
+        "bubbleBorderRadius": 0,
+        "bubbleBorderWidth": 0,
+        "innerBubbleBorderRadius": 45,
+        "innerBubbleHeight": 40,
+        "innerBubbleWidth": 40,
+        "outerBubbleContentAlignItems": "center",
+        "outerBubbleHeight": 48,
+        "outerBubbleJustifyContent": "center",
+        "outerBubbleWidth": 48,
+        "shadow": {
+          "inset": true,
+          "offsetX": 0,
+          "offsetY": 2,
+          "blur": 2,
+          "spread": 0,
+          "color": {
+            "red": 0,
+            "green": 0,
+            "blue": 0,
+            "alpha": 0.1
+          }
+        },
+        "space": 2
+      }
+    },
     "Countdown": {
       "appearances": {
         "feature": {
@@ -4823,6 +4957,11 @@
           "values": [true, false],
           "type": "state"
         },
+        "quiet": {
+          "description": "When it is true, it does not show the decoration",
+          "type": "state",
+          "values": [true, false]
+        },
         "size": {
           "description": "Text sizes for block links; similar but not always identical to Typography sizes.",
           "type": "variant",
@@ -4966,6 +5105,14 @@
             "blockLineHeight": 1.4,
             "iconSize": 24
           }
+        },
+        {
+          "if": {
+            "quiet": true
+          },
+          "tokens": {
+            "textLine": "none"
+          }
         }
       ],
       "tokens": {
@@ -11379,7 +11526,7 @@
     }
   },
   "metadata": {
-    "themeTokensVersion": "2.46.0",
+    "themeTokensVersion": "2.48.0",
     "name": "theme-public-mobile"
   }
 }