@@ -7,8 +7,9 @@ import { loadRequiredLanguageParsers } from "../languageParser"
77import tsxQuery from "../queries/tsx"
88import { initializeTreeSitter , testParseSourceCodeDefinitions , inspectTreeStructure , debugLog } from "./helpers"
99
10- // Sample component content
10+ // Sample component content with enhanced TypeScript language constructs
1111const sampleTsxContent = `
12+ // Original components
1213interface VSCodeCheckboxProps {
1314 checked: boolean
1415 onChange: (checked: boolean) => void
@@ -66,7 +67,236 @@ const TemperatureControl = ({
6667 </>
6768 )
6869}
69- }`
70+
71+ // Utility Types
72+ type User = {
73+ id: string;
74+ username: string;
75+ password: string;
76+ email: string;
77+ }
78+
79+ // Partial - Makes all properties optional
80+ type PartialUser = Partial<User>;
81+
82+ // Required - Makes all properties required
83+ type RequiredConfig = Required<{theme?: string, showHeader?: boolean}>;
84+
85+ // Readonly - Makes all properties readonly
86+ type ReadonlyState = Readonly<{count: number, status: string}>;
87+
88+ // Function Overloads
89+ function process(value: string): string;
90+ function process(value: number): number;
91+ function process(value: boolean): boolean;
92+ function process(value: any): any {
93+ return value;
94+ }
95+
96+ // Async Function
97+ async function fetchData(url: string): Promise<Response> {
98+ const response = await fetch(url);
99+ return response;
100+ }
101+
102+ // Async Arrow Function
103+ const fetchUser = async (id: string): Promise<User> => {
104+ const response = await fetch(\`/api/users/\${id}\`);
105+ return response.json();
106+ };
107+
108+ // Class with Members and Properties
109+ class AdvancedComponent {
110+ // Public property
111+ public name: string;
112+
113+ // Private property
114+ private _count: number = 0;
115+
116+ // Protected property
117+ protected status: 'active' | 'inactive' = 'active';
118+
119+ // Readonly property
120+ readonly id: string;
121+
122+ // Static property
123+ static defaultProps = {
124+ theme: 'light',
125+ showHeader: true
126+ };
127+
128+ // Constructor
129+ constructor(name: string, id: string) {
130+ this.name = name;
131+ this.id = id;
132+ }
133+
134+ // Getter method
135+ get count(): number {
136+ return this._count;
137+ }
138+
139+ // Setter method
140+ set count(value: number) {
141+ if (value >= 0) {
142+ this._count = value;
143+ }
144+ }
145+
146+ // Public method
147+ public updateName(newName: string): void {
148+ this.name = newName;
149+ }
150+ }
151+
152+ // React Hooks and Context
153+ import React, { createContext, useContext, useState, useEffect } from 'react';
154+
155+ // Create a context
156+ const ThemeContext = createContext({
157+ theme: 'light',
158+ toggleTheme: () => {}
159+ });
160+
161+ // Context provider and consumer
162+ const ThemeProvider = ThemeContext.Provider;
163+ const ThemeConsumer = ThemeContext.Consumer;
164+
165+ // Custom hook using context
166+ function useTheme() {
167+ const context = useContext(ThemeContext);
168+ if (!context) {
169+ throw new Error('useTheme must be used within a ThemeProvider');
170+ }
171+ return context;
172+ }
173+
174+ // Component using hooks
175+ function ThemeToggler() {
176+ // useState hook
177+ const [theme, setTheme] = useState('light');
178+
179+ // useEffect hook
180+ useEffect(() => {
181+ document.body.dataset.theme = theme;
182+ return () => {
183+ delete document.body.dataset.theme;
184+ };
185+ }, [theme]);
186+
187+ return (
188+ <button onClick={() => setTheme(theme === 'light' ? 'dark' : 'light')}>
189+ Switch to {theme === 'light' ? 'dark' : 'light'} theme
190+ </button>
191+ );
192+ }
193+
194+ // Decorator Example
195+ @Component({
196+ selector: 'app-root',
197+ template: '<div>App Component</div>'
198+ })
199+ class AppComponent {
200+ title = 'My App';
201+
202+ @Input()
203+ data: string[] = [];
204+ }
205+
206+ // Enum Declaration
207+ enum LogLevel {
208+ Error = 1,
209+ Warning = 2,
210+ Info = 3,
211+ Debug = 4
212+ }
213+
214+ // Namespace Declaration
215+ namespace Validation {
216+ export function isValidEmail(email: string): boolean {
217+ return email.includes('@');
218+ }
219+
220+ export function isValidPhone(phone: string): boolean {
221+ return phone.length >= 10;
222+ }
223+ }
224+
225+ // Complex Nested Components and Member Expressions
226+ export const ComplexComponent = () => {
227+ return (
228+ <CustomHeader
229+ title="Test"
230+ subtitle={
231+ <span className="text-gray-500">
232+ Nested <strong>content</strong>
233+ </span>
234+ }
235+ />
236+ );
237+ };
238+
239+ export const NestedSelectors = () => (
240+ <section>
241+ <Select.Option>
242+ <Group.Item>
243+ <Text.Body>Deeply nested</Text.Body>
244+ </Group.Item>
245+ </Select.Option>
246+ </section>
247+ );
248+
249+ // Template Literal Types
250+ type EventName<T extends string> = \`on\${Capitalize<T>}\`;
251+ type CSSProperty<T extends string> = \`--\${T}\` | \`-webkit-\${T}\` | \`-moz-\${T}\` | \`-ms-\${T}\`;
252+ type RouteParams<T extends string> = T extends \`\${string}:\${infer Param}/\${infer Rest}\`
253+ ? { [K in Param | keyof RouteParams<Rest>]: string }
254+ : T extends \`\${string}:\${infer Param}\`
255+ ? { [K in Param]: string }
256+ : {};
257+
258+ // Conditional Types
259+ type ReturnType<T> = T extends (...args: any[]) => infer R ? R : never;
260+ type Parameters<T> = T extends (...args: infer P) => any ? P : never;
261+ type InstanceType<T> = T extends new (...args: any[]) => infer R ? R : never;
262+ type IsFunction<T> = T extends (...args: any[]) => any ? true : false;
263+
264+ // Generic Components with Constraints
265+ type ComplexProps<T> = {
266+ data: T[];
267+ render: (item: T) => React.ReactNode;
268+ };
269+
270+ export const GenericList = <T extends { id: string }>({
271+ data,
272+ render
273+ }: ComplexProps<T>) => (
274+ <div>
275+ {data.map(item => render(item))}
276+ </div>
277+ );
278+
279+ export const ConditionalComponent = ({ condition }) =>
280+ condition ? (
281+ <PrimaryContent>
282+ <h1>Main Content</h1>
283+ </PrimaryContent>
284+ ) : (
285+ <FallbackContent />
286+ );
287+
288+ // Dictionary Interface with Constrained Key Types
289+ interface Dictionary<K extends string | number, V> {
290+ get(key: K): V | undefined;
291+ set(key: K, value: V): void;
292+ has(key: K): boolean;
293+ }
294+
295+ type KeyValuePair<K extends string | number, V> = {
296+ key: K;
297+ value: V;
298+ };
299+ `
70300
71301// We'll use the debug test to test the parser directly
72302
0 commit comments