From cdecd615e22c6fc510243f8e95c836910b49bd33 Mon Sep 17 00:00:00 2001
From: Wukong Sun <swkatmask@gmail.com>
Date: Mon, 23 Mar 2026 18:16:09 +0800
Subject: [PATCH 1/2] refactor: make gotoDefinition for classes possible
 without plugin

---
 packages/theme/src/UIHelper/makeStyles.ts | 94 +++++++++++++++++------
 tsconfig.json                             |  3 +-
 2 files changed, 71 insertions(+), 26 deletions(-)

diff --git a/packages/theme/src/UIHelper/makeStyles.ts b/packages/theme/src/UIHelper/makeStyles.ts
index d200c85c675c..da15855ffb81 100644
--- a/packages/theme/src/UIHelper/makeStyles.ts
+++ b/packages/theme/src/UIHelper/makeStyles.ts
@@ -1,31 +1,77 @@
 import { createMakeStyles, type CSSObject, type Css, type Cx } from 'tss-react'
 import { useTheme, type Theme } from '@mui/material'
 
-// Note: type refinement, see https://github.com/garronej/tss-react/issues/128
-export const { makeStyles } = createMakeStyles({ useTheme }) as any as {
-    makeStyles: <Params = void, RuleNameSubsetReferencedInNestedSelectors extends string = never>(params?: {
-        name?: string | Record<string, unknown>
-        uniqId?: string
-    }) => <RuleName extends string>(
-        cssObjectByRuleNameOrGetCssObjectByRuleName:
-            | Record<RuleName, CSSObject>
-            | ((
-                  theme: Theme,
-                  params: Params,
-                  classes: Record<RuleNameSubsetReferencedInNestedSelectors, string>,
-              ) => Record<RuleNameSubsetReferencedInNestedSelectors | RuleName, CSSObject>),
-    ) => <StyleOverrides extends { classes?: { [key in string]?: string | undefined } }>(
+const { makeStyles: baseMakeStyles } = createMakeStyles({ useTheme })
+
+type MakeStylesOptions = {
+    name?: string | Record<string, unknown>
+    uniqId?: string
+}
+
+type StyleRules = Record<string, CSSObject>
+
+type NestedSelectorClasses<RuleNameSubsetReferencedInNestedSelectors extends string> = Record<
+    RuleNameSubsetReferencedInNestedSelectors,
+    string
+>
+
+type StyleOverrides = {
+    classes?: { [key in string]?: string | undefined }
+}
+
+type EmptyStyleOverrides = {
+    classes?: Record<never, never>
+}
+
+type StyleClassNames<Styles extends StyleRules> = {
+    [Key in keyof Styles]: string
+}
+
+type ExtraClassKeys<Overrides extends StyleOverrides> =
+    Overrides extends { classes?: infer Classes } ? Extract<keyof NonNullable<Classes>, string> : never
+
+type OverrideClassNames<ExtraKeys extends string, BaseKeys extends PropertyKey> =
+    string extends ExtraKeys ? Record<string, string>
+    : { [Key in Exclude<ExtraKeys, BaseKeys>]: string }
+
+type MakeStylesResult<Styles extends StyleRules, Overrides extends StyleOverrides> = {
+    classes: StyleClassNames<Styles> & OverrideClassNames<ExtraClassKeys<Overrides>, keyof Styles>
+    theme: Theme
+    css: Css
+    cx: Cx
+}
+
+type GetCssObjectByRuleName<
+    Params,
+    RuleNameSubsetReferencedInNestedSelectors extends string,
+    Styles extends StyleRules,
+> = (
+    theme: Theme,
+    params: Params,
+    classes: NestedSelectorClasses<RuleNameSubsetReferencedInNestedSelectors>,
+) => Styles
+
+export interface UseStyles<Params, Styles extends StyleRules> {
+    (params: Params): MakeStylesResult<Styles, EmptyStyleOverrides>
+    <Overrides extends StyleOverrides>(
         params: Params,
-        styleOverrides?: {
-            props: StyleOverrides
+        styleOverrides: {
+            props: Overrides
             ownerState?: Record<string, unknown>
         },
-    ) => {
-        classes: StyleOverrides extends { classes?: { [key in infer ExtraKeys]?: string | undefined } } ?
-            Record<string extends ExtraKeys ? RuleName : ExtraKeys | RuleName, string>
-        :   Record<RuleName, string>
-        theme: Theme
-        css: Css
-        cx: Cx
-    }
+    ): MakeStylesResult<Styles, Overrides>
+}
+
+interface MakeStylesHook<Params, RuleNameSubsetReferencedInNestedSelectors extends string> {
+    <Styles extends StyleRules>(cssObjectByRuleName: Styles): UseStyles<Params, Styles>
+    <Styles extends StyleRules>(
+        getCssObjectByRuleName: GetCssObjectByRuleName<Params, RuleNameSubsetReferencedInNestedSelectors, Styles>,
+    ): UseStyles<Params, Styles>
+}
+
+// Note: type refinement, see https://github.com/garronej/tss-react/issues/128
+export function makeStyles<Params = void, RuleNameSubsetReferencedInNestedSelectors extends string = never>(
+    params?: MakeStylesOptions,
+): MakeStylesHook<Params, RuleNameSubsetReferencedInNestedSelectors> {
+    return baseMakeStyles(params) as unknown as MakeStylesHook<Params, RuleNameSubsetReferencedInNestedSelectors>
 }
diff --git a/tsconfig.json b/tsconfig.json
index d17af1e3d068..cafeddb4eee6 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -141,8 +141,7 @@
       // @masknet/scripts: insert-here 3
       "@masknet/plugin-switch-logo": ["./packages/plugins/SwitchLogo/src/index.ts"],
       "@masknet/plugin-calendar": ["./packages/plugins/Calendar/src/index.ts"]
-    },
-    "plugins": [{ "name": "@masknet/typescript-plugin" }]
+    }
   },
   "files": []
 }

From 80ce3e353a4afa4118bfd84e35a5006bb7eca7f9 Mon Sep 17 00:00:00 2001
From: Wukong Sun <swkatmask@gmail.com>
Date: Mon, 23 Mar 2026 20:23:54 +0800
Subject: [PATCH 2/2] fix: preserve makeStyles callback typing

---
 packages/theme/src/UIHelper/makeStyles.ts | 17 +++++++----------
 1 file changed, 7 insertions(+), 10 deletions(-)

diff --git a/packages/theme/src/UIHelper/makeStyles.ts b/packages/theme/src/UIHelper/makeStyles.ts
index da15855ffb81..77b8349eeaaf 100644
--- a/packages/theme/src/UIHelper/makeStyles.ts
+++ b/packages/theme/src/UIHelper/makeStyles.ts
@@ -8,7 +8,8 @@ type MakeStylesOptions = {
     uniqId?: string
 }
 
-type StyleRules = Record<string, CSSObject>
+type StyleRules = Record<string, CSSObject | { [key: string]: unknown }>
+//                                           ^ conceal the complaint like `position: string` not satisfy `position: CSSProperties['position']`
 
 type NestedSelectorClasses<RuleNameSubsetReferencedInNestedSelectors extends string> = Record<
     RuleNameSubsetReferencedInNestedSelectors,
@@ -41,15 +42,11 @@ type MakeStylesResult<Styles extends StyleRules, Overrides extends StyleOverride
     cx: Cx
 }
 
-type GetCssObjectByRuleName<
-    Params,
-    RuleNameSubsetReferencedInNestedSelectors extends string,
-    Styles extends StyleRules,
-> = (
+type GetCssObjectByRuleName<Params, RuleNameSubsetReferencedInNestedSelectors extends string> = (
     theme: Theme,
     params: Params,
     classes: NestedSelectorClasses<RuleNameSubsetReferencedInNestedSelectors>,
-) => Styles
+) => StyleRules
 
 export interface UseStyles<Params, Styles extends StyleRules> {
     (params: Params): MakeStylesResult<Styles, EmptyStyleOverrides>
@@ -64,9 +61,9 @@ export interface UseStyles<Params, Styles extends StyleRules> {
 
 interface MakeStylesHook<Params, RuleNameSubsetReferencedInNestedSelectors extends string> {
     <Styles extends StyleRules>(cssObjectByRuleName: Styles): UseStyles<Params, Styles>
-    <Styles extends StyleRules>(
-        getCssObjectByRuleName: GetCssObjectByRuleName<Params, RuleNameSubsetReferencedInNestedSelectors, Styles>,
-    ): UseStyles<Params, Styles>
+    <T extends GetCssObjectByRuleName<Params, RuleNameSubsetReferencedInNestedSelectors>>(
+        getCssObjectByRuleName: T,
+    ): UseStyles<Params, ReturnType<T>>
 }
 
 // Note: type refinement, see https://github.com/garronej/tss-react/issues/128