@telus-uds/theme-public-mobile 5.0.0-beta.1 → 5.1.0

package/build/android/Modal.json

@@ -18,9 +18,7 @@
   },
   "rules": [
     {
-      "if": {
-        "viewport": ["xs", "sm"]
-      },
+      "if": { "viewport": ["xs", "sm"] },
       "tokens": {
         "direction": "column",
         "height": "100%",
@@ -33,9 +31,7 @@
       }
     },
     {
-      "if": {
-        "viewport": ["md", "lg", "xl"]
-      },
+      "if": { "viewport": ["md", "lg", "xl"] },
       "tokens": {
         "containerPaddingBottom": 32,
         "containerPaddingTop": 32,
@@ -44,10 +40,7 @@
       }
     },
     {
-      "if": {
-        "viewport": ["md", "lg", "xl"],
-        "width": "s"
-      },
+      "if": { "viewport": ["md", "lg", "xl"], "width": "s" },
       "tokens": {
         "containerPaddingBottom": 32,
         "containerPaddingTop": 32,
@@ -55,10 +48,7 @@
       }
     },
     {
-      "if": {
-        "viewport": ["md", "lg", "xl"],
-        "width": "m"
-      },
+      "if": { "viewport": ["md", "lg", "xl"], "width": "m" },
       "tokens": {
         "containerPaddingBottom": 32,
         "containerPaddingTop": 32,
@@ -66,10 +56,7 @@
       }
     },
     {
-      "if": {
-        "viewport": ["lg", "xl"],
-        "width": "l"
-      },
+      "if": { "viewport": ["lg", "xl"], "width": "l" },
       "tokens": {
         "containerPaddingBottom": 32,
         "containerPaddingTop": 32,
@@ -77,10 +64,7 @@
       }
     },
     {
-      "if": {
-        "viewport": "xl",
-        "width": "xl"
-      },
+      "if": { "viewport": "xl", "width": "xl" },
       "tokens": {
         "containerPaddingBottom": 32,
         "containerPaddingTop": 32,
@@ -88,10 +72,7 @@
       }
     },
     {
-      "if": {
-        "maxWidth": true,
-        "viewport": "md"
-      },
+      "if": { "maxWidth": true, "viewport": "md" },
       "tokens": {
         "containerPaddingLeft": 16,
         "containerPaddingRight": 16,
@@ -99,10 +80,7 @@
       }
     },
     {
-      "if": {
-        "maxWidth": true,
-        "viewport": "lg"
-      },
+      "if": { "maxWidth": true, "viewport": "lg" },
       "tokens": {
         "containerPaddingLeft": 16,
         "containerPaddingRight": 16,
@@ -110,10 +88,7 @@
       }
     },
     {
-      "if": {
-        "maxWidth": true,
-        "viewport": "xl"
-      },
+      "if": { "maxWidth": true, "viewport": "xl" },
       "tokens": {
         "containerPaddingLeft": 16,
         "containerPaddingRight": 16,
@@ -122,12 +97,7 @@
     }
   ],
   "tokens": {
-    "backdropColor": {
-      "red": 0,
-      "green": 0,
-      "blue": 0,
-      "alpha": 0.8
-    },
+    "backdropColor": { "red": 0, "green": 0, "blue": 0, "alpha": 0.8 },
     "backdropOpacity": 1,
     "backgroundColor": {
       "red": 0.99608,
@@ -135,12 +105,7 @@
       "blue": 0.98824,
       "alpha": 1
     },
-    "borderColor": {
-      "red": 1,
-      "green": 1,
-      "blue": 1,
-      "alpha": 1
-    },
+    "borderColor": { "red": 1, "green": 1, "blue": 1, "alpha": 1 },
     "borderRadius": 4,
     "borderWidth": 0,
     "cancelButtonColor": {
@@ -190,12 +155,7 @@
       "offsetY": 4,
       "blur": 8,
       "spread": 0,
-      "color": {
-        "red": 0,
-        "green": 0,
-        "blue": 0,
-        "alpha": 0.1
-      }
+      "color": { "red": 0, "green": 0, "blue": 0, "alpha": 0.1 }
     },
     "subHeadingMarginTop": 8
   }

package/build/android/MultiSelectFilter.json

@@ -10,10 +10,7 @@
       "values": [true],
       "type": "state"
     },
-    "selected": {
-      "type": "state",
-      "values": [true]
-    },
+    "selected": { "type": "state", "values": [true] },
     "viewport": {
       "description": "The size label for the current screen viewport based on the current screen width",
       "values": ["xs", "sm", "md", "lg", "xl"],
@@ -22,9 +19,7 @@
   },
   "rules": [
     {
-      "if": {
-        "viewport": ["xs"]
-      },
+      "if": { "viewport": ["xs"] },
       "tokens": {
         "buttonDirection": "column",
         "minHeight": "100%",
@@ -32,27 +27,15 @@
       }
     },
     {
-      "if": {
-        "maxHeight": true,
-        "viewport": ["sm", "md", "lg", "xl"]
-      },
-      "tokens": {
-        "maxHeightSize": 480
-      }
+      "if": { "maxHeight": true, "viewport": ["sm", "md", "lg", "xl"] },
+      "tokens": { "maxHeightSize": 480 }
     },
     {
-      "if": {
-        "maxWidth": true,
-        "viewport": ["sm", "md", "lg", "xl"]
-      },
-      "tokens": {
-        "maxWidthSize": 544
-      }
+      "if": { "maxWidth": true, "viewport": ["sm", "md", "lg", "xl"] },
+      "tokens": { "maxWidthSize": 544 }
     },
     {
-      "if": {
-        "selected": true
-      },
+      "if": { "selected": true },
       "tokens": {
         "buttonIconBackgroundColor": {
           "red": 0.22353,
@@ -60,12 +43,7 @@
           "blue": 0.33725,
           "alpha": 1
         },
-        "labelColor": {
-          "red": 1,
-          "green": 1,
-          "blue": 1,
-          "alpha": 1
-        }
+        "labelColor": { "red": 1, "green": 1, "blue": 1, "alpha": 1 }
       }
     }
   ],
@@ -131,12 +109,7 @@
       "blue": 0.33725,
       "alpha": 1
     },
-    "iconColorSelected": {
-      "red": 1,
-      "green": 1,
-      "blue": 1,
-      "alpha": 1
-    },
+    "iconColorSelected": { "red": 1, "green": 1, "blue": 1, "alpha": 1 },
     "labelColor": {
       "red": 0.22353,
       "green": 0.25098,

package/build/android/NavigationBar.json

@@ -23,9 +23,7 @@
   },
   "rules": [
     {
-      "if": {
-        "selected": true
-      },
+      "if": { "selected": true },
       "tokens": {
         "backgroundColor": {
           "red": 0.22353,
@@ -39,20 +37,13 @@
           "blue": 0.33725,
           "alpha": 1
         },
-        "color": {
-          "red": 1,
-          "green": 1,
-          "blue": 1,
-          "alpha": 1
-        },
+        "color": { "red": 1, "green": 1, "blue": 1, "alpha": 1 },
         "fontName": "SofiaPro",
         "fontWeight": 400
       }
     },
     {
-      "if": {
-        "pressed": true
-      },
+      "if": { "pressed": true },
       "tokens": {
         "backgroundColor": {
           "red": 0.16863,
@@ -67,60 +58,26 @@
           "alpha": 1
         },
         "borderWidth": 3,
-        "color": {
-          "red": 1,
-          "green": 1,
-          "blue": 1,
-          "alpha": 1
-        },
-        "outerBorderColor": {
-          "red": 0,
-          "green": 0,
-          "blue": 0,
-          "alpha": 0
-        }
+        "color": { "red": 1, "green": 1, "blue": 1, "alpha": 1 },
+        "outerBorderColor": { "red": 0, "green": 0, "blue": 0, "alpha": 0 }
       }
     },
     {
-      "if": {
-        "viewport": ["xs", "sm", "md"]
-      },
-      "tokens": {
-        "textAlign": "space-between",
-        "width": 288
-      }
+      "if": { "viewport": ["xs", "sm", "md"] },
+      "tokens": { "textAlign": "space-between", "width": 288 }
     },
     {
-      "if": {
-        "expanded": true
-      },
-      "tokens": {
-        "icoMenu": "PaletteIconChevronUp"
-      }
+      "if": { "expanded": true },
+      "tokens": { "icoMenu": "PaletteIconChevronUp" }
     }
   ],
   "tokens": {
     "alignSelf": "flex-start",
-    "backgroundColor": {
-      "red": 1,
-      "green": 1,
-      "blue": 1,
-      "alpha": 1
-    },
-    "borderColor": {
-      "red": 1,
-      "green": 1,
-      "blue": 1,
-      "alpha": 1
-    },
+    "backgroundColor": { "red": 1, "green": 1, "blue": 1, "alpha": 1 },
+    "borderColor": { "red": 1, "green": 1, "blue": 1, "alpha": 1 },
     "borderRadius": 8,
     "borderWidth": 1,
-    "color": {
-      "red": 0.22353,
-      "green": 0.25098,
-      "blue": 0.33725,
-      "alpha": 1
-    },
+    "color": { "red": 0.22353, "green": 0.25098, "blue": 0.33725, "alpha": 1 },
     "fontName": "SofiaPro",
     "fontSize": 18,
     "fontWeight": 400,
@@ -128,18 +85,8 @@
     "lineHeight": 1.56,
     "minWidth": 0,
     "opacity": 1,
-    "outerBackgroundColor": {
-      "red": 0,
-      "green": 0,
-      "blue": 0,
-      "alpha": 0
-    },
-    "outerBorderColor": {
-      "red": 0,
-      "green": 0,
-      "blue": 0,
-      "alpha": 0
-    },
+    "outerBackgroundColor": { "red": 0, "green": 0, "blue": 0, "alpha": 0 },
+    "outerBorderColor": { "red": 0, "green": 0, "blue": 0, "alpha": 0 },
     "outerBorderGap": 4,
     "outerBorderWidth": 0,
     "paddingBottom": 4,

package/build/android/Notification.json

@@ -4,10 +4,7 @@
       "type": "variant",
       "values": ["system", "success", "warning", "error", "subtle"]
     },
-    "system": {
-      "values": [true],
-      "type": "state"
-    },
+    "system": { "values": [true], "type": "state" },
     "validation": {
       "description": "Validation states for form inputs",
       "values": ["error", "success", "warning", "feature"],
@@ -21,9 +18,7 @@
   },
   "rules": [
     {
-      "if": {
-        "system": true
-      },
+      "if": { "system": true },
       "tokens": {
         "borderLeftWidth": 0,
         "borderRadius": 0,
@@ -33,9 +28,7 @@
       }
     },
     {
-      "if": {
-        "style": "system"
-      },
+      "if": { "style": "system" },
       "tokens": {
         "borderLeftWidth": 0,
         "borderRadius": 0,
@@ -45,9 +38,7 @@
       }
     },
     {
-      "if": {
-        "style": "subtle"
-      },
+      "if": { "style": "subtle" },
       "tokens": {
         "borderBottomWidth": 0,
         "borderLeftWidth": 0,
@@ -58,9 +49,7 @@
       }
     },
     {
-      "if": {
-        "style": "success"
-      },
+      "if": { "style": "success" },
       "tokens": {
         "backgroundColor": {
           "red": 0.16863,
@@ -68,31 +57,14 @@
           "blue": 0.43137,
           "alpha": 1
         },
-        "color": {
-          "red": 1,
-          "green": 1,
-          "blue": 1,
-          "alpha": 1
-        },
-        "dismissIconColor": {
-          "red": 1,
-          "green": 1,
-          "blue": 1,
-          "alpha": 1
-        },
+        "color": { "red": 1, "green": 1, "blue": 1, "alpha": 1 },
+        "dismissIconColor": { "red": 1, "green": 1, "blue": 1, "alpha": 1 },
         "icon": "PaletteIconCheckMark",
-        "iconColor": {
-          "red": 1,
-          "green": 1,
-          "blue": 1,
-          "alpha": 1
-        }
+        "iconColor": { "red": 1, "green": 1, "blue": 1, "alpha": 1 }
       }
     },
     {
-      "if": {
-        "validation": "success"
-      },
+      "if": { "validation": "success" },
       "tokens": {
         "backgroundColor": {
           "red": 0.16863,
@@ -100,31 +72,14 @@
           "blue": 0.43137,
           "alpha": 1
         },
-        "color": {
-          "red": 1,
-          "green": 1,
-          "blue": 1,
-          "alpha": 1
-        },
-        "dismissIconColor": {
-          "red": 1,
-          "green": 1,
-          "blue": 1,
-          "alpha": 1
-        },
+        "color": { "red": 1, "green": 1, "blue": 1, "alpha": 1 },
+        "dismissIconColor": { "red": 1, "green": 1, "blue": 1, "alpha": 1 },
         "icon": "PaletteIconCheckMark",
-        "iconColor": {
-          "red": 1,
-          "green": 1,
-          "blue": 1,
-          "alpha": 1
-        }
+        "iconColor": { "red": 1, "green": 1, "blue": 1, "alpha": 1 }
       }
     },
     {
-      "if": {
-        "style": "warning"
-      },
+      "if": { "style": "warning" },
       "tokens": {
         "backgroundColor": {
           "red": 0.98824,
@@ -143,9 +98,7 @@
       }
     },
     {
-      "if": {
-        "validation": "warning"
-      },
+      "if": { "validation": "warning" },
       "tokens": {
         "backgroundColor": {
           "red": 0.98824,
@@ -164,9 +117,7 @@
       }
     },
     {
-      "if": {
-        "style": "error"
-      },
+      "if": { "style": "error" },
       "tokens": {
         "backgroundColor": {
           "red": 0.74902,
@@ -174,26 +125,14 @@
           "blue": 0.13333,
           "alpha": 1
         },
-        "color": {
-          "red": 1,
-          "green": 1,
-          "blue": 1,
-          "alpha": 1
-        },
+        "color": { "red": 1, "green": 1, "blue": 1, "alpha": 1 },
         "dismissIcon": null,
         "icon": "PaletteIconWarningError",
-        "iconColor": {
-          "red": 1,
-          "green": 1,
-          "blue": 1,
-          "alpha": 1
-        }
+        "iconColor": { "red": 1, "green": 1, "blue": 1, "alpha": 1 }
       }
     },
     {
-      "if": {
-        "validation": "error"
-      },
+      "if": { "validation": "error" },
       "tokens": {
         "backgroundColor": {
           "red": 0.74902,
@@ -201,26 +140,14 @@
           "blue": 0.13333,
           "alpha": 1
         },
-        "color": {
-          "red": 1,
-          "green": 1,
-          "blue": 1,
-          "alpha": 1
-        },
+        "color": { "red": 1, "green": 1, "blue": 1, "alpha": 1 },
         "dismissIcon": null,
         "icon": "PaletteIconWarningError",
-        "iconColor": {
-          "red": 1,
-          "green": 1,
-          "blue": 1,
-          "alpha": 1
-        }
+        "iconColor": { "red": 1, "green": 1, "blue": 1, "alpha": 1 }
       }
     },
     {
-      "if": {
-        "validation": "feature"
-      },
+      "if": { "validation": "feature" },
       "tokens": {
         "backgroundColor": {
           "red": 0.98824,
@@ -228,12 +155,7 @@
           "blue": 0.93333,
           "alpha": 1
         },
-        "borderColor": {
-          "red": 0,
-          "green": 0,
-          "blue": 0,
-          "alpha": 0
-        },
+        "borderColor": { "red": 0, "green": 0, "blue": 0, "alpha": 0 },
         "color": {
           "red": 0.22353,
           "green": 0.25098,
@@ -259,22 +181,12 @@
       "alpha": 1
     },
     "borderBottomWidth": 0,
-    "borderColor": {
-      "red": 0,
-      "green": 0,
-      "blue": 0,
-      "alpha": 0
-    },
+    "borderColor": { "red": 0, "green": 0, "blue": 0, "alpha": 0 },
     "borderLeftWidth": 0,
     "borderRadius": 6,
     "borderRightWidth": 0,
     "borderTopWidth": 0,
-    "color": {
-      "red": 0.22353,
-      "green": 0.25098,
-      "blue": 0.33725,
-      "alpha": 1
-    },
+    "color": { "red": 0.22353, "green": 0.25098, "blue": 0.33725, "alpha": 1 },
     "containerPaddingLeft": 0,
     "containerPaddingRight": 0,
     "dismissButtonGap": 12,
@@ -289,12 +201,7 @@
     "fontSize": 18,
     "fontWeight": 400,
     "icon": null,
-    "iconColor": {
-      "red": 0,
-      "green": 0,
-      "blue": 0,
-      "alpha": 0
-    },
+    "iconColor": { "red": 0, "green": 0, "blue": 0, "alpha": 0 },
     "iconGap": 8,
     "iconSize": 24,
     "justifyContent": "flex-start",

package/build/android/OrderedList.json

@@ -13,48 +13,21 @@
   },
   "rules": [
     {
-      "if": {
-        "size": "large"
-      },
-      "tokens": {
-        "itemFontSize": 20,
-        "itemLineHeight": 1.4
-      }
+      "if": { "size": "large" },
+      "tokens": { "itemFontSize": 20, "itemLineHeight": 1.4 }
     },
     {
-      "if": {
-        "size": "small"
-      },
-      "tokens": {
-        "itemFontSize": 16,
-        "itemLineHeight": 1.55555555
-      }
+      "if": { "size": "small" },
+      "tokens": { "itemFontSize": 16, "itemLineHeight": 1.55555555 }
     },
+    { "if": { "compact": true }, "tokens": { "itemLineHeight": 1.55555555 } },
     {
-      "if": {
-        "compact": true
-      },
-      "tokens": {
-        "itemLineHeight": 1.55555555
-      }
+      "if": { "compact": true, "size": "small" },
+      "tokens": { "itemLineHeight": 1.5 }
     },
     {
-      "if": {
-        "compact": true,
-        "size": "small"
-      },
-      "tokens": {
-        "itemLineHeight": 1.5
-      }
-    },
-    {
-      "if": {
-        "compact": true,
-        "size": "large"
-      },
-      "tokens": {
-        "itemLineHeight": 1.4
-      }
+      "if": { "compact": true, "size": "large" },
+      "tokens": { "itemLineHeight": 1.4 }
     }
   ],
   "tokens": {
@@ -65,12 +38,7 @@
     "itemBulletHeight": 4,
     "itemBulletTextAlign": "right",
     "itemBulletWidth": 4,
-    "itemColor": {
-      "red": 0,
-      "green": 0,
-      "blue": 0,
-      "alpha": 0
-    },
+    "itemColor": { "red": 0, "green": 0, "blue": 0, "alpha": 0 },
     "itemFontName": "SofiaPro",
     "itemFontSize": 18,
     "itemFontWeight": 400,