@sage/design-tokens 14.3.0 → 14.5.0

package/js/umd/product/small/light/components/form.js

@@ -203,6 +203,55 @@
             },
           },
         },
+        datepicker: {
+          pr: {
+            S: {
+              $type: "spacing",
+              $value: 2,
+              $description: "right padding on small date picker input",
+              filePath: "data/tokens/components/form.json",
+              isSource: true,
+              original: {
+                $type: "spacing",
+                $value: "{global.space.micro.XS}",
+                $description: "right padding on small date picker input",
+              },
+              name: "formSpaceDatepickerPrS",
+              attributes: {},
+              path: ["form", "space", "datepicker", "pr", "S"],
+            },
+            M: {
+              $type: "spacing",
+              $value: 6,
+              $description: "right padding on medium date picker input",
+              filePath: "data/tokens/components/form.json",
+              isSource: true,
+              original: {
+                $type: "spacing",
+                $value: "{global.space.micro.M}",
+                $description: "right padding on medium date picker input",
+              },
+              name: "formSpaceDatepickerPrM",
+              attributes: {},
+              path: ["form", "space", "datepicker", "pr", "M"],
+            },
+            L: {
+              $type: "spacing",
+              $value: 10,
+              $description: "right padding on large date picker input",
+              filePath: "data/tokens/components/form.json",
+              isSource: true,
+              original: {
+                $type: "spacing",
+                $value: "{global.space.micro.XL}",
+                $description: "right padding on large date picker input",
+              },
+              name: "formSpaceDatepickerPrL",
+              attributes: {},
+              path: ["form", "space", "datepicker", "pr", "L"],
+            },
+          },
+        },
         dropdown: {
           button: {
             x: {

package/json/flat/frozenproduct/large/dark/components/form.json

@@ -10,6 +10,9 @@
   "formSpaceCheckradioYS": 3,
   "formSpaceCheckradioYM": 2,
   "formSpaceCheckradioYL": 4,
+  "formSpaceDatepickerPrS": 2,
+  "formSpaceDatepickerPrM": 6,
+  "formSpaceDatepickerPrL": 10,
   "formSpaceDropdownButtonXS": 20,
   "formSpaceDropdownButtonXM": 20,
   "formSpaceDropdownButtonXL": 20,

package/json/flat/frozenproduct/large/global.json

@@ -179,8 +179,9 @@
   "globalFontSizeAdaptiveStep9": "46px",
   "globalFontSizeAdaptiveStep10": "52px",
   "globalFontFamiliesSageIcons": "sage-icons",
-  "globalFontFamiliesSageHeadline": "Sage Headline",
-  "globalFontFamiliesSageUi": "Sage UI",
-  "globalFontFamiliesSageText": "Sage Text",
+  "globalFontFamiliesHeading": "Sage UI",
+  "globalFontFamiliesSubheading": "Sage UI",
+  "globalFontFamiliesBody": "Sage UI",
+  "globalFontFamiliesComponent": "Sage UI",
   "globalFontFamiliesOther": "Open Sans"
 }

package/json/flat/frozenproduct/large/light/components/form.json

@@ -10,6 +10,9 @@
   "formSpaceCheckradioYS": 3,
   "formSpaceCheckradioYM": 2,
   "formSpaceCheckradioYL": 4,
+  "formSpaceDatepickerPrS": 2,
+  "formSpaceDatepickerPrM": 6,
+  "formSpaceDatepickerPrL": 10,
   "formSpaceDropdownButtonXS": 20,
   "formSpaceDropdownButtonXM": 20,
   "formSpaceDropdownButtonXL": 20,

package/json/flat/frozenproduct/small/dark/components/form.json

@@ -10,6 +10,9 @@
   "formSpaceCheckradioYS": 3,
   "formSpaceCheckradioYM": 2,
   "formSpaceCheckradioYL": 4,
+  "formSpaceDatepickerPrS": 2,
+  "formSpaceDatepickerPrM": 6,
+  "formSpaceDatepickerPrL": 10,
   "formSpaceDropdownButtonXS": 16,
   "formSpaceDropdownButtonXM": 16,
   "formSpaceDropdownButtonXL": 16,

package/json/flat/frozenproduct/small/global.json

@@ -179,8 +179,9 @@
   "globalFontSizeAdaptiveStep9": "33px",
   "globalFontSizeAdaptiveStep10": "36px",
   "globalFontFamiliesSageIcons": "sage-icons",
-  "globalFontFamiliesSageHeadline": "Sage Headline",
-  "globalFontFamiliesSageUi": "Sage UI",
-  "globalFontFamiliesSageText": "Sage Text",
+  "globalFontFamiliesHeading": "Sage UI",
+  "globalFontFamiliesSubheading": "Sage UI",
+  "globalFontFamiliesBody": "Sage UI",
+  "globalFontFamiliesComponent": "Sage UI",
   "globalFontFamiliesOther": "Open Sans"
 }

package/json/flat/frozenproduct/small/light/components/form.json

@@ -10,6 +10,9 @@
   "formSpaceCheckradioYS": 3,
   "formSpaceCheckradioYM": 2,
   "formSpaceCheckradioYL": 4,
+  "formSpaceDatepickerPrS": 2,
+  "formSpaceDatepickerPrM": 6,
+  "formSpaceDatepickerPrL": 10,
   "formSpaceDropdownButtonXS": 16,
   "formSpaceDropdownButtonXM": 16,
   "formSpaceDropdownButtonXL": 16,

package/json/flat/marketing/large/dark/components/form.json

@@ -10,6 +10,9 @@
   "formSpaceCheckradioYS": 3,
   "formSpaceCheckradioYM": 2,
   "formSpaceCheckradioYL": 4,
+  "formSpaceDatepickerPrS": 2,
+  "formSpaceDatepickerPrM": 6,
+  "formSpaceDatepickerPrL": 10,
   "formSpaceDropdownButtonXS": 20,
   "formSpaceDropdownButtonXM": 20,
   "formSpaceDropdownButtonXL": 20,

package/json/flat/marketing/large/global.json

@@ -179,8 +179,9 @@
   "globalFontSizeAdaptiveStep9": "46px",
   "globalFontSizeAdaptiveStep10": "52px",
   "globalFontFamiliesSageIcons": "sage-icons",
-  "globalFontFamiliesSageHeadline": "Sage Headline",
-  "globalFontFamiliesSageUi": "Sage UI",
-  "globalFontFamiliesSageText": "Sage Text",
+  "globalFontFamiliesHeading": "Sage UI",
+  "globalFontFamiliesSubheading": "Sage UI",
+  "globalFontFamiliesBody": "Sage UI",
+  "globalFontFamiliesComponent": "Sage UI",
   "globalFontFamiliesOther": "Open Sans"
 }

package/json/flat/marketing/large/light/components/form.json

@@ -10,6 +10,9 @@
   "formSpaceCheckradioYS": 3,
   "formSpaceCheckradioYM": 2,
   "formSpaceCheckradioYL": 4,
+  "formSpaceDatepickerPrS": 2,
+  "formSpaceDatepickerPrM": 6,
+  "formSpaceDatepickerPrL": 10,
   "formSpaceDropdownButtonXS": 20,
   "formSpaceDropdownButtonXM": 20,
   "formSpaceDropdownButtonXL": 20,

package/json/flat/marketing/small/dark/components/form.json

@@ -10,6 +10,9 @@
   "formSpaceCheckradioYS": 3,
   "formSpaceCheckradioYM": 2,
   "formSpaceCheckradioYL": 4,
+  "formSpaceDatepickerPrS": 2,
+  "formSpaceDatepickerPrM": 6,
+  "formSpaceDatepickerPrL": 10,
   "formSpaceDropdownButtonXS": 16,
   "formSpaceDropdownButtonXM": 16,
   "formSpaceDropdownButtonXL": 16,

package/json/flat/marketing/small/global.json

@@ -179,8 +179,9 @@
   "globalFontSizeAdaptiveStep9": "33px",
   "globalFontSizeAdaptiveStep10": "36px",
   "globalFontFamiliesSageIcons": "sage-icons",
-  "globalFontFamiliesSageHeadline": "Sage Headline",
-  "globalFontFamiliesSageUi": "Sage UI",
-  "globalFontFamiliesSageText": "Sage Text",
+  "globalFontFamiliesHeading": "Sage UI",
+  "globalFontFamiliesSubheading": "Sage UI",
+  "globalFontFamiliesBody": "Sage UI",
+  "globalFontFamiliesComponent": "Sage UI",
   "globalFontFamiliesOther": "Open Sans"
 }

package/json/flat/marketing/small/light/components/form.json

@@ -10,6 +10,9 @@
   "formSpaceCheckradioYS": 3,
   "formSpaceCheckradioYM": 2,
   "formSpaceCheckradioYL": 4,
+  "formSpaceDatepickerPrS": 2,
+  "formSpaceDatepickerPrM": 6,
+  "formSpaceDatepickerPrL": 10,
   "formSpaceDropdownButtonXS": 16,
   "formSpaceDropdownButtonXM": 16,
   "formSpaceDropdownButtonXL": 16,

package/json/flat/product/large/dark/components/form.json

@@ -10,6 +10,9 @@
   "formSpaceCheckradioYS": 3,
   "formSpaceCheckradioYM": 2,
   "formSpaceCheckradioYL": 4,
+  "formSpaceDatepickerPrS": 2,
+  "formSpaceDatepickerPrM": 6,
+  "formSpaceDatepickerPrL": 10,
   "formSpaceDropdownButtonXS": 20,
   "formSpaceDropdownButtonXM": 20,
   "formSpaceDropdownButtonXL": 20,

package/json/flat/product/large/global.json

@@ -179,8 +179,9 @@
   "globalFontSizeAdaptiveStep9": "46px",
   "globalFontSizeAdaptiveStep10": "52px",
   "globalFontFamiliesSageIcons": "sage-icons",
-  "globalFontFamiliesSageHeadline": "Sage Headline",
-  "globalFontFamiliesSageUi": "Sage UI",
-  "globalFontFamiliesSageText": "Sage Text",
+  "globalFontFamiliesHeading": "Sage UI",
+  "globalFontFamiliesSubheading": "Sage UI",
+  "globalFontFamiliesBody": "Sage UI",
+  "globalFontFamiliesComponent": "Sage UI",
   "globalFontFamiliesOther": "Open Sans"
 }

package/json/flat/product/large/light/components/form.json

@@ -10,6 +10,9 @@
   "formSpaceCheckradioYS": 3,
   "formSpaceCheckradioYM": 2,
   "formSpaceCheckradioYL": 4,
+  "formSpaceDatepickerPrS": 2,
+  "formSpaceDatepickerPrM": 6,
+  "formSpaceDatepickerPrL": 10,
   "formSpaceDropdownButtonXS": 20,
   "formSpaceDropdownButtonXM": 20,
   "formSpaceDropdownButtonXL": 20,

package/json/flat/product/small/dark/components/form.json

@@ -10,6 +10,9 @@
   "formSpaceCheckradioYS": 3,
   "formSpaceCheckradioYM": 2,
   "formSpaceCheckradioYL": 4,
+  "formSpaceDatepickerPrS": 2,
+  "formSpaceDatepickerPrM": 6,
+  "formSpaceDatepickerPrL": 10,
   "formSpaceDropdownButtonXS": 16,
   "formSpaceDropdownButtonXM": 16,
   "formSpaceDropdownButtonXL": 16,

package/json/flat/product/small/global.json

@@ -179,8 +179,9 @@
   "globalFontSizeAdaptiveStep9": "33px",
   "globalFontSizeAdaptiveStep10": "36px",
   "globalFontFamiliesSageIcons": "sage-icons",
-  "globalFontFamiliesSageHeadline": "Sage Headline",
-  "globalFontFamiliesSageUi": "Sage UI",
-  "globalFontFamiliesSageText": "Sage Text",
+  "globalFontFamiliesHeading": "Sage UI",
+  "globalFontFamiliesSubheading": "Sage UI",
+  "globalFontFamiliesBody": "Sage UI",
+  "globalFontFamiliesComponent": "Sage UI",
   "globalFontFamiliesOther": "Open Sans"
 }

package/json/flat/product/small/light/components/form.json

@@ -10,6 +10,9 @@
   "formSpaceCheckradioYS": 3,
   "formSpaceCheckradioYM": 2,
   "formSpaceCheckradioYL": 4,
+  "formSpaceDatepickerPrS": 2,
+  "formSpaceDatepickerPrM": 6,
+  "formSpaceDatepickerPrL": 10,
   "formSpaceDropdownButtonXS": 16,
   "formSpaceDropdownButtonXM": 16,
   "formSpaceDropdownButtonXL": 16,

package/json/nested/frozenproduct/large/dark/components/form.json

@@ -30,6 +30,13 @@
           "L": 4
         }
       },
+      "datepicker": {
+        "pr": {
+          "S": 2,
+          "M": 6,
+          "L": 10
+        }
+      },
       "dropdown": {
         "button": {
           "x": {

package/json/nested/frozenproduct/large/global.json

@@ -902,9 +902,10 @@
     },
     "fontFamilies": {
       "sage-icons": "sage-icons",
-      "sage-headline": "Sage Headline",
-      "sage-ui": "Sage UI",
-      "sage-text": "Sage Text",
+      "heading": "Sage UI",
+      "subheading": "Sage UI",
+      "body": "Sage UI",
+      "component": "Sage UI",
       "other": "Open Sans"
     }
   }

package/json/nested/frozenproduct/large/light/components/form.json

@@ -30,6 +30,13 @@
           "L": 4
         }
       },
+      "datepicker": {
+        "pr": {
+          "S": 2,
+          "M": 6,
+          "L": 10
+        }
+      },
       "dropdown": {
         "button": {
           "x": {

package/json/nested/frozenproduct/small/dark/components/form.json

@@ -30,6 +30,13 @@
           "L": 4
         }
       },
+      "datepicker": {
+        "pr": {
+          "S": 2,
+          "M": 6,
+          "L": 10
+        }
+      },
       "dropdown": {
         "button": {
           "x": {

package/json/nested/frozenproduct/small/global.json

@@ -902,9 +902,10 @@
     },
     "fontFamilies": {
       "sage-icons": "sage-icons",
-      "sage-headline": "Sage Headline",
-      "sage-ui": "Sage UI",
-      "sage-text": "Sage Text",
+      "heading": "Sage UI",
+      "subheading": "Sage UI",
+      "body": "Sage UI",
+      "component": "Sage UI",
       "other": "Open Sans"
     }
   }

package/json/nested/frozenproduct/small/light/components/form.json

@@ -30,6 +30,13 @@
           "L": 4
         }
       },
+      "datepicker": {
+        "pr": {
+          "S": 2,
+          "M": 6,
+          "L": 10
+        }
+      },
       "dropdown": {
         "button": {
           "x": {

package/json/nested/marketing/large/dark/components/form.json

@@ -30,6 +30,13 @@
           "L": 4
         }
       },
+      "datepicker": {
+        "pr": {
+          "S": 2,
+          "M": 6,
+          "L": 10
+        }
+      },
       "dropdown": {
         "button": {
           "x": {

package/json/nested/marketing/large/global.json

@@ -902,9 +902,10 @@
     },
     "fontFamilies": {
       "sage-icons": "sage-icons",
-      "sage-headline": "Sage Headline",
-      "sage-ui": "Sage UI",
-      "sage-text": "Sage Text",
+      "heading": "Sage UI",
+      "subheading": "Sage UI",
+      "body": "Sage UI",
+      "component": "Sage UI",
       "other": "Open Sans"
     }
   }

package/json/nested/marketing/large/light/components/form.json

@@ -30,6 +30,13 @@
           "L": 4
         }
       },
+      "datepicker": {
+        "pr": {
+          "S": 2,
+          "M": 6,
+          "L": 10
+        }
+      },
       "dropdown": {
         "button": {
           "x": {

package/json/nested/marketing/small/dark/components/form.json

@@ -30,6 +30,13 @@
           "L": 4
         }
       },
+      "datepicker": {
+        "pr": {
+          "S": 2,
+          "M": 6,
+          "L": 10
+        }
+      },
       "dropdown": {
         "button": {
           "x": {

package/json/nested/marketing/small/global.json

@@ -902,9 +902,10 @@
     },
     "fontFamilies": {
       "sage-icons": "sage-icons",
-      "sage-headline": "Sage Headline",
-      "sage-ui": "Sage UI",
-      "sage-text": "Sage Text",
+      "heading": "Sage UI",
+      "subheading": "Sage UI",
+      "body": "Sage UI",
+      "component": "Sage UI",
       "other": "Open Sans"
     }
   }

package/json/nested/marketing/small/light/components/form.json

@@ -30,6 +30,13 @@
           "L": 4
         }
       },
+      "datepicker": {
+        "pr": {
+          "S": 2,
+          "M": 6,
+          "L": 10
+        }
+      },
       "dropdown": {
         "button": {
           "x": {

package/json/nested/product/large/dark/components/form.json

@@ -30,6 +30,13 @@
           "L": 4
         }
       },
+      "datepicker": {
+        "pr": {
+          "S": 2,
+          "M": 6,
+          "L": 10
+        }
+      },
       "dropdown": {
         "button": {
           "x": {

package/json/nested/product/large/global.json

@@ -902,9 +902,10 @@
     },
     "fontFamilies": {
       "sage-icons": "sage-icons",
-      "sage-headline": "Sage Headline",
-      "sage-ui": "Sage UI",
-      "sage-text": "Sage Text",
+      "heading": "Sage UI",
+      "subheading": "Sage UI",
+      "body": "Sage UI",
+      "component": "Sage UI",
       "other": "Open Sans"
     }
   }

package/json/nested/product/large/light/components/form.json

@@ -30,6 +30,13 @@
           "L": 4
         }
       },
+      "datepicker": {
+        "pr": {
+          "S": 2,
+          "M": 6,
+          "L": 10
+        }
+      },
       "dropdown": {
         "button": {
           "x": {

package/json/nested/product/small/dark/components/form.json

@@ -30,6 +30,13 @@
           "L": 4
         }
       },
+      "datepicker": {
+        "pr": {
+          "S": 2,
+          "M": 6,
+          "L": 10
+        }
+      },
       "dropdown": {
         "button": {
           "x": {

package/json/nested/product/small/global.json

@@ -902,9 +902,10 @@
     },
     "fontFamilies": {
       "sage-icons": "sage-icons",
-      "sage-headline": "Sage Headline",
-      "sage-ui": "Sage UI",
-      "sage-text": "Sage Text",
+      "heading": "Sage UI",
+      "subheading": "Sage UI",
+      "body": "Sage UI",
+      "component": "Sage UI",
       "other": "Open Sans"
     }
   }

package/json/nested/product/small/light/components/form.json

@@ -30,6 +30,13 @@
           "L": 4
         }
       },
+      "datepicker": {
+        "pr": {
+          "S": 2,
+          "M": 6,
+          "L": 10
+        }
+      },
       "dropdown": {
         "button": {
           "x": {

package/package.json

@@ -6,7 +6,7 @@
   },
   "description": "Design tokens for the Sage Design System.",
   "author": "The Sage Group plc",
-  "version": "14.3.0",
+  "version": "14.5.0",
   "license": "SEE LICENSE IN https://github.com/Sage/design-tokens/blob/master/license",
   "tags": [
     "design tokens",

package/scss/frozenproduct/large/components/form.scss

@@ -61,6 +61,9 @@ $form-space-chip-yg-l: $global-space-micro-xxl; // gap between large chip button
 $form-space-checkradio-y-s: $global-space-micro-m / 2; // Space above single checkbox/radio OR label to vertically centre checkbox and label.
 $form-space-checkradio-y-m: $global-space-micro-xs; // Space above single checkbox/radio OR label to vertically centre checkbox and label.
 $form-space-checkradio-y-l: $global-space-micro-xs * 2; // Space above single checkbox/radio OR label to vertically centre checkbox and label.
+$form-space-datepicker-pr-s: $global-space-micro-xs; // right padding on small date picker input
+$form-space-datepicker-pr-m: $global-space-micro-m; // right padding on medium date picker input
+$form-space-datepicker-pr-l: $global-space-micro-xl; // right padding on large date picker input
 $form-space-dropdown-button-x-s: $global-space-macro-s; // DD only, left right padding on footer button.
 $form-space-dropdown-button-x-m: $global-space-macro-s; // DD only, left right padding on footer button.
 $form-space-dropdown-button-x-l: $global-space-macro-s; // DD only, left right padding on footer button.

package/scss/frozenproduct/large/global.scss

@@ -185,7 +185,8 @@ $global-font-size-adaptive-step8: 40px;
 $global-font-size-adaptive-step9: 46px;
 $global-font-size-adaptive-step10: 52px;
 $global-font-families-sage-icons: sage-icons;
-$global-font-families-sage-headline: Sage Headline; // Used in only in marketing contexts for some headings.
-$global-font-families-sage-ui: Sage UI; // Used in componentry such as tables, buttons, inputs etc.
-$global-font-families-sage-text: Sage Text; // Used for Headings in product and in marketing contexts. Marketing also use it for their body copy.
+$global-font-families-heading: Sage UI;
+$global-font-families-subheading: Sage UI;
+$global-font-families-body: Sage UI;
+$global-font-families-component: Sage UI; // Used in componentry such as tables, buttons, inputs etc.
 $global-font-families-other: Open Sans; // Fallback for when Sage fonts cannot load.