@tamagui/size 0.0.0-bootstrap.0 → 3.0.0-beta.643.1

package/dist/esm/index.mjs

@@ -0,0 +1,120 @@
+import { createStyledContext } from "@tamagui/web";
+
+const defaultTokenSizePolicy = {
+	size: 44,
+	space: "4",
+	radius: "4",
+	fontSize: "4"
+};
+const controlSizes = {
+	true: 44,
+	0: 0,
+	"0-25": 2,
+	"0-5": 4,
+	"0-75": 8,
+	1: 20,
+	"1-5": 24,
+	2: 28,
+	"2-5": 32,
+	3: 36,
+	"3-5": 40,
+	4: 44,
+	"4-5": 48,
+	5: 52,
+	6: 64,
+	7: 74,
+	8: 84,
+	9: 94,
+	10: 104,
+	11: 124,
+	12: 144,
+	13: 164,
+	14: 184,
+	15: 204,
+	16: 224,
+	17: 224,
+	18: 244,
+	19: 264,
+	20: 284
+};
+const resolveControlSize = (value, tokens) => {
+	if (typeof value === "number") return value;
+	const ramp = controlSizes[value];
+	return ramp ?? tokens.size[value];
+};
+const resolveSizeToken = (value, category, policy = defaultTokenSizePolicy) => {
+	return value === true ? policy[category] : value;
+};
+const createSizeContext = (defaultSize) => {
+	return createStyledContext({ size: defaultSize });
+};
+const SizeContext = createSizeContext();
+const resolveTokenSize = (value, { tokens, font, policy = defaultTokenSizePolicy }) => {
+	if (typeof value === "number") {
+		return {
+			frame: {
+				size: value,
+				space: value,
+				radius: value
+			},
+			text: {
+				fontSize: value,
+				lineHeight: void 0
+			},
+			icon: value
+		};
+	}
+	const spaceKey = resolveSizeToken(value, "space", policy);
+	const radiusKey = resolveSizeToken(value, "radius", policy);
+	const fontKey = resolveSizeToken(value, "fontSize", policy);
+	const size = resolveControlSize(value, tokens);
+	const space = typeof spaceKey === "number" ? spaceKey : tokens.space[spaceKey];
+	const radius = typeof radiusKey === "number" ? radiusKey : tokens.radius[radiusKey];
+	const fontSize = typeof fontKey === "number" ? fontKey : font.size[fontKey];
+	const lineHeight = typeof fontKey === "number" ? void 0 : font.lineHeight?.[fontKey];
+	return {
+		frame: {
+			size,
+			space,
+			radius
+		},
+		text: {
+			fontSize,
+			lineHeight
+		},
+		icon: fontSize
+	};
+};
+const createSizeTable = (values, defaultSize) => {
+	const Context = createStyledContext({ size: defaultSize });
+	const frame = {};
+	const text = {};
+	const icon = {};
+	for (const name of Object.keys(values)) {
+		frame[name] = values[name].frame;
+		text[name] = values[name].text;
+		icon[name] = values[name].icon;
+	}
+	const resolve = ((name = defaultSize) => {
+		if (!(name in values)) {
+			if (process.env.NODE_ENV !== "production") {
+				console.error(`Unknown size "${String(name)}" \u2014 this size table only has: ${Object.keys(values).join(", ")}. Size tables are user-owned named scales; the default skins take size tokens instead. Falling back to "${String(defaultSize)}".`);
+			}
+			return values[defaultSize];
+		}
+		return values[name];
+	});
+	return {
+		values,
+		names: Object.keys(values),
+		defaultSize,
+		Context,
+		frame,
+		text,
+		icon,
+		resolve
+	};
+};
+
+export { SizeContext, controlSizes, createSizeContext, createSizeTable, defaultTokenSizePolicy, resolveControlSize, resolveSizeToken, resolveTokenSize };
+//# sourceMappingURL=index.mjs.map

package/dist/esm/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["esm/index.js"],"sourcesContent":["import {\n  createStyledContext\n} from \"@tamagui/web\";\nconst defaultTokenSizePolicy = {\n  // geometry consumers (Square, Circle) read the size scale directly and only\n  // need a default token; control frame heights do NOT come from here, they\n  // come from controlSizes below.\n  size: 44,\n  space: \"4\",\n  radius: \"4\",\n  fontSize: \"4\"\n};\nconst controlSizes = {\n  true: 44,\n  0: 0,\n  \"0-25\": 2,\n  \"0-5\": 4,\n  \"0-75\": 8,\n  1: 20,\n  \"1-5\": 24,\n  2: 28,\n  \"2-5\": 32,\n  3: 36,\n  \"3-5\": 40,\n  4: 44,\n  \"4-5\": 48,\n  5: 52,\n  6: 64,\n  7: 74,\n  8: 84,\n  9: 94,\n  10: 104,\n  11: 124,\n  12: 144,\n  13: 164,\n  14: 184,\n  15: 204,\n  16: 224,\n  17: 224,\n  18: 244,\n  19: 264,\n  20: 284\n};\nconst resolveControlSize = (value, tokens) => {\n  if (typeof value === \"number\") return value;\n  const ramp = controlSizes[value];\n  return ramp ?? tokens.size[value];\n};\nconst resolveSizeToken = (value, category, policy = defaultTokenSizePolicy) => {\n  return value === true ? policy[category] : value;\n};\nconst createSizeContext = (defaultSize) => {\n  return createStyledContext({ size: defaultSize });\n};\nconst SizeContext = createSizeContext();\nconst resolveTokenSize = (value, { tokens, font, policy = defaultTokenSizePolicy }) => {\n  if (typeof value === \"number\") {\n    return {\n      frame: { size: value, space: value, radius: value },\n      text: { fontSize: value, lineHeight: void 0 },\n      icon: value\n    };\n  }\n  const spaceKey = resolveSizeToken(value, \"space\", policy);\n  const radiusKey = resolveSizeToken(value, \"radius\", policy);\n  const fontKey = resolveSizeToken(value, \"fontSize\", policy);\n  const size = resolveControlSize(value, tokens);\n  const space = typeof spaceKey === \"number\" ? spaceKey : tokens.space[spaceKey];\n  const radius = typeof radiusKey === \"number\" ? radiusKey : tokens.radius[radiusKey];\n  const fontSize = typeof fontKey === \"number\" ? fontKey : font.size[fontKey];\n  const lineHeight = typeof fontKey === \"number\" ? void 0 : font.lineHeight?.[fontKey];\n  return {\n    frame: {\n      size,\n      space,\n      radius\n    },\n    text: {\n      fontSize,\n      lineHeight\n    },\n    icon: fontSize\n  };\n};\nconst createSizeTable = (values, defaultSize) => {\n  const Context = createStyledContext({ size: defaultSize });\n  const frame = {};\n  const text = {};\n  const icon = {};\n  for (const name of Object.keys(values)) {\n    frame[name] = values[name].frame;\n    text[name] = values[name].text;\n    icon[name] = values[name].icon;\n  }\n  const resolve = ((name = defaultSize) => {\n    if (!(name in values)) {\n      if (process.env.NODE_ENV !== \"production\") {\n        console.error(\n          `Unknown size \"${String(name)}\" \\u2014 this size table only has: ${Object.keys(values).join(\", \")}. Size tables are user-owned named scales; the default skins take size tokens instead. Falling back to \"${String(defaultSize)}\".`\n        );\n      }\n      return values[defaultSize];\n    }\n    return values[name];\n  });\n  return {\n    values,\n    names: Object.keys(values),\n    defaultSize,\n    Context,\n    frame,\n    text,\n    icon,\n    resolve\n  };\n};\nexport {\n  SizeContext,\n  controlSizes,\n  createSizeContext,\n  createSizeTable,\n  defaultTokenSizePolicy,\n  resolveControlSize,\n  resolveSizeToken,\n  resolveTokenSize\n};\n//# sourceMappingURL=index.js.map\n"],"mappings":";;;AAGA,MAAM,yBAAyB;CAI7B,MAAM;CACN,OAAO;CACP,QAAQ;CACR,UAAU;AACZ;AACA,MAAM,eAAe;CACnB,MAAM;CACN,GAAG;CACH,QAAQ;CACR,OAAO;CACP,QAAQ;CACR,GAAG;CACH,OAAO;CACP,GAAG;CACH,OAAO;CACP,GAAG;CACH,OAAO;CACP,GAAG;CACH,OAAO;CACP,GAAG;CACH,GAAG;CACH,GAAG;CACH,GAAG;CACH,GAAG;CACH,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AACA,MAAM,sBAAsB,OAAO,WAAW;CAC5C,IAAI,OAAO,UAAU,UAAU,OAAO;CACtC,MAAM,OAAO,aAAa;CAC1B,OAAO,QAAQ,OAAO,KAAK;AAC7B;AACA,MAAM,oBAAoB,OAAO,UAAU,SAAS,2BAA2B;CAC7E,OAAO,UAAU,OAAO,OAAO,YAAY;AAC7C;AACA,MAAM,qBAAqB,gBAAgB;CACzC,OAAO,oBAAoB,EAAE,MAAM,YAAY,CAAC;AAClD;AACA,MAAM,cAAc,kBAAkB;AACtC,MAAM,oBAAoB,OAAO,EAAE,QAAQ,MAAM,SAAS,6BAA6B;CACrF,IAAI,OAAO,UAAU,UAAU;EAC7B,OAAO;GACL,OAAO;IAAE,MAAM;IAAO,OAAO;IAAO,QAAQ;GAAM;GAClD,MAAM;IAAE,UAAU;IAAO,YAAY,KAAK;GAAE;GAC5C,MAAM;EACR;CACF;CACA,MAAM,WAAW,iBAAiB,OAAO,SAAS,MAAM;CACxD,MAAM,YAAY,iBAAiB,OAAO,UAAU,MAAM;CAC1D,MAAM,UAAU,iBAAiB,OAAO,YAAY,MAAM;CAC1D,MAAM,OAAO,mBAAmB,OAAO,MAAM;CAC7C,MAAM,QAAQ,OAAO,aAAa,WAAW,WAAW,OAAO,MAAM;CACrE,MAAM,SAAS,OAAO,cAAc,WAAW,YAAY,OAAO,OAAO;CACzE,MAAM,WAAW,OAAO,YAAY,WAAW,UAAU,KAAK,KAAK;CACnE,MAAM,aAAa,OAAO,YAAY,WAAW,KAAK,IAAI,KAAK,aAAa;CAC5E,OAAO;EACL,OAAO;GACL;GACA;GACA;EACF;EACA,MAAM;GACJ;GACA;EACF;EACA,MAAM;CACR;AACF;AACA,MAAM,mBAAmB,QAAQ,gBAAgB;CAC/C,MAAM,UAAU,oBAAoB,EAAE,MAAM,YAAY,CAAC;CACzD,MAAM,QAAQ,CAAC;CACf,MAAM,OAAO,CAAC;CACd,MAAM,OAAO,CAAC;CACd,KAAK,MAAM,QAAQ,OAAO,KAAK,MAAM,GAAG;EACtC,MAAM,QAAQ,OAAO,MAAM;EAC3B,KAAK,QAAQ,OAAO,MAAM;EAC1B,KAAK,QAAQ,OAAO,MAAM;CAC5B;CACA,MAAM,YAAY,OAAO,gBAAgB;EACvC,IAAI,EAAE,QAAQ,SAAS;GACrB,IAAI,QAAQ,IAAI,aAAa,cAAc;IACzC,QAAQ,MACN,iBAAiB,OAAO,IAAI,EAAE,qCAAqC,OAAO,KAAK,MAAM,EAAE,KAAK,IAAI,EAAE,0GAA0G,OAAO,WAAW,EAAE,GAClO;GACF;GACA,OAAO,OAAO;EAChB;EACA,OAAO,OAAO;CAChB;CACA,OAAO;EACL;EACA,OAAO,OAAO,KAAK,MAAM;EACzB;EACA;EACA;EACA;EACA;EACA;CACF;AACF"}

package/dist/esm/index.native.js

@@ -0,0 +1,141 @@
+import { createStyledContext } from "@tamagui/web";
+
+var defaultTokenSizePolicy = {
+	size: 44,
+	space: "4",
+	radius: "4",
+	fontSize: "4"
+};
+var controlSizes = {
+	true: 44,
+	0: 0,
+	"0-25": 2,
+	"0-5": 4,
+	"0-75": 8,
+	1: 20,
+	"1-5": 24,
+	2: 28,
+	"2-5": 32,
+	3: 36,
+	"3-5": 40,
+	4: 44,
+	"4-5": 48,
+	5: 52,
+	6: 64,
+	7: 74,
+	8: 84,
+	9: 94,
+	10: 104,
+	11: 124,
+	12: 144,
+	13: 164,
+	14: 184,
+	15: 204,
+	16: 224,
+	17: 224,
+	18: 244,
+	19: 264,
+	20: 284
+};
+var resolveControlSize = function(value, tokens) {
+	if (typeof value === "number") return value;
+	var ramp = controlSizes[value];
+	return ramp !== null && ramp !== void 0 ? ramp : tokens.size[value];
+};
+var resolveSizeToken = function(value, category) {
+	var policy = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : defaultTokenSizePolicy;
+	return value === true ? policy[category] : value;
+};
+var createSizeContext = function(defaultSize) {
+	return createStyledContext({ size: defaultSize });
+};
+var SizeContext = createSizeContext();
+var resolveTokenSize = function(value, param) {
+	var { tokens, font, policy = defaultTokenSizePolicy } = param;
+	var _font_lineHeight;
+	if (typeof value === "number") {
+		return {
+			frame: {
+				size: value,
+				space: value,
+				radius: value
+			},
+			text: {
+				fontSize: value,
+				lineHeight: void 0
+			},
+			icon: value
+		};
+	}
+	var spaceKey = resolveSizeToken(value, "space", policy);
+	var radiusKey = resolveSizeToken(value, "radius", policy);
+	var fontKey = resolveSizeToken(value, "fontSize", policy);
+	var size = resolveControlSize(value, tokens);
+	var space = typeof spaceKey === "number" ? spaceKey : tokens.space[spaceKey];
+	var radius = typeof radiusKey === "number" ? radiusKey : tokens.radius[radiusKey];
+	var fontSize = typeof fontKey === "number" ? fontKey : font.size[fontKey];
+	var lineHeight = typeof fontKey === "number" ? void 0 : (_font_lineHeight = font.lineHeight) === null || _font_lineHeight === void 0 ? void 0 : _font_lineHeight[fontKey];
+	return {
+		frame: {
+			size,
+			space,
+			radius
+		},
+		text: {
+			fontSize,
+			lineHeight
+		},
+		icon: fontSize
+	};
+};
+var createSizeTable = function(values, defaultSize) {
+	var Context = createStyledContext({ size: defaultSize });
+	var frame = {};
+	var text = {};
+	var icon = {};
+	var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = void 0;
+	try {
+		for (var _iterator = Object.keys(values)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+			var name = _step.value;
+			frame[name] = values[name].frame;
+			text[name] = values[name].text;
+			icon[name] = values[name].icon;
+		}
+	} catch (err) {
+		_didIteratorError = true;
+		_iteratorError = err;
+	} finally {
+		try {
+			if (!_iteratorNormalCompletion && _iterator.return != null) {
+				_iterator.return();
+			}
+		} finally {
+			if (_didIteratorError) {
+				throw _iteratorError;
+			}
+		}
+	}
+	var resolve = function() {
+		var name2 = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : defaultSize;
+		if (!(name2 in values)) {
+			if (process.env.NODE_ENV !== "production") {
+				console.error(`Unknown size "${String(name2)}" \u2014 this size table only has: ${Object.keys(values).join(", ")}. Size tables are user-owned named scales; the default skins take size tokens instead. Falling back to "${String(defaultSize)}".`);
+			}
+			return values[defaultSize];
+		}
+		return values[name2];
+	};
+	return {
+		values,
+		names: Object.keys(values),
+		defaultSize,
+		Context,
+		frame,
+		text,
+		icon,
+		resolve
+	};
+};
+
+export { SizeContext, controlSizes, createSizeContext, createSizeTable, defaultTokenSizePolicy, resolveControlSize, resolveSizeToken, resolveTokenSize };
+//# sourceMappingURL=index.native.js.map

package/dist/esm/index.native.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.native.js","names":[],"sources":["esm/index.native.js"],"sourcesContent":["import { createStyledContext } from \"@tamagui/web\";\nvar defaultTokenSizePolicy = {\n  // geometry consumers (Square, Circle) read the size scale directly and only\n  // need a default token; control frame heights do NOT come from here, they\n  // come from controlSizes below.\n  size: 44,\n  space: \"4\",\n  radius: \"4\",\n  fontSize: \"4\"\n};\nvar controlSizes = {\n  true: 44,\n  0: 0,\n  \"0-25\": 2,\n  \"0-5\": 4,\n  \"0-75\": 8,\n  1: 20,\n  \"1-5\": 24,\n  2: 28,\n  \"2-5\": 32,\n  3: 36,\n  \"3-5\": 40,\n  4: 44,\n  \"4-5\": 48,\n  5: 52,\n  6: 64,\n  7: 74,\n  8: 84,\n  9: 94,\n  10: 104,\n  11: 124,\n  12: 144,\n  13: 164,\n  14: 184,\n  15: 204,\n  16: 224,\n  17: 224,\n  18: 244,\n  19: 264,\n  20: 284\n};\nvar resolveControlSize = function(value, tokens) {\n  if (typeof value === \"number\") return value;\n  var ramp = controlSizes[value];\n  return ramp !== null && ramp !== void 0 ? ramp : tokens.size[value];\n};\nvar resolveSizeToken = function(value, category) {\n  var policy = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : defaultTokenSizePolicy;\n  return value === true ? policy[category] : value;\n};\nvar createSizeContext = function(defaultSize) {\n  return createStyledContext({\n    size: defaultSize\n  });\n};\nvar SizeContext = createSizeContext();\nvar resolveTokenSize = function(value, param) {\n  var { tokens, font, policy = defaultTokenSizePolicy } = param;\n  var _font_lineHeight;\n  if (typeof value === \"number\") {\n    return {\n      frame: {\n        size: value,\n        space: value,\n        radius: value\n      },\n      text: {\n        fontSize: value,\n        lineHeight: void 0\n      },\n      icon: value\n    };\n  }\n  var spaceKey = resolveSizeToken(value, \"space\", policy);\n  var radiusKey = resolveSizeToken(value, \"radius\", policy);\n  var fontKey = resolveSizeToken(value, \"fontSize\", policy);\n  var size = resolveControlSize(value, tokens);\n  var space = typeof spaceKey === \"number\" ? spaceKey : tokens.space[spaceKey];\n  var radius = typeof radiusKey === \"number\" ? radiusKey : tokens.radius[radiusKey];\n  var fontSize = typeof fontKey === \"number\" ? fontKey : font.size[fontKey];\n  var lineHeight = typeof fontKey === \"number\" ? void 0 : (_font_lineHeight = font.lineHeight) === null || _font_lineHeight === void 0 ? void 0 : _font_lineHeight[fontKey];\n  return {\n    frame: {\n      size,\n      space,\n      radius\n    },\n    text: {\n      fontSize,\n      lineHeight\n    },\n    icon: fontSize\n  };\n};\nvar createSizeTable = function(values, defaultSize) {\n  var Context = createStyledContext({\n    size: defaultSize\n  });\n  var frame = {};\n  var text = {};\n  var icon = {};\n  var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = void 0;\n  try {\n    for (var _iterator = Object.keys(values)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {\n      var name = _step.value;\n      frame[name] = values[name].frame;\n      text[name] = values[name].text;\n      icon[name] = values[name].icon;\n    }\n  } catch (err) {\n    _didIteratorError = true;\n    _iteratorError = err;\n  } finally {\n    try {\n      if (!_iteratorNormalCompletion && _iterator.return != null) {\n        _iterator.return();\n      }\n    } finally {\n      if (_didIteratorError) {\n        throw _iteratorError;\n      }\n    }\n  }\n  var resolve = function() {\n    var name2 = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : defaultSize;\n    if (!(name2 in values)) {\n      if (process.env.NODE_ENV !== \"production\") {\n        console.error(`Unknown size \"${String(name2)}\" \\u2014 this size table only has: ${Object.keys(values).join(\", \")}. Size tables are user-owned named scales; the default skins take size tokens instead. Falling back to \"${String(defaultSize)}\".`);\n      }\n      return values[defaultSize];\n    }\n    return values[name2];\n  };\n  return {\n    values,\n    names: Object.keys(values),\n    defaultSize,\n    Context,\n    frame,\n    text,\n    icon,\n    resolve\n  };\n};\nexport {\n  SizeContext,\n  controlSizes,\n  createSizeContext,\n  createSizeTable,\n  defaultTokenSizePolicy,\n  resolveControlSize,\n  resolveSizeToken,\n  resolveTokenSize\n};\n//# sourceMappingURL=index.js.map\n"],"mappings":"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"}

package/package.json

@@ -1,13 +1,56 @@
 {
   "name": "@tamagui/size",
-  "version": "0.0.0-bootstrap.0",
-  "description": "Tamagui v3 package bootstrap",
-  "repository": "https://github.com/tamagui/tamagui",
+  "version": "3.0.0-beta.643.1",
+  "description": "Component-agnostic size context and skin table helpers",
   "license": "MIT",
+  "source": "src/index.ts",
   "files": [
-    "README.md"
+    "src",
+    "types",
+    "dist"
   ],
+  "type": "module",
+  "sideEffects": false,
+  "main": "dist/cjs",
+  "module": "dist/esm",
+  "types": "./types/index.d.ts",
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "types": "./types/index.d.ts",
+      "react-native": "./dist/esm/index.native.js",
+      "browser": "./dist/esm/index.mjs",
+      "module": "./dist/esm/index.mjs",
+      "import": "./dist/esm/index.mjs",
+      "require": "./dist/cjs/index.cjs",
+      "default": "./dist/esm/index.mjs"
+    }
+  },
   "publishConfig": {
     "access": "public"
+  },
+  "scripts": {
+    "build": "tamagui-build",
+    "watch": "tamagui-build --watch",
+    "clean": "tamagui-build clean",
+    "clean:build": "tamagui-build clean:build",
+    "test": "vitest --run tests/index.test.ts",
+    "test:types": "vitest --typecheck --run tests/index.test-d.ts"
+  },
+  "dependencies": {
+    "@tamagui/web": "3.0.0-beta.643.1"
+  },
+  "devDependencies": {
+    "@tamagui/build": "3.0.0-beta.643.1",
+    "react": ">=19",
+    "vitest": "4.0.4"
+  },
+  "peerDependencies": {
+    "react": ">=19"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/tamagui/tamagui.git",
+    "directory": "code/core/size"
   }
 }

package/src/index.ts

@@ -0,0 +1,278 @@
+import {
+  createStyledContext,
+  type FontSizeTokens,
+  type GenericFont,
+  type SizeTokens,
+  type StyledContext,
+  type TokensParsed,
+  type Variable,
+} from '@tamagui/web'
+
+export type TokenSize = SizeTokens | FontSizeTokens | number | true
+
+export type TokenSizePolicy = {
+  size: Exclude<SizeTokens, true> | number
+  space: Exclude<SizeTokens, true> | number
+  radius: Exclude<SizeTokens, true> | number
+  fontSize: Exclude<FontSizeTokens, true> | number
+}
+
+// component defaults are intentionally owned by this opt-in package instead of
+// the global Tamagui config, so the other metrics retain each config's
+// token-defined platform values.
+export const defaultTokenSizePolicy: TokenSizePolicy = {
+  // geometry consumers (Square, Circle) read the size scale directly and only
+  // need a default token; control frame heights do NOT come from here, they
+  // come from controlSizes below.
+  size: 44,
+  space: '4',
+  radius: '4',
+  fontSize: '4',
+}
+
+/**
+ * Frame heights for controls, keyed like v2's size tokens.
+ *
+ * `size` on a control is a preset, not a length. A config's size scale is a
+ * spacing scale: under v6 it is tailwind's, where `3` is 12px, so reading a
+ * frame height straight off it produced a 12px-tall Button holding 16px text.
+ * These are v2's size token values, so a migrating `size="4"` still means a
+ * 44px control rather than silently becoming a 16px one.
+ *
+ * `true` is the unsized default and is just the `4` step, so there is no
+ * separate default constant that can drift away from the ramp.
+ */
+export const controlSizes = {
+  true: 44,
+  0: 0,
+  '0-25': 2,
+  '0-5': 4,
+  '0-75': 8,
+  1: 20,
+  '1-5': 24,
+  2: 28,
+  '2-5': 32,
+  3: 36,
+  '3-5': 40,
+  4: 44,
+  '4-5': 48,
+  5: 52,
+  6: 64,
+  7: 74,
+  8: 84,
+  9: 94,
+  10: 104,
+  11: 124,
+  12: 144,
+  13: 164,
+  14: 184,
+  15: 204,
+  16: 224,
+  17: 224,
+  18: 244,
+  19: 264,
+  20: 284,
+} as const
+
+export type ControlSizeKey = keyof typeof controlSizes
+
+/**
+ * A control's frame height. Numbers stay literal pixel values, the same line
+ * resolveTokenSize and getShapeSize already draw. A size key outside the ramp
+ * (v6 carries larger ones like `24`) falls through to the config's size scale,
+ * where the value is already a sane large length.
+ */
+export const resolveControlSize = (
+  value: TokenSize,
+  tokens: Pick<TokensParsed, 'size'>
+): number | Variable => {
+  if (typeof value === 'number') return value
+  const ramp = controlSizes[value as ControlSizeKey]
+  return ramp ?? tokens.size[value as keyof typeof tokens.size]
+}
+
+export const resolveSizeToken = <Value, Category extends keyof TokenSizePolicy>(
+  value: Value,
+  category: Category,
+  policy: TokenSizePolicy = defaultTokenSizePolicy
+): Exclude<Value, true> | TokenSizePolicy[Category] => {
+  return value === true ? policy[category] : (value as Exclude<Value, true>)
+}
+
+export type SizeContextValue<Value extends TokenSize = TokenSize> = {
+  size: Value | undefined
+}
+
+export type CreatedSizeContext<Value extends TokenSize = TokenSize> = StyledContext<
+  SizeContextValue<Value>,
+  'size'
+>
+
+export const createSizeContext = <Value extends TokenSize = TokenSize>(
+  defaultSize?: Value
+): CreatedSizeContext<Value> => {
+  return createStyledContext<SizeContextValue<Value>>({ size: defaultSize })
+}
+
+export const SizeContext: CreatedSizeContext = createSizeContext()
+
+export type SizeResolverExtras = {
+  tokens: Pick<TokensParsed, 'size' | 'space' | 'radius'>
+  font: GenericFont
+  policy?: TokenSizePolicy
+}
+
+export type ResolvedFrameMetric<Value extends TokenSize> = Value extends number
+  ? Value
+  : Value extends true
+    ? number | Variable
+    : Variable
+
+export type ResolvedFontMetric<Value extends TokenSize> = Value extends number
+  ? Value
+  : number | Variable
+
+/** the ramp yields plain numbers, so a frame height is never only a Variable */
+export type ResolvedControlMetric<Value extends TokenSize> = Value extends number
+  ? Value
+  : number | Variable
+
+export type ResolvedTokenSize<Value extends TokenSize = TokenSize> = {
+  frame: {
+    size: ResolvedControlMetric<Value>
+    space: ResolvedFrameMetric<Value>
+    radius: ResolvedFrameMetric<Value>
+  }
+  text: {
+    fontSize: ResolvedFontMetric<Value>
+    lineHeight: Value extends number ? undefined : number | Variable | undefined
+  }
+  icon: ResolvedFontMetric<Value>
+}
+
+export const resolveTokenSize = <Value extends TokenSize>(
+  value: Value,
+  { tokens, font, policy = defaultTokenSizePolicy }: SizeResolverExtras
+): ResolvedTokenSize<Value> => {
+  if (typeof value === 'number') {
+    return {
+      frame: { size: value, space: value, radius: value },
+      text: { fontSize: value, lineHeight: undefined },
+      icon: value,
+    } as ResolvedTokenSize<Value>
+  }
+
+  const spaceKey = resolveSizeToken(value, 'space', policy)
+  const radiusKey = resolveSizeToken(value, 'radius', policy)
+  const fontKey = resolveSizeToken(value, 'fontSize', policy)
+
+  // frame height is a control preset off the ramp, never the spacing scale
+  const size = resolveControlSize(value, tokens)
+  const space = typeof spaceKey === 'number' ? spaceKey : tokens.space[spaceKey]
+  const radius = typeof radiusKey === 'number' ? radiusKey : tokens.radius[radiusKey]
+  const fontSize = typeof fontKey === 'number' ? fontKey : font.size[fontKey]
+  const lineHeight = typeof fontKey === 'number' ? undefined : font.lineHeight?.[fontKey]
+
+  return {
+    frame: {
+      size,
+      space,
+      radius,
+    },
+    text: {
+      fontSize,
+      lineHeight,
+    },
+    icon: fontSize,
+  } as ResolvedTokenSize<Value>
+}
+
+export type SizeTableEntry = Readonly<{
+  frame: unknown
+  text: unknown
+  icon: unknown
+}>
+
+export type SizeTableDefinition = Readonly<Record<string, SizeTableEntry>>
+
+export type SizeTableName<Table extends SizeTableDefinition> = Extract<
+  keyof Table,
+  string
+>
+
+export type SizeTableSelection<
+  Table extends SizeTableDefinition,
+  Name extends SizeTableName<Table>,
+> = Table[Name]
+
+export type SizeTablePart = keyof SizeTableEntry
+
+export type SizeTableProjection<
+  Table extends SizeTableDefinition,
+  Part extends SizeTablePart,
+> = {
+  readonly [Name in SizeTableName<Table>]: Table[Name][Part]
+}
+
+export type SizeTableContextValue<Table extends SizeTableDefinition> = {
+  size: SizeTableName<Table>
+}
+
+export type CreatedSizeTable<
+  Table extends SizeTableDefinition,
+  DefaultName extends SizeTableName<Table>,
+> = {
+  values: Table
+  names: readonly SizeTableName<Table>[]
+  defaultSize: DefaultName
+  Context: StyledContext<SizeTableContextValue<Table>, 'size'>
+  frame: SizeTableProjection<Table, 'frame'>
+  text: SizeTableProjection<Table, 'text'>
+  icon: SizeTableProjection<Table, 'icon'>
+  resolve: {
+    (): SizeTableSelection<Table, DefaultName>;
+    <Name extends SizeTableName<Table>>(name: Name): SizeTableSelection<Table, Name>
+  }
+}
+
+export const createSizeTable = <
+  const Table extends SizeTableDefinition,
+  const DefaultName extends SizeTableName<Table>,
+>(
+  values: Table,
+  defaultSize: DefaultName
+): CreatedSizeTable<Table, DefaultName> => {
+  const Context = createStyledContext<SizeTableContextValue<Table>>({ size: defaultSize })
+  const frame = {} as Record<SizeTableName<Table>, Table[SizeTableName<Table>]['frame']>
+  const text = {} as Record<SizeTableName<Table>, Table[SizeTableName<Table>]['text']>
+  const icon = {} as Record<SizeTableName<Table>, Table[SizeTableName<Table>]['icon']>
+
+  for (const name of Object.keys(values) as SizeTableName<Table>[]) {
+    frame[name] = values[name].frame
+    text[name] = values[name].text
+    icon[name] = values[name].icon
+  }
+
+  const resolve = ((name: SizeTableName<Table> = defaultSize) => {
+    if (!(name in values)) {
+      if (process.env.NODE_ENV !== 'production') {
+        console.error(
+          `Unknown size "${String(name)}" — this size table only has: ${Object.keys(values).join(', ')}. Size tables are user-owned named scales; the default skins take size tokens instead. Falling back to "${String(defaultSize)}".`
+        )
+      }
+      return values[defaultSize]
+    }
+    return values[name]
+  }) as CreatedSizeTable<Table, DefaultName>['resolve']
+
+  return {
+    values,
+    names: Object.keys(values) as SizeTableName<Table>[],
+    defaultSize,
+    Context,
+    frame: frame as SizeTableProjection<Table, 'frame'>,
+    text: text as SizeTableProjection<Table, 'text'>,
+    icon: icon as SizeTableProjection<Table, 'icon'>,
+    resolve,
+  }
+}