@sage/design-tokens 7.2.0 → 7.3.1

package/ios/product/small/dark/components/form.h

@@ -92,15 +92,18 @@
 #define formSpaceIntegralYgS 6
 #define formSpaceIntegralYgM 8
 #define formSpaceIntegralYgL 10
-#define formSpaceIntegralProgressiveXS 17.2
-#define formSpaceIntegralProgressiveXM 25.6
-#define formSpaceIntegralProgressiveXL 34
+#define formSpaceIntegralProgressiveXS 9.8
+#define formSpaceIntegralProgressiveXM 16
+#define formSpaceIntegralProgressiveXL 20.2
 #define formSpaceIntegralProgressiveYS 8
 #define formSpaceIntegralProgressiveYM 12
 #define formSpaceIntegralProgressiveYL 16
 #define formSpaceIntegralProgressiveYgS 8
 #define formSpaceIntegralProgressiveYgM 12
 #define formSpaceIntegralProgressiveYgL 16
+#define formSpaceIntegralProgressiveKeylineXS 5.4
+#define formSpaceIntegralProgressiveKeylineXM 8.6
+#define formSpaceIntegralProgressiveKeylineXL 11.8
 #define formSpaceRatingXgM 8
 #define formSpaceRatingXgL 12
 #define formSpaceLayoutStackS 12.8
@@ -186,6 +189,7 @@
 #define formSizeSearchInputMaxwidth 400
 #define formSizeTextareaM 80
 #define formSizeValidationBar 2
+#define formSizeProgressiveBar 2
 #define formSizeRatingM 20
 #define formSizeRatingL 32
 #define formColorCalendarBgActive #FFFFFF
@@ -270,6 +274,7 @@
 #define formRadiusRadio 999
 #define formRadiusSwitch 999
 #define formRadiusValidationbar 2
+#define formRadiusProgressivebar 2
 #define formRadiusCalendarNone 0
 #define formRadiusCalendarDate 999
 #define formRadiusCalendarToday 2

package/ios/product/small/dark/components/tab.h

@@ -50,7 +50,7 @@
 #define tabRadiusIndicatorM 2
 #define tabRadiusIndicatorL 2
 #define tabRadiusNone 0
-#define tabBorderwidthNavigationBottom 4
+#define tabBorderwidthNavigationBottom 2
 #define tabBorderwidthNavigationSide 2
 #define tabTypographyAdaptiveLabelS [object Object]
 #define tabTypographyAdaptiveLabelM [object Object]

package/ios/product/small/light/components/form.h

@@ -92,15 +92,18 @@
 #define formSpaceIntegralYgS 6
 #define formSpaceIntegralYgM 8
 #define formSpaceIntegralYgL 10
-#define formSpaceIntegralProgressiveXS 17.2
-#define formSpaceIntegralProgressiveXM 25.6
-#define formSpaceIntegralProgressiveXL 34
+#define formSpaceIntegralProgressiveXS 9.8
+#define formSpaceIntegralProgressiveXM 16
+#define formSpaceIntegralProgressiveXL 20.2
 #define formSpaceIntegralProgressiveYS 8
 #define formSpaceIntegralProgressiveYM 12
 #define formSpaceIntegralProgressiveYL 16
 #define formSpaceIntegralProgressiveYgS 8
 #define formSpaceIntegralProgressiveYgM 12
 #define formSpaceIntegralProgressiveYgL 16
+#define formSpaceIntegralProgressiveKeylineXS 5.4
+#define formSpaceIntegralProgressiveKeylineXM 8.6
+#define formSpaceIntegralProgressiveKeylineXL 11.8
 #define formSpaceRatingXgM 8
 #define formSpaceRatingXgL 12
 #define formSpaceLayoutStackS 12.8
@@ -186,6 +189,7 @@
 #define formSizeSearchInputMaxwidth 400
 #define formSizeTextareaM 80
 #define formSizeValidationBar 2
+#define formSizeProgressiveBar 2
 #define formSizeRatingM 20
 #define formSizeRatingL 32
 #define formColorCalendarBgActive #000000
@@ -270,6 +274,7 @@
 #define formRadiusRadio 999
 #define formRadiusSwitch 999
 #define formRadiusValidationbar 2
+#define formRadiusProgressivebar 2
 #define formRadiusCalendarNone 0
 #define formRadiusCalendarDate 999
 #define formRadiusCalendarToday 2

package/ios/product/small/light/components/tab.h

@@ -50,7 +50,7 @@
 #define tabRadiusIndicatorM 2
 #define tabRadiusIndicatorL 2
 #define tabRadiusNone 0
-#define tabBorderwidthNavigationBottom 4
+#define tabBorderwidthNavigationBottom 2
 #define tabBorderwidthNavigationSide 2
 #define tabTypographyAdaptiveLabelS [object Object]
 #define tabTypographyAdaptiveLabelM [object Object]

package/js/common/frozenproduct/large/dark/components/form.d.ts

@@ -231,6 +231,13 @@ declare const tokens: {
             M: DesignToken;
             L: DesignToken;
           };
+          keyline: {
+            x: {
+              S: DesignToken;
+              M: DesignToken;
+              L: DesignToken;
+            };
+          };
         };
       };
       rating: {
@@ -410,6 +417,9 @@ declare const tokens: {
       validation: {
         bar: DesignToken;
       };
+      progressive: {
+        bar: DesignToken;
+      };
       rating: {
         M: DesignToken;
         L: DesignToken;
@@ -512,6 +522,7 @@ declare const tokens: {
       radio: DesignToken;
       switch: DesignToken;
       validationbar: DesignToken;
+      progressivebar: DesignToken;
       calendar: {
         none: DesignToken;
         date: DesignToken;

package/js/common/frozenproduct/large/dark/components/form.js

@@ -1478,14 +1478,14 @@ module.exports = {
           x: {
             S: {
               $type: "spacing",
-              $value: 22,
+              $value: 13,
               $description:
                 "Left padding on progressively shown form inputs on radio and checkbox",
               filePath: "data/tokens/components/form.json",
               isSource: true,
               original: {
                 $type: "spacing",
-                $value: "{global.space.macro.M} - {global.space.micro.XS}",
+                $value: "{global.space.macro.XS} - 3",
                 $description:
                   "Left padding on progressively shown form inputs on radio and checkbox",
               },
@@ -1495,14 +1495,14 @@ module.exports = {
             },
             M: {
               $type: "spacing",
-              $value: 32,
+              $value: 20,
               $description:
                 "Left padding on progressively shown form inputs on radio and checkbox",
               filePath: "data/tokens/components/form.json",
               isSource: true,
               original: {
                 $type: "spacing",
-                $value: "{global.space.macro.L}",
+                $value: "{global.space.macro.S}",
                 $description:
                   "Left padding on progressively shown form inputs on radio and checkbox",
               },
@@ -1512,14 +1512,14 @@ module.exports = {
             },
             L: {
               $type: "spacing",
-              $value: 42,
+              $value: 25,
               $description:
                 "Left padding on progressively shown form inputs on radio and checkbox",
               filePath: "data/tokens/components/form.json",
               isSource: true,
               original: {
                 $type: "spacing",
-                $value: "{global.space.macro.XL} + {global.space.micro.XS}",
+                $value: "{global.space.macro.M} + 1",
                 $description:
                   "Left padding on progressively shown form inputs on radio and checkbox",
               },
@@ -1634,6 +1634,85 @@ module.exports = {
               path: ["form", "space", "integral", "progressive", "yg", "L"],
             },
           },
+          keyline: {
+            x: {
+              S: {
+                $type: "spacing",
+                $value: 7,
+                $description:
+                  "Left padding on keyline for small progressively shown inputs",
+                filePath: "data/tokens/components/form.json",
+                isSource: true,
+                original: {
+                  $type: "spacing",
+                  $value: "{global.space.macro.XXXS} - 1",
+                  $description:
+                    "Left padding on keyline for small progressively shown inputs",
+                },
+                name: "formSpaceIntegralProgressiveKeylineXS",
+                attributes: {},
+                path: [
+                  "form",
+                  "space",
+                  "integral",
+                  "progressive",
+                  "keyline",
+                  "x",
+                  "S",
+                ],
+              },
+              M: {
+                $type: "spacing",
+                $value: 11,
+                $description:
+                  "Left padding on keyline for medium progressively shown inputs",
+                filePath: "data/tokens/components/form.json",
+                isSource: true,
+                original: {
+                  $type: "spacing",
+                  $value: "{global.space.macro.XXS} - 1",
+                  $description:
+                    "Left padding on keyline for medium progressively shown inputs",
+                },
+                name: "formSpaceIntegralProgressiveKeylineXM",
+                attributes: {},
+                path: [
+                  "form",
+                  "space",
+                  "integral",
+                  "progressive",
+                  "keyline",
+                  "x",
+                  "M",
+                ],
+              },
+              L: {
+                $type: "spacing",
+                $value: 15,
+                $description:
+                  "Left padding on keyline for large progressively shown inputs",
+                filePath: "data/tokens/components/form.json",
+                isSource: true,
+                original: {
+                  $type: "spacing",
+                  $value: "{global.space.macro.XS} - 1",
+                  $description:
+                    "Left padding on keyline for large progressively shown inputs",
+                },
+                name: "formSpaceIntegralProgressiveKeylineXL",
+                attributes: {},
+                path: [
+                  "form",
+                  "space",
+                  "integral",
+                  "progressive",
+                  "keyline",
+                  "x",
+                  "L",
+                ],
+              },
+            },
+          },
         },
       },
       rating: {
@@ -3002,6 +3081,25 @@ module.exports = {
           path: ["form", "size", "validation", "bar"],
         },
       },
+      progressive: {
+        bar: {
+          $type: "sizing",
+          $value: 2,
+          $description:
+            "2px progressive disclosure keyline bar used in checkbox and radio groups",
+          filePath: "data/tokens/components/form.json",
+          isSource: true,
+          original: {
+            $type: "sizing",
+            $value: "{global.size.micro.XXS}",
+            $description:
+              "2px progressive disclosure keyline bar used in checkbox and radio groups",
+          },
+          name: "formSizeProgressiveBar",
+          attributes: {},
+          path: ["form", "size", "progressive", "bar"],
+        },
+      },
       rating: {
         M: {
           $type: "sizing",
@@ -4171,6 +4269,21 @@ module.exports = {
         attributes: {},
         path: ["form", "radius", "validationbar"],
       },
+      progressivebar: {
+        $type: "borderRadius",
+        $value: 2,
+        $description: "Validation bar",
+        filePath: "data/tokens/components/form.json",
+        isSource: true,
+        original: {
+          $type: "borderRadius",
+          $value: "{global.radius.interactive.XS}",
+          $description: "Validation bar",
+        },
+        name: "formRadiusProgressivebar",
+        attributes: {},
+        path: ["form", "radius", "progressivebar"],
+      },
       calendar: {
         none: {
           $type: "borderRadius",

package/js/common/frozenproduct/large/dark/components/tab.js

@@ -621,13 +621,13 @@ module.exports = {
       navigation: {
         bottom: {
           $type: "borderWidth",
-          $value: 4,
+          $value: 2,
           $description: "Tab (enabled and hover bottom border)",
           filePath: "data/tokens/components/tab.json",
           isSource: true,
           original: {
             $type: "borderWidth",
-            $value: "{global.borderwidth.L}",
+            $value: "{global.borderwidth.S}",
             $description: "Tab (enabled and hover bottom border)",
           },
           name: "tabBorderwidthNavigationBottom",

package/js/common/frozenproduct/large/light/components/form.d.ts

@@ -231,6 +231,13 @@ declare const tokens: {
             M: DesignToken;
             L: DesignToken;
           };
+          keyline: {
+            x: {
+              S: DesignToken;
+              M: DesignToken;
+              L: DesignToken;
+            };
+          };
         };
       };
       rating: {
@@ -410,6 +417,9 @@ declare const tokens: {
       validation: {
         bar: DesignToken;
       };
+      progressive: {
+        bar: DesignToken;
+      };
       rating: {
         M: DesignToken;
         L: DesignToken;
@@ -512,6 +522,7 @@ declare const tokens: {
       radio: DesignToken;
       switch: DesignToken;
       validationbar: DesignToken;
+      progressivebar: DesignToken;
       calendar: {
         none: DesignToken;
         date: DesignToken;

package/js/common/frozenproduct/large/light/components/form.js

@@ -1478,14 +1478,14 @@ module.exports = {
           x: {
             S: {
               $type: "spacing",
-              $value: 22,
+              $value: 13,
               $description:
                 "Left padding on progressively shown form inputs on radio and checkbox",
               filePath: "data/tokens/components/form.json",
               isSource: true,
               original: {
                 $type: "spacing",
-                $value: "{global.space.macro.M} - {global.space.micro.XS}",
+                $value: "{global.space.macro.XS} - 3",
                 $description:
                   "Left padding on progressively shown form inputs on radio and checkbox",
               },
@@ -1495,14 +1495,14 @@ module.exports = {
             },
             M: {
               $type: "spacing",
-              $value: 32,
+              $value: 20,
               $description:
                 "Left padding on progressively shown form inputs on radio and checkbox",
               filePath: "data/tokens/components/form.json",
               isSource: true,
               original: {
                 $type: "spacing",
-                $value: "{global.space.macro.L}",
+                $value: "{global.space.macro.S}",
                 $description:
                   "Left padding on progressively shown form inputs on radio and checkbox",
               },
@@ -1512,14 +1512,14 @@ module.exports = {
             },
             L: {
               $type: "spacing",
-              $value: 42,
+              $value: 25,
               $description:
                 "Left padding on progressively shown form inputs on radio and checkbox",
               filePath: "data/tokens/components/form.json",
               isSource: true,
               original: {
                 $type: "spacing",
-                $value: "{global.space.macro.XL} + {global.space.micro.XS}",
+                $value: "{global.space.macro.M} + 1",
                 $description:
                   "Left padding on progressively shown form inputs on radio and checkbox",
               },
@@ -1634,6 +1634,85 @@ module.exports = {
               path: ["form", "space", "integral", "progressive", "yg", "L"],
             },
           },
+          keyline: {
+            x: {
+              S: {
+                $type: "spacing",
+                $value: 7,
+                $description:
+                  "Left padding on keyline for small progressively shown inputs",
+                filePath: "data/tokens/components/form.json",
+                isSource: true,
+                original: {
+                  $type: "spacing",
+                  $value: "{global.space.macro.XXXS} - 1",
+                  $description:
+                    "Left padding on keyline for small progressively shown inputs",
+                },
+                name: "formSpaceIntegralProgressiveKeylineXS",
+                attributes: {},
+                path: [
+                  "form",
+                  "space",
+                  "integral",
+                  "progressive",
+                  "keyline",
+                  "x",
+                  "S",
+                ],
+              },
+              M: {
+                $type: "spacing",
+                $value: 11,
+                $description:
+                  "Left padding on keyline for medium progressively shown inputs",
+                filePath: "data/tokens/components/form.json",
+                isSource: true,
+                original: {
+                  $type: "spacing",
+                  $value: "{global.space.macro.XXS} - 1",
+                  $description:
+                    "Left padding on keyline for medium progressively shown inputs",
+                },
+                name: "formSpaceIntegralProgressiveKeylineXM",
+                attributes: {},
+                path: [
+                  "form",
+                  "space",
+                  "integral",
+                  "progressive",
+                  "keyline",
+                  "x",
+                  "M",
+                ],
+              },
+              L: {
+                $type: "spacing",
+                $value: 15,
+                $description:
+                  "Left padding on keyline for large progressively shown inputs",
+                filePath: "data/tokens/components/form.json",
+                isSource: true,
+                original: {
+                  $type: "spacing",
+                  $value: "{global.space.macro.XS} - 1",
+                  $description:
+                    "Left padding on keyline for large progressively shown inputs",
+                },
+                name: "formSpaceIntegralProgressiveKeylineXL",
+                attributes: {},
+                path: [
+                  "form",
+                  "space",
+                  "integral",
+                  "progressive",
+                  "keyline",
+                  "x",
+                  "L",
+                ],
+              },
+            },
+          },
         },
       },
       rating: {
@@ -3002,6 +3081,25 @@ module.exports = {
           path: ["form", "size", "validation", "bar"],
         },
       },
+      progressive: {
+        bar: {
+          $type: "sizing",
+          $value: 2,
+          $description:
+            "2px progressive disclosure keyline bar used in checkbox and radio groups",
+          filePath: "data/tokens/components/form.json",
+          isSource: true,
+          original: {
+            $type: "sizing",
+            $value: "{global.size.micro.XXS}",
+            $description:
+              "2px progressive disclosure keyline bar used in checkbox and radio groups",
+          },
+          name: "formSizeProgressiveBar",
+          attributes: {},
+          path: ["form", "size", "progressive", "bar"],
+        },
+      },
       rating: {
         M: {
           $type: "sizing",
@@ -4171,6 +4269,21 @@ module.exports = {
         attributes: {},
         path: ["form", "radius", "validationbar"],
       },
+      progressivebar: {
+        $type: "borderRadius",
+        $value: 2,
+        $description: "Validation bar",
+        filePath: "data/tokens/components/form.json",
+        isSource: true,
+        original: {
+          $type: "borderRadius",
+          $value: "{global.radius.interactive.XS}",
+          $description: "Validation bar",
+        },
+        name: "formRadiusProgressivebar",
+        attributes: {},
+        path: ["form", "radius", "progressivebar"],
+      },
       calendar: {
         none: {
           $type: "borderRadius",

package/js/common/frozenproduct/large/light/components/tab.js

@@ -621,13 +621,13 @@ module.exports = {
       navigation: {
         bottom: {
           $type: "borderWidth",
-          $value: 4,
+          $value: 2,
           $description: "Tab (enabled and hover bottom border)",
           filePath: "data/tokens/components/tab.json",
           isSource: true,
           original: {
             $type: "borderWidth",
-            $value: "{global.borderwidth.L}",
+            $value: "{global.borderwidth.S}",
             $description: "Tab (enabled and hover bottom border)",
           },
           name: "tabBorderwidthNavigationBottom",

package/js/common/frozenproduct/small/dark/components/form.d.ts

@@ -231,6 +231,13 @@ declare const tokens: {
             M: DesignToken;
             L: DesignToken;
           };
+          keyline: {
+            x: {
+              S: DesignToken;
+              M: DesignToken;
+              L: DesignToken;
+            };
+          };
         };
       };
       rating: {
@@ -410,6 +417,9 @@ declare const tokens: {
       validation: {
         bar: DesignToken;
       };
+      progressive: {
+        bar: DesignToken;
+      };
       rating: {
         M: DesignToken;
         L: DesignToken;
@@ -512,6 +522,7 @@ declare const tokens: {
       radio: DesignToken;
       switch: DesignToken;
       validationbar: DesignToken;
+      progressivebar: DesignToken;
       calendar: {
         none: DesignToken;
         date: DesignToken;