@telus-uds/theme-allium 4.31.0 → 4.33.0

package/theme.json

@@ -1,5 +1,88 @@
 {
   "components": {
+    "ActionCard": {
+      "appearances": {
+        "hover": "{appearances.ActionCard.hover}",
+        "validation": "{appearances.ActionCard.validation}"
+      },
+      "rules": [
+        {
+          "if": {
+            "hover": true
+          },
+          "tokens": {
+            "actionIconTranslate": "{palette.size.size4}"
+          }
+        },
+        {
+          "if": {
+            "validation": "warning"
+          },
+          "tokens": {
+            "actionIconMarginLeft": "{palette.size.size8}",
+            "backgroundColor": "{palette.color.amberLight}",
+            "borderColor": "{palette.color.amberDark}",
+            "statusIcon": "{palette.icon.StatusWarning}",
+            "statusIconColor": "{palette.color.amberDark}"
+          }
+        },
+        {
+          "if": {
+            "validation": "error"
+          },
+          "tokens": {
+            "actionIconMarginLeft": "{palette.size.size8}",
+            "backgroundColor": "{palette.color.redLight}",
+            "borderColor": "{palette.color.red}",
+            "statusIcon": "{palette.icon.StatusError}",
+            "statusIconColor": "{palette.color.red}"
+          }
+        }
+      ],
+      "tokens": {
+        "actionIcon": "{palette.icon.ArrowRight}",
+        "actionIconColor": "{palette.color.greyCharcoal}",
+        "actionIconMarginBottom": "{palette.size.size8}",
+        "actionIconMarginLeft": "{palette.size.size0}",
+        "actionIconMarginRight": "{palette.size.size0}",
+        "actionIconMarginTop": "{palette.size.size8}",
+        "actionIconTranslate": "{palette.size.size4}",
+        "backgroundColor": "{system.color.none}",
+        "borderColor": "{system.color.none}",
+        "borderRadius": "{system.radius.none}",
+        "borderWidth": "{system.border.none}",
+        "contentFontColor": "{palette.color.greyCharcoal}",
+        "contentFontName": "{palette.fontName.HelveticaNow}",
+        "contentFontSize": "{palette.fontSize.size16}",
+        "contentFontWeight": "{palette.fontWeight.weight400}",
+        "contentLineHeight": "{palette.lineHeight.ratio5to4}",
+        "contentMarginBottom": "{palette.size.size8}",
+        "contentMarginLeft": "{palette.size.size0}",
+        "contentMarginRight": "{palette.size.size0}",
+        "contentMarginTop": "{palette.size.size0}",
+        "iconBackgroundColor": "{palette.color.dark5}",
+        "iconColor": "{palette.color.greyCharcoal}",
+        "iconMarginBottom": "{palette.size.size0}",
+        "iconMarginLeft": "{palette.size.size0}",
+        "iconMarginRight": "{palette.size.size8}",
+        "iconMarginTop": "{palette.size.size0}",
+        "paddingBottom": "{palette.size.size16}",
+        "paddingLeft": "{palette.size.size16}",
+        "paddingRight": "{palette.size.size16}",
+        "paddingTop": "{palette.size.size16}",
+        "statusIcon": "{system.icon.none}",
+        "statusIconColor": "{system.color.none}",
+        "titleFontColor": "{palette.color.greyCharcoal}",
+        "titleFontName": "{palette.fontName.HelveticaNow}",
+        "titleFontSize": "{palette.fontSize.size16}",
+        "titleFontWeight": "{palette.fontWeight.weight700}",
+        "titleLineHeight": "{palette.lineHeight.ratio3to2}",
+        "titleMarginBottom": "{palette.size.size8}",
+        "titleMarginLeft": "{palette.size.size0}",
+        "titleMarginRight": "{palette.size.size8}",
+        "titleMarginTop": "{palette.size.size8}"
+      }
+    },
     "ActivityIndicator": {
       "appearances": {
         "size": {
@@ -2734,7 +2817,9 @@
             "mini": true
           },
           "tokens": {
-            "paddingBottom": "{palette.size.size0}"
+            "borderWidth": "{system.border.none}",
+            "paddingBottom": "{palette.size.size0}",
+            "paddingTop": "{palette.size.size0}"
           }
         },
         {
@@ -2747,6 +2832,17 @@
             "borderWidth": "{palette.border.border1}"
           }
         },
+        {
+          "if": {
+            "focus": true,
+            "mini": true
+          },
+          "tokens": {
+            "backgroundColor": "{palette.color.greyAthens}",
+            "borderColor": "{palette.color.greyShuttle}",
+            "borderWidth": "{system.border.none}"
+          }
+        },
         {
           "if": {
             "hover": true
@@ -2775,6 +2871,17 @@
             "borderColor": "{palette.color.greyShuttle}",
             "borderWidth": "{palette.border.border1}"
           }
+        },
+        {
+          "if": {
+            "mini": true,
+            "pressed": true
+          },
+          "tokens": {
+            "backgroundColor": "{palette.color.greyMystic}",
+            "borderColor": "{palette.color.greyShuttle}",
+            "borderWidth": "{system.border.none}"
+          }
         }
       ],
       "tokens": {
@@ -2931,7 +3038,10 @@
             "mini": true
           },
           "tokens": {
-            "contentPaddingLeft": "{palette.size.size0}"
+            "contentPaddingBottom": "{palette.size.size0}",
+            "contentPaddingLeft": "{palette.size.size0}",
+            "contentPanelPaddingBottom": "{palette.size.size0}",
+            "contentPanelPaddingTop": "{palette.size.size0}"
           }
         }
       ],
@@ -4461,6 +4571,7 @@
         "itemIconColor": "{palette.color.purpleTelus}",
         "itemIconSize": "{palette.size.size24}",
         "itemLineHeight": "{palette.lineHeight.ratio3to2}",
+        "itemTextColor": "{palette.color.greyCharcoal}",
         "listGutter": "{palette.size.size8}"
       }
     },
@@ -4978,6 +5089,17 @@
         "viewport": "{appearances.system.viewport}"
       },
       "rules": [
+        {
+          "if": {
+            "system": true,
+            "viewport": ["xl"]
+          },
+          "tokens": {
+            "containerPaddingLeft": "{palette.size.size16}",
+            "containerPaddingRight": "{palette.size.size16}",
+            "justifyContent": "{system.flexJustifyContent.center}"
+          }
+        },
         {
           "if": {
             "system": true
@@ -5107,6 +5229,8 @@
         "borderRightWidth": "{palette.border.border1}",
         "borderTopWidth": "{palette.border.border1}",
         "color": "{palette.color.greyCharcoal}",
+        "containerPaddingLeft": "{palette.size.size16}",
+        "containerPaddingRight": "{palette.size.size16}",
         "dismissButtonGap": "{palette.size.size24}",
         "dismissIcon": "{palette.icon.Close}",
         "dismissIconColor": "{palette.color.greyShuttle}",
@@ -8502,10 +8626,10 @@
             "size": "display1"
           },
           "tokens": {
-            "fontName": "{palette.fontName.HelveticaNow}",
+            "fontName": "{palette.fontName.HelveticaNowDisplay}",
             "fontSize": "{palette.fontSize.size40}",
             "fontWeight": "{palette.fontWeight.weight300}",
-            "letterSpacing": "{palette.letterSpacing.medium}",
+            "letterSpacing": "{system.letterSpacing.none}",
             "lineHeight": "{palette.lineHeight.ratio6to5}",
             "superScriptFontSize": "{palette.fontSize.size24}"
           }
@@ -8516,8 +8640,10 @@
             "viewport": ["lg", "xl"]
           },
           "tokens": {
+            "fontName": "{palette.fontName.HelveticaNowDisplay}",
             "fontSize": "{palette.fontSize.size64}",
-            "lineHeight": "{palette.lineHeight.ratio9to8}",
+            "fontWeight": "{palette.fontWeight.weight300}",
+            "lineHeight": "{palette.lineHeight.ratio6to5}",
             "superScriptFontSize": "{palette.fontSize.size32}"
           }
         },
@@ -8526,10 +8652,10 @@
             "size": "display2"
           },
           "tokens": {
-            "fontName": "{palette.fontName.HelveticaNow}",
+            "fontName": "{palette.fontName.HelveticaNowDisplay}",
             "fontSize": "{palette.fontSize.size36}",
-            "fontWeight": "{palette.fontWeight.weight400}",
-            "letterSpacing": "{palette.letterSpacing.medium}",
+            "fontWeight": "{palette.fontWeight.weight300}",
+            "letterSpacing": "{system.letterSpacing.none}",
             "lineHeight": "{palette.lineHeight.ratio11to9}",
             "superScriptFontSize": "{palette.fontSize.size24}"
           }
@@ -8540,10 +8666,9 @@
             "viewport": ["lg", "xl"]
           },
           "tokens": {
-            "fontName": "{palette.fontName.HelveticaNow}",
+            "fontName": "{palette.fontName.HelveticaNowDisplay}",
             "fontSize": "{palette.fontSize.size56}",
             "fontWeight": "{palette.fontWeight.weight300}",
-            "letterSpacing": "{palette.letterSpacing.condensed}",
             "lineHeight": "{palette.lineHeight.ratio8to7}",
             "superScriptFontSize": "{palette.fontSize.size32}"
           }
@@ -8553,9 +8678,11 @@
             "size": "h1"
           },
           "tokens": {
+            "fontName": "{palette.fontName.HelveticaNowDisplay}",
             "fontSize": "{palette.fontSize.size28}",
-            "letterSpacing": "{palette.letterSpacing.loose}",
-            "lineHeight": "{palette.lineHeight.ratio9to7}",
+            "fontWeight": "{palette.fontWeight.weight300}",
+            "letterSpacing": "{system.letterSpacing.none}",
+            "lineHeight": "{palette.lineHeight.ratio11to9}",
             "superScriptFontSize": "{palette.fontSize.size20}"
           }
         },
@@ -8565,10 +8692,10 @@
             "viewport": ["lg", "xl"]
           },
           "tokens": {
-            "fontName": "{palette.fontName.HelveticaNow}",
+            "fontName": "{palette.fontName.HelveticaNowDisplay}",
             "fontSize": "{palette.fontSize.size40}",
             "fontWeight": "{palette.fontWeight.weight300}",
-            "letterSpacing": "{palette.letterSpacing.medium}",
+            "letterSpacing": "{system.letterSpacing.none}",
             "lineHeight": "{palette.lineHeight.ratio6to5}",
             "superScriptFontSize": "{palette.fontSize.size24}"
           }
@@ -8578,10 +8705,11 @@
             "size": "h2"
           },
           "tokens": {
-            "fontName": "{palette.fontName.HelveticaNow}",
+            "fontName": "{palette.fontName.HelveticaNowDisplay}",
             "fontSize": "{palette.fontSize.size24}",
-            "fontWeight": "{palette.fontWeight.weight400}",
-            "lineHeight": "{palette.lineHeight.ratio4to3}",
+            "fontWeight": "{palette.fontWeight.weight300}",
+            "letterSpacing": "{system.letterSpacing.none}",
+            "lineHeight": "{palette.lineHeight.ratio6to5}",
             "superScriptFontSize": "{palette.fontSize.size16}"
           }
         },
@@ -8591,9 +8719,11 @@
             "viewport": ["lg", "xl"]
           },
           "tokens": {
+            "fontName": "{palette.fontName.HelveticaNowDisplay}",
             "fontSize": "{palette.fontSize.size28}",
+            "fontWeight": "{palette.fontWeight.weight300}",
             "letterSpacing": "{palette.letterSpacing.loose}",
-            "lineHeight": "{palette.lineHeight.ratio9to7}",
+            "lineHeight": "{palette.lineHeight.ratio11to9}",
             "superScriptFontSize": "{palette.fontSize.size20}"
           }
         },
@@ -8605,20 +8735,11 @@
             "fontName": "{palette.fontName.HelveticaNow}",
             "fontSize": "{palette.fontSize.size20}",
             "fontWeight": "{palette.fontWeight.weight500}",
-            "lineHeight": "{palette.lineHeight.ratio7to5}",
+            "letterSpacing": "{system.letterSpacing.none}",
+            "lineHeight": "{palette.lineHeight.ratio6to5}",
             "superScriptFontSize": "{palette.fontSize.size16}"
           }
         },
-        {
-          "if": {
-            "size": "h3",
-            "viewport": ["lg", "xl"]
-          },
-          "tokens": {
-            "fontSize": "{palette.fontSize.size24}",
-            "lineHeight": "{palette.lineHeight.ratio4to3}"
-          }
-        },
         {
           "if": {
             "size": "h4"
@@ -8627,6 +8748,7 @@
             "fontName": "{palette.fontName.HelveticaNow}",
             "fontSize": "{palette.fontSize.size16}",
             "fontWeight": "{palette.fontWeight.weight500}",
+            "letterSpacing": "{system.letterSpacing.none}",
             "lineHeight": "{palette.lineHeight.ratio3to2}",
             "superScriptFontSize": "{palette.fontSize.size16}"
           }
@@ -8639,6 +8761,7 @@
             "fontName": "{palette.fontName.HelveticaNow}",
             "fontSize": "{palette.fontSize.size14}",
             "fontWeight": "{palette.fontWeight.weight500}",
+            "letterSpacing": "{system.letterSpacing.none}",
             "lineHeight": "{palette.lineHeight.ratio9to7}"
           }
         },
@@ -8658,6 +8781,7 @@
             "fontName": "{palette.fontName.HelveticaNow}",
             "fontSize": "{palette.fontSize.size12}",
             "fontWeight": "{palette.fontWeight.weight700}",
+            "letterSpacing": "{system.letterSpacing.none}",
             "lineHeight": "{palette.lineHeight.ratio4to3}"
           }
         },
@@ -8760,52 +8884,28 @@
             "size": "display1"
           },
           "tokens": {
-            "fontName": "{palette.fontName.HelveticaNow}",
-            "fontWeight": "{palette.fontWeight.weight400}"
-          }
-        },
-        {
-          "if": {
-            "bold": true,
-            "size": ["display2"],
-            "viewport": ["xs", "sm", "md"]
-          },
-          "tokens": {
-            "fontName": "{palette.fontName.HelveticaNow}",
-            "fontWeight": "{palette.fontWeight.weight500}"
-          }
-        },
-        {
-          "if": {
-            "bold": true,
-            "size": ["display2"],
-            "viewport": ["lg", "xl"]
-          },
-          "tokens": {
-            "fontName": "{palette.fontName.HelveticaNow}",
-            "fontWeight": "{palette.fontWeight.weight400}"
+            "fontName": "{palette.fontName.HelveticaNowDisplay}",
+            "fontWeight": "{palette.fontWeight.weight700}"
           }
         },
         {
           "if": {
             "bold": true,
-            "size": "h1",
-            "viewport": ["xs", "sm", "md"]
+            "size": "display2"
           },
           "tokens": {
-            "fontName": "{palette.fontName.HelveticaNow}",
-            "fontWeight": "{palette.fontWeight.weight500}"
+            "fontName": "{palette.fontName.HelveticaNowDisplay}",
+            "fontWeight": "{palette.fontWeight.weight700}"
           }
         },
         {
           "if": {
             "bold": true,
-            "size": "h1",
-            "viewport": ["lg", "xl"]
+            "size": "h1"
           },
           "tokens": {
-            "fontName": "{palette.fontName.HelveticaNow}",
-            "fontWeight": "{palette.fontWeight.weight400}"
+            "fontName": "{palette.fontName.HelveticaNowDisplay}",
+            "fontWeight": "{palette.fontWeight.weight700}"
           }
         },
         {
@@ -8814,8 +8914,8 @@
             "size": "h2"
           },
           "tokens": {
-            "fontName": "{palette.fontName.HelveticaNow}",
-            "fontWeight": "{palette.fontWeight.weight500}"
+            "fontName": "{palette.fontName.HelveticaNowDisplay}",
+            "fontWeight": "{palette.fontWeight.weight700}"
           }
         },
         {