From f6cfdbc8d9b4bf6d3a68bd09a6d864bfbf7997f5 Mon Sep 17 00:00:00 2001
From: owjs3901 <owjs3901@gmail.com>
Date: Fri, 21 Nov 2025 23:17:58 +0900
Subject: [PATCH] Fix global css typing

---
 .../changepack_log_dRVzImm0AJhTH8RnWMkOY.json     |  5 +++++
 .../src/utils/__tests__/global-css.test-d.ts      | 15 +++++++++++++++
 packages/react/src/utils/global-css.ts            |  8 ++++----
 3 files changed, 24 insertions(+), 4 deletions(-)
 create mode 100644 .changepacks/changepack_log_dRVzImm0AJhTH8RnWMkOY.json
 create mode 100644 packages/react/src/utils/__tests__/global-css.test-d.ts

diff --git a/.changepacks/changepack_log_dRVzImm0AJhTH8RnWMkOY.json b/.changepacks/changepack_log_dRVzImm0AJhTH8RnWMkOY.json
new file mode 100644
index 00000000..2a660ece
--- /dev/null
+++ b/.changepacks/changepack_log_dRVzImm0AJhTH8RnWMkOY.json
@@ -0,0 +1,5 @@
+{
+  "changes": { "packages/react/package.json": "Patch" },
+  "note": "Fix globalCss typing",
+  "date": "2025-11-21T14:17:50.816538300Z"
+}
diff --git a/packages/react/src/utils/__tests__/global-css.test-d.ts b/packages/react/src/utils/__tests__/global-css.test-d.ts
new file mode 100644
index 00000000..0be126b4
--- /dev/null
+++ b/packages/react/src/utils/__tests__/global-css.test-d.ts
@@ -0,0 +1,15 @@
+import type { AdditionalGlobalCssProps, GlobalCssProps } from '../global-css'
+
+describe('globalCss', () => {
+  it('globalCss', () => {
+    assertType<GlobalCssProps | AdditionalGlobalCssProps>({
+      imports: ['https://example.com'],
+      a: {
+        color: 'blue',
+      },
+      _hover: {
+        bg: 'red',
+      },
+    })
+  })
+})
diff --git a/packages/react/src/utils/global-css.ts b/packages/react/src/utils/global-css.ts
index a4864e96..898ce3af 100644
--- a/packages/react/src/utils/global-css.ts
+++ b/packages/react/src/utils/global-css.ts
@@ -14,7 +14,7 @@ type GlobalCssKeys<T extends string> =
   | `${keyof SVGElementTagNameMap}${T}`
   | `_${CamelCase<ExtractSelector<T>>}`
 
-type GlobalCssProps = {
+export type GlobalCssProps = {
   [K in GlobalCssKeys<AdvancedSelector>]?: DevupCommonProps &
     DevupSelectorProps &
     DevupThemeSelectorProps & {
@@ -56,13 +56,13 @@ interface FontFaceProps {
 }
 
 type Import = { url: string; query?: string } | string
-interface AdditionalGlobalCssProps {
+export interface AdditionalGlobalCssProps {
   imports?: Import[]
   fontFaces?: FontFaceProps[]
 }
 
 export function globalCss(
-  strings: AdditionalGlobalCssProps & GlobalCssProps,
+  strings: AdditionalGlobalCssProps | GlobalCssProps,
 ): void
 
 export function globalCss(
@@ -80,7 +80,7 @@ export function globalCss(
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   strings?:
     | TemplateStringsArray
-    | (GlobalCssProps & AdditionalGlobalCssProps)
+    | (GlobalCssProps | AdditionalGlobalCssProps)
     | Record<
         string,
         DevupCommonProps & DevupSelectorProps & DevupThemeSelectorProps