@telus-uds/theme-allium 3.25.0 → 3.27.0

package/theme.json

@@ -352,14 +352,22 @@
             "inverse": true
           },
           "tokens": {
+            "color": "{palette.color.white}",
+            "currentColor": "{palette.color.white}",
             "iconColor": "{palette.color.greyCloud}"
           }
         }
       ],
       "tokens": {
+        "color": "{palette.color.greyShuttle}",
+        "currentColor": "{palette.color.greyCharcoal}",
+        "fontName": "{palette.fontName.HelveticaNow}",
+        "fontSize": "{palette.fontSize.size12}",
+        "fontWeight": "{palette.fontWeight.weight500}",
         "icon": "{palette.icon.ChevronRight}",
-        "iconColor": "{palette.color.greyShuttle}",
-        "iconPadding": "{palette.size.size8}",
+        "iconColor": "{palette.color.greyCloud}",
+        "iconPadding": "{palette.size.size4}",
+        "iconSize": "{palette.size.size16}",
         "listItemPadding": "{palette.size.size0}"
       }
     },
@@ -1683,7 +1691,7 @@
             "size": "large"
           },
           "tokens": {
-            "height": "{palette.size.size48}",
+            "fontSize": "{palette.fontSize.size20}",
             "iconSize": "{palette.size.size24}",
             "textLineHeight": "{palette.lineHeight.ratio10to5}"
           }
@@ -1693,7 +1701,7 @@
             "size": "small"
           },
           "tokens": {
-            "height": "{palette.size.size36}",
+            "fontSize": "{palette.fontSize.size14}",
             "iconSize": "{palette.size.size14}",
             "textLineHeight": "{palette.lineHeight.ratio15to7}"
           }
@@ -1703,7 +1711,7 @@
             "size": "micro"
           },
           "tokens": {
-            "height": "{palette.size.size32}",
+            "fontSize": "{palette.fontSize.size12}",
             "iconSize": "{palette.size.size12}",
             "textLineHeight": "{palette.lineHeight.ratio2to1}"
           }
@@ -1711,7 +1719,7 @@
       ],
       "tokens": {
         "color": "{palette.color.greenAccessible}",
-        "height": "{palette.size.size40}",
+        "fontSize": "{palette.fontSize.size16}",
         "iconDisplace": "{palette.size.size0}",
         "iconSize": "{palette.size.size24}",
         "iconSpace": "{system.integer.1}",
@@ -1881,6 +1889,17 @@
         "validInputMixin": "{palette.color.greenAccessible}"
       }
     },
+    "Disclaimer": {
+      "appearances": {},
+      "rules": [],
+      "tokens": {
+        "color": "{palette.color.greyCharcoal}",
+        "fontName": "{palette.fontName.HelveticaNow}",
+        "fontSize": "{palette.fontSize.size14}",
+        "fontWeight": "{palette.fontWeight.weight400}",
+        "lineHeight": "{palette.lineHeight.ratio10to7}"
+      }
+    },
     "Divider": {
       "appearances": {
         "decorative": {
@@ -2092,6 +2111,7 @@
         "closeButtonMarginRight": "{palette.size.size4}",
         "closeButtonMarginTop": "{palette.size.size12}",
         "closeButtonWidth": "{palette.size.size24}",
+        "closeIcon": "{palette.icon.Close}",
         "footnoteBackground": "{palette.color.greyAthens}",
         "footnoteBodyBackground": "{palette.color.greyAthens}",
         "footnoteBodyPaddingBottom": "{palette.size.size32}",
@@ -2114,6 +2134,9 @@
       "appearances": {},
       "rules": [],
       "tokens": {
+        "color": "{palette.color.black}",
+        "fontName": "{palette.fontName.HelveticaNow}",
+        "fontWeight": "{palette.fontWeight.weight400}",
         "lineHeight": "{palette.lineHeight.ratio1to1}",
         "paddingLeft": "{palette.size.size2}",
         "paddingRight": "{palette.size.size2}"
@@ -3022,7 +3045,7 @@
             "size": "large"
           },
           "tokens": {
-            "iconMarginTop": "{palette.size.size8}",
+            "iconMarginTop": "{palette.size.size4}",
             "itemFontSize": "{palette.fontSize.size20}",
             "itemIconSize": "{palette.size.size20}",
             "itemLineHeight": "{palette.lineHeight.ratio8to5}",
@@ -3071,7 +3094,7 @@
       "tokens": {
         "dividerColor": "{palette.color.greyCloud}",
         "dividerSize": "{palette.border.border1}",
-        "iconMarginTop": "{palette.size.size4}",
+        "iconMarginTop": "{palette.size.size3}",
         "interItemMargin": "{palette.size.size8}",
         "interItemMarginWithDivider": "{palette.size.size16}",
         "itemBulletColor": "{palette.color.purpleTelus}",
@@ -3323,6 +3346,116 @@
         "subHeadingMarginTop": "{palette.size.size8}"
       }
     },
+    "NavigationBar": {
+      "appearances": {
+        "expanded": "{appearances.NavigationBar.expanded}",
+        "focus": "{appearances.NavigationBar.focus}",
+        "hover": "{appearances.NavigationBar.hover}",
+        "pressed": "{appearances.NavigationBar.pressed}",
+        "selected": "{appearances.NavigationBar.selected}",
+        "viewport": "{appearances.NavigationBar.viewport}"
+      },
+      "rules": [
+        {
+          "if": {
+            "selected": true
+          },
+          "tokens": {
+            "backgroundColor": "{palette.color.greyAthens}",
+            "borderColor": "{palette.color.greyAthens}",
+            "color": "{palette.color.purpleTelus}",
+            "fontName": "{palette.fontName.HelveticaNow}",
+            "fontWeight": "{palette.fontWeight.weight700}"
+          }
+        },
+        {
+          "if": {
+            "focus": true
+          },
+          "tokens": {
+            "backgroundColor": "{palette.color.white}",
+            "borderColor": "{palette.color.purpleTelus}",
+            "borderWidth": "{palette.border.border3}",
+            "color": "{palette.color.purpleTelus}"
+          }
+        },
+        {
+          "if": {
+            "focus": true,
+            "pressed": true
+          },
+          "tokens": {
+            "backgroundColor": "{palette.color.purpleTelus}",
+            "borderColor": "{palette.color.purpleTelus}",
+            "color": "{palette.color.white}"
+          }
+        },
+        {
+          "if": {
+            "hover": true
+          },
+          "tokens": {
+            "backgroundColor": "{palette.color.greyAthens}",
+            "borderColor": "{palette.color.purpleDeluge}",
+            "color": "{palette.color.purpleTelus}"
+          }
+        },
+        {
+          "if": {
+            "pressed": true
+          },
+          "tokens": {
+            "backgroundColor": "{palette.color.greyMystic}",
+            "borderColor": "{palette.color.purpleDeluge}",
+            "borderWidth": "{palette.border.border1}",
+            "color": "{palette.color.purpleTelus}"
+          }
+        },
+        {
+          "if": {
+            "viewport": ["xs", "sm", "md"]
+          },
+          "tokens": {
+            "textAlign": "{system.flexJustifyContent.flexStart}",
+            "width": "{palette.size.size288}"
+          }
+        },
+        {
+          "if": {
+            "expanded": true
+          },
+          "tokens": {
+            "icoMenu": "{palette.icon.CaretUp}"
+          }
+        }
+      ],
+      "tokens": {
+        "alignSelf": "{system.flexAlign.flexStart}",
+        "backgroundColor": "{palette.color.white}",
+        "borderColor": "{palette.color.white}",
+        "borderRadius": "{palette.radius.pill32}",
+        "borderWidth": "{palette.border.border1}",
+        "color": "{palette.color.greyCharcoal}",
+        "fontName": "{palette.fontName.HelveticaNow}",
+        "fontSize": "{palette.fontSize.size14}",
+        "fontWeight": "{palette.fontWeight.weight400}",
+        "icoMenu": "{palette.icon.CaretDown}",
+        "lineHeight": "{palette.lineHeight.ratio8to7}",
+        "minWidth": "{palette.size.size0}",
+        "opacity": "{palette.opacity.opacity10}",
+        "outerBackgroundColor": "{palette.color.transparent}",
+        "outerBorderColor": "{palette.color.transparent}",
+        "outerBorderGap": "{palette.size.size0}",
+        "outerBorderWidth": "{palette.border.border1}",
+        "paddingBottom": "{palette.size.size8}",
+        "paddingLeft": "{palette.size.size16}",
+        "paddingRight": "{palette.size.size16}",
+        "paddingTop": "{palette.size.size8}",
+        "shadow": "{system.shadow.none}",
+        "textAlign": "{system.flexJustifyContent.center}",
+        "width": "{palette.size.size0}"
+      }
+    },
     "Notification": {
       "appearances": {
         "style": "{appearances.Notification.style}",
@@ -3431,12 +3564,6 @@
             "itemLineHeight": "{palette.lineHeight.ratio8to5}"
           }
         },
-        {
-          "if": {
-            "size": "medium"
-          },
-          "tokens": {}
-        },
         {
           "if": {
             "size": "small"
@@ -3743,18 +3870,104 @@
       }
     },
     "PriceLockup": {
-      "appearances": {},
-      "rules": [],
+      "appearances": {
+        "size": {
+          "type": "variant",
+          "values": ["small", "medium", "large"]
+        },
+        "strikeThrough": {
+          "type": "variant",
+          "values": [true]
+        },
+        "viewport": "{appearances.system.viewport}"
+      },
+      "rules": [
+        {
+          "if": {
+            "size": "small"
+          },
+          "tokens": {
+            "amountFontSize": "{palette.fontSize.size28}",
+            "bottomTextFontSize": "{palette.fontSize.size14}",
+            "bottomTextLineHeight": "{palette.lineHeight.ratio10to7}",
+            "centsFontSize": "{palette.fontSize.size16}",
+            "centsLineHeight": "{palette.lineHeight.ratio4to3}",
+            "currencySymbolFontSize": "{palette.fontSize.size16}",
+            "currencySymbolLineHeight": "{palette.lineHeight.ratio5to4}",
+            "rateFontSize": "{palette.fontSize.size14}",
+            "rateLineHeight": "{palette.lineHeight.ratio8to7}",
+            "topTextFontSize": "{palette.fontSize.size14}",
+            "topTextLineHeight": "{palette.lineHeight.ratio10to7}"
+          }
+        },
+        {
+          "if": {
+            "size": "large",
+            "viewport": ["lg", "xl"]
+          },
+          "tokens": {
+            "amountFontSize": "{palette.fontSize.size64}",
+            "bottomTextFontSize": "{palette.fontSize.size20}",
+            "bottomTextLineHeight": "{palette.lineHeight.ratio8to5}",
+            "centsFontSize": "{palette.fontSize.size36}",
+            "centsLineHeight": "{palette.lineHeight.ratio9to8}",
+            "currencySymbolFontSize": "{palette.fontSize.size36}",
+            "currencySymbolLineHeight": "{palette.lineHeight.ratio9to8}",
+            "rateFontSize": "{palette.fontSize.size20}",
+            "rateLineHeight": "{palette.lineHeight.ratio8to5}",
+            "topTextFontSize": "{palette.fontSize.size20}",
+            "topTextLineHeight": "{palette.lineHeight.ratio8to5}"
+          }
+        },
+        {
+          "if": {
+            "strikeThrough": true
+          },
+          "tokens": {
+            "fontColor": "{palette.color.greyShuttle}",
+            "footnoteLinkColor": "{palette.color.greyShuttle}"
+          }
+        }
+      ],
       "tokens": {
+        "amountFontName": "{palette.fontName.HelveticaNow}",
+        "amountFontSize": "{palette.fontSize.size40}",
+        "amountFontWeight": "{palette.fontWeight.weight300}",
+        "amountLetterSpacing": "{palette.letterSpacing.condensed}",
+        "amountLineHeight": "{palette.lineHeight.ratio1to1}",
         "bottomLinksMarginLeft": "{palette.size.size4}",
+        "bottomTextFontSize": "{palette.fontSize.size16}",
+        "bottomTextLineHeight": "{palette.lineHeight.ratio8to5}",
         "bottomTextMarginTop": "{palette.size.size4}",
+        "centsFontName": "{palette.fontName.HelveticaNow}",
+        "centsFontSize": "{palette.fontSize.size20}",
+        "centsFontWeight": "{palette.fontWeight.weight400}",
+        "centsLineHeight": "{palette.lineHeight.ratio6to5}",
+        "currencySymbolFontName": "{palette.fontName.HelveticaNow}",
+        "currencySymbolFontSize": "{palette.fontSize.size20}",
+        "currencySymbolFontWeight": "{palette.fontWeight.weight400}",
+        "currencySymbolLineHeight": "{palette.lineHeight.ratio6to5}",
         "dividerColor": "{palette.color.greyCloud}",
         "fontColor": "{palette.color.greyCharcoal}",
+        "fontName": "{palette.fontName.HelveticaNow}",
+        "fontWeight": "{palette.fontWeight.weight700}",
         "footnoteGap": "{palette.size.size4}",
+        "footnoteLinkColor": "{palette.color.greyCharcoal}",
+        "footnoteLinkFontName": "{palette.fontName.HelveticaNow}",
+        "footnoteLinkFontSize": "{palette.fontSize.size14}",
+        "footnoteLinkFontWeight": "{palette.fontWeight.weight400}",
         "footnoteMarginTop": "{palette.size.size4}",
         "priceMarginBottom": "{palette.size.size8}",
-        "strikeThroughBackground": "{palette.color.greyShuttle}",
+        "rateFontName": "{palette.fontName.HelveticaNow}",
+        "rateFontSize": "{palette.fontSize.size16}",
+        "rateFontWeight": "{palette.fontWeight.weight400}",
+        "rateLineHeight": "{palette.lineHeight.ratio5to4}",
+        "strikeThroughColor": "{palette.color.greyShuttle}",
         "strikeThroughHeight": "{palette.size.size2}",
+        "topTextFontName": "{palette.fontName.HelveticaNow}",
+        "topTextFontSize": "{palette.fontSize.size16}",
+        "topTextFontWeight": "{palette.fontWeight.weight700}",
+        "topTextLineHeight": "{palette.lineHeight.ratio3to2}",
         "topTextMarginBottom": "{palette.size.size4}"
       }
     },
@@ -4429,6 +4642,10 @@
         "purpose": {
           "type": "variant",
           "values": ["offer", "default", "editorial"]
+        },
+        "wrap": {
+          "type": "variant",
+          "values": [true]
         }
       },
       "rules": [
@@ -4440,11 +4657,30 @@
             "backgroundColor": "{palette.color.greyShuttle}",
             "curveBackgroundColor": "{palette.color.greyThunder}"
           }
+        },
+        {
+          "if": {
+            "purpose": "offer"
+          },
+          "tokens": {
+            "gradient": "{palette.gradient.purple}"
+          }
+        },
+        {
+          "if": {
+            "wrap": true
+          },
+          "tokens": {
+            "paddingLeft": "{palette.size.size24}",
+            "paddingRight": "{palette.size.size24}"
+          }
         }
       ],
       "tokens": {
         "backgroundColor": "{palette.color.purpleEminence}",
         "borderRadius": "{palette.size.size4}",
+        "borderRadiusBottomLeft": "{system.size.none}",
+        "borderRadiusBottomRight": "{system.size.none}",
         "boxShadowColor": "{palette.color.dark10}",
         "boxShadowPaddingBottom": "{palette.size.size2}",
         "boxShadowPaddingLeft": "{palette.size.size0}",
@@ -4452,13 +4688,14 @@
         "boxShadowPaddingTop": "{palette.size.size0}",
         "curveAfterBackgroundColor": "{palette.color.purpleEminence}",
         "curveAfterHeight": "{palette.size.size4}",
-        "curveAfterRadius": "{palette.size.size8}",
+        "curveAfterRadius": "{palette.size.size0}",
         "curveAfterWidth": "{palette.size.size8}",
         "curveBackgroundColor": "{palette.color.purpleDark}",
         "curveHeight": "{palette.size.size10}",
         "curveMarginTop": "{palette.size.size4}",
         "curveWidth": "{palette.size.size8}",
-        "gradient": "{palette.gradient.purple}",
+        "fontColor": "{palette.color.white}",
+        "gradient": "{system.gradient.none}",
         "paddingBottom": "{palette.size.size4}",
         "paddingLeft": "{palette.size.size8}",
         "paddingRight": "{palette.size.size8}",
@@ -5116,6 +5353,9 @@
         "cellRowHeadingBackground": "{palette.color.white}",
         "cellStickyShadow": "{palette.shadow.elevation1}",
         "cellSubheadingBackground": "{palette.color.greyAlabaster}",
+        "fontName": "{palette.fontName.HelveticaNow}",
+        "fontSize": "{palette.fontSize.size16}",
+        "fontWeight": "{palette.fontWeight.weight400}",
         "tablePaddingBottom": "{palette.size.size24}"
       }
     },
@@ -5678,8 +5918,6 @@
         "animationColorBefore": "{palette.color.white}",
         "animationDivColorAfter": "{palette.color.greenAccessible}",
         "animationDivColorBefore": "{palette.color.white}",
-        "animationFillColorAfter": "{palette.color.greenAccessible}",
-        "animationFillColorBefore": "{palette.color.white}",
         "animationHeightAfter": "{palette.size.size24}",
         "animationHeightBefore": "{palette.size.size0}",
         "animationPaddingBottomAfter": "{palette.size.size16}",
@@ -6485,6 +6723,44 @@
         "width": "{palette.size.size64}"
       }
     },
+    "VideoPicker": {
+      "appearances": {},
+      "rules": [],
+      "tokens": {
+        "framedContainerBackgroundColor": "{palette.color.greyAlabaster}",
+        "framedContainerBorderColor": "{palette.color.greyMystic}",
+        "framedContainerBorderRadius": "{palette.radius.radius4}",
+        "framedContainerBorderWidth": "{palette.border.border1}",
+        "framedContainerPadding": "{palette.size.size24}",
+        "framedMaxHeight": "{palette.size.size640}",
+        "stackViewDividerColor": "{palette.color.greyMystic}"
+      }
+    },
+    "VideoPickerSlider": {
+      "appearances": {},
+      "rules": [],
+      "tokens": {
+        "nextIcon": "{palette.icon.ArrowRight}",
+        "previousIcon": "{palette.icon.ArrowLeft}"
+      }
+    },
+    "VideoPickerThumbnail": {
+      "appearances": {},
+      "rules": [],
+      "tokens": {
+        "borderColor": "{palette.color.purpleTelus}",
+        "borderRadius": "{palette.radius.radius4}",
+        "borderWidth": "{palette.border.border2}",
+        "pressableBorderTopColor": "{palette.color.greyMystic}",
+        "pressableBorderTopWidth": "{palette.border.border1}",
+        "pressablePaddingBottom": "{palette.size.size16}",
+        "pressablePaddingHorizontal": "{palette.size.size24}",
+        "pressablePaddingVertical": "{palette.size.size16}",
+        "splashButtonRadius": "{palette.radius.radius4}",
+        "subTitleColor": "{palette.color.greyShuttle}",
+        "titleColor": "{palette.color.purpleTelus}"
+      }
+    },
     "VideoProgressBar": {
       "appearances": {},
       "rules": [],