@telus-uds/theme-allium 4.21.0 → 4.23.0

package/build/android/ExpandCollapsePanel.json

@@ -0,0 +1,84 @@
+{
+  "appearances": {
+    "compact": {
+      "type": "variant",
+      "values": [true]
+    },
+    "mini": {
+      "type": "variant",
+      "values": [true]
+    }
+  },
+  "rules": [
+    {
+      "if": {
+        "compact": true
+      },
+      "tokens": {
+        "contentPaddingBottom": 16,
+        "contentPaddingLeft": 24,
+        "contentPaddingRight": 0,
+        "contentPaddingTop": 8
+      }
+    },
+    {
+      "if": {
+        "mini": true
+      },
+      "tokens": {
+        "contentPaddingLeft": 0
+      }
+    }
+  ],
+  "tokens": {
+    "borderColor": {
+      "red": 0,
+      "green": 0,
+      "blue": 0,
+      "alpha": 0
+    },
+    "borderRadius": 0,
+    "borderWidth": 0,
+    "collapseDuration": 250,
+    "contentPaddingBottom": 16,
+    "contentPaddingLeft": 24,
+    "contentPaddingRight": 0,
+    "contentPaddingTop": 0,
+    "contentPanelBackgroundColor": {
+      "red": 0,
+      "green": 0,
+      "blue": 0,
+      "alpha": 0
+    },
+    "contentPanelBorderColor": {
+      "red": 0,
+      "green": 0,
+      "blue": 0,
+      "alpha": 0
+    },
+    "contentPanelBorderWidth": 0,
+    "contentPanelFontColor": {
+      "red": 0.17255,
+      "green": 0.18039,
+      "blue": 0.18824,
+      "alpha": 1
+    },
+    "contentPanelFontName": "HelveticaNow",
+    "contentPanelFontSize": 16,
+    "contentPanelFontWeight": 700,
+    "contentPanelLineHeight": 1.5,
+    "contentPanelPaddingBottom": 16,
+    "contentPanelPaddingLeft": 24,
+    "contentPanelPaddingRight": 0,
+    "contentPanelPaddingTop": 16,
+    "expandDividerColor": {
+      "red": 0,
+      "green": 0,
+      "blue": 0,
+      "alpha": 0
+    },
+    "expandDividerWidth": 0,
+    "expandDuration": 300,
+    "marginBottom": 0
+  }
+}

package/build/android/Feedback.json

@@ -0,0 +1,136 @@
+{
+  "appearances": {
+    "icon": {
+      "type": "variant",
+      "values": [true]
+    },
+    "validation": {
+      "description": "Validation states for form inputs",
+      "values": ["error", "success", "warning"],
+      "type": "state"
+    }
+  },
+  "rules": [
+    {
+      "if": {
+        "validation": "success"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0.95686,
+          "green": 0.97647,
+          "blue": 0.94902,
+          "alpha": 1
+        },
+        "borderColor": {
+          "red": 0.95686,
+          "green": 0.97647,
+          "blue": 0.94902,
+          "alpha": 1
+        },
+        "color": {
+          "red": 0.08627,
+          "green": 0.24314,
+          "blue": 0.02353,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "validation": "error"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 1,
+          "green": 0.96471,
+          "blue": 0.97255,
+          "alpha": 1
+        },
+        "borderColor": {
+          "red": 1,
+          "green": 0.96471,
+          "blue": 0.97255,
+          "alpha": 1
+        },
+        "color": {
+          "red": 0.75686,
+          "green": 0.13725,
+          "blue": 0.20784,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "icon": true,
+        "validation": "success"
+      },
+      "tokens": {
+        "icon": "PaletteIconStatusSuccess",
+        "iconColor": {
+          "red": 0.16863,
+          "green": 0.50196,
+          "blue": 0,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "icon": true,
+        "validation": "error"
+      },
+      "tokens": {
+        "icon": "PaletteIconStatusError",
+        "iconColor": {
+          "red": 0.75686,
+          "green": 0.13725,
+          "blue": 0.20784,
+          "alpha": 1
+        }
+      }
+    }
+  ],
+  "tokens": {
+    "backgroundColor": {
+      "red": 0.93725,
+      "green": 0.92941,
+      "blue": 1,
+      "alpha": 1
+    },
+    "borderColor": {
+      "red": 0,
+      "green": 0,
+      "blue": 0,
+      "alpha": 0
+    },
+    "borderRadius": 4,
+    "borderWidth": 1,
+    "color": {
+      "red": 0.17255,
+      "green": 0.18039,
+      "blue": 0.18824,
+      "alpha": 1
+    },
+    "contentFontSize": 16,
+    "fontName": "HelveticaNow",
+    "fontWeight": 400,
+    "icon": null,
+    "iconColor": {
+      "red": 0,
+      "green": 0,
+      "blue": 0,
+      "alpha": 0
+    },
+    "iconGap": 8,
+    "iconSize": 24,
+    "lineHeight": 1.5,
+    "paddingBottom": 12,
+    "paddingLeft": 16,
+    "paddingRight": 16,
+    "paddingTop": 12,
+    "space": 2,
+    "titleFontSize": 16
+  }
+}

package/build/android/Fieldset.json

@@ -0,0 +1,41 @@
+{
+  "appearances": {
+    "error": {
+      "type": "variant",
+      "values": [true]
+    }
+  },
+  "rules": [
+    {
+      "if": {
+        "error": true
+      },
+      "tokens": {
+        "outlineColor": {
+          "red": 0.88235,
+          "green": 0.13725,
+          "blue": 0.22353,
+          "alpha": 1
+        }
+      }
+    }
+  ],
+  "tokens": {
+    "borderBottomLeftRadius": 0,
+    "borderBottomRightRadius": 0,
+    "borderTopLeftRadius": 0,
+    "borderTopRightRadius": 0,
+    "outlineColor": {
+      "red": 0,
+      "green": 0,
+      "blue": 0,
+      "alpha": 0
+    },
+    "outlineOffset": null,
+    "outlineWidth": 0,
+    "paddingBottom": 0,
+    "paddingLeft": 0,
+    "paddingRight": 0,
+    "paddingTop": 0
+  }
+}

package/build/android/Footnote.json

@@ -0,0 +1,125 @@
+{
+  "appearances": {
+    "viewport": {
+      "description": "The size label for the current screen viewport based on the current screen width",
+      "values": ["xs", "sm", "md", "lg", "xl"],
+      "type": "state"
+    }
+  },
+  "rules": [
+    {
+      "if": {
+        "viewport": ["xs"]
+      },
+      "tokens": {
+        "footnoteBodyPaddingBottom": 32,
+        "footnoteBodyPaddingLeft": 16,
+        "footnoteBodyPaddingRight": 16,
+        "footnoteBodyPaddingTop": 0,
+        "footnoteHeaderPaddingBottom": 16,
+        "footnoteHeaderPaddingLeft": 16,
+        "footnoteHeaderPaddingRight": 4,
+        "footnoteHeaderPaddingTop": 16
+      }
+    },
+    {
+      "if": {
+        "viewport": ["md", "lg"]
+      },
+      "tokens": {
+        "footnoteBodyPaddingBottom": 40,
+        "footnoteBodyPaddingLeft": 16,
+        "footnoteBodyPaddingRight": 16,
+        "footnoteBodyPaddingTop": 0,
+        "footnoteHeaderPaddingBottom": 24,
+        "footnoteHeaderPaddingLeft": 16,
+        "footnoteHeaderPaddingRight": 4,
+        "footnoteHeaderPaddingTop": 24
+      }
+    },
+    {
+      "if": {
+        "viewport": ["xl"]
+      },
+      "tokens": {
+        "footnoteBodyPaddingBottom": 40,
+        "footnoteBodyPaddingLeft": 16,
+        "footnoteBodyPaddingRight": 16,
+        "footnoteBodyPaddingTop": 0,
+        "footnoteHeaderPaddingBottom": 24,
+        "footnoteHeaderPaddingLeft": 16,
+        "footnoteHeaderPaddingRight": 16,
+        "footnoteHeaderPaddingTop": 24
+      }
+    }
+  ],
+  "tokens": {
+    "closeButtonBackgroundColor": {
+      "red": 0.95686,
+      "green": 0.95686,
+      "blue": 0.96863,
+      "alpha": 1
+    },
+    "closeButtonBorderColor": {
+      "red": 0.40392,
+      "green": 0.43137,
+      "blue": 0.45098,
+      "alpha": 1
+    },
+    "closeButtonBorderSize": 1,
+    "closeButtonHeight": 24,
+    "closeButtonIconSize": 16,
+    "closeButtonMarginBottom": 12,
+    "closeButtonMarginLeft": 4,
+    "closeButtonMarginRight": 4,
+    "closeButtonMarginTop": 12,
+    "closeButtonWidth": 24,
+    "closeIcon": "PaletteIconClose",
+    "footnoteBackground": {
+      "red": 0.95686,
+      "green": 0.95686,
+      "blue": 0.96863,
+      "alpha": 1
+    },
+    "footnoteBodyBackground": {
+      "red": 0.95686,
+      "green": 0.95686,
+      "blue": 0.96863,
+      "alpha": 1
+    },
+    "footnoteBodyPaddingBottom": 40,
+    "footnoteBodyPaddingLeft": 16,
+    "footnoteBodyPaddingRight": 16,
+    "footnoteBodyPaddingTop": 0,
+    "footnoteBorderColorMd": {
+      "red": 0.69804,
+      "green": 0.72549,
+      "blue": 0.74902,
+      "alpha": 1
+    },
+    "footnoteBorderTopSizeMd": 1,
+    "footnoteHeaderPaddingBottom": 24,
+    "footnoteHeaderPaddingLeft": 16,
+    "footnoteHeaderPaddingRight": 4,
+    "footnoteHeaderPaddingTop": 24,
+    "headerFontName": "HelveticaNow",
+    "headerFontSize": 16,
+    "headerFontWeight": 500,
+    "headerLineHeight": 1.5,
+    "headerMargin": 16,
+    "listItemColor": {
+      "red": 0.2549,
+      "green": 0.27059,
+      "blue": 0.27843,
+      "alpha": 1
+    },
+    "listItemFontName": "HelveticaNow",
+    "listItemFontSize": 16,
+    "listItemFontWeight": 400,
+    "listItemLineHeight": 1.5,
+    "listItemMarkerFontSize": 16,
+    "listItemMarkerLineHeight": 1.5,
+    "listItemPaddingLeft": 8,
+    "listPaddingLeft": 32
+  }
+}

package/build/android/FootnoteLink.json

@@ -0,0 +1,18 @@
+{
+  "appearances": {},
+  "rules": [],
+  "tokens": {
+    "color": {
+      "red": 0,
+      "green": 0,
+      "blue": 0,
+      "alpha": 0
+    },
+    "fontName": "HelveticaNow",
+    "fontSize": 16,
+    "fontWeight": 400,
+    "lineHeight": 1,
+    "paddingLeft": 2,
+    "paddingRight": 2
+  }
+}

package/build/android/HorizontalScrollButton.json

@@ -0,0 +1,78 @@
+{
+  "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"
+    }
+  },
+  "rules": [
+    {
+      "if": {
+        "pressed": true
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0.40392,
+          "green": 0.43137,
+          "blue": 0.45098,
+          "alpha": 1
+        },
+        "iconColor": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        }
+      }
+    }
+  ],
+  "tokens": {
+    "backgroundColor": {
+      "red": 1,
+      "green": 1,
+      "blue": 1,
+      "alpha": 1
+    },
+    "borderColor": {
+      "red": 0.69804,
+      "green": 0.72549,
+      "blue": 0.74902,
+      "alpha": 1
+    },
+    "borderRadius": 32,
+    "borderWidth": 1,
+    "iconColor": {
+      "red": 0.40392,
+      "green": 0.43137,
+      "blue": 0.45098,
+      "alpha": 1
+    },
+    "iconScale": 1,
+    "iconSize": 16,
+    "iconTranslateX": 0,
+    "iconTranslateY": 0,
+    "outerBorderColor": {
+      "red": 0,
+      "green": 0,
+      "blue": 0,
+      "alpha": 0
+    },
+    "outerBorderGap": 0,
+    "outerBorderWidth": 0,
+    "padding": 8,
+    "shadow": {
+      "inset": false,
+      "offsetX": 0,
+      "offsetY": 2,
+      "blur": 2,
+      "spread": 0,
+      "color": {
+        "red": 0,
+        "green": 0,
+        "blue": 0,
+        "alpha": 0.2
+      }
+    }
+  }
+}

package/build/android/Icon.json

@@ -0,0 +1,174 @@
+{
+  "appearances": {
+    "color": {
+      "type": "variant",
+      "values": [
+        "brand",
+        "default",
+        "subtle",
+        "success",
+        "danger",
+        "warning",
+        "inverse"
+      ]
+    },
+    "rank": {
+      "type": "variant",
+      "values": ["primary"]
+    },
+    "size": {
+      "type": "variant",
+      "values": ["micro", "small", "large", "extraLarge"]
+    }
+  },
+  "rules": [
+    {
+      "if": {
+        "size": "micro"
+      },
+      "tokens": {
+        "size": 16
+      }
+    },
+    {
+      "if": {
+        "size": "small"
+      },
+      "tokens": {
+        "size": 20
+      }
+    },
+    {
+      "if": {
+        "size": "large"
+      },
+      "tokens": {
+        "size": 32
+      }
+    },
+    {
+      "if": {
+        "color": "brand"
+      },
+      "tokens": {
+        "color": {
+          "red": 0.29412,
+          "green": 0.15686,
+          "blue": 0.42745,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "color": "default"
+      },
+      "tokens": {
+        "color": {
+          "red": 0.2549,
+          "green": 0.27059,
+          "blue": 0.27843,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "color": "subtle"
+      },
+      "tokens": {
+        "color": {
+          "red": 0.40392,
+          "green": 0.43137,
+          "blue": 0.45098,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "color": "success"
+      },
+      "tokens": {
+        "color": {
+          "red": 0.16863,
+          "green": 0.50196,
+          "blue": 0,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "color": "danger"
+      },
+      "tokens": {
+        "color": {
+          "red": 0.75686,
+          "green": 0.13725,
+          "blue": 0.20784,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "color": "warning"
+      },
+      "tokens": {
+        "color": {
+          "red": 0.70588,
+          "green": 0.52941,
+          "blue": 0.17255,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "color": "inverse"
+      },
+      "tokens": {
+        "color": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "size": "extraLarge"
+      },
+      "tokens": {
+        "size": 48
+      }
+    },
+    {
+      "if": {
+        "rank": "primary"
+      },
+      "tokens": {
+        "color": {
+          "red": 0.29412,
+          "green": 0.15686,
+          "blue": 0.42745,
+          "alpha": 1
+        }
+      }
+    }
+  ],
+  "tokens": {
+    "color": {
+      "red": 0.2549,
+      "green": 0.27059,
+      "blue": 0.27843,
+      "alpha": 1
+    },
+    "scale": 1,
+    "size": 24,
+    "translateX": 0,
+    "translateY": 0
+  }
+}