feat(tasty): add createGlobalStyle method

Author: tenphi

src/components/GlobalStyles.tsx

@@ -1,5 +1,4 @@
-import { createGlobalStyle } from 'styled-components';
-
+import { createGlobalStyle } from '../tasty';
 import { TOKENS } from '../tokens';
 
 interface GlobalStylesProps {

src/tasty/injector/index.test.ts

@@ -6,6 +6,7 @@ import { StyleResult } from '../utils/renderStyles';
 import {
   cleanup,
   configure,
+  createGlobalStyle,
   createInjector,
   destroy,
   getCssText,
@@ -500,4 +501,31 @@ describe('Global Style Injector API', () => {
       expect(shadow2Css).not.toContain('color: red');
     });
   });
+
+  describe('createGlobalStyle', () => {
+    test('exports createGlobalStyle function from global injector', () => {
+      expect(typeof createGlobalStyle).toBe('function');
+
+      // Create a global style component
+      const GlobalStyle = createGlobalStyle<{ color: string }>`
+        .test-global {
+          color: ${(props) => props.color};
+        }
+      `;
+
+      // Check that it returns a React component type
+      expect(typeof GlobalStyle).toBe('function');
+      expect(GlobalStyle.prototype).toBeDefined();
+
+      // Test that the interpolation would work as expected
+      const testColor = 'blue';
+      const expectedTemplate = `
+        .test-global {
+          color: ${testColor};
+        }
+      `;
+      expect(expectedTemplate).toContain('color: blue');
+      expect(expectedTemplate).toContain('.test-global');
+    });
+  });
 });

src/tasty/injector/index.ts

@@ -195,6 +195,19 @@ export function createInjector(
   return new StyleInjector(fullConfig);
 }
 
+/**
+ * Create a global style component like styled-components createGlobalStyle
+ * Returns a React component that injects global styles when mounted and cleans up when unmounted
+ */
+export function createGlobalStyle<Props = {}>(
+  strings: TemplateStringsArray,
+  ...interpolations: Array<
+    string | number | ((props: Props) => string | number)
+  >
+): import('react').ComponentType<Props & { root?: Document | ShadowRoot }> {
+  return getGlobalInjector().createGlobalStyle(strings, ...interpolations);
+}
+
 // Re-export types
 export type {
   StyleInjectorConfig,