@sage/design-tokens 14.7.0 → 14.8.0

package/css/frozenproduct/all.css

@@ -2523,8 +2523,9 @@
   --table-color-footer-border-default: light-dark(var(--modes-color-generic-fg-delicate-light), var(--modes-color-generic-fg-delicate-dark)); /* Header borders */
   --table-color-footer-label-default: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
   --table-radius-container: var(--global-radius-container-m); /* Table (parent container) */
-  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border */
-  --table-borderwidth-thick: var(--global-borderwidth-s); /* header border for subtle */
+  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border. Optional choice of cell border width. */
+  --table-borderwidth-medium: var(--global-borderwidth-s); /* Header border for subtle. Optional choice of cell border width. */
+  --table-borderwidth-thick: var(--global-borderwidth-m); /* Optional choice of cell border width. */
   --table-space-none: var(--global-space-none);
   --table-space-yg: var(--global-space-micro-s); /* space between table and pagination */
   --table-space-row-x-xs: var(--global-space-micro-l); /* Left and right padding inside XS row cells */

package/css/frozenproduct/large/components/table.css

@@ -54,8 +54,9 @@
   --table-color-footer-border-default: var(--modes-color-generic-fg-delicate); /* Header borders */
   --table-color-footer-label-default: var(--modes-color-interactive-monochrome-default);
   --table-radius-container: var(--global-radius-container-m); /* Table (parent container) */
-  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border */
-  --table-borderwidth-thick: var(--global-borderwidth-s); /* header border for subtle */
+  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border. Optional choice of cell border width. */
+  --table-borderwidth-medium: var(--global-borderwidth-s); /* Header border for subtle. Optional choice of cell border width. */
+  --table-borderwidth-thick: var(--global-borderwidth-m); /* Optional choice of cell border width. */
   --table-space-none: var(--global-space-none);
   --table-space-yg: var(--global-space-micro-s); /* space between table and pagination */
   --table-space-row-x-xs: var(--global-space-micro-l); /* Left and right padding inside XS row cells */

package/css/frozenproduct/small/components/table.css

@@ -54,8 +54,9 @@
   --table-color-footer-border-default: var(--modes-color-generic-fg-delicate); /* Header borders */
   --table-color-footer-label-default: var(--modes-color-interactive-monochrome-default);
   --table-radius-container: var(--global-radius-container-m); /* Table (parent container) */
-  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border */
-  --table-borderwidth-thick: var(--global-borderwidth-s); /* header border for subtle */
+  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border. Optional choice of cell border width. */
+  --table-borderwidth-medium: var(--global-borderwidth-s); /* Header border for subtle. Optional choice of cell border width. */
+  --table-borderwidth-thick: var(--global-borderwidth-m); /* Optional choice of cell border width. */
   --table-space-none: var(--global-space-none);
   --table-space-yg: var(--global-space-micro-s); /* space between table and pagination */
   --table-space-row-x-xs: var(--global-space-micro-l); /* Left and right padding inside XS row cells */

package/css/marketing/all.css

@@ -2523,8 +2523,9 @@
   --table-color-footer-border-default: light-dark(var(--modes-color-generic-fg-delicate-light), var(--modes-color-generic-fg-delicate-dark)); /* Header borders */
   --table-color-footer-label-default: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
   --table-radius-container: var(--global-radius-container-m); /* Table (parent container) */
-  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border */
-  --table-borderwidth-thick: var(--global-borderwidth-s); /* header border for subtle */
+  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border. Optional choice of cell border width. */
+  --table-borderwidth-medium: var(--global-borderwidth-s); /* Header border for subtle. Optional choice of cell border width. */
+  --table-borderwidth-thick: var(--global-borderwidth-m); /* Optional choice of cell border width. */
   --table-space-none: var(--global-space-none);
   --table-space-yg: var(--global-space-micro-s); /* space between table and pagination */
   --table-space-row-x-xs: var(--global-space-micro-l); /* Left and right padding inside XS row cells */

package/css/marketing/large/components/table.css

@@ -54,8 +54,9 @@
   --table-color-footer-border-default: var(--modes-color-generic-fg-delicate); /* Header borders */
   --table-color-footer-label-default: var(--modes-color-interactive-monochrome-default);
   --table-radius-container: var(--global-radius-container-m); /* Table (parent container) */
-  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border */
-  --table-borderwidth-thick: var(--global-borderwidth-s); /* header border for subtle */
+  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border. Optional choice of cell border width. */
+  --table-borderwidth-medium: var(--global-borderwidth-s); /* Header border for subtle. Optional choice of cell border width. */
+  --table-borderwidth-thick: var(--global-borderwidth-m); /* Optional choice of cell border width. */
   --table-space-none: var(--global-space-none);
   --table-space-yg: var(--global-space-micro-s); /* space between table and pagination */
   --table-space-row-x-xs: var(--global-space-micro-l); /* Left and right padding inside XS row cells */

package/css/marketing/small/components/table.css

@@ -54,8 +54,9 @@
   --table-color-footer-border-default: var(--modes-color-generic-fg-delicate); /* Header borders */
   --table-color-footer-label-default: var(--modes-color-interactive-monochrome-default);
   --table-radius-container: var(--global-radius-container-m); /* Table (parent container) */
-  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border */
-  --table-borderwidth-thick: var(--global-borderwidth-s); /* header border for subtle */
+  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border. Optional choice of cell border width. */
+  --table-borderwidth-medium: var(--global-borderwidth-s); /* Header border for subtle. Optional choice of cell border width. */
+  --table-borderwidth-thick: var(--global-borderwidth-m); /* Optional choice of cell border width. */
   --table-space-none: var(--global-space-none);
   --table-space-yg: var(--global-space-micro-s); /* space between table and pagination */
   --table-space-row-x-xs: var(--global-space-micro-l); /* Left and right padding inside XS row cells */

package/css/product/all.css

@@ -2482,7 +2482,6 @@
 
   /* table component tokens */
   --table-color-header-subtle-bg-default: light-dark(var(--modes-color-none-light), var(--modes-color-none-dark));
-  --table-color-row-bg-active: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
   --table-color-row-bg-default: light-dark(var(--modes-color-generic-bg-nought-light), var(--modes-color-generic-bg-nought-dark));
   --table-color-row-label-hover: light-dark(var(--modes-color-generic-content-extreme-light), var(--modes-color-generic-content-extreme-dark));
   --table-typography-heading-s: var(--global-typography-component-firm-s);
@@ -2494,37 +2493,39 @@
   --table-typography-label-s: var(--global-typography-component-firm-s);
   --table-typography-label-m: var(--global-typography-component-firm-m);
   --table-typography-label-l: var(--global-typography-component-firm-l);
-  --table-color-header-subtle-bg-alt: light-dark(var(--modes-color-interactive-monochrome-subtle-default-light), var(--modes-color-interactive-monochrome-subtle-default-dark)); /* header alt */
-  --table-color-header-subtle-bg-hover: light-dark(var(--modes-color-interactive-monochrome-hover-light), var(--modes-color-interactive-monochrome-hover-dark));
-  --table-color-header-subtle-label-default: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
-  --table-color-header-subtle-label-hover: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
-  --table-color-header-harsh-bg-alt: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark)); /* header alt */
-  --table-color-header-harsh-bg-default: light-dark(var(--modes-color-interactive-monochrome-default-alt-light), var(--modes-color-interactive-monochrome-default-alt-dark));
-  --table-color-header-harsh-bg-hover: light-dark(var(--modes-color-interactive-monochrome-hover-light), var(--modes-color-interactive-monochrome-hover-dark));
-  --table-color-header-harsh-label-hover: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
   --table-color-row-bg-activated: light-dark(var(--modes-color-interactive-primary-default-light), var(--modes-color-interactive-primary-default-dark));
+  --table-color-row-bg-active: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
   --table-color-row-bg-alt: light-dark(var(--modes-color-generic-bg-delicate-light), var(--modes-color-generic-bg-delicate-dark)); /* Zebra stripes */
   --table-color-row-bg-alt2: light-dark(var(--modes-color-generic-bg-soft-light), var(--modes-color-generic-bg-soft-dark)); /* Zebra stripes combined with child rows. */
   --table-color-row-bg-alt3: light-dark(var(--modes-color-generic-bg-faint-light), var(--modes-color-generic-bg-faint-dark)); /* Child rows. */
   --table-color-row-bg-hover: light-dark(var(--modes-color-generic-bg-soft-light), var(--modes-color-generic-bg-soft-dark));
   --table-color-row-label-default: light-dark(var(--modes-color-generic-content-harsh-light), var(--modes-color-generic-content-harsh-dark));
   --table-color-footer-bg-default: light-dark(var(--modes-color-generic-bg-soft-light), var(--modes-color-generic-bg-soft-dark));
-  --table-color-footer-label-default: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
   --table-boxshadow-parentrow: var(--global-boxshadow-container-far);
   --table-boxshadow-firstchild: var(--global-boxshadow-inner-near);
   --table-boxshadow-column-sticky-left: var(--global-boxshadow-cleanedge-near-right); /* Right shadow on left hand sticky column. */
   --table-boxshadow-column-sticky-right: var(--global-boxshadow-cleanedge-near-left); /* Left shadow on right hand sticky column. */
   --table-boxshadow-row-dragging: var(--global-boxshadow-interactive-drag); /* dragging state for a table row */
+  --table-color-header-subtle-bg-alt: light-dark(var(--modes-color-interactive-monochrome-subtle-default-light), var(--modes-color-interactive-monochrome-subtle-default-dark)); /* header alt */
+  --table-color-header-subtle-bg-hover: light-dark(var(--modes-color-interactive-monochrome-hover-light), var(--modes-color-interactive-monochrome-hover-dark));
   --table-color-header-subtle-border-default: light-dark(var(--modes-color-generic-fg-delicate-light), var(--modes-color-generic-fg-delicate-dark)); /* Header borders */
+  --table-color-header-subtle-label-default: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
+  --table-color-header-subtle-label-hover: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
+  --table-color-header-harsh-bg-alt: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark)); /* header alt */
+  --table-color-header-harsh-bg-default: light-dark(var(--modes-color-interactive-monochrome-default-alt-light), var(--modes-color-interactive-monochrome-default-alt-dark));
+  --table-color-header-harsh-bg-hover: light-dark(var(--modes-color-interactive-monochrome-hover-light), var(--modes-color-interactive-monochrome-hover-dark));
   --table-color-header-harsh-border-default: light-dark(var(--modes-color-generic-fg-soft-light), var(--modes-color-generic-fg-soft-dark));
   --table-color-header-harsh-label-default: light-dark(var(--modes-color-interactive-monochrome-with-default-light), var(--modes-color-interactive-monochrome-with-default-dark));
+  --table-color-header-harsh-label-hover: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
   --table-color-row-border-default: light-dark(var(--modes-color-generic-fg-delicate-light), var(--modes-color-generic-fg-delicate-dark));
   --table-color-row-label-activated: light-dark(var(--modes-color-interactive-monochrome-with-active-light), var(--modes-color-interactive-monochrome-with-active-dark));
   --table-color-row-label-active: light-dark(var(--modes-color-interactive-monochrome-with-active-light), var(--modes-color-interactive-monochrome-with-active-dark));
   --table-color-footer-border-default: light-dark(var(--modes-color-generic-fg-delicate-light), var(--modes-color-generic-fg-delicate-dark)); /* Header borders */
+  --table-color-footer-label-default: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
   --table-radius-container: var(--global-radius-container-m); /* Table (parent container) */
-  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border */
-  --table-borderwidth-thick: var(--global-borderwidth-s); /* header border for subtle */
+  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border. Optional choice of cell border width. */
+  --table-borderwidth-medium: var(--global-borderwidth-s); /* Header border for subtle. Optional choice of cell border width. */
+  --table-borderwidth-thick: var(--global-borderwidth-m); /* Optional choice of cell border width. */
   --table-space-none: var(--global-space-none);
   --table-space-yg: var(--global-space-micro-s); /* space between table and pagination */
   --table-space-row-x-xs: var(--global-space-micro-l); /* Left and right padding inside XS row cells */

package/css/product/large/components/table.css

@@ -54,8 +54,9 @@
   --table-color-footer-border-default: var(--modes-color-generic-fg-delicate); /* Header borders */
   --table-color-footer-label-default: var(--modes-color-interactive-monochrome-default);
   --table-radius-container: var(--global-radius-container-m); /* Table (parent container) */
-  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border */
-  --table-borderwidth-thick: var(--global-borderwidth-s); /* header border for subtle */
+  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border. Optional choice of cell border width. */
+  --table-borderwidth-medium: var(--global-borderwidth-s); /* Header border for subtle. Optional choice of cell border width. */
+  --table-borderwidth-thick: var(--global-borderwidth-m); /* Optional choice of cell border width. */
   --table-space-none: var(--global-space-none);
   --table-space-yg: var(--global-space-micro-s); /* space between table and pagination */
   --table-space-row-x-xs: var(--global-space-micro-l); /* Left and right padding inside XS row cells */

package/css/product/small/components/table.css

@@ -4,7 +4,6 @@
 
 :root {
   --table-color-header-subtle-bg-default: var(--modes-color-none);
-  --table-color-row-bg-active: var(--modes-color-interactive-monochrome-active);
   --table-color-row-bg-default: var(--modes-color-generic-bg-nought);
   --table-color-row-label-hover: var(--modes-color-generic-content-extreme);
   --table-typography-adaptive-heading-s: var(--global-typography-adaptive-component-firm-s);
@@ -25,37 +24,39 @@
   --table-typography-responsive-label-s: var(--global-typography-responsive-component-firm-s);
   --table-typography-responsive-label-m: var(--global-typography-responsive-component-firm-m);
   --table-typography-responsive-label-l: var(--global-typography-responsive-component-firm-l);
-  --table-color-header-subtle-bg-alt: var(--modes-color-interactive-monochrome-subtle-default); /* header alt */
-  --table-color-header-subtle-bg-hover: var(--modes-color-interactive-monochrome-hover);
-  --table-color-header-subtle-label-default: var(--modes-color-interactive-monochrome-default);
-  --table-color-header-subtle-label-hover: var(--modes-color-interactive-monochrome-default);
-  --table-color-header-harsh-bg-alt: var(--modes-color-interactive-monochrome-default); /* header alt */
-  --table-color-header-harsh-bg-default: var(--modes-color-interactive-monochrome-default-alt);
-  --table-color-header-harsh-bg-hover: var(--modes-color-interactive-monochrome-hover);
-  --table-color-header-harsh-label-hover: var(--modes-color-interactive-monochrome-default);
   --table-color-row-bg-activated: var(--modes-color-interactive-primary-default);
+  --table-color-row-bg-active: var(--modes-color-interactive-monochrome-active);
   --table-color-row-bg-alt: var(--modes-color-generic-bg-delicate); /* Zebra stripes */
   --table-color-row-bg-alt2: var(--modes-color-generic-bg-soft); /* Zebra stripes combined with child rows. */
   --table-color-row-bg-alt3: var(--modes-color-generic-bg-faint); /* Child rows. */
   --table-color-row-bg-hover: var(--modes-color-generic-bg-soft);
   --table-color-row-label-default: var(--modes-color-generic-content-harsh);
   --table-color-footer-bg-default: var(--modes-color-generic-bg-soft);
-  --table-color-footer-label-default: var(--modes-color-interactive-monochrome-default);
   --table-boxshadow-parentrow: var(--global-boxshadow-container-far);
   --table-boxshadow-firstchild: var(--global-boxshadow-inner-near);
   --table-boxshadow-column-sticky-left: var(--global-boxshadow-cleanedge-near-right); /* Right shadow on left hand sticky column. */
   --table-boxshadow-column-sticky-right: var(--global-boxshadow-cleanedge-near-left); /* Left shadow on right hand sticky column. */
   --table-boxshadow-row-dragging: var(--global-boxshadow-interactive-drag); /* dragging state for a table row */
+  --table-color-header-subtle-bg-alt: var(--modes-color-interactive-monochrome-subtle-default); /* header alt */
+  --table-color-header-subtle-bg-hover: var(--modes-color-interactive-monochrome-hover);
   --table-color-header-subtle-border-default: var(--modes-color-generic-fg-delicate); /* Header borders */
+  --table-color-header-subtle-label-default: var(--modes-color-interactive-monochrome-default);
+  --table-color-header-subtle-label-hover: var(--modes-color-interactive-monochrome-default);
+  --table-color-header-harsh-bg-alt: var(--modes-color-interactive-monochrome-default); /* header alt */
+  --table-color-header-harsh-bg-default: var(--modes-color-interactive-monochrome-default-alt);
+  --table-color-header-harsh-bg-hover: var(--modes-color-interactive-monochrome-hover);
   --table-color-header-harsh-border-default: var(--modes-color-generic-fg-soft);
   --table-color-header-harsh-label-default: var(--modes-color-interactive-monochrome-with-default);
+  --table-color-header-harsh-label-hover: var(--modes-color-interactive-monochrome-default);
   --table-color-row-border-default: var(--modes-color-generic-fg-delicate);
   --table-color-row-label-activated: var(--modes-color-interactive-monochrome-with-active);
   --table-color-row-label-active: var(--modes-color-interactive-monochrome-with-active);
   --table-color-footer-border-default: var(--modes-color-generic-fg-delicate); /* Header borders */
+  --table-color-footer-label-default: var(--modes-color-interactive-monochrome-default);
   --table-radius-container: var(--global-radius-container-m); /* Table (parent container) */
-  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border */
-  --table-borderwidth-thick: var(--global-borderwidth-s); /* header border for subtle */
+  --table-borderwidth-thin: var(--global-borderwidth-xs); /* Table border. Optional choice of cell border width. */
+  --table-borderwidth-medium: var(--global-borderwidth-s); /* Header border for subtle. Optional choice of cell border width. */
+  --table-borderwidth-thick: var(--global-borderwidth-m); /* Optional choice of cell border width. */
   --table-space-none: var(--global-space-none);
   --table-space-yg: var(--global-space-micro-s); /* space between table and pagination */
   --table-space-row-x-xs: var(--global-space-micro-l); /* Left and right padding inside XS row cells */

package/ios/frozenproduct/large/dark/components/table.h

@@ -43,7 +43,8 @@
 #define tableBoxshadowColumnStickyRight [object Object],[object Object]
 #define tableBoxshadowRowDragging [object Object],[object Object]
 #define tableBorderwidthThin 1
-#define tableBorderwidthThick 2
+#define tableBorderwidthMedium 2
+#define tableBorderwidthThick 3
 #define tableSpaceNone 0
 #define tableSpaceYg 4
 #define tableSpaceRowXXs 8

package/ios/frozenproduct/large/light/components/table.h

@@ -43,7 +43,8 @@
 #define tableBoxshadowColumnStickyRight [object Object],[object Object]
 #define tableBoxshadowRowDragging [object Object],[object Object]
 #define tableBorderwidthThin 1
-#define tableBorderwidthThick 2
+#define tableBorderwidthMedium 2
+#define tableBorderwidthThick 3
 #define tableSpaceNone 0
 #define tableSpaceYg 4
 #define tableSpaceRowXXs 8

package/ios/frozenproduct/small/dark/components/table.h

@@ -43,7 +43,8 @@
 #define tableBoxshadowColumnStickyRight [object Object],[object Object]
 #define tableBoxshadowRowDragging [object Object],[object Object]
 #define tableBorderwidthThin 1
-#define tableBorderwidthThick 2
+#define tableBorderwidthMedium 2
+#define tableBorderwidthThick 3
 #define tableSpaceNone 0
 #define tableSpaceYg 4
 #define tableSpaceRowXXs 8

package/ios/frozenproduct/small/light/components/table.h

@@ -43,7 +43,8 @@
 #define tableBoxshadowColumnStickyRight [object Object],[object Object]
 #define tableBoxshadowRowDragging [object Object],[object Object]
 #define tableBorderwidthThin 1
-#define tableBorderwidthThick 2
+#define tableBorderwidthMedium 2
+#define tableBorderwidthThick 3
 #define tableSpaceNone 0
 #define tableSpaceYg 4
 #define tableSpaceRowXXs 8

package/ios/marketing/large/dark/components/table.h

@@ -43,7 +43,8 @@
 #define tableBoxshadowColumnStickyRight [object Object],[object Object]
 #define tableBoxshadowRowDragging [object Object],[object Object]
 #define tableBorderwidthThin 1
-#define tableBorderwidthThick 2
+#define tableBorderwidthMedium 2
+#define tableBorderwidthThick 3
 #define tableSpaceNone 0
 #define tableSpaceYg 4
 #define tableSpaceRowXXs 8

package/ios/marketing/large/light/components/table.h

@@ -43,7 +43,8 @@
 #define tableBoxshadowColumnStickyRight [object Object],[object Object]
 #define tableBoxshadowRowDragging [object Object],[object Object]
 #define tableBorderwidthThin 1
-#define tableBorderwidthThick 2
+#define tableBorderwidthMedium 2
+#define tableBorderwidthThick 3
 #define tableSpaceNone 0
 #define tableSpaceYg 4
 #define tableSpaceRowXXs 8

package/ios/marketing/small/dark/components/table.h

@@ -43,7 +43,8 @@
 #define tableBoxshadowColumnStickyRight [object Object],[object Object]
 #define tableBoxshadowRowDragging [object Object],[object Object]
 #define tableBorderwidthThin 1
-#define tableBorderwidthThick 2
+#define tableBorderwidthMedium 2
+#define tableBorderwidthThick 3
 #define tableSpaceNone 0
 #define tableSpaceYg 4
 #define tableSpaceRowXXs 8

package/ios/marketing/small/light/components/table.h

@@ -43,7 +43,8 @@
 #define tableBoxshadowColumnStickyRight [object Object],[object Object]
 #define tableBoxshadowRowDragging [object Object],[object Object]
 #define tableBorderwidthThin 1
-#define tableBorderwidthThick 2
+#define tableBorderwidthMedium 2
+#define tableBorderwidthThick 3
 #define tableSpaceNone 0
 #define tableSpaceYg 4
 #define tableSpaceRowXXs 8

package/ios/product/large/dark/components/table.h

@@ -43,7 +43,8 @@
 #define tableBoxshadowColumnStickyRight [object Object],[object Object]
 #define tableBoxshadowRowDragging [object Object],[object Object]
 #define tableBorderwidthThin 1
-#define tableBorderwidthThick 2
+#define tableBorderwidthMedium 2
+#define tableBorderwidthThick 3
 #define tableSpaceNone 0
 #define tableSpaceYg 4
 #define tableSpaceRowXXs 8

package/ios/product/large/light/components/table.h

@@ -43,7 +43,8 @@
 #define tableBoxshadowColumnStickyRight [object Object],[object Object]
 #define tableBoxshadowRowDragging [object Object],[object Object]
 #define tableBorderwidthThin 1
-#define tableBorderwidthThick 2
+#define tableBorderwidthMedium 2
+#define tableBorderwidthThick 3
 #define tableSpaceNone 0
 #define tableSpaceYg 4
 #define tableSpaceRowXXs 8

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

@@ -43,7 +43,8 @@
 #define tableBoxshadowColumnStickyRight [object Object],[object Object]
 #define tableBoxshadowRowDragging [object Object],[object Object]
 #define tableBorderwidthThin 1
-#define tableBorderwidthThick 2
+#define tableBorderwidthMedium 2
+#define tableBorderwidthThick 3
 #define tableSpaceNone 0
 #define tableSpaceYg 4
 #define tableSpaceRowXXs 8

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

@@ -43,7 +43,8 @@
 #define tableBoxshadowColumnStickyRight [object Object],[object Object]
 #define tableBoxshadowRowDragging [object Object],[object Object]
 #define tableBorderwidthThin 1
-#define tableBorderwidthThick 2
+#define tableBorderwidthMedium 2
+#define tableBorderwidthThick 3
 #define tableSpaceNone 0
 #define tableSpaceYg 4
 #define tableSpaceRowXXs 8

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

@@ -75,6 +75,7 @@ declare const tokens: {
     };
     borderwidth: {
       thin: DesignToken;
+      medium: DesignToken;
       thick: DesignToken;
     };
     space: {

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

@@ -560,28 +560,45 @@ module.exports = {
       thin: {
         $type: "borderWidth",
         $value: 1,
-        $description: "Table border",
+        $description: "Table border. Optional choice of cell border width.",
         filePath: "data/tokens/components/table.json",
         isSource: true,
         original: {
           $type: "borderWidth",
           $value: "{global.borderwidth.XS}",
-          $description: "Table border",
+          $description: "Table border. Optional choice of cell border width.",
         },
         name: "tableBorderwidthThin",
         attributes: {},
         path: ["table", "borderwidth", "thin"],
       },
-      thick: {
+      medium: {
         $type: "borderWidth",
         $value: 2,
-        $description: "header border for subtle",
+        $description:
+          "Header border for subtle. Optional choice of cell border width.",
         filePath: "data/tokens/components/table.json",
         isSource: true,
         original: {
           $type: "borderWidth",
           $value: "{global.borderwidth.S}",
-          $description: "header border for subtle",
+          $description:
+            "Header border for subtle. Optional choice of cell border width.",
+        },
+        name: "tableBorderwidthMedium",
+        attributes: {},
+        path: ["table", "borderwidth", "medium"],
+      },
+      thick: {
+        $type: "borderWidth",
+        $value: 3,
+        $description: "Optional choice of cell border width.",
+        filePath: "data/tokens/components/table.json",
+        isSource: true,
+        original: {
+          $type: "borderWidth",
+          $value: "{global.borderwidth.M}",
+          $description: "Optional choice of cell border width.",
         },
         name: "tableBorderwidthThick",
         attributes: {},

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

@@ -75,6 +75,7 @@ declare const tokens: {
     };
     borderwidth: {
       thin: DesignToken;
+      medium: DesignToken;
       thick: DesignToken;
     };
     space: {

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

@@ -560,28 +560,45 @@ module.exports = {
       thin: {
         $type: "borderWidth",
         $value: 1,
-        $description: "Table border",
+        $description: "Table border. Optional choice of cell border width.",
         filePath: "data/tokens/components/table.json",
         isSource: true,
         original: {
           $type: "borderWidth",
           $value: "{global.borderwidth.XS}",
-          $description: "Table border",
+          $description: "Table border. Optional choice of cell border width.",
         },
         name: "tableBorderwidthThin",
         attributes: {},
         path: ["table", "borderwidth", "thin"],
       },
-      thick: {
+      medium: {
         $type: "borderWidth",
         $value: 2,
-        $description: "header border for subtle",
+        $description:
+          "Header border for subtle. Optional choice of cell border width.",
         filePath: "data/tokens/components/table.json",
         isSource: true,
         original: {
           $type: "borderWidth",
           $value: "{global.borderwidth.S}",
-          $description: "header border for subtle",
+          $description:
+            "Header border for subtle. Optional choice of cell border width.",
+        },
+        name: "tableBorderwidthMedium",
+        attributes: {},
+        path: ["table", "borderwidth", "medium"],
+      },
+      thick: {
+        $type: "borderWidth",
+        $value: 3,
+        $description: "Optional choice of cell border width.",
+        filePath: "data/tokens/components/table.json",
+        isSource: true,
+        original: {
+          $type: "borderWidth",
+          $value: "{global.borderwidth.M}",
+          $description: "Optional choice of cell border width.",
         },
         name: "tableBorderwidthThick",
         attributes: {},

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

@@ -75,6 +75,7 @@ declare const tokens: {
     };
     borderwidth: {
       thin: DesignToken;
+      medium: DesignToken;
       thick: DesignToken;
     };
     space: {

package/js/common/frozenproduct/small/dark/components/table.js

@@ -560,28 +560,45 @@ module.exports = {
       thin: {
         $type: "borderWidth",
         $value: 1,
-        $description: "Table border",
+        $description: "Table border. Optional choice of cell border width.",
         filePath: "data/tokens/components/table.json",
         isSource: true,
         original: {
           $type: "borderWidth",
           $value: "{global.borderwidth.XS}",
-          $description: "Table border",
+          $description: "Table border. Optional choice of cell border width.",
         },
         name: "tableBorderwidthThin",
         attributes: {},
         path: ["table", "borderwidth", "thin"],
       },
-      thick: {
+      medium: {
         $type: "borderWidth",
         $value: 2,
-        $description: "header border for subtle",
+        $description:
+          "Header border for subtle. Optional choice of cell border width.",
         filePath: "data/tokens/components/table.json",
         isSource: true,
         original: {
           $type: "borderWidth",
           $value: "{global.borderwidth.S}",
-          $description: "header border for subtle",
+          $description:
+            "Header border for subtle. Optional choice of cell border width.",
+        },
+        name: "tableBorderwidthMedium",
+        attributes: {},
+        path: ["table", "borderwidth", "medium"],
+      },
+      thick: {
+        $type: "borderWidth",
+        $value: 3,
+        $description: "Optional choice of cell border width.",
+        filePath: "data/tokens/components/table.json",
+        isSource: true,
+        original: {
+          $type: "borderWidth",
+          $value: "{global.borderwidth.M}",
+          $description: "Optional choice of cell border width.",
         },
         name: "tableBorderwidthThick",
         attributes: {},

package/js/common/frozenproduct/small/light/components/table.d.ts

@@ -75,6 +75,7 @@ declare const tokens: {
     };
     borderwidth: {
       thin: DesignToken;
+      medium: DesignToken;
       thick: DesignToken;
     };
     space: {

package/js/common/frozenproduct/small/light/components/table.js

@@ -560,28 +560,45 @@ module.exports = {
       thin: {
         $type: "borderWidth",
         $value: 1,
-        $description: "Table border",
+        $description: "Table border. Optional choice of cell border width.",
         filePath: "data/tokens/components/table.json",
         isSource: true,
         original: {
           $type: "borderWidth",
           $value: "{global.borderwidth.XS}",
-          $description: "Table border",
+          $description: "Table border. Optional choice of cell border width.",
         },
         name: "tableBorderwidthThin",
         attributes: {},
         path: ["table", "borderwidth", "thin"],
       },
-      thick: {
+      medium: {
         $type: "borderWidth",
         $value: 2,
-        $description: "header border for subtle",
+        $description:
+          "Header border for subtle. Optional choice of cell border width.",
         filePath: "data/tokens/components/table.json",
         isSource: true,
         original: {
           $type: "borderWidth",
           $value: "{global.borderwidth.S}",
-          $description: "header border for subtle",
+          $description:
+            "Header border for subtle. Optional choice of cell border width.",
+        },
+        name: "tableBorderwidthMedium",
+        attributes: {},
+        path: ["table", "borderwidth", "medium"],
+      },
+      thick: {
+        $type: "borderWidth",
+        $value: 3,
+        $description: "Optional choice of cell border width.",
+        filePath: "data/tokens/components/table.json",
+        isSource: true,
+        original: {
+          $type: "borderWidth",
+          $value: "{global.borderwidth.M}",
+          $description: "Optional choice of cell border width.",
         },
         name: "tableBorderwidthThick",
         attributes: {},

package/js/common/marketing/large/dark/components/table.d.ts

@@ -75,6 +75,7 @@ declare const tokens: {
     };
     borderwidth: {
       thin: DesignToken;
+      medium: DesignToken;
       thick: DesignToken;
     };
     space: {