Update TS

package.json

@@ -50,7 +50,7 @@
     "eslint": "^8.6.0",
     "jsdom": "^24.0.0",
     "prettier": "^2.5.1",
-    "typescript": "^5.0.2",
+    "typescript": "^5.4.2",
     "vitest": "^1.4.0",
     "vue-tsc": "^2.0.6"
   },

src/data/common.tsx

@@ -28,6 +28,7 @@ import { convertComputable, processComputable } from "util/computed";
 import { getFirstFeature, renderColJSX, renderJSX } from "util/vue";
 import type { ComputedRef, Ref } from "vue";
 import { computed, ref, unref } from "vue";
+import { JSX } from "vue/jsx-runtime";
 import "./common.css";
 
 /** An object that configures a {@link ResetButton} */
@@ -128,7 +129,7 @@ export function createResetButton<T extends ClickableOptions & ResetButtonOption
                         )}
                     </b>{" "}
                     {resetButton.conversion.gainResource.displayName}
-                    {unref(resetButton.showNextAt) != null ? (
+                    {unref(resetButton.showNextAt as ProcessedComputable<boolean>) != null ? (
                         <div>
                             <br />
                             {unref(resetButton.conversion.buyMax) ? "Next:" : "Req:"}{" "}

src/features/action.tsx

@@ -219,7 +219,7 @@ export function createAction<T extends ActionOptions>(
 
         const onClick = action.onClick.bind(action);
         action.onClick = function () {
-            if (unref(action.canClick) === false) {
+            if (unref(action.canClick as ProcessedComputable<boolean>) === false) {
                 return;
             }
             const amount = Decimal.div(progress.value, unref(genericAction.duration));

src/features/clickables/clickable.ts

@@ -129,7 +129,7 @@ export function createClickable<T extends ClickableOptions>(
         if (clickable.onClick) {
             const onClick = clickable.onClick.bind(clickable);
             clickable.onClick = function (e) {
-                if (unref(clickable.canClick) !== false) {
+                if (unref(clickable.canClick as ProcessedComputable<boolean>) !== false) {
                     onClick(e);
                 }
             };
@@ -137,7 +137,7 @@ export function createClickable<T extends ClickableOptions>(
         if (clickable.onHold) {
             const onHold = clickable.onHold.bind(clickable);
             clickable.onHold = function () {
-                if (unref(clickable.canClick) !== false) {
+                if (unref(clickable.canClick as ProcessedComputable<boolean>) !== false) {
                     onHold();
                 }
             };

src/features/conversion.ts

@@ -228,7 +228,7 @@ export function createIndependentConversion<S extends ConversionOptions>(
                         conversion.baseResource.value
                     )
                 ).max(conversion.gainResource.value);
-                if (unref(conversion.buyMax) === false) {
+                if (unref(conversion.buyMax as ProcessedComputable<boolean>) === false) {
                     gain = gain.min(Decimal.add(conversion.gainResource.value, 1));
                 }
                 return gain;
@@ -245,7 +245,7 @@ export function createIndependentConversion<S extends ConversionOptions>(
                     .floor()
                     .max(0);
 
-                if (unref(conversion.buyMax) === false) {
+                if (unref(conversion.buyMax as ProcessedComputable<boolean>) === false) {
                     gain = gain.min(1);
                 }
                 return gain;

src/features/feature.ts

@@ -2,6 +2,7 @@ import Decimal from "util/bignum";
 import { DoNotCache, ProcessedComputable } from "util/computed";
 import type { CSSProperties, DefineComponent } from "vue";
 import { isRef, unref } from "vue";
+import { JSX } from "vue/jsx-runtime";
 
 /**
  * A symbol to use as a key for a vue component a feature can be rendered with

src/features/trees/tree.ts

@@ -141,7 +141,9 @@ export function createTreeNode<T extends TreeNodeOptions>(
         if (treeNode.onClick) {
             const onClick = treeNode.onClick.bind(treeNode);
             treeNode.onClick = function (e) {
-                if (unref(treeNode.canClick) !== false) {
+                if (
+                    unref(treeNode.canClick as ProcessedComputable<boolean | undefined>) !== false
+                ) {
                     onClick(e);
                 }
             };
@@ -149,7 +151,9 @@ export function createTreeNode<T extends TreeNodeOptions>(
         if (treeNode.onHold) {
             const onHold = treeNode.onHold.bind(treeNode);
             treeNode.onHold = function () {
-                if (unref(treeNode.canClick) !== false) {
+                if (
+                    unref(treeNode.canClick as ProcessedComputable<boolean | undefined>) !== false
+                ) {
                     onHold();
                 }
             };

src/game/requirements.tsx

@@ -19,6 +19,7 @@ import {
 import { createLazyProxy } from "util/proxies";
 import { joinJSX, renderJSX } from "util/vue";
 import { computed, unref } from "vue";
+import { JSX } from "vue/jsx-runtime";
 import Formula, { calculateCost, calculateMaxAffordable } from "./formulas/formulas";
 import type { GenericFormula } from "./formulas/types";
 import { DefaultValue, Persistent } from "./persistence";
@@ -179,7 +180,7 @@ export function createCostRequirement<T extends CostRequirementOptions>(
                     ? calculateCost(
                           req.cost,
                           amount ?? 1,
-                          unref(req.cumulativeCost) as boolean,
+                          unref(req.cumulativeCost as ProcessedComputable<boolean>),
                           unref(req.directSum) as number
                       )
                     : unref(req.cost as ProcessedComputable<DecimalSource>);

src/util/vue.tsx

@@ -4,9 +4,9 @@ import type { CoercableComponent, GenericComponent, JSXFunction } from "features
 import {
     Component as ComponentKey,
     GatherProps,
+    Visibility,
     isVisible,
-    jsx,
-    Visibility
+    jsx
 } from "features/feature";
 import type { ProcessedComputable } from "util/computed";
 import { DoNotCache } from "util/computed";
@@ -21,6 +21,7 @@ import {
     unref,
     watchEffect
 } from "vue";
+import { JSX } from "vue/jsx-runtime";
 import { camelToKebab } from "./common";
 
 export function coerceComponent(

tsconfig.json

@@ -6,6 +6,7 @@
     "strict": true,
     "checkJs": false,
     "jsx": "preserve",
+    "jsxImportSource": "vue",
     "importHelpers": true,
     "moduleResolution": "node",
     "resolveJsonModule": true,