@yahoo/uds 3.166.0 → 3.168.0

package/dist/css/dist/css/utils.cjs

@@ -46,18 +46,76 @@ const extractRuntimeConfigValues = (config) => {
 	};
 	const bottomSheetBackgroundColor = require_hookMetadata.getRuntimeFieldTokenValue(config, "useBottomSheetConfig", "backgroundColor", { variant: "default" });
 	if (bottomSheetBackgroundColor !== void 0) setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("useBottomSheetConfig", "backgroundColor", { variant: "default" }), bottomSheetBackgroundColor);
+	if (config.avatar?.variables && config.avatar?.defaults) {
+		setRuntimeValue(require_hookMetadata.getRuntimeDefaultPropSelector("useAvatarConfig", "size"), require_hookMetadata.getRuntimeDefaultPropValue(config, "useAvatarConfig", "size"));
+		require_hookMetadata.getRuntimeSelectorParamValues("useAvatarConfig", "size").forEach((size) => {
+			setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("useAvatarConfig", "iconSize", { size }), require_hookMetadata.getRuntimeFieldTokenValue(config, "useAvatarConfig", "iconSize", { size }));
+		});
+	}
+	if (config.badge?.variables && config.badge?.defaults) {
+		setRuntimeValue(require_hookMetadata.getRuntimeDefaultPropSelector("useBadgeConfig", "size"), require_hookMetadata.getRuntimeDefaultPropValue(config, "useBadgeConfig", "size"));
+		require_hookMetadata.getRuntimeSelectorParamValues("useBadgeConfig", "size").forEach((size) => {
+			setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("useBadgeConfig", "iconSize", { size }), require_hookMetadata.getRuntimeFieldTokenValue(config, "useBadgeConfig", "iconSize", { size }));
+		});
+	}
 	if (config.button?.variables && config.button?.defaults) {
 		setRuntimeValue(require_hookMetadata.getRuntimeDefaultPropSelector("useButtonConfig", "size"), require_hookMetadata.getRuntimeDefaultPropValue(config, "useButtonConfig", "size"));
 		require_hookMetadata.getRuntimeSelectorParamValues("useButtonConfig", "size").forEach((size) => {
 			setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("useButtonConfig", "iconSize", { size }), require_hookMetadata.getRuntimeFieldTokenValue(config, "useButtonConfig", "iconSize", { size }));
 		});
 	}
+	if (config.chip?.variables && config.chip?.defaults) {
+		setRuntimeValue(require_hookMetadata.getRuntimeDefaultPropSelector("useChipConfig", "size"), require_hookMetadata.getRuntimeDefaultPropValue(config, "useChipConfig", "size"));
+		require_hookMetadata.getRuntimeSelectorParamValues("useChipConfig", "size").forEach((size) => {
+			setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("useChipConfig", "iconSize", { size }), require_hookMetadata.getRuntimeFieldTokenValue(config, "useChipConfig", "iconSize", { size }));
+		});
+	}
 	if (config.iconButton?.variables && config.iconButton?.defaults) {
 		setRuntimeValue(require_hookMetadata.getRuntimeDefaultPropSelector("useIconButtonConfig", "size"), require_hookMetadata.getRuntimeDefaultPropValue(config, "useIconButtonConfig", "size"));
 		require_hookMetadata.getRuntimeSelectorParamValues("useIconButtonConfig", "size").forEach((size) => {
 			setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("useIconButtonConfig", "iconSize", { size }), require_hookMetadata.getRuntimeFieldTokenValue(config, "useIconButtonConfig", "iconSize", { size }));
 		});
 	}
+	if (config.input?.variables && config.input?.defaults) {
+		setRuntimeValue(require_hookMetadata.getRuntimeDefaultPropSelector("useInputConfig", "size"), require_hookMetadata.getRuntimeDefaultPropValue(config, "useInputConfig", "size"));
+		require_hookMetadata.getRuntimeSelectorParamValues("useInputConfig", "size").forEach((size) => {
+			setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("useInputConfig", "startIconSize", { size }), require_hookMetadata.getRuntimeFieldTokenValue(config, "useInputConfig", "startIconSize", { size }));
+			setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("useInputConfig", "endIconSize", { size }), require_hookMetadata.getRuntimeFieldTokenValue(config, "useInputConfig", "endIconSize", { size }));
+			setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("useInputConfig", "helperIconSize", { size }), require_hookMetadata.getRuntimeFieldTokenValue(config, "useInputConfig", "helperIconSize", { size }));
+		});
+	}
+	if (config.menuItem?.variables && config.menuItem?.defaults) {
+		setRuntimeValue(require_hookMetadata.getRuntimeDefaultPropSelector("useMenuItemConfig", "size"), require_hookMetadata.getRuntimeDefaultPropValue(config, "useMenuItemConfig", "size"));
+		require_hookMetadata.getRuntimeSelectorParamValues("useMenuItemConfig", "size").forEach((size) => {
+			setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("useMenuItemConfig", "startIconSize", { size }), require_hookMetadata.getRuntimeFieldTokenValue(config, "useMenuItemConfig", "startIconSize", { size }));
+			setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("useMenuItemConfig", "endIconSize", { size }), require_hookMetadata.getRuntimeFieldTokenValue(config, "useMenuItemConfig", "endIconSize", { size }));
+		});
+	}
+	if (config.paddleNav?.variables && config.paddleNav?.defaults) {
+		setRuntimeValue(require_hookMetadata.getRuntimeDefaultPropSelector("usePaddleNavConfig", "size"), require_hookMetadata.getRuntimeDefaultPropValue(config, "usePaddleNavConfig", "size"));
+		require_hookMetadata.getRuntimeSelectorParamValues("usePaddleNavConfig", "size").forEach((size) => {
+			setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("usePaddleNavConfig", "iconSize", { size }), require_hookMetadata.getRuntimeFieldTokenValue(config, "usePaddleNavConfig", "iconSize", { size }));
+		});
+	}
+	if (config.pagination?.variables && config.pagination?.defaults) {
+		setRuntimeValue(require_hookMetadata.getRuntimeDefaultPropSelector("usePaginationConfig", "size"), require_hookMetadata.getRuntimeDefaultPropValue(config, "usePaginationConfig", "size"));
+		require_hookMetadata.getRuntimeSelectorParamValues("usePaginationConfig", "size").forEach((size) => {
+			setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("usePaginationConfig", "iconSize", { size }), require_hookMetadata.getRuntimeFieldTokenValue(config, "usePaginationConfig", "iconSize", { size }));
+		});
+	}
+	if (config.selectItem?.variables && config.selectItem?.defaults) {
+		setRuntimeValue(require_hookMetadata.getRuntimeDefaultPropSelector("useSelectItemConfig", "size"), require_hookMetadata.getRuntimeDefaultPropValue(config, "useSelectItemConfig", "size"));
+		require_hookMetadata.getRuntimeSelectorParamValues("useSelectItemConfig", "size").forEach((size) => {
+			setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("useSelectItemConfig", "startIconSize", { size }), require_hookMetadata.getRuntimeFieldTokenValue(config, "useSelectItemConfig", "startIconSize", { size }));
+			setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("useSelectItemConfig", "endIconSize", { size }), require_hookMetadata.getRuntimeFieldTokenValue(config, "useSelectItemConfig", "endIconSize", { size }));
+		});
+	}
+	if (config.tab?.variables && config.tab?.defaults) {
+		setRuntimeValue(require_hookMetadata.getRuntimeDefaultPropSelector("useTabConfig", "size"), require_hookMetadata.getRuntimeDefaultPropValue(config, "useTabConfig", "size"));
+		require_hookMetadata.getRuntimeSelectorParamValues("useTabConfig", "size").forEach((size) => {
+			setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("useTabConfig", "iconSize", { size }), require_hookMetadata.getRuntimeFieldTokenValue(config, "useTabConfig", "iconSize", { size }));
+		});
+	}
 	if (config.toast?.variables && config.toast?.defaults) {
 		setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("useToastConfig", "autoClose"), require_hookMetadata.getRuntimeFieldStaticValue("useToastConfig", "autoClose") ?? void 0);
 		setRuntimeValue(require_hookMetadata.getRuntimeFieldSelector("useToastConfig", "position"), require_hookMetadata.getRuntimeFieldStaticValue("useToastConfig", "position") ?? void 0);

package/dist/css/dist/css/utils.js

@@ -46,18 +46,76 @@ const extractRuntimeConfigValues = (config) => {
 	};
 	const bottomSheetBackgroundColor = getRuntimeFieldTokenValue(config, "useBottomSheetConfig", "backgroundColor", { variant: "default" });
 	if (bottomSheetBackgroundColor !== void 0) setRuntimeValue(getRuntimeFieldSelector("useBottomSheetConfig", "backgroundColor", { variant: "default" }), bottomSheetBackgroundColor);
+	if (config.avatar?.variables && config.avatar?.defaults) {
+		setRuntimeValue(getRuntimeDefaultPropSelector("useAvatarConfig", "size"), getRuntimeDefaultPropValue(config, "useAvatarConfig", "size"));
+		getRuntimeSelectorParamValues("useAvatarConfig", "size").forEach((size) => {
+			setRuntimeValue(getRuntimeFieldSelector("useAvatarConfig", "iconSize", { size }), getRuntimeFieldTokenValue(config, "useAvatarConfig", "iconSize", { size }));
+		});
+	}
+	if (config.badge?.variables && config.badge?.defaults) {
+		setRuntimeValue(getRuntimeDefaultPropSelector("useBadgeConfig", "size"), getRuntimeDefaultPropValue(config, "useBadgeConfig", "size"));
+		getRuntimeSelectorParamValues("useBadgeConfig", "size").forEach((size) => {
+			setRuntimeValue(getRuntimeFieldSelector("useBadgeConfig", "iconSize", { size }), getRuntimeFieldTokenValue(config, "useBadgeConfig", "iconSize", { size }));
+		});
+	}
 	if (config.button?.variables && config.button?.defaults) {
 		setRuntimeValue(getRuntimeDefaultPropSelector("useButtonConfig", "size"), getRuntimeDefaultPropValue(config, "useButtonConfig", "size"));
 		getRuntimeSelectorParamValues("useButtonConfig", "size").forEach((size) => {
 			setRuntimeValue(getRuntimeFieldSelector("useButtonConfig", "iconSize", { size }), getRuntimeFieldTokenValue(config, "useButtonConfig", "iconSize", { size }));
 		});
 	}
+	if (config.chip?.variables && config.chip?.defaults) {
+		setRuntimeValue(getRuntimeDefaultPropSelector("useChipConfig", "size"), getRuntimeDefaultPropValue(config, "useChipConfig", "size"));
+		getRuntimeSelectorParamValues("useChipConfig", "size").forEach((size) => {
+			setRuntimeValue(getRuntimeFieldSelector("useChipConfig", "iconSize", { size }), getRuntimeFieldTokenValue(config, "useChipConfig", "iconSize", { size }));
+		});
+	}
 	if (config.iconButton?.variables && config.iconButton?.defaults) {
 		setRuntimeValue(getRuntimeDefaultPropSelector("useIconButtonConfig", "size"), getRuntimeDefaultPropValue(config, "useIconButtonConfig", "size"));
 		getRuntimeSelectorParamValues("useIconButtonConfig", "size").forEach((size) => {
 			setRuntimeValue(getRuntimeFieldSelector("useIconButtonConfig", "iconSize", { size }), getRuntimeFieldTokenValue(config, "useIconButtonConfig", "iconSize", { size }));
 		});
 	}
+	if (config.input?.variables && config.input?.defaults) {
+		setRuntimeValue(getRuntimeDefaultPropSelector("useInputConfig", "size"), getRuntimeDefaultPropValue(config, "useInputConfig", "size"));
+		getRuntimeSelectorParamValues("useInputConfig", "size").forEach((size) => {
+			setRuntimeValue(getRuntimeFieldSelector("useInputConfig", "startIconSize", { size }), getRuntimeFieldTokenValue(config, "useInputConfig", "startIconSize", { size }));
+			setRuntimeValue(getRuntimeFieldSelector("useInputConfig", "endIconSize", { size }), getRuntimeFieldTokenValue(config, "useInputConfig", "endIconSize", { size }));
+			setRuntimeValue(getRuntimeFieldSelector("useInputConfig", "helperIconSize", { size }), getRuntimeFieldTokenValue(config, "useInputConfig", "helperIconSize", { size }));
+		});
+	}
+	if (config.menuItem?.variables && config.menuItem?.defaults) {
+		setRuntimeValue(getRuntimeDefaultPropSelector("useMenuItemConfig", "size"), getRuntimeDefaultPropValue(config, "useMenuItemConfig", "size"));
+		getRuntimeSelectorParamValues("useMenuItemConfig", "size").forEach((size) => {
+			setRuntimeValue(getRuntimeFieldSelector("useMenuItemConfig", "startIconSize", { size }), getRuntimeFieldTokenValue(config, "useMenuItemConfig", "startIconSize", { size }));
+			setRuntimeValue(getRuntimeFieldSelector("useMenuItemConfig", "endIconSize", { size }), getRuntimeFieldTokenValue(config, "useMenuItemConfig", "endIconSize", { size }));
+		});
+	}
+	if (config.paddleNav?.variables && config.paddleNav?.defaults) {
+		setRuntimeValue(getRuntimeDefaultPropSelector("usePaddleNavConfig", "size"), getRuntimeDefaultPropValue(config, "usePaddleNavConfig", "size"));
+		getRuntimeSelectorParamValues("usePaddleNavConfig", "size").forEach((size) => {
+			setRuntimeValue(getRuntimeFieldSelector("usePaddleNavConfig", "iconSize", { size }), getRuntimeFieldTokenValue(config, "usePaddleNavConfig", "iconSize", { size }));
+		});
+	}
+	if (config.pagination?.variables && config.pagination?.defaults) {
+		setRuntimeValue(getRuntimeDefaultPropSelector("usePaginationConfig", "size"), getRuntimeDefaultPropValue(config, "usePaginationConfig", "size"));
+		getRuntimeSelectorParamValues("usePaginationConfig", "size").forEach((size) => {
+			setRuntimeValue(getRuntimeFieldSelector("usePaginationConfig", "iconSize", { size }), getRuntimeFieldTokenValue(config, "usePaginationConfig", "iconSize", { size }));
+		});
+	}
+	if (config.selectItem?.variables && config.selectItem?.defaults) {
+		setRuntimeValue(getRuntimeDefaultPropSelector("useSelectItemConfig", "size"), getRuntimeDefaultPropValue(config, "useSelectItemConfig", "size"));
+		getRuntimeSelectorParamValues("useSelectItemConfig", "size").forEach((size) => {
+			setRuntimeValue(getRuntimeFieldSelector("useSelectItemConfig", "startIconSize", { size }), getRuntimeFieldTokenValue(config, "useSelectItemConfig", "startIconSize", { size }));
+			setRuntimeValue(getRuntimeFieldSelector("useSelectItemConfig", "endIconSize", { size }), getRuntimeFieldTokenValue(config, "useSelectItemConfig", "endIconSize", { size }));
+		});
+	}
+	if (config.tab?.variables && config.tab?.defaults) {
+		setRuntimeValue(getRuntimeDefaultPropSelector("useTabConfig", "size"), getRuntimeDefaultPropValue(config, "useTabConfig", "size"));
+		getRuntimeSelectorParamValues("useTabConfig", "size").forEach((size) => {
+			setRuntimeValue(getRuntimeFieldSelector("useTabConfig", "iconSize", { size }), getRuntimeFieldTokenValue(config, "useTabConfig", "iconSize", { size }));
+		});
+	}
 	if (config.toast?.variables && config.toast?.defaults) {
 		setRuntimeValue(getRuntimeFieldSelector("useToastConfig", "autoClose"), getRuntimeFieldStaticValue("useToastConfig", "autoClose") ?? void 0);
 		setRuntimeValue(getRuntimeFieldSelector("useToastConfig", "position"), getRuntimeFieldStaticValue("useToastConfig", "position") ?? void 0);

package/dist/css/dist/runtimeConfig/hookMetadata.cjs

@@ -3,6 +3,76 @@
 /*! © 2026 Yahoo, Inc. UDS CSS v0.0.0-development */
 const defineRuntimeHookMetadata = (metadata) => metadata;
 const runtimeHookMetadata = defineRuntimeHookMetadata({
+	useAvatarConfig: {
+		defaultProps: { size: "avatar.defaultSize" },
+		defaultPropSources: { size: [
+			"avatar",
+			"defaults",
+			"size"
+		] },
+		selectorParamValues: { size: [
+			"2xs",
+			"xs",
+			"sm",
+			"md",
+			"lg",
+			"xl",
+			"2xl",
+			"3xl"
+		] },
+		tokenConfigPath: ["avatar", "variables"],
+		fields: {
+			size: {
+				bindingSelector: "avatar.defaultSize",
+				selectorTemplates: ["avatar.defaultSize"]
+			},
+			iconSize: {
+				bindingSelector: "avatar.iconSize.${size}",
+				selectorTemplates: ["avatar.iconSize.${size}"],
+				tokenSource: {
+					variableTemplate: "size/${size}/icon",
+					valuePath: [
+						"iconSize",
+						"rest",
+						"value"
+					]
+				}
+			}
+		}
+	},
+	useBadgeConfig: {
+		defaultProps: { size: "badge.defaultSize" },
+		defaultPropSources: { size: [
+			"badge",
+			"defaults",
+			"size"
+		] },
+		selectorParamValues: { size: [
+			"xs",
+			"sm",
+			"md",
+			"lg"
+		] },
+		tokenConfigPath: ["badge", "variables"],
+		fields: {
+			size: {
+				bindingSelector: "badge.defaultSize",
+				selectorTemplates: ["badge.defaultSize"]
+			},
+			iconSize: {
+				bindingSelector: "badge.iconSize.${size}",
+				selectorTemplates: ["badge.iconSize.${size}"],
+				tokenSource: {
+					variableTemplate: "size/${size}/icon",
+					valuePath: [
+						"size",
+						"rest",
+						"value"
+					]
+				}
+			}
+		}
+	},
 	useBottomSheetConfig: {
 		defaultProps: {},
 		selectorParamValues: { variant: ["default"] },
@@ -53,6 +123,34 @@ const runtimeHookMetadata = defineRuntimeHookMetadata({
 			}
 		}
 	},
+	useChipConfig: {
+		defaultProps: { size: "chip.defaultSize" },
+		defaultPropSources: { size: [
+			"chip",
+			"defaults",
+			"size"
+		] },
+		selectorParamValues: { size: ["sm", "md"] },
+		tokenConfigPath: ["chip", "variables"],
+		fields: {
+			size: {
+				bindingSelector: "chip.defaultSize",
+				selectorTemplates: ["chip.defaultSize"]
+			},
+			iconSize: {
+				bindingSelector: "chip.iconSize.${size}",
+				selectorTemplates: ["chip.iconSize.${size}"],
+				tokenSource: {
+					variableTemplate: "size/${size}/icon",
+					valuePath: [
+						"size",
+						"rest",
+						"value"
+					]
+				}
+			}
+		}
+	},
 	useIconButtonConfig: {
 		defaultProps: { size: "iconButton.defaultSize" },
 		defaultPropSources: { size: [
@@ -87,6 +185,228 @@ const runtimeHookMetadata = defineRuntimeHookMetadata({
 			}
 		}
 	},
+	useInputConfig: {
+		defaultProps: { size: "input.defaultSize" },
+		defaultPropSources: { size: [
+			"input",
+			"defaults",
+			"size"
+		] },
+		selectorParamValues: { size: ["md", "lg"] },
+		tokenConfigPath: ["input", "variables"],
+		fields: {
+			size: {
+				bindingSelector: "input.defaultSize",
+				selectorTemplates: ["input.defaultSize"]
+			},
+			startIconSize: {
+				bindingSelector: "input.startIconSize.${size}",
+				selectorTemplates: ["input.startIconSize.${size}"],
+				tokenSource: {
+					variableTemplate: "size/${size}/startIcon",
+					valuePath: [
+						"size",
+						"rest",
+						"value"
+					]
+				}
+			},
+			endIconSize: {
+				bindingSelector: "input.endIconSize.${size}",
+				selectorTemplates: ["input.endIconSize.${size}"],
+				tokenSource: {
+					variableTemplate: "size/${size}/endIcon",
+					valuePath: [
+						"size",
+						"rest",
+						"value"
+					]
+				}
+			},
+			helperIconSize: {
+				bindingSelector: "input.helperIconSize.${size}",
+				selectorTemplates: ["input.helperIconSize.${size}"],
+				tokenSource: {
+					variableTemplate: "size/${size}/helperIcon",
+					valuePath: [
+						"size",
+						"rest",
+						"value"
+					]
+				}
+			}
+		}
+	},
+	useMenuItemConfig: {
+		defaultProps: { size: "menuItem.defaultSize" },
+		defaultPropSources: { size: [
+			"menuItem",
+			"defaults",
+			"size"
+		] },
+		selectorParamValues: { size: ["default"] },
+		tokenConfigPath: ["menuItem", "variables"],
+		fields: {
+			size: {
+				bindingSelector: "menuItem.defaultSize",
+				selectorTemplates: ["menuItem.defaultSize"]
+			},
+			startIconSize: {
+				bindingSelector: "menuItem.startIconSize.${size}",
+				selectorTemplates: ["menuItem.startIconSize.${size}"],
+				tokenSource: {
+					variableTemplate: "size/${size}/startIcon",
+					valuePath: [
+						"size",
+						"rest",
+						"value"
+					]
+				}
+			},
+			endIconSize: {
+				bindingSelector: "menuItem.endIconSize.${size}",
+				selectorTemplates: ["menuItem.endIconSize.${size}"],
+				tokenSource: {
+					variableTemplate: "size/${size}/endIcon",
+					valuePath: [
+						"size",
+						"rest",
+						"value"
+					]
+				}
+			}
+		}
+	},
+	usePaddleNavConfig: {
+		defaultProps: { size: "paddleNav.defaultSize" },
+		defaultPropSources: { size: [
+			"paddleNav",
+			"defaults",
+			"size"
+		] },
+		selectorParamValues: { size: [
+			"xs",
+			"sm",
+			"md",
+			"lg",
+			"xl"
+		] },
+		tokenConfigPath: ["paddleNav", "variables"],
+		fields: {
+			size: {
+				bindingSelector: "paddleNav.defaultSize",
+				selectorTemplates: ["paddleNav.defaultSize"]
+			},
+			iconSize: {
+				bindingSelector: "paddleNav.iconSize.${size}",
+				selectorTemplates: ["paddleNav.iconSize.${size}"],
+				tokenSource: {
+					variableTemplate: "size/${size}/icon",
+					valuePath: [
+						"size",
+						"rest",
+						"value"
+					]
+				}
+			}
+		}
+	},
+	usePaginationConfig: {
+		defaultProps: { size: "pagination.defaultSize" },
+		defaultPropSources: { size: [
+			"pagination",
+			"defaults",
+			"size"
+		] },
+		selectorParamValues: { size: ["sm", "md"] },
+		tokenConfigPath: ["pagination", "variables"],
+		fields: {
+			size: {
+				bindingSelector: "pagination.defaultSize",
+				selectorTemplates: ["pagination.defaultSize"]
+			},
+			iconSize: {
+				bindingSelector: "pagination.iconSize.${size}",
+				selectorTemplates: ["pagination.iconSize.${size}"],
+				tokenSource: {
+					variableTemplate: "size/${size}/icon",
+					valuePath: [
+						"size",
+						"rest",
+						"value"
+					]
+				}
+			}
+		}
+	},
+	useSelectItemConfig: {
+		defaultProps: { size: "selectItem.defaultSize" },
+		defaultPropSources: { size: [
+			"selectItem",
+			"defaults",
+			"size"
+		] },
+		selectorParamValues: { size: ["default"] },
+		tokenConfigPath: ["selectItem", "variables"],
+		fields: {
+			size: {
+				bindingSelector: "selectItem.defaultSize",
+				selectorTemplates: ["selectItem.defaultSize"]
+			},
+			startIconSize: {
+				bindingSelector: "selectItem.startIconSize.${size}",
+				selectorTemplates: ["selectItem.startIconSize.${size}"],
+				tokenSource: {
+					variableTemplate: "size/${size}/startIcon",
+					valuePath: [
+						"size",
+						"rest",
+						"value"
+					]
+				}
+			},
+			endIconSize: {
+				bindingSelector: "selectItem.endIconSize.${size}",
+				selectorTemplates: ["selectItem.endIconSize.${size}"],
+				tokenSource: {
+					variableTemplate: "size/${size}/endIcon",
+					valuePath: [
+						"size",
+						"rest",
+						"value"
+					]
+				}
+			}
+		}
+	},
+	useTabConfig: {
+		defaultProps: { size: "tab.defaultSize" },
+		defaultPropSources: { size: [
+			"tab",
+			"defaults",
+			"size"
+		] },
+		selectorParamValues: { size: ["default"] },
+		tokenConfigPath: ["tab", "variables"],
+		fields: {
+			size: {
+				bindingSelector: "tab.defaultSize",
+				selectorTemplates: ["tab.defaultSize"]
+			},
+			iconSize: {
+				bindingSelector: "tab.iconSize.${size}",
+				selectorTemplates: ["tab.iconSize.${size}"],
+				tokenSource: {
+					variableTemplate: "size/${size}/icon",
+					valuePath: [
+						"size",
+						"rest",
+						"value"
+					]
+				}
+			}
+		}
+	},
 	useToastConfig: {
 		defaultProps: {
 			size: "toast.defaultSize",