Merge pull request #512 from bcgov/feature/design-tokens-v3.2.0

Design Tokens v3.2.0 release changes

packages/design-tokens/CHANGELOG.md

@@ -1,5 +1,15 @@
 # Changelog
 
+## 3.2.0
+
+### Added
+
+- `bcds-layout-border-radius-circular` is added with value 9999
+
+### Removed
+
+- `bcds-typography-font-weights-italic` is removed as its deprecated
+
 ## 3.1.1
 
 ### Changed

packages/design-tokens/build/cjs-prefixed/index.d.ts

@@ -169,6 +169,8 @@ export const bcdsLayoutBorderRadiusNone : string;
 export const bcdsLayoutBorderRadiusSmall : string;
 export const bcdsLayoutBorderRadiusMedium : string;
 export const bcdsLayoutBorderRadiusLarge : string;
+/** Used for components with a circular radius */
+export const bcdsLayoutBorderRadiusCircular : string;
 /** BC Sans font. Requires BC Sans package */
 export const bcdsTypographyFontFamiliesBcSans : string;
 /** Smallest line height */
@@ -188,8 +190,6 @@ export const bcdsTypographyLineHeightsAuto : string;
 export const bcdsTypographyFontWeightsRegular : number;
 /** System token, used to generate text styles */
 export const bcdsTypographyFontWeightsBold : number;
-/** DEPRECATED - will be removed in next major version. */
-export const bcdsTypographyFontWeightsItalic : string;
 /** System token, used to generate text styles */
 export const bcdsTypographyFontWeightsItalicWeight : number;
 /** System token, used to generate text styles */

packages/design-tokens/build/cjs-prefixed/index.js

@@ -102,6 +102,7 @@ module.exports = {
   "bcdsLayoutBorderRadiusSmall": "2px",
   "bcdsLayoutBorderRadiusMedium": "4px",
   "bcdsLayoutBorderRadiusLarge": "6px",
+  "bcdsLayoutBorderRadiusCircular": "9999px",
   "bcdsTypographyFontFamiliesBcSans": "'BC Sans'",
   "bcdsTypographyLineHeightsXxxdense": "1.125rem",
   "bcdsTypographyLineHeightsXxdense": "1.313rem",
@@ -114,7 +115,6 @@ module.exports = {
   "bcdsTypographyLineHeightsAuto": "AUTO",
   "bcdsTypographyFontWeightsRegular": 400,
   "bcdsTypographyFontWeightsBold": 700,
-  "bcdsTypographyFontWeightsItalic": "Italic", // DEPRECATED - will be removed in next major version.
   "bcdsTypographyFontWeightsItalicWeight": 400,
   "bcdsTypographyFontWeightsItalicStyle": "italic",
   "bcdsTypographyFontSizeLabel": "0.75rem",

packages/design-tokens/build/cjs/index.d.ts

@@ -169,6 +169,8 @@ export const layoutBorderRadiusNone : string;
 export const layoutBorderRadiusSmall : string;
 export const layoutBorderRadiusMedium : string;
 export const layoutBorderRadiusLarge : string;
+/** Used for components with a circular radius */
+export const layoutBorderRadiusCircular : string;
 /** BC Sans font. Requires BC Sans package */
 export const typographyFontFamiliesBcSans : string;
 /** Smallest line height */
@@ -188,8 +190,6 @@ export const typographyLineHeightsAuto : string;
 export const typographyFontWeightsRegular : number;
 /** System token, used to generate text styles */
 export const typographyFontWeightsBold : number;
-/** DEPRECATED - will be removed in next major version. */
-export const typographyFontWeightsItalic : string;
 /** System token, used to generate text styles */
 export const typographyFontWeightsItalicWeight : number;
 /** System token, used to generate text styles */

packages/design-tokens/build/cjs/index.js

@@ -102,6 +102,7 @@ module.exports = {
   "layoutBorderRadiusSmall": "2px",
   "layoutBorderRadiusMedium": "4px",
   "layoutBorderRadiusLarge": "6px",
+  "layoutBorderRadiusCircular": "9999px",
   "typographyFontFamiliesBcSans": "'BC Sans'",
   "typographyLineHeightsXxxdense": "1.125rem",
   "typographyLineHeightsXxdense": "1.313rem",
@@ -114,7 +115,6 @@ module.exports = {
   "typographyLineHeightsAuto": "AUTO",
   "typographyFontWeightsRegular": 400,
   "typographyFontWeightsBold": 700,
-  "typographyFontWeightsItalic": "Italic", // DEPRECATED - will be removed in next major version.
   "typographyFontWeightsItalicWeight": 400,
   "typographyFontWeightsItalicStyle": "italic",
   "typographyFontSizeLabel": "0.75rem",

packages/design-tokens/build/css-prefixed/variables.css

@@ -102,6 +102,7 @@
   --bcds-layout-border-radius-small: 2px;
   --bcds-layout-border-radius-medium: 4px;
   --bcds-layout-border-radius-large: 6px;
+  --bcds-layout-border-radius-circular: 9999px; /* Used for components with a circular radius */
   --bcds-typography-font-families-bc-sans: 'BC Sans'; /* BC Sans font. Requires BC Sans package */
   --bcds-typography-line-heights-xxxdense: 1.125rem; /* Smallest line height */
   --bcds-typography-line-heights-xxdense: 1.313rem;
@@ -114,7 +115,6 @@
   --bcds-typography-line-heights-auto: AUTO; /* System token, used to generate type styles */
   --bcds-typography-font-weights-regular: 400; /* System token, used to generate text styles */
   --bcds-typography-font-weights-bold: 700; /* System token, used to generate text styles */
-  --bcds-typography-font-weights-italic: Italic; /* DEPRECATED - will be removed in next major version. */
   --bcds-typography-font-weights-italic-weight: 400; /* System token, used to generate text styles */
   --bcds-typography-font-weights-italic-style: italic; /* System token, used to generate text styles */
   --bcds-typography-font-size-label: 0.75rem;

packages/design-tokens/build/css/variables.css

@@ -102,6 +102,7 @@
   --layout-border-radius-small: 2px;
   --layout-border-radius-medium: 4px;
   --layout-border-radius-large: 6px;
+  --layout-border-radius-circular: 9999px; /* Used for components with a circular radius */
   --typography-font-families-bc-sans: 'BC Sans'; /* BC Sans font. Requires BC Sans package */
   --typography-line-heights-xxxdense: 1.125rem; /* Smallest line height */
   --typography-line-heights-xxdense: 1.313rem;
@@ -114,7 +115,6 @@
   --typography-line-heights-auto: AUTO; /* System token, used to generate type styles */
   --typography-font-weights-regular: 400; /* System token, used to generate text styles */
   --typography-font-weights-bold: 700; /* System token, used to generate text styles */
-  --typography-font-weights-italic: Italic; /* DEPRECATED - will be removed in next major version. */
   --typography-font-weights-italic-weight: 400; /* System token, used to generate text styles */
   --typography-font-weights-italic-style: italic; /* System token, used to generate text styles */
   --typography-font-size-label: 0.75rem;

packages/design-tokens/build/js-prefixed/index.d.ts

@@ -169,6 +169,8 @@ export const bcdsLayoutBorderRadiusNone : string;
 export const bcdsLayoutBorderRadiusSmall : string;
 export const bcdsLayoutBorderRadiusMedium : string;
 export const bcdsLayoutBorderRadiusLarge : string;
+/** Used for components with a circular radius */
+export const bcdsLayoutBorderRadiusCircular : string;
 /** BC Sans font. Requires BC Sans package */
 export const bcdsTypographyFontFamiliesBcSans : string;
 /** Smallest line height */
@@ -188,8 +190,6 @@ export const bcdsTypographyLineHeightsAuto : string;
 export const bcdsTypographyFontWeightsRegular : number;
 /** System token, used to generate text styles */
 export const bcdsTypographyFontWeightsBold : number;
-/** DEPRECATED - will be removed in next major version. */
-export const bcdsTypographyFontWeightsItalic : string;
 /** System token, used to generate text styles */
 export const bcdsTypographyFontWeightsItalicWeight : number;
 /** System token, used to generate text styles */

packages/design-tokens/build/js-prefixed/index.js

@@ -101,6 +101,7 @@ export const bcdsLayoutBorderRadiusNone = "0";
 export const bcdsLayoutBorderRadiusSmall = "2px";
 export const bcdsLayoutBorderRadiusMedium = "4px";
 export const bcdsLayoutBorderRadiusLarge = "6px";
+export const bcdsLayoutBorderRadiusCircular = "9999px"; // Used for components with a circular radius
 export const bcdsTypographyFontFamiliesBcSans = "'BC Sans'"; // BC Sans font. Requires BC Sans package
 export const bcdsTypographyLineHeightsXxxdense = "1.125rem"; // Smallest line height
 export const bcdsTypographyLineHeightsXxdense = "1.313rem";
@@ -113,7 +114,6 @@ export const bcdsTypographyLineHeightsXxsparse = "3.375rem"; // Largest line hei
 export const bcdsTypographyLineHeightsAuto = "AUTO"; // System token, used to generate type styles
 export const bcdsTypographyFontWeightsRegular = 400; // System token, used to generate text styles
 export const bcdsTypographyFontWeightsBold = 700; // System token, used to generate text styles
-export const bcdsTypographyFontWeightsItalic = "Italic"; // DEPRECATED - will be removed in next major version.
 export const bcdsTypographyFontWeightsItalicWeight = 400; // System token, used to generate text styles
 export const bcdsTypographyFontWeightsItalicStyle = "italic"; // System token, used to generate text styles
 export const bcdsTypographyFontSizeLabel = "0.75rem";

packages/design-tokens/build/js/index.d.ts

@@ -169,6 +169,8 @@ export const layoutBorderRadiusNone : string;
 export const layoutBorderRadiusSmall : string;
 export const layoutBorderRadiusMedium : string;
 export const layoutBorderRadiusLarge : string;
+/** Used for components with a circular radius */
+export const layoutBorderRadiusCircular : string;
 /** BC Sans font. Requires BC Sans package */
 export const typographyFontFamiliesBcSans : string;
 /** Smallest line height */
@@ -188,8 +190,6 @@ export const typographyLineHeightsAuto : string;
 export const typographyFontWeightsRegular : number;
 /** System token, used to generate text styles */
 export const typographyFontWeightsBold : number;
-/** DEPRECATED - will be removed in next major version. */
-export const typographyFontWeightsItalic : string;
 /** System token, used to generate text styles */
 export const typographyFontWeightsItalicWeight : number;
 /** System token, used to generate text styles */

packages/design-tokens/build/js/index.js

@@ -101,6 +101,7 @@ export const layoutBorderRadiusNone = "0";
 export const layoutBorderRadiusSmall = "2px";
 export const layoutBorderRadiusMedium = "4px";
 export const layoutBorderRadiusLarge = "6px";
+export const layoutBorderRadiusCircular = "9999px"; // Used for components with a circular radius
 export const typographyFontFamiliesBcSans = "'BC Sans'"; // BC Sans font. Requires BC Sans package
 export const typographyLineHeightsXxxdense = "1.125rem"; // Smallest line height
 export const typographyLineHeightsXxdense = "1.313rem";
@@ -113,7 +114,6 @@ export const typographyLineHeightsXxsparse = "3.375rem"; // Largest line height
 export const typographyLineHeightsAuto = "AUTO"; // System token, used to generate type styles
 export const typographyFontWeightsRegular = 400; // System token, used to generate text styles
 export const typographyFontWeightsBold = 700; // System token, used to generate text styles
-export const typographyFontWeightsItalic = "Italic"; // DEPRECATED - will be removed in next major version.
 export const typographyFontWeightsItalicWeight = 400; // System token, used to generate text styles
 export const typographyFontWeightsItalicStyle = "italic"; // System token, used to generate text styles
 export const typographyFontSizeLabel = "0.75rem";

packages/design-tokens/dist/cjs-prefixed/index.d.ts

@@ -169,6 +169,8 @@ export const bcdsLayoutBorderRadiusNone : string;
 export const bcdsLayoutBorderRadiusSmall : string;
 export const bcdsLayoutBorderRadiusMedium : string;
 export const bcdsLayoutBorderRadiusLarge : string;
+/** Used for components with a circular radius */
+export const bcdsLayoutBorderRadiusCircular : string;
 /** BC Sans font. Requires BC Sans package */
 export const bcdsTypographyFontFamiliesBcSans : string;
 /** Smallest line height */
@@ -188,8 +190,6 @@ export const bcdsTypographyLineHeightsAuto : string;
 export const bcdsTypographyFontWeightsRegular : number;
 /** System token, used to generate text styles */
 export const bcdsTypographyFontWeightsBold : number;
-/** DEPRECATED - will be removed in next major version. */
-export const bcdsTypographyFontWeightsItalic : string;
 /** System token, used to generate text styles */
 export const bcdsTypographyFontWeightsItalicWeight : number;
 /** System token, used to generate text styles */

packages/design-tokens/dist/cjs-prefixed/index.js

@@ -102,6 +102,7 @@ module.exports = {
   "bcdsLayoutBorderRadiusSmall": "2px",
   "bcdsLayoutBorderRadiusMedium": "4px",
   "bcdsLayoutBorderRadiusLarge": "6px",
+  "bcdsLayoutBorderRadiusCircular": "9999px",
   "bcdsTypographyFontFamiliesBcSans": "'BC Sans'",
   "bcdsTypographyLineHeightsXxxdense": "1.125rem",
   "bcdsTypographyLineHeightsXxdense": "1.313rem",
@@ -114,7 +115,6 @@ module.exports = {
   "bcdsTypographyLineHeightsAuto": "AUTO",
   "bcdsTypographyFontWeightsRegular": 400,
   "bcdsTypographyFontWeightsBold": 700,
-  "bcdsTypographyFontWeightsItalic": "Italic", // DEPRECATED - will be removed in next major version.
   "bcdsTypographyFontWeightsItalicWeight": 400,
   "bcdsTypographyFontWeightsItalicStyle": "italic",
   "bcdsTypographyFontSizeLabel": "0.75rem",

packages/design-tokens/dist/cjs/index.d.ts

@@ -169,6 +169,8 @@ export const layoutBorderRadiusNone : string;
 export const layoutBorderRadiusSmall : string;
 export const layoutBorderRadiusMedium : string;
 export const layoutBorderRadiusLarge : string;
+/** Used for components with a circular radius */
+export const layoutBorderRadiusCircular : string;
 /** BC Sans font. Requires BC Sans package */
 export const typographyFontFamiliesBcSans : string;
 /** Smallest line height */
@@ -188,8 +190,6 @@ export const typographyLineHeightsAuto : string;
 export const typographyFontWeightsRegular : number;
 /** System token, used to generate text styles */
 export const typographyFontWeightsBold : number;
-/** DEPRECATED - will be removed in next major version. */
-export const typographyFontWeightsItalic : string;
 /** System token, used to generate text styles */
 export const typographyFontWeightsItalicWeight : number;
 /** System token, used to generate text styles */

packages/design-tokens/dist/cjs/index.js

@@ -102,6 +102,7 @@ module.exports = {
   "layoutBorderRadiusSmall": "2px",
   "layoutBorderRadiusMedium": "4px",
   "layoutBorderRadiusLarge": "6px",
+  "layoutBorderRadiusCircular": "9999px",
   "typographyFontFamiliesBcSans": "'BC Sans'",
   "typographyLineHeightsXxxdense": "1.125rem",
   "typographyLineHeightsXxdense": "1.313rem",
@@ -114,7 +115,6 @@ module.exports = {
   "typographyLineHeightsAuto": "AUTO",
   "typographyFontWeightsRegular": 400,
   "typographyFontWeightsBold": 700,
-  "typographyFontWeightsItalic": "Italic", // DEPRECATED - will be removed in next major version.
   "typographyFontWeightsItalicWeight": 400,
   "typographyFontWeightsItalicStyle": "italic",
   "typographyFontSizeLabel": "0.75rem",

packages/design-tokens/dist/css-prefixed/variables.css

@@ -102,6 +102,7 @@
   --bcds-layout-border-radius-small: 2px;
   --bcds-layout-border-radius-medium: 4px;
   --bcds-layout-border-radius-large: 6px;
+  --bcds-layout-border-radius-circular: 9999px; /* Used for components with a circular radius */
   --bcds-typography-font-families-bc-sans: 'BC Sans'; /* BC Sans font. Requires BC Sans package */
   --bcds-typography-line-heights-xxxdense: 1.125rem; /* Smallest line height */
   --bcds-typography-line-heights-xxdense: 1.313rem;
@@ -114,7 +115,6 @@
   --bcds-typography-line-heights-auto: AUTO; /* System token, used to generate type styles */
   --bcds-typography-font-weights-regular: 400; /* System token, used to generate text styles */
   --bcds-typography-font-weights-bold: 700; /* System token, used to generate text styles */
-  --bcds-typography-font-weights-italic: Italic; /* DEPRECATED - will be removed in next major version. */
   --bcds-typography-font-weights-italic-weight: 400; /* System token, used to generate text styles */
   --bcds-typography-font-weights-italic-style: italic; /* System token, used to generate text styles */
   --bcds-typography-font-size-label: 0.75rem;

packages/design-tokens/dist/css/variables.css

@@ -102,6 +102,7 @@
   --layout-border-radius-small: 2px;
   --layout-border-radius-medium: 4px;
   --layout-border-radius-large: 6px;
+  --layout-border-radius-circular: 9999px; /* Used for components with a circular radius */
   --typography-font-families-bc-sans: 'BC Sans'; /* BC Sans font. Requires BC Sans package */
   --typography-line-heights-xxxdense: 1.125rem; /* Smallest line height */
   --typography-line-heights-xxdense: 1.313rem;
@@ -114,7 +115,6 @@
   --typography-line-heights-auto: AUTO; /* System token, used to generate type styles */
   --typography-font-weights-regular: 400; /* System token, used to generate text styles */
   --typography-font-weights-bold: 700; /* System token, used to generate text styles */
-  --typography-font-weights-italic: Italic; /* DEPRECATED - will be removed in next major version. */
   --typography-font-weights-italic-weight: 400; /* System token, used to generate text styles */
   --typography-font-weights-italic-style: italic; /* System token, used to generate text styles */
   --typography-font-size-label: 0.75rem;

packages/design-tokens/dist/js-prefixed/index.d.ts

@@ -169,6 +169,8 @@ export const bcdsLayoutBorderRadiusNone : string;
 export const bcdsLayoutBorderRadiusSmall : string;
 export const bcdsLayoutBorderRadiusMedium : string;
 export const bcdsLayoutBorderRadiusLarge : string;
+/** Used for components with a circular radius */
+export const bcdsLayoutBorderRadiusCircular : string;
 /** BC Sans font. Requires BC Sans package */
 export const bcdsTypographyFontFamiliesBcSans : string;
 /** Smallest line height */
@@ -188,8 +190,6 @@ export const bcdsTypographyLineHeightsAuto : string;
 export const bcdsTypographyFontWeightsRegular : number;
 /** System token, used to generate text styles */
 export const bcdsTypographyFontWeightsBold : number;
-/** DEPRECATED - will be removed in next major version. */
-export const bcdsTypographyFontWeightsItalic : string;
 /** System token, used to generate text styles */
 export const bcdsTypographyFontWeightsItalicWeight : number;
 /** System token, used to generate text styles */

packages/design-tokens/dist/js-prefixed/index.js

@@ -101,6 +101,7 @@ export const bcdsLayoutBorderRadiusNone = "0";
 export const bcdsLayoutBorderRadiusSmall = "2px";
 export const bcdsLayoutBorderRadiusMedium = "4px";
 export const bcdsLayoutBorderRadiusLarge = "6px";
+export const bcdsLayoutBorderRadiusCircular = "9999px"; // Used for components with a circular radius
 export const bcdsTypographyFontFamiliesBcSans = "'BC Sans'"; // BC Sans font. Requires BC Sans package
 export const bcdsTypographyLineHeightsXxxdense = "1.125rem"; // Smallest line height
 export const bcdsTypographyLineHeightsXxdense = "1.313rem";
@@ -113,7 +114,6 @@ export const bcdsTypographyLineHeightsXxsparse = "3.375rem"; // Largest line hei
 export const bcdsTypographyLineHeightsAuto = "AUTO"; // System token, used to generate type styles
 export const bcdsTypographyFontWeightsRegular = 400; // System token, used to generate text styles
 export const bcdsTypographyFontWeightsBold = 700; // System token, used to generate text styles
-export const bcdsTypographyFontWeightsItalic = "Italic"; // DEPRECATED - will be removed in next major version.
 export const bcdsTypographyFontWeightsItalicWeight = 400; // System token, used to generate text styles
 export const bcdsTypographyFontWeightsItalicStyle = "italic"; // System token, used to generate text styles
 export const bcdsTypographyFontSizeLabel = "0.75rem";

packages/design-tokens/dist/js/index.d.ts

@@ -169,6 +169,8 @@ export const layoutBorderRadiusNone : string;
 export const layoutBorderRadiusSmall : string;
 export const layoutBorderRadiusMedium : string;
 export const layoutBorderRadiusLarge : string;
+/** Used for components with a circular radius */
+export const layoutBorderRadiusCircular : string;
 /** BC Sans font. Requires BC Sans package */
 export const typographyFontFamiliesBcSans : string;
 /** Smallest line height */
@@ -188,8 +190,6 @@ export const typographyLineHeightsAuto : string;
 export const typographyFontWeightsRegular : number;
 /** System token, used to generate text styles */
 export const typographyFontWeightsBold : number;
-/** DEPRECATED - will be removed in next major version. */
-export const typographyFontWeightsItalic : string;
 /** System token, used to generate text styles */
 export const typographyFontWeightsItalicWeight : number;
 /** System token, used to generate text styles */