@vkontakte/vkui-tokens 4.3.2-dev-db778e.0 → 4.4.0

package/themes/media/cssVars/theme/fallbacks/index.css

@@ -139,6 +139,9 @@
 	--var(--vkui--prefix, vkui)--size_card_border_radius--regular: var(--vkui--size_card_border_radius--regular, 16px);
 	--var(--vkui--prefix, vkui)--size_cardgrid_padding_vertical--regular: var(--vkui--size_cardgrid_padding_vertical--regular, 8px);
 	--var(--vkui--prefix, vkui)--size_base_padding_horizontal--regular: var(--vkui--size_base_padding_horizontal--regular, 16px);
+	--var(--vkui--prefix, vkui)--size_button_group_gap_space--regular: var(--vkui--size_button_group_gap_space--regular, 1px);
+	--var(--vkui--prefix, vkui)--size_button_group_gap_small--regular: var(--vkui--size_button_group_gap_small--regular, 8px);
+	--var(--vkui--prefix, vkui)--size_button_group_gap_medium--regular: var(--vkui--size_button_group_gap_medium--regular, 12px);
 	--var(--vkui--prefix, vkui)--elevation1: var(--vkui--elevation1, 0 2px 0 0 rgba(0, 16, 61, 0.04));
 	--var(--vkui--prefix, vkui)--elevation2: var(--vkui--elevation2, 0 4px 32px 0 rgba(0, 16, 61, 0.32));
 	--var(--vkui--prefix, vkui)--elevation3: var(--vkui--elevation3, 0 4px 20px 0 rgba(0,0,0,.16));

package/themes/media/cssVars/theme/fallbacks/index.less

@@ -50,6 +50,9 @@
 @var(--vkui--prefix, vkui)-size-card-border-radius--regular: var(--vkui--size_card_border_radius--regular, 16px);
 @var(--vkui--prefix, vkui)-size-cardgrid-padding-vertical--regular: var(--vkui--size_cardgrid_padding_vertical--regular, 8px);
 @var(--vkui--prefix, vkui)-size-base-padding-horizontal--regular: var(--vkui--size_base_padding_horizontal--regular, 16px);
+@var(--vkui--prefix, vkui)-size-button-group-gap-space--regular: var(--vkui--size_button_group_gap_space--regular, 1px);
+@var(--vkui--prefix, vkui)-size-button-group-gap-small--regular: var(--vkui--size_button_group_gap_small--regular, 8px);
+@var(--vkui--prefix, vkui)-size-button-group-gap-medium--regular: var(--vkui--size_button_group_gap_medium--regular, 12px);
 @var(--vkui--prefix, vkui)-elevation1: var(--vkui--elevation1, 0 2px 0 0 rgba(0, 16, 61, 0.04));
 @var(--vkui--prefix, vkui)-elevation2: var(--vkui--elevation2, 0 4px 32px 0 rgba(0, 16, 61, 0.32));
 @var(--vkui--prefix, vkui)-elevation3: var(--vkui--elevation3, 0 4px 20px 0 rgba(0,0,0,.16));

package/themes/media/cssVars/theme/fallbacks/index.pcss

@@ -51,6 +51,9 @@
 	--var(--vkui--prefix, vkui)--size-card-border-radius--regular: var(--vkui--size_card_border_radius--regular, 16px);
 	--var(--vkui--prefix, vkui)--size-cardgrid-padding-vertical--regular: var(--vkui--size_cardgrid_padding_vertical--regular, 8px);
 	--var(--vkui--prefix, vkui)--size-base-padding-horizontal--regular: var(--vkui--size_base_padding_horizontal--regular, 16px);
+	--var(--vkui--prefix, vkui)--size-button-group-gap-space--regular: var(--vkui--size_button_group_gap_space--regular, 1px);
+	--var(--vkui--prefix, vkui)--size-button-group-gap-small--regular: var(--vkui--size_button_group_gap_small--regular, 8px);
+	--var(--vkui--prefix, vkui)--size-button-group-gap-medium--regular: var(--vkui--size_button_group_gap_medium--regular, 12px);
 	--var(--vkui--prefix, vkui)--elevation1: var(--vkui--elevation1, 0 2px 0 0 rgba(0, 16, 61, 0.04));
 	--var(--vkui--prefix, vkui)--elevation2: var(--vkui--elevation2, 0 4px 32px 0 rgba(0, 16, 61, 0.32));
 	--var(--vkui--prefix, vkui)--elevation3: var(--vkui--elevation3, 0 4px 20px 0 rgba(0,0,0,.16));

package/themes/media/cssVars/theme/fallbacks/index.scss

@@ -50,6 +50,9 @@ $var(--vkui--prefix, vkui)-size-cardgrid-padding--regular: var(--vkui--size_card
 $var(--vkui--prefix, vkui)-size-card-border-radius--regular: var(--vkui--size_card_border_radius--regular, 16px);
 $var(--vkui--prefix, vkui)-size-cardgrid-padding-vertical--regular: var(--vkui--size_cardgrid_padding_vertical--regular, 8px);
 $var(--vkui--prefix, vkui)-size-base-padding-horizontal--regular: var(--vkui--size_base_padding_horizontal--regular, 16px);
+$var(--vkui--prefix, vkui)-size-button-group-gap-space--regular: var(--vkui--size_button_group_gap_space--regular, 1px);
+$var(--vkui--prefix, vkui)-size-button-group-gap-small--regular: var(--vkui--size_button_group_gap_small--regular, 8px);
+$var(--vkui--prefix, vkui)-size-button-group-gap-medium--regular: var(--vkui--size_button_group_gap_medium--regular, 12px);
 $var(--vkui--prefix, vkui)-elevation1: var(--vkui--elevation1, 0 2px 0 0 rgba(0, 16, 61, 0.04));
 $var(--vkui--prefix, vkui)-elevation2: var(--vkui--elevation2, 0 4px 32px 0 rgba(0, 16, 61, 0.32));
 $var(--vkui--prefix, vkui)-elevation3: var(--vkui--elevation3, 0 4px 20px 0 rgba(0,0,0,.16));

package/themes/media/cssVars/theme/fallbacks/index.styl

@@ -50,6 +50,9 @@ $var(--vkui--prefix, vkui)-size-cardgrid-padding--regular = var(--vkui--size_car
 $var(--vkui--prefix, vkui)-size-card-border-radius--regular = var(--vkui--size_card_border_radius--regular, 16px);
 $var(--vkui--prefix, vkui)-size-cardgrid-padding-vertical--regular = var(--vkui--size_cardgrid_padding_vertical--regular, 8px);
 $var(--vkui--prefix, vkui)-size-base-padding-horizontal--regular = var(--vkui--size_base_padding_horizontal--regular, 16px);
+$var(--vkui--prefix, vkui)-size-button-group-gap-space--regular = var(--vkui--size_button_group_gap_space--regular, 1px);
+$var(--vkui--prefix, vkui)-size-button-group-gap-small--regular = var(--vkui--size_button_group_gap_small--regular, 8px);
+$var(--vkui--prefix, vkui)-size-button-group-gap-medium--regular = var(--vkui--size_button_group_gap_medium--regular, 12px);
 $var(--vkui--prefix, vkui)-elevation1 = var(--vkui--elevation1, 0 2px 0 0 rgba(0, 16, 61, 0.04));
 $var(--vkui--prefix, vkui)-elevation2 = var(--vkui--elevation2, 0 4px 32px 0 rgba(0, 16, 61, 0.32));
 $var(--vkui--prefix, vkui)-elevation3 = var(--vkui--elevation3, 0 4px 20px 0 rgba(0,0,0,.16));

package/themes/media/cssVars/theme/index.js

@@ -1181,6 +1181,36 @@ var theme = {
             "value": "var(--vkui--size_base_padding_horizontal--regular, 16px)"
         }
     },
+    "sizeButtonGroupGapSpace": {
+        "auto": {
+            "name": "--vkui--size_button_group_gap_space",
+            "value": "var(--vkui--size_button_group_gap_space)"
+        },
+        "regular": {
+            "name": "--vkui--size_button_group_gap_space--regular",
+            "value": "var(--vkui--size_button_group_gap_space--regular, 1px)"
+        }
+    },
+    "sizeButtonGroupGapSmall": {
+        "auto": {
+            "name": "--vkui--size_button_group_gap_small",
+            "value": "var(--vkui--size_button_group_gap_small)"
+        },
+        "regular": {
+            "name": "--vkui--size_button_group_gap_small--regular",
+            "value": "var(--vkui--size_button_group_gap_small--regular, 8px)"
+        }
+    },
+    "sizeButtonGroupGapMedium": {
+        "auto": {
+            "name": "--vkui--size_button_group_gap_medium",
+            "value": "var(--vkui--size_button_group_gap_medium)"
+        },
+        "regular": {
+            "name": "--vkui--size_button_group_gap_medium--regular",
+            "value": "var(--vkui--size_button_group_gap_medium--regular, 12px)"
+        }
+    },
     "elevation1": {
         "name": "--vkui--elevation1",
         "value": "var(--vkui--elevation1, 0 2px 0 0 rgba(0, 16, 61, 0.04))"

package/themes/media/cssVars/theme/index.json

@@ -1179,6 +1179,36 @@
 			"value": "var(--vkui--size_base_padding_horizontal--regular, 16px)"
 		}
 	},
+	"sizeButtonGroupGapSpace": {
+		"auto": {
+			"name": "--vkui--size_button_group_gap_space",
+			"value": "var(--vkui--size_button_group_gap_space)"
+		},
+		"regular": {
+			"name": "--vkui--size_button_group_gap_space--regular",
+			"value": "var(--vkui--size_button_group_gap_space--regular, 1px)"
+		}
+	},
+	"sizeButtonGroupGapSmall": {
+		"auto": {
+			"name": "--vkui--size_button_group_gap_small",
+			"value": "var(--vkui--size_button_group_gap_small)"
+		},
+		"regular": {
+			"name": "--vkui--size_button_group_gap_small--regular",
+			"value": "var(--vkui--size_button_group_gap_small--regular, 8px)"
+		}
+	},
+	"sizeButtonGroupGapMedium": {
+		"auto": {
+			"name": "--vkui--size_button_group_gap_medium",
+			"value": "var(--vkui--size_button_group_gap_medium)"
+		},
+		"regular": {
+			"name": "--vkui--size_button_group_gap_medium--regular",
+			"value": "var(--vkui--size_button_group_gap_medium--regular, 12px)"
+		}
+	},
 	"elevation1": {
 		"name": "--vkui--elevation1",
 		"value": "var(--vkui--elevation1, 0 2px 0 0 rgba(0, 16, 61, 0.04))"

package/themes/media/index.css

@@ -139,6 +139,9 @@
 	--vkui--size_card_border_radius--regular: 16px;
 	--vkui--size_cardgrid_padding_vertical--regular: 8px;
 	--vkui--size_base_padding_horizontal--regular: 16px;
+	--vkui--size_button_group_gap_space--regular: 1px;
+	--vkui--size_button_group_gap_small--regular: 8px;
+	--vkui--size_button_group_gap_medium--regular: 12px;
 	--vkui--elevation1: 0 2px 0 0 rgba(0, 16, 61, 0.04);
 	--vkui--elevation2: 0 4px 32px 0 rgba(0, 16, 61, 0.32);
 	--vkui--elevation3: 0 4px 20px 0 rgba(0,0,0,.16);

package/themes/media/index.js

@@ -293,6 +293,15 @@ var theme = {
     "sizeBasePaddingHorizontal": {
         "regular": 16
     },
+    "sizeButtonGroupGapSpace": {
+        "regular": 1
+    },
+    "sizeButtonGroupGapSmall": {
+        "regular": 8
+    },
+    "sizeButtonGroupGapMedium": {
+        "regular": 12
+    },
     "elevation1": "0 2px 0 0 rgba(0, 16, 61, 0.04)",
     "elevation2": "0 4px 32px 0 rgba(0, 16, 61, 0.32)",
     "elevation3": "0 4px 20px 0 rgba(0,0,0,.16)",

package/themes/media/index.json

@@ -291,6 +291,15 @@
 	"sizeBasePaddingHorizontal": {
 		"regular": 16
 	},
+	"sizeButtonGroupGapSpace": {
+		"regular": 1
+	},
+	"sizeButtonGroupGapSmall": {
+		"regular": 8
+	},
+	"sizeButtonGroupGapMedium": {
+		"regular": 12
+	},
 	"elevation1": "0 2px 0 0 rgba(0, 16, 61, 0.04)",
 	"elevation2": "0 4px 32px 0 rgba(0, 16, 61, 0.32)",
 	"elevation3": "0 4px 20px 0 rgba(0,0,0,.16)",

package/themes/media/index.less

@@ -50,6 +50,9 @@
 @vkui-size-card-border-radius--regular: 16px;
 @vkui-size-cardgrid-padding-vertical--regular: 8px;
 @vkui-size-base-padding-horizontal--regular: 16px;
+@vkui-size-button-group-gap-space--regular: 1px;
+@vkui-size-button-group-gap-small--regular: 8px;
+@vkui-size-button-group-gap-medium--regular: 12px;
 @vkui-elevation1: 0 2px 0 0 rgba(0, 16, 61, 0.04);
 @vkui-elevation2: 0 4px 32px 0 rgba(0, 16, 61, 0.32);
 @vkui-elevation3: 0 4px 20px 0 rgba(0,0,0,.16);

package/themes/media/index.pcss

@@ -51,6 +51,9 @@
 	--vkui--size-card-border-radius--regular: 16px;
 	--vkui--size-cardgrid-padding-vertical--regular: 8px;
 	--vkui--size-base-padding-horizontal--regular: 16px;
+	--vkui--size-button-group-gap-space--regular: 1px;
+	--vkui--size-button-group-gap-small--regular: 8px;
+	--vkui--size-button-group-gap-medium--regular: 12px;
 	--vkui--elevation1: 0 2px 0 0 rgba(0, 16, 61, 0.04);
 	--vkui--elevation2: 0 4px 32px 0 rgba(0, 16, 61, 0.32);
 	--vkui--elevation3: 0 4px 20px 0 rgba(0,0,0,.16);

package/themes/media/index.scss

@@ -50,6 +50,9 @@ $vkui-size-cardgrid-padding--regular: 12px;
 $vkui-size-card-border-radius--regular: 16px;
 $vkui-size-cardgrid-padding-vertical--regular: 8px;
 $vkui-size-base-padding-horizontal--regular: 16px;
+$vkui-size-button-group-gap-space--regular: 1px;
+$vkui-size-button-group-gap-small--regular: 8px;
+$vkui-size-button-group-gap-medium--regular: 12px;
 $vkui-elevation1: 0 2px 0 0 rgba(0, 16, 61, 0.04);
 $vkui-elevation2: 0 4px 32px 0 rgba(0, 16, 61, 0.32);
 $vkui-elevation3: 0 4px 20px 0 rgba(0,0,0,.16);

package/themes/media/index.styl

@@ -50,6 +50,9 @@ $vkui-size-cardgrid-padding--regular = 12px;
 $vkui-size-card-border-radius--regular = 16px;
 $vkui-size-cardgrid-padding-vertical--regular = 8px;
 $vkui-size-base-padding-horizontal--regular = 16px;
+$vkui-size-button-group-gap-space--regular = 1px;
+$vkui-size-button-group-gap-small--regular = 8px;
+$vkui-size-button-group-gap-medium--regular = 12px;
 $vkui-elevation1 = 0 2px 0 0 rgba(0, 16, 61, 0.04);
 $vkui-elevation2 = 0 4px 32px 0 rgba(0, 16, 61, 0.32);
 $vkui-elevation3 = 0 4px 20px 0 rgba(0,0,0,.16);

package/themes/mediaDark/cssVars/declarations/index.css

@@ -139,6 +139,9 @@
 	--vkui--size_card_border_radius--regular: 16px;
 	--vkui--size_cardgrid_padding_vertical--regular: 8px;
 	--vkui--size_base_padding_horizontal--regular: 16px;
+	--vkui--size_button_group_gap_space--regular: 1px;
+	--vkui--size_button_group_gap_small--regular: 8px;
+	--vkui--size_button_group_gap_medium--regular: 12px;
 	--vkui--elevation1: 0 2px 0 0 rgba(0, 16, 61, 0.04);
 	--vkui--elevation2: 0 4px 32px 0 rgba(0, 16, 61, 0.32);
 	--vkui--elevation3: 0 4px 20px 0 rgba(0,0,0,.16);
@@ -1326,6 +1329,9 @@
 	--vkui--size_card_border_radius: 16px;
 	--vkui--size_cardgrid_padding_vertical: 8px;
 	--vkui--size_base_padding_horizontal: 16px;
+	--vkui--size_button_group_gap_space: 1px;
+	--vkui--size_button_group_gap_small: 8px;
+	--vkui--size_button_group_gap_medium: 12px;
 	--vkui--font_h0--font_size: var(--vkui--font_h0--font_size--regular);
 	--vkui--font_h0--line_height: var(--vkui--font_h0--line_height--regular);
 	--vkui--font_h0--font_family: var(--vkui--font_h0--font_family--regular);

package/themes/mediaDark/cssVars/declarations/noColors.css

@@ -139,6 +139,9 @@
 	--vkui--size_card_border_radius--regular: 16px;
 	--vkui--size_cardgrid_padding_vertical--regular: 8px;
 	--vkui--size_base_padding_horizontal--regular: 16px;
+	--vkui--size_button_group_gap_space--regular: 1px;
+	--vkui--size_button_group_gap_small--regular: 8px;
+	--vkui--size_button_group_gap_medium--regular: 12px;
 	--vkui--elevation1: 0 2px 0 0 rgba(0, 16, 61, 0.04);
 	--vkui--elevation2: 0 4px 32px 0 rgba(0, 16, 61, 0.32);
 	--vkui--elevation3: 0 4px 20px 0 rgba(0,0,0,.16);

package/themes/mediaDark/cssVars/declarations/onlyMedia.css

@@ -108,6 +108,9 @@
 	--vkui--size_card_border_radius: 16px;
 	--vkui--size_cardgrid_padding_vertical: 8px;
 	--vkui--size_base_padding_horizontal: 16px;
+	--vkui--size_button_group_gap_space: 1px;
+	--vkui--size_button_group_gap_small: 8px;
+	--vkui--size_button_group_gap_medium: 12px;
 	--vkui--font_h0--font_size: var(--vkui--font_h0--font_size--regular);
 	--vkui--font_h0--line_height: var(--vkui--font_h0--line_height--regular);
 	--vkui--font_h0--font_family: var(--vkui--font_h0--font_family--regular);

package/themes/mediaDark/cssVars/declarations/onlyVariables.css

@@ -139,6 +139,9 @@
 	--vkui--size_card_border_radius--regular: 16px;
 	--vkui--size_cardgrid_padding_vertical--regular: 8px;
 	--vkui--size_base_padding_horizontal--regular: 16px;
+	--vkui--size_button_group_gap_space--regular: 1px;
+	--vkui--size_button_group_gap_small--regular: 8px;
+	--vkui--size_button_group_gap_medium--regular: 12px;
 	--vkui--elevation1: 0 2px 0 0 rgba(0, 16, 61, 0.04);
 	--vkui--elevation2: 0 4px 32px 0 rgba(0, 16, 61, 0.32);
 	--vkui--elevation3: 0 4px 20px 0 rgba(0,0,0,.16);