AlertDialogResponse | "AlertDialogResponse" | A response button for an AdwAlertDialog. Example <AdwAlertDialog heading="Delete File?" body="This cannot be undone." defaultResponse="cancel" closeResponse="cancel" > <x.AlertDialogResponse id="cancel" label="Cancel" /> <x.AlertDialogResponse id="delete" label="Delete" appearance={Adw.ResponseAppearance.DESTRUCTIVE} /> </AdwAlertDialog> | packages/react/src/jsx.ts:1044 |
Animation | "Animation" | Declarative animation wrapper using Adw.TimedAnimation or Adw.SpringAnimation. Provides framer-motion-inspired API for animating child widgets. Example <x.Animation initial={{ opacity: 0, scale: 0.9 }} animate={{ opacity: 1, scale: 1 }} transition={{ mode: "spring", damping: 0.8, stiffness: 200 }} animateOnMount > <GtkButton label="Animated Button" /> </x.Animation> | packages/react/src/jsx.ts:1106 |
FixedChild | "FixedChild" | Element type for positioning children within a GtkFixed. Example <GtkFixed> <x.FixedChild x={20} y={30}> <GtkLabel label="Positioned at (20, 30)" /> </x.FixedChild> </GtkFixed> | packages/react/src/jsx.ts:835 |
GridChild | "GridChild" | Element type for positioning children within a GtkGrid. Example <GtkGrid> <x.GridChild column={0} row={0}> <GtkLabel label="Top Left" /> </x.GridChild> </GtkGrid> | packages/react/src/jsx.ts:821 |
MenuItem | "MenuItem" | A clickable menu item with action. Example <GtkMenuButton> <x.MenuItem id="open" label="Open" onActivate={handleOpen} /> </GtkMenuButton> | packages/react/src/jsx.ts:939 |
MenuSection | "MenuSection" | A section grouping related menu items. Example <GtkMenuButton> <x.MenuSection label="File"> <x.MenuItem id="open" label="Open" onActivate={handleOpen} /> </x.MenuSection> </GtkMenuButton> | packages/react/src/jsx.ts:953 |
MenuSubmenu | "MenuSubmenu" | A submenu containing nested items. Example <GtkMenuButton> <x.MenuSubmenu label="Export"> <x.MenuItem id="pdf" label="As PDF" onActivate={exportPdf} /> </x.MenuSubmenu> </GtkMenuButton> | packages/react/src/jsx.ts:967 |
NavigationPage | "NavigationPage" | Type-safe page component for AdwNavigationView or AdwNavigationSplitView. The for prop is required and determines valid id values: - AdwNavigationView: any string (page tags for navigation history) - AdwNavigationSplitView: "content" or "sidebar" (slot positions) Example `// In NavigationView - id can be any string <AdwNavigationView history={["home"]}> <x.NavigationPage for={AdwNavigationView} id="home" title="Home"> </x.NavigationPage> // In NavigationSplitView - id is narrowed to "content" | "sidebar" <x.NavigationPage for={AdwNavigationSplitView} id="sidebar" title="Sidebar"> </x.NavigationPage> <x.NavigationPage for={AdwNavigationSplitView} id="content" title="Content"> </x.NavigationPage> ` |
NotebookPage | "NotebookPage" | Element type for a page within a GtkNotebook (tabbed interface). Example <GtkNotebook> <x.NotebookPage label="Tab 1"> <GtkLabel label="Content 1" /> </x.NotebookPage> </GtkNotebook> | packages/react/src/jsx.ts:849 |
NotebookPageTab | "NotebookPageTab" | Element type for a custom widget as the page tab label. | packages/react/src/jsx.ts:854 |
OverlayChild | "OverlayChild" | Element type for overlay children positioned above the main content. Example <GtkOverlay> <GtkImage file="background.png" /> <x.OverlayChild> <GtkLabel label="Overlaid text" /> </x.OverlayChild> </GtkOverlay> | packages/react/src/jsx.ts:927 |
Shortcut | "Shortcut" | A keyboard shortcut definition. Must be a child of <GtkShortcutController>. Example <x.Shortcut trigger="<Control>s" onActivate={save} /> <x.Shortcut trigger={["F5", "<Control>r"]} onActivate={refresh} /> <x.Shortcut trigger="Escape" onActivate={cancel} disabled={!canCancel} /> | packages/react/src/jsx.ts:1087 |
StackPage | "StackPage" | Element type for pages within a GtkStack or AdwViewStack. Example <GtkStack page="page1"> <x.StackPage id="page1" title="First Page"> <GtkLabel label="Content 1" /> </x.StackPage> </GtkStack> | packages/react/src/jsx.ts:807 |
TextAnchor | "TextAnchor" | Declarative anchor for embedding widgets in text flow. The anchor is placed at the current position in the text. Example <GtkTextView> Click here: <x.TextAnchor> <GtkButton label="Click me" /> </x.TextAnchor> to continue. </GtkTextView> | packages/react/src/jsx.ts:999 |
TextPaintable | "TextPaintable" | Declarative inline paintable for embedding images/icons in text flow. The paintable is placed at the current position in the text. Example <GtkTextView> Click the icon <x.TextPaintable paintable={iconPaintable} /> to continue. </GtkTextView> | packages/react/src/jsx.ts:1013 |
TextTag | "TextTag" | Declarative text tag for styling text content. Wrap text content with a TextTag to apply styling. Tags can be nested. Example <GtkTextView> Normal <x.TextTag id="bold" weight={Pango.Weight.BOLD}> bold <x.TextTag id="red" foreground="red">and red</x.TextTag> </x.TextTag> text. </GtkTextView> | packages/react/src/jsx.ts:983 |
Toggle | "Toggle" | A toggle button for an AdwToggleGroup. Example <AdwToggleGroup> <x.Toggle id="list" iconName="view-list-symbolic" /> <x.Toggle id="grid" iconName="view-grid-symbolic" /> </AdwToggleGroup> | packages/react/src/jsx.ts:1026 |
ColumnViewColumn() | (props) => ReactElement | Component for defining columns in a ColumnView (table widget). Example <GtkColumnView> <x.ColumnViewColumn id="name" title="Name" expand renderCell={(item) => <GtkLabel label={item?.name ?? ""} />} /> </GtkColumnView> | packages/react/src/jsx.ts:871 |
ContainerSlot() | (props) => ReactElement | Type-safe container slot for placing children via parent widget methods. Unlike x.Slot (which uses property setters for single-child slots), x.ContainerSlot calls attachment methods that support multiple children (e.g., addPrefix(), packStart(), addTopBar()). The for prop provides TypeScript type narrowing for the id prop and is not used at runtime. Example <AdwToolbarView> <x.ContainerSlot for={AdwToolbarView} id="addTopBar"> <AdwHeaderBar /> </x.ContainerSlot> </AdwToolbarView> <GtkHeaderBar> <x.ContainerSlot for={GtkHeaderBar} id="packStart"> <GtkButton label="Back" /> </x.ContainerSlot> </GtkHeaderBar> <AdwActionRow title="Setting"> <x.ContainerSlot for={AdwActionRow} id="addPrefix"> <GtkCheckButton /> </x.ContainerSlot> </AdwActionRow> | packages/react/src/jsx.ts:906 |
Slot() | (props) => ReactElement | 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 <GtkHeaderBar> <x.Slot for={GtkHeaderBar} id="titleWidget"> <GtkLabel label="App Title" /> </x.Slot> </GtkHeaderBar> | packages/react/src/jsx.ts:787 |