@telus-uds/theme-allium 4.21.0 → 4.23.0

package/build/ios/Link.json

@@ -0,0 +1,200 @@
+{
+  "appearances": {
+    "alternative": {
+      "description": "Replaces the default green colour with a more subtle grey.",
+      "type": "variant",
+      "values": [true]
+    },
+    "iconPosition": {
+      "description": "Theme styles to be applied to icon links depending on where the icon is in relation to the link text",
+      "values": ["left", "right"],
+      "type": "state"
+    },
+    "inverse": {
+      "description": "Styles the link white for use on dark backgrounds.",
+      "type": "variant",
+      "values": [true]
+    },
+    "light": {
+      "description": "A lighter grey variant, used to lower the emphasis on a given Link (e.g. in Breadcrumbs)",
+      "type": "variant",
+      "values": [true]
+    },
+    "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"
+    },
+    "quiet": {
+      "description": "When it is true, it does not show the decoration",
+      "type": "state",
+      "values": [true, false]
+    },
+    "size": {
+      "description": "Text sizes for block links; similar but not always identical to Typography sizes.",
+      "type": "variant",
+      "values": ["large", "small", "micro"]
+    }
+  },
+  "rules": [
+    {
+      "if": {
+        "iconPosition": "left"
+      },
+      "tokens": {
+        "iconSpace": 2
+      }
+    },
+    {
+      "if": {
+        "pressed": true
+      },
+      "tokens": {
+        "color": {
+          "red": 0.08627,
+          "green": 0.24314,
+          "blue": 0.02353,
+          "alpha": 1
+        },
+        "textLine": "none"
+      }
+    },
+    {
+      "if": {
+        "size": "large"
+      },
+      "tokens": {
+        "blockFontSize": 20,
+        "blockLineHeight": 1.25,
+        "iconSize": 24
+      }
+    },
+    {
+      "if": {
+        "size": "small"
+      },
+      "tokens": {
+        "blockFontSize": 14,
+        "blockLineHeight": 1,
+        "iconSize": 20
+      }
+    },
+    {
+      "if": {
+        "size": "micro"
+      },
+      "tokens": {
+        "blockFontName": "HelveticaNow",
+        "blockFontSize": 12,
+        "blockFontWeight": 500,
+        "blockLineHeight": 1.125,
+        "iconSize": 16
+      }
+    },
+    {
+      "if": {
+        "alternative": true
+      },
+      "tokens": {
+        "color": {
+          "red": 0.17255,
+          "green": 0.18039,
+          "blue": 0.18824,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "alternative": true,
+        "pressed": true
+      },
+      "tokens": {
+        "color": {
+          "red": 0.17255,
+          "green": 0.18039,
+          "blue": 0.18824,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "inverse": true
+      },
+      "tokens": {
+        "color": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "inverse": true,
+        "pressed": true
+      },
+      "tokens": {
+        "color": {
+          "red": 0.8902,
+          "green": 0.90196,
+          "blue": 0.9098,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "light": true
+      },
+      "tokens": {
+        "color": {
+          "red": 0.40392,
+          "green": 0.43137,
+          "blue": 0.45098,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "quiet": true
+      },
+      "tokens": {
+        "textLine": "none"
+      }
+    }
+  ],
+  "tokens": {
+    "alignSelf": "flex-start",
+    "blockFontName": "HelveticaNow",
+    "blockFontSize": 16,
+    "blockFontWeight": 400,
+    "blockLineHeight": 1.5,
+    "borderRadius": 4,
+    "color": {
+      "red": 0.16863,
+      "green": 0.50196,
+      "blue": 0,
+      "alpha": 1
+    },
+    "icon": null,
+    "iconSize": 24,
+    "iconSpace": 1,
+    "iconTranslateX": 0,
+    "iconTranslateY": 0,
+    "outerBorderColor": {
+      "red": 0,
+      "green": 0,
+      "blue": 0,
+      "alpha": 0
+    },
+    "outerBorderGap": 2,
+    "outerBorderOutline": "none",
+    "outerBorderWidth": 2,
+    "textLine": "underline",
+    "textLineStyle": "solid"
+  }
+}

package/build/ios/List.json

@@ -0,0 +1,100 @@
+{
+  "appearances": {
+    "compact": {
+      "description": "When true it will reduce the line height of the list item.",
+      "type": "variant",
+      "values": [true]
+    },
+    "size": {
+      "description": "Indicates list item text size.",
+      "type": "variant",
+      "values": ["large", "small"]
+    }
+  },
+  "rules": [
+    {
+      "if": {
+        "size": "large"
+      },
+      "tokens": {
+        "iconMarginTop": 4,
+        "itemFontSize": 20,
+        "itemIconSize": 24,
+        "itemLineHeight": 1.6,
+        "listGutter": 8
+      }
+    },
+    {
+      "if": {
+        "size": "small"
+      },
+      "tokens": {
+        "iconMarginTop": 0,
+        "itemFontSize": 14,
+        "itemIconSize": 24,
+        "itemLineHeight": 1.42857142857,
+        "listGutter": 8
+      }
+    },
+    {
+      "if": {
+        "compact": true
+      },
+      "tokens": {
+        "iconMarginTop": 0,
+        "itemLineHeight": 1.25
+      }
+    },
+    {
+      "if": {
+        "compact": true,
+        "size": "small"
+      },
+      "tokens": {
+        "itemLineHeight": 1.14285714286
+      }
+    },
+    {
+      "if": {
+        "compact": true,
+        "size": "large"
+      },
+      "tokens": {
+        "itemLineHeight": 1.2
+      }
+    }
+  ],
+  "tokens": {
+    "bulletIcon": "PaletteIconBulletFill",
+    "dividerColor": {
+      "red": 0.69804,
+      "green": 0.72549,
+      "blue": 0.74902,
+      "alpha": 1
+    },
+    "dividerSize": 1,
+    "iconMarginTop": 0,
+    "interItemMargin": 8,
+    "interItemMarginWithDivider": 16,
+    "itemBulletColor": {
+      "red": 0.29412,
+      "green": 0.15686,
+      "blue": 0.42745,
+      "alpha": 1
+    },
+    "itemBulletContainerAlign": "center",
+    "itemBulletContainerWidth": 24,
+    "itemFontName": "HelveticaNow",
+    "itemFontSize": 16,
+    "itemFontWeight": 400,
+    "itemIconColor": {
+      "red": 0.29412,
+      "green": 0.15686,
+      "blue": 0.42745,
+      "alpha": 1
+    },
+    "itemIconSize": 24,
+    "itemLineHeight": 1.5,
+    "listGutter": 8
+  }
+}

package/build/ios/Listbox.json

@@ -0,0 +1,242 @@
+{
+  "appearances": {
+    "current": {
+      "description": "When the current item is selected",
+      "values": [true, false],
+      "type": "state"
+    },
+    "expanded": {
+      "description": "Applies when an ExpandCollapse panel is open and the content inside is visible",
+      "values": [true, false],
+      "type": "state"
+    },
+    "isChild": {
+      "description": "when the item is child of another child",
+      "values": [true, false],
+      "type": "state"
+    },
+    "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": {
+        "expanded": true
+      },
+      "tokens": {
+        "groupIcon": "PaletteIconCaretUp"
+      }
+    },
+    {
+      "if": {
+        "current": true
+      },
+      "tokens": {
+        "groupColor": {
+          "red": 0.29412,
+          "green": 0.15686,
+          "blue": 0.42745,
+          "alpha": 1
+        },
+        "groupFontName": "HelveticaNow",
+        "groupFontWeight": 700,
+        "itemColor": {
+          "red": 0.29412,
+          "green": 0.15686,
+          "blue": 0.42745,
+          "alpha": 1
+        },
+        "itemPaddingBottom": 12,
+        "itemPaddingLeft": 16,
+        "itemPaddingRight": 16,
+        "itemPaddingTop": 12
+      }
+    },
+    {
+      "if": {
+        "current": true,
+        "pressed": true
+      },
+      "tokens": {
+        "groupBackgroundColor": {
+          "red": 0.8902,
+          "green": 0.90196,
+          "blue": 0.9098,
+          "alpha": 1
+        },
+        "groupBorderWidth": 0,
+        "groupColor": {
+          "red": 0.40392,
+          "green": 0.43137,
+          "blue": 0.45098,
+          "alpha": 1
+        },
+        "groupFontName": "HelveticaNow",
+        "groupFontWeight": 700
+      }
+    },
+    {
+      "if": {
+        "isChild": true
+      },
+      "tokens": {
+        "itemBorderBottomWidth": 0,
+        "itemBorderLeftColor": {
+          "red": 0.8902,
+          "green": 0.90196,
+          "blue": 0.9098,
+          "alpha": 1
+        },
+        "itemBorderLeftWidth": 4,
+        "itemBorderTopWidth": 0
+      }
+    },
+    {
+      "if": {
+        "current": true,
+        "isChild": true
+      },
+      "tokens": {
+        "itemBorderLeftColor": {
+          "red": 0.29412,
+          "green": 0.15686,
+          "blue": 0.42745,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "current": true,
+        "pressed": true
+      },
+      "tokens": {
+        "itemColor": {
+          "red": 0.40392,
+          "green": 0.43137,
+          "blue": 0.45098,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "isChild": true,
+        "pressed": true
+      },
+      "tokens": {
+        "itemBorderBottomWidth": 0,
+        "itemBorderLeftColor": {
+          "red": 0.40392,
+          "green": 0.43137,
+          "blue": 0.45098,
+          "alpha": 1
+        },
+        "itemBorderTopWidth": 0
+      }
+    }
+  ],
+  "tokens": {
+    "groupBackgroundColor": {
+      "red": 0,
+      "green": 0,
+      "blue": 0,
+      "alpha": 0
+    },
+    "groupBorderColor": {
+      "red": 0,
+      "green": 0,
+      "blue": 0,
+      "alpha": 0
+    },
+    "groupBorderRadius": 0,
+    "groupBorderWidth": 1,
+    "groupColor": {
+      "red": 0.2549,
+      "green": 0.27059,
+      "blue": 0.27843,
+      "alpha": 1
+    },
+    "groupFontName": "HelveticaNow",
+    "groupFontSize": 14,
+    "groupFontWeight": 400,
+    "groupHeight": 40,
+    "groupIcon": "PaletteIconCaretDown",
+    "groupPaddingBottom": 12,
+    "groupPaddingLeft": 16,
+    "groupPaddingRight": 16,
+    "groupPaddingTop": 12,
+    "itemBackgroundColor": {
+      "red": 0,
+      "green": 0,
+      "blue": 0,
+      "alpha": 0
+    },
+    "itemBorderBottomColor": {
+      "red": 0,
+      "green": 0,
+      "blue": 0,
+      "alpha": 0
+    },
+    "itemBorderBottomWidth": 1,
+    "itemBorderLeftColor": {
+      "red": 0,
+      "green": 0,
+      "blue": 0,
+      "alpha": 0
+    },
+    "itemBorderLeftWidth": 1,
+    "itemBorderRadius": 0,
+    "itemBorderRightColor": {
+      "red": 0,
+      "green": 0,
+      "blue": 0,
+      "alpha": 0
+    },
+    "itemBorderRightWidth": 1,
+    "itemBorderTopColor": {
+      "red": 0,
+      "green": 0,
+      "blue": 0,
+      "alpha": 0
+    },
+    "itemBorderTopWidth": 1,
+    "itemBorderWidth": 1,
+    "itemColor": {
+      "red": 0.2549,
+      "green": 0.27059,
+      "blue": 0.27843,
+      "alpha": 1
+    },
+    "itemDisplay": false,
+    "itemFontName": "HelveticaNow",
+    "itemFontSize": 14,
+    "itemFontWeight": 700,
+    "itemHeight": 40,
+    "itemOutline": 0,
+    "itemPaddingBottom": 8,
+    "itemPaddingLeft": 16,
+    "itemPaddingRight": 16,
+    "itemPaddingTop": 8,
+    "itemTextDecoration": "none",
+    "lineHeight": 1.14285714286,
+    "minHeight": "100%",
+    "minWidth": "100%",
+    "shadow": {
+      "inset": false,
+      "offsetX": 0,
+      "offsetY": 4,
+      "blur": 8,
+      "spread": 0,
+      "color": {
+        "red": 0,
+        "green": 0,
+        "blue": 0,
+        "alpha": 0.1
+      }
+    }
+  }
+}