@gtkx/react 0.5.2 → 0.6.1

package/README.md

@@ -58,7 +58,7 @@ const App = () => {
   return (
     <ApplicationWindow title="Counter" onCloseRequest={quit}>
       <Box orientation={Gtk.Orientation.VERTICAL} spacing={12}>
-        <Label.Root label={`Count: ${count}`} />
+        <Label label={`Count: ${count}`} />
         <Button label="Increment" onClicked={() => setCount((c) => c + 1)} />
       </Box>
     </ApplicationWindow>

package/dist/codegen/jsx-generator.d.ts

@@ -1,4 +1,4 @@
-import type { GirClass, GirNamespace, TypeMapper } from "@gtkx/gir";
+import type { GirClass, GirNamespace, TypeMapper, TypeRegistry } from "@gtkx/gir";
 /**
  * Configuration options for the JSX type generator.
  */
@@ -21,26 +21,29 @@ interface JsxGeneratorResult {
  */
 export declare class JsxGenerator {
     private typeMapper;
-    private options;
+    private typeRegistry;
     private classMap;
+    private options;
     private interfaceMap;
-    private namespace;
-    private usedExternalNamespaces;
+    private usedNamespaces;
     private widgetPropertyNames;
     private widgetSignalNames;
+    private currentNamespace;
+    private widgetNamespaceMap;
     /**
      * Creates a new JSX generator.
      * @param typeMapper - TypeMapper for converting GIR types to TypeScript
+     * @param typeRegistry - TypeRegistry for cross-namespace type resolution
+     * @param classMap - Combined class map with fully qualified names
      * @param options - Generator configuration options
      */
-    constructor(typeMapper: TypeMapper, options?: JsxGeneratorOptions);
+    constructor(typeMapper: TypeMapper, typeRegistry: TypeRegistry, classMap: Map<string, GirClass>, options?: JsxGeneratorOptions);
     /**
-     * Generates JSX type definitions for all widgets in a namespace.
-     * @param namespace - The parsed GIR namespace
-     * @param classMap - Map of class names to class definitions
+     * Generates JSX type definitions for all widgets in the given namespaces.
+     * @param namespaces - The parsed GIR namespaces (GTK must be first)
      * @returns Generated TypeScript code as public jsx.ts and internal.ts files
      */
-    generate(namespace: GirNamespace, classMap: Map<string, GirClass>): Promise<JsxGeneratorResult>;
+    generate(namespaces: GirNamespace[]): Promise<JsxGeneratorResult>;
     private generateImports;
     private generateInternalImports;
     private generateCommonTypes;
@@ -49,6 +52,7 @@ export declare class JsxGenerator {
     private findWidgets;
     private analyzeContainerCapabilities;
     private generateWidgetPropsInterfaces;
+    private getWidgetExportName;
     private generateWidgetProps;
     private getParentPropsName;
     private getRequiredConstructorParams;
@@ -56,12 +60,14 @@ export declare class JsxGenerator {
     private generateConstructorArgsMetadata;
     private generatePropSettersMap;
     private generateSetterGetterMap;
+    private collectParentMethodNames;
     private collectAllProperties;
     private getAncestorInterfaces;
     private findInheritedProperty;
     private generateSignalHandler;
     private getSignalParamFfiType;
     private addNamespacePrefix;
+    private toJsxPropertyType;
     private buildSignalHandlerType;
     private generateExports;
     private generateApplicationMenuComponents;

package/dist/codegen/jsx-generator.js

@@ -7,14 +7,16 @@ const GRID_WIDGETS = new Set(["Grid"]);
 const NOTEBOOK_WIDGET = "Notebook";
 const STACK_WIDGET = "Stack";
 const POPOVER_MENU_WIDGET = "PopoverMenu";
+const TOOLBAR_VIEW_WIDGET = "ToolbarView";
 const INTERNALLY_PROVIDED_PARAMS = {
     ApplicationWindow: new Set(["application"]),
 };
+const WIDGET_REFERENCE_PROPERTIES = new Set(["mnemonic-widget"]);
 const isPrimitive = (tsType) => {
     const primitives = new Set(["boolean", "number", "string", "void", "unknown", "null", "undefined"]);
     return primitives.has(tsType);
 };
-const toJsxPropertyType = (tsType) => {
+const toJsxPropertyTypeBase = (tsType, namespace) => {
     let result = tsType;
     if (result.startsWith("Ref<")) {
         result = result.replace(/^Ref<(.+)>$/, "$1");
@@ -28,7 +30,7 @@ const toJsxPropertyType = (tsType) => {
     }
     if (result.includes(".") || result.includes("<") || result.includes("("))
         return result;
-    return `Gtk.${result}`;
+    return `${namespace}.${result}`;
 };
 const isListWidget = (widgetName) => LIST_WIDGETS.has(widgetName);
 const isColumnViewWidget = (widgetName) => widgetName === COLUMN_VIEW_WIDGET;
@@ -37,9 +39,10 @@ const isGridWidget = (widgetName) => GRID_WIDGETS.has(widgetName);
 const isNotebookWidget = (widgetName) => widgetName === NOTEBOOK_WIDGET;
 const isStackWidget = (widgetName) => widgetName === STACK_WIDGET;
 const isPopoverMenuWidget = (widgetName) => widgetName === POPOVER_MENU_WIDGET;
+const isToolbarViewWidget = (widgetName) => widgetName === TOOLBAR_VIEW_WIDGET;
 const sanitizeDoc = (doc) => {
     let result = doc;
-    result = result.replace(/<picture>[\s\S]*?<\/picture>/gi, "");
+    result = result.replace(/<picture[^>]*>[\s\S]*?<\/picture>/gi, "");
     result = result.replace(/<img[^>]*>/gi, "");
     result = result.replace(/<source[^>]*>/gi, "");
     result = result.replace(/!\[[^\]]*\]\([^)]+\.png\)/gi, "");
@@ -48,6 +51,7 @@ const sanitizeDoc = (doc) => {
     result = result.replace(/<\/kbd>/gi, "`");
     result = result.replace(/\[([^\]]+)\]\([^)]+\.html[^)]*\)/gi, "$1");
     result = result.replace(/@(\w+)\s/g, "`$1` ");
+    result = result.replace(/<(\/?)(child|object|property|signal|template)>/gi, "`<$1$2>`");
     return result.trim();
 };
 const formatDoc = (doc, indent = "") => {
@@ -82,52 +86,66 @@ const isWidgetSubclass = (typeName, classMap, visited = new Set()) => {
  */
 export class JsxGenerator {
     typeMapper;
+    typeRegistry;
+    classMap;
     options;
-    classMap = new Map();
     interfaceMap = new Map();
-    namespace = "";
-    usedExternalNamespaces = new Set();
+    usedNamespaces = new Set();
     widgetPropertyNames = new Set();
     widgetSignalNames = new Set();
+    currentNamespace = "";
+    widgetNamespaceMap = new Map();
     /**
      * Creates a new JSX generator.
      * @param typeMapper - TypeMapper for converting GIR types to TypeScript
+     * @param typeRegistry - TypeRegistry for cross-namespace type resolution
+     * @param classMap - Combined class map with fully qualified names
      * @param options - Generator configuration options
      */
-    constructor(typeMapper, options = {}) {
+    constructor(typeMapper, typeRegistry, classMap, options = {}) {
         this.typeMapper = typeMapper;
+        this.typeRegistry = typeRegistry;
+        this.classMap = classMap;
         this.options = options;
     }
     /**
-     * Generates JSX type definitions for all widgets in a namespace.
-     * @param namespace - The parsed GIR namespace
-     * @param classMap - Map of class names to class definitions
+     * Generates JSX type definitions for all widgets in the given namespaces.
+     * @param namespaces - The parsed GIR namespaces (GTK must be first)
      * @returns Generated TypeScript code as public jsx.ts and internal.ts files
      */
-    async generate(namespace, classMap) {
-        this.classMap = classMap;
-        this.interfaceMap = new Map(namespace.interfaces.map((iface) => [iface.name, iface]));
-        this.namespace = namespace.name;
-        this.usedExternalNamespaces.clear();
-        const widgets = this.findWidgets(namespace, classMap);
-        const containerMetadata = this.buildContainerMetadata(widgets, classMap);
-        const widgetClass = classMap.get("Widget");
+    async generate(namespaces) {
+        for (const ns of namespaces) {
+            for (const iface of ns.interfaces) {
+                this.interfaceMap.set(iface.name, iface);
+                this.interfaceMap.set(`${ns.name}.${iface.name}`, iface);
+            }
+        }
+        this.usedNamespaces.clear();
+        this.widgetNamespaceMap.clear();
+        const allWidgets = [];
+        for (const ns of namespaces) {
+            const widgets = this.findWidgets(ns);
+            for (const widget of widgets) {
+                allWidgets.push({ widget, namespace: ns.name });
+                this.widgetNamespaceMap.set(widget.name, ns.name);
+                this.widgetNamespaceMap.set(`${ns.name}.${widget.name}`, ns.name);
+            }
+        }
+        const containerMetadata = this.buildContainerMetadata(allWidgets);
+        const widgetClass = this.classMap.get("Widget") ?? this.classMap.get("Gtk.Widget");
         this.widgetPropertyNames = new Set(widgetClass?.properties.map((p) => toCamelCase(p.name)) ?? []);
         this.widgetSignalNames = new Set(widgetClass?.signals.map((s) => toCamelCase(s.name)) ?? []);
-        const widgetPropsInterfaces = this.generateWidgetPropsInterfaces(widgets, containerMetadata);
-        const jsxSections = [
-            this.generateImports(),
-            this.generateCommonTypes(widgetClass),
-            widgetPropsInterfaces,
-            this.generateExports(widgets, containerMetadata),
-            this.generateJsxNamespace(widgets, containerMetadata),
-            "export {};",
-        ];
+        const commonTypes = this.generateCommonTypes(widgetClass);
+        const widgetPropsInterfaces = this.generateWidgetPropsInterfaces(allWidgets, containerMetadata);
+        const exports = this.generateExports(allWidgets, containerMetadata);
+        const jsxNamespace = this.generateJsxNamespace(allWidgets, containerMetadata);
+        const imports = this.generateImports();
+        const jsxSections = [imports, commonTypes, widgetPropsInterfaces, exports, jsxNamespace, "export {};"];
         const internalSections = [
             this.generateInternalImports(),
-            this.generateConstructorArgsMetadata(widgets),
-            this.generatePropSettersMap(widgets),
-            this.generateSetterGetterMap(widgets),
+            this.generateConstructorArgsMetadata(allWidgets),
+            this.generatePropSettersMap(allWidgets),
+            this.generateSetterGetterMap(allWidgets),
         ];
         return {
             jsx: await this.formatCode(jsxSections.join("\n")),
@@ -135,15 +153,15 @@ export class JsxGenerator {
         };
     }
     generateImports() {
-        const externalImports = [...this.usedExternalNamespaces]
+        this.usedNamespaces.add("Gtk");
+        const namespaceImports = [...this.usedNamespaces]
             .sort()
             .map((ns) => `import type * as ${ns} from "@gtkx/ffi/${ns.toLowerCase()}";`);
         return [
             `import "react";`,
             `import { createElement } from "react";`,
             `import type { ReactNode, Ref } from "react";`,
-            ...externalImports,
-            `import type * as Gtk from "@gtkx/ffi/gtk";`,
+            ...namespaceImports,
             `import type { ColumnViewColumnProps, ColumnViewRootProps, GridChildProps, ListItemProps, ListViewRenderProps, MenuItemProps, MenuRootProps, MenuSectionProps, MenuSubmenuProps, NotebookPageProps, SlotProps, StackPageProps, StackRootProps } from "../types.js";`,
             "",
         ].join("\n");
@@ -152,6 +170,8 @@ export class JsxGenerator {
         return "/** Internal metadata for the reconciler. Not part of the public API. */\n";
     }
     generateCommonTypes(widgetClass) {
+        this.currentNamespace = "Gtk";
+        this.typeMapper.setTypeRegistry(this.typeRegistry, "Gtk");
         const widgetPropsContent = this.generateWidgetPropsContent(widgetClass);
         return `
 export { ColumnViewColumnProps, ColumnViewRootProps, GridChildProps, ListItemProps, ListViewRenderProps, MenuItemProps, MenuRootProps, MenuSectionProps, MenuSubmenuProps, NotebookPageProps, SlotProps, StackPageProps, StackRootProps };
@@ -169,7 +189,7 @@ ${widgetPropsContent}
         if (widgetClass) {
             for (const prop of widgetClass.properties) {
                 const propName = toCamelCase(prop.name);
-                const tsType = toJsxPropertyType(this.typeMapper.mapType(prop.type).ts);
+                const tsType = this.toJsxPropertyType(this.typeMapper.mapType(prop.type).ts, "Gtk");
                 if (prop.doc) {
                     lines.push(formatDoc(prop.doc, "\t").trimEnd());
                 }
@@ -190,33 +210,39 @@ ${widgetPropsContent}
         lines.push("}");
         return lines.join("\n");
     }
-    buildContainerMetadata(widgets, classMap) {
+    buildContainerMetadata(widgets) {
         const metadata = new Map();
-        for (const widget of widgets) {
-            metadata.set(widget.name, this.analyzeContainerCapabilities(widget, classMap));
+        for (const { widget, namespace } of widgets) {
+            const key = `${namespace}.${widget.name}`;
+            metadata.set(key, this.analyzeContainerCapabilities(widget));
         }
         return metadata;
     }
-    findWidgets(namespace, classMap) {
+    findWidgets(namespace) {
         const widgetCache = new Map();
-        const checkIsWidget = (className) => {
-            const cached = widgetCache.get(className);
+        const checkIsWidget = (className, ns) => {
+            const cacheKey = `${ns}.${className}`;
+            const cached = widgetCache.get(cacheKey);
             if (cached !== undefined)
                 return cached;
-            const cls = classMap.get(className);
-            if (!cls) {
-                widgetCache.set(className, false);
+            widgetCache.set(cacheKey, false);
+            const cls = this.classMap.get(cacheKey) ?? this.classMap.get(className);
+            if (!cls)
                 return false;
-            }
             if (cls.name === "Widget") {
-                widgetCache.set(className, true);
+                widgetCache.set(cacheKey, true);
                 return true;
             }
-            const result = cls.parent ? checkIsWidget(cls.parent) : false;
-            widgetCache.set(className, result);
-            return result;
+            if (cls.parent) {
+                const parentNs = cls.parent.includes(".") ? cls.parent.split(".")[0] : ns;
+                const parentName = cls.parent.includes(".") ? cls.parent.split(".")[1] : cls.parent;
+                const result = checkIsWidget(parentName ?? "", parentNs ?? ns);
+                widgetCache.set(cacheKey, result);
+                return result;
+            }
+            return false;
         };
-        const widgets = namespace.classes.filter((cls) => checkIsWidget(cls.name));
+        const widgets = namespace.classes.filter((cls) => checkIsWidget(cls.name, namespace.name));
         return widgets.sort((a, b) => {
             if (a.name === "Widget")
                 return -1;
@@ -229,20 +255,26 @@ ${widgetPropsContent}
             return a.name.localeCompare(b.name);
         });
     }
-    analyzeContainerCapabilities(widget, classMap) {
+    analyzeContainerCapabilities(widget) {
         const hasAppend = widget.methods.some((m) => m.name === "append");
         const hasSetChild = widget.methods.some((m) => m.name === "set_child");
         const namedChildSlots = widget.properties
             .filter((prop) => {
             if (!prop.writable)
                 return false;
+            if (WIDGET_REFERENCE_PROPERTIES.has(prop.name))
+                return false;
             const typeName = prop.type.name;
-            return typeName === "Gtk.Widget" || typeName === "Widget" || isWidgetSubclass(typeName, classMap);
+            return typeName === "Gtk.Widget" || typeName === "Widget" || isWidgetSubclass(typeName, this.classMap);
         })
             .map((prop) => ({
             propertyName: prop.name,
             slotName: toPascalCase(prop.name),
         }));
+        if (isToolbarViewWidget(widget.name)) {
+            namedChildSlots.push({ propertyName: "top", slotName: "Top" });
+            namedChildSlots.push({ propertyName: "bottom", slotName: "Bottom" });
+        }
         return {
             supportsMultipleChildren: hasAppend,
             supportsSingleChild: hasSetChild,
@@ -251,18 +283,28 @@ ${widgetPropsContent}
     }
     generateWidgetPropsInterfaces(widgets, containerMetadata) {
         const sections = [];
-        for (const widget of widgets) {
+        for (const { widget, namespace } of widgets) {
             if (widget.name === "Widget")
                 continue;
-            const metadata = containerMetadata.get(widget.name);
+            const metadataKey = `${namespace}.${widget.name}`;
+            const metadata = containerMetadata.get(metadataKey);
             if (!metadata)
-                throw new Error(`Missing container metadata for widget: ${widget.name}`);
+                throw new Error(`Missing container metadata for widget: ${metadataKey}`);
+            this.currentNamespace = namespace;
+            this.usedNamespaces.add(namespace);
+            this.typeMapper.setTypeRegistry(this.typeRegistry, namespace);
             sections.push(this.generateWidgetProps(widget, metadata));
         }
         return sections.join("\n");
     }
+    getWidgetExportName(widget) {
+        const baseName = toPascalCase(widget.name);
+        if (this.currentNamespace === "Gtk")
+            return baseName;
+        return `${this.currentNamespace}${baseName}`;
+    }
     generateWidgetProps(widget, metadata) {
-        const widgetName = toPascalCase(widget.name);
+        const widgetName = this.getWidgetExportName(widget);
         const parentPropsName = this.getParentPropsName(widget);
         const namedChildPropNames = new Set(metadata.namedChildSlots.map((s) => toCamelCase(s.propertyName)));
         const lines = [];
@@ -308,10 +350,9 @@ ${widgetPropsContent}
             const propName = toCamelCase(prop.name);
             emittedProps.add(prop.name);
             const typeMapping = this.typeMapper.mapType(prop.type);
-            const tsType = toJsxPropertyType(typeMapping.ts);
-            const isRequiredByProperty = prop.constructOnly && !prop.hasDefault;
+            const tsType = this.toJsxPropertyType(typeMapping.ts, this.currentNamespace);
             const isRequiredByConstructor = requiredCtorParams.has(prop.name);
-            const isRequired = isRequiredByProperty || isRequiredByConstructor;
+            const isRequired = isRequiredByConstructor;
             if (prop.doc) {
                 lines.push(formatDoc(prop.doc, "\t").trimEnd());
             }
@@ -324,7 +365,7 @@ ${widgetPropsContent}
             const inheritedProp = this.findInheritedProperty(widget, paramName);
             if (inheritedProp) {
                 const typeMapping = this.typeMapper.mapType(inheritedProp.type);
-                const tsType = toJsxPropertyType(typeMapping.ts);
+                const tsType = this.toJsxPropertyType(typeMapping.ts, this.currentNamespace);
                 lines.push(`\t${propName}: ${tsType};`);
             }
         }
@@ -338,7 +379,7 @@ ${widgetPropsContent}
                 if (signal.doc) {
                     lines.push(formatDoc(signal.doc, "\t").trimEnd());
                 }
-                lines.push(`\t${this.generateSignalHandler(signal, widgetName)}`);
+                lines.push(`\t${this.generateSignalHandler(signal, widget.name)}`);
             }
         }
         if (isListWidget(widget.name)) {
@@ -357,7 +398,8 @@ ${widgetPropsContent}
             lines.push(`\tonSelectionChanged?: (item: unknown, index: number) => void;`);
         }
         lines.push("");
-        lines.push(`\tref?: Ref<Gtk.${widgetName}>;`);
+        const ffiTypeName = toPascalCase(widget.name);
+        lines.push(`\tref?: Ref<${this.currentNamespace}.${ffiTypeName}>;`);
         lines.push(`}`);
         return `${lines.join("\n")}\n`;
     }
@@ -366,11 +408,19 @@ ${widgetPropsContent}
             return "WidgetProps";
         if (widget.name === "ApplicationWindow")
             return "WindowProps";
-        if (widget.parent === "Widget")
+        if (!widget.parent)
             return "WidgetProps";
-        if (widget.parent === "Window")
+        const parentNs = widget.parent.includes(".") ? widget.parent.split(".")[0] : this.currentNamespace;
+        const parentName = widget.parent.includes(".") ? widget.parent.split(".")[1] : widget.parent;
+        if (parentName === "Widget")
+            return "WidgetProps";
+        if (parentName === "Window")
             return "WindowProps";
-        return widget.parent ? `${toPascalCase(widget.parent)}Props` : "WidgetProps";
+        const baseName = toPascalCase(parentName ?? "");
+        if (parentNs === "Gtk") {
+            return `${baseName}Props`;
+        }
+        return `${parentNs}${baseName}Props`;
     }
     getRequiredConstructorParams(widget) {
         const required = new Set();
@@ -392,18 +442,22 @@ ${widgetPropsContent}
         const mainCtor = widget.constructors.find((c) => c.name === "new");
         if (!mainCtor)
             return [];
-        return mainCtor.parameters.map((param) => ({
+        const params = mainCtor.parameters.map((param) => ({
             name: toCamelCase(param.name),
             hasDefault: param.nullable || param.optional || false,
         }));
+        const required = params.filter((p) => !p.hasDefault);
+        const optional = params.filter((p) => p.hasDefault);
+        return [...required, ...optional];
     }
     generateConstructorArgsMetadata(widgets) {
         const entries = [];
-        for (const widget of widgets) {
+        for (const { widget, namespace } of widgets) {
             const params = this.getConstructorParams(widget);
             if (params.length === 0)
                 continue;
-            const widgetName = toPascalCase(widget.name);
+            this.currentNamespace = namespace;
+            const widgetName = this.getWidgetExportName(widget);
             const paramStrs = params.map((p) => `{ name: "${p.name}", hasDefault: ${p.hasDefault} }`);
             entries.push(`\t${widgetName}: [${paramStrs.join(", ")}]`);
         }
@@ -414,7 +468,8 @@ ${widgetPropsContent}
     }
     generatePropSettersMap(widgets) {
         const widgetEntries = [];
-        for (const widget of widgets) {
+        for (const { widget, namespace } of widgets) {
+            this.currentNamespace = namespace;
             const propSetterPairs = [];
             const allProps = this.collectAllProperties(widget);
             for (const prop of allProps) {
@@ -425,7 +480,7 @@ ${widgetPropsContent}
                 }
             }
             if (propSetterPairs.length > 0) {
-                const widgetName = toPascalCase(widget.name);
+                const widgetName = this.getWidgetExportName(widget);
                 widgetEntries.push(`\t${widgetName}: { ${propSetterPairs.join(", ")} }`);
             }
         }
@@ -436,18 +491,24 @@ ${widgetPropsContent}
     }
     generateSetterGetterMap(widgets) {
         const widgetEntries = [];
-        for (const widget of widgets) {
+        for (const { widget, namespace } of widgets) {
+            this.currentNamespace = namespace;
             const setterGetterPairs = [];
             const allProps = this.collectAllProperties(widget);
+            const parentMethodNames = this.collectParentMethodNames(widget);
+            const widgetClassName = toPascalCase(widget.name);
             for (const prop of allProps) {
                 if (prop.setter && prop.getter) {
                     const setterName = toCamelCase(prop.setter);
-                    const getterName = toCamelCase(prop.getter);
+                    let getterName = toCamelCase(prop.getter);
+                    if (parentMethodNames.has(prop.getter)) {
+                        getterName = `${getterName}${widgetClassName}`;
+                    }
                     setterGetterPairs.push(`"${setterName}": "${getterName}"`);
                 }
             }
             if (setterGetterPairs.length > 0) {
-                const widgetName = toPascalCase(widget.name);
+                const widgetName = this.getWidgetExportName(widget);
                 widgetEntries.push(`\t${widgetName}: { ${setterGetterPairs.join(", ")} }`);
             }
         }
@@ -456,6 +517,32 @@ ${widgetPropsContent}
         }
         return `export const SETTER_GETTERS: Record<string, Record<string, string>> = {\n${widgetEntries.join(",\n")},\n};\n`;
     }
+    collectParentMethodNames(widget) {
+        const names = new Set();
+        const visited = new Set();
+        let parentRef = widget.parent;
+        while (parentRef && !visited.has(parentRef)) {
+            visited.add(parentRef);
+            const current = this.classMap.get(parentRef) ??
+                this.classMap.get(`${this.currentNamespace}.${parentRef}`) ??
+                this.classMap.get(`Gtk.${parentRef}`);
+            if (!current)
+                break;
+            for (const method of current.methods) {
+                names.add(method.name);
+            }
+            for (const ifaceName of current.implements) {
+                const iface = this.interfaceMap.get(ifaceName);
+                if (iface) {
+                    for (const method of iface.methods) {
+                        names.add(method.name);
+                    }
+                }
+            }
+            parentRef = current.parent;
+        }
+        return names;
+    }
     collectAllProperties(widget) {
         const props = [];
         const seen = new Set();
@@ -478,7 +565,15 @@ ${widgetPropsContent}
                     }
                 }
             }
-            current = current.parent ? this.classMap.get(current.parent) : undefined;
+            if (current.parent) {
+                current =
+                    this.classMap.get(current.parent) ??
+                        this.classMap.get(`${this.currentNamespace}.${current.parent}`) ??
+                        this.classMap.get(`Gtk.${current.parent}`);
+            }
+            else {
+                current = undefined;
+            }
         }
         return props;
     }
@@ -530,18 +625,22 @@ ${widgetPropsContent}
             return undefined;
         if (typeName.includes(".")) {
             const [ns, className] = typeName.split(".", 2);
-            if (ns === this.namespace && className && this.classMap.has(className)) {
-                return `Gtk.${toPascalCase(className)}`;
-            }
-            if (ns) {
-                this.usedExternalNamespaces.add(ns);
-                return typeName;
+            if (ns && className) {
+                const registered = this.typeRegistry.resolve(`${ns}.${className}`);
+                if (registered && (registered.kind === "class" || registered.kind === "interface")) {
+                    this.usedNamespaces.add(ns);
+                    return `${ns}.${registered.transformedName}`;
+                }
             }
             return undefined;
         }
-        const normalizedName = toPascalCase(typeName);
-        if (this.classMap.has(typeName) || this.classMap.has(normalizedName)) {
-            return `Gtk.${normalizedName}`;
+        const registered = this.typeRegistry.resolveInNamespace(typeName, this.currentNamespace);
+        if (registered && (registered.kind === "class" || registered.kind === "interface")) {
+            this.usedNamespaces.add(registered.namespace);
+            if (registered.namespace === this.currentNamespace) {
+                return `${this.currentNamespace}.${registered.transformedName}`;
+            }
+            return `${registered.namespace}.${registered.transformedName}`;
         }
         return undefined;
     }
@@ -549,12 +648,30 @@ ${widgetPropsContent}
         const primitives = new Set(["boolean", "number", "string", "void", "unknown", "null", "undefined"]);
         if (primitives.has(tsType))
             return tsType;
+        if (tsType.endsWith("[]")) {
+            const elementType = tsType.slice(0, -2);
+            if (primitives.has(elementType))
+                return tsType;
+            if (elementType.includes(".") || elementType.includes("<") || elementType.includes("("))
+                return tsType;
+            return `${this.currentNamespace}.${elementType}[]`;
+        }
         if (tsType.includes(".") || tsType.includes("<") || tsType.includes("("))
             return tsType;
-        return `Gtk.${tsType}`;
+        return `${this.currentNamespace}.${tsType}`;
+    }
+    toJsxPropertyType(tsType, namespace) {
+        const result = toJsxPropertyTypeBase(tsType, namespace);
+        if (result.includes(".") && !result.includes("<") && !result.includes("(")) {
+            const ns = result.split(".")[0];
+            if (ns) {
+                this.usedNamespaces.add(ns);
+            }
+        }
+        return result;
     }
     buildSignalHandlerType(signal, widgetName) {
-        const selfParam = `self: Gtk.${toPascalCase(widgetName)}`;
+        const selfParam = `self: ${this.currentNamespace}.${toPascalCase(widgetName)}`;
         const otherParams = signal.parameters
             ?.map((p) => {
             const ffiType = this.getSignalParamFfiType(p.type.name);
@@ -574,11 +691,13 @@ ${widgetPropsContent}
     }
     generateExports(widgets, containerMetadata) {
         const lines = [];
-        for (const widget of widgets) {
-            const widgetName = toPascalCase(widget.name);
-            const metadata = containerMetadata.get(widget.name);
+        for (const { widget, namespace } of widgets) {
+            this.currentNamespace = namespace;
+            const widgetName = this.getWidgetExportName(widget);
+            const metadataKey = `${namespace}.${widget.name}`;
+            const metadata = containerMetadata.get(metadataKey);
             if (!metadata)
-                throw new Error(`Missing container metadata for widget: ${widget.name}`);
+                throw new Error(`Missing container metadata for widget: ${metadataKey}`);
             const nonChildSlots = metadata.namedChildSlots.filter((slot) => slot.slotName !== "Child");
             const hasMeaningfulSlots = nonChildSlots.length > 0 ||
                 isListWidget(widget.name) ||
@@ -595,8 +714,8 @@ ${widgetPropsContent}
                     isDropDownWidget(widget.name) ||
                     isStackWidget(widget.name) ||
                     isPopoverMenuWidget(widget.name)) {
-                    const wrapperComponents = this.generateGenericWrapperComponents(widget.name, metadata);
-                    const exportMembers = this.getWrapperExportMembers(widget.name, metadata);
+                    const wrapperComponents = this.generateGenericWrapperComponents(widgetName, metadata);
+                    const exportMembers = this.getWrapperExportMembers(widgetName, metadata);
                     if (docComment) {
                         lines.push(`${wrapperComponents}\n${docComment}\nexport const ${widgetName} = {\n\t${exportMembers.join(",\n\t")},\n};`);
                     }
@@ -794,14 +913,16 @@ export const Menu = {
     }
     generateJsxNamespace(widgets, containerMetadata) {
         const elements = [];
-        for (const widget of widgets) {
+        for (const { widget, namespace } of widgets) {
             if (widget.name === "Widget")
                 continue;
-            const widgetName = toPascalCase(widget.name);
+            this.currentNamespace = namespace;
+            const widgetName = this.getWidgetExportName(widget);
             const propsName = `${widgetName}Props`;
-            const metadata = containerMetadata.get(widget.name);
+            const metadataKey = `${namespace}.${widget.name}`;
+            const metadata = containerMetadata.get(metadataKey);
             if (!metadata)
-                throw new Error(`Missing container metadata for widget: ${widget.name}`);
+                throw new Error(`Missing container metadata for widget: ${metadataKey}`);
             const nonChildSlots = metadata.namedChildSlots.filter((slot) => slot.slotName !== "Child");
             const hasMeaningfulSlots = nonChildSlots.length > 0 ||
                 isListWidget(widget.name) ||