@gtkx/react 0.12.0 → 0.13.0

package/dist/jsx.d.ts

@@ -1,32 +1,8 @@
-import type * as Gdk from "@gtkx/ffi/gdk";
 import type * as Gtk from "@gtkx/ffi/gtk";
 import type { ReactElement, ReactNode } from "react";
 import type { RenderItemFn } from "./nodes/internal/list-item-renderer.js";
 import type { TreeRenderItemFn } from "./nodes/internal/tree-list-item-renderer.js";
-/**
- * Props for EventController-based event handlers.
- *
- * These props attach EventControllers to widgets for handling
- * pointer motion, clicks, and keyboard events.
- */
-export interface EventControllerProps {
-    /** Called when the pointer enters the widget */
-    onEnter?: (x: number, y: number) => void;
-    /** Called when the pointer leaves the widget */
-    onLeave?: () => void;
-    /** Called when the pointer moves over the widget */
-    onMotion?: (x: number, y: number) => void;
-    /** Called when a mouse button is pressed */
-    onPressed?: (nPress: number, x: number, y: number) => void;
-    /** Called when a mouse button is released */
-    onReleased?: (nPress: number, x: number, y: number) => void;
-    /** Called when a key is pressed (for focusable widgets) */
-    onKeyPressed?: (keyval: number, keycode: number, state: Gdk.ModifierType) => boolean;
-    /** Called when a key is released */
-    onKeyReleased?: (keyval: number, keycode: number, state: Gdk.ModifierType) => void;
-    /** Called when the widget is scrolled */
-    onScroll?: (dx: number, dy: number) => boolean;
-}
+export type { EventControllerProps } from "./types.js";
 /**
  * Props for slot-based child positioning.
  *
@@ -84,7 +60,7 @@ export type StringListItemProps = {
  *
  * @see {@link GridChild} for usage
  */
-export type GridChildProps = SlotProps & {
+export type GridChildProps = Omit<SlotProps, "id"> & {
     /** Column index (0-based) */
     column?: number;
     /** Row index (0-based) */
@@ -99,7 +75,7 @@ export type GridChildProps = SlotProps & {
  *
  * @see {@link FixedChild} for usage
  */
-export type FixedChildProps = SlotProps & {
+export type FixedChildProps = Omit<SlotProps, "id"> & {
     /** X coordinate in pixels */
     x?: number;
     /** Y coordinate in pixels */
@@ -149,11 +125,13 @@ export type ColumnViewRootProps<C extends string = string> = {
     sortOrder?: Gtk.SortType;
     /** Callback when sort changes */
     onSortChange?: (column: C | null, order: Gtk.SortType) => void;
+    /** Estimated row height in pixels for proper virtualization before content loads */
+    estimatedRowHeight?: number;
 };
 /**
  * Props for notebook (tabbed) pages.
  */
-export type NotebookPageProps = SlotProps & {
+export type NotebookPageProps = Omit<SlotProps, "id"> & {
     /** Tab label text (optional when using Notebook.PageTab) */
     label?: string;
 };
@@ -164,18 +142,18 @@ export type NotebookPageTabProps = SlotProps;
 /**
  * Props for the root Stack component.
  */
-export type StackRootProps = SlotProps & {
-    /** Name of the currently visible child page */
-    visibleChildName?: string;
+export type StackRootProps = Omit<SlotProps, "id"> & {
+    /** ID of the currently visible page */
+    page?: string;
 };
 /**
  * Props for pages within a Stack or ViewStack.
  *
  * @see {@link StackPage} for usage
  */
-export type StackPageProps = SlotProps & {
-    /** Unique name for this page (used with visibleChildName) */
-    name?: string;
+export type StackPageProps = Omit<SlotProps, "id"> & {
+    /** Unique identifier for this page (used with page prop) */
+    id?: string;
     /** Display title shown in stack switchers */
     title?: string;
     /** Icon name from the icon theme */
@@ -227,165 +205,139 @@ export type MenuSubmenuProps = {
 /**
  * Props for children within an Overlay container.
  */
-export type OverlayChildProps = SlotProps & {
+export type OverlayChildProps = Omit<SlotProps, "id"> & {
     /** Whether to include this child in size measurement */
     measure?: boolean;
     /** Whether to clip this overlay child to the main child bounds */
     clipOverlay?: boolean;
 };
 /**
- * Type mapping widget names to their available slot IDs.
- */
-export type { WidgetSlotNames } from "./generated/jsx.js";
-/**
- * Type-safe slot component for placing children in named widget slots.
+ * Props for the ScaleMark virtual element.
  *
- * GTK widgets often have named slots for specific child positions (e.g., titleWidget,
- * startWidget). This component provides type-safe access to those slots.
- *
- * @typeParam W - The widget type containing the slot
- *
- * @param props.for - The widget component type (used for type inference)
- * @param props.id - The slot identifier (type-checked against available slots)
- * @param props.children - Content to place in the slot
+ * Used to declaratively add marks to a GtkScale slider.
  *
  * @example
  * ```tsx
- * <GtkHeaderBar>
- *   <Slot for={GtkHeaderBar} id="titleWidget">
- *     <GtkLabel label="App Title" />
- *   </Slot>
- * </GtkHeaderBar>
+ * <GtkScale>
+ *     <x.ScaleMark value={0} label="Min" />
+ *     <x.ScaleMark value={50} label="Mid" />
+ *     <x.ScaleMark value={100} label="Max" />
+ * </GtkScale>
  * ```
- *
- * @internal
  */
-export declare function Slot<W extends keyof import("./generated/jsx.js").WidgetSlotNames>(props: {
-    for: W;
-    id: import("./generated/jsx.js").WidgetSlotNames[W];
-    children?: ReactNode;
-}): ReactElement;
+export type ScaleMarkProps = {
+    /** The value at which to place the mark */
+    value: number;
+    /** Position of the mark (TOP or BOTTOM for horizontal, LEFT or RIGHT for vertical) */
+    position?: Gtk.PositionType;
+    /** Optional label text (supports Pango markup) */
+    label?: string | null;
+};
 /**
- * Element type for pages within a GtkStack or AdwViewStack.
+ * Props for the CalendarMark virtual element.
  *
- * @example
- * ```tsx
- * <GtkStack>
- *   <StackPage name="page1" title="First Page">
- *     <GtkLabel label="Content 1" />
- *   </StackPage>
- *   <StackPage name="page2" title="Second Page">
- *     <GtkLabel label="Content 2" />
- *   </StackPage>
- * </GtkStack>
- * ```
- */
-export declare const StackPage: "StackPage";
-/**
- * Element type for positioning children within a GtkGrid.
+ * Used to declaratively mark days on a GtkCalendar.
  *
  * @example
  * ```tsx
- * <GtkGrid>
- *   <GridChild column={0} row={0}>
- *     <GtkLabel label="Top Left" />
- *   </GridChild>
- *   <GridChild column={1} row={0} columnSpan={2}>
- *     <GtkLabel label="Spans 2 columns" />
- *   </GridChild>
- * </GtkGrid>
+ * <GtkCalendar>
+ *     <x.CalendarMark day={15} />
+ *     <x.CalendarMark day={20} />
+ *     <x.CalendarMark day={25} />
+ * </GtkCalendar>
  * ```
  */
-export declare const GridChild: "GridChild";
+export type CalendarMarkProps = {
+    /** The day of the month to mark (1-31) */
+    day: number;
+};
 /**
- * Element type for positioning children within a GtkFixed.
+ * Props for the LevelBarOffset virtual element.
+ *
+ * Used to declaratively add offset thresholds to a GtkLevelBar.
+ * Each offset defines a named threshold that triggers visual style changes.
  *
  * @example
  * ```tsx
- * <GtkFixed>
- *   <FixedChild x={20} y={30}>
- *     <GtkLabel label="Positioned at (20, 30)" />
- *   </FixedChild>
- *   <FixedChild x={100} y={50}>
- *     <GtkButton label="At (100, 50)" />
- *   </FixedChild>
- * </GtkFixed>
+ * <GtkLevelBar>
+ *     <x.LevelBarOffset id="low" value={0.25} />
+ *     <x.LevelBarOffset id="high" value={0.75} />
+ *     <x.LevelBarOffset id="full" value={1.0} />
+ * </GtkLevelBar>
  * ```
  */
-export declare const FixedChild: "FixedChild";
+export type LevelBarOffsetProps = {
+    /** Unique identifier for this offset (used for CSS styling) */
+    id: string;
+    /** The threshold value (0.0 to 1.0 for continuous mode, or integer for discrete) */
+    value: number;
+};
 /**
- * Element types for pages within a GtkNotebook (tabbed interface).
+ * Props for the Toggle virtual element.
  *
- * @example Simple text tabs
- * ```tsx
- * <GtkNotebook>
- *   <Notebook.Page label="Tab 1">
- *     <GtkLabel label="Content 1" />
- *   </Notebook.Page>
- *   <Notebook.Page label="Tab 2">
- *     <GtkLabel label="Content 2" />
- *   </Notebook.Page>
- * </GtkNotebook>
- * ```
+ * Used to declaratively add toggles to an AdwToggleGroup.
  *
- * @example Custom tab widgets
+ * @example
  * ```tsx
- * <GtkNotebook>
- *   <Notebook.Page>
- *     <Notebook.PageTab>
- *       <GtkBox orientation={Gtk.Orientation.HORIZONTAL}>
- *         <GtkImage iconName="folder-symbolic" />
- *         <GtkLabel label="Files" />
- *       </GtkBox>
- *     </Notebook.PageTab>
- *     <GtkLabel label="Content" />
- *   </Notebook.Page>
- * </GtkNotebook>
+ * <AdwToggleGroup>
+ *     <x.Toggle id="view-list" iconName="view-list-symbolic" />
+ *     <x.Toggle id="view-grid" iconName="view-grid-symbolic" />
+ *     <x.Toggle id="view-flow" label="Flow" />
+ * </AdwToggleGroup>
  * ```
  */
-export declare const Notebook: {
-    /** A page within the notebook */
-    Page: "Notebook.Page";
-    /** Custom widget for the page tab label */
-    PageTab: "Notebook.PageTab";
+export type ToggleProps = {
+    /** Optional identifier for accessing toggle by id instead of index */
+    id?: string | null;
+    /** Label text to display */
+    label?: string | null;
+    /** Icon name to display */
+    iconName?: string | null;
+    /** Tooltip text (supports Pango markup) */
+    tooltip?: string;
+    /** Whether the toggle is enabled */
+    enabled?: boolean;
+    /** Whether underline in label indicates mnemonic */
+    useUnderline?: boolean;
 };
 /**
- * Element type for items in a ListView or GridView.
- *
- * @example
- * ```tsx
- * <ListView renderItem={(item) => <GtkLabel label={item.name} />}>
- *   <ListItem id="1" value={{ name: "Item 1" }} />
- *   <ListItem id="2" value={{ name: "Item 2" }} />
- * </ListView>
- * ```
+ * Props for ExpanderRow child slots (Row and Action).
  */
-export declare const ListItem: "ListItem";
+export type ExpanderRowChildProps = {
+    /** Children to add to this slot */
+    children?: ReactNode;
+};
 /**
- * Component for defining columns in a ColumnView (table widget).
+ * Props for the NavigationPage virtual element.
  *
- * @typeParam T - The type of row data
+ * Used to declaratively define pages in an AdwNavigationView.
  *
  * @example
  * ```tsx
- * <GtkColumnView>
- *   <ColumnViewColumn
- *     id="name"
- *     title="Name"
- *     expand
- *     renderCell={(item) => <GtkLabel label={item?.name ?? ""} />}
- *   />
- *   <ColumnViewColumn
- *     id="status"
- *     title="Status"
- *     renderCell={(item) => <GtkLabel label={item?.status ?? ""} />}
- *   />
- * </GtkColumnView>
+ * <AdwNavigationView history={["home", "details"]}>
+ *   <x.NavigationPage id="home" title="Home">
+ *     <HomeContent />
+ *   </x.NavigationPage>
+ *   <x.NavigationPage id="details" title="Details">
+ *     <DetailsContent />
+ *   </x.NavigationPage>
+ * </AdwNavigationView>
  * ```
- *
- * @internal
  */
-export declare function ColumnViewColumn<T = unknown>(props: ColumnViewColumnProps<T>): ReactElement;
+export type NavigationPageProps = {
+    /** Unique identifier for this page (used in history array) */
+    id: string;
+    /** Title displayed in the header bar */
+    title?: string;
+    /** Whether the page can be popped via back button/gestures */
+    canPop?: boolean;
+    /** Page content */
+    children?: ReactNode;
+};
+/**
+ * Type mapping widget names to their available slot IDs.
+ */
+export type { WidgetSlotNames } from "./generated/jsx.js";
 /**
  * Props for the ListView component.
  *
@@ -394,28 +346,9 @@ export declare function ColumnViewColumn<T = unknown>(props: ColumnViewColumnPro
 export type ListViewProps<T = unknown> = Omit<import("./generated/jsx.js").GtkListViewProps, "renderItem"> & {
     /** Function to render each list item */
     renderItem: (item: T | null) => ReactNode;
+    /** Estimated item height in pixels for proper virtualization before content loads */
+    estimatedItemHeight?: number;
 };
-/**
- * Virtualized list component with custom item rendering.
- *
- * Efficiently renders large lists by only creating widgets for visible items.
- *
- * @typeParam T - The type of items in the list
- *
- * @example
- * ```tsx
- * const items = [{ id: "1", name: "Apple" }, { id: "2", name: "Banana" }];
- *
- * <ListView renderItem={(item) => <GtkLabel label={item?.name ?? ""} />}>
- *   {items.map((item) => (
- *     <ListItem key={item.id} id={item.id} value={item} />
- *   ))}
- * </ListView>
- * ```
- *
- * @internal
- */
-export declare function ListView<T = unknown>(props: ListViewProps<T>): ReactElement;
 /**
  * Props for the GridView component.
  *
@@ -424,26 +357,9 @@ export declare function ListView<T = unknown>(props: ListViewProps<T>): ReactEle
 export type GridViewProps<T = unknown> = Omit<import("./generated/jsx.js").GtkGridViewProps, "renderItem"> & {
     /** Function to render each grid item */
     renderItem: (item: T | null) => ReactNode;
+    /** Estimated item height in pixels for proper virtualization before content loads */
+    estimatedItemHeight?: number;
 };
-/**
- * Virtualized grid component with custom item rendering.
- *
- * Efficiently renders large grids by only creating widgets for visible items.
- *
- * @typeParam T - The type of items in the grid
- *
- * @example
- * ```tsx
- * <GridView renderItem={(item) => <GtkImage iconName={item?.icon ?? ""} />}>
- *   {icons.map((icon) => (
- *     <ListItem key={icon.id} id={icon.id} value={icon} />
- *   ))}
- * </GridView>
- * ```
- *
- * @internal
- */
-export declare function GridView<T = unknown>(props: GridViewProps<T>): ReactElement;
 /**
  * Props for the TreeListView component.
  *
@@ -452,6 +368,8 @@ export declare function GridView<T = unknown>(props: GridViewProps<T>): ReactEle
 export type TreeListViewProps<T = unknown> = Omit<import("./generated/jsx.js").GtkListViewProps, "renderItem"> & {
     /** Function to render each tree item */
     renderItem: TreeRenderItemFn<T>;
+    /** Estimated item height in pixels for proper virtualization before content loads */
+    estimatedItemHeight?: number;
     /** Whether to automatically expand new rows (default: false) */
     autoexpand?: boolean;
     /** Selection mode for the tree */
@@ -462,206 +380,446 @@ export type TreeListViewProps<T = unknown> = Omit<import("./generated/jsx.js").G
     onSelectionChanged?: (ids: string[]) => void;
 };
 /**
- * Tree list component with hierarchical data and expand/collapse support.
+ * GTKX-specific intrinsic elements and components.
  *
- * Renders a tree structure with expandable/collapsible rows using GTK's TreeListModel.
- * Items are defined declaratively by nesting TreeListItem components.
- *
- * @typeParam T - The type of items in the tree
+ * This namespace provides React components for GTK layout, lists, menus, and slots
+ * that are specific to GTKX (not direct GTK widget bindings).
  *
  * @example
  * ```tsx
- * interface Category { name: string; }
- * interface Setting { key: string; value: string; }
+ * import { x, GtkHeaderBar, GtkDropDown } from "@gtkx/react";
  *
- * <TreeListView<Category | Setting>
- *   renderItem={(item, row) => (
- *     <GtkLabel label={'name' in item ? item.name : item.key} />
- *   )}
- * >
- *   {categories.map(cat => (
- *     <TreeListItem key={cat.name} id={cat.name} value={cat}>
- *       {cat.settings?.map(setting => (
- *         <TreeListItem key={setting.key} id={setting.key} value={setting} />
- *       ))}
- *     </TreeListItem>
- *   ))}
- * </TreeListView>
- * ```
- *
- * @internal
- */
-export declare function TreeListView<T = unknown>(props: TreeListViewProps<T>): ReactElement;
-/**
- * Element type for items in a TreeListView.
- *
- * Nesting TreeListItem components defines the tree hierarchy.
- *
- * @example
- * ```tsx
- * <TreeListView renderItem={(item) => <GtkLabel label={item.name} />}>
- *   <TreeListItem id="parent" value={{ name: "Parent" }}>
- *     <TreeListItem id="child1" value={{ name: "Child 1" }} />
- *     <TreeListItem id="child2" value={{ name: "Child 2" }} />
- *   </TreeListItem>
- * </TreeListView>
- * ```
- */
-export declare const TreeListItem: "TreeListItem";
-/**
- * Element type for simple string-based list items.
- *
- * Use when list items only need string values without complex data.
- *
- * @example
- * ```tsx
- * <GtkDropDown>
- *   <SimpleListItem id="opt1" value="Option 1" />
- *   <SimpleListItem id="opt2" value="Option 2" />
- * </GtkDropDown>
- * ```
- */
-export declare const SimpleListItem: "SimpleListItem";
-/**
- * Slot positions for AdwActionRow, AdwEntryRow, and AdwExpanderRow widgets.
- *
- * @example
- * ```tsx
- * <AdwActionRow title="Setting">
- *   <ActionRow.Prefix>
- *     <GtkCheckButton />
- *   </ActionRow.Prefix>
- *   <ActionRow.Suffix>
- *     <GtkButton iconName="go-next-symbolic" />
- *   </ActionRow.Suffix>
- * </AdwActionRow>
- * ```
- */
-export declare const ActionRow: {
-    /** Place child as a prefix (left side) of the row */
-    Prefix: "ActionRow.Prefix";
-    /** Place child as a suffix (right side) of the row */
-    Suffix: "ActionRow.Suffix";
-};
-/**
- * Slot positions for HeaderBar and ActionBar widgets.
- *
- * @example
- * ```tsx
  * <GtkHeaderBar>
- *   <Pack.Start>
- *     <GtkButton label="Back" />
- *   </Pack.Start>
- *   <Pack.End>
- *     <GtkMenuButton />
- *   </Pack.End>
+ *   <x.Slot for={GtkHeaderBar} id="titleWidget">
+ *     <GtkLabel label="App Title" />
+ *   </x.Slot>
  * </GtkHeaderBar>
- * ```
- */
-export declare const Pack: {
-    /** Place child at the start (left in LTR) of the bar */
-    Start: "Pack.Start";
-    /** Place child at the end (right in LTR) of the bar */
-    End: "Pack.End";
-};
-/**
- * Slot positions for AdwToolbarView.
- *
- * @example
- * ```tsx
- * <AdwToolbarView>
- *   <Toolbar.Top>
- *     <AdwHeaderBar />
- *   </Toolbar.Top>
- *   <GtkLabel label="Content" />
- *   <Toolbar.Bottom>
- *     <GtkActionBar />
- *   </Toolbar.Bottom>
- * </AdwToolbarView>
- * ```
- */
-export declare const Toolbar: {
-    /** Place toolbar at the top */
-    Top: "Toolbar.Top";
-    /** Place toolbar at the bottom */
-    Bottom: "Toolbar.Bottom";
-};
-/**
- * Element type for GtkOverlay main child container.
- */
-export declare const Overlay: "Overlay";
-/**
- * Element type for overlay children positioned above the main content.
- *
- * @example
- * ```tsx
- * <GtkOverlay>
- *   <Overlay>
- *     <GtkImage file="background.png" />
- *   </Overlay>
- *   <OverlayChild>
- *     <GtkLabel label="Overlaid text" cssClasses={["title-1"]} />
- *   </OverlayChild>
- * </GtkOverlay>
- * ```
- */
-export declare const OverlayChild: "OverlayChild";
-/**
- * Element types for declarative menu construction.
- *
- * Build menus with items, sections, and submenus declaratively.
  *
- * @example
- * ```tsx
- * <GtkMenuButton>
- *   <Menu.Section>
- *     <Menu.Item id="open" label="Open" onActivate={handleOpen} accels="<Control>o" />
- *     <Menu.Item id="save" label="Save" onActivate={handleSave} accels="<Control>s" />
- *   </Menu.Section>
- *   <Menu.Submenu label="Export">
- *     <Menu.Item id="pdf" label="As PDF" onActivate={exportPdf} />
- *     <Menu.Item id="png" label="As PNG" onActivate={exportPng} />
- *   </Menu.Submenu>
- * </GtkMenuButton>
+ * <GtkDropDown>
+ *   <x.SimpleListItem id="opt1" value="Option 1" />
+ *   <x.SimpleListItem id="opt2" value="Option 2" />
+ * </GtkDropDown>
  * ```
  */
-export declare const Menu: {
-    /** A clickable menu item with action */
-    Item: "Menu.Item";
-    /** A section grouping related menu items */
-    Section: "Menu.Section";
-    /** A submenu containing nested items */
-    Submenu: "Menu.Submenu";
+export declare const x: {
+    /**
+     * Type-safe slot component for placing children in named widget slots.
+     *
+     * GTK widgets often have named slots for specific child positions (e.g., titleWidget,
+     * startWidget). This component provides type-safe access to those slots.
+     *
+     * @example
+     * ```tsx
+     * <GtkHeaderBar>
+     *   <x.Slot for={GtkHeaderBar} id="titleWidget">
+     *     <GtkLabel label="App Title" />
+     *   </x.Slot>
+     * </GtkHeaderBar>
+     * ```
+     */
+    Slot<W extends keyof import("./generated/jsx.js").WidgetSlotNames>(props: {
+        for: W;
+        id: import("./generated/jsx.js").WidgetSlotNames[W];
+        children?: ReactNode;
+    }): ReactElement;
+    /**
+     * Element type for pages within a GtkStack or AdwViewStack.
+     *
+     * @example
+     * ```tsx
+     * <GtkStack page="page1">
+     *   <x.StackPage id="page1" title="First Page">
+     *     <GtkLabel label="Content 1" />
+     *   </x.StackPage>
+     * </GtkStack>
+     * ```
+     */
+    StackPage: "StackPage";
+    /**
+     * Element type for positioning children within a GtkGrid.
+     *
+     * @example
+     * ```tsx
+     * <GtkGrid>
+     *   <x.GridChild column={0} row={0}>
+     *     <GtkLabel label="Top Left" />
+     *   </x.GridChild>
+     * </GtkGrid>
+     * ```
+     */
+    GridChild: "GridChild";
+    /**
+     * Element type for positioning children within a GtkFixed.
+     *
+     * @example
+     * ```tsx
+     * <GtkFixed>
+     *   <x.FixedChild x={20} y={30}>
+     *     <GtkLabel label="Positioned at (20, 30)" />
+     *   </x.FixedChild>
+     * </GtkFixed>
+     * ```
+     */
+    FixedChild: "FixedChild";
+    /**
+     * Element type for a page within a GtkNotebook (tabbed interface).
+     *
+     * @example
+     * ```tsx
+     * <GtkNotebook>
+     *   <x.NotebookPage label="Tab 1">
+     *     <GtkLabel label="Content 1" />
+     *   </x.NotebookPage>
+     * </GtkNotebook>
+     * ```
+     */
+    NotebookPage: "NotebookPage";
+    /**
+     * Element type for a custom widget as the page tab label.
+     */
+    NotebookPageTab: "NotebookPageTab";
+    /**
+     * Element type for items in a ListView or GridView.
+     *
+     * @example
+     * ```tsx
+     * <x.ListView renderItem={(item) => <GtkLabel label={item.name} />}>
+     *   <x.ListItem id="1" value={{ name: "Item 1" }} />
+     * </x.ListView>
+     * ```
+     */
+    ListItem: "ListItem";
+    /**
+     * Element type for items in a TreeListView.
+     *
+     * @example
+     * ```tsx
+     * <x.TreeListView renderItem={(item) => <GtkLabel label={item.name} />}>
+     *   <x.TreeListItem id="parent" value={{ name: "Parent" }}>
+     *     <x.TreeListItem id="child" value={{ name: "Child" }} />
+     *   </x.TreeListItem>
+     * </x.TreeListView>
+     * ```
+     */
+    TreeListItem: "TreeListItem";
+    /**
+     * Element type for simple string-based list items.
+     *
+     * @example
+     * ```tsx
+     * <GtkDropDown>
+     *   <x.SimpleListItem id="opt1" value="Option 1" />
+     * </GtkDropDown>
+     * ```
+     */
+    SimpleListItem: "SimpleListItem";
+    /**
+     * Component for defining columns in a ColumnView (table widget).
+     *
+     * @example
+     * ```tsx
+     * <GtkColumnView>
+     *   <x.ColumnViewColumn
+     *     id="name"
+     *     title="Name"
+     *     expand
+     *     renderCell={(item) => <GtkLabel label={item?.name ?? ""} />}
+     *   />
+     * </GtkColumnView>
+     * ```
+     */
+    ColumnViewColumn<T = unknown>(props: ColumnViewColumnProps<T>): ReactElement;
+    /**
+     * Virtualized list component with custom item rendering.
+     *
+     * @example
+     * ```tsx
+     * <x.ListView renderItem={(item) => <GtkLabel label={item?.name ?? ""} />}>
+     *   <x.ListItem id="1" value={{ name: "Apple" }} />
+     * </x.ListView>
+     * ```
+     */
+    ListView<T = unknown>(props: ListViewProps<T>): ReactElement;
+    /**
+     * Virtualized grid component with custom item rendering.
+     *
+     * @example
+     * ```tsx
+     * <x.GridView renderItem={(item) => <GtkImage iconName={item?.icon ?? ""} />}>
+     *   <x.ListItem id="1" value={{ icon: "folder" }} />
+     * </x.GridView>
+     * ```
+     */
+    GridView<T = unknown>(props: GridViewProps<T>): ReactElement;
+    /**
+     * Tree list component with hierarchical data and expand/collapse support.
+     *
+     * @example
+     * ```tsx
+     * <x.TreeListView renderItem={(item, row) => <GtkLabel label={item.name} />}>
+     *   <x.TreeListItem id="root" value={{ name: "Root" }}>
+     *     <x.TreeListItem id="child" value={{ name: "Child" }} />
+     *   </x.TreeListItem>
+     * </x.TreeListView>
+     * ```
+     */
+    TreeListView<T = unknown>(props: TreeListViewProps<T>): ReactElement;
+    /**
+     * Place child as a prefix (left side) of AdwActionRow, AdwEntryRow, or AdwExpanderRow.
+     *
+     * @example
+     * ```tsx
+     * <AdwActionRow title="Setting">
+     *   <x.ActionRowPrefix>
+     *     <GtkCheckButton />
+     *   </x.ActionRowPrefix>
+     * </AdwActionRow>
+     * ```
+     */
+    ActionRowPrefix: "ActionRowPrefix";
+    /**
+     * Place child as a suffix (right side) of AdwActionRow, AdwEntryRow, or AdwExpanderRow.
+     *
+     * @example
+     * ```tsx
+     * <AdwActionRow title="Setting">
+     *   <x.ActionRowSuffix>
+     *     <GtkButton iconName="go-next-symbolic" />
+     *   </x.ActionRowSuffix>
+     * </AdwActionRow>
+     * ```
+     */
+    ActionRowSuffix: "ActionRowSuffix";
+    /**
+     * Place child at the start (left in LTR) of HeaderBar or ActionBar.
+     *
+     * @example
+     * ```tsx
+     * <GtkHeaderBar>
+     *   <x.PackStart>
+     *     <GtkButton label="Back" />
+     *   </x.PackStart>
+     * </GtkHeaderBar>
+     * ```
+     */
+    PackStart: "PackStart";
+    /**
+     * Place child at the end (right in LTR) of HeaderBar or ActionBar.
+     *
+     * @example
+     * ```tsx
+     * <GtkHeaderBar>
+     *   <x.PackEnd>
+     *     <GtkMenuButton />
+     *   </x.PackEnd>
+     * </GtkHeaderBar>
+     * ```
+     */
+    PackEnd: "PackEnd";
+    /**
+     * Place toolbar at the top of AdwToolbarView.
+     *
+     * @example
+     * ```tsx
+     * <AdwToolbarView>
+     *   <x.ToolbarTop>
+     *     <AdwHeaderBar />
+     *   </x.ToolbarTop>
+     * </AdwToolbarView>
+     * ```
+     */
+    ToolbarTop: "ToolbarTop";
+    /**
+     * Place toolbar at the bottom of AdwToolbarView.
+     *
+     * @example
+     * ```tsx
+     * <AdwToolbarView>
+     *   <x.ToolbarBottom>
+     *     <GtkActionBar />
+     *   </x.ToolbarBottom>
+     * </AdwToolbarView>
+     * ```
+     */
+    ToolbarBottom: "ToolbarBottom";
+    /**
+     * Element type for overlay children positioned above the main content.
+     *
+     * @example
+     * ```tsx
+     * <GtkOverlay>
+     *   <GtkImage file="background.png" />
+     *   <x.OverlayChild>
+     *     <GtkLabel label="Overlaid text" />
+     *   </x.OverlayChild>
+     * </GtkOverlay>
+     * ```
+     */
+    OverlayChild: "OverlayChild";
+    /**
+     * A clickable menu item with action.
+     *
+     * @example
+     * ```tsx
+     * <GtkMenuButton>
+     *   <x.MenuItem id="open" label="Open" onActivate={handleOpen} />
+     * </GtkMenuButton>
+     * ```
+     */
+    MenuItem: "MenuItem";
+    /**
+     * A section grouping related menu items.
+     *
+     * @example
+     * ```tsx
+     * <GtkMenuButton>
+     *   <x.MenuSection label="File">
+     *     <x.MenuItem id="open" label="Open" onActivate={handleOpen} />
+     *   </x.MenuSection>
+     * </GtkMenuButton>
+     * ```
+     */
+    MenuSection: "MenuSection";
+    /**
+     * A submenu containing nested items.
+     *
+     * @example
+     * ```tsx
+     * <GtkMenuButton>
+     *   <x.MenuSubmenu label="Export">
+     *     <x.MenuItem id="pdf" label="As PDF" onActivate={exportPdf} />
+     *   </x.MenuSubmenu>
+     * </GtkMenuButton>
+     * ```
+     */
+    MenuSubmenu: "MenuSubmenu";
+    /**
+     * A mark to display on a GtkScale slider.
+     *
+     * @example
+     * ```tsx
+     * <GtkScale>
+     *   <x.ScaleMark value={0} label="Min" />
+     *   <x.ScaleMark value={50} />
+     *   <x.ScaleMark value={100} label="Max" />
+     * </GtkScale>
+     * ```
+     */
+    ScaleMark: "ScaleMark";
+    /**
+     * A day mark on a GtkCalendar.
+     *
+     * @example
+     * ```tsx
+     * <GtkCalendar>
+     *   <x.CalendarMark day={15} />
+     *   <x.CalendarMark day={20} />
+     *   <x.CalendarMark day={25} />
+     * </GtkCalendar>
+     * ```
+     */
+    CalendarMark: "CalendarMark";
+    /**
+     * An offset threshold for a GtkLevelBar.
+     *
+     * @example
+     * ```tsx
+     * <GtkLevelBar>
+     *   <x.LevelBarOffset id="low" value={0.25} />
+     *   <x.LevelBarOffset id="high" value={0.75} />
+     *   <x.LevelBarOffset id="full" value={1.0} />
+     * </GtkLevelBar>
+     * ```
+     */
+    LevelBarOffset: "LevelBarOffset";
+    /**
+     * A toggle button for an AdwToggleGroup.
+     *
+     * @example
+     * ```tsx
+     * <AdwToggleGroup>
+     *   <x.Toggle id="list" iconName="view-list-symbolic" />
+     *   <x.Toggle id="grid" iconName="view-grid-symbolic" />
+     * </AdwToggleGroup>
+     * ```
+     */
+    Toggle: "Toggle";
+    /**
+     * Nested rows container for AdwExpanderRow.
+     *
+     * @example
+     * ```tsx
+     * <AdwExpanderRow title="Settings">
+     *   <ExpanderRow.Row>
+     *     <AdwActionRow title="Option 1" />
+     *     <AdwActionRow title="Option 2" />
+     *   </ExpanderRow.Row>
+     * </AdwExpanderRow>
+     * ```
+     */
+    ExpanderRowRow: "ExpanderRowRow";
+    /**
+     * Action widget container for AdwExpanderRow header.
+     *
+     * @example
+     * ```tsx
+     * <AdwExpanderRow title="Group">
+     *   <ExpanderRow.Action>
+     *     <GtkButton iconName="emblem-system-symbolic" />
+     *   </ExpanderRow.Action>
+     * </AdwExpanderRow>
+     * ```
+     */
+    ExpanderRowAction: "ExpanderRowAction";
+    /**
+     * A page within an AdwNavigationView.
+     *
+     * @example
+     * ```tsx
+     * <AdwNavigationView history={["home"]}>
+     *   <x.NavigationPage id="home" title="Home">
+     *     <GtkLabel label="Welcome!" />
+     *   </x.NavigationPage>
+     *   <x.NavigationPage id="settings" title="Settings">
+     *     <GtkLabel label="Settings page" />
+     *   </x.NavigationPage>
+     * </AdwNavigationView>
+     * ```
+     */
+    NavigationPage: "NavigationPage";
 };
 declare global {
     namespace React {
         namespace JSX {
             interface IntrinsicElements {
-                StackPage: StackPageProps;
-                GridChild: GridChildProps;
+                ActionRowPrefix: SlotProps;
+                ActionRowSuffix: SlotProps;
+                CalendarMark: CalendarMarkProps;
+                ColumnViewColumn: ColumnViewColumnProps<any>;
+                ExpanderRowAction: ExpanderRowChildProps;
+                ExpanderRowRow: ExpanderRowChildProps;
                 FixedChild: FixedChildProps;
-                "Notebook.Page": NotebookPageProps;
-                "Notebook.PageTab": NotebookPageTabProps;
+                GridChild: GridChildProps;
+                LevelBarOffset: LevelBarOffsetProps;
                 ListItem: ListItemProps;
-                TreeListItem: TreeListItemProps<any>;
-                ColumnViewColumn: ColumnViewColumnProps<any>;
-                SimpleListItem: StringListItemProps;
-                "ActionRow.Prefix": SlotProps;
-                "ActionRow.Suffix": SlotProps;
-                "Pack.Start": SlotProps;
-                "Pack.End": SlotProps;
-                "Toolbar.Top": SlotProps;
-                "Toolbar.Bottom": SlotProps;
+                MenuItem: MenuItemProps;
+                MenuSection: MenuSectionProps;
+                MenuSubmenu: MenuSubmenuProps;
+                NotebookPage: NotebookPageProps;
+                NotebookPageTab: NotebookPageTabProps;
                 OverlayChild: OverlayChildProps;
-                "Menu.Item": MenuItemProps;
-                "Menu.Section": MenuSectionProps;
-                "Menu.Submenu": MenuSubmenuProps;
+                PackEnd: SlotProps;
+                PackStart: SlotProps;
+                ScaleMark: ScaleMarkProps;
+                SimpleListItem: StringListItemProps;
+                StackPage: StackPageProps;
+                Toggle: ToggleProps;
+                ToolbarBottom: SlotProps;
+                ToolbarTop: SlotProps;
+                TreeListItem: TreeListItemProps<any>;
+                NavigationPage: NavigationPageProps;
             }
         }
     }
 }
 export * from "./generated/jsx.js";
-declare module "./generated/jsx.js" {
-    interface WidgetProps extends EventControllerProps {
-    }
-}