@telus-uds/theme-allium 8.1.0 → 8.2.0

package/build/web/spacingScale.js

@@ -1,7 +1,7 @@
 /*
  *
  * Do not edit directly
- * Generated on Tue, 14 Jul 2026 18:24:17 GMT
+ * Generated on Mon, 10 Aug 2026 18:48:23 GMT
  *
  */
 

package/build/web/theme.js

@@ -1,7 +1,7 @@
 /*
  *
  * Do not edit directly
- * Generated on Tue, 14 Jul 2026 18:24:18 GMT
+ * Generated on Mon, 10 Aug 2026 18:48:23 GMT
  *
  */
 
@@ -361,7 +361,7 @@ const theme = {
     Box: {
       appearances: {
         background: {
-          description: 'Background colour of box. Transparent if not specified.',
+          description: 'Background color of box. Transparent if not specified.',
           type: 'variant',
           values: [
             'lightest',         'lighter',
@@ -2407,6 +2407,7 @@ const theme = {
     },
     ChevronLink: {
       appearances: {
+        disabled: { type: 'state', values: [ true ] },
         focus: {
           description: "Currently only web has good support for this. Applies when an interactive component's focus handler is triggered, such as keyboard tabbing or selection.",
           platforms: [ 'rn', 'web' ],
@@ -2681,7 +2682,8 @@ const theme = {
         {
           if: { focus: true, pressed: true, quiet: true, style: 'inverse' },
           tokens: { outerBorderColor: '#b2b9bf' }
-        }
+        },
+        { if: { disabled: true }, tokens: { color: '#676e73' } }
       ],
       tokens: {
         blockLineHeight: 1.5,
@@ -2820,6 +2822,7 @@ const theme = {
         {
           if: { feature: true },
           tokens: {
+            containerBorderColor: '#4b286d',
             labelBorderColor: '#4b286d',
             textFontSize: 64,
             textLineHeight: 1.125,
@@ -3883,7 +3886,7 @@ const theme = {
           values: [ true, false ]
         },
         raised: {
-          description: 'Uses shadow and background colour to appear raised above the page',
+          description: 'Uses shadow and background color to appear raised above the page',
           type: 'variant',
           values: [ true ]
         },
@@ -8312,20 +8315,17 @@ const theme = {
           if: { highlight: 'row' },
           tokens: { rowHoverBackgroundColor: 'rgba(0, 0, 0, 0.05)' }
         },
+        {
+          if: { spacing: 'compact' },
+          tokens: { cellPaddingBottom: 8, cellPaddingTop: 8 }
+        },
         {
           if: { spacing: 'compact', type: 'default' },
-          tokens: {
-            cellPaddingBottom: 8,
-            cellPaddingTop: 8,
-            fontSize: 16,
-            lineHeight: 1.25
-          }
+          tokens: { fontSize: 16, lineHeight: 1.25 }
         },
         {
           if: { spacing: 'compact', type: 'rowHeading' },
           tokens: {
-            cellPaddingBottom: 8,
-            cellPaddingTop: 8,
             fontName: 'HNforTELUSSA',
             fontSize: 16,
             fontWeight: '700',
@@ -8336,8 +8336,6 @@ const theme = {
           if: { spacing: 'compact', text: 'small', type: 'subHeading' },
           tokens: {
             cellBackground: '#fafafa',
-            cellPaddingBottom: 8,
-            cellPaddingTop: 8,
             fontName: 'HNforTELUSSA',
             fontSize: 14,
             fontWeight: '500',
@@ -9328,6 +9326,7 @@ const theme = {
         switchBorderRadius: 32,
         switchBorderWidth: 0,
         switchColor: '#ffffff',
+        switchOffset: null,
         switchShadow: {
           blur: 2,
           color: 'rgba(0, 0, 0, 0.2)',
@@ -9456,8 +9455,8 @@ const theme = {
           type: 'variant',
           values: [ true ]
         },
-        colour: {
-          description: 'Each typography variant has a default color, and at least a secondary color variant. In exceptional cases where a different colour is needed,\n' +
+        color: {
+          description: 'Each typography variant has a default color, and at least a secondary color variant. In exceptional cases where a different color is needed,\n' +
             '  use the tokens prop.',
           type: 'variant',
           values: [
@@ -9512,17 +9511,17 @@ const theme = {
         },
         {
           if: {
-            colour: 'dark',
+            color: 'dark',
             size: [ 'display1', 'display2', 'h1', 'h2', 'h3' ]
           },
           tokens: { color: '#2c2e30' }
         },
         {
-          if: { colour: 'light', size: 'h6' },
+          if: { color: 'light', size: 'h6' },
           tokens: { color: '#676e73' }
         },
         {
-          if: { colour: 'dark', size: 'eyebrow' },
+          if: { color: 'dark', size: 'eyebrow' },
           tokens: { color: '#7c53a5' }
         },
         { if: { inverse: true }, tokens: { color: '#ffffff' } },
@@ -9749,19 +9748,19 @@ const theme = {
           if: { weight: 'bold' },
           tokens: { fontName: 'HNforTELUSSA', fontWeight: '700' }
         },
-        { if: { colour: 'default' }, tokens: { color: '#414547' } },
-        { if: { colour: 'brand' }, tokens: { color: '#4b286d' } },
-        { if: { colour: 'dark' }, tokens: { color: '#2c2e30' } },
-        { if: { colour: 'light' }, tokens: { color: '#676e73' } },
-        { if: { colour: 'positive' }, tokens: { color: '#2b8000' } },
-        { if: { colour: 'warning' }, tokens: { color: '#c77539' } },
-        { if: { colour: 'danger' }, tokens: { color: '#c12335' } },
-        { if: { colour: 'black' }, tokens: { color: '#000000' } },
-        { if: { colour: 'white' }, tokens: { color: '#ffffff' } },
-        { if: { colour: 'brand2' }, tokens: { color: '#2b8000' } },
-        { if: { colour: 'brand3' }, tokens: { color: '#7c53a5' } },
+        { if: { color: 'default' }, tokens: { color: '#414547' } },
+        { if: { color: 'brand' }, tokens: { color: '#4b286d' } },
+        { if: { color: 'dark' }, tokens: { color: '#2c2e30' } },
+        { if: { color: 'light' }, tokens: { color: '#676e73' } },
+        { if: { color: 'positive' }, tokens: { color: '#2b8000' } },
+        { if: { color: 'warning' }, tokens: { color: '#c77539' } },
+        { if: { color: 'danger' }, tokens: { color: '#c12335' } },
+        { if: { color: 'black' }, tokens: { color: '#000000' } },
+        { if: { color: 'white' }, tokens: { color: '#ffffff' } },
+        { if: { color: 'brand2' }, tokens: { color: '#2b8000' } },
+        { if: { color: 'brand3' }, tokens: { color: '#7c53a5' } },
         {
-          if: { colour: 'alternative1' },
+          if: { color: 'alternative1' },
           tokens: {
             color: '#4b286d',
             gradient: {
@@ -9774,14 +9773,8 @@ const theme = {
             }
           }
         },
-        {
-          if: { colour: 'alternative2' },
-          tokens: { color: '#4b286d' }
-        },
-        {
-          if: { colour: 'alternative3' },
-          tokens: { color: '#4b286d' }
-        }
+        { if: { color: 'alternative2' }, tokens: { color: '#4b286d' } },
+        { if: { color: 'alternative3' }, tokens: { color: '#4b286d' } }
       ],
       tokens: {
         color: '#414547',
@@ -10065,6 +10058,6 @@ const theme = {
       tokens: { size: 96 }
     }
   },
-  metadata: { name: 'theme-allium', themeTokensVersion: '5.0.0' }
+  metadata: { name: 'theme-allium', themeTokensVersion: '5.1.0' }
 }
 export default theme

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@telus-uds/theme-allium",
-  "version": "8.1.0",
+  "version": "8.2.0",
   "description": "Allium theme",
   "author": "TELUS Digital",
   "homepage": "https://github.com/telus/allium-design-system#readme",
@@ -9,12 +9,12 @@
   "module": "build/web/index.js",
   "dependencies": {},
   "devDependencies": {
-    "@telus-uds/palette-allium": "^6.1.0",
-    "@telus-uds/system-theme-tokens": "^5.1.0",
-    "@telus-uds/system-tokens": "^2.0.1"
+    "@telus-uds/palette-allium": "^6.2.0",
+    "@telus-uds/system-theme-tokens": "^5.2.0",
+    "@telus-uds/system-tokens": "^2.0.2"
   },
   "peerDependencies": {
-    "@telus-uds/palette-allium": "^6.1.0"
+    "@telus-uds/palette-allium": "^6.2.0"
   },
   "files": [
     "build",

package/theme.json

@@ -346,7 +346,7 @@
     "Box": {
       "appearances": {
         "background": {
-          "description": "Background colour of box. Transparent if not specified.",
+          "description": "Background color of box. Transparent if not specified.",
           "type": "variant",
           "values": [
             "lightest",
@@ -2892,6 +2892,7 @@
     },
     "ChevronLink": {
       "appearances": {
+        "disabled": "{appearances.ChevronLink.disabled}",
         "focus": "{appearances.ChevronLink.focus}",
         "hover": "{appearances.ChevronLink.hover}",
         "pressed": "{appearances.ChevronLink.pressed}",
@@ -3494,6 +3495,14 @@
           "tokens": {
             "outerBorderColor": "{palette.color.greyCloud}"
           }
+        },
+        {
+          "if": {
+            "disabled": true
+          },
+          "tokens": {
+            "color": "{palette.color.greyShuttle}"
+          }
         }
       ],
       "tokens": {
@@ -3630,6 +3639,7 @@
             "feature": true
           },
           "tokens": {
+            "containerBorderColor": "{palette.color.purpleTelus}",
             "labelBorderColor": "{palette.color.purpleTelus}",
             "textFontSize": "{palette.fontSize.size64}",
             "textLineHeight": "{palette.lineHeight.ratio9to8}",
@@ -5175,7 +5185,7 @@
         },
         "pressed": "{appearances.IconButton.pressed}",
         "raised": {
-          "description": "Uses shadow and background colour to appear raised above the page",
+          "description": "Uses shadow and background color to appear raised above the page",
           "type": "variant",
           "values": [true]
         },
@@ -10633,14 +10643,21 @@
             "rowHoverBackgroundColor": "{palette.color.dark5}"
           }
         },
+        {
+          "if": {
+            "spacing": "compact"
+          },
+          "tokens": {
+            "cellPaddingBottom": "{palette.size.size8}",
+            "cellPaddingTop": "{palette.size.size8}"
+          }
+        },
         {
           "if": {
             "spacing": "compact",
             "type": "default"
           },
           "tokens": {
-            "cellPaddingBottom": "{palette.size.size8}",
-            "cellPaddingTop": "{palette.size.size8}",
             "fontSize": "{palette.fontSize.size16}",
             "lineHeight": "{palette.lineHeight.ratio5to4}"
           }
@@ -10651,8 +10668,6 @@
             "type": "rowHeading"
           },
           "tokens": {
-            "cellPaddingBottom": "{palette.size.size8}",
-            "cellPaddingTop": "{palette.size.size8}",
             "fontName": "{palette.fontName.HNforTELUSSA}",
             "fontSize": "{palette.fontSize.size16}",
             "fontWeight": "{palette.fontWeight.weight700}",
@@ -10667,8 +10682,6 @@
           },
           "tokens": {
             "cellBackground": "{palette.color.greyAlabaster}",
-            "cellPaddingBottom": "{palette.size.size8}",
-            "cellPaddingTop": "{palette.size.size8}",
             "fontName": "{palette.fontName.HNforTELUSSA}",
             "fontSize": "{palette.fontSize.size14}",
             "fontWeight": "{palette.fontWeight.weight500}",
@@ -11774,6 +11787,7 @@
         "switchBorderRadius": "{palette.radius.pill32}",
         "switchBorderWidth": "{palette.border.none}",
         "switchColor": "{palette.color.white}",
+        "switchOffset": "{system.size.none}",
         "switchShadow": "{palette.shadow.surfaceRaised}",
         "switchSize": "{palette.size.size18}",
         "trackBorderColor": "{palette.color.transparent}",
@@ -11927,8 +11941,8 @@
           "type": "variant",
           "values": [true]
         },
-        "colour": {
-          "description": "Each typography variant has a default color, and at least a secondary color variant. In exceptional cases where a different colour is needed,\n  use the tokens prop.",
+        "color": {
+          "description": "Each typography variant has a default color, and at least a secondary color variant. In exceptional cases where a different color is needed,\n  use the tokens prop.",
           "type": "variant",
           "values": [
             "default",
@@ -11993,7 +12007,7 @@
         },
         {
           "if": {
-            "colour": "dark",
+            "color": "dark",
             "size": ["display1", "display2", "h1", "h2", "h3"]
           },
           "tokens": {
@@ -12002,7 +12016,7 @@
         },
         {
           "if": {
-            "colour": "light",
+            "color": "light",
             "size": "h6"
           },
           "tokens": {
@@ -12011,7 +12025,7 @@
         },
         {
           "if": {
-            "colour": "dark",
+            "color": "dark",
             "size": "eyebrow"
           },
           "tokens": {
@@ -12364,7 +12378,7 @@
         },
         {
           "if": {
-            "colour": "default"
+            "color": "default"
           },
           "tokens": {
             "color": "{palette.color.greyCharcoal}"
@@ -12372,7 +12386,7 @@
         },
         {
           "if": {
-            "colour": "brand"
+            "color": "brand"
           },
           "tokens": {
             "color": "{palette.color.purpleTelus}"
@@ -12380,7 +12394,7 @@
         },
         {
           "if": {
-            "colour": "dark"
+            "color": "dark"
           },
           "tokens": {
             "color": "{palette.color.greyThunder}"
@@ -12388,7 +12402,7 @@
         },
         {
           "if": {
-            "colour": "light"
+            "color": "light"
           },
           "tokens": {
             "color": "{palette.color.greyShuttle}"
@@ -12396,7 +12410,7 @@
         },
         {
           "if": {
-            "colour": "positive"
+            "color": "positive"
           },
           "tokens": {
             "color": "{palette.color.greenAccessible}"
@@ -12404,7 +12418,7 @@
         },
         {
           "if": {
-            "colour": "warning"
+            "color": "warning"
           },
           "tokens": {
             "color": "{palette.color.amberDark}"
@@ -12412,7 +12426,7 @@
         },
         {
           "if": {
-            "colour": "danger"
+            "color": "danger"
           },
           "tokens": {
             "color": "{palette.color.redDark}"
@@ -12420,7 +12434,7 @@
         },
         {
           "if": {
-            "colour": "black"
+            "color": "black"
           },
           "tokens": {
             "color": "{palette.color.black}"
@@ -12428,7 +12442,7 @@
         },
         {
           "if": {
-            "colour": "white"
+            "color": "white"
           },
           "tokens": {
             "color": "{palette.color.white}"
@@ -12436,7 +12450,7 @@
         },
         {
           "if": {
-            "colour": "brand2"
+            "color": "brand2"
           },
           "tokens": {
             "color": "{palette.color.greenAccessible}"
@@ -12444,7 +12458,7 @@
         },
         {
           "if": {
-            "colour": "brand3"
+            "color": "brand3"
           },
           "tokens": {
             "color": "{palette.color.purpleDeluge}"
@@ -12452,7 +12466,7 @@
         },
         {
           "if": {
-            "colour": "alternative1"
+            "color": "alternative1"
           },
           "tokens": {
             "color": "{palette.color.purpleTelus}",
@@ -12461,7 +12475,7 @@
         },
         {
           "if": {
-            "colour": "alternative2"
+            "color": "alternative2"
           },
           "tokens": {
             "color": "{palette.color.purpleTelus}"
@@ -12469,7 +12483,7 @@
         },
         {
           "if": {
-            "colour": "alternative3"
+            "color": "alternative3"
           },
           "tokens": {
             "color": "{palette.color.purpleTelus}"