@telus-uds/theme-allium 4.16.0 → 4.17.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/build/rn/theme.js CHANGED
@@ -1,7 +1,7 @@
1
1
  /*
2
2
  *
3
3
  * Do not edit directly
4
- * Generated on Wed, 01 Nov 2023 00:53:28 GMT
4
+ * Generated on Fri, 10 Nov 2023 22:27:15 GMT
5
5
  *
6
6
  */
7
7
 
@@ -1649,18 +1649,54 @@ module.exports = {
1649
1649
  textTransform: 'none'
1650
1650
  }
1651
1651
  },
1652
+ CheckboxCardGroup: {
1653
+ appearances: {
1654
+ fullWidth: {
1655
+ description: 'Makes cards always occupy the full width of the parent, regardless of viewport',
1656
+ type: 'variant',
1657
+ values: [ true ]
1658
+ },
1659
+ viewport: {
1660
+ description: 'The size label for the current screen viewport based on the current screen width',
1661
+ type: 'state',
1662
+ values: [ 'xs', 'sm', 'md', 'lg', 'xl' ]
1663
+ }
1664
+ },
1665
+ rules: [
1666
+ {
1667
+ if: { viewport: [ 'md', 'lg', 'xl' ] },
1668
+ tokens: { direction: 'row', space: 5 }
1669
+ },
1670
+ {
1671
+ if: { fullWidth: true },
1672
+ tokens: { direction: 'column', fieldSpace: 3, space: 3 }
1673
+ }
1674
+ ],
1675
+ tokens: {
1676
+ borderBottomLeftRadius: 1,
1677
+ borderBottomRightRadius: 1,
1678
+ borderTopLeftRadius: 1,
1679
+ borderTopRightRadius: 1,
1680
+ direction: 'column',
1681
+ fieldSpace: 3,
1682
+ outlineOffset: 8,
1683
+ outlineWidth: 1,
1684
+ showIcon: true,
1685
+ space: 3
1686
+ }
1687
+ },
1652
1688
  CheckboxGroup: {
1653
1689
  appearances: {},
1654
1690
  rules: [],
1655
1691
  tokens: {
1656
- borderBottomLeftRadius: 0,
1657
- borderBottomRightRadius: 0,
1658
- borderTopLeftRadius: 0,
1659
- borderTopRightRadius: 0,
1692
+ borderBottomLeftRadius: 1,
1693
+ borderBottomRightRadius: 1,
1694
+ borderTopLeftRadius: 1,
1695
+ borderTopRightRadius: 1,
1660
1696
  fieldSpace: 2,
1661
- outlineOffset: null,
1662
- outlineWidth: 0,
1663
- showIcon: false,
1697
+ outlineOffset: 8,
1698
+ outlineWidth: 1,
1699
+ showIcon: true,
1664
1700
  space: 2
1665
1701
  }
1666
1702
  },
@@ -2716,6 +2752,11 @@ module.exports = {
2716
2752
  type: 'state',
2717
2753
  values: [ true, false ]
2718
2754
  },
2755
+ quiet: {
2756
+ description: 'When it is true, it does not show the decoration',
2757
+ type: 'state',
2758
+ values: [ true, false ]
2759
+ },
2719
2760
  size: {
2720
2761
  description: 'Text sizes for block links; similar but not always identical to Typography sizes.',
2721
2762
  type: 'variant',
@@ -2796,6 +2837,23 @@ module.exports = {
2796
2837
  {
2797
2838
  if: { hover: true, light: true },
2798
2839
  tokens: { color: '#414547', textLine: 'none' }
2840
+ },
2841
+ { if: { quiet: true }, tokens: { textLine: 'none' } },
2842
+ {
2843
+ if: { hover: true, quiet: true },
2844
+ tokens: { color: '#1f5c09', textLine: 'underline' }
2845
+ },
2846
+ {
2847
+ if: { alternative: true, hover: true, quiet: true },
2848
+ tokens: { color: '#2c2e30', textLine: 'underline' }
2849
+ },
2850
+ {
2851
+ if: { hover: true, inverse: true, quiet: true },
2852
+ tokens: { color: '#f4f4f7', textLine: 'underline' }
2853
+ },
2854
+ {
2855
+ if: { hover: true, light: true, quiet: true },
2856
+ tokens: { color: '#414547', textLine: 'underline' }
2799
2857
  }
2800
2858
  ],
2801
2859
  tokens: {
@@ -3096,6 +3154,7 @@ module.exports = {
3096
3154
  {
3097
3155
  if: { viewport: [ 'xs', 'sm' ] },
3098
3156
  tokens: {
3157
+ direction: 'column',
3099
3158
  height: '100%',
3100
3159
  paddingBottom: 24,
3101
3160
  paddingLeft: 24,
@@ -3108,6 +3167,7 @@ module.exports = {
3108
3167
  tokens: {
3109
3168
  containerPaddingBottom: 32,
3110
3169
  containerPaddingTop: 32,
3170
+ direction: 'row',
3111
3171
  maxWidth: 576
3112
3172
  }
3113
3173
  },
@@ -3183,6 +3243,7 @@ module.exports = {
3183
3243
  containerPaddingLeft: 0,
3184
3244
  containerPaddingRight: 0,
3185
3245
  containerPaddingTop: 0,
3246
+ direction: 'row',
3186
3247
  gap: 16,
3187
3248
  headingColor: '#414547',
3188
3249
  headingPaddingRight: 24,
@@ -4589,7 +4650,18 @@ module.exports = {
4589
4650
  tokens: { direction: 'row', space: 5 }
4590
4651
  }
4591
4652
  ],
4592
- tokens: { direction: 'column', fieldSpace: 3, space: 3 }
4653
+ tokens: {
4654
+ borderBottomLeftRadius: 1,
4655
+ borderBottomRightRadius: 1,
4656
+ borderTopLeftRadius: 1,
4657
+ borderTopRightRadius: 1,
4658
+ direction: 'column',
4659
+ fieldSpace: 3,
4660
+ outlineOffset: 8,
4661
+ outlineWidth: 1,
4662
+ showIcon: true,
4663
+ space: 3
4664
+ }
4593
4665
  },
4594
4666
  RadioGroup: {
4595
4667
  appearances: {},
@@ -6924,5 +6996,5 @@ module.exports = {
6924
6996
  tokens: { size: 96 }
6925
6997
  }
6926
6998
  },
6927
- metadata: { name: 'theme-allium', themeTokensVersion: '2.43.0' }
6999
+ metadata: { name: 'theme-allium', themeTokensVersion: '2.44.1' }
6928
7000
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@telus-uds/theme-allium",
3
- "version": "4.16.0",
3
+ "version": "4.17.1",
4
4
  "description": "Allium theme",
5
5
  "author": "TELUS Digital",
6
6
  "homepage": "https://github.com/telus/allium-design-system#readme",
@@ -8,12 +8,12 @@
8
8
  "main": "build/rn/theme.js",
9
9
  "dependencies": {},
10
10
  "devDependencies": {
11
- "@telus-uds/palette-allium": "^2.27.1",
12
- "@telus-uds/system-theme-tokens": "^2.43.0",
13
- "@telus-uds/system-tokens": "^0.7.24"
11
+ "@telus-uds/palette-allium": "^2.27.3",
12
+ "@telus-uds/system-theme-tokens": "^2.44.1",
13
+ "@telus-uds/system-tokens": "^0.7.26"
14
14
  },
15
15
  "peerDependencies": {
16
- "@telus-uds/palette-allium": "^2.27.1"
16
+ "@telus-uds/palette-allium": "^2.27.3"
17
17
  },
18
18
  "files": [
19
19
  "build",
package/theme.json CHANGED
@@ -1949,18 +1949,61 @@
1949
1949
  "textTransform": "{system.textTransform.none}"
1950
1950
  }
1951
1951
  },
1952
+ "CheckboxCardGroup": {
1953
+ "appearances": {
1954
+ "fullWidth": {
1955
+ "description": "Makes cards always occupy the full width of the parent, regardless of viewport",
1956
+ "type": "variant",
1957
+ "values": [true]
1958
+ },
1959
+ "viewport": "{appearances.system.viewport}"
1960
+ },
1961
+ "rules": [
1962
+ {
1963
+ "if": {
1964
+ "viewport": ["md", "lg", "xl"]
1965
+ },
1966
+ "tokens": {
1967
+ "direction": "{system.direction.row}",
1968
+ "space": "{system.integer.5}"
1969
+ }
1970
+ },
1971
+ {
1972
+ "if": {
1973
+ "fullWidth": true
1974
+ },
1975
+ "tokens": {
1976
+ "direction": "{system.direction.column}",
1977
+ "fieldSpace": "{system.integer.3}",
1978
+ "space": "{system.integer.3}"
1979
+ }
1980
+ }
1981
+ ],
1982
+ "tokens": {
1983
+ "borderBottomLeftRadius": "{palette.radius.radius1}",
1984
+ "borderBottomRightRadius": "{palette.radius.radius1}",
1985
+ "borderTopLeftRadius": "{palette.radius.radius1}",
1986
+ "borderTopRightRadius": "{palette.radius.radius1}",
1987
+ "direction": "{system.direction.column}",
1988
+ "fieldSpace": "{system.integer.3}",
1989
+ "outlineOffset": "{palette.size.size8}",
1990
+ "outlineWidth": "{palette.border.border1}",
1991
+ "showIcon": "{system.show.true}",
1992
+ "space": "{system.integer.3}"
1993
+ }
1994
+ },
1952
1995
  "CheckboxGroup": {
1953
1996
  "appearances": {},
1954
1997
  "rules": [],
1955
1998
  "tokens": {
1956
- "borderBottomLeftRadius": "{system.radius.zero}",
1957
- "borderBottomRightRadius": "{system.radius.zero}",
1958
- "borderTopLeftRadius": "{system.radius.zero}",
1959
- "borderTopRightRadius": "{system.radius.zero}",
1999
+ "borderBottomLeftRadius": "{palette.radius.radius1}",
2000
+ "borderBottomRightRadius": "{palette.radius.radius1}",
2001
+ "borderTopLeftRadius": "{palette.radius.radius1}",
2002
+ "borderTopRightRadius": "{palette.radius.radius1}",
1960
2003
  "fieldSpace": "{system.integer.2}",
1961
- "outlineOffset": "{system.size.none}",
1962
- "outlineWidth": "{system.border.zero}",
1963
- "showIcon": "{system.show.false}",
2004
+ "outlineOffset": "{palette.size.size8}",
2005
+ "outlineWidth": "{palette.border.border1}",
2006
+ "showIcon": "{system.show.true}",
1964
2007
  "space": "{system.integer.2}"
1965
2008
  }
1966
2009
  },
@@ -3477,6 +3520,11 @@
3477
3520
  "values": [true]
3478
3521
  },
3479
3522
  "pressed": "{appearances.Link.pressed}",
3523
+ "quiet": {
3524
+ "description": "When it is true, it does not show the decoration",
3525
+ "type": "state",
3526
+ "values": [true, false]
3527
+ },
3480
3528
  "size": {
3481
3529
  "description": "Text sizes for block links; similar but not always identical to Typography sizes.",
3482
3530
  "type": "variant",
@@ -3670,6 +3718,57 @@
3670
3718
  "color": "{palette.color.greyCharcoal}",
3671
3719
  "textLine": "{system.textLine.none}"
3672
3720
  }
3721
+ },
3722
+ {
3723
+ "if": {
3724
+ "quiet": true
3725
+ },
3726
+ "tokens": {
3727
+ "textLine": "{system.textLine.none}"
3728
+ }
3729
+ },
3730
+ {
3731
+ "if": {
3732
+ "hover": true,
3733
+ "quiet": true
3734
+ },
3735
+ "tokens": {
3736
+ "color": "{palette.color.greenSanFelix}",
3737
+ "textLine": "{system.textLine.underline}"
3738
+ }
3739
+ },
3740
+ {
3741
+ "if": {
3742
+ "alternative": true,
3743
+ "hover": true,
3744
+ "quiet": true
3745
+ },
3746
+ "tokens": {
3747
+ "color": "{palette.color.greyThunder}",
3748
+ "textLine": "{system.textLine.underline}"
3749
+ }
3750
+ },
3751
+ {
3752
+ "if": {
3753
+ "hover": true,
3754
+ "inverse": true,
3755
+ "quiet": true
3756
+ },
3757
+ "tokens": {
3758
+ "color": "{palette.color.greyAthens}",
3759
+ "textLine": "{system.textLine.underline}"
3760
+ }
3761
+ },
3762
+ {
3763
+ "if": {
3764
+ "hover": true,
3765
+ "light": true,
3766
+ "quiet": true
3767
+ },
3768
+ "tokens": {
3769
+ "color": "{palette.color.greyCharcoal}",
3770
+ "textLine": "{system.textLine.underline}"
3771
+ }
3673
3772
  }
3674
3773
  ],
3675
3774
  "tokens": {
@@ -3989,6 +4088,7 @@
3989
4088
  "viewport": ["xs", "sm"]
3990
4089
  },
3991
4090
  "tokens": {
4091
+ "direction": "{system.direction.column}",
3992
4092
  "height": "{system.size.full}",
3993
4093
  "paddingBottom": "{palette.size.size24}",
3994
4094
  "paddingLeft": "{palette.size.size24}",
@@ -4003,6 +4103,7 @@
4003
4103
  "tokens": {
4004
4104
  "containerPaddingBottom": "{palette.size.size32}",
4005
4105
  "containerPaddingTop": "{palette.size.size32}",
4106
+ "direction": "{system.direction.row}",
4006
4107
  "maxWidth": "{palette.size.size576}"
4007
4108
  }
4008
4109
  },
@@ -4099,6 +4200,7 @@
4099
4200
  "containerPaddingLeft": "{system.size.zero}",
4100
4201
  "containerPaddingRight": "{system.size.zero}",
4101
4202
  "containerPaddingTop": "{system.size.zero}",
4203
+ "direction": "{system.direction.row}",
4102
4204
  "gap": "{palette.size.size16}",
4103
4205
  "headingColor": "{palette.color.greyCharcoal}",
4104
4206
  "headingPaddingRight": "{palette.size.size24}",
@@ -5664,8 +5766,15 @@
5664
5766
  }
5665
5767
  ],
5666
5768
  "tokens": {
5769
+ "borderBottomLeftRadius": "{palette.radius.radius1}",
5770
+ "borderBottomRightRadius": "{palette.radius.radius1}",
5771
+ "borderTopLeftRadius": "{palette.radius.radius1}",
5772
+ "borderTopRightRadius": "{palette.radius.radius1}",
5667
5773
  "direction": "{system.direction.column}",
5668
5774
  "fieldSpace": "{system.integer.3}",
5775
+ "outlineOffset": "{palette.size.size8}",
5776
+ "outlineWidth": "{palette.border.border1}",
5777
+ "showIcon": "{system.show.true}",
5669
5778
  "space": "{system.integer.3}"
5670
5779
  }
5671
5780
  },